fix change api route data settings

This commit is contained in:
arifal
2025-02-25 10:41:59 +07:00
parent 93f0ac5ef7
commit 9e55ea0dbb

View File

@@ -17,35 +17,64 @@ document.addEventListener("DOMContentLoaded", async function () {
targetPadElement.textContent = formatCurrency(targetPadValue);
// Total Potensi Berkas
const totalPotensiBerkas = document.getElementById("total-potensi-berkas");
const totalPotensiBerkas = document.getElementById(
"total-potensi-berkas"
);
if (!totalPotensiBerkas) return;
const totalPotensiBerkasValue = await getDataTotalPotensi(selectedYear);
totalPotensiBerkas.textContent = formatCurrency(totalPotensiBerkasValue.totalData);
totalPotensiBerkas.textContent = formatCurrency(
totalPotensiBerkasValue.totalData
);
// Total Berkas Terverifikasi
const totalBerkasTerverifikasi = document.getElementById("total-berkas-terverifikasi");
const totalBerkasTerverifikasi = document.getElementById(
"total-berkas-terverifikasi"
);
if (!totalBerkasTerverifikasi) return;
const totalBerkasTerverifikasiValue = await getDataVerification(selectedYear);
totalBerkasTerverifikasi.textContent = formatCurrency(totalBerkasTerverifikasiValue.totalData);
const totalBerkasTerverifikasiValue = await getDataVerification(
selectedYear
);
totalBerkasTerverifikasi.textContent = formatCurrency(
totalBerkasTerverifikasiValue.totalData
);
// Total Kekurangan potensi
const totalKekuranganPotensi = document.getElementById("total-kekurangan-potensi");
const totalKekuranganPotensi = document.getElementById(
"total-kekurangan-potensi"
);
if (!totalKekuranganPotensi) return;
const totalKekuranganPotensiValue = new Big(targetPadValue) - new Big(totalPotensiBerkasValue.totalData);
totalKekuranganPotensi.textContent = formatCurrency(totalKekuranganPotensiValue)
const totalKekuranganPotensiValue =
new Big(targetPadValue) -
new Big(totalPotensiBerkasValue.totalData);
totalKekuranganPotensi.textContent = formatCurrency(
totalKekuranganPotensiValue
);
// Total Potensi PBG dari tata ruang
const totalPotensiPBGTataRuang = document.getElementById("total-potensi-pbd-tata-ruang");
const totalPotensiPBGTataRuang = document.getElementById(
"total-potensi-pbd-tata-ruang"
);
if (!totalPotensiPBGTataRuang) return;
const totalPotensiPBGTataRuangValue = await getDataSettings("TATA_RUANG");
totalPotensiPBGTataRuang.textContent = formatCurrency(totalPotensiPBGTataRuangValue);
const totalPotensiPBGTataRuangValue = await getDataSettings(
"TATA_RUANG"
);
totalPotensiPBGTataRuang.textContent = formatCurrency(
totalPotensiPBGTataRuangValue
);
// Total Berkas Belum terverifikasi
const totalBerkasBelumTerverifikasi = document.getElementById("total-berkas-belum-terverifikasi");
const totalBerkasBelumTerverifikasi = document.getElementById(
"total-berkas-belum-terverifikasi"
);
if (!totalBerkasBelumTerverifikasi) return;
const totalBerkasBelumTerverifikasiValue = await getDataNonVerification(selectedYear);
const totalBerkasBelumTerverifikasiCount = totalBerkasBelumTerverifikasiValue.countData;
totalBerkasBelumTerverifikasi.textContent = formatCurrency(totalBerkasBelumTerverifikasiValue.totalData);
const totalBerkasBelumTerverifikasiValue = await getDataNonVerification(
selectedYear
);
const totalBerkasBelumTerverifikasiCount =
totalBerkasBelumTerverifikasiValue.countData;
totalBerkasBelumTerverifikasi.textContent = formatCurrency(
totalBerkasBelumTerverifikasiValue.totalData
);
// Total Berkas Usaha
const totalBerkasUsahaValue = await getDataBusiness(selectedYear);
@@ -58,21 +87,40 @@ document.addEventListener("DOMContentLoaded", async function () {
const totalBerkasNonUsahaTotalData = totalBerkasNonUsahaValue.totalData;
// Pie Chart Section
let persenUsaha = totalBerkasBelumTerverifikasiCount > 0
? ((totalBerkasUsahaCount / totalBerkasBelumTerverifikasiCount) * 100).toFixed(2)
: "0";
let persenUsaha =
totalBerkasBelumTerverifikasiCount > 0
? (
(totalBerkasUsahaCount /
totalBerkasBelumTerverifikasiCount) *
100
).toFixed(2)
: "0";
let persenNonUsaha = totalBerkasBelumTerverifikasiCount > 0
? ((totalBerkasNonUsahaCount / totalBerkasBelumTerverifikasiCount) * 100).toFixed(2)
: "0";
let persenNonUsaha =
totalBerkasBelumTerverifikasiCount > 0
? (
(totalBerkasNonUsahaCount /
totalBerkasBelumTerverifikasiCount) *
100
).toFixed(2)
: "0";
const dataSeriesPieChart = [Number(persenUsaha), Number(persenNonUsaha)]
const dataSeriesPieChart = [
Number(persenUsaha),
Number(persenNonUsaha),
];
const labelsPieChart = ["Berkas Usaha", "Berkas Non Usaha"];
document.querySelector("td[data-category='non-usaha']").textContent = formatCurrency(totalBerkasNonUsahaTotalData).toLocaleString();
document.querySelector("td[data-category='non-usaha-percentage']").textContent = persenNonUsaha + "%";
document.querySelector("td[data-category='non-usaha']").textContent =
formatCurrency(totalBerkasNonUsahaTotalData).toLocaleString();
document.querySelector(
"td[data-category='non-usaha-percentage']"
).textContent = persenNonUsaha + "%";
document.querySelector("td[data-category='usaha']").textContent = formatCurrency(totalBerkasUsahaTotalData).toLocaleString();
document.querySelector("td[data-category='usaha-percentage']").textContent = persenUsaha + "%";
document.querySelector("td[data-category='usaha']").textContent =
formatCurrency(totalBerkasUsahaTotalData).toLocaleString();
document.querySelector(
"td[data-category='usaha-percentage']"
).textContent = persenUsaha + "%";
updatePieChart(dataSeriesPieChart, labelsPieChart);
@@ -81,27 +129,30 @@ document.addEventListener("DOMContentLoaded", async function () {
console.log(allLocation);
// Filter hanya data yang memiliki angka valid
let validLocations = allLocation.dataLocation.filter(loc => {
return !isNaN(parseFloat(loc.longitude)) && !isNaN(parseFloat(loc.latitude));
let validLocations = allLocation.dataLocation.filter((loc) => {
return (
!isNaN(parseFloat(loc.longitude)) &&
!isNaN(parseFloat(loc.latitude))
);
});
// Ubah string ke float
validLocations = validLocations.map(loc => ({
validLocations = validLocations.map((loc) => ({
name: loc.project_name,
longitude: parseFloat(loc.longitude),
latitude: parseFloat(loc.latitude)
latitude: parseFloat(loc.latitude),
}));
console.log(validLocations.name)
console.log(validLocations.name);
// Inisialisasi peta
var map = L.map('map').setView([-7.0230, 107.5275], 10);
L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
attribution: '© OpenStreetMap contributors'
var map = L.map("map").setView([-7.023, 107.5275], 10);
L.tileLayer("https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png", {
attribution: "© OpenStreetMap contributors",
}).addTo(map);
// Tambahkan marker ke peta
validLocations.forEach(function(loc) {
validLocations.forEach(function (loc) {
L.marker([loc.latitude, loc.longitude])
.addTo(map)
.bindPopup(`<b>${loc.name}</b>`) // Popup saat diklik
@@ -109,22 +160,40 @@ document.addEventListener("DOMContentLoaded", async function () {
});
// Realisasi terbit PBG
const totalRealisasiTerbitPBG = document.getElementById("realisasi-terbit-pbg");
const totalRealisasiTerbitPBG = document.getElementById(
"realisasi-terbit-pbg"
);
if (!totalRealisasiTerbitPBG) return;
const totalRealisasiTerbitPBGValue = await getDataSettings("REALISASI_TERBIT_PBG_SUM");
totalRealisasiTerbitPBG.textContent = formatCurrency(totalRealisasiTerbitPBGValue);
const totalRealisasiTerbitPBGValue = await getDataSettings(
"REALISASI_TERBIT_PBG_SUM"
);
totalRealisasiTerbitPBG.textContent = formatCurrency(
totalRealisasiTerbitPBGValue
);
// Menunggu Klik DPMPTSP
const totalMenungguKlikDpmptsp = document.getElementById("waiting-click-dpmptsp");
const totalMenungguKlikDpmptsp = document.getElementById(
"waiting-click-dpmptsp"
);
if (!totalMenungguKlikDpmptsp) return;
const totalMenungguKlikDpmptspValue = await getDataSettings("MENUNGGU_KLIK_DPMPTSP_SUM");
totalMenungguKlikDpmptsp.textContent = formatCurrency(totalMenungguKlikDpmptspValue);
const totalMenungguKlikDpmptspValue = await getDataSettings(
"MENUNGGU_KLIK_DPMPTSP_SUM"
);
totalMenungguKlikDpmptsp.textContent = formatCurrency(
totalMenungguKlikDpmptspValue
);
// Proses Dinas Teknis
const totalProsesDinasTeknis = document.getElementById("processing-technical-services");
const totalProsesDinasTeknis = document.getElementById(
"processing-technical-services"
);
if (!totalProsesDinasTeknis) return;
const totalProsesDinasTeknisValue = await getDataSettings("PROSES_DINAS_TEKNIS_SUM");
totalProsesDinasTeknis.textContent = formatCurrency(totalProsesDinasTeknisValue);
const totalProsesDinasTeknisValue = await getDataSettings(
"PROSES_DINAS_TEKNIS_SUM"
);
totalProsesDinasTeknis.textContent = formatCurrency(
totalProsesDinasTeknisValue
);
// Load Tabel Baru di Update
const tableLastUpdated = new GeneralTable(
@@ -172,25 +241,32 @@ document.addEventListener("DOMContentLoaded", async function () {
tableSKPBGTerbit.init();
document.querySelector("#pbg-filter-by-updated-at .gridjs-search").hidden = true;
document.querySelector("#pbg-filter-by-updated-at .gridjs-footer").hidden = true;
document.querySelector("#pbg-filter-by-status .gridjs-search").hidden = true;
document.querySelector("#pbg-filter-by-status .gridjs-footer").hidden = true;
document.querySelector(
"#pbg-filter-by-updated-at .gridjs-search"
).hidden = true;
document.querySelector(
"#pbg-filter-by-updated-at .gridjs-footer"
).hidden = true;
document.querySelector(
"#pbg-filter-by-status .gridjs-search"
).hidden = true;
document.querySelector(
"#pbg-filter-by-status .gridjs-footer"
).hidden = true;
}
await updateDataByYear(yearPicker.value);
yearPicker.addEventListener("change", async function () {
console.log("event change dropdown")
console.log("event change dropdown");
await updateDataByYear(yearPicker.value);
});
});
async function getDataSettings(string_key) {
try {
const response = await fetch(
`${GlobalConfig.apiHost}/api/api-data-settings?search=${string_key}`,
`${GlobalConfig.apiHost}/api/data-settings?search=${string_key}`,
{
credentials: "include",
headers: {
@@ -224,7 +300,7 @@ async function getDataTotalPotensi(year) {
Authorization: `Bearer ${
document.querySelector("meta[name='api-token']").content
}`,
"Content-Type": "application/json"
"Content-Type": "application/json",
},
}
);
@@ -251,8 +327,7 @@ async function getDataVerification(year) {
credentials: "include",
headers: {
Authorization: `Bearer ${
document.querySelector("meta[name='api-token']")
.content
document.querySelector("meta[name='api-token']").content
}`,
"Content-Type": "application/json",
},
@@ -263,26 +338,25 @@ async function getDataVerification(year) {
console.error("Network response was not ok", response);
}
const data = await response.json()
const data = await response.json();
return {
totalData: data.data.total,
};
} catch (error) {
console.error("Error fetching chart data:", error);
return 0
return 0;
}
}
async function getDataNonVerification(year) {
try {
const response = await fetch (
const response = await fetch(
`${GlobalConfig.apiHost}/api/non-verification-documents?year=${year}`,
{
credentials: "include",
headers: {
Authorization: `Bearer ${
document.querySelector("meta[name='api-token']")
.content
document.querySelector("meta[name='api-token']").content
}`,
"Content-Type": "application/json",
},
@@ -297,7 +371,7 @@ async function getDataNonVerification(year) {
return {
countData: data.data.count,
totalData: data.data.total,
}
};
} catch (error) {
console.error("Error fetching chart data:", error);
return 0;
@@ -312,8 +386,7 @@ async function getDataBusiness(year) {
credentials: "include",
headers: {
Authorization: `Bearer ${
document.querySelector("meta[name='api-token']")
.content
document.querySelector("meta[name='api-token']").content
}`,
"Content-Type": "application/json",
},
@@ -343,8 +416,7 @@ async function getDataNonBusiness(year) {
credentials: "include",
headers: {
Authorization: `Bearer ${
document.querySelector("meta[name='api-token']")
.content
document.querySelector("meta[name='api-token']").content
}`,
"Content-Type": "application/json",
},
@@ -357,8 +429,8 @@ async function getDataNonBusiness(year) {
const data = await response.json();
return {
countData: data.data.count,
totalData: data.data.total
}
totalData: data.data.total,
};
} catch (error) {
console.error("Error fetching chart data:", error);
return 0;
@@ -373,8 +445,7 @@ async function getAllLocation() {
credentials: "include",
headers: {
Authorization: `Bearer ${
document.querySelector("meta[name='api-token']")
.content
document.querySelector("meta[name='api-token']").content
}`,
"Content-Type": "application/json",
},
@@ -386,7 +457,7 @@ async function getAllLocation() {
const data = await response.json();
return {
dataLocation: data.data,
}
};
} catch (error) {
console.error("Error fetching chart data:", error);
return 0;
@@ -397,38 +468,40 @@ async function initChart() {
var options = {
chart: {
height: 180,
type: 'donut',
type: "donut",
},
series: [0, 0], // Inisialisasi dengan nilai awal
labels: ["Berkas Usaha", "Berkas Non Usaha"],
legend: {
show: false
show: false,
},
stroke: {
width: 0
width: 0,
},
plotOptions: {
pie: {
donut: {
size: '60%',
}
}
size: "60%",
},
},
},
colors: ["#7e67fe", "#17c553"],
dataLabels: {
enabled: false
enabled: false,
},
responsive: [{
breakpoint: 480,
options: {
chart: {
width: 200
}
}
}],
responsive: [
{
breakpoint: 480,
options: {
chart: {
width: 200,
},
},
},
],
fill: {
type: 'gradient'
}
type: "gradient",
},
};
chart = new ApexCharts(document.querySelector("#conversions"), options);
@@ -447,7 +520,7 @@ async function updatePieChart(dataSeries, labels) {
// Perbarui label jika diperlukan
if (Array.isArray(labels) && labels.length === dataSeries.length) {
chart.updateOptions({
labels: labels
labels: labels,
});
}
}
@@ -457,7 +530,7 @@ function formatCurrency(number) {
return new Intl.NumberFormat("id-ID", {
style: "currency",
currency: "IDR",
minimumFractionDigits: 0
minimumFractionDigits: 0,
}).format(number);
}
@@ -467,4 +540,4 @@ const pbgTaskColumns = [
"Nomor Registrasi",
"Nomor Dokumen",
"Alamat",
]
];