From 4b5d69c198f1ea94a5289c44f885818d08ff2867 Mon Sep 17 00:00:00 2001
From: Angelina Filippova <linakirsanova@gmail.com>
Date: Sun, 5 May 2019 22:52:20 +0300
Subject: [PATCH] Add ability to choose multiple users on different pages

---
 src/views/users/components/DropdownMenu.vue |  1 +
 src/views/users/index.vue                   | 23 ++++++++++++++++++---
 2 files changed, 21 insertions(+), 3 deletions(-)

diff --git a/src/views/users/components/DropdownMenu.vue b/src/views/users/components/DropdownMenu.vue
index 6dfcdff5..546ece3f 100644
--- a/src/views/users/components/DropdownMenu.vue
+++ b/src/views/users/components/DropdownMenu.vue
@@ -171,6 +171,7 @@ export default {
         type: 'warning'
       }).then(() => {
         mapSelectedUsers()
+        this.$emit('apply-action')
         this.$message({
           type: 'success',
           message: 'Completed'
diff --git a/src/views/users/index.vue b/src/views/users/index.vue
index 043f4736..182e8bb0 100644
--- a/src/views/users/index.vue
+++ b/src/views/users/index.vue
@@ -7,15 +7,29 @@
     </div>
     <el-dropdown>
       <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-item>
           {{ $t('users.selectUsers') }}
         </el-dropdown-item>
       </el-dropdown-menu>
     </el-dropdown>
-    <el-table v-loading="loading" :data="users" style="width: 100%" @selection-change="handleSelectionChange">
-      <el-table-column v-if="isDesktop" type="selection" width="44" align="center"/>
+    <el-table
+      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 :label="$t('users.name')" prop="nickname">
         <template slot-scope="scope">
@@ -213,6 +227,9 @@ export default {
     },
     getFirstLetter(str) {
       return str.charAt(0).toUpperCase()
+    },
+    clearSelection() {
+      this.$refs.usersTable.clearSelection()
     }
   }
 }