@@ -87,6 +88,9 @@
methods: {
toggleMain() {
this.expanded = !this.expanded;
+ },
+ remove() {
+ this.$emit('remove', this.device);
}
}
}
@@ -113,4 +117,9 @@
font-weight 400
letter-spacing normal
line-height 1.8rem
+
+ .csc-item-buttons
+ .q-btn
+ padding-left 8px;
+ padding-right 8px;
diff --git a/src/components/pages/PbxConfiguration/CscPbxDevices.vue b/src/components/pages/PbxConfiguration/CscPbxDevices.vue
index 3e7480d9..8ad1832d 100644
--- a/src/components/pages/PbxConfiguration/CscPbxDevices.vue
+++ b/src/components/pages/PbxConfiguration/CscPbxDevices.vue
@@ -7,7 +7,7 @@
-
@@ -20,7 +20,9 @@
import { mapGetters } from 'vuex'
import CscPage from '../../CscPage'
import CscPbxDevice from './CscPbxDevice'
- import { QSpinnerDots, QPagination, QList } from 'quasar-framework'
+ import { QSpinnerDots, QPagination, QList, Dialog } from 'quasar-framework'
+ import { showToast } from '../../../helpers/ui'
+
export default {
data () {
return {
@@ -36,7 +38,8 @@
CscPbxDevice,
QSpinnerDots,
QPagination,
- QList
+ QList,
+ Dialog
},
computed: {
...mapGetters('pbxConfig', [
@@ -46,7 +49,8 @@
'isListLoadingVisible',
'listCurrentPage',
'listLastPage',
- 'isDeviceLoading'
+ 'isDeviceLoading',
+ 'deviceRemoved'
])
},
methods: {
@@ -57,6 +61,33 @@
},
loadDevice(id) {
this.$store.dispatch('pbxConfig/loadDevice', id);
+ },
+ removeDevice(device) {
+ var store = this.$store;
+ var i18n = this.$i18n;
+ Dialog.create({
+ title: i18n.t('pbxConfig.removeDeviceTitle'),
+ message: i18n.t('pbxConfig.removeDeviceText', { device: device.station_name }),
+ buttons: [
+ 'Cancel',
+ {
+ label: i18n.t('pbxConfig.removeDevice'),
+ color: 'negative',
+ handler () {
+ store.dispatch('pbxConfig/removeDevice', device);
+ }
+ }
+ ]
+ });
+ }
+ },
+ watch: {
+ deviceRemoved(device) {
+ if(device !== null) {
+ showToast(this.$t('pbxConfig.toasts.removedDeviceToast', {
+ name: device.station_name
+ }));
+ }
}
}
}
diff --git a/src/locales/en.json b/src/locales/en.json
index 21498b1c..51e5f815 100644
--- a/src/locales/en.json
+++ b/src/locales/en.json
@@ -291,8 +291,12 @@
"addedGroupToast": "Added group {group}",
"removedGroupToast": "Removed group {group}",
"addedSeatToast": "Added seat {seat}",
- "removedSeatToast": "Removed seat {seat}"
- }
+ "removedSeatToast": "Removed seat {seat}",
+ "removedDeviceToast": "Removed device {name}"
+ },
+ "removeDevice": "Remove device",
+ "removeDeviceTitle": "Remove device",
+ "removeDeviceText": "You are about to remove device {device}"
},
"communication": {
"sendFax": "Send Fax",
diff --git a/src/store/pbx-config/actions.js b/src/store/pbx-config/actions.js
index 45bc003c..d09d2536 100644
--- a/src/store/pbx-config/actions.js
+++ b/src/store/pbx-config/actions.js
@@ -4,7 +4,7 @@ import _ from 'lodash';
import { assignNumbers } from '../../api/user';
import { addGroup, removeGroup, addSeat, removeSeat, setGroupName,
setGroupExtension, setGroupHuntPolicy, setGroupHuntTimeout,
- updateGroupSeats, setSeatName, setSeatExtension,
+ updateGroupSeats, setSeatName, setSeatExtension, removeDevice,
updateSeatGroups, getGroupList, getSeatList, getDeviceList, getDeviceFull } from '../../api/pbx-config'
export default {
@@ -209,5 +209,14 @@ export default {
}).catch((err)=>{
context.commit('deviceFailed', deviceId, err.message);
});
+ },
+ removeDevice(context, device) {
+ context.commit('deviceRequesting', device.id);
+ removeDevice(device.id).then(()=>{
+ context.commit('deviceRemoved', device);
+ context.dispatch('listDevices');
+ }).catch((err)=>{
+ context.commit('deviceFailed', device.id, err.message);
+ });
}
}
diff --git a/src/store/pbx-config/getters.js b/src/store/pbx-config/getters.js
index 932ad2a2..5e423fb2 100644
--- a/src/store/pbx-config/getters.js
+++ b/src/store/pbx-config/getters.js
@@ -151,7 +151,7 @@ export default {
},
isDeviceLoading(state) {
return (id)=>{
- return state.deviceLoadingStates[id + ""] === true;
+ return state.deviceStates[id + ""] === RequestState.requesting;
}
},
lastAddedGroup(state) {
@@ -174,5 +174,8 @@ export default {
},
lastRemovedSeat(state) {
return state.lastRemovedSeat;
+ },
+ deviceRemoved(state) {
+ return state.deviceRemoved;
}
}
diff --git a/src/store/pbx-config/mutations.js b/src/store/pbx-config/mutations.js
index 2e3065ae..c4199b61 100644
--- a/src/store/pbx-config/mutations.js
+++ b/src/store/pbx-config/mutations.js
@@ -1,5 +1,6 @@
'use strict';
+import Vue from 'vue'
import _ from 'lodash'
import { RequestState } from '../common'
@@ -154,6 +155,7 @@ export default {
state.listState = RequestState.succeeded;
state.listError = null;
state.listLastPage = data.lastPage;
+ state.deviceRemoved = null;
state.devicesOrdered = data.items;
state.devicesOrdered.forEach((device)=>{
state.devices[device.id + ""] = device;
@@ -164,31 +166,27 @@ export default {
state.listError = error;
},
deviceRequesting(state, deviceId) {
- let deviceLoadingStates = _.clone(state.deviceLoadingStates);
- deviceLoadingStates[deviceId + ""] = true;
- state.deviceLoadingStates = deviceLoadingStates;
+ Vue.set(state.deviceStates, deviceId + "", RequestState.requesting);
},
deviceSucceeded(state, device) {
- let deviceLoadingStates = _.clone(state.deviceLoadingStates);
- deviceLoadingStates[device.id + ""] = false;
- state.deviceLoadingStates = deviceLoadingStates;
+ Vue.set(state.deviceStates, device.id + "", RequestState.succeeded);
+ Vue.set(state.deviceErrors, device.id + "", null);
+ Vue.set(state.devices, device.id + "", device);
for(let i = 0; i <= state.devicesOrdered.length; i++) {
if(state.devicesOrdered[i].id === device.id) {
state.devicesOrdered[i] = device;
}
}
- delete state.devices[device.id + ""];
- state.devices[device.id + ""] = device;
-
},
- deviceFailed(state, deviceId, errorMessage) {
- let deviceLoadingStates = _.clone(state.deviceLoadingStates);
- deviceLoadingStates[deviceId + ""] = false;
- state.deviceLoadingStates = deviceLoadingStates;
- let deviceLoadingErrors = _.clone(state.deviceLoadingErrors);
- deviceLoadingErrors[deviceId + ""] = errorMessage;
- state.deviceLoadingErrors = deviceLoadingErrors;
- },
+ deviceFailed(state, deviceId, error) {
+ Vue.set(state.deviceStates, deviceId + "", RequestState.failed);
+ Vue.set(state.deviceErrors, deviceId + "", error);
+ },
+ deviceRemoved(state, device) {
+ Vue.set(state.deviceStates, device.id + "", 'deleted');
+ Vue.set(state.deviceErrors, device.id + "", null);
+ state.deviceRemoved = device;
+ },
lastAddedGroup(state, group) {
state.lastAddedGroup = group;
},
diff --git a/src/store/pbx-config/state.js b/src/store/pbx-config/state.js
index 8f9e8c94..c8e8e9d9 100644
--- a/src/store/pbx-config/state.js
+++ b/src/store/pbx-config/state.js
@@ -30,8 +30,9 @@ export default {
removeState: RequestState.initiated,
removeError: null,
removeItem: null,
- deviceLoadingStates: {},
- deviceLoadingErrors: {},
+ deviceStates: {},
+ deviceErrors: {},
+ deviceRemoved: null,
lastAddedGroup: null,
lastRemovedGroup: null,
lastAddedSeat: null,