Add toast component interactions

Include boostrap toast component to communicate success
and error requests on the local user management page.

- Created BVToastMixin to share initialization options
- Used async/await pattern to make sure toasts are shown
  after asynchronous calls are complete
- Followed current AngularJS pattern of manual dismiss for
  error toast and automatic dismiss for success toast

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

1 files changed, 14 insertions, 3 deletions

diff --git a/src/views/AccessControl/LocalUserManagement/LocalUserManagement.vue b/src/views/AccessControl/LocalUserManagement/LocalUserManagement.vue
index 0ca3428d..e71387da 100644
--- a/src/views/AccessControl/LocalUserManagement/LocalUserManagement.vue
+++ b/src/views/AccessControl/LocalUserManagement/LocalUserManagement.vue
@@ -67,6 +67,7 @@ import TableRoles from './TableRoles';
 import ModalUser from './ModalUser';
 import ModalSettings from './ModalSettings';
 import PageTitle from '../../../components/Global/PageTitle';
+import BVToastMixin from '../../../components/Mixins/BVToastMixin';
 
 export default {
   name: 'LocalUsers',
@@ -81,6 +82,7 @@ export default {
     TableRoles,
     PageTitle
   },
+  mixins: [BVToastMixin],
   data() {
     return {
       activeUser: null,
@@ -156,13 +158,22 @@ export default {
     },
     saveUser({ isNewUser, userData }) {
       if (isNewUser) {
-        this.$store.dispatch('localUsers/createUser', userData);
+        this.$store
+          .dispatch('localUsers/createUser', userData)
+          .then(success => this.successToast(success))
+          .catch(({ message }) => this.errorToast(message));
       } else {
-        this.$store.dispatch('localUsers/updateUser', userData);
+        this.$store
+          .dispatch('localUsers/updateUser', userData)
+          .then(success => this.successToast(success))
+          .catch(({ message }) => this.errorToast(message));
       }
     },
     deleteUser({ username }) {
-      this.$store.dispatch('localUsers/deleteUser', username);
+      this.$store
+        .dispatch('localUsers/deleteUser', username)
+        .then(success => this.successToast(success))
+        .catch(({ message }) => this.errorToast(message));
     }
   }
 };