commit 2932165f02e5aa9241c080b188a0df9fea297775
author Yoshie Muranaka <yoshiemuranaka@gmail.com> Mon May 04 10:52:36 2020 -0700
committer Yoshie Muranaka <yoshiemuranaka@gmail.com> Tue May 12 12:08:28 2020 -0700
tree fd2f420ffcd0c518ffa589edc958937ae7eb8a94
parent 34354313bb876bc2405bc661af312e0254bdaea2

Add confirmation modal on local user table

Adds a delete confirmation modal when user attempting batch delete
action from local user table.

Signed-off-by: Yoshie Muranaka <yoshiemuranaka@gmail.com>
Change-Id: I33f77cb55ceedad8a724a9d3f4b37d12c6d6687e

src/locales/en-US.json

diff --git a/src/locales/en-US.json b/src/locales/en-US.json
index 2db669b..5824e5fa 100644
--- a/src/locales/en-US.json
+++ b/src/locales/en-US.json
@@ -146,13 +146,14 @@
   "pageLocalUserManagement": {
     "accountPolicySettings": "Account policy settings",
     "addUser": "Add user",
-    "deleteUser": "Delete user",
+    "deleteUser": "Delete user | Delete users",
     "editUser": "Edit user",
     "viewPrivilegeRoleDescriptions": "View privilege role descriptions",
     "modal": {
       "accountLocked": "Account locked",
       "accountStatus": "Account status",
       "automaticAfterTimeout": "Automatic after timeout",
+      "batchDeleteConfirmMessage": "Are you sure you want to delete %{count} user? This action cannot be undone. | Are you sure you want to delete %{count} users? This action cannot be undone.",
       "cannotStartWithANumber": "Cannot start with a number",
       "clickSaveToUnlockAccount": "Click \"Save\" to unlock account",
       "confirmUserPassword": "Confirm user password",

src/views/AccessControl/LocalUserManagement/LocalUserManagement.vue

diff --git a/src/views/AccessControl/LocalUserManagement/LocalUserManagement.vue b/src/views/AccessControl/LocalUserManagement/LocalUserManagement.vue
index 4ae9bb4..3143c14 100644
--- a/src/views/AccessControl/LocalUserManagement/LocalUserManagement.vue
+++ b/src/views/AccessControl/LocalUserManagement/LocalUserManagement.vue
@@ -185,7 +185,7 @@
             {
               value: 'delete',
               enabled: user.UserName === 'root' ? false : true,
-              title: this.$t('pageLocalUserManagement.deleteUser')
+              title: this.$tc('pageLocalUserManagement.deleteUser')
             }
           ],
           ...user
@@ -221,8 +221,8 @@
             user: user.username
           }),
           {
-            title: this.$t('pageLocalUserManagement.deleteUser'),
-            okTitle: this.$t('pageLocalUserManagement.deleteUser')
+            title: this.$tc('pageLocalUserManagement.deleteUser'),
+            okTitle: this.$tc('pageLocalUserManagement.deleteUser')
           }
         )
         .then(deleteConfirmed => {
@@ -262,15 +262,36 @@
       this.startLoader();
       switch (action) {
         case 'delete':
-          this.$store
-            .dispatch('localUsers/deleteUsers', this.selectedRows)
-            .then(messages => {
-              messages.forEach(({ type, message }) => {
-                if (type === 'success') this.successToast(message);
-                if (type === 'error') this.errorToast(message);
-              });
-            })
-            .finally(() => this.endLoader());
+          this.$bvModal
+            .msgBoxConfirm(
+              this.$tc(
+                'pageLocalUserManagement.modal.batchDeleteConfirmMessage',
+                this.selectedRows.length
+              ),
+              {
+                title: this.$tc(
+                  'pageLocalUserManagement.deleteUser',
+                  this.selectedRows.length
+                ),
+                okTitle: this.$tc(
+                  'pageLocalUserManagement.deleteUser',
+                  this.selectedRows.length
+                )
+              }
+            )
+            .then(deleteConfirmed => {
+              if (deleteConfirmed) {
+                this.$store
+                  .dispatch('localUsers/deleteUsers', this.selectedRows)
+                  .then(messages => {
+                    messages.forEach(({ type, message }) => {
+                      if (type === 'success') this.successToast(message);
+                      if (type === 'error') this.errorToast(message);
+                    });
+                  })
+                  .finally(() => this.endLoader());
+              }
+            });
           break;
         case 'enable':
           this.$store