TT#61810 Activate toasts for crud operations on pbx devices

Change-Id: I20b81a1a317855dbe10f55c6fde64f07f315d368

src/components/pages/PbxConfiguration/CscPbxDevices.vue

@@ -131,17 +131,25 @@
         QSlideTransition,
         QPagination
     } from 'quasar-framework'
-    import CscPage from "../../CscPage";
-    import CscList from "../../CscList";
-    import CscPbxDevice from "./CscPbxDevice";
-    import CscFade from "../../transitions/CscFade";
-    import CscListSpinner from "../../CscListSpinner";
-    import CscListAddButton from "../../CscListAddButton";
-    import CscListActions from "../../CscListActions";
-    import CscListActionButton from "../../CscListActionButton";
-    import CscPbxDeviceFilters from "./CscPbxDeviceFilters";
-    import CscPbxDeviceAddForm from "./CscPbxDeviceAddForm";
-    import CscRemoveDialog from "../../CscRemoveDialog";
+    import CscPage from "../../CscPage"
+    import CscList from "../../CscList"
+    import CscPbxDevice from "./CscPbxDevice"
+    import CscFade from "../../transitions/CscFade"
+    import CscListSpinner from "../../CscListSpinner"
+    import CscListAddButton from "../../CscListAddButton"
+    import CscListActions from "../../CscListActions"
+    import CscListActionButton from "../../CscListActionButton"
+    import CscPbxDeviceFilters from "./CscPbxDeviceFilters"
+    import CscPbxDeviceAddForm from "./CscPbxDeviceAddForm"
+    import CscRemoveDialog from "../../CscRemoveDialog"
+    import {
+        showGlobalError,
+        showToast
+    } from '../../../helpers/ui'
+    import {
+        CreationState,
+        RequestState
+    } from "../../../store/common"
     export default {
         name: 'csc-pbx-devices',
         components: {
@@ -191,7 +199,10 @@
                 'deviceListItems',
                 'deviceListCurrentPage',
                 'deviceListLastPage',
-                'deviceListVisibility'
+                'deviceListVisibility',
+                'deviceCreationState',
+                'deviceUpdateState',
+                'deviceRemovalState'
             ]),
             ...mapGetters('pbxDevices', [
                 'isDeviceListRequesting',
@@ -202,7 +213,10 @@
                 'isDeviceUpdating',
                 'isDeviceRemoving',
                 'isDeviceLoading',
-                'getDeviceRemoveDialogMessage'
+                'getDeviceRemoveDialogMessage',
+                'getDeviceCreationToastMessage',
+                'getDeviceUpdateToastMessage',
+                'getDeviceRemovalToastMessage'
             ]),
             hasFilters() {
                 return this.stationNameFilter !== null ||
@@ -299,6 +313,34 @@
             closeDeviceRemovalDialog() {
                 this.deviceRemovalCanceled();
             },
+        },
+        watch: {
+            deviceCreationState(state) {
+                if(state === CreationState.created) {
+                    this.$scrollTo(this.$parent.$el);
+                    showToast(this.getDeviceCreationToastMessage);
+                }
+                else if(state === CreationState.error) {
+                    showGlobalError(this.deviceCreationError);
+                }
+            },
+            deviceUpdateState(state) {
+                if(state === RequestState.succeeded) {
+                    showToast(this.getDeviceUpdateToastMessage);
+                }
+                else if(state === RequestState.failed) {
+                    showGlobalError(this.deviceUpdateError);
+                }
+            },
+            deviceRemovalState(state) {
+                if(state === RequestState.succeeded) {
+                    this.$scrollTo(this.$parent.$el);
+                    showToast(this.getDeviceRemovalToastMessage);
+                }
+                else if(state === RequestState.failed) {
+                    showGlobalError(this.deviceRemovalError);
+                }
+            }
         }
     }
 </script>

src/locales/en.json

