What has been done: - TT#29602, CallForwarding: Create UI input form - TT#29603, CallForwarding: Implement API method for add new destination - TT#29604, CallForwarding: Implement store and bindings for add new destination feature Change-Id: I723488e684990c21ee74700cf6e849a5d16cda9cchanges/26/18126/20
raxelsen
7 years ago
committed by
Hans-Peter Herzog
parent
d600aa4a8e
commit
9567594bd1
@ -0,0 +1,170 @@
|
||||
<template>
|
||||
<div class="add-destination-form">
|
||||
<q-btn v-if="!isFormEnabled" flat color="primary" icon="fa-plus">
|
||||
{{ $t('pages.callForward.addDestinationButton') }}
|
||||
<q-popover ref="popover">
|
||||
<q-list separator link>
|
||||
<q-item @click="enableForm('number'),
|
||||
$refs.popover.close()">
|
||||
{{ $t('pages.callForward.buttons.addNumber') }}
|
||||
</q-item>
|
||||
<q-item @click="enableForm('voicebox'),
|
||||
$refs.popover.close()">
|
||||
{{ $t('pages.callForward.buttons.addVoicemail') }}
|
||||
</q-item>
|
||||
<q-item @click="enableForm('fax2mail'),
|
||||
$refs.popover.close()"
|
||||
v-if="hasFaxCapability">
|
||||
{{ $t('pages.callForward.buttons.addFax2Mail') }}
|
||||
</q-item>
|
||||
</q-list>
|
||||
</q-popover>
|
||||
</q-btn>
|
||||
<div v-if="isFormEnabled">
|
||||
<q-field :error="addFormError" :error-label="$t('pages.callForward.addInputError')">
|
||||
<q-input :before="beforeIconDestination" :float-label="$t('pages.callForward.destination')" type="text"
|
||||
v-model="destinationForm.destination" @keyup.enter="addDestination()"
|
||||
:clearable="isFormTypeNumber" :autofocus="isFormTypeNumber"
|
||||
:disable="!isFormTypeNumber || addDestinationIsRequesting" />
|
||||
</q-field>
|
||||
<q-field :error="addFormError"
|
||||
:error-label="$t('pages.callForward.addInputError')">
|
||||
<q-input :before="beforeIconTimeout" :float-label="$t('pages.callForward.timeout')"
|
||||
type="number" v-if="isFormTypeNumber" v-model="destinationForm.timeout"
|
||||
:min="0" :max="600" suffix="seconds" />
|
||||
</q-field>
|
||||
<q-btn flat dark @click="disableForm()">{{ $t('buttons.cancel') }}</q-btn>
|
||||
<q-btn flat color="primary" icon-right="fa-save" @click="addDestination()">{{ $t('buttons.save') }}</q-btn>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
|
||||
import { startLoading, stopLoading,
|
||||
showGlobalError, showToast } from '../../../helpers/ui'
|
||||
import { normalizeTerminationInput } from '../../../filters/number-format'
|
||||
import { mapGetters, mapState } from 'vuex'
|
||||
import { QItem, Toast, QBtn, QSelect, QPopover, QList,
|
||||
QField, QInput, QSlider } from 'quasar-framework'
|
||||
export default {
|
||||
name: 'csc-add-destination-form',
|
||||
props: [
|
||||
'destinations',
|
||||
'id',
|
||||
'groupName',
|
||||
'priority'
|
||||
],
|
||||
data () {
|
||||
return {
|
||||
addFormError: false,
|
||||
formEnabled: false,
|
||||
destinationForm: {
|
||||
destination: '',
|
||||
timeout: 300
|
||||
}
|
||||
}
|
||||
},
|
||||
components: {
|
||||
QSelect,
|
||||
QPopover,
|
||||
QField,
|
||||
QInput,
|
||||
QSlider,
|
||||
QList,
|
||||
QItem,
|
||||
Toast,
|
||||
QBtn
|
||||
},
|
||||
computed: {
|
||||
...mapState('callForward', [
|
||||
'activeForm',
|
||||
'formType',
|
||||
'addDestinationState',
|
||||
'addDestinationError',
|
||||
'lastAddedDestination'
|
||||
]),
|
||||
...mapGetters('callForward', [
|
||||
'hasFaxCapability'
|
||||
]),
|
||||
isFormTypeNumber() {
|
||||
return this.formType === 'number';
|
||||
},
|
||||
isFormEnabled() {
|
||||
return this.activeForm === this.groupName && this.formEnabled;
|
||||
},
|
||||
addDestinationIsRequesting() {
|
||||
return this.addDestinationState === 'requesting';
|
||||
},
|
||||
addDestinationError() {
|
||||
return this.$store.state.callForward.addDestinationError || this.$t('pages.callForward.addErrorMessage');
|
||||
},
|
||||
beforeIconTimeout() {
|
||||
return [{
|
||||
icon: 'schedule'
|
||||
}];
|
||||
},
|
||||
beforeIconDestination() {
|
||||
return [{
|
||||
icon: 'fa-angle-double-right'
|
||||
}];
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
addDestinationState(state) {
|
||||
if (state === 'failed') {
|
||||
stopLoading();
|
||||
showGlobalError(this.addDestinationError);
|
||||
} else if (state === 'succeeded') {
|
||||
stopLoading();
|
||||
showToast(this.$t('pages.callForward.addDestinationSuccessMessage', {
|
||||
destination: this.lastAddedDestination
|
||||
}));
|
||||
this.disableForm();
|
||||
} else if (state === 'button') {
|
||||
stopLoading();
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
enableForm(type) {
|
||||
this.formEnabled = true;
|
||||
this.$store.dispatch('callForward/setFormType', type);
|
||||
this.$store.dispatch('callForward/setActiveForm', this.groupName);
|
||||
this.$store.dispatch('callForward/setDestinationsetId', this.id);
|
||||
this.$store.dispatch('callForward/setGroupName', this.groupName);
|
||||
this.$store.dispatch('callForward/setPriority', this.priority);
|
||||
if (type === 'voicebox') {
|
||||
this.destinationForm.destination = 'Voicemail';
|
||||
} else if (type === 'fax2mail') {
|
||||
this.destinationForm.destination = 'Fax2Mail';
|
||||
} else {
|
||||
this.destinationForm.destination = '';
|
||||
}
|
||||
},
|
||||
disableForm() {
|
||||
this.destinationForm.timeout = 300;
|
||||
this.destinationForm.destination = '';
|
||||
this.formEnabled = false;
|
||||
this.$store.dispatch('callForward/resetFormState');
|
||||
this.$store.dispatch('callForward/resetDestinationState');
|
||||
},
|
||||
addDestination() {
|
||||
startLoading();
|
||||
this.$store.dispatch('callForward/addDestination', {
|
||||
form: this.destinationForm,
|
||||
destinations: this.destinations
|
||||
});
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="stylus">
|
||||
@import '~variables'
|
||||
.add-destination-form
|
||||
margin 0 15px
|
||||
.q-slider.label-always
|
||||
padding 15px 0 5px
|
||||
height 50px
|
||||
</style>
|
||||
@ -0,0 +1,68 @@
|
||||
'use strict';
|
||||
|
||||
import { assert } from 'chai';
|
||||
import numberFormat from '../../src/filters/number-format';
|
||||
import { normalizeNumber, normalizeDestination } from '../../src/filters/number-format';
|
||||
|
||||
const numbers = {
|
||||
valid1: '+43 993 004',
|
||||
valid2: '43993004',
|
||||
valid3: ' 43993004 ',
|
||||
valid4: '+43993004',
|
||||
valid5: '43 993 004',
|
||||
valid6: '4 3 9 9 3 0 0 4',
|
||||
valid7: '+4 3 9 9 3 0 0 4',
|
||||
valid8: ' +43993004 ',
|
||||
invalid1: '43993004+',
|
||||
invalid2: '$43993004',
|
||||
invalid3: 'a43993004',
|
||||
invalid4: 'abcdefghi'
|
||||
};
|
||||
|
||||
const sipUris = {
|
||||
valid1: 'sip:43993004@sipwise.com',
|
||||
invalid1: 'sip:a43993004@sipwise.com'
|
||||
};
|
||||
|
||||
const destinations = {
|
||||
voiceMail: 'sip:vmu@voicebox.local',
|
||||
fax2Mail: 'sip:@fax2mail.local',
|
||||
managerSecretary: 'sip:@managersecretary.local',
|
||||
app: 'sip:app@app.local',
|
||||
customHours: 'sip:custom-hours@app.local',
|
||||
conference: 'sip:@conference.local',
|
||||
number: 'sip:43993004@sipwise.com'
|
||||
};
|
||||
|
||||
describe('NumberFormatFilter', function() {
|
||||
|
||||
it('should normalize phone numbers', function(){
|
||||
assert.equal(normalizeNumber(numbers.valid1), numbers.valid1);
|
||||
assert.equal(normalizeNumber(numbers.valid2), numbers.valid1);
|
||||
assert.equal(normalizeNumber(numbers.valid3), numbers.valid1);
|
||||
assert.equal(normalizeNumber(numbers.valid4), numbers.valid1);
|
||||
assert.equal(normalizeNumber(numbers.valid5), numbers.valid1);
|
||||
assert.equal(normalizeNumber(numbers.valid6), numbers.valid1);
|
||||
assert.equal(normalizeNumber(numbers.valid7), numbers.valid1);
|
||||
assert.equal(normalizeNumber(numbers.valid8), numbers.valid1);
|
||||
assert.equal(normalizeNumber(numbers.invalid1), numbers.invalid1);
|
||||
assert.equal(normalizeNumber(numbers.invalid2), numbers.invalid2);
|
||||
assert.equal(normalizeNumber(numbers.invalid3), numbers.invalid3);
|
||||
assert.equal(normalizeNumber(numbers.invalid4), numbers.invalid4);
|
||||
});
|
||||
|
||||
it('should format a number or sip uri', function(){
|
||||
assert.equal(numberFormat(sipUris.valid1), numbers.valid1);
|
||||
assert.equal(numberFormat(sipUris.invalid1), sipUris.invalid1);
|
||||
});
|
||||
|
||||
it('should format a call forward destination', function(){
|
||||
assert.equal(normalizeDestination(destinations.voiceMail), 'Voicemail');
|
||||
assert.equal(normalizeDestination(destinations.fax2Mail), 'Fax2Mail');
|
||||
assert.equal(normalizeDestination(destinations.managerSecretary), 'Manager Secretary');
|
||||
assert.equal(normalizeDestination(destinations.app), 'App');
|
||||
assert.equal(normalizeDestination(destinations.customHours), 'Custom Announcement');
|
||||
assert.equal(normalizeDestination(destinations.conference), 'Conference');
|
||||
assert.equal(normalizeDestination(destinations.number), numbers.valid1);
|
||||
});
|
||||
});
|
||||
Loading…
Reference in new issue