From 7cb906c7be77a357efafaf665df7672ad905ed65 Mon Sep 17 00:00:00 2001 From: raxelsen Date: Mon, 4 Jun 2018 17:10:22 +0200 Subject: [PATCH] TT#37651 Change station name of PBXDevice What has been done: - TT#37664, Extend field to also have write ability and save/reset functionality - TT#37668, Implement loading animation - TT#37666, Implement success toast - TT#38006, Implement error message alert Change-Id: I0801077859091b3a3b183c1b0150215a47d45b2a --- src/api/call-forward.js | 72 +++++---- src/api/pbx-config.js | 7 + .../pages/PbxConfiguration/CscPbxDevice.vue | 148 ++++++++++++++++-- .../PbxConfiguration/CscPbxDeviceAddForm.vue | 70 +++++++-- .../PbxConfiguration/CscPbxDeviceConfig.vue | 5 +- .../pages/PbxConfiguration/CscPbxDevices.vue | 50 ++++-- .../PbxConfiguration/CscPbxModelSelect.vue | 11 +- .../pages/PbxConfiguration/CscPbxSeats.vue | 3 +- src/locales/en.json | 1 + src/store/pbx-config/actions.js | 46 +++--- src/store/pbx-config/getters.js | 14 +- src/store/pbx-config/mutations.js | 13 ++ src/store/pbx-config/state.js | 3 + 13 files changed, 334 insertions(+), 109 deletions(-) diff --git a/src/api/call-forward.js b/src/api/call-forward.js index 81524c10..ca3a5cdd 100644 --- a/src/api/call-forward.js +++ b/src/api/call-forward.js @@ -8,12 +8,12 @@ import { LIST_ALL_ROWS } from './common'; export function getMappings(id) { return new Promise((resolve, reject) => { - Vue.http.get('api/cfmappings/' + id).then(result => { + Vue.http.get('api/cfmappings/' + id).then((result) => { let jsonBody = getJsonBody(result.body); delete jsonBody._links; delete jsonBody.cfs; resolve(getJsonBody(result.body)); - }).catch(err => { + }).catch((err) => { reject(err); }); }); @@ -24,7 +24,7 @@ export function getSourcesets(id) { Promise.resolve().then(() => { return Vue.http.get('api/cfsourcesets/', { params: { subscriber_id: id, page: 1, rows: LIST_ALL_ROWS } }) - }).then(result => { + }).then((result) => { let totalCount = getJsonBody(result.body).total_count; if (totalCount > LIST_ALL_ROWS) { return Vue.http.get('api/cfsourcesets/', @@ -34,13 +34,13 @@ export function getSourcesets(id) { else { return Promise.resolve(result); } - }).then(result => { + }).then((result) => { let sourcesets = []; if (getJsonBody(result.body)._embedded) { sourcesets = getJsonBody(result.body)._embedded['ngcp:cfsourcesets']; } resolve(sourcesets); - }).catch(err => { + }).catch((err) => { reject(err); }); }); @@ -51,7 +51,7 @@ export function getTimesets(id) { Promise.resolve().then(() => { return Vue.http.get('api/cftimesets/', { params: { subscriber_id: id, page: 1, rows: LIST_ALL_ROWS } }) - }).then(result => { + }).then((result) => { let totalCount = getJsonBody(result.body).total_count; if (totalCount > LIST_ALL_ROWS) { return Vue.http.get('api/cftimesets/', @@ -65,7 +65,7 @@ export function getTimesets(id) { let response = getJsonBody(result.body)._embedded || []; let timesets = response['ngcp:cftimesets'] || []; resolve(timesets); - }).catch(err => { + }).catch((err) => { reject(err); }); }); @@ -76,7 +76,7 @@ export function getDestinationsets(id) { Promise.resolve().then(() => { return Vue.http.get('api/cfdestinationsets/', { params: { subscriber_id: id, page: 1, rows: LIST_ALL_ROWS } }) - }).then(result => { + }).then((result) => { let totalCount = getJsonBody(result.body).total_count; if (totalCount > LIST_ALL_ROWS) { return Vue.http.get('api/cfdestinationsets/', @@ -86,9 +86,9 @@ export function getDestinationsets(id) { else { return Promise.resolve(result); } - }).then(result => { + }).then((result) => { resolve(getJsonBody(result.body)._embedded['ngcp:cfdestinationsets']); - }).catch(err => { + }).catch((err) => { reject(err); }); }); @@ -236,7 +236,7 @@ export function deleteDestinationFromDestinationset(options) { op: 'replace', path: '/destinations', value: options.data - }], { headers: headers }).then(result => { + }], { headers: headers }).then((result) => { if (options.deleteDestinationset) { deleteDestinationsetById(options.id).then((res) => { resolve(res); @@ -247,7 +247,7 @@ export function deleteDestinationFromDestinationset(options) { else { resolve(result); } - }).catch(err => { + }).catch((err) => { reject(err); }); }); @@ -255,9 +255,9 @@ export function deleteDestinationFromDestinationset(options) { export function deleteDestinationsetById(id) { return new Promise((resolve, reject) => { - Vue.http.delete('api/cfdestinationsets/' + id).then(result => { + Vue.http.delete('api/cfdestinationsets/' + id).then((result) => { resolve(result); - }).catch(err => { + }).catch((err) => { reject(err); }); }); @@ -272,9 +272,9 @@ export function addDestinationToDestinationset(options) { op: 'replace', path: '/destinations', value: options.data - }], { headers: headers }).then(result => { + }], { headers: headers }).then((result) => { resolve(result); - }).catch(err => { + }).catch((err) => { reject(err); }); }); @@ -284,9 +284,9 @@ export function addNewDestinationset() { let destinationsetName = `csc-${Date.now()}`; return new Promise((resolve, reject) => { Vue.http.post('api/cfdestinationsets/', { name: destinationsetName }) - .then(response => { + .then((response) => { resolve(_.last(_.split(response.headers.get('Location'), '/'))); - }).catch(err => { + }).catch((err) => { reject(err); }); }); @@ -343,32 +343,30 @@ export function addDestinationToEmptyGroup(options) { } export function addNewMapping(options) { - let headers = { 'Content-Type': 'application/json-patch+json' }; return new Promise((resolve, reject) => { + let headers = { 'Content-Type': 'application/json-patch+json' }; Vue.http.patch('api/cfmappings/' + options.subscriberId, [{ op: 'replace', path: '/' + options.group, value: options.mappings - }], { headers: headers }).then(result => { + }], { headers: headers }).then((result) => { resolve(result); - }).catch(err => { + }).catch((err) => { reject(err); }); }); } export function changePositionOfDestination(options) { - let headers = { - 'Content-Type': 'application/json-patch+json' - }; return new Promise((resolve, reject) => { + let headers = { 'Content-Type': 'application/json-patch+json' }; Vue.http.patch('api/cfdestinationsets/' + options.id, [{ op: 'replace', path: '/destinations', value: options.destinations - }], { headers: headers }).then(result => { + }], { headers: headers }).then((result) => { resolve(result); - }).catch(err => { + }).catch((err) => { reject(err); }); }); @@ -586,7 +584,7 @@ export function deleteTimeFromTimeset(options) { value: options.times }], { headers: headers }).then((result) => { resolve(result); - }).catch(err => { + }).catch((err) => { reject(err); }); }); @@ -596,7 +594,7 @@ export function deleteTimesetById(id) { return new Promise((resolve, reject) => { Vue.http.delete('api/cftimesets/' + id).then(() => { resolve(); - }).catch(err => { + }).catch((err) => { reject(err); }); }); @@ -631,7 +629,7 @@ export function addTimeToTimeset(options) { value: options.times }], { headers: headers }).then(() => { resolve(); - }).catch(err => { + }).catch((err) => { reject(err); }); }); @@ -640,9 +638,9 @@ export function addTimeToTimeset(options) { export function addNewTimeset(timesetName) { return new Promise((resolve, reject) => { Vue.http.post('api/cftimesets/', { name: timesetName }) - .then(response => { + .then((response) => { resolve(_.last(_.split(response.headers.get('Location'), '/'))); - }).catch(err => { + }).catch((err) => { reject(err); }); }); @@ -725,7 +723,7 @@ export function getTimesByTimesetId(id) { let timeset = getJsonBody(res.body); delete timeset['_links']; resolve(timeset.times); - }).catch((err)=>{ + }).catch((err) => { reject(err); }); }); @@ -752,7 +750,7 @@ export function getSourcesBySourcesetId(id) { Vue.http.get('api/cfsourcesets/' + id).then((res)=>{ let sourceset = getJsonBody(res.body); resolve(sourceset.sources); - }).catch((err)=>{ + }).catch((err) => { reject(err); }); }); @@ -769,7 +767,7 @@ export function addSourceToSourceset(options) { value: options.sources }], { headers: headers }).then(() => { resolve(); - }).catch(err => { + }).catch((err) => { reject(err); }); }); @@ -801,7 +799,7 @@ export function createSourcesetWithSource(options) { }] }).then(() => { resolve(); - }).catch(err => { + }).catch((err) => { reject(err); }); }); @@ -811,7 +809,7 @@ export function deleteSourcesetById(id) { return new Promise((resolve, reject) => { Vue.http.delete('api/cfsourcesets/' + id).then(() => { resolve(); - }).catch(err => { + }).catch((err) => { reject(err); }); }); @@ -838,7 +836,7 @@ export function deleteSourceFromSourcesetByIndex(options) { value: sources }], { headers: headers }).then(() => { resolve(); - }).catch(err => { + }).catch((err) => { reject(err); }); }); diff --git a/src/api/pbx-config.js b/src/api/pbx-config.js index 1ebb4066..be9e905f 100644 --- a/src/api/pbx-config.js +++ b/src/api/pbx-config.js @@ -456,3 +456,10 @@ export function updateDeviceKeys(deviceId, keys) { }); } +export function setStationName(options) { + return patchReplace({ + path: 'api/pbxdevices/' + options.id, + fieldPath: 'station_name', + value: options.station_name + }); +} diff --git a/src/components/pages/PbxConfiguration/CscPbxDevice.vue b/src/components/pages/PbxConfiguration/CscPbxDevice.vue index f320e5be..96db8efb 100644 --- a/src/components/pages/PbxConfiguration/CscPbxDevice.vue +++ b/src/components/pages/PbxConfiguration/CscPbxDevice.vue @@ -6,32 +6,95 @@ - {{ device.station_name }} - Model: {{ name }} - MAC address: {{ device.identifier }} - + + {{ device.station_name }} + + + + Model: + + {{ name }} + + + + MAC address: + + {{ device.identifier }} + + - + - - + +

