What has been done: - TT#40522, Investigate and discover necessary API endpoints - TT#40523, Implement speed dial page, navigation menu entry and home page box - TT#40525, Implement UI display for list of speed dials - TT#40524, Implement API method for fetching speed dial slots 0-9 - TT#40526, Implement loading animation and error alert - TT#41016, Implement test API speed dial method Change-Id: I0b6fc4dab08913948bb8acf9c136bd56fe89da01changes/61/22561/8
raxelsen
7 years ago
parent
8e4fb6446b
commit
6117c5f6fe
@ -0,0 +1,36 @@
|
||||
|
||||
import _ from 'lodash'
|
||||
import { getFieldList } from './common'
|
||||
|
||||
export function getSpeedDials(id) {
|
||||
return new Promise((resolve, reject) => {
|
||||
getFieldList({
|
||||
path: 'api/speeddials/' + id,
|
||||
field: 'speeddials'
|
||||
}).then((result) => {
|
||||
let sortedResult = _.sortBy(result, ['slot']);
|
||||
resolve(sortedResult);
|
||||
}).catch((err) => {
|
||||
reject(err.body.message);
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
export function getUnassignedSlots(id) {
|
||||
return new Promise((resolve, reject) => {
|
||||
let slots = ["*0", "*1", "*2", "*3", "*4", "*5", "*6", "*7", "*8", "*9"];
|
||||
Promise.resolve().then(() => {
|
||||
return getSpeedDials(id);
|
||||
}).then((assignedSlots) => {
|
||||
// TODO: Split into own testable function that takes slots and
|
||||
// unassigned slots, and outputs slotOptions array ready to be
|
||||
// consumed by q-select
|
||||
let unassignedSlots = _.difference(slots, assignedSlots.map((slot) => {
|
||||
return slot.slot;
|
||||
}));
|
||||
resolve(unassignedSlots);
|
||||
}).catch((err) => {
|
||||
reject(err.body.message);
|
||||
});
|
||||
});
|
||||
}
|
||||
@ -0,0 +1,116 @@
|
||||
<template>
|
||||
<csc-page class="csc-list-page">
|
||||
<q-list
|
||||
no-border
|
||||
inset-separator
|
||||
sparse
|
||||
multiline
|
||||
>
|
||||
<q-item
|
||||
v-for="(assigned, index) in assignedSlots"
|
||||
:key="index"
|
||||
class="csc-entity"
|
||||
>
|
||||
<q-item-side
|
||||
icon="touch app"
|
||||
color="primary"
|
||||
/>
|
||||
<q-item-main>
|
||||
<q-item-tile label>
|
||||
<span class="csc-entity-title">
|
||||
{{ $t('speedDial.whenIDial', { slot: assigned.slot }) }}
|
||||
</span>
|
||||
</q-item-tile>
|
||||
<q-item-tile sublabel>
|
||||
{{ $t('speedDial.ring') }}
|
||||
{{ assigned.destination | destinationFormat }}
|
||||
</q-item-tile>
|
||||
</q-item-main>
|
||||
<q-item-side
|
||||
right
|
||||
class="csc-item-buttons"
|
||||
>
|
||||
<q-item-tile>
|
||||
<q-btn
|
||||
flat
|
||||
icon="delete"
|
||||
color="negative"
|
||||
slot="right"
|
||||
@click="deleteAssignment(index)"
|
||||
/>
|
||||
</q-item-tile>
|
||||
</q-item-side>
|
||||
</q-item>
|
||||
</q-list>
|
||||
<div
|
||||
v-if="assignedSlots.length === 0"
|
||||
class="row justify-center"
|
||||
>
|
||||
{{ $t('speedDial.noResultsMessage') }}
|
||||
</div>
|
||||
</csc-page>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { mapGetters } from 'vuex'
|
||||
import {
|
||||
startLoading,
|
||||
stopLoading,
|
||||
showGlobalError
|
||||
} from '../../helpers/ui'
|
||||
import CscPage from '../CscPage'
|
||||
import {
|
||||
QList,
|
||||
QItem,
|
||||
QItemMain,
|
||||
QItemTile,
|
||||
QItemSide,
|
||||
QChip,
|
||||
QBtn
|
||||
} from 'quasar-framework'
|
||||
|
||||
export default {
|
||||
components: {
|
||||
CscPage,
|
||||
QList,
|
||||
QItem,
|
||||
QItemMain,
|
||||
QItemTile,
|
||||
QItemSide,
|
||||
QChip,
|
||||
QBtn
|
||||
},
|
||||
created() {
|
||||
this.$store.dispatch('speedDial/loadSpeedDials');
|
||||
},
|
||||
computed: {
|
||||
...mapGetters('speedDial', [
|
||||
'assignedSlots',
|
||||
'speedDialLoadingState',
|
||||
'speedDialLoadingError'
|
||||
])
|
||||
},
|
||||
methods: {
|
||||
deleteAssignment(index) {
|
||||
console.log('deleteAssignment(), index', index);
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
speedDialLoadingState(state) {
|
||||
if (state === 'requesting') {
|
||||
startLoading();
|
||||
}
|
||||
else if (state === 'failed') {
|
||||
stopLoading();
|
||||
showGlobalError(this.speedDialLoadingError);
|
||||
}
|
||||
else if (state === 'succeeded') {
|
||||
stopLoading();
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="stylus" rel="stylesheet/stylus">
|
||||
</style>
|
||||
@ -0,0 +1,62 @@
|
||||
'use strict';
|
||||
|
||||
import { i18n } from '../i18n';
|
||||
import { RequestState } from './common'
|
||||
import {
|
||||
getSpeedDials
|
||||
} from '../api/speed-dial';
|
||||
|
||||
export default {
|
||||
namespaced: true,
|
||||
state: {
|
||||
assignedSlots: [],
|
||||
slotOptions: [],
|
||||
speedDialLoadingState: RequestState.initiated,
|
||||
speedDialError: null
|
||||
},
|
||||
getters: {
|
||||
reminderLoadingState(state) {
|
||||
return state.reminderLoadingState;
|
||||
},
|
||||
reminderError(state) {
|
||||
return state.reminderError;
|
||||
},
|
||||
subscriberId(state, getters, rootState, rootGetters) {
|
||||
return rootGetters['user/getSubscriberId'];
|
||||
},
|
||||
assignedSlots(state) {
|
||||
return state.assignedSlots;
|
||||
},
|
||||
speedDialLoadingState(state) {
|
||||
return state.speedDialLoadingState;
|
||||
},
|
||||
speedDialLoadingError(state) {
|
||||
return state.speedDialLoadingError || i18n.t('speedDial.loadSpeedDialErrorMessage');
|
||||
}
|
||||
},
|
||||
mutations: {
|
||||
speedDialRequesting(state) {
|
||||
state.speedDialLoadingState = RequestState.requesting;
|
||||
state.speedDialLoadingError = null;
|
||||
},
|
||||
speedDialSucceeded(state, slots) {
|
||||
state.speedDialLoadingState = RequestState.succeeded;
|
||||
state.assignedSlots = slots;
|
||||
state.speedDialLoadingError = null;
|
||||
},
|
||||
speedDialFailed(state, error) {
|
||||
state.speedDialLoadingState = RequestState.failed;
|
||||
state.speedDialLoadingError = error;
|
||||
}
|
||||
},
|
||||
actions: {
|
||||
loadSpeedDials(context) {
|
||||
context.commit('speedDialRequesting');
|
||||
getSpeedDials(context.getters.subscriberId).then((slots) => {
|
||||
context.commit('speedDialSucceeded', slots);
|
||||
}).catch((error) => {
|
||||
context.commit('speedDialFailed', error);
|
||||
});
|
||||
}
|
||||
}
|
||||
};
|
||||
@ -0,0 +1,99 @@
|
||||
|
||||
'use strict';
|
||||
|
||||
import Vue from 'vue';
|
||||
import VueResource from 'vue-resource';
|
||||
import {
|
||||
getFieldList
|
||||
} from '../../src/api/common';
|
||||
import {
|
||||
getSpeedDials
|
||||
} from '../../src/api/speed-dial';
|
||||
import { assert } from 'chai';
|
||||
|
||||
Vue.use(VueResource);
|
||||
|
||||
describe('Speed Dials', function(){
|
||||
|
||||
const subscriberId = 123;
|
||||
|
||||
it('should get list of subscriber specific speed dials', function(done){
|
||||
|
||||
let data = {
|
||||
"_links" : {
|
||||
"collection" : {
|
||||
"href" : "/api/speeddials/"
|
||||
},
|
||||
"curies" : {
|
||||
"href" : "http://purl.org/sipwise/ngcp-api/#rel-{rel}",
|
||||
"name" : "ngcp",
|
||||
"templated" : true
|
||||
},
|
||||
"ngcp:journal" : [
|
||||
{
|
||||
"href" : "/api/speeddials/323/journal/"
|
||||
}
|
||||
],
|
||||
"ngcp:speeddials" : [
|
||||
{
|
||||
"href" : "/api/speeddials/323"
|
||||
}
|
||||
],
|
||||
"ngcp:subscribers" : [
|
||||
{
|
||||
"href" : "/api/subscribers/323"
|
||||
}
|
||||
],
|
||||
"profile" : {
|
||||
"href" : "http://purl.org/sipwise/ngcp-api/"
|
||||
},
|
||||
"self" : {
|
||||
"href" : "/api/speeddials/323"
|
||||
}
|
||||
},
|
||||
"speeddials" : [
|
||||
{
|
||||
"destination" : "sip:439965050@10.15.17.240",
|
||||
"slot" : "*9"
|
||||
},
|
||||
{
|
||||
"destination" : "sip:22222222@10.15.17.240",
|
||||
"slot" : "*0"
|
||||
},
|
||||
{
|
||||
"destination" : "sip:43665522@10.15.17.240",
|
||||
"slot" : "*3"
|
||||
}
|
||||
]
|
||||
};
|
||||
|
||||
let fieldList = [
|
||||
{
|
||||
"destination" : "sip:22222222@10.15.17.240",
|
||||
"slot" : "*0"
|
||||
},
|
||||
{
|
||||
"destination" : "sip:43665522@10.15.17.240",
|
||||
"slot" : "*3"
|
||||
},
|
||||
{
|
||||
"destination" : "sip:439965050@10.15.17.240",
|
||||
"slot" : "*9"
|
||||
}
|
||||
];
|
||||
|
||||
Vue.http.interceptors = [];
|
||||
Vue.http.interceptors.unshift((request, next)=>{
|
||||
next(request.respondWith(JSON.stringify(data), {
|
||||
status: 200
|
||||
}));
|
||||
});
|
||||
getSpeedDials(subscriberId).then((result)=>{
|
||||
assert.deepEqual(result, fieldList);
|
||||
done();
|
||||
}).catch((err)=>{
|
||||
done(err);
|
||||
});
|
||||
});
|
||||
|
||||
});
|
||||
Loading…
Reference in new issue