20180906_jeffrey - silenceuncrio/diary GitHub Wiki
Hourly Usage
目前的 javascript 如下
/*
** hourly
*/
vm.hourly = {};
vm.hourly.data = [ [], [], [], [], [], [] ];
vm.hourly.labels = [
0, 1, 2, 3, 4, 5, 6, 7, 8, 9,
10, 11, 12, 13, 14, 15, 16, 17, 18, 19,
20, 21, 22, 23
];
vm.hourly.options = {
legend: { display: true },
animation: false,
responsive: true,
title:{
display:true,
text:'Hourly Usage'
},
scales: {
xAxes: [{
display: true,
scaleLabel: {
display: true,
labelString: 'Hour'
}
}],
yAxes: [{
display: true,
scaleLabel: {
display: true,
labelString: 'MB'
}
}]
}
};
vm.hourly.colors = ['#0000ff', '#00ff00', '#800080', '#ffff00', '#ffa500', '#ff0000'];
vm.hourly.datasetOverride = [
{
fill: false,
label: "APN1 Rx",
},
{
fill: false,
label: "APN1 Tx",
},
{
fill: false,
label: "APN1 Total",
},
{
fill: false,
label: "APN2 Rx",
},
{
fill: false,
label: "APN2 Tx",
},
{
fill: false,
label: "APN2 Total",
},
]
vm.hourly_usage = function() {
vm.hourly.loading = true;
vm.hourly.no_data = true;
vm.hourly.data = [ [], [], [], [], [], [] ];
vm.hourly.table = [];
icos.usage_display.hourly().then(function(result) {
var hourly_data = result.data.data;
for (var i = 0; i < hourly_data.num; i ++) {
vm.hourly.data[0].push(hourly_data.db_info[0][i].rx);
vm.hourly.data[1].push(hourly_data.db_info[0][i].tx);
vm.hourly.data[2].push(hourly_data.db_info[0][i].tr_total);
vm.hourly.data[3].push(hourly_data.db_info[1][i].rx);
vm.hourly.data[4].push(hourly_data.db_info[1][i].tx);
vm.hourly.data[5].push(hourly_data.db_info[1][i].tr_total);
var xxx = {};
xxx.index = vm.hourly.labels[i]; // tip
xxx.apn1_rx = hourly_data.db_info[0][i].rx;
xxx.apn1_tx = hourly_data.db_info[0][i].tx;
xxx.apn1_total = hourly_data.db_info[0][i].tr_total;
xxx.apn2_rx = hourly_data.db_info[1][i].rx;
xxx.apn2_tx = hourly_data.db_info[1][i].tx;
xxx.apn2_total = hourly_data.db_info[1][i].tr_total;
vm.hourly.table.push(xxx);
}
if (hourly_data.num != 0) {
vm.hourly.no_data = false;
}
vm.hourly.loading = false;
});
}HTML code
<p ng-show="vm.hourly.loading">Loading... <i class="fa fa-spinner fa-pulse fa-fw"></i></p>
<p ng-show="!vm.hourly.loading && vm.hourly.no_data">No Data</p>
<canvas
id="line"
class="chart chart-line"
chart-data="vm.hourly.data"
chart-labels="vm.hourly.labels"
chart-options="vm.hourly.options"
chart-colors="vm.hourly.colors"
chart-dataset-override="vm.hourly.datasetOverride"
ng-show="!vm.hourly.loading && !vm.hourly.no_data"
>
</canvas>
<br /><br />
<table class="table table-bordered table-condensed" ng-show="!vm.hourly.loading && !vm.hourly.no_data">
<thead>
<tr>
<th>Hour</th>
<th>APN1 Rx</th>
<th>APN1 Tx</th>
<th>APN1 Total</th>
<th>APN2 Rx</th>
<th>APN2 Tx</th>
<th>APN2 Total</th>
</tr>
</thead>
<tbody>
<tr ng-repeat="e in vm.hourly.table">
<td>{{e.index}}</td>
<td>{{e.apn1_rx}}</td>
<td>{{e.apn1_tx}}</td>
<td>{{e.apn1_total}}</td>
<td>{{e.apn2_rx}}</td>
<td>{{e.apn2_tx}}</td>
<td>{{e.apn2_total}}</td>
</tr>
</tbody>
</table>網頁呈現的樣子
先來盤一下有什麼可以共用的
- vm.hourly.data
- vm.hourly.labels
- vm.hourly.options
- vm.hourly.colors
- vm.hourly.datasetOverride
vm.hourly.data 不能套用別的
vm.hourly.labels 也不能套用別的
vm.hourly.options 可以套 vm.real_time.options 然後再 update 以下兩個欄位
- vm.hourly.options.title.text = 'Real Time Usage';
- vm.hourly.options.scales.xAxes[0].scaleLabel.labelString = 'Hour';
code 變少 可讀性降低很多 不過可以參考原本 vm.real_time.options
vm.hourly.colors 可以套 vm.real_time.colors
vm.hourly.datasetOverride 可以套 vm.real_time.datasetOverride
先重構來化簡一下 javascrit
diff --git a/proscend/prosrc/www/app/feature/usageDisplay.js b/proscend/prosrc/www/app/feature/usageDisplay.js
index 3e25e01..e0f4ff1 100644
--- a/proscend/prosrc/www/app/feature/usageDisplay.js
+++ b/proscend/prosrc/www/app/feature/usageDisplay.js
@@ -225,60 +225,13 @@ function usageDisplayController($scope, $interval, icos, real_time, info) {
20, 21, 22, 23
];
- vm.hourly.options = {
- legend: { display: true },
- animation: false,
- responsive: true,
- title:{
- display:true,
- text:'Hourly Usage'
- },
- scales: {
- xAxes: [{
- display: true,
- scaleLabel: {
- display: true,
- labelString: 'Hour'
- }
- }],
- yAxes: [{
- display: true,
- scaleLabel: {
- display: true,
- labelString: 'MB'
- }
- }]
- }
- };
+ vm.hourly.options = angular.copy(vm.real_time.options);
+ vm.hourly.options.title.text = 'Hourly Usage';
+ vm.hourly.options.scales.xAxes[0].scaleLabel.labelString = 'Hour';
- vm.hourly.colors = ['#0000ff', '#00ff00', '#800080', '#ffff00', '#ffa500', '#ff0000'];
+ vm.hourly.colors = angular.copy(vm.real_time.colors);
- vm.hourly.datasetOverride = [
- {
- fill: false,
- label: "APN1 Rx",
- },
- {
- fill: false,
- label: "APN1 Tx",
- },
- {
- fill: false,
- label: "APN1 Total",
- },
- {
- fill: false,
- label: "APN2 Rx",
- },
- {
- fill: false,
- label: "APN2 Tx",
- },
- {
- fill: false,
- label: "APN2 Total",
- },
- ]
+ vm.hourly.datasetOverride = angular.copy(vm.real_time.datasetOverride);
vm.hourly_usage = function() {先 commit
commit 4f5cdd02c2593af6f1d534f4011140082e92cd5a
Refs: [develop]
Author: jeffrey <[email protected]>
Date: Thu Sep 6 09:49:02 2018 +0800
refactoring:
- combine the common part of 'vm.hourly' and 'vm.real_time'
proscend/prosrc/www/app/feature/usageDisplay.js | 57 +++----------------------
1 file changed, 5 insertions(+), 52 deletions(-)
重構之後的樣子
上半部的圖 APN1 和 APN2 可以各一個
不過 下半部的 table 倒是可以共用
javascript 的修改
diff --git a/proscend/prosrc/www/app/feature/usageDisplay.js b/proscend/prosrc/www/app/feature/usageDisplay.js
index 3588f1d..28bd011 100644
--- a/proscend/prosrc/www/app/feature/usageDisplay.js
+++ b/proscend/prosrc/www/app/feature/usageDisplay.js
@@ -217,17 +217,19 @@ function usageDisplayController($scope, $interval, icos, real_time, info) {
vm.hourly = {};
- vm.hourly.data = [ [], [], [], [], [], [] ];
-
vm.hourly.labels = [
0, 1, 2, 3, 4, 5, 6, 7, 8, 9,
10, 11, 12, 13, 14, 15, 16, 17, 18, 19,
20, 21, 22, 23
];
- vm.hourly.options = angular.copy(vm.real_time.options);
- vm.hourly.options.title.text = 'Hourly Usage';
- vm.hourly.options.scales.xAxes[0].scaleLabel.labelString = 'Hour';
+ vm.hourly.options_apn1 = angular.copy(vm.real_time.options);
+ vm.hourly.options_apn1.title.text = 'APN1 Hourly Usage';
+ vm.hourly.options_apn1.scales.xAxes[0].scaleLabel.labelString = 'Hour';
+
+ vm.hourly.options_apn2 = angular.copy(vm.real_time.options);
+ vm.hourly.options_apn2.title.text = 'APN2 Hourly Usage';
+ vm.hourly.options_apn2.scales.xAxes[0].scaleLabel.labelString = 'Hour';
vm.hourly.colors = angular.copy(vm.real_time.colors);
@@ -238,18 +240,27 @@ function usageDisplayController($scope, $interval, icos, real_time, info) {
vm.hourly.loading = true;
vm.hourly.no_data = true;
- vm.hourly.data = [ [], [], [], [], [], [] ];
+ vm.hourly.data = [
+ [
+ [], [], [],
+ ],
+ [
+ [], [], [],
+ ],
+ ];
vm.hourly.table = [];
icos.usage_display.hourly().then(function(result) {
var hourly_data = result.data.data;
for (var i = 0; i < hourly_data.num; i ++) {
- vm.hourly.data[0].push(hourly_data.db_info[0][i].rx);
- vm.hourly.data[1].push(hourly_data.db_info[0][i].tx);
- vm.hourly.data[2].push(hourly_data.db_info[0][i].tr_total);
- vm.hourly.data[3].push(hourly_data.db_info[1][i].rx);
- vm.hourly.data[4].push(hourly_data.db_info[1][i].tx);
- vm.hourly.data[5].push(hourly_data.db_info[1][i].tr_total);
+
+ vm.hourly.data[0][0].push(hourly_data.db_info[0][i].rx);
+ vm.hourly.data[0][1].push(hourly_data.db_info[0][i].tx);
+ vm.hourly.data[0][2].push(hourly_data.db_info[0][i].tr_total);
+
+ vm.hourly.data[1][0].push(hourly_data.db_info[1][i].rx);
+ vm.hourly.data[1][1].push(hourly_data.db_info[1][i].tx);
+ vm.hourly.data[1][2].push(hourly_data.db_info[1][i].tr_total);
var xxx = {};
xxx.index = vm.hourly.labels[i]; // tipHTML 的修改
diff --git a/proscend/prosrc/www/app/feature/usageDisplay.html b/proscend/prosrc/www/app/feature/usageDisplay.html
index ae18cea..ec6efe8 100644
--- a/proscend/prosrc/www/app/feature/usageDisplay.html
+++ b/proscend/prosrc/www/app/feature/usageDisplay.html
@@ -129,9 +129,23 @@
<canvas
id="line"
class="chart chart-line"
- chart-data="vm.hourly.data"
+ chart-data="vm.hourly.data[0]" ^M
chart-labels="vm.hourly.labels"
- chart-options="vm.hourly.options"
+ chart-options="vm.hourly.options_apn1" ^M
+ chart-colors="vm.hourly.colors" ^M
+ chart-dataset-override="vm.hourly.datasetOverride"^M
+ ng-show="!vm.hourly.loading && !vm.hourly.no_data"^M
+ > ^M
+ </canvas> ^M
+^M
+ <br />^M
+^M
+ <canvas ^M
+ id="line" ^M
+ class="chart chart-line" ^M
+ chart-data="vm.hourly.data[1]" ^M
+ chart-labels="vm.hourly.labels" ^M
+ chart-options="vm.hourly.options_apn2" ^M
chart-colors="vm.hourly.colors"
chart-dataset-override="vm.hourly.datasetOverride"
ng-show="!vm.hourly.loading && !vm.hourly.no_data"
@@ -144,13 +158,17 @@
<thead>
<tr>
- <th>Hour</th>
- <th>APN1 Rx</th>
- <th>APN1 Tx</th>
- <th>APN1 Total</th>
- <th>APN2 Rx</th>
- <th>APN2 Tx</th>
- <th>APN2 Total</th>
+ <th rowspan="2">Hour</th>^M
+ <th colspan="3">APN1</th>^M
+ <th colspan="3">APN2</th>^M
+ </tr>^M
+ <tr>^M
+ <th>Download</th>^M
+ <th>Upload</th>^M
+ <th>Total</th>^M
+ <th>Download</th>^M
+ <th>Upload</th>^M
+ <th>Total</th>^M
</tr>
</thead>效果如下
commit
commit b4d46731221327f7d24994da89c36a58dff4e8bf
Refs: [develop], {origin/develop}
Author: jeffrey <[email protected]>
Date: Thu Sep 6 10:17:50 2018 +0800
display the chart of APN1 and APN2 individually at tab 'Hourly' but use the same summary table
proscend/prosrc/www/app/feature/usageDisplay.html | 36 +++++++++++++++++------
proscend/prosrc/www/app/feature/usageDisplay.js | 35 ++++++++++++++--------
2 files changed, 50 insertions(+), 21 deletions(-)
ariel 希望從 menu 開始就把 APN1 和 APN2 分開
diff --git a/proscend/prosrc/www/app/locale-en.json b/proscend/prosrc/www/app/locale-en.json
index 0f64027..3568a8d 100644
--- a/proscend/prosrc/www/app/locale-en.json
+++ b/proscend/prosrc/www/app/locale-en.json
@@ -211,6 +211,9 @@
"MENU_LTE_ENGINEER": "Engineer",
+ "MENU_LTE_USAGE_APN1": "APN1 Usage",^M
+ "MENU_LTE_USAGE_APN2": "APN2 Usage",^M
+^M
"_comment": "login page",
diff --git a/proscend/prosrc/www/app/locale-fr.json b/proscend/prosrc/www/app/locale-fr.json
index 39250b1..9920ed2 100644
--- a/proscend/prosrc/www/app/locale-fr.json
+++ b/proscend/prosrc/www/app/locale-fr.json
@@ -211,6 +211,9 @@
"MENU_LTE_ENGINEER": "Engineer",
+ "MENU_LTE_USAGE_APN1": "APN1 Usage",^M
+ "MENU_LTE_USAGE_APN2": "APN2 Usage",^M
+^M
"_comment": "login page",
diff --git a/proscend/prosrc/www/app/locale-zh-tw.json b/proscend/prosrc/www/app/locale-zh-tw.json
index e398c6e..ad3ddc4 100644
--- a/proscend/prosrc/www/app/locale-zh-tw.json
+++ b/proscend/prosrc/www/app/locale-zh-tw.json
@@ -211,6 +211,9 @@
"MENU_LTE_ENGINEER": "Engineer",
+ "MENU_LTE_USAGE_APN1": "APN1 Usage",^M
+ "MENU_LTE_USAGE_APN2": "APN2 Usage",^M
+^M
"_comment": "login page",
diff --git a/proscend/prosrc/www/src/menu.html.src b/proscend/prosrc/www/src/menu.html.src
index 323aebb..ccc722a 100644
--- a/proscend/prosrc/www/src/menu.html.src
+++ b/proscend/prosrc/www/src/menu.html.src
@@ -96,6 +96,8 @@
#endif
<a href="#usageDisplay" class="list-group-item">{{ 'MENU_LTE_USAGE_DISPLAY' | translate }}</a>
+ <a href="#usage_apn1" class="list-group-item">{{ 'MENU_LTE_USAGE_APN1' | translate }}</a>
+ <a href="#usage_apn2" class="list-group-item">{{ 'MENU_LTE_USAGE_APN2' | translate }}</a>
<a href="#sms" class="list-group-item">{{ 'MENU_LTE_SMS' | translate }}</a>
<a href="#engineer" class="list-group-item">{{ 'MENU_LTE_ENGINEER' | translate }}</a>
<a href="#dnsLte" class="list-group-item">{{ 'MENU_LTE_DNS' | translate }}</a>效果
commit 但不要 push
commit 890e897e522fe187d0cb70c9c17aa5a088aba0f1
Refs: [develop]
Author: jeffrey <[email protected]>
Date: Thu Sep 6 11:01:49 2018 +0800
dual APN have their own APN Usage web page:
- LTE / APN1 Usage
- LTE / APN2 Usage
proscend/prosrc/www/app/locale-en.json | 3 +++
proscend/prosrc/www/app/locale-fr.json | 3 +++
proscend/prosrc/www/app/locale-zh-tw.json | 3 +++
proscend/prosrc/www/src/menu.html.src | 2 ++
4 files changed, 11 insertions(+)
usage_apn1 與 usage_apn2 這兩個 path 有他們個別的 route
趁這個機會重構一下
➜ M360P git:(develop) ✗ git status
On branch develop
Your branch is ahead of 'origin/develop' by 1 commit.
(use "git push" to publish your local commits)
Changes not staged for commit:
(use "git add <file>..." to update what will be committed)
(use "git checkout -- <file>..." to discard changes in working directory)
modified: proscend/prosrc/www/src/index.html.src
Untracked files:
(use "git add <file>..." to include in what will be committed)
proscend/prosrc/www/app/feature/usage_apn1.html
proscend/prosrc/www/app/feature/usage_apn1.js
proscend/prosrc/www/app/feature/usage_apn2.html
proscend/prosrc/www/app/feature/usage_apn2.js
no changes added to commit (use "git add" and/or "git commit -a")
proscend/prosrc/www/src/index.html.src
@@ -126,6 +126,8 @@
<script src="app/feature/ssh.js"></script>
<script src="app/feature/dnsLte.js"></script>
<script src="app/feature/engineer.js"></script>
+<script src="app/feature/usage_apn1.js"></script>
+<script src="app/feature/usage_apn2.js"></script>
</head>proscend/prosrc/www/app/feature/usage_apn1.js
(function() {
'use strict';
angular.module('app').config(config);
angular.module('app').controller('usage_apn1', controller);
function config($routeProvider) {
$routeProvider
.when("/usage_apn1", {
templateUrl: 'app/feature/usage_apn1.html',
controller: 'usage_apn1',
controllerAs: 'vm',
})
};
function controller() {
var vm = this;
console.log('usage_apn1');
}
})();proscend/prosrc/www/app/feature/usage_apn1.html
<div class="panel panel-primary">
<div class="panel-heading">
<h4 class="panel-title">
<i class="fa fa-signal fa-fw"></i> {{ 'USAGE_DISPLAY_PANEL_TITLE' | translate }}
</h4>
</div>
<div class="panel-body">
<h2>usage_apn1</h2>
<form class="form-horizontal">
</form>
</div>
</div>成果如下
先 commit 但不 push
commit b01148d898d301b034c553f70dee7a4f71b7756b
Refs: [develop]
Author: jeffrey <[email protected]>
Date: Thu Sep 6 11:34:11 2018 +0800
dual APN have their own APN Usage web page:
- basic controller and template
proscend/prosrc/www/app/feature/usage_apn1.html | 21 +++++++++++++++++++
proscend/prosrc/www/app/feature/usage_apn1.js | 27 +++++++++++++++++++++++++
proscend/prosrc/www/app/feature/usage_apn2.html | 21 +++++++++++++++++++
proscend/prosrc/www/app/feature/usage_apn2.js | 27 +++++++++++++++++++++++++
proscend/prosrc/www/src/index.html.src | 2 ++
5 files changed, 98 insertions(+)
改一下 panel title
diff --git a/proscend/prosrc/www/app/feature/usage_apn1.html b/proscend/prosrc/www/app/feature/usage_apn1.html
index 5b9c38e..5dafc4f 100644
--- a/proscend/prosrc/www/app/feature/usage_apn1.html
+++ b/proscend/prosrc/www/app/feature/usage_apn1.html
@@ -2,7 +2,7 @@
<div class="panel panel-primary">
<div class="panel-heading">
<h4 class="panel-title">
- <i class="fa fa-signal fa-fw"></i> {{ 'USAGE_DISPLAY_PANEL_TITLE' | translate }}
+ <i class="fa fa-signal fa-fw"></i> {{ 'USAGE_APN1_PANEL_TITLE' | translate }}^M
</h4>
</div>
diff --git a/proscend/prosrc/www/app/feature/usage_apn2.html b/proscend/prosrc/www/app/feature/usage_apn2.html
index 1df1353..4e774ae 100644
--- a/proscend/prosrc/www/app/feature/usage_apn2.html
+++ b/proscend/prosrc/www/app/feature/usage_apn2.html
@@ -2,7 +2,7 @@
<div class="panel panel-primary">
<div class="panel-heading">
<h4 class="panel-title">
- <i class="fa fa-signal fa-fw"></i> {{ 'USAGE_DISPLAY_PANEL_TITLE' | translate }}
+ <i class="fa fa-signal fa-fw"></i> {{ 'USAGE_APN2_PANEL_TITLE' | translate }}^M
</h4>
</div>
diff --git a/proscend/prosrc/www/app/locale-en.json b/proscend/prosrc/www/app/locale-en.json
index 3568a8d..1dd6912 100644
--- a/proscend/prosrc/www/app/locale-en.json
+++ b/proscend/prosrc/www/app/locale-en.json
@@ -1207,6 +1207,8 @@
"USAGE_DISPLAY_IMSI": "IMSI",
"USAGE_DISPLAY_APN1": "APN1",
"USAGE_DISPLAY_APN2": "APN2",
+ "USAGE_APN1_PANEL_TITLE": "APN1 Usage",^M
+ "USAGE_APN2_PANEL_TITLE": "APN1 Usage",^M
...
commit
commit de0d5321ad32a1ec7626c088e11a915fa1eecaa8
Refs: [develop]
Author: jeffrey <[email protected]>
Date: Thu Sep 6 13:10:15 2018 +0800
dual APN have their own APN Usage web page:
- modify the title of panel
proscend/prosrc/www/app/feature/usage_apn1.html | 2 +-
proscend/prosrc/www/app/feature/usage_apn2.html | 2 +-
proscend/prosrc/www/app/locale-en.json | 2 ++
proscend/prosrc/www/app/locale-fr.json | 2 ++
proscend/prosrc/www/app/locale-zh-tw.json | 2 ++
5 files changed, 8 insertions(+), 2 deletions(-)
先搬 real time 的部分
proscend/prosrc/www/app/feature/usage_apn1.html
@@ -1,21 +1,103 @@
-
-<div class="panel panel-primary">
- <div class="panel-heading">
- <h4 class="panel-title">
- <i class="fa fa-signal fa-fw"></i> {{ 'USAGE_APN1_PANEL_TITLE' | translate }}
- </h4>
- </div>
-
- <div class="panel-body">
-
-<h2>usage_apn1</h2>
-
-<form class="form-horizontal">
-
-</form>
-
- </div>
-
-</div>
-
-
+
+<div class="panel panel-primary">
+ <div class="panel-heading">
+ <h4 class="panel-title">
+ <i class="fa fa-signal fa-fw"></i> {{ 'USAGE_APN1_PANEL_TITLE' | translate }}
+ </h4>
+ </div>
+
+ <div class="panel-body">
+
+<form class="form-horizontal">
+
+ <div class="form-group">
+ <div class="col-sm-4">
+ <p class="form-control-static">
+ {{ 'DUAL_SIM_LTE_NET_MODE' | translate }}: {{vm.lte_net_toLanKey(vm.info.lte_net) | translate}}</p>
+ </div>
+ <div class="col-sm-4">
+ <p class="form-control-static">{{ 'USAGE_DISPLAY_OPERATOR_NAME' | translate }}: {{ vm.info.modem_operator_name }}</p>
+ </div>
+ <div class="col-sm-4">
+ <p class="form-control-static">{{ 'USAGE_DISPLAY_IMSI' | translate }}: {{ vm.info.modem_sim_imsi }}</p>
+ </div>
+ </div>
+
+
+ <br />
+
+ <ul class="form-group nav nav-tabs">
+ <li><a> </a></li>
+ <li class="active">
+ <a data-toggle="tab" data-target="#real_time">
+ {{ 'USAGE_DISPLAY_REAL_TIME' | translate }}
+ </a>
+ </li>
+ <li>
+ <a data-toggle="tab" data-target="#hourly" ng-click="vm.hourly_usage()">
+ {{ 'USAGE_DISPLAY_HOURLY' | translate }}
+ </a>
+ </li>
+ <li>
+ <a data-toggle="tab" data-target="#daily" ng-click="vm.daily_usage()">
+ {{ 'USAGE_DISPLAY_DAILY' | translate }}
+ </a>
+ </li>
+ <li>
+ <a data-toggle="tab" data-target="#weekly" ng-click="vm.weekly_usage()">
+ {{ 'USAGE_DISPLAY_WEEKLY' | translate }}
+ </a>
+ </li>
+ <li>
+ <a data-toggle="tab" data-target="#monthly" ng-click="vm.monthly_usage()">
+ {{ 'USAGE_DISPLAY_MONTHLY' | translate }}
+ </a>
+ </li>
+ </ul>
+
+ <br /><br />
+
+ <div class="tab-content">
+
+
+
+ <div id="real_time" class="tab-pane fade in active">
+
+ <canvas
+ id="line"
+ class="chart chart-line"
+ chart-data="vm.real_time_difference.data"
+ chart-labels="vm.real_time_difference.labels"
+ chart-options="vm.real_time_difference.options"
+ chart-colors="vm.real_time_difference.colors"
+ chart-dataset-override="vm.real_time_difference.datasetOverride" ></canvas>
+
+ <br />
+
+
+ <canvas
+ id="line"
+ class="chart chart-line"
+ chart-data="vm.real_time.data"
+ chart-labels="vm.real_time.labels"
+ chart-options="vm.real_time.options"
+ chart-colors="vm.real_time.colors"
+ chart-dataset-override="vm.real_time.datasetOverride" ></canvas>
+
+ </div>
+
+
+
+
+
+
+
+
+
+ </div>
+
+</form>
+
+ </div>
+
+</div>
+
+proscend/prosrc/www/app/feature/usage_apn1.js
@@ -13,13 +13,148 @@ function config($routeProvider) {
templateUrl: 'app/feature/usage_apn1.html',
controller: 'usage_apn1',
controllerAs: 'vm',
+ resolve: {
+ real_time: function(icos) {
+ return icos.usage_display.real_time().then(function(result) {
+ return result.data.real_time;
+ });
+ },
+ info: function(icos) {
+ return icos.usage_display.info().then(function(result) {
+ return result.data.info;
+ });
+ },
+ },
})
};
-function controller() {
+function controller($scope, $interval, icos, real_time, info) {
var vm = this;
- console.log('usage_apn1');
+ vm._real_time = real_time;
+ vm.info = info;
+
+ vm.lte_net_toLanKey = function(val) {
+ switch(val) {
+ case 0: return "DUAL_SIM_LTE_NET_MODE_DUAL_APN";
+ case 1: return "DUAL_SIM_LTE_NET_MODE_BRIDGE_ONLY";
+ case 2: return "DUAL_SIM_LTE_NET_MODE_ROUTE_ONLY";
+ case 3: return "DUAL_SIM_LTE_NET_MODE_DUAL_ROUTER";
+ default: return "NA";
+ }
+ }
+
+
+
+ vm.chart_template = {};
+
+ vm.chart_template.options = {
+ legend: { display: true },
+ animation: false,
+ responsive: true,
+ title:{
+ display:true,
+ text:'Chart Title'
+ },
+ scales: {
+ xAxes: [{
+ display: true,
+ scaleLabel: {
+ display: true,
+ labelString: 'xAxes Lable'
+ }
+ }],
+ yAxes: [{
+ display: true,
+ scaleLabel: {
+ display: true,
+ labelString: 'yAxes Lable'
+ }
+ }]
+ }
+ }
+
+ vm.chart_template.colors = ['#0000ff', '#00ff00', '#800080'];
+
+ vm.chart_template.datasetOverride = [
+ { fill: false, label: "Download", },
+ { fill: false, label: "Upload", },
+ { fill: false, label: "Total", },
+ ]
+
+
+
+ vm.real_time = {};
+ vm.real_time_difference = {};
+
+ vm.real_time.data = [
+ [vm._real_time.apn0_month_rx], [vm._real_time.apn0_month_tx], [vm._real_time.apn0_DisplayTotal],
+ ];
+ vm.real_time_difference.data = [ [0], [0], [0], ];
+
+ vm.real_time.labels = [
+ 60, 58, 56, 54, 52, 50, 48, 46, 44, 42,
+ 40, 38, 36, 34, 32, 30, 28, 26, 24, 22,
+ 20, 18, 16, 14, 12, 10, 8, 6, 4, 2
+ ];
+ vm.real_time_difference.labels = angular.copy(vm.real_time.labels);
+
+ vm.real_time.options = angular.copy(vm.chart_template.options);
+ vm.real_time.options.title.text = 'Real Time Usage';
+ vm.real_time.options.scales.xAxes[0].scaleLabel.labelString = 'Window Size (60 Seconds)';
+ vm.real_time.options.scales.yAxes[0].scaleLabel.labelString = 'MB';
+
+ vm.real_time_difference.options = angular.copy(vm.chart_template.options);
+ vm.real_time_difference.options.title.text = 'Real Time Usage Rate';
+ vm.real_time_difference.options.scales.xAxes[0].scaleLabel.labelString = 'Window Size (60 Seconds)';
+ vm.real_time_difference.options.scales.yAxes[0].scaleLabel.labelString = 'MB';
+
+ vm.real_time.colors = angular.copy(vm.chart_template.colors);
+ vm.real_time_difference.colors = angular.copy(vm.chart_template.colors);
+
+ vm.real_time.datasetOverride = angular.copy(vm.chart_template.datasetOverride);
+ vm.real_time_difference.datasetOverride = angular.copy(vm.chart_template.datasetOverride);
+
+ function updateTime() {
+ icos.usage_display.real_time().then(function(result) {
+
+ vm.real_time.data[0].push(result.data.real_time.apn0_month_rx);
+ vm.real_time.data[1].push(result.data.real_time.apn0_month_tx);
+ vm.real_time.data[2].push(result.data.real_time.apn0_DisplayTotal);
+ for (var i = 0; i < vm.real_time.data.length; i ++) {
+ if (vm.real_time.data[i].length > 30) {
+ vm.real_time.data[i].shift();
+ }
+ }
+
+ vm.real_time_difference.data[0].push(
+ ( vm.real_time.data[0][vm.real_time.data[0].length - 1] -
+ vm.real_time.data[0][vm.real_time.data[0].length - 2]) / 2
+ );
+ vm.real_time_difference.data[1].push(
+ ( vm.real_time.data[1][vm.real_time.data[1].length - 1] -
+ vm.real_time.data[1][vm.real_time.data[1].length - 2]) / 2
+ );
+ vm.real_time_difference.data[2].push(
+ ( vm.real_time.data[2][vm.real_time.data[2].length - 1] -
+ vm.real_time.data[2][vm.real_time.data[2].length - 2]) / 2
+ );
+ for (var i = 0; i < vm.real_time_difference.data.length; i ++) {
+ if (vm.real_time_difference.data[i].length > 30) {
+ vm.real_time_difference.data[i].shift();
+ }
+ }
+ });
+ }
+
+ var stopTime = $interval(updateTime, 2000);
+
+ $scope.$on("$destroy", function (event) {
+ $interval.cancel(stopTime);
+ });
+
+
+
}網頁呈現的樣子
雖然有點多
不過都是驗證過的 code
commit 先
commit 4c3ebd04e842b453ba13e749df4b91771012d2b3
Refs: [develop]
Author: jeffrey <[email protected]>
Date: Thu Sep 6 13:54:28 2018 +0800
dual APN have their own APN Usage web page:
- add 'Real Time' tab for 'APN1 Usage'
proscend/prosrc/www/app/feature/usage_apn1.html | 124 +++++++++++++++++----
proscend/prosrc/www/app/feature/usage_apn1.js | 139 +++++++++++++++++++++++-
2 files changed, 240 insertions(+), 23 deletions(-)
再來是 Hourly
proscend/prosrc/www/app/feature/usage_apn1.html
@@ -86,6 +86,46 @@
+ <div id="hourly" class="tab-pane fade">
+
+ <p ng-show="vm.hourly.loading">Loading... <i class="fa fa-spinner fa-pulse fa-fw"></i></p>
+ <p ng-show="!vm.hourly.loading && vm.hourly.no_data">No Data</p>
+
+ <canvas
+ id="line"
+ class="chart chart-line"
+ chart-data="vm.hourly.data"
+ chart-labels="vm.hourly.labels"
+ chart-options="vm.hourly.options"
+ chart-colors="vm.hourly.colors"
+ chart-dataset-override="vm.hourly.datasetOverride"
+ ng-show="!vm.hourly.loading && !vm.hourly.no_data" ></canvas>
+
+ <br /><br />
+
+ <table class="table table-bordered table-condensed" ng-show="!vm.hourly.loading && !vm.hourly.no_data">
+ <thead>
+ <tr>
+ <th>Hour</th>
+ <th>Download</th>
+ <th>Upload</th>
+ <th>Total</th>
+ </tr>
+ </thead>
+ <tbody>
+ <tr ng-repeat="e in vm.hourly.table">
+ <td>{{e.index}}</td>
+ <td>{{e.rx}}</td>
+ <td>{{e.tx}}</td>
+ <td>{{e.total}}</td>
+ </tr>
+ </tbody>
+ </table>
+
+ </div>
+
+
+proscend/prosrc/www/app/feature/usage_apn1.js
@@ -155,6 +155,60 @@ function controller($scope, $interval, icos, real_time, info) {
+ vm.hourly = {};
+
+ vm.hourly.labels = [
+ 0, 1, 2, 3, 4, 5, 6, 7, 8, 9,
+ 10, 11, 12, 13, 14, 15, 16, 17, 18, 19,
+ 20, 21, 22, 23
+ ];
+
+ vm.hourly.options = angular.copy(vm.chart_template.options);
+ vm.hourly.options.title.text = 'Hourly Usage';
+ vm.hourly.options.scales.xAxes[0].scaleLabel.labelString = 'Hour';
+ vm.hourly.options.scales.yAxes[0].scaleLabel.labelString = 'MB';
+
+ vm.hourly.colors = angular.copy(vm.chart_template.colors);
+
+ vm.hourly.datasetOverride = angular.copy(vm.chart_template.datasetOverride);
+
+ vm.hourly_usage = function() {
+
+ vm.hourly.loading = true;
+ vm.hourly.no_data = true;
+
+ vm.hourly.data = [ [], [], [], ];
+ vm.hourly.table = [];
+ icos.usage_display.hourly().then(function(result) {
+ var hourly_data = result.data.data;
+
+ for (var i = 0; i < hourly_data.num; i ++) {
+ vm.hourly.data[0].push(hourly_data.db_info[0][i].rx);
+ vm.hourly.data[1].push(hourly_data.db_info[0][i].tx);
+ vm.hourly.data[2].push(hourly_data.db_info[0][i].tr_total);
+
+ var xxx = {};
+ xxx.index = vm.hourly.labels[i]; // tip
+
+ xxx.rx = hourly_data.db_info[0][i].rx;
+ xxx.tx = hourly_data.db_info[0][i].tx;
+ xxx.total = hourly_data.db_info[0][i].tr_total;
+
+ vm.hourly.table.push(xxx);
+ }
+
+ if (hourly_data.num != 0) {
+ vm.hourly.no_data = false;
+ }
+ vm.hourly.loading = false;
+ });
+ }
+
+
+
+
+
+
}網頁
commit
commit e7bb3a8c17b9913ea01a6fd332f5bdc93432a910
Refs: [develop]
Author: jeffrey <[email protected]>
Date: Thu Sep 6 14:10:55 2018 +0800
dual APN have their own APN Usage web page:
- add 'Hourly' tab for 'APN1 Usage'
proscend/prosrc/www/app/feature/usage_apn1.html | 40 ++++++++++++++++++
proscend/prosrc/www/app/feature/usage_apn1.js | 54 +++++++++++++++++++++++++
2 files changed, 94 insertions(+)
Daily
proscend/prosrc/www/app/feature/usage_apn1.js
@@ -206,6 +206,57 @@ function controller($scope, $interval, icos, real_time, info) {
+ vm.daily = {};
+
+ vm.daily.labels = [
+ 1, 2, 3, 4, 5, 6, 7, 8, 9, 10,
+ 11, 12, 13, 14, 15, 16, 17, 18, 19, 20,
+ 21, 22, 23, 24, 25, 26, 27, 28, 29, 30,
+ 31
+ ];
+
+ vm.daily.options = angular.copy(vm.chart_template.options);
+ vm.daily.options.title.text = 'Daily Usage';
+ vm.daily.options.scales.xAxes[0].scaleLabel.labelString = 'Day';
+ vm.daily.options.scales.yAxes[0].scaleLabel.labelString = 'MB';
+
+ vm.daily.colors = angular.copy(vm.chart_template.colors);
+
+ vm.daily.datasetOverride = angular.copy(vm.chart_template.datasetOverride);
+
+ vm.daily_usage = function() {
+
+ vm.daily.loading = true;
+ vm.daily.no_data = true;
+
+ vm.daily.data = [ [], [], [], ];
+ vm.daily.table = [];
+ icos.usage_display.daily().then(function(result) {
+ var daily_data = result.data.data;
+ for (var i = 0; i < daily_data.num; i ++) {
+ vm.daily.data[0].push(daily_data.db_info[0][i].rx);
+ vm.daily.data[1].push(daily_data.db_info[0][i].tx);
+ vm.daily.data[2].push(daily_data.db_info[0][i].tr_total);
+
+ var xxx = {};
+ xxx.index = vm.daily.labels[i]; // tip
+
+ xxx.rx = daily_data.db_info[0][i].rx;
+ xxx.tx = daily_data.db_info[0][i].tx;
+ xxx.total = daily_data.db_info[0][i].tr_total;
+
+ vm.daily.table.push(xxx);
+ }
+
+ if (daily_data.num != 0) {
+ vm.daily.no_data = false;
+ }
+ vm.daily.loading = false;
+ });
+ }
+
+
+proscend/prosrc/www/app/feature/usage_apn1.html
@@ -126,6 +126,43 @@
+ <div id="daily" class="tab-pane fade">
+
+ <p ng-show="vm.daily.loading">Loading... <i class="fa fa-spinner fa-pulse fa-fw"></i></p>
+ <p ng-show="!vm.daily.loading && vm.daily.no_data">No Data</p>
+
+ <canvas
+ id="line"
+ class="chart chart-line"
+ chart-data="vm.daily.data"
+ chart-labels="vm.daily.labels"
+ chart-options="vm.daily.options"
+ chart-colors="vm.daily.colors"
+ chart-dataset-override="vm.daily.datasetOverride"
+ ng-show="!vm.daily.loading && !vm.daily.no_data" ></canvas>
+
+ <br /><br />
+
+ <table class="table table-bordered table-condensed" ng-show="!vm.daily.loading && !vm.daily.no_data">
+ <thead>
+ <tr>
+ <th>Day</th>
+ <th>Download</th>
+ <th>Upload</th>
+ <th>Total</th>
+ </tr>
+ </thead>
+ <tbody>
+ <tr ng-repeat="e in vm.daily.table">
+ <td>{{e.index}}</td>
+ <td>{{e.rx}}</td>
+ <td>{{e.tx}}</td>
+ <td>{{e.total}}</td>
+ </tr>
+ </tbody>
+ </table>
+
+ </div>網頁
commit
commit b7203a8e848ba01bff020d2e51a76d140544816e
Refs: [develop]
Author: jeffrey <[email protected]>
Date: Thu Sep 6 14:42:47 2018 +0800
dual APN have their own APN Usage web page:
- add 'Daily' tab for 'APN1 Usage'
proscend/prosrc/www/app/feature/usage_apn1.html | 37 ++++++++++++++++++
proscend/prosrc/www/app/feature/usage_apn1.js | 51 +++++++++++++++++++++++++
2 files changed, 88 insertions(+)
Weekly
proscend/prosrc/www/app/feature/usage_apn1.html
@@ -166,6 +166,46 @@
+ <div id="weekly" class="tab-pane fade">
+
+ <p ng-show="vm.weekly.loading">Loading... <i class="fa fa-spinner fa-pulse fa-fw"></i></p>
+ <p ng-show="!vm.weekly.loading && vm.weekly.no_data">No Data</p>
+
+ <canvas
+ id="line"
+ class="chart chart-line"
+ chart-data="vm.weekly.data"
+ chart-labels="vm.weekly.labels"
+ chart-options="vm.weekly.options"
+ chart-colors="vm.weekly.colors"
+ chart-dataset-override="vm.weekly.datasetOverride"
+ ng-show="!vm.weekly.loading && !vm.weekly.no_data" ></canvas>
+
+ <br /><br />
+
+ <table class="table table-bordered table-condensed" ng-show="!vm.weekly.loading && !vm.weekly.no_data">
+ <thead>
+ <tr>
+ <th>Week Day</th>
+ <th>Download</th>
+ <th>Upload</th>
+ <th>Total</th>
+ </tr>
+ </thead>
+ <tbody>
+ <tr ng-repeat="e in vm.weekly.table">
+ <td>{{e.index}}</td>
+ <td>{{e.rx}}</td>
+ <td>{{e.tx}}</td>
+ <td>{{e.total}}</td>
+ </tr>
+ </tbody>
+ </table>
+
+ </div>
+
+
+proscend/prosrc/www/app/feature/usage_apn1.js
@@ -257,6 +257,54 @@ function controller($scope, $interval, icos, real_time, info) {
+ vm.weekly = {};
+
+ vm.weekly.labels = [
+ "SUN", "MON", "TUE", "WED", "THU", "FRI", "SAT"
+ ];
+
+ vm.weekly.options = angular.copy(vm.chart_template.options);
+ vm.weekly.options.title.text = 'Weekly Usage';
+ vm.weekly.options.scales.xAxes[0].scaleLabel.labelString = 'Week Day';
+ vm.weekly.options.scales.yAxes[0].scaleLabel.labelString = 'MB';
+
+ vm.weekly.colors = angular.copy(vm.chart_template.colors);
+
+ vm.weekly.datasetOverride = angular.copy(vm.chart_template.datasetOverride);
+
+ vm.weekly_usage = function() {
+
+ vm.weekly.loading = true;
+ vm.weekly.no_data = true;
+
+ vm.weekly.data = [ [], [], [], ];
+ vm.weekly.table = [];
+ icos.usage_display.weekly().then(function(result) {
+ var weekly_data = result.data.data;
+ for (var i = 0; i < weekly_data.num; i ++) {
+ vm.weekly.data[0].push(weekly_data.db_info[0][i].rx);
+ vm.weekly.data[1].push(weekly_data.db_info[0][i].tx);
+ vm.weekly.data[2].push(weekly_data.db_info[0][i].tr_total);
+
+ var xxx = {};
+ xxx.index = vm.weekly.labels[i]; // tip
+
+ xxx.rx = weekly_data.db_info[0][i].rx;
+ xxx.tx = weekly_data.db_info[0][i].tx;
+ xxx.total = weekly_data.db_info[0][i].tr_total;
+
+ vm.weekly.table.push(xxx);
+ }
+
+ if (weekly_data.num != 0) {
+ vm.weekly.no_data = false;
+ }
+ vm.weekly.loading = false;
+ });
+ }
+
+
+網頁
commit
commit 095de9376708697b669fcb0bb143754247122461
Refs: [develop]
Author: jeffrey <[email protected]>
Date: Thu Sep 6 14:51:53 2018 +0800
dual APN have their own APN Usage web page:
- add 'Weekly' tab for 'APN1 Usage'
proscend/prosrc/www/app/feature/usage_apn1.html | 40 +++++++++++++++++++++
proscend/prosrc/www/app/feature/usage_apn1.js | 48 +++++++++++++++++++++++++
2 files changed, 88 insertions(+)
Monthly
proscend/prosrc/www/app/feature/usage_apn1.js
@@ -305,6 +305,53 @@ function controller($scope, $interval, icos, real_time, info) {
+ vm.monthly = {};
+
+ vm.monthly.labels = [
+ "JAN", "FEB", "MAR", "APR", "MAY", "JUN", "JUL", "AUG", "SEP", "OCT",
+ "NOV", "DEC"
+ ];
+
+ vm.monthly.options = angular.copy(vm.chart_template.options);
+ vm.monthly.options.title.text = 'Monthly Usage';
+ vm.monthly.options.scales.xAxes[0].scaleLabel.labelString = 'Month';
+ vm.monthly.options.scales.yAxes[0].scaleLabel.labelString = 'MB';
+
+ vm.monthly.colors = angular.copy(vm.chart_template.colors);
+
+ vm.monthly.datasetOverride = angular.copy(vm.chart_template.datasetOverride);
+
+ vm.monthly_usage = function() {
+
+ vm.monthly.loading = true;
+ vm.monthly.no_data = true;
+
+ vm.monthly.data = [ [], [], [], ];
+ vm.monthly.table = [];
+ icos.usage_display.monthly().then(function(result) {
+ var monthly_data = result.data.data;
+ for (var i = 0; i < monthly_data.num; i ++) {
+ vm.monthly.data[0].push(monthly_data.db_info[0][i].rx);
+ vm.monthly.data[1].push(monthly_data.db_info[0][i].tx);
+ vm.monthly.data[2].push(monthly_data.db_info[0][i].tr_total);
+
+ var xxx = {};
+ xxx.index = vm.monthly.labels[i]; // tip
+
+ xxx.rx = monthly_data.db_info[0][i].rx;
+ xxx.tx = monthly_data.db_info[0][i].tx;
+ xxx.total = monthly_data.db_info[0][i].tr_total;
+
+ vm.monthly.table.push(xxx);
+ }
+
+ if (monthly_data.num != 0) {
+ vm.monthly.no_data = false;
+ }
+ vm.monthly.loading = false;
+
+ });
+ }proscend/prosrc/www/app/feature/usage_apn1.html
@@ -206,6 +206,43 @@
+ <div id="monthly" class="tab-pane fade">
+
+ <p ng-show="vm.monthly.loading">Loading... <i class="fa fa-spinner fa-pulse fa-fw"></i></p>
+ <p ng-show="!vm.monthly.loading && vm.monthly.no_data">No Data</p>
+
+ <canvas
+ id="line"
+ class="chart chart-line"
+ chart-data="vm.monthly.data"
+ chart-labels="vm.monthly.labels"
+ chart-options="vm.monthly.options"
+ chart-colors="vm.monthly.colors"
+ chart-dataset-override="vm.monthly.datasetOverride"
+ ng-show="!vm.monthly.loading && !vm.monthly.no_data" ></canvas>
+
+ <br /><br />
+
+ <table class="table table-bordered table-condensed" ng-show="!vm.monthly.loading && !vm.monthly.no_data">
+ <thead>
+ <tr>
+ <th>Month</th>
+ <th>Download</th>
+ <th>Upload</th>
+ <th>Total</th>
+ </tr>
+ </thead>
+ <tbody>
+ <tr ng-repeat="e in vm.monthly.table">
+ <td>{{e.index}}</td>
+ <td>{{e.rx}}</td>
+ <td>{{e.tx}}</td>
+ <td>{{e.total}}</td>
+ </tr>
+ </tbody>
+ </table>
+
+ </div>網頁
commit
commit c9a9419525853a9c99e0953b2459c6304cb327ab
Refs: [develop]
Author: jeffrey <[email protected]>
Date: Thu Sep 6 15:06:47 2018 +0800
dual APN have their own APN Usage web page:
- add 'Monthly' tab for 'APN2 Usage'
proscend/prosrc/www/app/feature/usage_apn1.html | 37 +++++++++++++++++++
proscend/prosrc/www/app/feature/usage_apn1.js | 47 +++++++++++++++++++++++++
2 files changed, 84 insertions(+)
再來要作 APN2
理論上 usage_apn2.html 會和 usage_apn1.html 一模一樣
usage_apn2.js 和 usage_apn1.js 只有一些差別
commit
commit 84582c9a10b134b4165ddbcfb4e3b1eba252c095
Refs: [develop]
Author: jeffrey <[email protected]>
Date: Thu Sep 6 15:20:43 2018 +0800
dual APN have their own APN Usage web page:
- APN2 Usage copy from APN2 Usage
proscend/prosrc/www/app/feature/usage_apn2.html | 278 +++++++++++++++++--
proscend/prosrc/www/app/feature/usage_apn2.js | 339 +++++++++++++++++++++++-
proscend/prosrc/www/app/locale-en.json | 2 +-
proscend/prosrc/www/app/locale-fr.json | 2 +-
proscend/prosrc/www/app/locale-zh-tw.json | 2 +-
5 files changed, 597 insertions(+), 26 deletions(-)
來修改 usage_apn2.js
@@ -118,9 +118,9 @@ function controller($scope, $interval, icos, real_time, info) {
function updateTime() {
icos.usage_display.real_time().then(function(result) {
- vm.real_time.data[0].push(result.data.real_time.apn0_month_rx);
- vm.real_time.data[1].push(result.data.real_time.apn0_month_tx);
- vm.real_time.data[2].push(result.data.real_time.apn0_DisplayTotal);
+ vm.real_time.data[0].push(result.data.real_time.apn1_month_rx);
+ vm.real_time.data[1].push(result.data.real_time.apn1_month_tx);
+ vm.real_time.data[2].push(result.data.real_time.apn1_DisplayTotal);
for (var i = 0; i < vm.real_time.data.length; i ++) {
if (vm.real_time.data[i].length > 30) {
vm.real_time.data[i].shift();
@@ -183,16 +183,16 @@ function controller($scope, $interval, icos, real_time, info) {
var hourly_data = result.data.data;
for (var i = 0; i < hourly_data.num; i ++) {
- vm.hourly.data[0].push(hourly_data.db_info[0][i].rx);
- vm.hourly.data[1].push(hourly_data.db_info[0][i].tx);
- vm.hourly.data[2].push(hourly_data.db_info[0][i].tr_total);
+ vm.hourly.data[0].push(hourly_data.db_info[1][i].rx);
+ vm.hourly.data[1].push(hourly_data.db_info[1][i].tx);
+ vm.hourly.data[2].push(hourly_data.db_info[1][i].tr_total);
var xxx = {};
xxx.index = vm.hourly.labels[i]; // tip
- xxx.rx = hourly_data.db_info[0][i].rx;
- xxx.tx = hourly_data.db_info[0][i].tx;
- xxx.total = hourly_data.db_info[0][i].tr_total;
+ xxx.rx = hourly_data.db_info[1][i].rx;
+ xxx.tx = hourly_data.db_info[1][i].tx;
+ xxx.total = hourly_data.db_info[1][i].tr_total;
vm.hourly.table.push(xxx);
}
@@ -234,16 +234,16 @@ function controller($scope, $interval, icos, real_time, info) {
icos.usage_display.daily().then(function(result) {
var daily_data = result.data.data;
for (var i = 0; i < daily_data.num; i ++) {
- vm.daily.data[0].push(daily_data.db_info[0][i].rx);
- vm.daily.data[1].push(daily_data.db_info[0][i].tx);
- vm.daily.data[2].push(daily_data.db_info[0][i].tr_total);
+ vm.daily.data[0].push(daily_data.db_info[1][i].rx);
+ vm.daily.data[1].push(daily_data.db_info[1][i].tx);
+ vm.daily.data[2].push(daily_data.db_info[1][i].tr_total);
var xxx = {};
xxx.index = vm.daily.labels[i]; // tip
- xxx.rx = daily_data.db_info[0][i].rx;
- xxx.tx = daily_data.db_info[0][i].tx;
- xxx.total = daily_data.db_info[0][i].tr_total;
+ xxx.rx = daily_data.db_info[1][i].rx;
+ xxx.tx = daily_data.db_info[1][i].tx;
+ xxx.total = daily_data.db_info[1][i].tr_total;
vm.daily.table.push(xxx);
}
@@ -282,16 +282,16 @@ function controller($scope, $interval, icos, real_time, info) {
icos.usage_display.weekly().then(function(result) {
var weekly_data = result.data.data;
for (var i = 0; i < weekly_data.num; i ++) {
- vm.weekly.data[0].push(weekly_data.db_info[0][i].rx);
- vm.weekly.data[1].push(weekly_data.db_info[0][i].tx);
- vm.weekly.data[2].push(weekly_data.db_info[0][i].tr_total);
+ vm.weekly.data[0].push(weekly_data.db_info[1][i].rx);
+ vm.weekly.data[1].push(weekly_data.db_info[1][i].tx);
+ vm.weekly.data[2].push(weekly_data.db_info[1][i].tr_total);
var xxx = {};
xxx.index = vm.weekly.labels[i]; // tip
- xxx.rx = weekly_data.db_info[0][i].rx;
- xxx.tx = weekly_data.db_info[0][i].tx;
- xxx.total = weekly_data.db_info[0][i].tr_total;
+ xxx.rx = weekly_data.db_info[1][i].rx;
+ xxx.tx = weekly_data.db_info[1][i].tx;
+ xxx.total = weekly_data.db_info[1][i].tr_total;
vm.weekly.table.push(xxx);
}
@@ -331,16 +331,16 @@ function controller($scope, $interval, icos, real_time, info) {
icos.usage_display.monthly().then(function(result) {
var monthly_data = result.data.data;
for (var i = 0; i < monthly_data.num; i ++) {
- vm.monthly.data[0].push(monthly_data.db_info[0][i].rx);
- vm.monthly.data[1].push(monthly_data.db_info[0][i].tx);
- vm.monthly.data[2].push(monthly_data.db_info[0][i].tr_total);
+ vm.monthly.data[0].push(monthly_data.db_info[1][i].rx);
+ vm.monthly.data[1].push(monthly_data.db_info[1][i].tx);
+ vm.monthly.data[2].push(monthly_data.db_info[1][i].tr_total);
var xxx = {};
xxx.index = vm.monthly.labels[i]; // tip
- xxx.rx = monthly_data.db_info[0][i].rx;
- xxx.tx = monthly_data.db_info[0][i].tx;
- xxx.total = monthly_data.db_info[0][i].tr_total;
+ xxx.rx = monthly_data.db_info[1][i].rx;
+ xxx.tx = monthly_data.db_info[1][i].tx;
+ xxx.total = monthly_data.db_info[1][i].tr_total;
vm.monthly.table.push(xxx);
}commit
commit e1cf6e509638657bfb1ac3ba7d1512e5c54c5ed5
Refs: [develop]
Author: jeffrey <[email protected]>
Date: Thu Sep 6 15:30:15 2018 +0800
dual APN have their own APN Usage web page:
- difference APN2 from APN1
proscend/prosrc/www/app/feature/usage_apn2.js | 54 +++++++++++++--------------
1 file changed, 27 insertions(+), 27 deletions(-)
想辦法讓 usage_apn1.js 和 usage_apn2.js 共用同一個 template
目前的差異如下
diff usage_apn1.html usage_apn2.html
5c5
< <i class="fa fa-signal fa-fw"></i> {{ 'USAGE_APN1_PANEL_TITLE' | translate }}
---
> <i class="fa fa-signal fa-fw"></i> {{ 'USAGE_APN2_PANEL_TITLE' | translate }}要化解這樣的差異必須讓 USAGE_APN1_PANEL_TITLE 由 javascript 輸出
diff --git a/proscend/prosrc/www/app/feature/usage_apn1.html b/proscend/prosrc/www/app/feature/usage_apn1.html
index ab70f20..bb6435c 100644
--- a/proscend/prosrc/www/app/feature/usage_apn1.html
+++ b/proscend/prosrc/www/app/feature/usage_apn1.html
@@ -2,7 +2,7 @@
<div class="panel panel-primary">
<div class="panel-heading">
<h4 class="panel-title">
- <i class="fa fa-signal fa-fw"></i> {{ 'USAGE_APN1_PANEL_TITLE' | translate }}
+ <i class="fa fa-signal fa-fw"></i> {{ vm.panel_title() | translate }}
</h4>
</div>
diff --git a/proscend/prosrc/www/app/feature/usage_apn1.js b/proscend/prosrc/www/app/feature/usage_apn1.js
index 82c38bb..eab15f5 100644
--- a/proscend/prosrc/www/app/feature/usage_apn1.js
+++ b/proscend/prosrc/www/app/feature/usage_apn1.js
@@ -34,6 +34,10 @@ function controller($scope, $interval, icos, real_time, info) {
vm._real_time = real_time;
vm.info = info;
+ vm.panel_title = function() {
+ return "USAGE_APN1_PANEL_TITLE";
+ }
+
vm.lte_net_toLanKey = function(val) {
switch(val) {
case 0: return "DUAL_SIM_LTE_NET_MODE_DUAL_APN";
diff --git a/proscend/prosrc/www/app/feature/usage_apn2.html b/proscend/prosrc/www/app/feature/usage_apn2.html
index feb1dd4..bb6435c 100644
--- a/proscend/prosrc/www/app/feature/usage_apn2.html
+++ b/proscend/prosrc/www/app/feature/usage_apn2.html
@@ -2,7 +2,7 @@
<div class="panel panel-primary">
<div class="panel-heading">
<h4 class="panel-title">
- <i class="fa fa-signal fa-fw"></i> {{ 'USAGE_APN2_PANEL_TITLE' | translate }}
+ <i class="fa fa-signal fa-fw"></i> {{ vm.panel_title() | translate }}
</h4>
</div>
diff --git a/proscend/prosrc/www/app/feature/usage_apn2.js b/proscend/prosrc/www/app/feature/usage_apn2.js
index 3f718b3..2f5e7ae 100644
--- a/proscend/prosrc/www/app/feature/usage_apn2.js
+++ b/proscend/prosrc/www/app/feature/usage_apn2.js
@@ -34,6 +34,10 @@ function controller($scope, $interval, icos, real_time, info) {
vm._real_time = real_time;
vm.info = info;
+ vm.panel_title = function() {
+ return "USAGE_APN2_PANEL_TITLE";
+ }
+
vm.lte_net_toLanKey = function(val) {
switch(val) {
case 0: return "DUAL_SIM_LTE_NET_MODE_DUAL_APN";commit
commit 5528da40dfd72716c4fefafe04d75e28facffd1e
Refs: [develop]
Author: jeffrey <[email protected]>
Date: Thu Sep 6 15:41:08 2018 +0800
dual APN have their own APN Usage web page:
- use function to output the panel title
proscend/prosrc/www/app/feature/usage_apn1.html | 2 +-
proscend/prosrc/www/app/feature/usage_apn1.js | 4 ++++
proscend/prosrc/www/app/feature/usage_apn2.html | 2 +-
proscend/prosrc/www/app/feature/usage_apn2.js | 4 ++++
4 files changed, 10 insertions(+), 2 deletions(-)
這樣一來 usage_apn1.html 和 usage_apn2.html 就完全一樣了
diff usage_apn1.html usage_apn2.html
➜ feature git:(develop)
終於可以共用同一個 template 了
commit 303063eb434d1b6b4497170200ff167e0c3efd59
Refs: [develop]
Author: jeffrey <[email protected]>
Date: Thu Sep 6 15:48:37 2018 +0800
dual APN have their own APN Usage web page:
- APN1 and APN2 use the same template 'usage_apn.html'
proscend/prosrc/www/app/feature/usage_apn.html | 257 ++++++++++++++++++++++++
proscend/prosrc/www/app/feature/usage_apn1.html | 257 ------------------------
proscend/prosrc/www/app/feature/usage_apn1.js | 2 +-
proscend/prosrc/www/app/feature/usage_apn2.html | 257 ------------------------
proscend/prosrc/www/app/feature/usage_apn2.js | 2 +-
5 files changed, 259 insertions(+), 516 deletions(-)
讓原本的 Usage Display 功成身退吧
diff --git a/proscend/prosrc/www/src/index.html.src b/proscend/prosrc/www/src/index.html.src
index 20dd792..b1069c3 100644
--- a/proscend/prosrc/www/src/index.html.src
+++ b/proscend/prosrc/www/src/index.html.src
@@ -102,7 +102,6 @@
<script src="app/feature/vlan.js"></script>
<script src="app/feature/vlanSubnet.js"></script>
<script src="app/feature/chartTest.js"></script>
-<script src="app/feature/usageDisplay.js"></script>
<script src="app/feature/sms.js"></script>
<script src="app/feature/customize.js"></script>
<script src="app/feature/snat.js"></script>
diff --git a/proscend/prosrc/www/src/menu.html.src b/proscend/prosrc/www/src/menu.html.src
index ccc722a..b1b9573 100644
--- a/proscend/prosrc/www/src/menu.html.src
+++ b/proscend/prosrc/www/src/menu.html.src
@@ -95,7 +95,6 @@
<a href="#dualSim" class="list-group-item">{{ 'MENU_LTE_DUAL_SIM' | translate }}</a>
#endif
- <a href="#usageDisplay" class="list-group-item">{{ 'MENU_LTE_USAGE_DISPLAY' | translate }}</a>
<a href="#usage_apn1" class="list-group-item">{{ 'MENU_LTE_USAGE_APN1' | translate }}</a>
<a href="#usage_apn2" class="list-group-item">{{ 'MENU_LTE_USAGE_APN2' | translate }}</a>
<a href="#sms" class="list-group-item">{{ 'MENU_LTE_SMS' | translate }}</a>commit
commit 6f9bf1926d48bf4b8a30d1f8faac9428bd3c7d8d
Refs: [develop]
Author: jeffrey <[email protected]>
Date: Thu Sep 6 15:54:18 2018 +0800
dual APN have their own APN Usage web page:
- remove the original 'Usage Display' from menu
proscend/prosrc/www/src/index.html.src | 1 -
proscend/prosrc/www/src/menu.html.src | 1 -
2 files changed, 2 deletions(-)
大功告成
可以 push 了
build 個完整的 image 再測一下
M360 一開機就作 web login
過沒多久因為 LTE 連線
SNTP 會取得新的時間
此時會造成 time out 需要重新 login 的情況
有點不方便
想要修改一下
static struct session *get_session(struct http_message *hm)
{
...
for (int i = 0; i < NUM_SESSIONS; i++)
{
if (s_sessions[i].id == sid)
{
s_sessions[i].last_used = mg_time();
_save_session();
return &s_sessions[i];
}
}
return NULL;
}
/* Cleans up sessions that have been idle for too long. */
void check_sessions(void)
{
...
double threshold = mg_time() - Icos_user_root.session_ttl;
for (int i = 0; i < NUM_SESSIONS; i++)
{
struct session *s = &s_sessions[i];
if (s->id != 0 && s->last_used < threshold)
{
fprintf(stderr, "Session %" INT64_X_FMT " (%s) closed due to idleness.\n",
s->id, s->user);
destroy_session(s);
_save_session();
}
}
}
static struct session *create_session(const char *user, const struct http_message *hm)
{
...
/* Initialize new session. */
s->created = s->last_used = mg_time();
snprintf(s->user, sizeof(s->user), "%s", user);
s->lucky_number = rand();
...
}
static void _handler_noauth(struct mg_connection *nc, int ev, void *ev_data)
{
switch (ev)
{
case MG_EV_HTTP_REQUEST:
...
case MG_EV_TIMER:
/* Perform session maintenance. */
check_sessions();
mg_set_timer(nc, mg_time() + SESSION_CHECK_INTERVAL);
break;
}
}
int main(int argc, char *argv[])
{
...
nc = mg_bind_opt(&mgr, address, _handler_noauth, bind_opts);
...
mg_set_timer(nc, mg_time() + SESSION_CHECK_INTERVAL);
...
}這裡用到的 mg_time() 會受到 SNTP update time 的影響
找一下是否可以使用 system update 來代替
注意到 mg_time() return type 為 double
icos_utility.h
long SysGetUpTime(void);
強制轉型來把 mg_time() 取代成 (double)SysGetUpTime()
diff --git a/proscend/mconfig/lxdialog/lxdialog b/proscend/mconfig/lxdialog/lxdialog
index 91dcca2..405bfea 100755
Binary files a/proscend/mconfig/lxdialog/lxdialog and b/proscend/mconfig/lxdialog/lxdialog differ
diff --git a/proscend/prosrc/icos/iweb/iweb.c b/proscend/prosrc/icos/iweb/iweb.c
index e6606d7..3914f8b 100644
--- a/proscend/prosrc/icos/iweb/iweb.c
+++ b/proscend/prosrc/icos/iweb/iweb.c
@@ -106,7 +106,7 @@ static struct session *get_session(struct http_message *hm)
{
if (s_sessions[i].id == sid)
{
- s_sessions[i].last_used = mg_time();
+ s_sessions[i].last_used = (double)SysGetUpTime();
_save_session();
return &s_sessions[i];
}
@@ -153,7 +153,7 @@ void check_sessions(void)
return;
}
- double threshold = mg_time() - Icos_user_root.session_ttl;
+ double threshold = (double)SysGetUpTime() - Icos_user_root.session_ttl;
for (int i = 0; i < NUM_SESSIONS; i++)
{
struct session *s = &s_sessions[i];
@@ -198,7 +198,7 @@ static struct session *create_session(const char *user, const struct http_messag
}
/* Initialize new session. */
- s->created = s->last_used = mg_time();
+ s->created = s->last_used = (double)SysGetUpTime();
snprintf(s->user, sizeof(s->user), "%s", user);
s->lucky_number = rand();
@@ -264,7 +264,7 @@ static void _handler_noauth(struct mg_connection *nc, int ev, void *ev_data)
case MG_EV_TIMER:
/* Perform session maintenance. */
check_sessions();
- mg_set_timer(nc, mg_time() + SESSION_CHECK_INTERVAL);
+ mg_set_timer(nc, (double)SysGetUpTime() + SESSION_CHECK_INTERVAL);
break;
}
}
@@ -962,7 +962,7 @@ int main(int argc, char *argv[])
s_http_port, s_http_server_opts.document_root);
}
- mg_set_timer(nc, mg_time() + SESSION_CHECK_INTERVAL);
+ mg_set_timer(nc, (double)SysGetUpTime() + SESSION_CHECK_INTERVAL);
for (;;)仔細測一下
SNTP 更新後已經不會被 time out 而需要重新 log in 了
再來就是要驗證原本 time out 的功能還正不正常
殘念
並沒有發揮原本 timeout 的功能
還原回原本的 code
debug 一下
@@ -147,6 +147,7 @@ static void destroy_session(struct session *s)
/* Cleans up sessions that have been idle for too long. */
void check_sessions(void)
{
+ fprintf(stderr, "check_sessions\n");
// The session checking will be disalbed when the TTL be zero.
if (Icos_user_root.session_ttl == 0)
{
@@ -264,6 +265,7 @@ static void _handler_noauth(struct mg_connection *nc, int ev, void *ev_data)
case MG_EV_TIMER:
/* Perform session maintenance. */
check_sessions();
+ fprintf(stderr, "mg_set_timer: %f\n", mg_time());
mg_set_timer(nc, mg_time() + SESSION_CHECK_INTERVAL);
break;
}
@@ -962,6 +964,7 @@ int main(int argc, char *argv[])
s_http_port, s_http_server_opts.document_root);
}
+ fprintf(stderr, "mg_set_timer: %f\n", mg_time());
mg_set_timer(nc, mg_time() + SESSION_CHECK_INTERVAL);觀察一開機的 iweb 當受到 time update 時的影響
...
1536226856[20180906 9:40:56] [msgcb_web:1205]IN(DID0,pid 2276)
<--
check_sessions
mg_set_timer: 1536226854.988300
-->
1536226859[20180906 9:40:59] [msgcb_web:1205]IN(DID1,pid 2524)
<--
check_sessions
mg_set_timer: 1536226859.272035
-->
1536226860[20180906 9:41:0] [msgcb_web:1205]IN(DID0,pid 2276)
<--
check_sessions
mg_set_timer: 1536226859.996033
-->
1536227851[20180906 9:57:31] [msgcb_web:1205]IN(DID1,pid 2524)
<--
check_sessions
mg_set_timer: 1536227851.180939
-->
1536227851[20180906 9:57:31] [msgcb_web:1205]IN(DID0,pid 2276)
<--
check_sessions
mg_set_timer: 1536227851.896949
-->
1536227856[20180906 9:57:36] [msgcb_web:1205]IN(DID1,pid 2524)
<--
check_sessions
mg_set_timer: 1536227856.193001
-->
1536227857[20180906 9:57:37] [msgcb_web:1205]IN(DID0,pid 2276)
<--
check_sessions
mg_set_timer: 1536227856.905600
-->
1536227861[20180906 9:57:41] [msgcb_web:1205]IN(DID1,pid 2524)
<--
check_sessions
mg_set_timer: 1536227861.197002
-->
1536227861[20180906 9:57:41] [msgcb_web:1205]IN(DID0,pid 2276)
<--
check_sessions
mg_set_timer: 1536227861.908980
-->
1536227866[20180906 9:57:46] [msgcb_web:1205]IN(DID1,pid 2524)
<--
check_sessions
mg_set_timer: 1536227866.200943
-->
1536227867[20180906 9:57:47] [msgcb_web:1205]IN(DID0,pid 2276)
<--
check_sessions
mg_set_timer: 1536227866.913797
-->
1536227868[20180906 9:57:48] [notify_web:858]IN(E16|S31|D00)
1536227871[20180906 9:57:51] [msgcb_web:1205]IN(DID1,pid 2524)
<--
check_sessions
mg_set_timer: 1536227871.208973
-->
1536227871[20180906 9:57:51] [msgcb_web:1205]IN(DID0,pid 2276)
<--
check_sessions
mg_set_timer: 1536227871.916933
-->
1536227876[20180906 9:57:56] [msgcb_web:1205]IN(DID1,pid 2524)
<--
check_sessions
mg_set_timer: 1536227876.217581
-->
1536227876[20180906 9:57:56] [msgcb_web:1205]IN(DID0,pid 2276)
<--
check_sessions
mg_set_timer: 1536227876.920964
-->
1536227881[20180906 9:58:1] [msgcb_web:1205]IN(DID1,pid 2524)
<--
check_sessions
mg_set_timer: 1536227881.224926
-->
1536227881[20180906 9:58:1] [msgcb_web:1205]IN(DID0,pid 2276)
<--
check_sessions
mg_set_timer: 1536227881.928946
-->
1536227886[20180906 9:58:6] [msgcb_web:1205]IN(DID1,pid 2524)
<--
check_sessions
mg_set_timer: 1536227886.232974
-->
1536227886[20180906 9:58:6] [msgcb_web:1205]IN(DID0,pid 2276)
<--
check_sessions
mg_set_timer: 1536227886.936941
-->
1536227891[20180906 9:58:11] [msgcb_web:1205]IN(DID1,pid 2524)
<--
check_sessions
mg_set_timer: 1536227891.236912
-->
1536227891[20180906 9:58:11] [msgcb_web:1205]IN(DID0,pid 2276)
<--
check_sessions
mg_set_timer: 1536227891.944940
-->
注意到從 [20180906 9:41:0] 到 [20180906 9:57:31] 的跳躍
...
1536226860[20180906 9:41:0] [msgcb_web:1205]IN(DID0,pid 2276)
<--
check_sessions
mg_set_timer: 1536226859.996033
-->
1536227851[20180906 9:57:31] [msgcb_web:1205]IN(DID1,pid 2524)
<--
check_sessions
mg_set_timer: 1536227851.180939
-->
...
一次就跳了 16 分鐘
難怪會 timeout