{{ name }}

 - + - + - - + + - - + + @@ -61,7 +124,8 @@ data () { return { expanded: false, - modalOpened: false + modalOpened: false, + changes: this.getDevice() } }, computed: { @@ -84,6 +148,41 @@ }, name() { return _.get(this.device, 'profile.name', '...'); + }, + stationNameButtons() { + let buttons = []; + let self = this; + if(this.stationNameHasChanges) { + buttons.push({ + icon: 'check', + error: false, + handler (event) { + event.stopPropagation(); + self.saveStationName(); + } + }, { + icon: 'clear', + error: false, + handler (event) { + event.stopPropagation(); + self.resetStationName(); + } + } + ); + } + return buttons; + }, + stationName() { + return this.device.station_name; + }, + deviceModel() { + return { + id: this.changes.id, + station_name: this.changes.stationName + } + }, + stationNameHasChanges() { + return this.stationName !== this.changes.stationName; } }, mounted() { @@ -104,6 +203,23 @@ device: this.device, keys: keys }); + }, + getDevice() { + return { + id: this.device.id, + stationName: this.device.station_name + } + }, + resetStationName() { + this.changes.stationName = this.device.station_name; + }, + saveStationName() { + this.$emit('save-station-name', this.deviceModel); + } + }, + watch: { + device() { + this.changes = this.getDevice(); } } } diff --git a/src/components/pages/PbxConfiguration/CscPbxDeviceAddForm.vue b/src/components/pages/PbxConfiguration/CscPbxDeviceAddForm.vue index 295c3afe..9c84fa28 100644 --- a/src/components/pages/PbxConfiguration/CscPbxDeviceAddForm.vue +++ b/src/components/pages/PbxConfiguration/CscPbxDeviceAddForm.vue @@ -2,29 +2,69 @@
