Add and remove tags for multiple users

This commit is contained in:
Angelina Filippova 2019-05-05 02:30:11 +03:00
parent 2634e163da
commit 1b9f209f2c

View file

@ -29,30 +29,59 @@
@click.native="deleteMultipleUsers"> @click.native="deleteMultipleUsers">
{{ $t('users.deleteAccount') }} {{ $t('users.deleteAccount') }}
</el-dropdown-item> </el-dropdown-item>
<el-dropdown-item <el-dropdown-item divided class="no-hover">
divided <div class="tag-container">
@click.native="toggleTagForMultipleUsers('force_nsfw')"> <span class="tag-text">{{ $t('users.forceNsfw') }}</span>
{{ $t('users.forceNsfw') }} <el-button-group class="tag-button-group">
<el-button size="mini" @click.native="addTagForMultipleUsers('force_nsfw')">apply</el-button>
<el-button size="mini" @click.native="removeTagFromMultipleUsers('force_nsfw')">remove</el-button>
</el-button-group>
</div>
</el-dropdown-item> </el-dropdown-item>
<el-dropdown-item <el-dropdown-item class="no-hover">
@click.native="toggleTagForMultipleUsers('strip_media')"> <div class="tag-container">
{{ $t('users.stripMedia') }} <span class="tag-text">{{ $t('users.stripMedia') }}</span>
<el-button-group class="tag-button-group">
<el-button size="mini" @click.native="addTagForMultipleUsers('strip_media')">apply</el-button>
<el-button size="mini" @click.native="removeTagFromMultipleUsers('strip_media')">remove</el-button>
</el-button-group>
</div>
</el-dropdown-item> </el-dropdown-item>
<el-dropdown-item <el-dropdown-item class="no-hover">
@click.native="toggleTagForMultipleUsers('force_unlisted')"> <div class="tag-container">
{{ $t('users.forceUnlisted') }} <span class="tag-text">{{ $t('users.forceUnlisted') }}</span>
<el-button-group class="tag-button-group">
<el-button size="mini" @click.native="addTagForMultipleUsers('force_unlisted')">apply</el-button>
<el-button size="mini" @click.native="removeTagFromMultipleUsers('force_unlisted')">remove</el-button>
</el-button-group>
</div>
</el-dropdown-item> </el-dropdown-item>
<el-dropdown-item <el-dropdown-item class="no-hover">
@click.native="toggleTagForMultipleUsers('sandbox')"> <div class="tag-container">
{{ $t('users.sandbox') }} <span class="tag-text">{{ $t('users.sandbox') }}</span>
<el-button-group class="tag-button-group">
<el-button size="mini" @click.native="addTagForMultipleUsers('sandbox')">apply</el-button>
<el-button size="mini" @click.native="removeTagFromMultipleUsers('sandbox')">remove</el-button>
</el-button-group>
</div>
</el-dropdown-item> </el-dropdown-item>
<el-dropdown-item <el-dropdown-item class="no-hover">
@click.native="toggleTagForMultipleUsers('disable_remote_subscription')"> <div class="tag-container">
{{ $t('users.disableRemoteSubscription') }} <span class="tag-text">{{ $t('users.disableRemoteSubscription') }}</span>
<el-button-group class="tag-button-group">
<el-button size="mini" @click.native="addTagForMultipleUsers('disable_remote_subscription')">apply</el-button>
<el-button size="mini" @click.native="removeTagFromMultipleUsers('disable_remote_subscription')">remove</el-button>
</el-button-group>
</div>
</el-dropdown-item> </el-dropdown-item>
<el-dropdown-item <el-dropdown-item class="no-hover">
@click.native="toggleTagForMultipleUsers('disable_any_subscription')"> <div class="tag-container">
{{ $t('users.disableAnySubscription') }} <span class="tag-text">{{ $t('users.disableAnySubscription') }}</span>
<el-button-group class="tag-button-group">
<el-button size="mini" @click.native="addTagForMultipleUsers('disable_any_subscription')">apply</el-button>
<el-button size="mini" @click.native="removeTagFromMultipleUsers('disable_any_subscription')">remove</el-button>
</el-button-group>
</div>
</el-dropdown-item> </el-dropdown-item>
</el-dropdown-menu> </el-dropdown-menu>
</template> </template>
@ -113,16 +142,28 @@ export default {
mapSelectedUsers mapSelectedUsers
) )
}, },
toggleTagForMultipleUsers(tag) { addTagForMultipleUsers(tag) {
const mapSelectedUsers = () => this.selectedUsers const mapSelectedUsers = () => this.selectedUsers
.filter(user => tag === 'disable_remote_subscription' || tag === 'disable_any_subscription' .filter(user => tag === 'disable_remote_subscription' || tag === 'disable_any_subscription'
? user.local : user ? user.local && !user.tags.includes(tag)
: !user.tags.includes(tag)
).map(user => this.$store.dispatch('ToggleTag', { user, tag })) ).map(user => this.$store.dispatch('ToggleTag', { user, tag }))
this.confirmMessage( this.confirmMessage(
'Are you sure you want to apply tag to all selected users?', 'Are you sure you want to apply tag to all selected users?',
mapSelectedUsers mapSelectedUsers
) )
}, },
removeTagFromMultipleUsers(tag) {
const mapSelectedUsers = () => this.selectedUsers
.filter(user => tag === 'disable_remote_subscription' || tag === 'disable_any_subscription'
? user.local && user.tags.includes(tag)
: user.tags.includes(tag)
).map(user => this.$store.dispatch('ToggleTag', { user, tag }))
this.confirmMessage(
'Are you sure you want to remove tag from all selected users?',
mapSelectedUsers
)
},
confirmMessage(message, mapSelectedUsers) { confirmMessage(message, mapSelectedUsers) {
this.$confirm(message, { this.$confirm(message, {
confirmButtonText: 'OK', confirmButtonText: 'OK',
@ -144,3 +185,19 @@ export default {
} }
} }
</script> </script>
<style rel='stylesheet/scss' lang='scss' scoped>
.tag-container {
display: flex;
justify-content: space-between;
align-items: center;
}
.tag-text {
padding-right: 20px;
}
.no-hover:hover {
color: #606266;
background-color: white;
cursor: auto;
}
</style>