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": [
|
"data": [{
|
||||||
{
|
"firstname": "John",
|
||||||
"firstname": "John",
|
"lastname": "Doe",
|
||||||
"lastname": "Doe",
|
"company": "Acme Inc",
|
||||||
"company": "Acme Inc",
|
"home": "4311111",
|
||||||
"home": "4311111",
|
"office": "4311112",
|
||||||
"office": "4311112",
|
"mobile": "4311113",
|
||||||
"mobile": "4311113",
|
"fax": "4311114",
|
||||||
"fax": "4311114",
|
"e_mail": "john@acmetest4.inc",
|
||||||
"e-mail": "john@acmetest4.inc",
|
"homepage": "http://acmetest4.inc"
|
||||||
"homepage": "http://acmetest4.inc"
|
}, {
|
||||||
},
|
"firstname": "Jane",
|
||||||
{
|
"lastname": "Doe",
|
||||||
"firstname": "Jane",
|
"company": "Acme Inc",
|
||||||
"lastname": "Doe",
|
"home": "4322222",
|
||||||
"company": "Acme Inc",
|
"office": "4322223",
|
||||||
"home": "4322222",
|
"mobile": "4322224",
|
||||||
"office": "4322223",
|
"fax": "4322225",
|
||||||
"mobile": "4322224",
|
"e_mail": "jane@acmetest4.inc",
|
||||||
"fax": "4322225",
|
"homepage": "http://acmetest4.inc"
|
||||||
"e-mail": "jane@acmetest4.inc",
|
}, {
|
||||||
"homepage": "http://acmetest4.inc"
|
"firstname": "Frank",
|
||||||
},
|
"lastname": "Costello",
|
||||||
{
|
"company": "Acme Inc",
|
||||||
"firstname": "Frank",
|
"home": "4333333",
|
||||||
"lastname": "Costello",
|
"office": "4333334",
|
||||||
"company": "Acme Inc",
|
"mobile": "4333335",
|
||||||
"home": "4333333",
|
"fax": "4333336",
|
||||||
"office": "4333334",
|
"e_mail": "frank@acmetest4.inc",
|
||||||
"mobile": "4333335",
|
"homepage": "http://acmetest4.inc"
|
||||||
"fax": "4333336",
|
}, {
|
||||||
"e-mail": "frank@acmetest4.inc",
|
"firstname": "Bonny",
|
||||||
"homepage": "http://acmetest4.inc"
|
"lastname": "Johnson",
|
||||||
},
|
"company": "Acme Inc",
|
||||||
{
|
"home": "4344444",
|
||||||
"firstname": "Bonny",
|
"office": "4344445",
|
||||||
"lastname": "Johnson",
|
"mobile": "4344446",
|
||||||
"company": "Acme Inc",
|
"fax": "4344447",
|
||||||
"home": "4344444",
|
"e_mail": "bonny@acmetest4.inc",
|
||||||
"office": "4344445",
|
"homepage": "http://acmetest4.inc"
|
||||||
"mobile": "4344446",
|
}, {
|
||||||
"fax": "4344447",
|
"firstname": "Peter",
|
||||||
"e-mail": "bonny@acmetest4.inc",
|
"lastname": "Wallet",
|
||||||
"homepage": "http://acmetest4.inc"
|
"company": "Acme Inc",
|
||||||
},
|
"home": "4355555",
|
||||||
{
|
"office": "4355556",
|
||||||
"firstname": "Peter",
|
"mobile": "4355557",
|
||||||
"lastname": "Wallet",
|
"fax": "4355558",
|
||||||
"company": "Acme Inc",
|
"e_mail": "peter@acmetest4.inc",
|
||||||
"home": "4355555",
|
"homepage": "http://acmetest4.inc"
|
||||||
"office": "4355556",
|
}]
|
||||||
"mobile": "4355557",
|
|
||||||
"fax": "4355558",
|
|
||||||
"e-mail": "peter@acmetest4.inc",
|
|
||||||
"homepage": "http://acmetest4.inc"
|
|
||||||
}
|
|
||||||
]
|
|
||||||
}
|
}
|
||||||
|
|||||||
@ -1,40 +1,93 @@
|
|||||||
{
|
{
|
||||||
"data": [
|
"data": [{
|
||||||
{
|
"call_type": "call", //('call'|'cfu'|'cfb'|'cft'|'cfna')
|
||||||
"source-cli": "43991001",
|
"source_cli": "43991001",
|
||||||
"duration": 19.488,
|
"duration": 19.488,
|
||||||
"charges": 40.112,
|
"charges": 40.112,
|
||||||
"start_time": "2016-10-07T14:05:33.384000000+02:00"
|
"start_time": "2016-10-18T14:05:33.384000000+02:00"
|
||||||
},
|
}, {
|
||||||
{
|
"call_type": "cfu",
|
||||||
"source-cli": "Reminder",
|
"source_cli": "Reminder",
|
||||||
"duration": 2.000,
|
"duration": 2.000,
|
||||||
"charges": 0.000,
|
"charges": 0.000,
|
||||||
"start_time": "2016-10-07T15:00:53.284000000+02:00"
|
"start_time": "2016-10-13T15:00:53.284000000+02:00"
|
||||||
},
|
}, {
|
||||||
{
|
"call_type": "cfb",
|
||||||
"source-cli": "43991001",
|
"source_cli": "43991001",
|
||||||
"duration": 84.332,
|
"duration": 84.332,
|
||||||
"charges": 15.014,
|
"charges": 15.014,
|
||||||
"start_time": "2016-10-07T15:05:35.384000000+02:00"
|
"start_time": "2016-10-07T15:05:35.384000000+02:00"
|
||||||
},
|
}, {
|
||||||
{
|
"call_type": "cft",
|
||||||
"source-cli": "Voicebox",
|
"source_cli": "Voicebox",
|
||||||
"duration": 11.342,
|
"duration": 11.342,
|
||||||
"charges": 0.000,
|
"charges": 0.000,
|
||||||
"start_time": "2016-10-07T15:45:16.184000000+02:00"
|
"start_time": "2016-10-07T15:45:16.184000000+02:00"
|
||||||
},
|
}, {
|
||||||
{
|
"call_type": "cfna",
|
||||||
"source-cli": "43991007",
|
"source_cli": "43991007",
|
||||||
"duration": 1.023,
|
"duration": 1.023,
|
||||||
"charges": 123.040,
|
"charges": 123.040,
|
||||||
"start_time": "2016-10-07T16:01:33.384000000+02:00"
|
"start_time": "2016-10-07T16:01:33.384000000+02:00"
|
||||||
},
|
}, {
|
||||||
{
|
"call_type": "call",
|
||||||
"source-cli": "43996601",
|
"source_cli": "43991001",
|
||||||
"duration": 125.987,
|
"duration": 19.488,
|
||||||
"charges": 23.010,
|
"charges": 40.112,
|
||||||
"start_time": "2016-10-07T16:05:53.584000000+02:00"
|
"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