mirror of https://github.com/sipwise/ngcp-csc.git
Change-Id: I6ba2d8492d3b2c10084e17991c697dd961c6fe40changes/78/8978/1
Carlo
9 years ago
parent
8776eac375
commit
0b1f572816
@ -1,59 +1,53 @@
|
||||
{
|
||||
"data": [
|
||||
{
|
||||
"firstname": "John",
|
||||
"lastname": "Doe",
|
||||
"company": "Acme Inc",
|
||||
"home": "4311111",
|
||||
"office": "4311112",
|
||||
"mobile": "4311113",
|
||||
"fax": "4311114",
|
||||
"e-mail": "john@acmetest4.inc",
|
||||
"homepage": "http://acmetest4.inc"
|
||||
},
|
||||
{
|
||||
"firstname": "Jane",
|
||||
"lastname": "Doe",
|
||||
"company": "Acme Inc",
|
||||
"home": "4322222",
|
||||
"office": "4322223",
|
||||
"mobile": "4322224",
|
||||
"fax": "4322225",
|
||||
"e-mail": "jane@acmetest4.inc",
|
||||
"homepage": "http://acmetest4.inc"
|
||||
},
|
||||
{
|
||||
"firstname": "Frank",
|
||||
"lastname": "Costello",
|
||||
"company": "Acme Inc",
|
||||
"home": "4333333",
|
||||
"office": "4333334",
|
||||
"mobile": "4333335",
|
||||
"fax": "4333336",
|
||||
"e-mail": "frank@acmetest4.inc",
|
||||
"homepage": "http://acmetest4.inc"
|
||||
},
|
||||
{
|
||||
"firstname": "Bonny",
|
||||
"lastname": "Johnson",
|
||||
"company": "Acme Inc",
|
||||
"home": "4344444",
|
||||
"office": "4344445",
|
||||
"mobile": "4344446",
|
||||
"fax": "4344447",
|
||||
"e-mail": "bonny@acmetest4.inc",
|
||||
"homepage": "http://acmetest4.inc"
|
||||
},
|
||||
{
|
||||
"firstname": "Peter",
|
||||
"lastname": "Wallet",
|
||||
"company": "Acme Inc",
|
||||
"home": "4355555",
|
||||
"office": "4355556",
|
||||
"mobile": "4355557",
|
||||
"fax": "4355558",
|
||||
"e-mail": "peter@acmetest4.inc",
|
||||
"homepage": "http://acmetest4.inc"
|
||||
}
|
||||
]
|
||||
"data": [{
|
||||
"firstname": "John",
|
||||
"lastname": "Doe",
|
||||
"company": "Acme Inc",
|
||||
"home": "4311111",
|
||||
"office": "4311112",
|
||||
"mobile": "4311113",
|
||||
"fax": "4311114",
|
||||
"e_mail": "john@acmetest4.inc",
|
||||
"homepage": "http://acmetest4.inc"
|
||||
}, {
|
||||
"firstname": "Jane",
|
||||
"lastname": "Doe",
|
||||
"company": "Acme Inc",
|
||||
"home": "4322222",
|
||||
"office": "4322223",
|
||||
"mobile": "4322224",
|
||||
"fax": "4322225",
|
||||
"e_mail": "jane@acmetest4.inc",
|
||||
"homepage": "http://acmetest4.inc"
|
||||
}, {
|
||||
"firstname": "Frank",
|
||||
"lastname": "Costello",
|
||||
"company": "Acme Inc",
|
||||
"home": "4333333",
|
||||
"office": "4333334",
|
||||
"mobile": "4333335",
|
||||
"fax": "4333336",
|
||||
"e_mail": "frank@acmetest4.inc",
|
||||
"homepage": "http://acmetest4.inc"
|
||||
}, {
|
||||
"firstname": "Bonny",
|
||||
"lastname": "Johnson",
|
||||
"company": "Acme Inc",
|
||||
"home": "4344444",
|
||||
"office": "4344445",
|
||||
"mobile": "4344446",
|
||||
"fax": "4344447",
|
||||
"e_mail": "bonny@acmetest4.inc",
|
||||
"homepage": "http://acmetest4.inc"
|
||||
}, {
|
||||
"firstname": "Peter",
|
||||
"lastname": "Wallet",
|
||||
"company": "Acme Inc",
|
||||
"home": "4355555",
|
||||
"office": "4355556",
|
||||
"mobile": "4355557",
|
||||
"fax": "4355558",
|
||||
"e_mail": "peter@acmetest4.inc",
|
||||
"homepage": "http://acmetest4.inc"
|
||||
}]
|
||||
}
|
||||
|
||||
@ -1,40 +1,93 @@
|
||||
{
|
||||
"data": [
|
||||
{
|
||||
"source-cli": "43991001",
|
||||
"duration": 19.488,
|
||||
"charges": 40.112,
|
||||
"start_time": "2016-10-07T14:05:33.384000000+02:00"
|
||||
},
|
||||
{
|
||||
"source-cli": "Reminder",
|
||||
"duration": 2.000,
|
||||
"charges": 0.000,
|
||||
"start_time": "2016-10-07T15:00:53.284000000+02:00"
|
||||
},
|
||||
{
|
||||
"source-cli": "43991001",
|
||||
"duration": 84.332,
|
||||
"charges": 15.014,
|
||||
"start_time": "2016-10-07T15:05:35.384000000+02:00"
|
||||
},
|
||||
{
|
||||
"source-cli": "Voicebox",
|
||||
"duration": 11.342,
|
||||
"charges": 0.000,
|
||||
"start_time": "2016-10-07T15:45:16.184000000+02:00"
|
||||
},
|
||||
{
|
||||
"source-cli": "43991007",
|
||||
"duration": 1.023,
|
||||
"charges": 123.040,
|
||||
"start_time": "2016-10-07T16:01:33.384000000+02:00"
|
||||
},
|
||||
{
|
||||
"source-cli": "43996601",
|
||||
"duration": 125.987,
|
||||
"charges": 23.010,
|
||||
"start_time": "2016-10-07T16:05:53.584000000+02:00"
|
||||
}
|
||||
]
|
||||
"data": [{
|
||||
"call_type": "call", //('call'|'cfu'|'cfb'|'cft'|'cfna')
|
||||
"source_cli": "43991001",
|
||||
"duration": 19.488,
|
||||
"charges": 40.112,
|
||||
"start_time": "2016-10-18T14:05:33.384000000+02:00"
|
||||
}, {
|
||||
"call_type": "cfu",
|
||||
"source_cli": "Reminder",
|
||||
"duration": 2.000,
|
||||
"charges": 0.000,
|
||||
"start_time": "2016-10-13T15:00:53.284000000+02:00"
|
||||
}, {
|
||||
"call_type": "cfb",
|
||||
"source_cli": "43991001",
|
||||
"duration": 84.332,
|
||||
"charges": 15.014,
|
||||
"start_time": "2016-10-07T15:05:35.384000000+02:00"
|
||||
}, {
|
||||
"call_type": "cft",
|
||||
"source_cli": "Voicebox",
|
||||
"duration": 11.342,
|
||||
"charges": 0.000,
|
||||
"start_time": "2016-10-07T15:45:16.184000000+02:00"
|
||||
}, {
|
||||
"call_type": "cfna",
|
||||
"source_cli": "43991007",
|
||||
"duration": 1.023,
|
||||
"charges": 123.040,
|
||||
"start_time": "2016-10-07T16:01:33.384000000+02:00"
|
||||
}, {
|
||||
"call_type": "call",
|
||||
"source_cli": "43991001",
|
||||
"duration": 19.488,
|
||||
"charges": 40.112,
|
||||
"start_time": "2016-10-07T14:05:33.384000000+02:00"
|
||||
}, {
|
||||
"call_type": "cfu",
|
||||
"source_cli": "Reminder",
|
||||
"duration": 2.000,
|
||||
"charges": 0.000,
|
||||
"start_time": "2016-10-07T15:00:53.284000000+02:00"
|
||||
}, {
|
||||
"call_type": "cfb",
|
||||
"source_cli": "43991001",
|
||||
"duration": 84.332,
|
||||
"charges": 15.014,
|
||||
"start_time": "2016-10-07T15:05:35.384000000+02:00"
|
||||
}, {
|
||||
"call_type": "cft",
|
||||
"source_cli": "Voicebox",
|
||||
"duration": 11.342,
|
||||
"charges": 0.000,
|
||||
"start_time": "2016-10-07T15:45:16.184000000+02:00"
|
||||
}, {
|
||||
"call_type": "cfna",
|
||||
"source_cli": "43991007",
|
||||
"duration": 1.023,
|
||||
"charges": 123.040,
|
||||
"start_time": "2016-10-07T16:01:33.384000000+02:00"
|
||||
}, {
|
||||
"call_type": "call",
|
||||
"source_cli": "43991001",
|
||||
"duration": 19.488,
|
||||
"charges": 40.112,
|
||||
"start_time": "2016-10-07T14:05:33.384000000+02:00"
|
||||
}, {
|
||||
"call_type": "cfu",
|
||||
"source_cli": "Reminder",
|
||||
"duration": 2.000,
|
||||
"charges": 0.000,
|
||||
"start_time": "2016-10-07T15:00:53.284000000+02:00"
|
||||
}, {
|
||||
"call_type": "cfb",
|
||||
"source_cli": "43991001",
|
||||
"duration": 84.332,
|
||||
"charges": 15.014,
|
||||
"start_time": "2016-10-07T15:05:35.384000000+02:00"
|
||||
}, {
|
||||
"call_type": "cft",
|
||||
"source_cli": "Voicebox",
|
||||
"duration": 11.342,
|
||||
"charges": 0.000,
|
||||
"start_time": "2016-10-07T15:45:16.184000000+02:00"
|
||||
}, {
|
||||
"call_type": "cfna",
|
||||
"source_cli": "43991007",
|
||||
"duration": 1.023,
|
||||
"charges": 123.040,
|
||||
"start_time": "2016-10-01T16:01:33.384000000+02:00"
|
||||
}]
|
||||
}
|
||||
|
||||
@ -0,0 +1,102 @@
|
||||
Ext.define('Ngcp.csc.locales', {
|
||||
statics: {
|
||||
summary: {
|
||||
title: {
|
||||
en: 'Welcome to your personal desktop.'
|
||||
},
|
||||
account_balance: {
|
||||
en: 'ACCOUNT BALANCE'
|
||||
},
|
||||
clients: {
|
||||
en: 'CLIENTS'
|
||||
},
|
||||
clients_label: {
|
||||
en: 'client devices registered'
|
||||
},
|
||||
new_voicemails: {
|
||||
en: 'NEW VOICEMAILS'
|
||||
},
|
||||
call_forwards: {
|
||||
en: 'CALL FORWARDS'
|
||||
},
|
||||
all_voicemails: {
|
||||
en: 'all voicemails'
|
||||
},
|
||||
reminder: {
|
||||
en: 'view settings'
|
||||
}
|
||||
},
|
||||
calls: {
|
||||
section_title: {
|
||||
en: 'Incoming and outgoing calls.'
|
||||
},
|
||||
recent_calls: {
|
||||
en: 'RECENT CALLS'
|
||||
},
|
||||
columns: {
|
||||
number: {
|
||||
en: 'number'
|
||||
},
|
||||
duration: {
|
||||
en: 'duration'
|
||||
},
|
||||
charges: {
|
||||
en: 'charges'
|
||||
},
|
||||
date: {
|
||||
en: 'date'
|
||||
}
|
||||
},
|
||||
call_type: {
|
||||
incoming: {
|
||||
en: 'incoming'
|
||||
},
|
||||
outgoing: {
|
||||
en: 'outgoing'
|
||||
},
|
||||
forwarded: {
|
||||
en: 'forwarded'
|
||||
}
|
||||
},
|
||||
all_calls: {
|
||||
en: 'all calls'
|
||||
}
|
||||
},
|
||||
|
||||
filters: {
|
||||
search: {
|
||||
en: 'SEARCH'
|
||||
},
|
||||
from: {
|
||||
en: 'time range (DD.MM.YYYY)'
|
||||
},
|
||||
to: {
|
||||
en: 'to'
|
||||
},
|
||||
search_term: {
|
||||
en: 'search term'
|
||||
},
|
||||
apply: {
|
||||
en: 'apply filter'
|
||||
},
|
||||
reset: {
|
||||
en: 'reset filter'
|
||||
}
|
||||
},
|
||||
common: {
|
||||
today: {
|
||||
en: 'Today'
|
||||
},
|
||||
|
||||
last_week: {
|
||||
en: 'Last week'
|
||||
},
|
||||
past: {
|
||||
en: 'Past'
|
||||
},
|
||||
no: {
|
||||
en: 'no'
|
||||
}
|
||||
}
|
||||
}
|
||||
})
|
||||
@ -0,0 +1,24 @@
|
||||
Ext.define('NgcpCsc.model.Call', {
|
||||
extend: 'Ext.data.Model',
|
||||
|
||||
fields: [{
|
||||
name: 'call-type',
|
||||
type: 'string'
|
||||
}, {
|
||||
name: 'source-cli',
|
||||
type: 'string'
|
||||
}, {
|
||||
name: 'duration',
|
||||
type: 'string'
|
||||
}, {
|
||||
name: 'charges',
|
||||
type: 'string'
|
||||
}, {
|
||||
name: 'start_time',
|
||||
type: 'string'
|
||||
}, {
|
||||
name: 'timeGroup',
|
||||
type: 'string',
|
||||
persist: false
|
||||
}]
|
||||
});
|
||||
@ -0,0 +1,45 @@
|
||||
Ext.define('NgcpCsc.store.Calls', {
|
||||
extend: 'Ext.data.Store',
|
||||
|
||||
storeId: 'Calls',
|
||||
|
||||
model: 'NgcpCsc.model.Call',
|
||||
|
||||
autoLoad: true,
|
||||
|
||||
groupField: 'timeGroup',
|
||||
|
||||
proxy: {
|
||||
type: 'ajax',
|
||||
url: '/app/data/calls.json',
|
||||
reader: {
|
||||
type: 'json',
|
||||
rootProperty: 'data'
|
||||
}
|
||||
},
|
||||
|
||||
listeners: {
|
||||
load: function(store, recs) {
|
||||
|
||||
var callStartTime,
|
||||
today = new Date(),
|
||||
oneWeekAgo = new Date();
|
||||
|
||||
today.setDate(today.getDate());
|
||||
oneWeekAgo.setDate(oneWeekAgo.getDate() - 7);
|
||||
|
||||
Ext.each(recs, function(rec) {
|
||||
callStartTime = new Date(rec.get('start_time')).getTime();
|
||||
if (callStartTime >= today.getTime()) {
|
||||
rec.set('timeGroup', '1.' + Ngcp.csc.locales.common.today[Ext.manifest.locale])
|
||||
} else if (callStartTime < today.getTime() && callStartTime > oneWeekAgo.getTime()) {
|
||||
rec.set('timeGroup', '2.' + Ngcp.csc.locales.common.last_week[Ext.manifest.locale])
|
||||
} else {
|
||||
rec.set('timeGroup', '3.' + Ngcp.csc.locales.common.past[Ext.manifest.locale])
|
||||
}
|
||||
});
|
||||
this.group();
|
||||
}
|
||||
}
|
||||
|
||||
});
|
||||
@ -0,0 +1,8 @@
|
||||
// mixins
|
||||
|
||||
|
||||
// custom rules
|
||||
.calls-icon {
|
||||
padding-left: 10px;
|
||||
padding-right: 10px;
|
||||
}
|
||||
@ -0,0 +1,9 @@
|
||||
// mixins
|
||||
|
||||
|
||||
// custom rules
|
||||
.fa-rotate-left:before,
|
||||
.fa-exclamation:before {
|
||||
color:$base-color;
|
||||
padding: 0px 10px 0px 0px;
|
||||
}
|
||||
@ -0,0 +1,9 @@
|
||||
// mixins
|
||||
|
||||
|
||||
// custom rules
|
||||
.fa-rotate-left:before,
|
||||
.fa-exclamation:before {
|
||||
color:$base-color;
|
||||
padding: 0px 10px 0px 0px;
|
||||
}
|
||||
@ -0,0 +1,48 @@
|
||||
Ext.define('NgcpCsc.view.common.gridfilters.GridFilters.js', {
|
||||
extend: 'Ext.form.Panel',
|
||||
|
||||
xtype: 'gridfilters',
|
||||
|
||||
controller: 'gridfilters',
|
||||
|
||||
margin: '0 10 0 0',
|
||||
|
||||
items: [{
|
||||
html: Ngcp.csc.locales.filters.search[Ext.manifest.locale],
|
||||
padding: '10 0 10 0'
|
||||
}, {
|
||||
xtype: 'datefield',
|
||||
format: 'd.m.Y',
|
||||
labelAlign: 'top',
|
||||
width: '100%',
|
||||
fieldLabel: Ngcp.csc.locales.filters.from[Ext.manifest.locale],
|
||||
name: 'from_date'
|
||||
}, {
|
||||
xtype: 'datefield',
|
||||
format: 'd.m.Y',
|
||||
width: '100%',
|
||||
name: 'to_date',
|
||||
maxValue: new Date() // limited to the current date or prior
|
||||
}, {
|
||||
xtype: 'textfield',
|
||||
labelAlign: 'top',
|
||||
width: '100%',
|
||||
fieldLabel: Ngcp.csc.locales.filters.search_term[Ext.manifest.locale]
|
||||
}, {
|
||||
layout: 'hbox',
|
||||
margin: '10 0 0 0',
|
||||
defaults: {
|
||||
xtype: 'button',
|
||||
flex: 1
|
||||
},
|
||||
items: [{
|
||||
text: Ngcp.csc.locales.filters.apply[Ext.manifest.locale],
|
||||
margin: '0 5 0 0',
|
||||
handler: 'submitFilters'
|
||||
}, {
|
||||
text: Ngcp.csc.locales.filters.reset[Ext.manifest.locale],
|
||||
handler: 'resetFilters'
|
||||
}]
|
||||
}]
|
||||
|
||||
})
|
||||
@ -0,0 +1,12 @@
|
||||
Ext.define('NgcpCsc.view.common.gridfilters.GridFiltersController', {
|
||||
extend: 'Ext.app.ViewController',
|
||||
alias: 'controller.gridfilters',
|
||||
|
||||
submitFilters: function() {
|
||||
this.getView()._attachedCmp.getStore().load();
|
||||
},
|
||||
|
||||
resetFilters: function() {
|
||||
this.getView().getForm().reset();
|
||||
}
|
||||
});
|
||||
@ -0,0 +1,67 @@
|
||||
Ext.define('NgcpCsc.view.pages.calls.Calls', {
|
||||
extend: 'Ext.panel.Panel',
|
||||
|
||||
xtype: 'calls',
|
||||
|
||||
controller: 'calls',
|
||||
|
||||
layout: {
|
||||
type: 'hbox',
|
||||
align: 'stretch'
|
||||
},
|
||||
|
||||
initComponent: function() {
|
||||
var callsGrid = Ext.create('NgcpCsc.view.pages.calls.CallsGrid');
|
||||
if (!this._isDesktopSection) {
|
||||
this.setTitle(Ngcp.csc.locales.calls.section_title[Ext.manifest.locale]);
|
||||
}
|
||||
this.items = [{
|
||||
flex: 4,
|
||||
defaults: {
|
||||
padding: 20
|
||||
},
|
||||
items: [{
|
||||
html: Ngcp.csc.locales.calls.recent_calls[Ext.manifest.locale],
|
||||
}, {
|
||||
xtype: 'container',
|
||||
anchor: '100%',
|
||||
height: 40,
|
||||
padding: 10,
|
||||
layout: 'hbox',
|
||||
defaults: {
|
||||
xtype: 'container',
|
||||
width: 120,
|
||||
height: 20
|
||||
},
|
||||
items: [{
|
||||
html: Ext.String.format('<span class="fa fa-arrow-circle-up calls-icon"></span><span>{0}</span>', Ngcp.csc.locales.calls.call_type.incoming[Ext.manifest.locale])
|
||||
}, {
|
||||
html: Ext.String.format('<span class="fa fa-arrow-circle-down calls-icon"></span><span>{0}</span>', Ngcp.csc.locales.calls.call_type.outgoing[Ext.manifest.locale])
|
||||
}, {
|
||||
html: Ext.String.format('<span class="fa fa-arrow-circle-right calls-icon"></span><span>{0}</span>', Ngcp.csc.locales.calls.call_type.forwarded[Ext.manifest.locale])
|
||||
}]
|
||||
},
|
||||
callsGrid, {
|
||||
xtype: 'container',
|
||||
anchor: '100%',
|
||||
height: 40,
|
||||
padding: 10,
|
||||
hidden: !this._isDesktopSection,
|
||||
html: Ext.String.format('<div class="link">{0}</div>', Ngcp.csc.locales.calls.all_calls[Ext.manifest.locale]),
|
||||
listeners: {
|
||||
click: {
|
||||
element: 'el',
|
||||
fn: 'showAllCalls'
|
||||
}
|
||||
}
|
||||
}
|
||||
]
|
||||
}, {
|
||||
flex: 1,
|
||||
xtype: 'gridfilters',
|
||||
hidden: this._isDesktopSection,
|
||||
_attachedCmp: callsGrid
|
||||
}];
|
||||
this.callParent();
|
||||
}
|
||||
})
|
||||
@ -0,0 +1,32 @@
|
||||
Ext.define('NgcpCsc.view.pages.calls.CallsController', {
|
||||
extend: 'NgcpCsc.view.pages.summary.SummaryController',
|
||||
|
||||
alias: 'controller.calls',
|
||||
|
||||
renderPhoneIcon: function(value, metaData) {
|
||||
return '<div class="fa fa-phone-square"></div>';
|
||||
},
|
||||
|
||||
renderCallTypeIcons: function(value) {
|
||||
var icon;
|
||||
|
||||
switch (value) {
|
||||
case 'call':
|
||||
icon = 'fa fa-arrow-circle-down';
|
||||
break;
|
||||
case 'cfu':
|
||||
icon = 'fa fa-arrow-circle-up';
|
||||
break;
|
||||
case 'cfb':
|
||||
icon = 'fa fa-arrow-circle-left';
|
||||
break;
|
||||
case 'cft':
|
||||
icon = 'fa fa-arrow-circle-right';
|
||||
break;
|
||||
case 'cfna':
|
||||
icon = 'fa fa-arrow-circle-down';
|
||||
break;
|
||||
};
|
||||
return Ext.String.format('<div class="{0}"></div>', icon);
|
||||
}
|
||||
});
|
||||
@ -0,0 +1,63 @@
|
||||
Ext.define('NgcpCsc.view.pages.calls.CallsGrid', {
|
||||
extend: 'Ext.grid.Panel',
|
||||
|
||||
xtype: 'calls-grid',
|
||||
|
||||
layout: 'fit',
|
||||
|
||||
store: 'Calls',
|
||||
|
||||
// used to toggle grid columns headers visibility
|
||||
_showColHeaders: true,
|
||||
|
||||
features: [{
|
||||
ftype: 'grouping',
|
||||
groupHeaderTpl: [
|
||||
'<div><b>{name:this.formatName}</b></div>', {
|
||||
formatName: function(name) {
|
||||
return name.split('.')[1];
|
||||
}
|
||||
}
|
||||
],
|
||||
}],
|
||||
|
||||
padding: 10,
|
||||
|
||||
initComponent: function() {
|
||||
var summaryView = (window.location.hash.substr(1) == 'desktop');
|
||||
this.columns = {
|
||||
defaults: {
|
||||
menuDisabled: true,
|
||||
resizable: false
|
||||
},
|
||||
items: [{
|
||||
dataIndex: 'call_type',
|
||||
renderer: 'renderCallTypeIcons',
|
||||
width: 30
|
||||
}, {
|
||||
text: (!summaryView) ? Ngcp.csc.locales.calls.columns.number[Ext.manifest.locale] : '',
|
||||
flex: 1,
|
||||
dataIndex: 'source_cli'
|
||||
}, {
|
||||
renderer: 'renderPhoneIcon',
|
||||
width: 30
|
||||
}, {
|
||||
text: (!summaryView) ? Ngcp.csc.locales.calls.columns.duration[Ext.manifest.locale] : '',
|
||||
flex: 1,
|
||||
dataIndex: 'duration'
|
||||
}, {
|
||||
text: (!summaryView) ? Ngcp.csc.locales.calls.columns.charges[Ext.manifest.locale] : '',
|
||||
flex: 1,
|
||||
dataIndex: 'charges'
|
||||
}, {
|
||||
xtype: 'datecolumn',
|
||||
text: (!summaryView) ? Ngcp.csc.locales.calls.columns.date[Ext.manifest.locale] : '',
|
||||
flex: 1,
|
||||
dataIndex: 'start_time',
|
||||
format: 'd-m-Y h:i:s'
|
||||
}]
|
||||
};
|
||||
|
||||
this.callParent();
|
||||
}
|
||||
})
|
||||
@ -0,0 +1,106 @@
|
||||
Ext.define('NgcpCsc.view.pages.summary.Summary', {
|
||||
extend: 'Ext.panel.Panel',
|
||||
|
||||
xtype: 'summary',
|
||||
|
||||
viewModel: 'summary',
|
||||
|
||||
controller: 'summary',
|
||||
|
||||
layout: 'fit',
|
||||
|
||||
title: Ngcp.csc.locales.summary.title[Ext.manifest.locale],
|
||||
|
||||
layout: 'hbox',
|
||||
|
||||
defaults: {
|
||||
flex: 1,
|
||||
padding: 10
|
||||
},
|
||||
|
||||
items: [{
|
||||
flex: 3,
|
||||
padding: 0,
|
||||
items: [{
|
||||
layout: 'fit',
|
||||
xtype: 'calls',
|
||||
_isDesktopSection: true
|
||||
}]
|
||||
}, {
|
||||
defaults: {
|
||||
editable: false,
|
||||
xtype: 'textfield',
|
||||
labelAlign: 'top',
|
||||
padding: '0 20 0 20',
|
||||
width: '90%'
|
||||
},
|
||||
items: [{
|
||||
fieldLabel: Ngcp.csc.locales.summary.account_balance[Ext.manifest.locale],
|
||||
bind: {
|
||||
value: '{initial_balance}',
|
||||
hidden: '{checkInitialBalance}',
|
||||
}
|
||||
}, {
|
||||
fieldLabel: Ngcp.csc.locales.summary.clients[Ext.manifest.locale],
|
||||
bind: {
|
||||
value: '{clients_total_count} ' + Ngcp.csc.locales.summary.clients_label[Ext.manifest.locale]
|
||||
}
|
||||
}, {
|
||||
fieldLabel: Ngcp.csc.locales.summary.new_voicemails[Ext.manifest.locale],
|
||||
bind: {
|
||||
value: '{checkVoiceMails}'
|
||||
}
|
||||
}, {
|
||||
xtype: 'container',
|
||||
height: 40,
|
||||
padding: 10,
|
||||
html: Ext.String.format('<div class="link">{0}</div>', Ngcp.csc.locales.summary.all_voicemails[Ext.manifest.locale]),
|
||||
listeners: {
|
||||
click: {
|
||||
element: 'el',
|
||||
fn: 'showAllVoicemails'
|
||||
}
|
||||
}
|
||||
}]
|
||||
}, {
|
||||
padding: 20,
|
||||
items: [{
|
||||
html: Ngcp.csc.locales.summary.call_forwards[Ext.manifest.locale]
|
||||
}, {
|
||||
padding: 5,
|
||||
bind: {
|
||||
html: '{checkCallFwd}'
|
||||
}
|
||||
}, {
|
||||
xtype: 'container',
|
||||
height: 40,
|
||||
padding: 10,
|
||||
html: Ext.String.format('<div class="link">{0}</div>', Ngcp.csc.locales.summary.reminder[Ext.manifest.locale]),
|
||||
listeners: {
|
||||
click: {
|
||||
element: 'el',
|
||||
fn: 'showCallForward'
|
||||
}
|
||||
}
|
||||
}, {
|
||||
html: Ngcp.csc.locales.summary.clients[Ext.manifest.locale]
|
||||
}, {
|
||||
|
||||
padding: 5,
|
||||
bind: {
|
||||
html: '{checkReminder}'
|
||||
}
|
||||
}, {
|
||||
xtype: 'container',
|
||||
height: 40,
|
||||
padding: 10,
|
||||
html: Ext.String.format('<div class="link">{0}</div>', Ngcp.csc.locales.summary.reminder[Ext.manifest.locale]),
|
||||
listeners: {
|
||||
click: {
|
||||
element: 'el',
|
||||
fn: 'showSettings'
|
||||
}
|
||||
}
|
||||
}]
|
||||
}]
|
||||
});
|
||||
@ -0,0 +1,21 @@
|
||||
Ext.define('NgcpCsc.view.pages.summary.SummaryController', {
|
||||
extend: 'Ext.app.ViewController',
|
||||
|
||||
alias: 'controller.summary',
|
||||
|
||||
showAllCalls: function() {
|
||||
this.redirectTo('#callist');
|
||||
},
|
||||
|
||||
showAllVoicemails: function() {
|
||||
this.redirectTo('#voicebox');
|
||||
},
|
||||
|
||||
showSettings: function() {
|
||||
this.redirectTo('#reminder');
|
||||
},
|
||||
|
||||
showCallForward: function() {
|
||||
this.redirectTo('#callforward/mapping');
|
||||
}
|
||||
});
|
||||
@ -0,0 +1,30 @@
|
||||
Ext.define('NgcpCsc.view.pages.summary.SummaryModel', {
|
||||
extend: 'Ext.app.ViewModel',
|
||||
alias: 'viewmodel.summary',
|
||||
|
||||
data: {
|
||||
initial_balance: 1.123,
|
||||
clients_total_count: 1,
|
||||
voicemails_total_count: 3,
|
||||
call_forward_active: true,
|
||||
reminder: true
|
||||
},
|
||||
|
||||
formulas: {
|
||||
checkInitialBalance: function(get) {
|
||||
return get('initial_balance') == 0;
|
||||
},
|
||||
checkVoiceMails: function(get) {
|
||||
var count;
|
||||
count = (get('voicemails_total_count') == 0) ? Ngcp.csc.locales.common.no[Ext.manifest.locale] : get('voicemails_total_count');
|
||||
return Ext.String.format('{0} {1}', count, Ngcp.csc.locales.summary.new_voicemails[Ext.manifest.locale].toLowerCase());
|
||||
},
|
||||
checkCallFwd: function(get) {
|
||||
var active = get('call_forward_active') ? 'active' : 'inactive';
|
||||
return Ext.String.format('<span class="fa fa-rotate-left fa-3x"></span><span>{0} {1}</span>', Ngcp.csc.locales.summary.call_forwards[Ext.manifest.locale].toLowerCase(), active);
|
||||
},
|
||||
checkReminder: function() {
|
||||
return Ext.String.format('<span class="fa fa-exclamation fa-3x"></span><span>{0}</span>', Ngcp.csc.locales.calls.call_type.forwarded[Ext.manifest.locale]);
|
||||
}
|
||||
}
|
||||
});
|
||||
Loading…
Reference in new issue