Add ability to choose multiple users on different pages

This commit is contained in:
Angelina Filippova 2019-05-05 22:52:20 +03:00
parent 1b9f209f2c
commit 4b5d69c198
2 changed files with 21 additions and 3 deletions

View file

@ -171,6 +171,7 @@ export default {
type: 'warning' type: 'warning'
}).then(() => { }).then(() => {
mapSelectedUsers() mapSelectedUsers()
this.$emit('apply-action')
this.$message({ this.$message({
type: 'success', type: 'success',
message: 'Completed' message: 'Completed'

View file

@ -7,15 +7,29 @@
</div> </div>
<el-dropdown> <el-dropdown>
<el-button v-if="isDesktop" icon="el-icon-edit" class="actions-button"/> <el-button v-if="isDesktop" icon="el-icon-edit" class="actions-button"/>
<dropdown-menu v-if="showDropdownForMultipleUsers" :selected-users="selectedUsers"/> <dropdown-menu
v-if="showDropdownForMultipleUsers"
:selected-users="selectedUsers"
@apply-action="clearSelection"/>
<el-dropdown-menu v-else> <el-dropdown-menu v-else>
<el-dropdown-item> <el-dropdown-item>
{{ $t('users.selectUsers') }} {{ $t('users.selectUsers') }}
</el-dropdown-item> </el-dropdown-item>
</el-dropdown-menu> </el-dropdown-menu>
</el-dropdown> </el-dropdown>
<el-table v-loading="loading" :data="users" style="width: 100%" @selection-change="handleSelectionChange"> <el-table
<el-table-column v-if="isDesktop" type="selection" width="44" align="center"/> v-loading="loading"
ref="usersTable"
:data="users"
row-key="id"
style="width: 100%"
@selection-change="handleSelectionChange">
<el-table-column
v-if="isDesktop"
type="selection"
reserve-selection
width="44"
align="center"/>
<el-table-column :min-width="width" :label="$t('users.id')" prop="id" /> <el-table-column :min-width="width" :label="$t('users.id')" prop="id" />
<el-table-column :label="$t('users.name')" prop="nickname"> <el-table-column :label="$t('users.name')" prop="nickname">
<template slot-scope="scope"> <template slot-scope="scope">
@ -213,6 +227,9 @@ export default {
}, },
getFirstLetter(str) { getFirstLetter(str) {
return str.charAt(0).toUpperCase() return str.charAt(0).toUpperCase()
},
clearSelection() {
this.$refs.usersTable.clearSelection()
} }
} }
} }