You cannot select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
462 lines
12 KiB
JavaScript
462 lines
12 KiB
JavaScript
import { accnil } from "{{PATH}}/assets-js/module-lap-bb.js?v={time}";
|
|
let config = JSON.parse(_valHTML("config"));
|
|
let cardColor = config.colors.cardColor;
|
|
let axisColor = "#333333";
|
|
let borderColor = "#dddddd";
|
|
|
|
let totalRevenueChartOptions = {
|
|
series: [
|
|
{
|
|
name: 'SHU',
|
|
data: localStorage.getItem('shudata') ? JSON.parse(localStorage.getItem('shudata'))
|
|
.map(function(q){
|
|
return Math.round(q/1000000)
|
|
})
|
|
: [0,0,0,0]
|
|
}
|
|
],
|
|
chart: {
|
|
height: 250,
|
|
stacked: true,
|
|
type: 'bar',
|
|
toolbar: { show: false }
|
|
},
|
|
plotOptions: {
|
|
bar: {
|
|
horizontal: false,
|
|
columnWidth: '25px',
|
|
borderRadius: 10,
|
|
startingShape: 'rounded',
|
|
endingShape: 'rounded'
|
|
}
|
|
},
|
|
colors: [config.colors.primary, config.colors.info],
|
|
dataLabels: {
|
|
enabled: false
|
|
},
|
|
stroke: {
|
|
curve: 'smooth',
|
|
width: 6,
|
|
lineCap: 'round',
|
|
colors: [cardColor]
|
|
},
|
|
legend: {
|
|
show: true,
|
|
horizontalAlign: 'left',
|
|
position: 'top',
|
|
markers: {
|
|
height: 8,
|
|
width: 8,
|
|
radius: 12,
|
|
offsetX: -3
|
|
},
|
|
labels: {
|
|
colors: axisColor
|
|
},
|
|
itemMargin: {
|
|
horizontal: 5
|
|
}
|
|
},
|
|
grid: {
|
|
borderColor: borderColor,
|
|
padding: {
|
|
top: 0,
|
|
bottom: -8,
|
|
left: 20,
|
|
right: 20
|
|
}
|
|
},
|
|
xaxis: {
|
|
categories: _3month,
|
|
labels: {
|
|
style: {
|
|
fontSize: '13px',
|
|
colors: axisColor
|
|
}
|
|
},
|
|
axisTicks: {
|
|
show: false
|
|
},
|
|
axisBorder: {
|
|
show: false
|
|
}
|
|
},
|
|
yaxis: {
|
|
labels: {
|
|
style: {
|
|
fontSize: '13px',
|
|
colors: axisColor
|
|
},
|
|
formatter: function(num){
|
|
return num+'M'
|
|
}
|
|
}
|
|
},
|
|
responsive: [
|
|
{
|
|
breakpoint: 1700,
|
|
options: {
|
|
plotOptions: {
|
|
bar: {
|
|
borderRadius: 10,
|
|
columnWidth: '25px'
|
|
}
|
|
}
|
|
}
|
|
},
|
|
{
|
|
breakpoint: 1580,
|
|
options: {
|
|
plotOptions: {
|
|
bar: {
|
|
borderRadius: 10,
|
|
columnWidth: '25px'
|
|
}
|
|
}
|
|
}
|
|
},
|
|
{
|
|
breakpoint: 1440,
|
|
options: {
|
|
plotOptions: {
|
|
bar: {
|
|
borderRadius: 10,
|
|
columnWidth: '25px'
|
|
}
|
|
}
|
|
}
|
|
},
|
|
{
|
|
breakpoint: 1300,
|
|
options: {
|
|
plotOptions: {
|
|
bar: {
|
|
borderRadius: 10,
|
|
columnWidth: '25px'
|
|
}
|
|
}
|
|
}
|
|
},
|
|
{
|
|
breakpoint: 1200,
|
|
options: {
|
|
plotOptions: {
|
|
bar: {
|
|
borderRadius: 10,
|
|
columnWidth: '25px'
|
|
}
|
|
}
|
|
}
|
|
},
|
|
{
|
|
breakpoint: 1040,
|
|
options: {
|
|
plotOptions: {
|
|
bar: {
|
|
borderRadius: 10,
|
|
columnWidth: '25px'
|
|
}
|
|
}
|
|
}
|
|
},
|
|
{
|
|
breakpoint: 991,
|
|
options: {
|
|
plotOptions: {
|
|
bar: {
|
|
borderRadius: 10,
|
|
columnWidth: '25px'
|
|
}
|
|
}
|
|
}
|
|
},
|
|
{
|
|
breakpoint: 840,
|
|
options: {
|
|
plotOptions: {
|
|
bar: {
|
|
borderRadius: 10,
|
|
columnWidth: '25px'
|
|
}
|
|
}
|
|
}
|
|
},
|
|
{
|
|
breakpoint: 768,
|
|
options: {
|
|
plotOptions: {
|
|
bar: {
|
|
borderRadius: 10,
|
|
columnWidth: '25px'
|
|
}
|
|
}
|
|
}
|
|
},
|
|
{
|
|
breakpoint: 640,
|
|
options: {
|
|
plotOptions: {
|
|
bar: {
|
|
borderRadius: 10,
|
|
columnWidth: '25px'
|
|
}
|
|
}
|
|
}
|
|
},
|
|
{
|
|
breakpoint: 576,
|
|
options: {
|
|
plotOptions: {
|
|
bar: {
|
|
borderRadius: 10,
|
|
columnWidth: '25px'
|
|
}
|
|
}
|
|
}
|
|
},
|
|
{
|
|
breakpoint: 480,
|
|
options: {
|
|
plotOptions: {
|
|
bar: {
|
|
borderRadius: 10,
|
|
columnWidth: '25px'
|
|
}
|
|
}
|
|
}
|
|
},
|
|
{
|
|
breakpoint: 420,
|
|
options: {
|
|
plotOptions: {
|
|
bar: {
|
|
borderRadius: 10,
|
|
columnWidth: '25px'
|
|
}
|
|
}
|
|
}
|
|
},
|
|
{
|
|
breakpoint: 380,
|
|
options: {
|
|
plotOptions: {
|
|
bar: {
|
|
borderRadius: 10,
|
|
columnWidth: '25px'
|
|
}
|
|
}
|
|
}
|
|
}
|
|
],
|
|
states: {
|
|
hover: {
|
|
filter: {
|
|
type: 'none'
|
|
}
|
|
},
|
|
active: {
|
|
filter: {
|
|
type: 'none'
|
|
}
|
|
}
|
|
}
|
|
};
|
|
|
|
// Update SHU Panel Data
|
|
function updateShuPanel(currentData, previousData) {
|
|
const currentTotal = currentData.reduce((sum, val) => sum + val, 0);
|
|
const previousTotal = previousData.reduce((sum, val) => sum + val, 0);
|
|
const growth = previousTotal > 0 ? ((currentTotal - previousTotal) / previousTotal * 100).toFixed(1) : 0;
|
|
|
|
_id('shu-current').innerHTML = 'Rp ' + (currentTotal * 1000000).toLocaleString('id-ID');
|
|
_id('shu-previous').innerHTML = 'Rp ' + (previousTotal * 1000000).toLocaleString('id-ID');
|
|
_id('shu-growth').innerHTML = growth + '%';
|
|
|
|
// Update growth color
|
|
const growthElement = _id('shu-growth');
|
|
if (growth > 0) {
|
|
growthElement.className = 'font-weight-bold text-success';
|
|
} else if (growth < 0) {
|
|
growthElement.className = 'font-weight-bold text-danger';
|
|
} else {
|
|
growthElement.className = 'font-weight-bold text-info';
|
|
}
|
|
}
|
|
|
|
$.ajax({
|
|
url: "{{PATH}}/api/data/simpanan",
|
|
method: "post",
|
|
dataType: "json",
|
|
data: {
|
|
ok: 1
|
|
}, success: function (res) {
|
|
_id('sp').innerHTML = res.sp.sp;
|
|
_id('pb').innerHTML = res.sp.pb;
|
|
_id('pj').innerHTML = res.pj.pinjaman;
|
|
_id('ag').innerHTML = res.pj.angsuran;
|
|
}, error: function (e) {
|
|
throw "error connection";
|
|
}
|
|
});
|
|
|
|
const colors = ['#0074D9', '#FF4136', '#2ECC40', '#FF851B', '#7FDBFF', '#F012BE', '#3D9970', '#111111', '#01FF70', '#AAAAAA'];
|
|
|
|
var colorDanger = "#FF1744";
|
|
var DonutBar1 = Morris.Donut({
|
|
element: 'monthly-sales',
|
|
resize: true,
|
|
colors: ['#e9ecef'],
|
|
data: [
|
|
{ label: "", value: 1 },
|
|
],
|
|
formatter: function (value, data) {
|
|
return "Belum ada data"; // Only show label, no value
|
|
}
|
|
});
|
|
|
|
AuditDevQuery(`
|
|
SELECT kodesp label, sum(if(dk='d',jumlah,jumlah*-1)) \`value\` FROM msimpan GROUP BY kodesp HAVING kodesp <> 'bw'[;]
|
|
SELECT label,sum(\`value\`) \`value\` FROM (
|
|
SELECT kodesp label, sum(pokok) \`value\` FROM mpinjam GROUP BY kodesp
|
|
UNION ALL
|
|
SELECT m.kodesp label, sum(mags.pokok * -1) \`value\` FROM mags
|
|
LEFT JOIN mpinjam m ON mags.fkt = m.faktur GROUP BY label HAVING \`value\` <> 0
|
|
) a GROUP BY a.label
|
|
`, function (q) {
|
|
let [simpanan, pinjaman] = q;
|
|
|
|
// Check if simpanan data exists and has values
|
|
if (simpanan && simpanan.length > 0 && simpanan.some(item => item.value > 0)) {
|
|
DonutBar1.setData(simpanan);
|
|
} else {
|
|
// Keep the empty state chart with 100% for "Belum ada data"
|
|
DonutBar1.setData([{ label: "", value: 1 }]);
|
|
}
|
|
|
|
// Check if pinjaman data exists and has values
|
|
if (pinjaman && pinjaman.length > 0 && pinjaman.some(item => item.value > 0)) {
|
|
DonutBar.setData(pinjaman);
|
|
} else {
|
|
// Keep the empty state chart with 100% for "Belum ada data"
|
|
DonutBar.setData([{ label: "", value: 1 }]);
|
|
}
|
|
})
|
|
|
|
var colorDanger = "#FF1744";
|
|
var DonutBar = Morris.Donut({
|
|
element: 'donut-example',
|
|
resize: true,
|
|
colors: ['#e9ecef'],
|
|
data: [
|
|
{ label: "", value: 1 },
|
|
],
|
|
formatter: function (value, data) {
|
|
return "Belum ada data"; // Only show label, no value
|
|
}
|
|
});
|
|
|
|
// prosentase keuangan
|
|
|
|
setTimeout(function () {
|
|
DonutBar1.resizeHandler();
|
|
DonutBar.resizeHandler();
|
|
}, 1000);
|
|
var setV = 0;
|
|
|
|
let [year] = tanggal().normal.split('-');
|
|
|
|
const totalRevenueChartEl = document.querySelector('#totalRevenueChart');
|
|
|
|
let totalRevenueChart;
|
|
|
|
if (typeof totalRevenueChartEl !== undefined && totalRevenueChartEl !== null) {
|
|
totalRevenueChart = new ApexCharts(totalRevenueChartEl, totalRevenueChartOptions);
|
|
totalRevenueChart.render();
|
|
}
|
|
|
|
// Refresh SHU button functionality
|
|
_id('refresh-shu').addEventListener('click', function() {
|
|
accnil(year, null, function(a){
|
|
let data = a.shu();
|
|
let newShu = [];
|
|
let num = 0;
|
|
data.forEach(function(d,i){
|
|
num += d;
|
|
if(i%3 === 0 && i != 0){
|
|
newShu.push(num);
|
|
}
|
|
});
|
|
localStorage.setItem('shudata', JSON.stringify(newShu))
|
|
|
|
// Get previous year data for comparison
|
|
let previousYear = parseInt(year) - 1;
|
|
accnil(previousYear, null, function(b){
|
|
let prevData = b.shu();
|
|
let prevShu = [];
|
|
let prevNum = 0;
|
|
prevData.forEach(function(d,i){
|
|
prevNum += d;
|
|
if(i%3 === 0 && i != 0){
|
|
prevShu.push(prevNum);
|
|
}
|
|
});
|
|
|
|
// Update SHU panel
|
|
updateShuPanel(newShu, prevShu);
|
|
|
|
setTimeout(function(){
|
|
totalRevenueChart.updateSeries([
|
|
{
|
|
name: 'SHU Berjalan',
|
|
data: newShu.map(function(w){
|
|
return Math.round(w / 1000000)
|
|
})
|
|
}
|
|
])
|
|
},1000);
|
|
});
|
|
});
|
|
});
|
|
|
|
accnil(year, null, function(a){
|
|
let data = a.shu();
|
|
let newShu = [];
|
|
let num = 0;
|
|
data.forEach(function(d,i){
|
|
num += d;
|
|
if(i%3 === 0 && i != 0){
|
|
newShu.push(num);
|
|
}
|
|
});
|
|
localStorage.setItem('shudata', JSON.stringify(newShu))
|
|
|
|
// Get previous year data for comparison
|
|
let previousYear = parseInt(year) - 1;
|
|
accnil(previousYear, null, function(b){
|
|
let prevData = b.shu();
|
|
let prevShu = [];
|
|
let prevNum = 0;
|
|
prevData.forEach(function(d,i){
|
|
prevNum += d;
|
|
if(i%3 === 0 && i != 0){
|
|
prevShu.push(prevNum);
|
|
}
|
|
});
|
|
|
|
// Update SHU panel
|
|
updateShuPanel(newShu, prevShu);
|
|
|
|
setTimeout(function(){
|
|
totalRevenueChart.updateSeries([
|
|
{
|
|
name: 'SHU Berjalan',
|
|
data: newShu.map(function(w){
|
|
return Math.round(w / 1000000)
|
|
})
|
|
}
|
|
])
|
|
},1000);
|
|
});
|
|
});
|
|
|
|
throw 'stop next action'; |