diff --git a/css/rt-dmview-css-min.css b/css/rt-dmview-css-min.css
index a205a44..6c64d7b 100644
--- a/css/rt-dmview-css-min.css
+++ b/css/rt-dmview-css-min.css
@@ -290,4 +290,26 @@ label::before {
width: 100%;
height: 100%;
border: 0;
-}
\ No newline at end of file
+}
+
+/* Fin manager */
+.st-input {
+ padding: 4px 8px 4px 8px;
+ width: 200px;
+ border: none;
+ border-bottom: 1px solid #757575;
+ letter-spacing: 0.2em;
+ background-color: #eee;
+}
+
+.st-button {
+ padding: 4px 8px 4px 8px;
+ background-color: var(--color_theme_primary);
+ color: white;
+ border: none;
+}
+
+.custom-chart {
+ border: 2px solid gray;
+ margin: 8px 0px 8px 0px;
+}
diff --git a/js/debt-chart-init.js b/js/debt-chart-init.js
new file mode 100644
index 0000000..1affe3b
--- /dev/null
+++ b/js/debt-chart-init.js
@@ -0,0 +1,189 @@
+window.onload = function () {
+ document.getElementById('stupdate').click();
+}
+
+data = `##group##`;
+
+raw = JSON.parse(data).buckets;
+//document.write(`
` + JSON.stringify(raw) + ``)
+delete (cutomdtaset);
+cutomdtaset = [];
+date_ls0 = [];
+total_ls2 = [];
+
+date_ls0 = raw.map(x => `"` + x.key + `"`).join(`,`)
+
+date_ls0 = `[` + date_ls0 + `]`;
+date_ls0 = JSON.parse(date_ls0).filter((v, i, a) => a.indexOf(v) === i);
+date_ls0 = date_ls0.map(x => `"` + x + `"`).join(`,`);
+date_ls0 = `[` + date_ls0 + `]`;
+//document.write(date_ls0);
+
+function compare2(a, b) {
+ if (a < b) {
+ return -1;
+ }
+ if (a > b) {
+ return 1;
+ }
+ return 0;
+}
+date_ls0 = JSON.parse(date_ls0).sort(compare2)
+//document.write(date_ls0.length);
+
+function compare(a, b) {
+ if (a.key < b.key) {
+ return -1;
+ }
+ if (a.key > b.key) {
+ return 1;
+ }
+ return 0;
+}
+
+tmp = raw.filter(function (x) {
+ return x.doc_count > 0
+});
+tmp = tmp.sort(compare);
+//window['date_ls' + i] = tmp.map(x => x.key)
+//total_ls = tmp.map(x => x.doc_count)
+total_ls = [];
+paid_ls = [];
+notice_ls = [];
+remained_ls = [];
+
+for (let z = 0; z < date_ls0.length; z++) {
+ var content_tmp = tmp.filter(function (x) {
+ return x.key == date_ls0[z]
+ });
+ //document.write(JSON.stringify(content_tmp[0]) + '
')
+ //document.write(content_tmp.length);
+ if (content_tmp.length > 0) {
+ total_point = content_tmp[0].cur.buckets.map(function (x) { if (x.key == 'U_057') { return x.total.value * 1 } else { return x.total.value } }).reduce((a, b) => a + b, 0);
+ total_ls.push(total_point);
+ paid_point = content_tmp[0].cur.buckets.map(function (x) { if (x.key == 'U_057') { return x.paid.value * 1 } else { return x.paid.value } }).reduce((a, b) => a + b, 0);
+ paid_ls.push(paid_point);
+ notice_point = content_tmp[0].cur.buckets.map(function (x) { if (x.key == 'U_057') { return x.notice.value * 1 } else { return x.notice.value } }).reduce((a, b) => a + b, 0);
+ notice_ls.push(notice_point);
+ remained_point = total_point - paid_point;
+ remained_ls.push(remained_point);
+ } else {
+ total_ls.push(0);
+ paid_ls.push(0);
+ notice_ls.push(0);
+ remained_ls.push(0);
+ }
+}
+let a1 = 0; b1 = 0; c1 = 0; d1 = 0;
+total_ls01 = total_ls.map(x => ({ ...x, "cumsum": a1 += x }));
+total_ls = total_ls01.map(x => x.cumsum);
+paid_ls01 = paid_ls.map(x => ({ ...x, "cumsum": b1 += x }));
+paid_ls = paid_ls01.map(x => x.cumsum);
+notice_ls01 = notice_ls.map(x => ({ ...x, "cumsum": c1 += x }));
+notice_ls = notice_ls01.map(x => x.cumsum);
+remained_ls01 = remained_ls.map(x => ({ ...x, "cumsum": d1 += x }));
+remained_ls = remained_ls01.map(x => x.cumsum);
+//document.write(JSON.stringify(remained_ls));
+
+corlor_ls = ['#00bbf9', '#00bbf9'];
+corlor_ls2 = ['#ef476f', '#ef476f'];
+corlor_ls3 = ['#009688', '#009688'];
+corlor_ls4 = ['#ff9800', '#ff9800'];
+//document.write('
' + total_ls)
+
+cutomdtaset.push(`{"label": "Phải thu` + `","backgroundColor": "` + corlor_ls[0] + `","borderColor": "` + corlor_ls[1] + `","data": [` + String(total_ls) + `],"tension": 0.4}`);
+cutomdtaset.push(`{"label": "Đã thu` + `","backgroundColor": "` + corlor_ls2[0] + `","borderColor": "` + corlor_ls2[1] + `","data": [` + String(paid_ls) + `],"tension": 0.4}`);
+cutomdtaset.push(`{"label": "Báo thu` + `","backgroundColor": "` + corlor_ls3[0] + `","borderColor": "` + corlor_ls3[1] + `","data": [` + String(notice_ls) + `],"tension": 0.4}`);
+cutomdtaset.push(`{"label": "Còn lại` + `","backgroundColor": "` + corlor_ls4[0] + `","borderColor": "` + corlor_ls4[1] + `","data": [` + String(remained_ls) + `],"tension": 0.4}`);
+
+cutomdtaset = `[` + cutomdtaset + `]`
+//document.write('
' + cutomdtaset)
+
+var canvas = document.getElementById('myChart2');
+var data2 = {
+ labels: date_ls0,
+ datasets: JSON.parse(cutomdtaset)
+};
+var options = {
+ responsive: true,
+ interaction: {
+ intersect: false,
+ },
+ layout: {
+ padding: 10,
+ },
+ legend: {
+ position: 'bottom',
+ }
+};
+
+function adddata() {
+ var xrate_2vnd = document.getElementById('xrate_2vnd').value;
+ cutomdtaset2 = [];
+ total_ls2 = [];
+ paid_ls2 = [];
+ notice_ls2 = [];
+ remained_ls2 = [];
+ //document.write(JSON.stringify(xrate_2vnd));
+ for (let y = 0; y < date_ls0.length; y++) {
+ var content_tmp = tmp.filter(function (x) {
+ return x.key == date_ls0[y]
+ });
+ //document.write(JSON.stringify(content_tmp[0]) + '
')
+ //document.write(date_ls0.length);
+ if (content_tmp.length > 0) {
+ total_point2 = content_tmp[0].cur.buckets.map(function (x) { if (x.key == 'U_057') { return x.total.value * xrate_2vnd } else { return x.total.value } }).reduce((a, b) => a + b, 0);
+ total_ls2.push(total_point2);
+ paid_point2 = content_tmp[0].cur.buckets.map(function (x) { if (x.key == 'U_057') { return x.paid.value * xrate_2vnd } else { return x.paid.value } }).reduce((a, b) => a + b, 0);
+ paid_ls2.push(paid_point2);
+ notice_point2 = content_tmp[0].cur.buckets.map(function (x) { if (x.key == 'U_057') { return x.notice.value * xrate_2vnd } else { return x.notice.value } }).reduce((a, b) => a + b, 0);
+ notice_ls2.push(notice_point2);
+ remained_point2 = total_point2 - paid_point2;
+ remained_ls2.push(remained_point2);
+ //document.write(y);
+ } else {
+ total_ls2.push(0);
+ paid_ls2.push(0);
+ notice_ls2.push(0);
+ remained_ls2.push(0);
+ //document.write(y);
+ }
+
+ }
+
+
+ let a2 = 0; b2 = 0; c2 = 0; d2 = 0;
+ total_ls02 = total_ls2.map(x => ({ ...x, "cumsum": a2 += x }));
+ total_ls2 = total_ls02.map(x => x.cumsum.toFixed(4));
+ paid_ls02 = paid_ls2.map(x => ({ ...x, "cumsum": b2 += x }));
+ paid_ls2 = paid_ls02.map(x => x.cumsum.toFixed(4));
+ notice_ls02 = notice_ls2.map(x => ({ ...x, "cumsum": c2 += x }));
+ notice_ls2 = notice_ls02.map(x => x.cumsum.toFixed(4));
+ remained_ls02 = remained_ls2.map(x => ({ ...x, "cumsum": d2 += x }));
+ remained_ls2 = remained_ls02.map(x => x.cumsum.toFixed(4));
+
+
+ //document.write(total_ls2);
+ cutomdtaset2 = [];
+ cutomdtaset2.push(`{"label": "Phải thu` + `","backgroundColor": "` + corlor_ls[0] + `","borderColor": "` + corlor_ls[1] + `","data": [` + String(total_ls2) + `],"tension": 0.4}`);
+ cutomdtaset2.push(`{"label": "Đã thu` + `","backgroundColor": "` + corlor_ls2[0] + `","borderColor": "` + corlor_ls2[1] + `","data": [` + String(paid_ls2) + `],"tension": 0.4}`);
+ cutomdtaset2.push(`{"label": "Báo thu` + `","backgroundColor": "` + corlor_ls3[0] + `","borderColor": "` + corlor_ls3[1] + `","data": [` + String(notice_ls2) + `],"tension": 0.4}`);
+ cutomdtaset2.push(`{"label": "Còn lại` + `","backgroundColor": "` + corlor_ls4[0] + `","borderColor": "` + corlor_ls4[1] + `","data": [` + String(remained_ls2) + `],"tension": 0.4}`);
+
+ cutomdtaset2 = `[` + cutomdtaset2 + `]`;
+
+ var data3 = {
+ labels: date_ls0,
+ datasets: JSON.parse(cutomdtaset2)
+ };
+
+ myChart.data = data3;
+ myChart.update();
+}
+
+var myChart = new Chart(canvas, {
+ type: 'line',
+ data: data2,
+ options: options
+});
+