@@ -479,7 +479,11 @@
         "soundSetUseAsDefault": "Use as default for all seats and groups",
         "soundSetPlayAllLoop": "Play all files in loop",
         "soundSetRemovalDialogTitle": "Remove sound set",
-        "soundSetRemovalDialogText": "You are about to remove sound set {soundSetName}"
+        "soundSetRemovalDialogText": "You are about to remove sound set {soundSetName}",
+        "deviceCreationToast": "Created device {device} successfully",
+        "deviceUpdateToast": "Updated {field} for device {device} successfully",
+        "deviceRemovalToast": "Removed device {device} successfully",
+        "deviceLampsAndKeys": "Lamps/Keys"
     },
     "callBlocking": {
         "privacyEnabledToast": "Your number is hidden to the callee",

src/store/pbx-devices.js

@@ -79,6 +79,15 @@ export default {
         getDeviceRemovingName(state) {
             return _.get(state, 'deviceRemoving.station_name', '');
         },
+        getDeviceCreatingName(state) {
+            return _.get(state, 'deviceCreating.stationName', '');
+        },
+        getDeviceUpdatingName(state) {
+            return _.get(state, 'deviceUpdating.station_name', '');
+        },
+        getDeviceUpdatingField(state) {
+            return state.deviceUpdatingField;
+        },
         getDeviceRemoveDialogMessage(state, getters) {
             if(getters.isDeviceRemoving) {
                 return i18n.t('pbxConfig.removeDeviceText', {
@@ -87,6 +96,22 @@ export default {
             }
             return '';
         },
+        getDeviceCreationToastMessage(state, getters) {
+            return i18n.t('pbxConfig.deviceCreationToast', {
+                device: getters.getDeviceCreatingName
+            });
+        },
+        getDeviceUpdateToastMessage(state, getters) {
+            return i18n.t('pbxConfig.deviceUpdateToast', {
+                device: getters.getDeviceUpdatingName,
+                field: getters.getDeviceUpdatingField
+            });
+        },
+        getDeviceRemovalToastMessage(state, getters) {
+            return i18n.t('pbxConfig.deviceRemovalToast', {
+                device: getters.getDeviceRemovingName
+            });
+        }
     },
     mutations: {
         deviceListItemsRequesting(state, options) {
@@ -237,7 +262,7 @@ export default {
         setDeviceStationName(context, options) {
             context.commit('deviceUpdateRequesting', {
                 deviceId: options.deviceId,
-                deviceField: 'Station name'
+                deviceField: i18n.t('pbxConfig.deviceStationName')
             });
             setDeviceStationName(options.deviceId, options.stationName).then((device) => {
                 context.commit('deviceUpdateSucceeded', device);
@@ -248,7 +273,7 @@ export default {
         setDeviceIdentifier(context, options) {
             context.commit('deviceUpdateRequesting', {
                 deviceId: options.deviceId,
-                deviceField: 'Identifier'
+                deviceField: i18n.t('pbxConfig.deviceIdentifier')
             });
             setDeviceIdentifier(options.deviceId, options.identifier).then((device) => {
                 context.commit('deviceUpdateSucceeded', device);
@@ -259,7 +284,7 @@ export default {
         setDeviceProfile(context, options) {
             context.commit('deviceUpdateRequesting', {
                 deviceId: options.deviceId,
-                deviceField: 'Profile'
+                deviceField: i18n.t('pbxConfig.deviceModel')
             });
             setDeviceProfile(options.deviceId, options.profileId).then((device) => {
                 context.commit('deviceUpdateSucceeded', device);
@@ -270,7 +295,7 @@ export default {
         setDeviceKeys(context, options) {
             context.commit('deviceUpdateRequesting', {
                 deviceId: options.deviceId,
-                deviceField: 'Keys'
+                deviceField: i18n.t('pbxConfig.deviceLampsAndKeys')
             });
             setDeviceKeys(options.deviceId, options.keys).then((device) => {
                 context.commit('deviceUpdateSucceeded', device);