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
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