- + - + - + -
- {{ $t('buttons.cancel') }} - {{ $t('buttons.save') }} +
+ {{ $t('buttons.cancel') }} + {{ $t('buttons.save') }}
-
- Add device +
+ Add device
- - + +
diff --git a/src/components/pages/PbxConfiguration/CscPbxDeviceConfig.vue b/src/components/pages/PbxConfiguration/CscPbxDeviceConfig.vue index dfca7ecb..f32b794c 100644 --- a/src/components/pages/PbxConfiguration/CscPbxDeviceConfig.vue +++ b/src/components/pages/PbxConfiguration/CscPbxDeviceConfig.vue @@ -363,8 +363,9 @@ }, watch: { device() { - this.openKeyOverlay(this.selectedKey, this.selectedKeyIndex); - this.$forceUpdate(); + if(this.keyOverlayActive) { + this.selectedLine = this.getLineByKey(this.selectedKeyIndex); + } } } } diff --git a/src/components/pages/PbxConfiguration/CscPbxDevices.vue b/src/components/pages/PbxConfiguration/CscPbxDevices.vue index 0fc85fd5..0cccab26 100644 --- a/src/components/pages/PbxConfiguration/CscPbxDevices.vue +++ b/src/components/pages/PbxConfiguration/CscPbxDevices.vue @@ -1,6 +1,5 @@ @@ -96,7 +96,7 @@ diff --git a/src/components/pages/PbxConfiguration/CscPbxSeats.vue b/src/components/pages/PbxConfiguration/CscPbxSeats.vue index 88816699..b18e5c7c 100644 --- a/src/components/pages/PbxConfiguration/CscPbxSeats.vue +++ b/src/components/pages/PbxConfiguration/CscPbxSeats.vue @@ -79,7 +79,8 @@ 'lastRemovedSeat', 'lastUpdatedField', 'updateAliasNumbersState', - 'updateGroupsAndSeatsState' + 'updateGroupsAndSeatsState', + 'updateState' ]), groupOptions() { let groups = []; diff --git a/src/locales/en.json b/src/locales/en.json index 7b10dd21..05b740fe 100644 --- a/src/locales/en.json +++ b/src/locales/en.json @@ -295,6 +295,7 @@ "removedSeatToast": "Removed seat {seat}", "removedDeviceToast": "Removed device {name}", "updatedDeviceKeys": "Updated keys of device {name}", + "updatedStationName": "Updated station name to {name}", "createdDevice": "Created device {name} successfully" }, "removeDevice": "Remove device", diff --git a/src/store/pbx-config/actions.js b/src/store/pbx-config/actions.js index 2aafb752..14303f69 100644 --- a/src/store/pbx-config/actions.js +++ b/src/store/pbx-config/actions.js @@ -1,9 +1,14 @@ -'use strict'; import _ from 'lodash'; -import { assignNumbers } from '../../api/user'; -import { addGroup, removeGroup, addSeat, removeSeat, setGroupName, - +import { + assignNumbers +} from '../../api/user'; +import { + addGroup, + removeGroup, + addSeat, + removeSeat, + setGroupName, setGroupExtension, setGroupHuntPolicy, setGroupHuntTimeout, @@ -20,7 +25,8 @@ import { addGroup, removeGroup, addSeat, removeSeat, setGroupName, getSeatList, getDeviceList, getDevice, - getAllGroupsAndSeats + getAllGroupsAndSeats, + setStationName } from '../../api/pbx-config' export default { @@ -287,18 +293,22 @@ export default { }).catch((err)=>{ context.commit('updateDeviceKeyFailed', data.device.id, err); }); + }, + listProfiles(context) { + context.commit('listProfilesRequesting'); + getProfiles({ all: true }).then((profiles)=>{ + context.commit('listProfilesSucceeded', profiles); + }).catch((err)=>{ + context.commit('listProfilesFailed', err.message); + }); + }, + setStationName(context, device) { + context.commit('updateStationNameRequesting', device); + setStationName(device).then(() => { + context.commit('updateStationNameSucceeded'); + context.dispatch('loadDevice', device.id); + }).catch((err) => { + context.commit('updateStationNameFailed', err.message); + }); } - // filterDevices(context, params) { - // context.commit('deviceListRequesting', { - // silent: false - // }); - // filterDeviceList(params).then((devices)=>{ - // context.commit('deviceListSucceeded', devices); - // devices.items.forEach((device)=>{ - // context.dispatch('loadDevice', device.id); - // }); - // }).catch((err)=>{ - // context.commit('deviceListFailed', err.message); - // }); - // } } diff --git a/src/store/pbx-config/getters.js b/src/store/pbx-config/getters.js index 8bd41ea0..3fb1c6ce 100644 --- a/src/store/pbx-config/getters.js +++ b/src/store/pbx-config/getters.js @@ -141,7 +141,7 @@ export default { return state.listLastPage; }, isDeviceLoading(state) { - return (id)=>{ + return (id) => { return state.deviceStates[id + ""] === RequestState.requesting; } }, @@ -250,7 +250,19 @@ export default { listProfilesError(state) { return state.listError; }, + updatedStationName(state) { + return state.updatedStationName; + }, modelImages(state) { return state.modelImages; + }, + updatedDevice(state) { + return state.updatedDevice; + }, + updatedDeviceSucceeded(state) { + return state.updatedDeviceState === 'succeeded'; + }, + updatedDeviceError(state) { + return state.updatedDeviceError; } } diff --git a/src/store/pbx-config/mutations.js b/src/store/pbx-config/mutations.js index 13b63c8a..f9a74d1e 100644 --- a/src/store/pbx-config/mutations.js +++ b/src/store/pbx-config/mutations.js @@ -285,5 +285,18 @@ export default { listProfilesFailed(state, error) { state.listProfilesState = RequestState.failed; state.listProfilesError = error; + }, + updateStationNameRequesting(state, deviceId) { + state.updatedDevice = deviceId; + state.updatedDeviceState = RequestState.requesting; + state.updatedDeviceError = null; + }, + updateStationNameSucceeded(state) { + state.updatedDeviceState = RequestState.succeeded; + state.updatedDeviceError = null; + }, + updateStationNameFailed(state, error) { + state.updatedDeviceState = RequestState.failed; + state.updatedDeviceError = error; } } diff --git a/src/store/pbx-config/state.js b/src/store/pbx-config/state.js index 993f0e63..e5418685 100644 --- a/src/store/pbx-config/state.js +++ b/src/store/pbx-config/state.js @@ -51,6 +51,9 @@ export default { createDeviceError: null, listProfilesState: RequestState.initiated, listProfilesError: null, + updatedDevice: null, + updatedDeviceState: RequestState.initiated, + updatedDeviceError: null, modelImageStates: {}, modelImageErrors: {}, modelImages: {},