encrypt/gancio
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

major UI modification

Browse Source
This commit is contained in:
les
2020-07-28 12:24:39 +02:00
parent 2758541df0
commit 411560c218
27 changed files with 770 additions and 572 deletions
Download Patch File Download Diff File Expand all files Collapse all files

35
components/admin/Announcement.vue
View File

@@ -1,11 +1,24 @@
<template lang='pug'>
v-container
v-subheader(v-html="$t('admin.announcement_description')")
v-text-field(v-model='announcement.title' :placeholder='$t("common.title")')
Editor.mt-2(v-model='announcement.announcement' border no-save style='max-height: 400px;')
v-btn.mt-2(@click='save' type='success' plain) {{$t(`common.${editing?'save':'send'}`)}}
v-dialog(v-model='dialog' width='800')
v-card
v-card-title {{$t('common.new_user')}}
v-card-text
v-form
v-text-field(v-model='announcement.title' :placeholder='$t("common.title")')
Editor.mt-2(v-model='announcement.announcement' border no-save style='max-height: 400px;')
v-btn.mt-2(@click='save' type='success' plain) {{$t(`common.${editing?'save':'send'}`)}}
v-data-table(:items='announcements')
v-data-table(
:headers='headers'
:items='announcements')
template(v-slot:item.actions='{ item }')
v-btn(text small @click.stop='toggle(item)'
:color='item.visible?"warning":"success"') {{item.visible?$t('common.deactivate'):$t('common.activate')}}
v-btn(text small @click='edit(item)') {{$t('common.edit')}}
v-btn(text small @click='remove(item)'
color='error') {{$t('common.delete')}}
//- el-table-column(:label="$t('common.actions')")
//- template(slot-scope='data')
@@ -20,7 +33,6 @@
</template>
<script>
import { Message, MessageBox } from 'element-ui'
import { mapActions } from 'vuex'
import cloneDeep from 'lodash/cloneDeep'
import Editor from '../Editor'
@@ -30,8 +42,13 @@ export default {
components: { Editor, Announcement },
data () {
return {
dialog: false,
editing: false,
announcements: [],
headers: [
{ value: 'title', text: 'Title' },
{ value: 'actions', text: 'Actions', align: 'right' }
],
announcement: { title: '', announcement: '' }
}
},
@@ -44,7 +61,7 @@ export default {
this.announcement.title = announcement.title
this.announcement.announcement = announcement.announcement
this.announcement.id = announcement.id
this.editing = true
this.dialog = true
},
async toggle (announcement) {
try {
@@ -55,7 +72,7 @@ export default {
} catch (e) {}
},
remove (announcement) {
MessageBox.confirm(this.$t('admin.delete_announcement_confirm'),
this.$root.$confirm(this.$t('admin.delete_announcement_confirm'),
this.$t('common.confirm'), {
confirmButtonText: this.$t('common.ok'),
cancelButtonText: this.$t('common.cancel'),
@@ -63,9 +80,7 @@ export default {
})
.then(() => this.$axios.delete(`/announcements/${announcement.id}`))
.then(() => {
Message({
showClose: true,
type: 'success',
this.$root.$message({
message: this.$t('admin.announcement_remove_ok')
})
this.announcements = this.announcements.filter(a => a.id !== announcement.id)

79
components/admin/Federation.vue
View File

@@ -4,8 +4,7 @@
:label="$t('admin.enable_federation')"
persistent-hint
inset
:hint="$t('admin.enable_federation_help')"
)
:hint="$t('admin.enable_federation_help')")
template(v-if='enable_federation')
@@ -39,39 +38,29 @@
@blur='save("instance_place", instance_place)'
)
//- div.mt-4 {{$t('admin.add_trusted_instance')}}
v-text-field.mt-4(v-model='instance_url'
:full-width='false'
persistent-hint
:hint="$t('admin.add_trusted_instance')"
:label="$t('common.url')"
append-outer-icon="mdi-send"
@click:append-outer='createTrustedInstance'
)
v-dialog(v-model='dialogAddInstance' width="500px")
v-card
v-card-title {{$t('admin.add_trusted_instance')}}
v-card-text
v-text-field.mt-4(v-model='instance_url'
:full-width='false'
persistent-hint
:hint="$t('admin.add_trusted_instance')"
:label="$t('common.url')"
append-outer-icon="mdi-send"
@click:append-outer='createTrustedInstance')
v-btn(@click='dialogAddInstance = true') Add instance
v-data-table.mt-4(
:headers='headers'
:items='settings.trusted_instances'
)
//- el-table-column(:label="$t('common.name')")
//- template(slot-scope='data')
//- span {{data.row.name}}
//- el-table-column(:label="$t('common.url')")
//- template(slot-scope='data')
//- span {{data.row.url}}
//- el-table-column(:label="$t('common.place')")
//- template(slot-scope='data')
//- span {{data.row.label}}
//- el-table-column(:label="$t('common.actions')")
//- template(slot-scope='data')
//- el-button(size='mini'
//- type='danger'
//- @click='deleteInstance(data.row)') {{$t('admin.delete_user')}}
:items='settings.trusted_instances')
template(v-slot:item.actions="{item}")
v-btn(icon @click='deleteInstance(item)' color='error')
v-icon mdi-delete-forever
</template>
<script>
import { mapActions, mapState } from 'vuex'
import { Message, MessageBox } from 'element-ui'
import axios from 'axios'
export default {
@@ -81,7 +70,14 @@ export default {
instance_url: '',
instance_name: $store.state.settings.instance_name,
instance_place: $store.state.settings.instance_place,
url2host: $options.filters.url2host
url2host: $options.filters.url2host,
dialogAddInstance: false,
headers: [
{ value: 'name', text: 'Name' },
{ value: 'url', text: 'URL' },
{ value: 'label', text: 'Place' },
{ value: 'actions', text: 'Actions', align: 'right' }
]
}
},
computed: {
@@ -103,9 +99,6 @@ export default {
set (value) { this.setSetting({ key: 'enable_trusted_instances', value }) }
}
},
mounted () {
console.error(this.$options.filters)
},
methods: {
...mapActions(['setSetting']),
async createTrustedInstance () {
@@ -121,25 +114,19 @@ export default {
})
this.instance_url = ''
} catch (e) {
Message({
showClose: true,
this.$root.$message({
type: 'error',
message: e
})
}
},
deleteInstance (instance) {
MessageBox.confirm(this.$t('admin.delete_trusted_instance_confirm'),
this.$t('common.confirm'), {
confirmButtonText: this.$t('common.ok'),
cancelButtonText: this.$t('common.cancel'),
type: 'error'
}
).then(() => {
this.setSetting({
key: 'trusted_instances',
value: this.settings.trusted_instances.filter(i => i.url !== instance.url)
})
async deleteInstance (instance) {
const ret = await this.$root.$confirm(this.$t('admin.delete_trusted_instance_confirm'),
this.$t('common.confirm'), { type: 'error' })
if (!ret) { return }
this.setSetting({
key: 'trusted_instances',
value: this.settings.trusted_instances.filter(i => i.url !== instance.url)
})
},
save (key, value) {

131
components/admin/Moderation.vue
View File

@@ -1,70 +1,66 @@
<template lang='pug'>
div
el-row
el-col(:span='12')
el-divider {{$t('common.instances')}}
el-input(v-model='instancesFilter' :placeholder="$t('admin.filter_instances')")
client-only
el-pagination(v-if='instances.length>perPage' :page-size='perPage' :currentPage.sync='instancePage' :total='instances.length')
el-table(:data='paginatedInstances' small @row-click='instanceSelected')
el-table-column(label='Domain' width='180')
template(slot-scope='data')
span(slot='reference') {{data.row.domain}}
el-table-column(label='Name' width='100')
template(slot-scope='data')
span(slot='reference') {{data.row.name}}
el-table-column(:label="$t('common.users')" width='70')
template(slot-scope='data')
span(slot='reference') {{data.row.users}}
el-table-column(:label="$t('common.actions')" width='120')
template(slot-scope='data')
el-button-group
el-button(size='mini'
:type='data.row.blocked?"danger":"warning"'
@click='toggleBlock(data.row)') {{data.row.blocked?$t('admin.unblock'):$t('admin.block')}}
v-container
v-row
v-col(:span='12')
//- el-divider {{$t('common.instances')}}
v-text-field(v-model='instancesFilter' :placeholder="$t('admin.filter_instances')")
v-data-table(:data='paginatedInstances' small @row-click='instanceSelected')
//- el-table-column(label='Domain' width='180')
//- template(slot-scope='data')
//- span(slot='reference') {{data.row.domain}}
//- el-table-column(label='Name' width='100')
//- template(slot-scope='data')
//- span(slot='reference') {{data.row.name}}
//- el-table-column(:label="$t('common.users')" width='70')
//- template(slot-scope='data')
//- span(slot='reference') {{data.row.users}}
//- el-table-column(:label="$t('common.actions')" width='120')
//- template(slot-scope='data')
//- el-button-group
//- el-button(size='mini'
//- :type='data.row.blocked?"danger":"warning"'
//- @click='toggleBlock(data.row)') {{data.row.blocked?$t('admin.unblock'):$t('admin.block')}}
el-col.float-right(:span='11' align='right')
el-divider {{$t('common.users')}}
el-input(v-model='usersFilter' :placeholder="$t('admin.filter_users')")
client-only
el-pagination(v-if='users.length>perPage' :page-size='perPage' :currentPage.sync='userPage' :total='users.length')
el-table(:data='paginatedSelectedUsers' small)
el-table-column(:label="$t('common.user')" width='150')
template(slot-scope='data')
span(slot='reference')
a(:href='data.row.object.id' target='_blank') {{data.row.object.name}}
small ({{data.row.object.preferredUsername}})
el-table-column(:label="$t('common.resources')" width='90')
template(slot-scope='data')
span {{data.row.resources.length}}
el-table-column(:label="$t('common.actions')" width='200')
template(slot-scope='data')
el-button-group
el-button(size='mini'
:type='data.row.blocked?"danger":"warning"'
@click='toggleUserBlock(data.row)') {{data.row.blocked?$t('admin.unblock'):$t('admin.block')}}
v-col.float-right(:span='11' align='right')
//- el-divider {{$t('common.users')}}
v-text-field(v-model='usersFilter' :placeholder="$t('admin.filter_users')")
v-data-table(:data='paginatedSelectedUsers' small)
//- el-table-column(:label="$t('common.user')" width='150')
//- template(slot-scope='data')
//- span(slot='reference')
//- a(:href='data.row.object.id' target='_blank') {{data.row.object.name}}
//- small ({{data.row.object.preferredUsername}})
//- el-table-column(:label="$t('common.resources')" width='90')
//- template(slot-scope='data')
//- span {{data.row.resources.length}}
//- el-table-column(:label="$t('common.actions')" width='200')
//- template(slot-scope='data')
//- el-button-group
//- el-button(size='mini'
//- :type='data.row.blocked?"danger":"warning"'
//- @click='toggleUserBlock(data.row)') {{data.row.blocked?$t('admin.unblock'):$t('admin.block')}}
div
el-divider {{$t('common.resources')}}
el-table(:data='paginatedResources' small :row-style='resourceStyle')
el-table-column(:label="$t('common.event')")
template(slot-scope='data')
span {{data.row.event}}
el-table-column(:label="$t('common.resources')")
template(slot-scope='data')
span(:class='{disabled: data.row.hidden}' v-html='data.row.data.content')
el-table-column(:label="$t('common.user')" width='200')
template(slot-scope='data')
span(:class='{disabled: data.row.hidden}' v-html='data.row.data.actor')
el-table-column(:label="$t('common.actions')" width="150")
template(slot-scope='data')
el-dropdown
el-button(type="primary" icon="el-icon-arrow-down" size='mini') {{$t('common.moderation')}}
el-dropdown-menu(slot='dropdown')
el-dropdown-item(v-if='!data.row.hidden' icon='el-icon-remove' @click.native='hideResource(data.row, true)') {{$t('admin.hide_resource')}}
el-dropdown-item(v-else icon='el-icon-success' @click.native='hideResource(data.row, false)') {{$t('admin.show_resource')}}
el-dropdown-item(icon='el-icon-delete' @click.native='deleteResource(data.row)') {{$t('admin.delete_resource')}}
el-dropdown-item(icon='el-icon-lock' @click.native='toggleUserBlock(data.row.ap_user)') {{$t('admin.block_user')}}
//- el-divider {{$t('common.resources')}}
v-table(:data='paginatedResources' small :row-style='resourceStyle')
//- el-table-column(:label="$t('common.event')")
//- template(slot-scope='data')
//- span {{data.row.event}}
//- el-table-column(:label="$t('common.resources')")
//- template(slot-scope='data')
//- span(:class='{disabled: data.row.hidden}' v-html='data.row.data.content')
//- el-table-column(:label="$t('common.user')" width='200')
//- template(slot-scope='data')
//- span(:class='{disabled: data.row.hidden}' v-html='data.row.data.actor')
//- el-table-column(:label="$t('common.actions')" width="150")
//- template(slot-scope='data')
//- el-dropdown
//- el-button(type="primary" icon="el-icon-arrow-down" size='mini') {{$t('common.moderation')}}
//- el-dropdown-menu(slot='dropdown')
//- el-dropdown-item(v-if='!data.row.hidden' icon='el-icon-remove' @click.native='hideResource(data.row, true)') {{$t('admin.hide_resource')}}
//- el-dropdown-item(v-else icon='el-icon-success' @click.native='hideResource(data.row, false)') {{$t('admin.show_resource')}}
//- el-dropdown-item(icon='el-icon-delete' @click.native='deleteResource(data.row)') {{$t('admin.delete_resource')}}
//- el-dropdown-item(icon='el-icon-lock' @click.native='toggleUserBlock(data.row.ap_user)') {{$t('admin.block_user')}}
</template>
<script>
import { mapState, mapActions } from 'vuex'
@@ -135,7 +131,7 @@ export default {
async toggleUserBlock (ap_user) {
try {
if (!ap_user.blocked) {
await MessageBox.confirm(this.$t('admin.user_block_confirm'), {
await this.$root.$confirm(this.$t('admin.user_block_confirm'), {
confirmButtonText: this.$t('common.ok'),
cancelButtonText: this.$t('common.cancel'),
type: 'error'
@@ -146,7 +142,7 @@ export default {
} catch (e) { }
},
deleteResource (resource) {
MessageBox.confirm(this.$t('admin.delete_resource_confirm'),
this.$root.$confirm(this.$t('admin.delete_resource_confirm'),
this.$t('common.confirm'), {
confirmButtonText: this.$t('common.ok'),
cancelButtonText: this.$t('common.cancel'),
@@ -164,8 +160,3 @@ export default {
}
}
</script>
<style lang="less">
.instance_thumb {
height: 20px;
}
</style>

45
components/admin/Places.vue
View File

@@ -1,22 +1,26 @@
<template lang='pug'>
v-container
v-subheader(v-html="$t('admin.place_description')")
v-form.mb-2
//- el-form-item(:label="$t('common.name')")
//- el-input.mr-1(:placeholder='$t("common.name")' v-model='place.name')
v-text-field(
:label="$t('common.name')"
v-model='place.name'
:placeholder='$t("common.name")')
v-text-field(
:label="$t('common.address')"
v-model='place.address'
:placeholder='$t("common.address")')
v-dialog
v-form.mb-2
//- el-form-item(:label="$t('common.name')")
//- el-input.mr-1(:placeholder='$t("common.name")' v-model='place.name')
v-text-field(
:label="$t('common.name')"
v-model='place.name'
:placeholder='$t("common.name")')
v-btn(@click='savePlace') {{$t('common.save')}}
v-text-field(
:label="$t('common.address')"
v-model='place.address'
:placeholder='$t("common.address")')
v-btn(@click='savePlace') {{$t('common.save')}}
v-data-table(
@click:row='selectPlace'
:headers='headers'
:items='places')
</template>
<script>
@@ -24,17 +28,20 @@ import { mapState } from 'vuex'
export default {
data () {
return {
place: { name: '', address: '', id: null }
place: { name: '', address: '', id: null },
headers: [
{ value: 'name', text: 'Name' }
]
}
},
computed: mapState(['places']),
methods: {
placeSelected (items) {
if (items.length === 0) {
this.place.name = this.place.address = ''
return
}
const item = items[0]
selectPlace (item) {
// if (items.length === 0) {
// this.place.name = this.place.address = ''
// return
// }
// const item = items[0]
this.place.name = item.name
this.place.address = item.address
this.place.id = item.id

28
components/admin/Settings.vue
View File

@@ -20,8 +20,6 @@
:label="$t('admin.instance_locale')"
:hint="$t('admin.instance_locale_description')"
persistent-hint
item-text='locale'
item-value='locale'
:items='locales'
)
@@ -38,20 +36,6 @@
persistent-hint
@blur='save("description", description)')
v-file-input.mt-5(ref='upload'
:label="$t('admin.favicon')"
:action='`${settings.baseurl}/api/settings/logo`'
:on-success="forceLogoReload"
name='logo'
:show-file-list="true"
accept='image/png'
:limit='1'
:multiple='false')
//- el-button-group
el-button(size='small' type='primary' plain) Select file
el-button(size='small' type='success' plain @click='resetLogo') Reset
v-img(:src='`${settings.baseurl}/favicon.ico?${logoKey}`')
v-switch.mt-5(v-model='allow_registration'
inset
:label="$t('admin.allow_registration_description')")
@@ -82,8 +66,7 @@ export default {
return {
title: $store.state.settings.title,
description: $store.state.settings.description,
locales,
logoKey: 0
locales: Object.keys(locales).map(locale => ({ value: locale, text: locales[locale] }))
}
},
computed: {
@@ -123,15 +106,6 @@ export default {
},
methods: {
...mapActions(['setSetting']),
forceLogoReload () {
this.$refs.upload.clearFiles()
this.logoKey++
},
resetLogo (e) {
this.setSetting({ key: 'favicon', value: null })
.then(this.forceLogoReload)
e.stopPropagation()
},
save (key, value) {
if (this.settings[key] !== value) {
this.setSetting({ key, value })

85
components/admin/Theme.vue Normal file
View File

@@ -0,0 +1,85 @@
<template lang="pug">
v-container
//- LOGO
v-file-input.mt-5(ref='upload'
:label="$t('admin.favicon')"
@change='uploadLogo'
accept='image/*')
template(slot='append-outer')
v-btn(small @click='resetLogo') Reset
v-img(:src='`${settings.baseurl}/favicon.ico?${logoKey}`'
max-width="100px" max-height="80px" contain)
//- el-button-group
el-button(size='small' type='primary' plain) Select file
el-button(size='small' type='success' plain @click='resetLogo') Reset
v-switch.mt-5(v-model='is_dark'
inset
:label="$t('admin.is_dark')")
v-color-picker(
mode='hexa'
:label="$t('common.primary_color')"
v-model='primary_color')
</template>
<script>
import { mapActions, mapState } from 'vuex'
export default {
name: 'Theme',
data () {
return {
logoKey: 0
}
},
computed: {
...mapState(['settings']),
is_dark: {
get () { return this.settings['theme.is_dark'] },
set (value) {
this.$vuetify.theme.dark = value
this.setSetting({ key: 'theme.is_dark', value })
}
},
primary_color: {
get () { return this.settings['theme.primary'] },
set (value) {
// this.$vuetify.theme.themes.dark.primary = value.hex
this.$vuetify.theme.themes.light.primary = value.hex
this.setSetting({ key: 'theme.primary', value: value.hex })
}
}
},
methods: {
...mapActions(['setSetting']),
forceLogoReload () {
this.$refs.upload.reset()
this.logoKey++
},
resetLogo (e) {
this.setSetting({ key: 'logo', value: null })
.then(this.forceLogoReload)
e.stopPropagation()
},
async uploadLogo (file) {
const formData = new FormData()
formData.append('logo', file)
try {
await this.$axios.$post('/settings/logo', formData)
this.$root.$emit('message', {
message: 'Logo updated'
})
this.forceLogoReload()
} catch (e) {
}
},
save (key, value) {
if (this.settings[key] !== value) {
this.setSetting({ key, value })
}
}
}
}
</script>

65
components/admin/Users.vue
View File

@@ -1,59 +1,47 @@
<template lang="pug">
v-container
v-card
v-card-title {{$t('common.users')}}
v-spacer
v-text-field(v-model='search'
append-icon='mdi-magnify'
label='Search',
single-line hide-details)
//- ADD NEW USER
v-dialog(v-model='newUser' width='500')
template(v-slot:activator="{ on }")
v-btn(text v-on='on') <v-icon>mdi-plus</v-icon> {{$t('common.new_user')}}
v-dialog(v-model='newUserDialog' width='500')
v-card
v-card-title <v-icon name='plus'/> {{$t('common.new_user')}}
v-card-title {{$t('common.new_user')}}
v-card-text
v-form(inline @submit.native.prevent='create_user')
v-form
v-text-field(v-model='new_user.email'
:label="$t('common.email')")
:label="$t('common.email')"
:rules="[validators.required('Email')]")
v-switch(v-model='new_user.is_admin' :label="$t('common.admin')" inset)
v-alert(type='info' :closable='false') {{$t('admin.user_add_help')}}
v-card-actions
v-btn(@click='create_user' color='success' plain) {{$t('common.send')}}
v-btn(@click='createUser' color='primary') {{$t('common.send')}}
v-btn(@click='newUserDialog=false' color='danger' plain) {{$t('common.close')}}
//- USERS LIST
v-data-table(
:headers='headers'
:items='users')
:items='users'
:search='search')
template(v-slot:item.actions='{item}')
v-btn(text small @click='toggle(item)'
:color='item.is_active?"warning":"success"') {{item.is_active?$t('common.deactivate'):$t('common.activate')}}
v-btn(text small @click='toggleAdmin(item)'
:color='item.is_admin?"warning":"error"') {{item.is_admin?$t('common.remove_admin'):$t('common.admin')}}
v-btn(text small @click='deleteUser(item)'
:color='danger') {{$t('admin.delete_user')}}
color='error') {{$t('admin.delete_user')}}
//- el-table-column(label='Email' width='220')
//- template(slot-scope='data')
//- el-popover(trigger='hover' :content='data.row.description' width='400')
//- span(slot='reference') {{data.row.email}}
//- el-table-column(:label="$t('common.actions')")
//- template(slot-scope='data')
//- div(v-if='data.row.id!==$auth.user.id')
//- el-button-group
//- el-button(size='mini'
//- :type='data.row.is_active?"warning":"success"'
//- @click='toggle(data.row)') {{data.row.is_active?$t('common.deactivate'):$t('common.activate')}}
//- el-button(size='mini'
//- :type='data.row.is_admin?"danger":"warning"'
//- @click='toggleAdmin(data.row)') {{data.row.is_admin?$t('admin.remove_admin'):$t('common.admin')}}
//- el-button(size='mini'
//- type='danger'
//- @click='delete_user(data.row)') {{$t('admin.delete_user')}}
//- div(v-else)
//- span {{$t('common.me')}}
//- v-pagination(:page-size='perPage' :currentPage.sync='userPage' v-if='perPage<users_.length' :total='users_.length')
v-btn(text color='primary' small @click='newUserDialog = true') <v-icon>mdi-plus-user</v-icon> {{$t('common.new_user')}}
</template>
<script>
import { Message, MessageBox } from 'element-ui'
import { mapState } from 'vuex'
import { validators } from '../../plugins/helpers'
export default {
name: 'Users',
@@ -62,12 +50,16 @@ export default {
},
data () {
return {
validators,
newUserDialog: false,
new_user: {
email: '',
is_admin: false
},
search: '',
headers: [
{ value: 'email', text: 'Email' },
{ value: 'is_active', text: 'Active' },
{ value: 'actions', text: 'Actions', align: 'right' }
]
}
@@ -75,7 +67,7 @@ export default {
computed: mapState(['settings']),
methods: {
deleteUser (user) {
MessageBox.confirm(this.$t('admin.delete_user_confirm'),
this.$root.$confirm(this.$t('admin.delete_user_confirm'),
this.$t('common.confirm'), {
confirmButtonText: this.$t('common.ok'),
cancelButtonText: this.$t('common.cancel'),
@@ -83,11 +75,7 @@ export default {
})
.then(() => this.$axios.delete(`/user/${user.id}`))
.then(() => {
Message({
showClose: true,
type: 'success',
message: this.$t('admin.user_remove_ok')
})
this.$root.$message({ message: this.$t('admin.user_remove_ok')})
this.users_ = this.users_.filter(u => u.id !== user.id)
})
},
@@ -103,11 +91,12 @@ export default {
console.error(e)
}
},
async create_user () {
async createUser () {
try {
this.loading = true
const user = await this.$axios.$post('/user', this.new_user)
this.new_user = { email: '', is_admin: false }
Message({
showClose: true,
type: 'success',