sipwise
/
ngcp-csc-ui
mirror of https://github.com/sipwise/ngcp-csc-ui.git
1
0
Fork 0
Code Issues Releases Wiki Activity

TT#61810 Activate toasts and error messages for crud operations on call queues

Browse Source 
Change-Id: Iec9ce36e5b6183b2a35dd2053b0317fa09a1f61c
changes/64/31864/1
Hans-Peter Herzog 6 years ago
parent 5a153817ea
commit 83771d7d56
3 changed files with 107 additions and 180 deletions
Show Stats Download Patch File Download Diff File

216
src/components/pages/PbxConfiguration/CscPbxCallQueues.vue
Unescape View File

@ -65,74 +65,6 @@
@cancel="closeCallQueueRemovalDialog"
/>
</csc-page>
<!--<csc-page-->
<!--:is-list="true"-->
<!--&gt;-->
<!--<div-->
<!--v-show="!addFormEnabled"-->
<!--class="row justify-center"-->
<!--&gt;-->
<!--<q-btn-->
<!--color="primary"-->
<!--icon="add"-->
<!--flat-->
<!--@click="enableAddForm"-->
<!--&gt;-->
<!--{{ $t('pbxConfig.addConfig') }}-->
<!--</q-btn>-->
<!--</div>-->
<!--<div-->
<!--class="row justify-center"-->
<!--v-show="addFormEnabled"-->
<!--&gt;-->
<!--<csc-pbx-call-queue-add-form-->
<!--class="col-xs-12 col-md-6 csc-list-form"-->
<!--ref="addForm"-->
<!--:options="callQueueGroupsAndSeatsOptions"-->
<!--:loading="isAdding"-->
<!--@save="addConfig"-->
<!--@cancel="disableAddForm"-->
<!--/>-->
<!--</div>-->
<!--<div-->
<!--v-if="isListLoadingVisible"-->
<!--class="row justify-center"-->
<!--&gt;-->
<!--<csc-spinner />-->
<!--</div>-->
<!--<div>-->
<!--<q-list-->
<!--striped-odd-->
<!--no-border-->
<!--multiline-->
<!--:highlight="!isMobile"-->
<!--&gt;-->
<!--<csc-pbx-call-queue-->
<!--v-for="(subscriber, index) in callQueueGroupsAndSeats"-->
<!--:id="`queue-${subscriber.id}`"-->
<!--:key="index"-->
<!--:subscriber="subscriber"-->
<!--:loading="isItemLoading(subscriber.id)"-->
<!--@save-queue-length="setQueueLength"-->
<!--@save-wrap-up-time="setWrapUpTime"-->
<!--:highlight="highlight(subscriber)"-->
<!--@remove="removeConfigDialog"-->
<!--/>-->
<!--</q-list>-->
<!--</div>-->
<!--<div-->
<!--v-if="callQueueGroupsAndSeats.length === 0 && !isListRequesting"-->
<!--class="row justify-center csc-no-entities"-->
<!--&gt;-->
<!--{{ $t('pbxConfig.noCallQueues') }}-->
<!--</div>-->
<!--<csc-remove-dialog-->
<!--ref="removeDialog"-->
<!--:title="$t('pbxConfig.removeConfigTitle')"-->
<!--:message="removeDialogMessage"-->
<!--@remove="removeConfig"-->
<!--/>-->
<!--</csc-page>-->
</template>
<script>
@ -148,6 +80,14 @@
mapGetters,
mapMutations
} from 'vuex'
import {
CreationState,
RequestState
} from "../../../store/common"
import {
showGlobalError,
showToast
} from '../../../helpers/ui'
import {
QField,
QInput,
@ -159,25 +99,14 @@
QItemSide,
QItemMain,
QItemTile,
// Platform,
QSpinnerDots,
QBtn,
QSlideTransition
} from 'quasar-framework'
// import {
// showToast
// } from '../../../helpers/ui'
// import {
// scroll
// } from 'quasar-framework'
import CscSpinner from "../../CscSpinner";
import CscList from "../../CscList";
import CscFade from "../../transitions/CscFade";
import CscListActionButton from "../../CscListActionButton";
// const {
// getScrollTarget,
// setScrollPosition
// } = scroll
export default {
components: {
CscListActionButton,
@ -206,8 +135,6 @@
},
data () {
return {
// addFormEnabled: false,
// currentRemovingSubscriber: null
}
},
mounted() {
@ -224,6 +151,12 @@
'subscriberMap',
'defaultMaxQueueLength',
'defaultQueueWrapUpTime',
'callQueueCreationState',
'callQueueUpdateState',
'callQueueRemovalState',
'callQueueCreationError',
'callQueueUpdateError',
'callQueueRemovalError'
]),
...mapGetters('pbxCallQueues', [
'isCallQueueListRequesting',
@ -231,43 +164,11 @@
'isCallQueueCreating',
'getCallQueueRemoveDialogMessage',
'isCallQueueLoading',
'isCallQueueExpanded'
'isCallQueueExpanded',
'getCallQueueCreationToastMessage',
'getCallQueueUpdateToastMessage',
'getCallQueueRemovalToastMessage'
])
// ...mapGetters('pbxConfig', [
// 'callQueueGroupsAndSeats',
// 'isListLoadingVisible',
// 'isListRequesting',
// 'callQueueGroupsAndSeatsOptions',
// 'isAdding',
// 'addState',
// 'isUpdating',
// 'updateItemId',
// 'removeState',
// 'isRemoving',
// 'lastAddedCallQueue'
// ]),
// isMobile() {
// return Platform.is.mobile;
// },
// callQueueItem() {
// return this.$route.query.item;
// },
// handleScroll () {
// const el = document.getElementById(`queue-${this.callQueueItem}`)
// const target = el ? getScrollTarget(el) : null;
// const offset = el ? el.offsetTop - el.scrollHeight : null;
// const duration = 200
// if (this.callQueueItem && target) {
// setScrollPosition(target, offset, duration)
// }
// },
// removeDialogMessage() {
// if (this.currentRemovingSubscriber !== null) {
// return this.$t('pbxConfig.removeConfigText', {
// subscriber: this.currentRemovingSubscriber.display_name
// });
// }
// }
},
methods: {
...mapActions('pbx', [
@ -300,63 +201,34 @@
}
this.callQueueRemovalCanceled();
}
// addConfig(data) {
// let config = {
// max_queue_length: data.max_queue_length,
// queue_wrap_up_time: data.queue_wrap_up_time
// };
// this.$store.dispatch('pbxConfig/addCallQueueConfig', {
// id: data.subscriber_id,
// config: config
// });
// },
// enableAddForm() {
// this.resetAddForm();
// this.addFormEnabled = true;
// },
// disableAddForm() {
// this.resetAddForm();
// this.addFormEnabled = false;
// },
// resetAddForm() {
// this.$refs.addForm.reset();
// },
// setQueueLength(subscriber) {
// this.$store.dispatch('pbxConfig/setQueueLength', subscriber);
// },
// setWrapUpTime(subscriber) {
// this.$store.dispatch('pbxConfig/setWrapUpTime', subscriber);
// },
// isItemLoading(subscriberId) {
// return (this.isUpdating && this.updateItemId + "" === subscriberId + "") ||
// (this.isRemoving && this.currentRemovingSubscriber.id + "" === subscriberId + "");
// },
// highlight(subscriber) {
// return subscriber.id == this.$route.query.item;
// },
// removeConfigDialog(subscriber) {
// this.currentRemovingSubscriber = subscriber;
// this.$refs.removeDialog.open();
// },
// removeConfig() {
// this.$store.dispatch('pbxConfig/removeCallQueue', this.currentRemovingSubscriber)
// }
},
watch: {
// addState(state) {
// if (state === 'succeeded') {
// this.disableAddForm();
// showToast(this.$t('pbxConfig.toasts.addedCallQueueToast',
// { name: this.lastAddedCallQueue }));
// }
// },
// callQueueGroupsAndSeats(state) {
// if (state.length > 0) {
// setTimeout(() => {
// this.handleScroll;
// }, 500);
// }
// }
callQueueCreationState(state) {
if(state === CreationState.created) {
this.$scrollTo(this.$parent.$el);
showToast(this.getCallQueueCreationToastMessage);
}
else if(state === CreationState.error) {
showGlobalError(this.callQueueCreationError);
}
},
callQueueUpdateState(state) {
if(state === RequestState.succeeded) {
showToast(this.getCallQueueUpdateToastMessage);
}
else if(state === RequestState.failed) {
showGlobalError(this.callQueueUpdateError);
}
},
callQueueRemovalState(state) {
if(state === RequestState.succeeded) {
this.$scrollTo(this.$parent.$el);
showToast(this.getCallQueueRemovalToastMessage);
}
else if(state === RequestState.failed) {
showGlobalError(this.callQueueRemovalError);
}
}
}
}
</script>

