From 9c31bc57aea30ced921791e2c458c6503550bc79 Mon Sep 17 00:00:00 2001 From: kur0nek-o Date: Fri, 1 Mar 2024 19:16:19 +0700 Subject: [PATCH] Add cell-template for custom table column*** ***Adjust column width for MonalisaLB_KADDalamPelaporan.vue*** ***Add new queries for laporan bulanan --- .../Rekap/RKeluhan_PerJenisKeluhan.vue | 1 + .../Bulanan/MonalisaLB_AgingComplaint.vue | 93 +++------- .../Bulanan/MonalisaLB_EnergyNotSales.vue | 110 ++++++------ .../Bulanan/MonalisaLB_KADDalamPelaporan.vue | 3 +- .../MonalisaLB_PenurunanJumlahKomplain.vue | 159 +++--------------- src/utils/graphql.ts | 119 ++++++++++++- 6 files changed, 222 insertions(+), 263 deletions(-) diff --git a/src/components/Pages/Keluhan/Rekap/RKeluhan_PerJenisKeluhan.vue b/src/components/Pages/Keluhan/Rekap/RKeluhan_PerJenisKeluhan.vue index c52ee8e..20a1d87 100755 --- a/src/components/Pages/Keluhan/Rekap/RKeluhan_PerJenisKeluhan.vue +++ b/src/components/Pages/Keluhan/Rekap/RKeluhan_PerJenisKeluhan.vue @@ -90,6 +90,7 @@ data-type="number" caption="%" css-class="custom-table-column" + cell-template="percent" /> diff --git a/src/components/Pages/Monalisa/Laporan/Bulanan/MonalisaLB_AgingComplaint.vue b/src/components/Pages/Monalisa/Laporan/Bulanan/MonalisaLB_AgingComplaint.vue index 68862f3..0b89cb5 100755 --- a/src/components/Pages/Monalisa/Laporan/Bulanan/MonalisaLB_AgingComplaint.vue +++ b/src/components/Pages/Monalisa/Laporan/Bulanan/MonalisaLB_AgingComplaint.vue @@ -1,5 +1,10 @@ + @@ -152,7 +162,7 @@ import { exportDataGrid as exportToExcel } from 'devextreme/excel_exporter' import { saveAs } from 'file-saver' import { Workbook } from 'exceljs' import { useQuery } from '@vue/apollo-composable' -import gql from 'graphql-tag' +import { queries } from '@/utils/graphql' const position = { of: '#data' } const showIndicator = ref(true) @@ -196,69 +206,18 @@ const onSelectionChanged = ({ selectedRowsData }: any) => { const data = selectedRowsData[0] console.log(data) } -const agingComplaintBulanan = gql` - query agingComplaintBulanan($idUid: Int, $idUp3: Int, $idUlp: Int, $bulan: Int, $tahun: Int) { - agingComplaintBulanan( - idUid: $idUid - idUp3: $idUp3 - idUlp: $idUlp - bulan: $bulan - tahun: $tahun - ) { - nama_regional - id_uid - nama_uid - id_up3 - nama_up3 - id_ulp - nama_ulp - avg_durasi_recovery_gangguan - sla_gangguan - avg_durasi_recovery_keluhan - sla_keluhan - aging_complaint_gangguan - aging_complaint_keluhan - avg_aging_complaint - } - } -` -// const agingComplaintBulanan = gql` -// query agingComplaintBulanan( -// $regional: String -// $idUid: Int -// $idUp3: Int -// $idUlp: Int -// $bulan: Int -// $tahun: Int -// ) { -// agingComplaintBulanan( -// regional: $regional -// idUid: $idUid -// idUp3: $idUp3 -// idUlp: $idUlp -// bulan: $bulan -// tahun: $tahun -// ) { -// aging_komplain_gangguan -// aging_komplain_keluhan -// nama_posko -// persen_rata_aging_komplain -// rata_rct_gangguan_bulan -// rata_rct_gangguan_sla -// rata_rct_keluhan_bulan -// rata_rct_keluhan_sla -// } -// } -// ` -const { onResult, onError, loading, refetch } = useQuery(agingComplaintBulanan, { - // regional: 0, - idUp3: 0, - idUid: 0, - idUlp: 0, - bulan: bulanSekarang.value, - tahun: tahunSekarang.value -}) +const { onResult, onError, loading, refetch } = useQuery( + queries.monalisa.laporan.bulanan.agingComplaintBulanan, + { + // regional: 0, + idUp3: 0, + idUid: 0, + idUlp: 0, + bulan: bulanSekarang.value, + tahun: tahunSekarang.value + } +) const filterData = (params: any) => { const { regional, ulp, uid, up3, bulan, tahun } = params diff --git a/src/components/Pages/Monalisa/Laporan/Bulanan/MonalisaLB_EnergyNotSales.vue b/src/components/Pages/Monalisa/Laporan/Bulanan/MonalisaLB_EnergyNotSales.vue index c4a56cc..ac4b6fb 100755 --- a/src/components/Pages/Monalisa/Laporan/Bulanan/MonalisaLB_EnergyNotSales.vue +++ b/src/components/Pages/Monalisa/Laporan/Bulanan/MonalisaLB_EnergyNotSales.vue @@ -1,7 +1,13 @@ @@ -114,14 +126,17 @@ import { exportDataGrid as exportToExcel } from 'devextreme/excel_exporter' import { saveAs } from 'file-saver' import { Workbook } from 'exceljs' import { useQuery } from '@vue/apollo-composable' -import gql from 'graphql-tag' +import { queries } from '@/utils/graphql' + const position = { of: '#data' } const showIndicator = ref(true) const shading = ref(true) const showPane = ref(true) const data = ref([]) -const dataDetail = ref() -const showDetail = ref(false) +const tahunSekarang = ref(new Date().getFullYear()) +const bulanSekarang = ref(new Date().getMonth()) +const tahunLalu = ref(tahunSekarang.value - 1) + const onExporting = (e: any) => { if (e.format === 'pdf') { const doc = new jsPDF() @@ -155,61 +170,34 @@ const onSelectionChanged = ({ selectedRowsData }: any) => { const data = selectedRowsData[0] console.log(data) } -const agingComplaintBulanan = gql` - query DaftaragingComplaintBulanan( - $regional: String - $posko: Int - $idUid: Int - $idUp3: Int - $bulan: Int - $tahun: Int - ) { - agingComplaintBulanan( - regional: $regional - posko: $posko - idUid: $idUid - idUp3: $idUp3 - bulan: $bulan - tahun: $tahun - ) { - ens_bencana_alam - ens_terencana - ens_tidak_terencana - kpi_ens - nama_posko - total - } - } -` -const { onResult, onError, loading, refetch } = useQuery(agingComplaintBulanan, { - regional: '', - posko: '', - idUid: 0, - idUp3: 0, - bulan: 10, - tahun: 2023 -}) -const filterData = (params: any) => { - const { regional, posko, idUid, idUp3, bulan, tahun } = params +const { onResult, onError, loading, refetch } = useQuery( + queries.monalisa.laporan.bulanan.energyNotSalesBulanan, + { + // regional: 0, + idUp3: 0, + idUid: 0, + idUlp: 0, + bulan: bulanSekarang.value, + tahun: tahunSekarang.value + } +) +const filterData = (params: any) => { + const { regional, ulp, uid, up3, bulan, tahun } = params + bulanSekarang.value = bulan.id + tahunSekarang.value = tahun.id + tahunLalu.value = tahun.id - 1 refetch({ - regional: regional, - posko: posko ? posko.id : 0, - idUid: idUid ? idUid.id : 0, - idUp3: idUp3 ? idUp3.id : 0, - bulan: bulan ? bulan.id : 10, - tahun: bulan ? tahun.id : 2023 + // regional: regional, + idUid: uid ? uid.id : 0, + idUp3: up3 ? up3.id : 0, + idUlp: ulp ? ulp.id : 0, + bulan: bulan ? bulan.id : bulanSekarang.value, + tahun: bulan ? tahun.id : tahunSekarang.value }) onResult((queryResult) => { if (queryResult.data != undefined) { - queryResult.data.agingComplaintBulanan.forEach((item: any) => { - data.value = [ - ...data.value, - { - ...item - } - ] - }) + data.value = queryResult.data.energyNotSalesBulanan } console.log(queryResult.data) console.log(queryResult.loading) diff --git a/src/components/Pages/Monalisa/Laporan/Bulanan/MonalisaLB_KADDalamPelaporan.vue b/src/components/Pages/Monalisa/Laporan/Bulanan/MonalisaLB_KADDalamPelaporan.vue index 8a87a6a..18a1945 100755 --- a/src/components/Pages/Monalisa/Laporan/Bulanan/MonalisaLB_KADDalamPelaporan.vue +++ b/src/components/Pages/Monalisa/Laporan/Bulanan/MonalisaLB_KADDalamPelaporan.vue @@ -12,7 +12,6 @@ :row-alternation-enabled="true" :hover-state-enabled="true" @selection-changed="onSelectionChanged" - :column-width="100" @exporting="onExporting" :allow-column-resizing="true" column-resizing-mode="widget" @@ -88,7 +87,7 @@ - + @@ -45,6 +50,7 @@ data-field="nama_regional" caption="Nama Unit" css-class="custom-table-column" + cell-template="cell-left" /> - - - - - - - - + + + @@ -275,8 +255,8 @@ import { exportDataGrid as exportToExcel } from 'devextreme/excel_exporter' import { saveAs } from 'file-saver' import { Workbook } from 'exceljs' import { useQuery } from '@vue/apollo-composable' -import gql from 'graphql-tag' import { getMonthName } from '@/utils/texts' +import { queries } from '@/utils/graphql' const position = { of: '#data' } const showIndicator = ref(true) @@ -321,100 +301,17 @@ const onSelectionChanged = ({ selectedRowsData }: any) => { console.log(data) } -const penurunanJumlahKomplainBulanan = gql` - query DaftarpenurunanJumlahKomplainBulanan( - $idUid: Int - $idUp3: Int - $idUlp: Int - $bulan: Int - $tahun: Int - ) { - penurunanJumlahKomplainBulanan( - idUid: $idUid - idUp3: $idUp3 - idUlp: $idUlp - bulan: $bulan - tahun: $tahun - ) { - nama_regional - id_uid - nama_uid - id_up3 - nama_up3 - id_ulp - nama_ulp - total_gangguan_tahun_ini - total_keluhan_tahun_ini - total_gangguan_informasi_tahun_ini - total_keluhan_informasi_tahun_ini - total_informasi_tahun_ini - total_tahun_ini - total_gangguan_tahun_sebelumnya - total_keluhan_tahun_sebelumnya - total_gangguan_informasi_tahun_sebelumnya - total_keluhan_informasi_tahun_sebelumnya - total_informasi_tahun_sebelumnya - total_tahun_sebelumnya - delta_gangguan - delta_keluhan - delta_informasi - persen_delta_gangguan - persen_delta_keluhan - persen_delta_informasi - persen_delta_total - } +const { onResult, onError, loading, refetch } = useQuery( + queries.monalisa.laporan.bulanan.penurunanJumlahKomplainBulanan, + { + // regional: 0, + idUp3: 0, + idUid: 0, + idUlp: 0, + bulan: bulanSekarang.value, + tahun: tahunSekarang.value } -` - -// const penurunanJumlahKomplainBulanan = gql` -// query DaftarpenurunanJumlahKomplainBulanan( -// $regional: String -// $posko: Int -// $idUid: Int -// $idUp3: Int -// $bulan: Int -// $tahun: Int -// ) { -// penurunanJumlahKomplainBulanan( -// regional: $regional -// posko: $posko -// idUid: $idUid -// idUp3: $idUp3 -// bulan: $bulan -// tahun: $tahun -// ) { -// delta_penurunan_gangguan -// delta_penurunan_informasi -// delta_penurunan_keluhan -// gangguan_bulan_ini -// gangguan_bulan_lalu -// informasi_gangguan_bulan_ini -// informasi_gangguan_bulan_lalu -// informasi_keluhan_bulan_ini -// informasi_keluhan_bulan_lalu -// keluhan_bulan_ini -// keluhan_bulan_lalu -// nama_posko -// persen_penurunan_gangguan -// persen_penurunan_informasi -// persen_penurunan_keluhan -// persen_penurunan_total -// total_bulan_ini -// total_bulan_lalu -// total_komplain_bulan_ini -// total_komplain_bulan_lalu -// } -// } -// ` - -const { onResult, onError, loading, refetch } = useQuery(penurunanJumlahKomplainBulanan, { - // regional: 0, - idUp3: 0, - idUid: 0, - idUlp: 0, - bulan: bulanSekarang.value, - tahun: tahunSekarang.value -}) +) const filterData = (params: any) => { const { regional, ulp, uid, up3, bulan, tahun } = params diff --git a/src/utils/graphql.ts b/src/utils/graphql.ts index b67a841..02f7167 100755 --- a/src/utils/graphql.ts +++ b/src/utils/graphql.ts @@ -365,7 +365,122 @@ export const queries = { } ` } + }, + laporan: { + bulanan: { + penurunanJumlahKomplainBulanan: gql` + query DaftarPenurunanJumlahKomplainBulanan( + #$regional: String + $idUid: Int + $idUp3: Int + $idUlp: Int + $bulan: Int + $tahun: Int + ) { + penurunanJumlahKomplainBulanan( + #regional: $regional + idUid: $idUid + idUp3: $idUp3 + idUlp: $idUlp + bulan: $bulan + tahun: $tahun + ) { + nama_regional + id_uid + nama_uid + id_up3 + nama_up3 + id_ulp + nama_ulp + total_gangguan_tahun_ini + total_keluhan_tahun_ini + total_gangguan_informasi_tahun_ini + total_keluhan_informasi_tahun_ini + total_informasi_tahun_ini + total_tahun_ini + total_gangguan_tahun_sebelumnya + total_keluhan_tahun_sebelumnya + total_gangguan_informasi_tahun_sebelumnya + total_keluhan_informasi_tahun_sebelumnya + total_informasi_tahun_sebelumnya + total_tahun_sebelumnya + delta_gangguan + delta_keluhan + delta_informasi + persen_delta_gangguan + persen_delta_keluhan + persen_delta_informasi + persen_delta_total + } + } + `, + agingComplaintBulanan: gql` + query DaftarAgingComplaintBulanan( + #$regional: String + $idUid: Int + $idUp3: Int + $idUlp: Int + $bulan: Int + $tahun: Int + ) { + agingComplaintBulanan( + #regional: $regional + idUid: $idUid + idUp3: $idUp3 + idUlp: $idUlp + bulan: $bulan + tahun: $tahun + ) { + nama_regional + id_uid + nama_uid + id_up3 + nama_up3 + id_ulp + nama_ulp + avg_durasi_recovery_gangguan + sla_gangguan + avg_durasi_recovery_keluhan + sla_keluhan + aging_complaint_gangguan + aging_complaint_keluhan + avg_aging_complaint + } + } + `, + energyNotSalesBulanan: gql` + query DaftarEnergyNotSalesBulanan( + #$regional: String + $idUid: Int + $idUp3: Int + $idUlp: Int + $bulan: Int + $tahun: Int + ) { + energyNotSalesBulanan( + #regional: $regional + idUid: $idUid + idUp3: $idUp3 + idUlp: $idUlp + bulan: $bulan + tahun: $tahun + ) { + nama_regional + id_uid + nama_uid + id_up3 + nama_up3 + id_ulp + nama_ulp + terencana + tidak_terencana + bencana_alam + total + kpi_ens + } + } + ` + } } - }, - + } }