forked from AkkomaGang/admin-fe
Add select for managing tags
This commit is contained in:
Angelina Filippova
parent
37b2fb3199
commit
ec739099b6
3 changed files with 119 additions and 61 deletions
|
|
@ -283,7 +283,8 @@ export default {
|
|||
confirmEnablingTagPolicy: 'Are you sure you want to add TagPolicy to the list of enabled MRF policies?',
|
||||
enableTagPolicySuccessMessage: 'MRF TagPolicy was enabled',
|
||||
createCustomTag: 'Create custom tag and add it to user',
|
||||
moderateTags: 'Moderate Tags'
|
||||
customTags: 'Custom Tags',
|
||||
defaultTags: 'Default Tags'
|
||||
},
|
||||
statuses: {
|
||||
statuses: 'Statuses',
|
||||
|
|
|
|||
|
|
@ -67,8 +67,8 @@
|
|||
@click.native="handleConfirmationResend(user)">
|
||||
{{ $t('users.resendConfirmation') }}
|
||||
</el-dropdown-item>
|
||||
<el-collapse accordion class="moderate-tags">
|
||||
<el-collapse-item :title="$t('users.moderateTags')" name="open-tags">
|
||||
<!-- <el-collapse accordion class="moderate-tags">
|
||||
<el-collapse-item name="open-tags">
|
||||
<el-dropdown-item
|
||||
v-if="tagPolicyEnabled"
|
||||
:divided="showAdminAction(user)"
|
||||
|
|
@ -112,21 +112,35 @@
|
|||
{{ $t('users.disableAnySubscription') }}
|
||||
<i v-if="user.tags.includes('mrf_tag:disable-any-subscription')" class="el-icon-check"/>
|
||||
</el-dropdown-item>
|
||||
<el-dropdown-item divided class="custom-tags-titile">
|
||||
{{ $t('users.customTags') }}
|
||||
</el-dropdown-item>
|
||||
<el-dropdown-item
|
||||
v-if="user.local && tagPolicyEnabled"
|
||||
icon="el-icon-plus"
|
||||
@click.native="$emit('open-custom-tag-dialog', user)">
|
||||
{{ $t('users.createCustomTag') }}
|
||||
<el-popover
|
||||
:title="`${$t('users.createCustomTag')} ${user.nickname}`"
|
||||
placement="left"
|
||||
width="400"
|
||||
trigger="click">
|
||||
<el-form :inline="true" :model="customTagForm" >
|
||||
<el-form-item prop="name">
|
||||
<el-input v-model="customTagForm.name" autofocus class="custom-tag-input"/>
|
||||
</el-form-item>
|
||||
<el-form-item class="close-custom-tag-button">
|
||||
<el-button @click="closeCustomTagDialog">{{ $t('users.cancel') }}</el-button>
|
||||
</el-form-item>
|
||||
<el-form-item class="add-custom-tag-button">
|
||||
<el-button type="primary" @click="addCustomTag">{{ $t('users.create') }}</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<span slot="reference">{{ $t('users.createCustomTag') }}</span>
|
||||
<el-button slot="reference">Hover to activate</el-button>
|
||||
</el-popover>
|
||||
</el-dropdown-item>
|
||||
</el-collapse-item>
|
||||
</el-collapse>
|
||||
<el-dropdown-item
|
||||
v-if="!tagPolicyEnabled"
|
||||
divided
|
||||
class="no-hover"
|
||||
@click.native="enableTagPolicy">
|
||||
{{ $t('users.enableTagPolicy') }}
|
||||
</el-dropdown-item>
|
||||
</el-collapse> -->
|
||||
<el-dropdown-item
|
||||
v-if="user.local"
|
||||
divided
|
||||
|
|
@ -143,6 +157,37 @@
|
|||
@click.native="disableMfa(user.nickname)">
|
||||
{{ $t('users.disableMfa') }}
|
||||
</el-dropdown-item>
|
||||
<el-select
|
||||
v-if="tagPolicyEnabled"
|
||||
v-model="selectedTags"
|
||||
multiple
|
||||
filterable
|
||||
allow-create
|
||||
placeholder="Select Tags"
|
||||
size="small"
|
||||
class="select-tags">
|
||||
<el-option-group :label="$t('users.defaultTags')">
|
||||
<el-option
|
||||
v-for="(value, name) in defaultTags"
|
||||
:key="name"
|
||||
:label="value"
|
||||
:value="name"/>
|
||||
</el-option-group>
|
||||
<el-option-group :label="$t('users.customTags')">
|
||||
<el-option
|
||||
v-for="item in customTags"
|
||||
:key="item"
|
||||
:value="item"
|
||||
class="capitalize"/>
|
||||
</el-option-group>
|
||||
</el-select>
|
||||
<el-dropdown-item
|
||||
v-if="!tagPolicyEnabled"
|
||||
divided
|
||||
class="no-hover"
|
||||
@click.native="enableTagPolicy">
|
||||
{{ $t('users.enableTagPolicy') }}
|
||||
</el-dropdown-item>
|
||||
</el-dropdown-menu>
|
||||
</el-dropdown>
|
||||
</template>
|
||||
|
|
@ -168,7 +213,7 @@ export default {
|
|||
},
|
||||
data() {
|
||||
return {
|
||||
tagsOpen: []
|
||||
selectedTags: []
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
|
|
@ -185,14 +230,48 @@ export default {
|
|||
})
|
||||
}
|
||||
},
|
||||
customTags() {
|
||||
return this.$store.state.users.tags.filter(tag => !Object.keys(this.mapTags).includes(tag))
|
||||
},
|
||||
defaultTags() {
|
||||
return Object.keys(this.mapTags)
|
||||
.filter(tag => this.$store.state.users.tags.includes(tag))
|
||||
.reduce((acc, el) => {
|
||||
acc[el] = this.mapTags[el]
|
||||
return acc
|
||||
}, {})
|
||||
},
|
||||
isDesktop() {
|
||||
return this.$store.state.app.device === 'desktop'
|
||||
},
|
||||
mapTags() {
|
||||
return {
|
||||
'mrf_tag:media-force-nsfw': 'NSFW',
|
||||
'mrf_tag:media-strip': 'Strip Media',
|
||||
'mrf_tag:force-unlisted': 'Unlisted',
|
||||
'mrf_tag:sandbox': 'Sandbox',
|
||||
'mrf_tag:verified': 'Verified',
|
||||
'mrf_tag:disable-remote-subscription': 'Disable remote subscription',
|
||||
'mrf_tag:disable-any-subscription': 'Disable any subscription'
|
||||
}
|
||||
},
|
||||
tagPolicyEnabled() {
|
||||
return this.$store.state.users.mrfPolicies.includes('Pleroma.Web.ActivityPub.MRF.TagPolicy')
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
addCustomTag() {
|
||||
this.$store.dispatch('AddTag', {
|
||||
users: [this.customTagUser],
|
||||
tag: this.customTagForm.name,
|
||||
_userId: this.customTagUser.id,
|
||||
_statusId: this.statusId
|
||||
})
|
||||
this.createCustomTagDialogOpen = false
|
||||
},
|
||||
closeCustomTagDialog() {
|
||||
this.createCustomTagDialogOpen = false
|
||||
},
|
||||
disableMfa(nickname) {
|
||||
this.$store.dispatch('DisableMfa', nickname)
|
||||
},
|
||||
|
|
@ -295,6 +374,17 @@ export default {
|
|||
</script>
|
||||
|
||||
<style rel='stylesheet/scss' lang='scss'>
|
||||
.capitalize {
|
||||
text-transform: capitalize;
|
||||
}
|
||||
.el-form--inline {
|
||||
.el-form-item.add-custom-tag-button {
|
||||
margin-right: 0;
|
||||
}
|
||||
.el-form-item.close-custom-tag-button {
|
||||
margin-right: 8px;
|
||||
}
|
||||
}
|
||||
.el-dropdown-menu--small .el-dropdown-menu__item.el-dropdown-menu__item--divided.actor-type-dropdown:before {
|
||||
margin: 0 0;
|
||||
height: 0;
|
||||
|
|
@ -326,8 +416,14 @@ export default {
|
|||
}
|
||||
}
|
||||
.actor-type-select .el-input.is-focus .el-input__inner {
|
||||
border-color: transparent;
|
||||
}
|
||||
border-color: transparent;
|
||||
}
|
||||
.custom-tags-titile {
|
||||
padding-left: 20px;
|
||||
font-size: 12px;
|
||||
color: #909399;
|
||||
line-height: 30px;
|
||||
}
|
||||
.moderate-user-button {
|
||||
text-align: left;
|
||||
width: 350px;
|
||||
|
|
@ -359,6 +455,10 @@ export default {
|
|||
margin-top: 0;
|
||||
}
|
||||
}
|
||||
.select-tags {
|
||||
padding: 2px 15px 0 15px;
|
||||
width: 100%;
|
||||
}
|
||||
@media only screen and (max-width:480px) {
|
||||
.moderate-user-button {
|
||||
width: 100%
|
||||
|
|
|
|||
|
|
@ -25,8 +25,7 @@
|
|||
</el-button>
|
||||
<multiple-users-menu
|
||||
:selected-users="selectedUsers"
|
||||
@apply-action="clearSelection"
|
||||
@open-custom-tag-dialog="openCustomTagDialog"/>
|
||||
@apply-action="clearSelection"/>
|
||||
</div>
|
||||
<new-account-dialog
|
||||
:dialog-form-visible="createAccountDialogOpen"
|
||||
|
|
@ -103,8 +102,7 @@
|
|||
v-if="propertyExists(scope.row, 'nickname')"
|
||||
:user="scope.row"
|
||||
:page="'users'"
|
||||
@open-reset-token-dialog="openResetPasswordDialog"
|
||||
@open-custom-tag-dialog="openCustomTagDialog"/>
|
||||
@open-reset-token-dialog="openResetPasswordDialog"/>
|
||||
<el-button v-else type="text" disabled>
|
||||
{{ $t('users.moderation') }}
|
||||
<i v-if="isDesktop" class="el-icon-arrow-down el-icon--right"/>
|
||||
|
|
@ -115,24 +113,6 @@
|
|||
<reset-password-dialog
|
||||
:reset-password-dialog-open="resetPasswordDialogOpen"
|
||||
@close-reset-token-dialog="closeResetPasswordDialog"/>
|
||||
<el-dialog
|
||||
:visible.sync="createCustomTagDialogOpen"
|
||||
:show-close="false"
|
||||
:title="`${$t('users.createCustomTag')} ${customTagUser.nickname}`"
|
||||
@open="resetForm">
|
||||
<el-form ref="customTagForm" :model="customTagForm" :label-width="isDesktop ? '120px' : '85px'">
|
||||
<el-form-item :label="$t('users.name')" prop="name">
|
||||
<el-input v-model="customTagForm.name" name="name" autofocus/>
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('users.label')" prop="label">
|
||||
<el-input v-model="customTagForm.label" name="label"/>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<span slot="footer">
|
||||
<el-button @click="closeCustomTagDialog">{{ $t('users.cancel') }}</el-button>
|
||||
<el-button type="primary" @click="addCustomTag">{{ $t('users.create') }}</el-button>
|
||||
</span>
|
||||
</el-dialog>
|
||||
<div v-if="!loading" class="pagination">
|
||||
<el-pagination
|
||||
:total="usersCount"
|
||||
|
|
@ -176,13 +156,7 @@ export default {
|
|||
search: '',
|
||||
selectedUsers: [],
|
||||
createAccountDialogOpen: false,
|
||||
resetPasswordDialogOpen: false,
|
||||
createCustomTagDialogOpen: false,
|
||||
customTagForm: {
|
||||
name: '',
|
||||
label: ''
|
||||
},
|
||||
customTagUser: {}
|
||||
resetPasswordDialogOpen: false
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
|
|
@ -232,21 +206,9 @@ export default {
|
|||
this.$store.dispatch('ClearUsersState')
|
||||
},
|
||||
methods: {
|
||||
addCustomTag() {
|
||||
this.$store.dispatch('AddTag', {
|
||||
users: [this.customTagUser],
|
||||
tag: this.customTagForm.name,
|
||||
_userId: this.customTagUser.id,
|
||||
_statusId: this.statusId
|
||||
})
|
||||
this.createCustomTagDialogOpen = false
|
||||
},
|
||||
clearSelection() {
|
||||
this.$refs.usersTable.clearSelection()
|
||||
},
|
||||
closeCustomTagDialog() {
|
||||
this.createCustomTagDialogOpen = false
|
||||
},
|
||||
closeResetPasswordDialog() {
|
||||
this.resetPasswordDialogOpen = false
|
||||
this.$store.dispatch('RemovePasswordToken')
|
||||
|
|
@ -274,10 +236,6 @@ export default {
|
|||
handleSelectionChange(value) {
|
||||
this.$data.selectedUsers = value
|
||||
},
|
||||
openCustomTagDialog(user) {
|
||||
this.customTagUser = user
|
||||
this.createCustomTagDialogOpen = true
|
||||
},
|
||||
openResetPasswordDialog() {
|
||||
this.resetPasswordDialogOpen = true
|
||||
},
|
||||
|
|
@ -287,7 +245,6 @@ export default {
|
|||
regReason(reason) {
|
||||
return reason && reason.length > 0
|
||||
},
|
||||
resetForm() {},
|
||||
showDeactivatedButton(id) {
|
||||
return this.$store.state.user.id !== id
|
||||
}
|
||||
|
|
|
|||
Loading…
Reference in a new issue