3
src/locales/en.json
Unescape View File

@ -471,6 +471,9 @@
"addCallQueue": "Add call queue",
"callQueueRemovalDialogTitle": "Remove call queue",
"callQueueRemovalDialogText": "You are about to remove call queue for {subscriber}",
"callQueueCreationToast": "Created call queue for {callQueue} successfully",
"callQueueUpdateToast": "Updated {field} for call queue {callQueue} successfully",
"callQueueRemovalToast": "Removed call queue for {callQueue} successfully",
"soundSetName": "Name",
"soundSetDescription": "Description",
"soundSetDefault": "Default sound set for all seats and groups",

68
src/store/pbx-callqueues.js
Unescape View File

@ -28,10 +28,14 @@ export default {
callQueueSelected: null,
callQueueCreationState: CreationState.initiated,
callQueueCreationData: null,
callQueueCreationError: null,
callQueueUpdateState: RequestState.initiated,
callQueueUpdating: null,
callQueueUpdatingField: null,
callQueueUpdateError: null,
callQueueRemovalState: RequestState.initiated,
callQueueRemoving: null,
callQueueRemovalError: null,
subscriberMap: {},
defaultMaxQueueLength: 5,
defaultQueueWrapUpTime: 10
@ -73,6 +77,45 @@ export default {
});
}
return '';
},
getCallQueueRemovingName(state) {
let subscriber = state.subscriberMap[state.callQueueRemoving.id];
return _.get(subscriber, 'display_name', '');
},
getCallQueueCreatingName(state) {
let subscriber = state.subscriberMap[state.callQueueCreationData.subscriber_id];
return _.get(subscriber, 'display_name', '');
},
getCallQueueUpdatingName(state) {
let subscriber = state.subscriberMap[state.callQueueUpdating.id];
return _.get(subscriber, 'display_name', '');
},
getCallQueueUpdatingField(state) {
return state.callQueueUpdatingField;
},
getCallQueueRemovalDialogMessage(state, getters) {
if(getters.isCallQueueRemoving) {
return i18n.t('pbxConfig.callQueueRemovalDialogMessage', {
callQueue: getters.getCallQueueRemovingName
});
}
return '';
},
getCallQueueCreationToastMessage(state, getters) {
return i18n.t('pbxConfig.callQueueCreationToast', {
callQueue: getters.getCallQueueCreatingName
});
},
getCallQueueUpdateToastMessage(state, getters) {
return i18n.t('pbxConfig.callQueueUpdateToast', {
callQueue: getters.getCallQueueUpdatingName,
field: getters.getCallQueueUpdatingField
});
},
getCallQueueRemovalToastMessage(state, getters) {
return i18n.t('pbxConfig.callQueueRemovalToast', {
callQueue: getters.getCallQueueRemovingName
});
}
},
mutations: {
@ -98,14 +141,16 @@ export default {
});
state.callQueueListVisible = true;
},
callQueueCreationRequesting(state) {
callQueueCreationRequesting(state, data) {
state.callQueueCreationState = CreationState.creating;
state.callQueueCreationData = data;
},
callQueueCreationSucceeded(state) {
state.callQueueCreationState = CreationState.created;
},
callQueueCreationFailed(state) {
callQueueCreationFailed(state, err) {
state.callQueueCreationState = CreationState.error;
state.callQueueCreationError = err;
},
callQueueRemovalRequesting(state, callQueueId) {
state.callQueueRemovalState = RequestState.requesting;
@ -120,12 +165,14 @@ export default {
callQueueRemovalSucceeded(state) {
state.callQueueRemovalState = RequestState.succeeded;
},
callQueueRemovalFailed(state) {
callQueueRemovalFailed(state, err) {
state.callQueueRemovalState = RequestState.failed;
state.callQueueRemovalError = err;
},
callQueueUpdateRequesting(state, options) {
state.callQueueUpdateState = RequestState.requesting;
state.callQueueUpdating = state.callQueueMap[options.callQueueId];
state.callQueueUpdatingField = options.field;
},
callQueueUpdateSucceeded(state, preferences) {
state.callQueueUpdateState = RequestState.succeeded;
@ -139,8 +186,9 @@ export default {
Vue.set(state.callQueueMap, preferences.id, preferences);
}
},
callQueueUpdateFailed(state) {
callQueueUpdateFailed(state, err) {
state.callQueueUpdateState = RequestState.failed;
state.callQueueUpdateError = err;
},
enableCallQueueAddForm(state) {
state.callQueueCreationState = CreationState.input;
@ -184,8 +232,9 @@ export default {
});
}).then(()=>{
context.commit('callQueueCreationSucceeded');
}).catch(()=>{
context.commit('callQueueCreationFailed');
}).catch((err)=>{
console.debug(err);
context.commit('callQueueCreationFailed', err.message);
});
},
removeCallQueue(context) {
@ -197,28 +246,31 @@ export default {
}).then(()=>{
context.commit('callQueueRemovalSucceeded');
}).catch((err)=>{
console.debug(err);
context.commit('callQueueRemovalFailed', err.message);
});
},
setCallQueueMaxLength(context, options) {
context.commit('callQueueUpdateRequesting', {
callQueueId: options.callQueueId,
callQueueUpdatingField: 'maxLength'
field: 'maxLength'
});
setCallQueueMaxLength(options).then((preferences)=>{
context.commit('callQueueUpdateSucceeded', preferences);
}).catch((err)=>{
console.debug(err);
context.commit('callQueueUpdateFailed', err.message);
});
},
setCallQueueWrapUpTime(context, options) {
context.commit('callQueueUpdateRequesting', {
callQueueId: options.callQueueId,
callQueueUpdatingField: 'wrapUpTime'
field: 'wrapUpTime'
});
setCallQueueWrapUpTime(options).then((preferences)=>{
context.commit('callQueueUpdateSucceeded', preferences);
}).catch((err)=>{
console.debug(err);
context.commit('callQueueUpdateFailed', err.message);
});
},

Write Preview
Loading…
Cancel
Save