From 2ecb430613cc8818e9e71077fc23cd8688f93bd9 Mon Sep 17 00:00:00 2001 From: kur0nek-o Date: Thu, 29 Feb 2024 16:56:16 +0700 Subject: [PATCH 1/6] Update total duration and response time in Gangguan components --- src/assets/css/style.css | 4 ++++ .../Pages/Gangguan/Rekap/RGangguan_JenisGangguan.vue | 6 ++++-- src/components/Pages/Gangguan/Rekap/RGangguan_PerPosko.vue | 6 ++++-- src/components/Pages/Gangguan/Rekap/RGangguan_PerRegu.vue | 6 ++++-- .../Pages/Gangguan/Rekap/RGangguan_PerTanggal.vue | 6 +++--- 5 files changed, 19 insertions(+), 9 deletions(-) diff --git a/src/assets/css/style.css b/src/assets/css/style.css index 7e4268c..43b09f7 100755 --- a/src/assets/css/style.css +++ b/src/assets/css/style.css @@ -1373,6 +1373,10 @@ body { margin-top: 1.5rem; } +.mb-5 { + margin-bottom: 1.25rem; +} + .mb-10 { margin-bottom: 2.5rem; } diff --git a/src/components/Pages/Gangguan/Rekap/RGangguan_JenisGangguan.vue b/src/components/Pages/Gangguan/Rekap/RGangguan_JenisGangguan.vue index b10066d..d3c1107 100755 --- a/src/components/Pages/Gangguan/Rekap/RGangguan_JenisGangguan.vue +++ b/src/components/Pages/Gangguan/Rekap/RGangguan_JenisGangguan.vue @@ -409,6 +409,8 @@ const GET_REKAP_JENIS_GANGGUAN = gql` tipe_permasalahan total kode + total_durasi_recovery + total_durasi_response total_diatas_sla_recovery total_diatas_sla_response total_dibawah_sla_recovery @@ -499,7 +501,7 @@ const filterData = (params: any) => { }, responseTime: { menit: { - total: item.avg_durasi_response, + total: item.total_durasi_response, rataRata: item.avg_durasi_response, max: item.max_durasi_response, min: item.min_durasi_response @@ -511,7 +513,7 @@ const filterData = (params: any) => { }, recoveryTime: { menit: { - total: item.avg_durasi_recovery, + total: item.total_durasi_recovery, rataRata: item.avg_durasi_recovery, max: item.max_durasi_recovery, min: item.min_durasi_recovery diff --git a/src/components/Pages/Gangguan/Rekap/RGangguan_PerPosko.vue b/src/components/Pages/Gangguan/Rekap/RGangguan_PerPosko.vue index b31477f..57b9d6b 100755 --- a/src/components/Pages/Gangguan/Rekap/RGangguan_PerPosko.vue +++ b/src/components/Pages/Gangguan/Rekap/RGangguan_PerPosko.vue @@ -510,6 +510,8 @@ const GET_REKAPITULASI_GANGGUAN_PER_POSKO = gql` persen_inproses persen_selesai total + total_durasi_recovery + total_durasi_response total_diatas_sla_recovery total_diatas_sla_response total_dibawah_sla_recovery @@ -596,7 +598,7 @@ const filterData = (params: any) => { }, responseTime: { menit: { - total: 0, + total: item.total_durasi_response, rataRata: item.avg_durasi_response, max: item.max_durasi_response, min: item.min_durasi_response @@ -608,7 +610,7 @@ const filterData = (params: any) => { }, recoveryTime: { menit: { - total: 0, + total: item.total_durasi_recovery, rataRata: item.avg_durasi_recovery, max: item.max_durasi_recovery, min: item.min_durasi_recovery diff --git a/src/components/Pages/Gangguan/Rekap/RGangguan_PerRegu.vue b/src/components/Pages/Gangguan/Rekap/RGangguan_PerRegu.vue index f886ed0..a5769e0 100755 --- a/src/components/Pages/Gangguan/Rekap/RGangguan_PerRegu.vue +++ b/src/components/Pages/Gangguan/Rekap/RGangguan_PerRegu.vue @@ -410,6 +410,8 @@ const GET_REKAPITULASI_GANGGUAN_PER_REGU = gql` persen_selesai nama_posko total + total_durasi_recovery + total_durasi_response total_diatas_sla_recovery total_diatas_sla_response total_dibawah_sla_recovery @@ -498,7 +500,7 @@ const filterData = (params: any) => { }, responseTime: { menit: { - total: 0, + total: item.total_durasi_response, rataRata: item.avg_durasi_response, max: item.max_durasi_response, min: item.min_durasi_response @@ -510,7 +512,7 @@ const filterData = (params: any) => { }, recoveryTime: { menit: { - total: 0, + total: item.total_durasi_recovery, rataRata: item.avg_durasi_recovery, max: item.max_durasi_recovery, min: item.min_durasi_recovery diff --git a/src/components/Pages/Gangguan/Rekap/RGangguan_PerTanggal.vue b/src/components/Pages/Gangguan/Rekap/RGangguan_PerTanggal.vue index 434b15d..720e118 100755 --- a/src/components/Pages/Gangguan/Rekap/RGangguan_PerTanggal.vue +++ b/src/components/Pages/Gangguan/Rekap/RGangguan_PerTanggal.vue @@ -51,7 +51,7 @@ Date: Thu, 29 Feb 2024 17:26:31 +0700 Subject: [PATCH 2/6] Update cell-template in DKeluhan_RecoveryTime and DKeluhan_ResponseTime --- .../Keluhan/Daftar/DKeluhan_BerdasarMedia.vue | 246 ++++++++++++++---- .../Keluhan/Daftar/DKeluhan_RecoveryTime.vue | 32 ++- .../Keluhan/Daftar/DKeluhan_ResponseTime.vue | 33 ++- .../Pages/Keluhan/Daftar/DKeluhan_STIDP.vue | 239 +++++++++++++---- .../Keluhan/Daftar/DKeluhan_SelesaiCC.vue | 199 +++++++++++--- 5 files changed, 610 insertions(+), 139 deletions(-) diff --git a/src/components/Pages/Keluhan/Daftar/DKeluhan_BerdasarMedia.vue b/src/components/Pages/Keluhan/Daftar/DKeluhan_BerdasarMedia.vue index 25d8feb..0b33fa2 100755 --- a/src/components/Pages/Keluhan/Daftar/DKeluhan_BerdasarMedia.vue +++ b/src/components/Pages/Keluhan/Daftar/DKeluhan_BerdasarMedia.vue @@ -4,57 +4,182 @@
- + - - + + - + - - - - - - - + + + + + + + - + + + + + + + + + - - - - - - - + +
@@ -77,13 +202,22 @@

Alamat Pelapor:

- +

Keterangan Pelapor:

- +
@@ -108,12 +242,28 @@

Response Time:

- +

Recovery Time:

- +
@@ -128,7 +278,12 @@

Keterangan Media:

- +
@@ -139,6 +294,7 @@ import DetailDialog from '@/components/Dialogs/DetailDialog.vue' import InputText from '@/components/InputText.vue' import Filters from '@/components/Form/Filters.vue' import Type3 from '@/components/Form/FiltersType/Type3.vue' +import { formatWaktu } from '@/components/Form/FiltersType/reference' import { ref } from 'vue' import { DxDataGrid } from 'devextreme-vue' import { diff --git a/src/components/Pages/Keluhan/Daftar/DKeluhan_RecoveryTime.vue b/src/components/Pages/Keluhan/Daftar/DKeluhan_RecoveryTime.vue index 96d73b1..955b3bd 100755 --- a/src/components/Pages/Keluhan/Daftar/DKeluhan_RecoveryTime.vue +++ b/src/components/Pages/Keluhan/Daftar/DKeluhan_RecoveryTime.vue @@ -93,7 +93,7 @@ data-field="durasi_response_time" caption="Durasi Response Time" css-class="custom-table-column" - cell-template="data" + cell-template="data-waktu" /> + + +
@@ -191,12 +198,28 @@

Response Time:

- +

Recovery Time:

- +
@@ -257,6 +280,7 @@ import DetailDialog from '@/components/Dialogs/DetailDialog.vue' import InputText from '@/components/InputText.vue' import Filters from '@/components/Form/Filters.vue' import Type11 from '@/components/Form/FiltersType/Type11.vue' +import { formatWaktu } from '@/components/Form/FiltersType/reference' import { ref } from 'vue' import { DxDataGrid } from 'devextreme-vue' import { diff --git a/src/components/Pages/Keluhan/Daftar/DKeluhan_ResponseTime.vue b/src/components/Pages/Keluhan/Daftar/DKeluhan_ResponseTime.vue index c4f6de1..276f660 100755 --- a/src/components/Pages/Keluhan/Daftar/DKeluhan_ResponseTime.vue +++ b/src/components/Pages/Keluhan/Daftar/DKeluhan_ResponseTime.vue @@ -93,7 +93,7 @@ data-field="durasi_response_time" caption="Durasi Response Time" css-class="custom-table-column" - cell-template="data" + cell-template="data-waktu" /> + + +
+
@@ -190,12 +198,28 @@

Response Time:

- +

Recovery Time:

- +
@@ -256,6 +280,7 @@ import DetailDialog from '@/components/Dialogs/DetailDialog.vue' import InputText from '@/components/InputText.vue' import Filters from '@/components/Form/Filters.vue' import Type11 from '@/components/Form/FiltersType/Type11.vue' +import { formatWaktu } from '@/components/Form/FiltersType/reference' import { ref } from 'vue' import { DxDataGrid } from 'devextreme-vue' import { diff --git a/src/components/Pages/Keluhan/Daftar/DKeluhan_STIDP.vue b/src/components/Pages/Keluhan/Daftar/DKeluhan_STIDP.vue index d87208f..3186b9f 100755 --- a/src/components/Pages/Keluhan/Daftar/DKeluhan_STIDP.vue +++ b/src/components/Pages/Keluhan/Daftar/DKeluhan_STIDP.vue @@ -4,55 +4,180 @@
- + - - + + - + - - - - - - - - - - - - - - - + + + + + + + + + + + + + + + + + +
@@ -80,12 +205,28 @@

Response Time:

- +

Recovery Time:

- +
@@ -105,7 +246,12 @@

Alamat Pelapor:

- +
@@ -115,8 +261,12 @@

Keterangan Pelapor:

- +
@@ -137,6 +287,7 @@ import DetailDialog from '@/components/Dialogs/DetailDialog.vue' import InputText from '@/components/InputText.vue' import Filters from '@/components/Form/Filters.vue' import Type3 from '@/components/Form/FiltersType/Type3.vue' +import { formatWaktu } from '@/components/Form/FiltersType/reference' import { ref } from 'vue' import { DxDataGrid } from 'devextreme-vue' import { diff --git a/src/components/Pages/Keluhan/Daftar/DKeluhan_SelesaiCC.vue b/src/components/Pages/Keluhan/Daftar/DKeluhan_SelesaiCC.vue index ea00b83..8c2e0b3 100755 --- a/src/components/Pages/Keluhan/Daftar/DKeluhan_SelesaiCC.vue +++ b/src/components/Pages/Keluhan/Daftar/DKeluhan_SelesaiCC.vue @@ -4,55 +4,170 @@
- + - - + + - + - - - - - - - + + + + + + + - + - - - - - - - - - + + + + + + + + +
From ab2844ec634685f076b8cc1b3349022c8f25517d Mon Sep 17 00:00:00 2001 From: kur0nek-o Date: Thu, 29 Feb 2024 18:15:13 +0700 Subject: [PATCH 3/6] Refactor data grid components --- src/components/Form/FiltersType/Type13.vue | 99 ++++--- src/components/Pages/Cico/LaporanCICO.vue | 1 + .../Pages/Keluhan/Rekap/RKeluhan_ALL.vue | 235 +++++++++++++---- .../Keluhan/Rekap/RKeluhan_BerdasarMedia.vue | 67 ++++- .../Rekap/RKeluhan_PerFungsiBidang.vue | 238 +++++++++++++---- .../Rekap/RKeluhan_PerJenisKeluhan.vue | 242 +++++++++++++---- .../Rekap/RKeluhan_PerKelompokKeluhan.vue | 246 +++++++++++++---- .../Keluhan/Rekap/RKeluhan_PerTanggal.vue | 249 ++++++++++++++---- .../Pages/Keluhan/Rekap/RKeluhan_PerUnit.vue | 248 +++++++++++++---- 9 files changed, 1293 insertions(+), 332 deletions(-) diff --git a/src/components/Form/FiltersType/Type13.vue b/src/components/Form/FiltersType/Type13.vue index 5fbe1cc..1ac7217 100755 --- a/src/components/Form/FiltersType/Type13.vue +++ b/src/components/Form/FiltersType/Type13.vue @@ -2,14 +2,22 @@ import Select from '@/components/Select.vue' import DatePicker from '@/components/DatePicker.vue' import InlineRadioGroup from '@/components/Form/InlineRadioGroup.vue' -import { selectedUid, selectedUp3Ulp, selectedUlp, fetchUid, itemsUid, itemsUp3, itemsUlp } from './reference'; -import { onMounted, ref } from 'vue'; -const uidPlaceholder = 'Semua Unit Induk Distribusi/Wilayah'; -const up3Placeholder = 'Semua Unit Pelaksanaan Pelayanan Pelanggan'; -const ulpPlaceholder = 'Semua Unit Layanan Pelanggan'; -const up3 = ref({ id: 0, name: up3Placeholder }); -const uid = ref({ id: 0, name: uidPlaceholder }); -const ulp = ref({ id: 0, name: ulpPlaceholder }); +import { + selectedUid, + selectedUp3Ulp, + selectedUlp, + fetchUid, + itemsUid, + itemsUp3, + itemsUlp +} from './reference' +import { onMounted, ref } from 'vue' +const uidPlaceholder = 'Semua Unit Induk Distribusi/Wilayah' +const up3Placeholder = 'Semua Unit Pelaksanaan Pelayanan Pelanggan' +const ulpPlaceholder = 'Semua Unit Layanan Pelanggan' +const up3 = ref({ id: 0, name: up3Placeholder }) +const uid = ref({ id: 0, name: uidPlaceholder }) +const ulp = ref({ id: 0, name: ulpPlaceholder }) const emit = defineEmits(['update:filters']) const data = ref({ uid: uid.value, @@ -19,27 +27,26 @@ const data = ref({ group: 1 }) const setUid = (value: any) => { - uid.value = value; - selectedUid(value); - up3.value = { id: 0, name: up3Placeholder }; - data.value.uid = value; -}; + uid.value = value + selectedUid(value) + up3.value = { id: 0, name: up3Placeholder } + data.value.uid = value +} const setUp3 = (value: any) => { - up3.value = value; - selectedUp3Ulp(value); - ulp.value = { id: 0, name: ulpPlaceholder }; - data.value.up3 = value; -}; + up3.value = value + selectedUp3Ulp(value) + ulp.value = { id: 0, name: ulpPlaceholder } + data.value.up3 = value +} const setUlp = (value: any) => { - ulp.value = value; - selectedUlp(value); - data.value.ulp = value; + ulp.value = value + selectedUlp(value) + data.value.ulp = value - console.log('data.value', data.value); - -}; + console.log('data.value', data.value) +} onMounted(() => { emit('update:filters', data.value) fetchUid() @@ -48,33 +55,57 @@ onMounted(() => { diff --git a/src/components/Pages/Cico/LaporanCICO.vue b/src/components/Pages/Cico/LaporanCICO.vue index 7e7b99d..9909ad6 100755 --- a/src/components/Pages/Cico/LaporanCICO.vue +++ b/src/components/Pages/Cico/LaporanCICO.vue @@ -2,6 +2,7 @@ +
- - + +
- + - + - + - + - - - - - - - - - - + + + + + + + + + + - - - - - + + + + + @@ -236,7 +494,10 @@ import { DxPaging, DxScrolling, DxSearchPanel, - DxSelection + DxSelection, + DxSummary, + DxTotalItem, + DxGroupItem } from 'devextreme-vue/data-grid' import { jsPDF } from 'jspdf' import { exportDataGrid as exportToPdf } from 'devextreme/pdf_exporter' @@ -320,6 +581,7 @@ const GET_DATA = gql` } } ` + const { onResult, onError, loading, refetch } = useQuery(GET_DATA, { dateFrom: new Date('2023-10-01').toISOString().slice(0, 10), dateTo: new Date('2023-10-01').toISOString().slice(0, 10), diff --git a/src/components/Pages/Keluhan/Rekap/RKeluhan_PerKelompokKeluhan.vue b/src/components/Pages/Keluhan/Rekap/RKeluhan_PerKelompokKeluhan.vue index 413591c..88d8518 100755 --- a/src/components/Pages/Keluhan/Rekap/RKeluhan_PerKelompokKeluhan.vue +++ b/src/components/Pages/Keluhan/Rekap/RKeluhan_PerKelompokKeluhan.vue @@ -46,18 +46,30 @@ + @@ -102,6 +115,7 @@ data-type="number" caption="%" css-class="custom-table-column" + cell-template="percent" /> @@ -218,11 +232,130 @@ + + + + + + + + + + + + + + + + + + + + + + +
@@ -241,7 +374,9 @@ import { DxPaging, DxScrolling, DxSearchPanel, - DxSelection + DxSelection, + DxSummary, + DxTotalItem } from 'devextreme-vue/data-grid' import { jsPDF } from 'jspdf' import { exportDataGrid as exportToPdf } from 'devextreme/pdf_exporter' @@ -325,6 +460,44 @@ const GET_DATA = gql` } } ` +// const GET_DATA = gql` +// query rekapitulasiKeluhanPerKelompokKeluhan( +// $dateFrom: Date! +// $dateTo: Date! +// $idUlp: Int! +// $idUid: Int! +// $idUp3: Int! +// ) { +// rekapitulasiKeluhanPerKelompokKeluhan( +// dateFrom: $dateFrom +// dateTo: $dateTo +// idUlp: $idUlp +// idUid: $idUid +// idUp3: $idUp3 +// ) { +// kelompok +// id_uid +// nama_uid +// total +// total_selesai +// persen_selesai +// total_inproses +// persen_inproses +// avg_durasi_response +// min_durasi_response +// max_durasi_response +// total_durasi_recovery +// total_durasi_response +// total_dibawah_sla_response +// total_diatas_sla_response +// avg_durasi_recovery +// min_durasi_recovery +// max_durasi_recovery +// total_dibawah_sla_recovery +// total_diatas_sla_recovery +// } +// } +// ` const { onResult, onError, loading, refetch } = useQuery(GET_DATA, { dateFrom: new Date('2023-10-01').toISOString().slice(0, 10), dateTo: new Date('2023-10-01').toISOString().slice(0, 10), @@ -332,7 +505,7 @@ const { onResult, onError, loading, refetch } = useQuery(GET_DATA, { idUid: 0, idUp3: 0 }) -const filters = ref() +const filters = ref({ groupBy: false }) const filterData = (params: any) => { const dateValue = params.periode.split(' s/d ')