diff --git a/src/components/pages/PbxConfiguration/CscPbxDevice.vue b/src/components/pages/PbxConfiguration/CscPbxDevice.vue index ce999d46..6c6edd01 100644 --- a/src/components/pages/PbxConfiguration/CscPbxDevice.vue +++ b/src/components/pages/PbxConfiguration/CscPbxDevice.vue @@ -102,13 +102,11 @@ diff --git a/src/components/pages/PbxConfiguration/CscPbxDeviceConfig.vue b/src/components/pages/PbxConfiguration/CscPbxDeviceConfig.vue index 2cef03e5..8e8572d6 100644 --- a/src/components/pages/PbxConfiguration/CscPbxDeviceConfig.vue +++ b/src/components/pages/PbxConfiguration/CscPbxDeviceConfig.vue @@ -30,67 +30,17 @@
-
- -
-
- {{ selectedKeySetName }}: {{ $t('Lamp/Key') }} {{ selectedKeyNumber }} -
-
-
- - - - -
-
- - {{ $t('Close') }} - -
-
import _ from 'lodash' -import CscPbxAutoAttendantSelection from './CscPbxAutoAttendantSelection' -import { - Platform -} from 'quasar' +import CscPbxDeviceConfigKeyForm from './CscPbxDeviceConfigKeyForm' import { BoundingBox2D } from 'src/helpers/graphics' +import { mapGetters } from 'vuex' export default { name: 'CscPbxDeviceConfig', components: { - CscPbxAutoAttendantSelection + CscPbxDeviceConfigKeyForm }, props: { device: { type: Object, default: null }, - profile: { - type: Object, - default: null - }, model: { type: Object, default: null @@ -130,12 +74,6 @@ export default { type: Object, default: null }, - subscriberOptions: { - type: Array, - default () { - return [] - } - }, subscriberMap: { type: Object, default: null @@ -151,101 +89,13 @@ export default { scaledBoundingBox: null, selectedKey: null, selectedLine: null, - keyOverlayActive: false, - selectedKeyTypeData: null, - selectedLineIndex: null + keyOverlayActive: false } }, computed: { - selectedKeyIcon () { - if (this.selectedLine !== null) { - const subscriber = this.subscriberMap[this.selectedLine.subscriber_id] - if (subscriber !== null && subscriber.is_pbx_pilot === true) { - return 'person_outline' - } else if (subscriber !== null && subscriber.is_pbx_group === true) { - return 'group' - } else if (subscriber !== null) { - return 'person' - } else { - return '' - } - } - return '' - }, - selectedKeySubscriber () { - const unassignedItem = this.subscriberOptions[0] - if (this.selectedLine !== null) { - const selectedOption = this.subscriberOptions.find(opt => opt.value === this.selectedLine.subscriber_id) - return selectedOption || unassignedItem - } - return unassignedItem - }, - selectedKeyType: { - get () { - if (this.selectedLine !== null) { - return this.selectedLine.type - } - return _.get(this.typeOptions, '0.value', '') - }, - set (type) { - this.selectedKeyTypeData = type - } - }, - selectedKeySetName () { - if (this.selectedKey !== null) { - return this.selectedKey.keySet.name - } - return '' - }, - selectedKeyNumber () { - if (this.selectedKey !== null) { - return (this.selectedKey.index + 1) - } - return '' - }, - typeOptions () { - const options = [] - if (this.selectedKey !== null && this.selectedKey.keySet.can_blf) { - options.push({ - label: this.$t('Busy Lamp Field'), - value: 'blf' - }) - } - if (this.selectedKey !== null && this.selectedKey.keySet.can_private) { - options.push({ - label: this.$t('Private'), - value: 'private' - }) - } - if (this.selectedKey !== null && this.selectedKey.keySet.can_shared) { - options.push({ - label: this.$t('Shared'), - value: 'shared' - }) - } - if (this.selectedKey !== null && this.selectedKey.keySet.can_speeddial) { - options.push({ - label: this.$t('SpeedDial'), - value: 'speeddial' - }) - } - if (this.selectedKey !== null && this.selectedKey.keySet.can_forward) { - options.push({ - label: this.$t('Forward'), - value: 'forward' - }) - } - if (this.selectedKey !== null && this.selectedKey.keySet.can_transfer) { - options.push({ - label: this.$t('Transfer'), - value: 'transfer' - }) - } - return options - }, - isMobile () { - return Platform.is.mobile - }, + ...mapGetters('pbxDevices', [ + 'isDeviceLoading' + ]), imageUrl () { return _.get(this.modelImage, 'url', null) }, @@ -265,9 +115,6 @@ export default { }) return keys }, - lines () { - return _.get(this.device, 'lines', []) - }, canvasStyles () { return { width: this.configWidth + 'px' @@ -283,6 +130,9 @@ export default { left: this.imageDeltaX + 'px', width: (this.imageWidth * this.imageScaleFactor) + 'px' } + }, + lines () { + return _.get(this.device, 'lines', []) } }, watch: { @@ -295,7 +145,6 @@ export default { mounted () { this.boundingBox = BoundingBox2D.createFromPoints(this.keys) this.boundingBox.addMargin(40) - this.loadGroupsAndSeats() }, methods: { getLineByKey (key) { @@ -317,8 +166,8 @@ export default { this.placeImage() }, resize () { - this.imageWidth = this.$refs.image.naturalWidth - this.configWidth = this.$refs.config.clientWidth + this.imageWidth = this.$refs.image?.naturalWidth + this.configWidth = this.$refs.config?.clientWidth if (this.boundingBox !== null) { if (this.boundingBox.getWidth() > this.configWidth) { this.imageScaleFactor = this.configWidth / this.boundingBox.getWidth() @@ -404,32 +253,19 @@ export default { this.keyOverlayActive = true this.$scrollTo(this.$parent.$el) }, - closeKeyOverlay () { - this.keyOverlayActive = false - }, - loadGroupsAndSeats () { - this.$emit('loadGroupsAndSeats') - }, - keySubscriberChanged ({ value: subscriberId }) { + onSave(newLine) { const newLines = [] const lines = _.clone(this.lines) const line = this.getLineByKey(this.selectedKey) - let changed = false - if (line !== null && subscriberId === null) { + if (line !== null && newLine.type === null ) { delete lines[line.index] - changed = true } else if (line !== null) { - _.set(lines, line.index + '.subscriber_id', subscriberId) - changed = true - } else if (subscriberId !== null) { - newLines.push({ - extension_unit: 0, - key_num: this.selectedKey.index, - subscriber_id: subscriberId, - linerange: this.selectedKey.keySet.name, - type: this.$refs.selectType.value - }) - changed = true + _.set(lines, line.index + '.subscriber_id', newLine.subscriber_id) + _.set(lines, line.index + '.target_number', newLine.target_number) + _.set(lines, line.index + '.type', newLine.type) + + } else { + newLines.push(newLine) } lines.forEach((line) => { newLines.push({ @@ -437,30 +273,11 @@ export default { key_num: line.key_num, subscriber_id: line.subscriber_id, linerange: line.linerange, - type: line.type + type: line.type, + target_number: line.target_number }) }) - if (changed === true) { - this.$emit('keysChanged', newLines) - } - }, - keyTypeChanged (type) { - const newLines = [] - const lines = _.clone(this.lines) - const line = this.getLineByKey(this.selectedKey) - if (line != null) { - _.set(lines, line.index + '.type', type) - lines.forEach((line) => { - newLines.push({ - extension_unit: line.extension_unit, - key_num: line.key_num, - subscriber_id: line.subscriber_id, - linerange: line.linerange, - type: line.type - }) - }) - this.$emit('keysChanged', newLines) - } + this.$emit('keysChanged', newLines) } } } diff --git a/src/components/pages/PbxConfiguration/CscPbxDeviceConfigKeyForm.vue b/src/components/pages/PbxConfiguration/CscPbxDeviceConfigKeyForm.vue new file mode 100644 index 00000000..0561b082 --- /dev/null +++ b/src/components/pages/PbxConfiguration/CscPbxDeviceConfigKeyForm.vue @@ -0,0 +1,370 @@ + + + \ No newline at end of file diff --git a/src/i18n/en.json b/src/i18n/en.json index d75da262..7b2e62a0 100644 --- a/src/i18n/en.json +++ b/src/i18n/en.json @@ -57,6 +57,7 @@ "Call": "Call", "Call Blocking": "Call Blocking", "Call Forwarding": "Call Forwarding", + "Call Forwards": "Call Forwards", "Call List": "Call List", "Call Queue": "Call Queue", "Call Queue feature": "Call Queue feature", @@ -171,6 +172,7 @@ "Folder : ": "Folder : ", "Forgot password?": "Forgot password?", "Format": "Format", + "Forward": "Forward", "Forward to Auto Attendant": "Forward to Auto Attendant", "Forward to Call Through": "Forward to Call Through", "Forward to Calling Card": "Forward to Calling Card", @@ -246,6 +248,7 @@ "Music on Hold": "Music on Hold", "Music on hold": "Music on hold", "MyNumberList": "MyNumberList", + "N/A": "N/A", "Name": "Name", "Name in Fax Header for Sendfax": "Name in Fax Header for Sendfax", "Never": "Never", @@ -308,6 +311,7 @@ "Play all files in loop": "Play all files in loop", "Please fill or remove the empty slots": "Please fill or remove the empty slots", "Please select an option": "Please select an option", + "Preferences": "Preferences", "Primary Number": "Primary Number", "Privacy": "Privacy", "Private": "Private", @@ -424,6 +428,7 @@ "Sunday": "Sunday", "Super": "Super", "T38": "T38", + "Target number": "Target number", "Th": "Th", "The \"{timeset}\" timeset contains incompatible values. You can resolve this by deleting it and recreating from the scratch.": "The \"{timeset}\" timeset contains incompatible values. You can resolve this by deleting it and recreating from the scratch.", "The Destination Email is already used": "The Destination Email is already used", @@ -437,6 +442,7 @@ "Timerange": "Timerange", "To": "To", "Today": "Today", + "Transfer": "Transfer", "Tu": "Tu", "Tuesday": "Tuesday", "Type": "Type", @@ -458,6 +464,7 @@ "Upload": "Upload", "Use RegExp": "Use RegExp", "Use as default for all seats and groups": "Use as default for all seats and groups", + "Use custom number": "Use custom number", "Use language specific preset": "Use language specific preset", "User Agent": "User Agent", "User settings": "User settings", @@ -550,5 +557,6 @@ "{field} must be at least {minValue} second": "{field} must be at least {minValue} second", "{field} must be maximum of {maxValue} seconds": "{field} must be maximum of {maxValue} seconds", "{field} must consist of numeric characters only": "{field} must consist of numeric characters only", + "{field} must consist only of numeric characters or the symbols * or #.": "{field} must consist only of numeric characters or the symbols * or #.", "{field} must have at most {maxLength} letters": "{field} must have at most {maxLength} letters" } \ No newline at end of file