diff --git a/app/locales.js b/app/locales.js index e89369bb..fe67e08a 100644 --- a/app/locales.js +++ b/app/locales.js @@ -522,6 +522,20 @@ Ext.define('Ngcp.csc.locales', { de: 'Company hours', fr: 'Company hours', sp: 'Company hours' + }, + list_a: { + en: 'List A', + it: 'List A', + de: 'List A', + fr: 'List A', + sp: 'List A' + }, + list_b: { + en: 'List B', + it: 'List B', + de: 'List B', + fr: 'List B', + sp: 'List B' } }, filters: { diff --git a/app/model/CallForwardSourceset.js b/app/model/CallForwardSourceset.js new file mode 100644 index 00000000..38abf23f --- /dev/null +++ b/app/model/CallForwardSourceset.js @@ -0,0 +1,9 @@ +Ext.define('NgcpCsc.model.CallForwardSourceset', { + extend: 'Ext.data.Model', + + fields: [{ + name: 'phone', + type: 'string' + }] + +}); diff --git a/app/store/CallForwardSourceset.js b/app/store/CallForwardSourceset.js new file mode 100644 index 00000000..6353d44a --- /dev/null +++ b/app/store/CallForwardSourceset.js @@ -0,0 +1,10 @@ +Ext.define('NgcpCsc.store.CallForwardSourceset', { + extend: 'Ext.data.Store', + + storeId: 'CallForwardSourceset', + + model: 'NgcpCsc.model.CallForwardSourceset', + + autoLoad: true + +}); diff --git a/classic/sass/src/view/pages/callforward/CallForward.scss b/classic/sass/src/view/pages/callforward/CallForward.scss index 5847ba11..8b0c901e 100644 --- a/classic/sass/src/view/pages/callforward/CallForward.scss +++ b/classic/sass/src/view/pages/callforward/CallForward.scss @@ -4,7 +4,7 @@ ); @include extjs-panel-ui ( - $ui: 'cf-timeset', + $ui: 'cf-widget', ); @include extjs-panel-ui ( @@ -17,7 +17,7 @@ padding-top: 20px; } -.x-panel-cf-timeset { +.x-panel-cf-widget { border: solid 1px; border-color: #d0d0d0; padding: 20px 10px; diff --git a/classic/src/view/pages/callforward/CallForward.js b/classic/src/view/pages/callforward/CallForward.js index 3c81a9b5..da61366c 100644 --- a/classic/src/view/pages/callforward/CallForward.js +++ b/classic/src/view/pages/callforward/CallForward.js @@ -12,12 +12,12 @@ Ext.define('NgcpCsc.view.pages.callforward.CallForward', { title: Ngcp.csc.locales.callforward.title[localStorage.getItem('languageSelected')], initComponent: function () { - var callForwardTimesetAfterGrid = Ext.create('NgcpCsc.view.pages.callforward.CallForwardTimesetGrid', { + var callForwardAfterGrid = Ext.create('NgcpCsc.view.pages.callforward.CallForwardTimesetGrid', { id: 'cf-timeset-after-grid', store: Ext.create('NgcpCsc.store.CallForwardTimeset', { proxy: { type: 'ajax', - url: '/resources/data/callForwardTimesetAfter.json', + url: '/resources/data/callForwardAfter.json', reader: { type: 'json', rootProperty: 'data' @@ -25,12 +25,38 @@ Ext.define('NgcpCsc.view.pages.callforward.CallForward', { } }) }); - var callForwardTimesetCompanyGrid = Ext.create('NgcpCsc.view.pages.callforward.CallForwardTimesetGrid', { + var callForwardCompanyGrid = Ext.create('NgcpCsc.view.pages.callforward.CallForwardTimesetGrid', { id: 'cf-timeset-company-grid', store: Ext.create('NgcpCsc.store.CallForwardTimeset', { proxy: { type: 'ajax', - url: '/resources/data/callForwardTimesetCompany.json', + url: '/resources/data/callForwardCompany.json', + reader: { + type: 'json', + rootProperty: 'data' + } + } + }) + }); + var callForwardListAGrid = Ext.create('NgcpCsc.view.pages.callforward.CallForwardSourcesetGrid', { + id: 'cf-sourceset-list-a-grid', + store: Ext.create('NgcpCsc.store.CallForwardSourceset', { + proxy: { + type: 'ajax', + url: '/resources/data/callForwardListA.json', + reader: { + type: 'json', + rootProperty: 'data' + } + } + }) + }); + var callForwardListBGrid = Ext.create('NgcpCsc.view.pages.callforward.CallForwardSourcesetGrid', { + id: 'cf-sourceset-list-b-grid', + store: Ext.create('NgcpCsc.store.CallForwardSourceset', { + proxy: { + type: 'ajax', + url: '/resources/data/callForwardListB.json', reader: { type: 'json', rootProperty: 'data' @@ -54,15 +80,15 @@ Ext.define('NgcpCsc.view.pages.callforward.CallForward', { }, { xtype: 'core-container', bind: { - title: '{active_widget_form}', - hidden: '{after_hours_form}' + title: '{active_widget}', + hidden: '{after_hours}' }, items: [{ xtype: 'panel', - ui: 'cf-timeset', + ui: 'cf-widget', width: '100%', items: [ - callForwardTimesetAfterGrid, + callForwardAfterGrid, { layout: 'hbox', width: '100%', @@ -85,15 +111,15 @@ Ext.define('NgcpCsc.view.pages.callforward.CallForward', { }, { xtype: 'core-container', bind: { - title: '{active_widget_form}', - hidden: '{company_hours_form}' + title: '{active_widget}', + hidden: '{company_hours}' }, items: [{ xtype: 'panel', - ui: 'cf-timeset', + ui: 'cf-widget', width: '100%', items: [ - callForwardTimesetCompanyGrid, + callForwardCompanyGrid, { layout: 'hbox', width: '100%', @@ -113,6 +139,56 @@ Ext.define('NgcpCsc.view.pages.callforward.CallForward', { } ] }] + }, { + xtype: 'core-container', + bind: { + title: '{active_widget}', + hidden: '{list_a}' + }, + items: [{ + xtype: 'panel', + ui: 'cf-widget', + width: '100%', + items: [ + callForwardListAGrid, + { + html: 'ADD NEW SOURCE', + xtype: 'button', + id: 'addListAButton', + width: 135, + margin: '15 0 0 0', + listeners: { + element: 'el', + click: 'addEmptyRow' + } + } + ] + }] + }, { + xtype: 'core-container', + bind: { + title: '{active_widget}', + hidden: '{list_b}' + }, + items: [{ + xtype: 'panel', + ui: 'cf-widget', + width: '100%', + items: [ + callForwardListBGrid, + { + html: 'ADD NEW SOURCE', + xtype: 'button', + id: 'addListBButton', + width: 135, + margin: '15 0 0 0', + listeners: { + element: 'el', + click: 'addEmptyRow' + } + } + ] + }] }] }, { userCls: 'big-70 small-100', diff --git a/classic/src/view/pages/callforward/CallForwardController.js b/classic/src/view/pages/callforward/CallForwardController.js index 085de0cc..b9bc78da 100644 --- a/classic/src/view/pages/callforward/CallForwardController.js +++ b/classic/src/view/pages/callforward/CallForwardController.js @@ -25,6 +25,10 @@ Ext.define('NgcpCsc.view.pages.callforward.CallForwardController', { rec.set('active', !rec.get('active')); }, + checkIndex: function(button, target) { + return (target.indexOf(button) > -1) === true ? true : false; + }, + addEmptyRow: function (el) { var targetId = el.getTarget().id; function addRowToStore(store) { @@ -34,12 +38,18 @@ Ext.define('NgcpCsc.view.pages.callforward.CallForwardController', { targetStore.add({ "phone": "", "active": false, "ring_for": "0 secs" }); } }; - if (targetId.indexOf('onlineButton') > -1) { + if (this.checkIndex('onlineButton', targetId)) { addRowToStore('CallForwardOnline'); - } else if (targetId.indexOf('busyButton') > -1) { + } else if (this.checkIndex('busyButton', targetId)) { addRowToStore('CallForwardBusy'); - } else if (targetId.indexOf('offlineButton') > -1) { + } else if (this.checkIndex('offlineButton', targetId)) { addRowToStore('CallForwardOffline'); + } else if (this.checkIndex('addListAButton', targetId)) { + var grid = Ext.getCmp('cf-sourceset-list-a-grid'); + addRowToStore(grid.getStore()); + } else if (this.checkIndex('addListBButton', targetId)) { + var grid = Ext.getCmp('cf-sourceset-list-b-grid'); + addRowToStore(grid.getStore()); }; }, @@ -52,20 +62,22 @@ Ext.define('NgcpCsc.view.pages.callforward.CallForwardController', { clickSegmentedButton: function (el) { var targetId = el.getTarget().id; var vm = this.getViewModel(); - vm.set('after_hours_form', true); - vm.set('company_hours_form', true); - vm.set('list_a_form', true); - vm.set('list_b_form', true); - if (targetId.indexOf('afterHoursButton-btnIconEl') > -1) { - vm.set('active_widget_form', Ngcp.csc.locales.callforward.after_hours[localStorage.getItem('languageSelected')]); - vm.set('after_hours_form', false); - } else if (targetId.indexOf('companyHoursButton-btnIconEl') > -1) { - vm.set('active_widget_form', Ngcp.csc.locales.callforward.company_hours[localStorage.getItem('languageSelected')]); - vm.set('company_hours_form', false); - } else if (targetId.indexOf('listAButton-btnIconEl') > -1) { - // TODO - } else if (targetId.indexOf('listAButton-btnIconEl') > -1) { - // TODO + vm.set('after_hours', true); + vm.set('company_hours', true); + vm.set('list_a', true); + vm.set('list_b', true); + if (this.checkIndex('afterHoursButton-btnIconEl', targetId)) { + vm.set('active_widget', Ngcp.csc.locales.callforward.after_hours[localStorage.getItem('languageSelected')]); + vm.set('after_hours', false); + } else if (this.checkIndex('companyHoursButton-btnIconEl', targetId)) { + vm.set('active_widget', Ngcp.csc.locales.callforward.company_hours[localStorage.getItem('languageSelected')]); + vm.set('company_hours', false); + } else if (this.checkIndex('listAButton-btnIconEl', targetId)) { + vm.set('active_widget', Ngcp.csc.locales.callforward.list_a[localStorage.getItem('languageSelected')]); + vm.set('list_a', false); + } else if (this.checkIndex('listBButton-btnIconEl', targetId)) { + vm.set('active_widget', Ngcp.csc.locales.callforward.list_b[localStorage.getItem('languageSelected')]); + vm.set('list_b', false); }; }, @@ -99,6 +111,13 @@ Ext.define('NgcpCsc.view.pages.callforward.CallForwardController', { store.rejectChanges(); grid.reconfigure(store); }; + }, + + removeSourcelistRecord: function(grid, rowIndex, colIndex) { + var store = grid.getStore(); + var rec = grid.getStore().getAt(rowIndex); + store.remove(rec); + this.fireEvent('showmessage', true, Ngcp.csc.locales.common.remove_success[localStorage.getItem('languageSelected')]); } }); diff --git a/classic/src/view/pages/callforward/CallForwardModel.js b/classic/src/view/pages/callforward/CallForwardModel.js index 078192b1..22542edf 100644 --- a/classic/src/view/pages/callforward/CallForwardModel.js +++ b/classic/src/view/pages/callforward/CallForwardModel.js @@ -3,14 +3,14 @@ Ext.define('NgcpCsc.view.pages.callforward.CallForwardModel', { alias: 'viewmodel.callforward', data: { - after_hours_form: true, - company_hours_form: true, - list_a_form: true, - list_b_form: true, + after_hours: true, + company_hours: true, + list_a: true, + list_b: true, online_timeout_hidden: false, busy_timeout_hidden: true, offline_timeout_hidden: true, - active_widget_form: '', + active_widget: '', row_elements_disabled: false } diff --git a/classic/src/view/pages/callforward/CallForwardSourcesetGrid.js b/classic/src/view/pages/callforward/CallForwardSourcesetGrid.js new file mode 100644 index 00000000..a0f6f73f --- /dev/null +++ b/classic/src/view/pages/callforward/CallForwardSourcesetGrid.js @@ -0,0 +1,42 @@ +Ext.define('NgcpCsc.view.pages.callforward.CallForwardSourcesetGrid', { + extend: 'Ext.grid.Panel', + + xtype: 'callforwardsourcesetgrid', + + viewConfig: { + markDirty: false + }, + + plugins: { + ptype: 'cellediting', + clicksToEdit: 1 + }, + + hideHeaders: true, + + initComponent: function() { + this.columns = { + defaults: { + menuDisabled: true, + resizable: false + }, + items: [{ + text: Ngcp.csc.locales.callforward.phone[localStorage.getItem('languageSelected')], + dataIndex: 'phone', + editor: 'textfield', + flex: 1 + }, { + text: Ngcp.csc.locales.common.delete[localStorage.getItem('languageSelected')], + xtype: 'actioncolumn', + width: 30, + align: 'right', + items: [{ + glyph: 'xf1f8@FontAwesome', + handler: 'removeSourcelistRecord' + }] + }] + }; + this.callParent(); + } + +}); diff --git a/resources/data/callForwardTimesetAfter.json b/resources/data/callForwardAfter.json similarity index 100% rename from resources/data/callForwardTimesetAfter.json rename to resources/data/callForwardAfter.json diff --git a/resources/data/callForwardTimesetCompany.json b/resources/data/callForwardCompany.json similarity index 100% rename from resources/data/callForwardTimesetCompany.json rename to resources/data/callForwardCompany.json diff --git a/resources/data/callForwardListA.json b/resources/data/callForwardListA.json new file mode 100644 index 00000000..f8e53fbf --- /dev/null +++ b/resources/data/callForwardListA.json @@ -0,0 +1,15 @@ +{ + "data": [{ + "phone": "43775600", + }, { + "phone": "John Smith", + }, { + "phone": "43770061", + }, { + "phone": "43806402", + }, { + "phone": "Bob Jones", + }, { + "phone": "43806402", + }] +} diff --git a/resources/data/callForwardListB.json b/resources/data/callForwardListB.json new file mode 100644 index 00000000..fbb6afa3 --- /dev/null +++ b/resources/data/callForwardListB.json @@ -0,0 +1,13 @@ +{ + "data": [{ + "phone": "King Cole", + }, { + "phone": "11656143", + }, { + "phone": "Carla James", + }, { + "phone": "43806401", + }, { + "phone": "11656142", + }] +}