From 3e25f48e831df8f100600ebb89f658a982f77eaf Mon Sep 17 00:00:00 2001 From: kur0nek-o Date: Sat, 16 Mar 2024 15:16:44 +0700 Subject: [PATCH 01/12] fix: pdf style in daftar gangguan response time --- .../Daftar/DGangguan_ResponseTime.vue | 155 +++++++++++++++++- .../Keluhan/Daftar/DKeluhan_RecoveryTime.vue | 2 +- .../Keluhan/Daftar/DKeluhan_ResponseTime.vue | 2 +- 3 files changed, 153 insertions(+), 6 deletions(-) diff --git a/src/components/Pages/Gangguan/Daftar/DGangguan_ResponseTime.vue b/src/components/Pages/Gangguan/Daftar/DGangguan_ResponseTime.vue index f7d57c4..47c3f1f 100755 --- a/src/components/Pages/Gangguan/Daftar/DGangguan_ResponseTime.vue +++ b/src/components/Pages/Gangguan/Daftar/DGangguan_ResponseTime.vue @@ -348,6 +348,7 @@ const closeDetail = () => (showDetail.value = false) const filterData = (params: any) => { const { minTime, maxTime, posko, uid, up3 } = params const dateValue = params.periode.split(' s/d ') + refetch({ dateFrom: dateValue[0] ? dateValue[0].split('-').reverse().join('-') @@ -361,13 +362,17 @@ const filterData = (params: any) => { idUid: uid ? uid.id : 0, idUp3: up3 ? up3.id : 0 }) + onResult((queryResult) => { if (queryResult.data != undefined) { data.value = queryResult.data.daftarGangguanResponseTime } + + reportMeta.value = filters.value console.log(queryResult.loading) console.log(queryResult.networkStatus) }) + onError((error) => { console.log(error) }) @@ -384,6 +389,38 @@ const { onResult, onError, loading, refetch } = useQuery(queries.gangguan.daftar }) const onExporting = (e: any) => { + const periode = reportMeta.value.periode ? reportMeta.value.periode.split(' s/d ') : '' + const minTime = reportMeta.value.minTime ? reportMeta.value.minTime : '' + const maxTime = reportMeta.value.maxTime ? reportMeta.value.maxTime : '' + + let dateFromFormat = '' + let dateToFormat = '' + let dayTo = '' + let durasi = '' + + if (minTime == '46' && maxTime != '143998560') { + durasi = 'Melebihi SLA (>45 Menit)' + } else if (minTime == '1' && maxTime == '45') { + durasi = 'Dibawah / Sesuai SLA (<=45 Menit)' + } else { + durasi = 'Durasi Menit' + } + + if (periode != '') { + const dateFrom = new Date(periode[0].split('-').reverse().join('-')) + const dateTo = new Date(periode[1].split('-').reverse().join('-')) + + dateFromFormat = `${dateFrom.getDate()}-${dateFrom.toLocaleString('default', { + month: 'long' + })}-${dateFrom.getFullYear()}` + + dateToFormat = `${dateTo.getDate()}-${dateTo.toLocaleString('default', { + month: 'long' + })}-${dateTo.getFullYear()}` + + dayTo = dateTo.toLocaleString('default', { weekday: 'long' }) + } + if (e.format === 'pdf') { const doc = new jsPDF({ orientation: 'landscape' @@ -391,7 +428,60 @@ const onExporting = (e: any) => { autoTable(doc, { head: [ + ['PT. PLN(Persero)', '', ''], [ + { content: 'UNIT INDUK', styles: { cellWidth: 25 } }, + { content: ':', styles: { cellWidth: 1 } }, + reportMeta.value.uid + ? reportMeta.value.uid.name.toUpperCase() + : 'Semua Unit Induk Distribusi/Wilayah'.toUpperCase() + ], + [ + 'UNIT PELAKSANA PELAYANAN PELANGGAN', + ':', + reportMeta.value.up3 + ? reportMeta.value.up3.name.toUpperCase() + : 'Semua Unit Pelaksanaan Pelayanan Pelanggan'.toUpperCase() + ], + [ + 'POSKO', + ':', + reportMeta.value.posko + ? reportMeta.value.posko.name.toUpperCase() + : 'Semua Posko'.toUpperCase() + ], + ['Durasi', ':', `${durasi} ${durasi == 'Durasi Menit' ? minTime + ' - ' + maxTime : ''}`] + ], + styles: { + fontSize: 3, + cellPadding: 0.1, + textColor: [0, 0, 0], + fontStyle: 'bold' + }, + theme: 'plain', + startY: 10 + }) + + autoTable(doc, { + head: [ + ['Daftar Gangguan Response Time'.toUpperCase()], + [`PERIODE TANGGAL : ${dateFromFormat} SD TGL ${dateToFormat}`] + ], + styles: { + fontSize: 3, + cellPadding: 0.1, + textColor: [0, 0, 0], + fontStyle: 'bold', + halign: 'center' + }, + theme: 'plain', + startY: 18 + }) + + autoTable(doc, { + head: [ + [ + 'No', 'No Laporan', 'Tgl Lapor', 'Tgl Response', @@ -408,7 +498,8 @@ const onExporting = (e: any) => { 'Posko' ] ], - body: data.value.map((item) => [ + body: data.value.map((item, i) => [ + { content: ++i, styles: { halign: 'right' } }, item.no_laporan, item.waktu_lapor, item.waktu_response, @@ -425,11 +516,58 @@ const onExporting = (e: any) => { item.nama_posko ]), styles: { - fontSize: 4 - } + fontSize: 3, + cellPadding: 1, + lineColor: [0, 0, 0], + lineWidth: 0.1, + cellWidth: 'auto' + }, + rowPageBreak: 'auto', + headStyles: { + fillColor: [192, 192, 192], + textColor: [0, 0, 0], + fontStyle: 'bold', + cellWidth: 'wrap', + halign: 'center' + }, + bodyStyles: { + textColor: [0, 0, 0] + }, + didParseCell: function (data) { + if (data.row.section === 'head') { + data.cell.text = data.cell.text.map(function (word: any) { + return word.toUpperCase() + }) + } + }, + startY: 23 }) - doc.save('Daftar Gangguan Response Time.pdf') + autoTable(doc, { + head: [ + [`${dayTo}, ${dateToFormat}`], + [ + { + content: '(.........................................)', + styles: { minCellHeight: 8, valign: 'bottom' } + } + ] + ], + styles: { + fontSize: 3, + cellPadding: 0.1, + textColor: [0, 0, 0], + fontStyle: 'bold', + halign: 'center' + }, + theme: 'plain', + tableWidth: 50, + margin: { left: 230 } + }) + + doc.save('Laporan Daftar Gangguan Response Time.pdf', { returnPromise: true }).then(() => { + console.log('pdf berhasil disimpan') + }) } else { const workbook = new Workbook() const worksheet = workbook.addWorksheet('Daftar Gangguan Response Time') @@ -452,6 +590,15 @@ const onExporting = (e: any) => { } const filters = ref() +const reportMeta = ref({ + uid: { id: 0, name: 'Semua Unit Induk Distribusi/Wilayah' }, + up3: { id: 0, name: 'Semua Unit Pelaksanaan Pelayanan Pelanggan' }, + posko: { id: 0, name: 'Semua Posko' }, + periode: '', + minTime: '', + maxTime: '' +}) + onMounted(() => { if (import.meta.env.DEV) { data.value = dummyData.gangguan.daftar.gangguanResponseTime diff --git a/src/components/Pages/Keluhan/Daftar/DKeluhan_RecoveryTime.vue b/src/components/Pages/Keluhan/Daftar/DKeluhan_RecoveryTime.vue index 2e7bf1f..633f14c 100755 --- a/src/components/Pages/Keluhan/Daftar/DKeluhan_RecoveryTime.vue +++ b/src/components/Pages/Keluhan/Daftar/DKeluhan_RecoveryTime.vue @@ -12,7 +12,7 @@ { id: 2, name: 'Melebihi SLA (> 3 hari)', - min: '46', + min: '4321', max: `${99999 * 60 * 24}` } ]" diff --git a/src/components/Pages/Keluhan/Daftar/DKeluhan_ResponseTime.vue b/src/components/Pages/Keluhan/Daftar/DKeluhan_ResponseTime.vue index 84ae8eb..4d79dd0 100755 --- a/src/components/Pages/Keluhan/Daftar/DKeluhan_ResponseTime.vue +++ b/src/components/Pages/Keluhan/Daftar/DKeluhan_ResponseTime.vue @@ -12,7 +12,7 @@ { id: 2, name: 'Melebihi SLA (> 1 hari)', - min: '46', + min: '1441', max: `${99999 * 60 * 24}` } ]" From 1ef7fad78fef6eebc683610fdb6ee968495e0e63 Mon Sep 17 00:00:00 2001 From: kur0nek-o Date: Sat, 16 Mar 2024 15:25:45 +0700 Subject: [PATCH 02/12] fix: pdf style in daftar gangguan recovery time --- .../Daftar/DGangguan_RecoveryTime.vue | 157 +++++++++++++++++- 1 file changed, 151 insertions(+), 6 deletions(-) diff --git a/src/components/Pages/Gangguan/Daftar/DGangguan_RecoveryTime.vue b/src/components/Pages/Gangguan/Daftar/DGangguan_RecoveryTime.vue index 128af10..3f77a88 100755 --- a/src/components/Pages/Gangguan/Daftar/DGangguan_RecoveryTime.vue +++ b/src/components/Pages/Gangguan/Daftar/DGangguan_RecoveryTime.vue @@ -370,9 +370,8 @@ const closeDetail = () => (showDetail.value = false) const filterData = (params: any) => { const { minTime, maxTime, posko, uid, up3 } = params - console.table(params) - const dateValue = params.periode.split(' s/d ') + refetch({ dateFrom: dateValue[0] ? dateValue[0].split('-').reverse().join('-') @@ -386,19 +385,55 @@ const filterData = (params: any) => { idUid: uid ? uid.id : 0, idUp3: up3 ? up3.id : 0 }) + onResult((queryResult) => { if (queryResult.data != undefined) { data.value = queryResult.data.daftarGangguanRecoveryTime } + + reportMeta.value = filters.value console.log(queryResult.loading) console.log(queryResult.networkStatus) }) + onError((error) => { console.log(error) }) } const onExporting = (e: any) => { + const periode = reportMeta.value.periode ? reportMeta.value.periode.split(' s/d ') : '' + const minTime = reportMeta.value.minTime ? reportMeta.value.minTime : '' + const maxTime = reportMeta.value.maxTime ? reportMeta.value.maxTime : '' + + let dateFromFormat = '' + let dateToFormat = '' + let dayTo = '' + let durasi = '' + + if (minTime == '46' && maxTime != '143998560') { + durasi = 'Melebihi SLA (>45 Menit)' + } else if (minTime == '1' && maxTime == '45') { + durasi = 'Dibawah / Sesuai SLA (<=45 Menit)' + } else { + durasi = 'Durasi Menit' + } + + if (periode != '') { + const dateFrom = new Date(periode[0].split('-').reverse().join('-')) + const dateTo = new Date(periode[1].split('-').reverse().join('-')) + + dateFromFormat = `${dateFrom.getDate()}-${dateFrom.toLocaleString('default', { + month: 'long' + })}-${dateFrom.getFullYear()}` + + dateToFormat = `${dateTo.getDate()}-${dateTo.toLocaleString('default', { + month: 'long' + })}-${dateTo.getFullYear()}` + + dayTo = dateTo.toLocaleString('default', { weekday: 'long' }) + } + if (e.format === 'pdf') { const doc = new jsPDF({ orientation: 'landscape' @@ -406,7 +441,60 @@ const onExporting = (e: any) => { autoTable(doc, { head: [ + ['PT. PLN(Persero)', '', ''], [ + { content: 'UNIT INDUK', styles: { cellWidth: 25 } }, + { content: ':', styles: { cellWidth: 1 } }, + reportMeta.value.uid + ? reportMeta.value.uid.name.toUpperCase() + : 'Semua Unit Induk Distribusi/Wilayah'.toUpperCase() + ], + [ + 'UNIT PELAKSANA PELAYANAN PELANGGAN', + ':', + reportMeta.value.up3 + ? reportMeta.value.up3.name.toUpperCase() + : 'Semua Unit Pelaksanaan Pelayanan Pelanggan'.toUpperCase() + ], + [ + 'POSKO', + ':', + reportMeta.value.posko + ? reportMeta.value.posko.name.toUpperCase() + : 'Semua Posko'.toUpperCase() + ], + ['Durasi', ':', `${durasi} ${durasi == 'Durasi Menit' ? minTime + ' - ' + maxTime : ''}`] + ], + styles: { + fontSize: 3, + cellPadding: 0.1, + textColor: [0, 0, 0], + fontStyle: 'bold' + }, + theme: 'plain', + startY: 10 + }) + + autoTable(doc, { + head: [ + ['Daftar Gangguan Recovery Time'.toUpperCase()], + [`PERIODE TANGGAL : ${dateFromFormat} SD TGL ${dateToFormat}`] + ], + styles: { + fontSize: 3, + cellPadding: 0.1, + textColor: [0, 0, 0], + fontStyle: 'bold', + halign: 'center' + }, + theme: 'plain', + startY: 18 + }) + + autoTable(doc, { + head: [ + [ + 'No', 'No Laporan', 'Tgl Lapor', 'Tgl Response', @@ -423,7 +511,8 @@ const onExporting = (e: any) => { 'Posko' ] ], - body: data.value.map((item) => [ + body: data.value.map((item, i) => [ + { content: ++i, styles: { halign: 'right' } }, item.no_laporan, item.waktu_lapor, item.waktu_response, @@ -440,11 +529,58 @@ const onExporting = (e: any) => { item.nama_posko ]), styles: { - fontSize: 4 - } + fontSize: 3, + cellPadding: 1, + lineColor: [0, 0, 0], + lineWidth: 0.1, + cellWidth: 'auto' + }, + rowPageBreak: 'auto', + headStyles: { + fillColor: [192, 192, 192], + textColor: [0, 0, 0], + fontStyle: 'bold', + cellWidth: 'wrap', + halign: 'center' + }, + bodyStyles: { + textColor: [0, 0, 0] + }, + didParseCell: function (data) { + if (data.row.section === 'head') { + data.cell.text = data.cell.text.map(function (word: any) { + return word.toUpperCase() + }) + } + }, + startY: 23 }) - doc.save('Daftar Gangguan Recovery Time.pdf') + autoTable(doc, { + head: [ + [`${dayTo}, ${dateToFormat}`], + [ + { + content: '(.........................................)', + styles: { minCellHeight: 8, valign: 'bottom' } + } + ] + ], + styles: { + fontSize: 3, + cellPadding: 0.1, + textColor: [0, 0, 0], + fontStyle: 'bold', + halign: 'center' + }, + theme: 'plain', + tableWidth: 50, + margin: { left: 230 } + }) + + doc.save('Laporan Daftar Gangguan Recovery Time.pdf', { returnPromise: true }).then(() => { + console.log('pdf berhasil disimpan') + }) } else { const workbook = new Workbook() const worksheet = workbook.addWorksheet('Daftar Gangguan Recovery Time') @@ -477,6 +613,15 @@ const { onResult, onError, loading, refetch } = useQuery(queries.gangguan.daftar }) const filters = ref() +const reportMeta = ref({ + uid: { id: 0, name: 'Semua Unit Induk Distribusi/Wilayah' }, + up3: { id: 0, name: 'Semua Unit Pelaksanaan Pelayanan Pelanggan' }, + posko: { id: 0, name: 'Semua Posko' }, + periode: '', + minTime: '', + maxTime: '' +}) + onMounted(() => { if (import.meta.env.DEV) { data.value = dummyData.gangguan.daftar.gangguanRecoveryTime From 392a9fab81654df0617c874efeec3f48940f6ec3 Mon Sep 17 00:00:00 2001 From: kur0nek-o Date: Sat, 16 Mar 2024 15:41:05 +0700 Subject: [PATCH 03/12] fix: pdf style daftar gangguan selesai tanpa id pelanggan --- .../Pages/Gangguan/Daftar/DGangguan_STIDP.vue | 138 +++++++++++++++++- 1 file changed, 134 insertions(+), 4 deletions(-) diff --git a/src/components/Pages/Gangguan/Daftar/DGangguan_STIDP.vue b/src/components/Pages/Gangguan/Daftar/DGangguan_STIDP.vue index abe8386..3ac4d6f 100755 --- a/src/components/Pages/Gangguan/Daftar/DGangguan_STIDP.vue +++ b/src/components/Pages/Gangguan/Daftar/DGangguan_STIDP.vue @@ -255,6 +255,27 @@ const filterData = (params: any) => { } const onExporting = (e: any) => { + const periode = reportMeta.value.periode ? reportMeta.value.periode.split(' s/d ') : '' + + let dateFromFormat = '' + let dateToFormat = '' + let dayTo = '' + + if (periode != '') { + const dateFrom = new Date(periode[0].split('-').reverse().join('-')) + const dateTo = new Date(periode[1].split('-').reverse().join('-')) + + dateFromFormat = `${dateFrom.getDate()}-${dateFrom.toLocaleString('default', { + month: 'long' + })}-${dateFrom.getFullYear()}` + + dateToFormat = `${dateTo.getDate()}-${dateTo.toLocaleString('default', { + month: 'long' + })}-${dateTo.getFullYear()}` + + dayTo = dateTo.toLocaleString('default', { weekday: 'long' }) + } + if (e.format === 'pdf') { const doc = new jsPDF({ orientation: 'landscape' @@ -262,7 +283,59 @@ const onExporting = (e: any) => { autoTable(doc, { head: [ + ['PT. PLN(Persero)', '', ''], [ + { content: 'UNIT INDUK', styles: { cellWidth: 25 } }, + { content: ':', styles: { cellWidth: 1 } }, + reportMeta.value.uid + ? reportMeta.value.uid.name.toUpperCase() + : 'Semua Unit Induk Distribusi/Wilayah'.toUpperCase() + ], + [ + 'UNIT PELAKSANA PELAYANAN PELANGGAN', + ':', + reportMeta.value.up3 + ? reportMeta.value.up3.name.toUpperCase() + : 'Semua Unit Pelaksanaan Pelayanan Pelanggan'.toUpperCase() + ], + [ + 'POSKO', + ':', + reportMeta.value.posko + ? reportMeta.value.posko.name.toUpperCase() + : 'Semua Posko'.toUpperCase() + ] + ], + styles: { + fontSize: 3, + cellPadding: 0.1, + textColor: [0, 0, 0], + fontStyle: 'bold' + }, + theme: 'plain', + startY: 10 + }) + + autoTable(doc, { + head: [ + ['Daftar Gangguan Selesai Tanpa ID Pelanggan'.toUpperCase()], + [`PERIODE TANGGAL : ${dateFromFormat} SD TGL ${dateToFormat}`] + ], + styles: { + fontSize: 3, + cellPadding: 0.1, + textColor: [0, 0, 0], + fontStyle: 'bold', + halign: 'center' + }, + theme: 'plain', + startY: 18 + }) + + autoTable(doc, { + head: [ + [ + 'No', 'No Laporan', 'Tgl Lapor', 'Tgl Response', @@ -279,7 +352,8 @@ const onExporting = (e: any) => { 'Posko' ] ], - body: data.value.map((item) => [ + body: data.value.map((item, i) => [ + { content: ++i, styles: { halign: 'right' } }, item.no_laporan, item.waktu_lapor, item.waktu_response, @@ -296,11 +370,60 @@ const onExporting = (e: any) => { item.nama_posko ]), styles: { - fontSize: 4 - } + fontSize: 3, + cellPadding: 1, + lineColor: [0, 0, 0], + lineWidth: 0.1, + cellWidth: 'auto' + }, + rowPageBreak: 'auto', + headStyles: { + fillColor: [192, 192, 192], + textColor: [0, 0, 0], + fontStyle: 'bold', + cellWidth: 'wrap', + halign: 'center' + }, + bodyStyles: { + textColor: [0, 0, 0] + }, + didParseCell: function (data) { + if (data.row.section === 'head') { + data.cell.text = data.cell.text.map(function (word: any) { + return word.toUpperCase() + }) + } + }, + startY: 23 }) - doc.save('Daftar Gangguan Selesai Tanpa ID Pelanggan.pdf') + autoTable(doc, { + head: [ + [`${dayTo}, ${dateToFormat}`], + [ + { + content: '(.........................................)', + styles: { minCellHeight: 8, valign: 'bottom' } + } + ] + ], + styles: { + fontSize: 3, + cellPadding: 0.1, + textColor: [0, 0, 0], + fontStyle: 'bold', + halign: 'center' + }, + theme: 'plain', + tableWidth: 50, + margin: { left: 230 } + }) + + doc + .save('Laporan Daftar Gangguan Selesai Tanpa ID Pelanggan.pdf', { returnPromise: true }) + .then(() => { + console.log('pdf berhasil disimpan') + }) } else { const workbook = new Workbook() const worksheet = workbook.addWorksheet('Daftar Gangguan Selesai Tanpa ID Pelanggan') @@ -323,6 +446,13 @@ const onExporting = (e: any) => { } const filters = ref() +const reportMeta = ref({ + uid: { id: 0, name: 'Semua Unit Induk Distribusi/Wilayah' }, + up3: { id: 0, name: 'Semua Unit Pelaksanaan Pelayanan Pelanggan' }, + posko: { id: 0, name: 'Semua Posko' }, + periode: '' +}) + onMounted(() => { if (import.meta.env.DEV) { data.value = dummyData.gangguan.daftar.daftarGangguanSelesaiTanpaIdPelanggan From 4906a997241f3164143ae68679fb758b2f345472 Mon Sep 17 00:00:00 2001 From: kur0nek-o Date: Sat, 16 Mar 2024 15:54:07 +0700 Subject: [PATCH 04/12] fix: pdf style daftar gangguan berdasarkan media --- .../Pages/Gangguan/Daftar/DGangguan_BM.vue | 149 +++++++++++++++++- .../Pages/Gangguan/Daftar/DGangguan_STIDP.vue | 5 + 2 files changed, 150 insertions(+), 4 deletions(-) diff --git a/src/components/Pages/Gangguan/Daftar/DGangguan_BM.vue b/src/components/Pages/Gangguan/Daftar/DGangguan_BM.vue index 90407ad..5b2c9ce 100755 --- a/src/components/Pages/Gangguan/Daftar/DGangguan_BM.vue +++ b/src/components/Pages/Gangguan/Daftar/DGangguan_BM.vue @@ -228,6 +228,7 @@ const { onResult, onError, loading, refetch } = useQuery(queries.gangguan.daftar const filterData = (params: any) => { const { posko, uid, up3, media } = params const dateValue = params.periode.split(' s/d ') + refetch({ dateFrom: dateValue[0] ? dateValue[0].split('-').reverse().join('-') @@ -240,20 +241,45 @@ const filterData = (params: any) => { idUp3: up3 ? up3.id : 0, media: media ? media.id : '' }) + onResult((queryResult) => { if (queryResult.data != undefined) { data.value = queryResult.data.daftarGangguanBerdasarkanMedia } + + reportMeta.value = filters.value console.log(queryResult.data) console.log(queryResult.loading) console.log(queryResult.networkStatus) }) + onError((error) => { console.log(error) }) } const onExporting = (e: any) => { + const periode = reportMeta.value.periode ? reportMeta.value.periode.split(' s/d ') : '' + + let dateFromFormat = '' + let dateToFormat = '' + let dayTo = '' + + if (periode != '') { + const dateFrom = new Date(periode[0].split('-').reverse().join('-')) + const dateTo = new Date(periode[1].split('-').reverse().join('-')) + + dateFromFormat = `${dateFrom.getDate()}-${dateFrom.toLocaleString('default', { + month: 'long' + })}-${dateFrom.getFullYear()}` + + dateToFormat = `${dateTo.getDate()}-${dateTo.toLocaleString('default', { + month: 'long' + })}-${dateTo.getFullYear()}` + + dayTo = dateTo.toLocaleString('default', { weekday: 'long' }) + } + if (e.format === 'pdf') { const doc = new jsPDF({ orientation: 'landscape' @@ -261,7 +287,66 @@ const onExporting = (e: any) => { autoTable(doc, { head: [ + ['PT. PLN(Persero)', '', ''], [ + { content: 'UNIT INDUK', styles: { cellWidth: 25 } }, + { content: ':', styles: { cellWidth: 1 } }, + reportMeta.value.uid + ? reportMeta.value.uid.name.toUpperCase() + : 'Semua Unit Induk Distribusi/Wilayah'.toUpperCase() + ], + [ + 'UNIT PELAKSANA PELAYANAN PELANGGAN', + ':', + reportMeta.value.up3 + ? reportMeta.value.up3.name.toUpperCase() + : 'Semua Unit Pelaksanaan Pelayanan Pelanggan'.toUpperCase() + ], + [ + 'POSKO', + ':', + reportMeta.value.posko + ? reportMeta.value.posko.name.toUpperCase() + : 'Semua Posko'.toUpperCase() + ], + [ + 'MEDIA', + ':', + reportMeta.value.media + ? reportMeta.value.media.name.toUpperCase() + : 'Semua Media'.toUpperCase() + ] + ], + styles: { + fontSize: 3, + cellPadding: 0.1, + textColor: [0, 0, 0], + fontStyle: 'bold' + }, + theme: 'plain', + startY: 10 + }) + + autoTable(doc, { + head: [ + ['Daftar Gangguan Berdasarkan Media'.toUpperCase()], + [`PERIODE TANGGAL : ${dateFromFormat} SD TGL ${dateToFormat}`] + ], + styles: { + fontSize: 3, + cellPadding: 0.1, + textColor: [0, 0, 0], + fontStyle: 'bold', + halign: 'center' + }, + theme: 'plain', + startY: 18 + }) + + autoTable(doc, { + head: [ + [ + 'No', 'No Laporan', 'Nama Pelapor', 'Alamat Pelapor', @@ -278,7 +363,8 @@ const onExporting = (e: any) => { 'Keterangan Media' ] ], - body: data.value.map((item) => [ + body: data.value.map((item, i) => [ + { content: ++i, styles: { halign: 'right' } }, item.no_laporan, item.nama_pelapor, item.alamat_pelapor, @@ -295,11 +381,58 @@ const onExporting = (e: any) => { item.keterangan_media ]), styles: { - fontSize: 4 - } + fontSize: 3, + cellPadding: 1, + lineColor: [0, 0, 0], + lineWidth: 0.1, + cellWidth: 'auto' + }, + rowPageBreak: 'auto', + headStyles: { + fillColor: [192, 192, 192], + textColor: [0, 0, 0], + fontStyle: 'bold', + cellWidth: 'wrap', + halign: 'center' + }, + bodyStyles: { + textColor: [0, 0, 0] + }, + didParseCell: function (data) { + if (data.row.section === 'head') { + data.cell.text = data.cell.text.map(function (word: any) { + return word.toUpperCase() + }) + } + }, + startY: 23 }) - doc.save('Daftar Gangguan Berdasarkan Media.pdf') + autoTable(doc, { + head: [ + [`${dayTo}, ${dateToFormat}`], + [ + { + content: '(.........................................)', + styles: { minCellHeight: 8, valign: 'bottom' } + } + ] + ], + styles: { + fontSize: 3, + cellPadding: 0.1, + textColor: [0, 0, 0], + fontStyle: 'bold', + halign: 'center' + }, + theme: 'plain', + tableWidth: 50, + margin: { left: 230 } + }) + + doc.save('Laporan Daftar Gangguan Berdasarkan Media.pdf', { returnPromise: true }).then(() => { + console.log('pdf berhasil disimpan') + }) } else { const workbook = new Workbook() const worksheet = workbook.addWorksheet('Daftar Gangguan Berdasarkan Media') @@ -322,6 +455,14 @@ const onExporting = (e: any) => { } const filters = ref() +const reportMeta = ref({ + uid: { id: 0, name: 'Semua Unit Induk Distribusi/Wilayah' }, + up3: { id: 0, name: 'Semua Unit Pelaksanaan Pelayanan Pelanggan' }, + posko: { id: 0, name: 'Semua Posko' }, + media: { id: '', name: 'Semua Media' }, + periode: '' +}) + onMounted(() => { if (import.meta.env.DEV) { data.value = dummyData.gangguan.daftar.daftarGangguanBerdasarkanMedia diff --git a/src/components/Pages/Gangguan/Daftar/DGangguan_STIDP.vue b/src/components/Pages/Gangguan/Daftar/DGangguan_STIDP.vue index 3ac4d6f..63e56da 100755 --- a/src/components/Pages/Gangguan/Daftar/DGangguan_STIDP.vue +++ b/src/components/Pages/Gangguan/Daftar/DGangguan_STIDP.vue @@ -230,6 +230,7 @@ const { onResult, onError, loading, refetch } = useQuery( const filterData = (params: any) => { const { posko, uid, up3 } = params const dateValue = params.periode.split(' s/d ') + refetch({ dateFrom: dateValue[0] ? dateValue[0].split('-').reverse().join('-') @@ -241,14 +242,18 @@ const filterData = (params: any) => { idUid: uid ? uid.id : 0, idUp3: up3 ? up3.id : 0 }) + onResult((queryResult) => { if (queryResult.data != undefined) { data.value = queryResult.data.daftarGangguanSelesaiTanpaIdPelanggan } + + reportMeta.value = filters.value console.log(queryResult.data) console.log(queryResult.loading) console.log(queryResult.networkStatus) }) + onError((error) => { console.log(error) }) From 56eba5fe0d7ae15994d041cd19682a81f311ed62 Mon Sep 17 00:00:00 2001 From: kur0nek-o Date: Sat, 16 Mar 2024 16:00:58 +0700 Subject: [PATCH 05/12] fix: pdf style daftar gangguan diselesaikan mobile apkt --- .../Gangguan/Daftar/DGangguan_DMAPKT.vue | 142 +++++++++++++++++- 1 file changed, 138 insertions(+), 4 deletions(-) diff --git a/src/components/Pages/Gangguan/Daftar/DGangguan_DMAPKT.vue b/src/components/Pages/Gangguan/Daftar/DGangguan_DMAPKT.vue index 9b43d01..4c1d658 100755 --- a/src/components/Pages/Gangguan/Daftar/DGangguan_DMAPKT.vue +++ b/src/components/Pages/Gangguan/Daftar/DGangguan_DMAPKT.vue @@ -242,20 +242,45 @@ const filterData = (params: any) => { idUid: uid ? uid.id : 0, idUp3: up3?.id ? up3.id : 0 }) + onResult((queryResult) => { if (queryResult.data != undefined) { data.value = queryResult.data.daftarGangguanDiselesaikanMobileAPKT } + + reportMeta.value = filters.value console.log(queryResult.data) console.log(queryResult.loading) console.log(queryResult.networkStatus) }) + onError((error) => { console.log(error) }) } const onExporting = (e: any) => { + const periode = reportMeta.value.periode ? reportMeta.value.periode.split(' s/d ') : '' + + let dateFromFormat = '' + let dateToFormat = '' + let dayTo = '' + + if (periode != '') { + const dateFrom = new Date(periode[0].split('-').reverse().join('-')) + const dateTo = new Date(periode[1].split('-').reverse().join('-')) + + dateFromFormat = `${dateFrom.getDate()}-${dateFrom.toLocaleString('default', { + month: 'long' + })}-${dateFrom.getFullYear()}` + + dateToFormat = `${dateTo.getDate()}-${dateTo.toLocaleString('default', { + month: 'long' + })}-${dateTo.getFullYear()}` + + dayTo = dateTo.toLocaleString('default', { weekday: 'long' }) + } + if (e.format === 'pdf') { const doc = new jsPDF({ orientation: 'landscape' @@ -263,7 +288,59 @@ const onExporting = (e: any) => { autoTable(doc, { head: [ + ['PT. PLN(Persero)', '', ''], [ + { content: 'UNIT INDUK', styles: { cellWidth: 25 } }, + { content: ':', styles: { cellWidth: 1 } }, + reportMeta.value.uid + ? reportMeta.value.uid.name.toUpperCase() + : 'Semua Unit Induk Distribusi/Wilayah'.toUpperCase() + ], + [ + 'UNIT PELAKSANA PELAYANAN PELANGGAN', + ':', + reportMeta.value.up3 + ? reportMeta.value.up3.name.toUpperCase() + : 'Semua Unit Pelaksanaan Pelayanan Pelanggan'.toUpperCase() + ], + [ + 'POSKO', + ':', + reportMeta.value.posko + ? reportMeta.value.posko.name.toUpperCase() + : 'Semua Posko'.toUpperCase() + ] + ], + styles: { + fontSize: 3, + cellPadding: 0.1, + textColor: [0, 0, 0], + fontStyle: 'bold' + }, + theme: 'plain', + startY: 10 + }) + + autoTable(doc, { + head: [ + ['Daftar Gangguan Diselesaikan Mobile APKT'.toUpperCase()], + [`PERIODE TANGGAL : ${dateFromFormat} SD TGL ${dateToFormat}`] + ], + styles: { + fontSize: 3, + cellPadding: 0.1, + textColor: [0, 0, 0], + fontStyle: 'bold', + halign: 'center' + }, + theme: 'plain', + startY: 18 + }) + + autoTable(doc, { + head: [ + [ + 'No', 'No Laporan', 'Tgl Lapor', 'Tgl Response', @@ -280,7 +357,8 @@ const onExporting = (e: any) => { 'Posko' ] ], - body: data.value.map((item) => [ + body: data.value.map((item, i) => [ + { content: ++i, styles: { halign: 'right' } }, item.no_laporan, item.waktu_lapor, item.waktu_response, @@ -297,11 +375,60 @@ const onExporting = (e: any) => { item.nama_posko ]), styles: { - fontSize: 4 - } + fontSize: 3, + cellPadding: 1, + lineColor: [0, 0, 0], + lineWidth: 0.1, + cellWidth: 'auto' + }, + rowPageBreak: 'auto', + headStyles: { + fillColor: [192, 192, 192], + textColor: [0, 0, 0], + fontStyle: 'bold', + cellWidth: 'wrap', + halign: 'center' + }, + bodyStyles: { + textColor: [0, 0, 0] + }, + didParseCell: function (data) { + if (data.row.section === 'head') { + data.cell.text = data.cell.text.map(function (word: any) { + return word.toUpperCase() + }) + } + }, + startY: 23 }) - doc.save('Daftar Gangguan Diselesaikan Mobile APKT.pdf') + autoTable(doc, { + head: [ + [`${dayTo}, ${dateToFormat}`], + [ + { + content: '(.........................................)', + styles: { minCellHeight: 8, valign: 'bottom' } + } + ] + ], + styles: { + fontSize: 3, + cellPadding: 0.1, + textColor: [0, 0, 0], + fontStyle: 'bold', + halign: 'center' + }, + theme: 'plain', + tableWidth: 50, + margin: { left: 230 } + }) + + doc + .save('Laporan Daftar Gangguan Diselesaikan Mobile APKT.pdf', { returnPromise: true }) + .then(() => { + console.log('pdf berhasil disimpan') + }) } else { const workbook = new Workbook() const worksheet = workbook.addWorksheet('Daftar Gangguan Diselesaikan Mobile APKT') @@ -324,6 +451,13 @@ const onExporting = (e: any) => { } const filters = ref() +const reportMeta = ref({ + uid: { id: 0, name: 'Semua Unit Induk Distribusi/Wilayah' }, + up3: { id: 0, name: 'Semua Unit Pelaksanaan Pelayanan Pelanggan' }, + posko: { id: 0, name: 'Semua Posko' }, + periode: '' +}) + onMounted(() => { if (import.meta.env.DEV) { data.value = dummyData.gangguan.daftar.daftarGangguanDiselesaikanMobileAPKT From 1873316da549fbc9944291be430a4016ae6f1bed Mon Sep 17 00:00:00 2001 From: kur0nek-o Date: Sat, 16 Mar 2024 16:13:10 +0700 Subject: [PATCH 06/12] fix: pdf style daftar keluhan dialihkan ke unit lain --- .../Pages/Keluhan/Daftar/DKeluhan_DKUL.vue | 140 +++++++++++++++++- 1 file changed, 136 insertions(+), 4 deletions(-) diff --git a/src/components/Pages/Keluhan/Daftar/DKeluhan_DKUL.vue b/src/components/Pages/Keluhan/Daftar/DKeluhan_DKUL.vue index 31d384f..c8efae9 100755 --- a/src/components/Pages/Keluhan/Daftar/DKeluhan_DKUL.vue +++ b/src/components/Pages/Keluhan/Daftar/DKeluhan_DKUL.vue @@ -236,6 +236,27 @@ const shading = ref(true) const showPane = ref(true) const onExporting = (e: any) => { + const periode = reportMeta.value.periode ? reportMeta.value.periode.split(' s/d ') : '' + + let dateFromFormat = '' + let dateToFormat = '' + let dayTo = '' + + if (periode != '') { + const dateFrom = new Date(periode[0].split('-').reverse().join('-')) + const dateTo = new Date(periode[1].split('-').reverse().join('-')) + + dateFromFormat = `${dateFrom.getDate()}-${dateFrom.toLocaleString('default', { + month: 'long' + })}-${dateFrom.getFullYear()}` + + dateToFormat = `${dateTo.getDate()}-${dateTo.toLocaleString('default', { + month: 'long' + })}-${dateTo.getFullYear()}` + + dayTo = dateTo.toLocaleString('default', { weekday: 'long' }) + } + if (e.format === 'pdf') { const doc = new jsPDF({ orientation: 'landscape' @@ -243,7 +264,59 @@ const onExporting = (e: any) => { autoTable(doc, { head: [ + ['PT. PLN(Persero)', '', ''], [ + { content: 'UNIT INDUK', styles: { cellWidth: 25 } }, + { content: ':', styles: { cellWidth: 1 } }, + reportMeta.value.uid + ? reportMeta.value.uid.name.toUpperCase() + : 'Semua Unit Induk Distribusi/Wilayah'.toUpperCase() + ], + [ + 'UNIT PELAKSANA PELAYANAN PELANGGAN', + ':', + reportMeta.value.up3 + ? reportMeta.value.up3.name.toUpperCase() + : 'Semua Unit Pelaksanaan Pelayanan Pelanggan'.toUpperCase() + ], + [ + 'POSKO', + ':', + reportMeta.value.posko + ? reportMeta.value.posko.name.toUpperCase() + : 'Semua Posko'.toUpperCase() + ] + ], + styles: { + fontSize: 3, + cellPadding: 0.1, + textColor: [0, 0, 0], + fontStyle: 'bold' + }, + theme: 'plain', + startY: 10 + }) + + autoTable(doc, { + head: [ + ['Daftar Keluhan Dialihkan Ke Unit Lain'.toUpperCase()], + [`PERIODE TANGGAL : ${dateFromFormat} SD TGL ${dateToFormat}`] + ], + styles: { + fontSize: 3, + cellPadding: 0.1, + textColor: [0, 0, 0], + fontStyle: 'bold', + halign: 'center' + }, + theme: 'plain', + startY: 18 + }) + + autoTable(doc, { + head: [ + [ + 'No', 'No Laporan', 'Pembuat Laporan', 'Tgl Lapor', @@ -261,7 +334,8 @@ const onExporting = (e: any) => { 'Keterangan Pelapor' ] ], - body: data.value.map((item: any) => [ + body: data.value.map((item: any, i: any) => [ + { content: ++i, styles: { halign: 'right' } }, item.no_laporan, item.pembuat_laporan, item.waktu_lapor, @@ -279,11 +353,60 @@ const onExporting = (e: any) => { item.keterangan_pelapor ]), styles: { - fontSize: 4 - } + fontSize: 3, + cellPadding: 1, + lineColor: [0, 0, 0], + lineWidth: 0.1, + cellWidth: 'auto' + }, + rowPageBreak: 'auto', + headStyles: { + fillColor: [192, 192, 192], + textColor: [0, 0, 0], + fontStyle: 'bold', + cellWidth: 'wrap', + halign: 'center' + }, + bodyStyles: { + textColor: [0, 0, 0] + }, + didParseCell: function (data) { + if (data.row.section === 'head') { + data.cell.text = data.cell.text.map(function (word: any) { + return word.toUpperCase() + }) + } + }, + startY: 23 }) - doc.save('Daftar Keluhan Dialihkan Ke Unit Lain.pdf') + autoTable(doc, { + head: [ + [`${dayTo}, ${dateToFormat}`], + [ + { + content: '(.........................................)', + styles: { minCellHeight: 8, valign: 'bottom' } + } + ] + ], + styles: { + fontSize: 3, + cellPadding: 0.1, + textColor: [0, 0, 0], + fontStyle: 'bold', + halign: 'center' + }, + theme: 'plain', + tableWidth: 50, + margin: { left: 230 } + }) + + doc + .save('Laporan Daftar Keluhan Dialihkan Ke Unit Lain.pdf', { returnPromise: true }) + .then(() => { + console.log('pdf berhasil disimpan') + }) } else { const workbook = new Workbook() const worksheet = workbook.addWorksheet('Daftar Keluhan Dialihkan Ke Unit Lain') @@ -342,6 +465,8 @@ const filterData = (params: any) => { if (queryResult.data != undefined) { data.value = queryResult.data.daftarKeluhanDialihkanKeUnitLain } + + reportMeta.value = filters.value console.log(queryResult.data) console.log(queryResult.loading) console.log(queryResult.networkStatus) @@ -353,6 +478,13 @@ const filterData = (params: any) => { } const filters = ref() +const reportMeta = ref({ + uid: { id: 0, name: 'Semua Unit Induk Distribusi/Wilayah' }, + up3: { id: 0, name: 'Semua Unit Pelaksanaan Pelayanan Pelanggan' }, + posko: { id: 0, name: 'Semua Posko' }, + periode: '' +}) + onMounted(() => { if (import.meta.env.DEV) { data.value = dummyData.keluhan.daftar.daftarKeluhanDialihkanKeUnitLain From e6c6bd8d75a09f33cea9fbb66a20ba6748a778e3 Mon Sep 17 00:00:00 2001 From: kur0nek-o Date: Sat, 16 Mar 2024 16:26:20 +0700 Subject: [PATCH 07/12] fix: pdf style in daftar keluhan pelanggan lebih dari 1 kali --- .../Pages/Keluhan/Daftar/DKeluhan_DKUL.vue | 10 +- .../Pages/Keluhan/Daftar/DKeluhan_PLD1K.vue | 146 +++++++++++++++++- 2 files changed, 147 insertions(+), 9 deletions(-) diff --git a/src/components/Pages/Keluhan/Daftar/DKeluhan_DKUL.vue b/src/components/Pages/Keluhan/Daftar/DKeluhan_DKUL.vue index c8efae9..d0f62dd 100755 --- a/src/components/Pages/Keluhan/Daftar/DKeluhan_DKUL.vue +++ b/src/components/Pages/Keluhan/Daftar/DKeluhan_DKUL.vue @@ -280,11 +280,11 @@ const onExporting = (e: any) => { : 'Semua Unit Pelaksanaan Pelayanan Pelanggan'.toUpperCase() ], [ - 'POSKO', + 'UNIT LAYANAN PELANGGAN', ':', - reportMeta.value.posko - ? reportMeta.value.posko.name.toUpperCase() - : 'Semua Posko'.toUpperCase() + reportMeta.value.ulp + ? reportMeta.value.ulp.name.toUpperCase() + : 'Semua Unit Layanan Pelanggan'.toUpperCase() ] ], styles: { @@ -481,7 +481,7 @@ const filters = ref() const reportMeta = ref({ uid: { id: 0, name: 'Semua Unit Induk Distribusi/Wilayah' }, up3: { id: 0, name: 'Semua Unit Pelaksanaan Pelayanan Pelanggan' }, - posko: { id: 0, name: 'Semua Posko' }, + ulp: { id: 0, name: 'Semua Unit Layanan Pelanggan' }, periode: '' }) diff --git a/src/components/Pages/Keluhan/Daftar/DKeluhan_PLD1K.vue b/src/components/Pages/Keluhan/Daftar/DKeluhan_PLD1K.vue index 55b8487..088a47c 100755 --- a/src/components/Pages/Keluhan/Daftar/DKeluhan_PLD1K.vue +++ b/src/components/Pages/Keluhan/Daftar/DKeluhan_PLD1K.vue @@ -362,6 +362,27 @@ const onSelectionChanged = ({ selectedRowsData }: any) => { } const onExporting = (e: any) => { + const periode = reportMeta.value.periode ? reportMeta.value.periode.split(' s/d ') : '' + + let dateFromFormat = '' + let dateToFormat = '' + let dayTo = '' + + if (periode != '') { + const dateFrom = new Date(periode[0].split('-').reverse().join('-')) + const dateTo = new Date(periode[1].split('-').reverse().join('-')) + + dateFromFormat = `${dateFrom.getDate()}-${dateFrom.toLocaleString('default', { + month: 'long' + })}-${dateFrom.getFullYear()}` + + dateToFormat = `${dateTo.getDate()}-${dateTo.toLocaleString('default', { + month: 'long' + })}-${dateTo.getFullYear()}` + + dayTo = dateTo.toLocaleString('default', { weekday: 'long' }) + } + if (e.format === 'pdf') { const doc = new jsPDF({ orientation: 'landscape' @@ -369,7 +390,60 @@ const onExporting = (e: any) => { autoTable(doc, { head: [ + ['PT. PLN(Persero)', '', ''], [ + { content: 'UNIT INDUK', styles: { cellWidth: 25 } }, + { content: ':', styles: { cellWidth: 1 } }, + reportMeta.value.uid + ? reportMeta.value.uid.name.toUpperCase() + : 'Semua Unit Induk Distribusi/Wilayah'.toUpperCase() + ], + [ + 'UNIT PELAKSANA PELAYANAN PELANGGAN', + ':', + reportMeta.value.up3 + ? reportMeta.value.up3.name.toUpperCase() + : 'Semua Unit Pelaksanaan Pelayanan Pelanggan'.toUpperCase() + ], + [ + 'UNIT LAYANAN PELANGGAN', + ':', + reportMeta.value.ulp + ? reportMeta.value.ulp.name.toUpperCase() + : 'Semua Unit Layanan Pelanggan'.toUpperCase() + ], + ['LAPOR ULANG', ':', `${reportMeta.value.minJmlLapor} s/d ${reportMeta.value.maxJmlLapor}`] + ], + styles: { + fontSize: 3, + cellPadding: 0.1, + textColor: [0, 0, 0], + fontStyle: 'bold' + }, + theme: 'plain', + startY: 10 + }) + + autoTable(doc, { + head: [ + ['Daftar Keluhan Pelanggan Lebih Dari 1 Kali'.toUpperCase()], + [`PERIODE TANGGAL : ${dateFromFormat} SD TGL ${dateToFormat}`] + ], + styles: { + fontSize: 3, + cellPadding: 0.1, + textColor: [0, 0, 0], + fontStyle: 'bold', + halign: 'center' + }, + theme: 'plain', + startY: 18 + }) + + autoTable(doc, { + head: [ + [ + 'No', 'No Laporan', 'Tgl Lapor', 'Tgl Response', @@ -387,7 +461,8 @@ const onExporting = (e: any) => { 'Nama ULP' ] ], - body: data.value.map((item: any) => [ + body: data.value.map((item: any, i: any) => [ + { content: ++i, styles: { halign: 'right' } }, item.no_laporan, item.waktu_lapor, item.waktu_response, @@ -405,11 +480,60 @@ const onExporting = (e: any) => { item.nama_ulp ]), styles: { - fontSize: 4 - } + fontSize: 3, + cellPadding: 1, + lineColor: [0, 0, 0], + lineWidth: 0.1, + cellWidth: 'auto' + }, + rowPageBreak: 'auto', + headStyles: { + fillColor: [192, 192, 192], + textColor: [0, 0, 0], + fontStyle: 'bold', + cellWidth: 'wrap', + halign: 'center' + }, + bodyStyles: { + textColor: [0, 0, 0] + }, + didParseCell: function (data) { + if (data.row.section === 'head') { + data.cell.text = data.cell.text.map(function (word: any) { + return word.toUpperCase() + }) + } + }, + startY: 23 }) - doc.save('Daftar Keluhan Pelanggan Lebih Dari 1 Kali.pdf') + autoTable(doc, { + head: [ + [`${dayTo}, ${dateToFormat}`], + [ + { + content: '(.........................................)', + styles: { minCellHeight: 8, valign: 'bottom' } + } + ] + ], + styles: { + fontSize: 3, + cellPadding: 0.1, + textColor: [0, 0, 0], + fontStyle: 'bold', + halign: 'center' + }, + theme: 'plain', + tableWidth: 50, + margin: { left: 230 } + }) + + doc + .save('Laporan Daftar Keluhan Pelanggan Lebih Dari 1 Kali.pdf', { returnPromise: true }) + .then(() => { + console.log('pdf berhasil disimpan') + }) } else { const workbook = new Workbook() const worksheet = workbook.addWorksheet('Daftar Keluhan Pelanggan Lebih Dari 1 Kali') @@ -451,6 +575,7 @@ const filterData = (params: any) => { const { ulp, uid, up3 } = params const minJmlLapor = params.minJmlLapor ? params.minJmlLapor : 1 const maxJmlLapor = params.maxJmlLapor ? params.maxJmlLapor : 100 + refetch({ minJmlLapor: minJmlLapor, maxJmlLapor: maxJmlLapor, @@ -464,20 +589,33 @@ const filterData = (params: any) => { idUid: uid ? uid.id : 0, idUp3: up3 ? up3.id : 0 }) + onResult((queryResult) => { if (queryResult.data != undefined) { data.value = queryResult.data.daftarKeluhanMelaporLebihDariSatuKali } + + reportMeta.value = filters.value console.log(queryResult.data) console.log(queryResult.loading) console.log(queryResult.networkStatus) }) + onError((error) => { console.log(error) }) } const filters = ref() +const reportMeta = ref({ + uid: { id: 0, name: 'Semua Unit Induk Distribusi/Wilayah' }, + up3: { id: 0, name: 'Semua Unit Pelaksanaan Pelayanan Pelanggan' }, + ulp: { id: 0, name: 'Semua Unit Layanan Pelanggan' }, + minJmlLapor: 1, + maxJmlLapor: 1, + periode: '' +}) + onMounted(() => { if (import.meta.env.DEV) { data.value = dummyData.keluhan.daftar.daftarKeluhanMelaporLebihDariSatuKali From cea4af20ac22fbdd3713657b0b0a811ebcf19416 Mon Sep 17 00:00:00 2001 From: kur0nek-o Date: Sat, 16 Mar 2024 16:34:46 +0700 Subject: [PATCH 08/12] fix: pdf style daftar keluhan response time --- .../Keluhan/Daftar/DKeluhan_ResponseTime.vue | 154 +++++++++++++++++- 1 file changed, 150 insertions(+), 4 deletions(-) diff --git a/src/components/Pages/Keluhan/Daftar/DKeluhan_ResponseTime.vue b/src/components/Pages/Keluhan/Daftar/DKeluhan_ResponseTime.vue index 4d79dd0..e589816 100755 --- a/src/components/Pages/Keluhan/Daftar/DKeluhan_ResponseTime.vue +++ b/src/components/Pages/Keluhan/Daftar/DKeluhan_ResponseTime.vue @@ -358,6 +358,38 @@ const onSelectionChanged = ({ selectedRowsData }: any) => { } const onExporting = (e: any) => { + const periode = reportMeta.value.periode ? reportMeta.value.periode.split(' s/d ') : '' + const minTime = reportMeta.value.minTime ? reportMeta.value.minTime : '' + const maxTime = reportMeta.value.maxTime ? reportMeta.value.maxTime : '' + + let dateFromFormat = '' + let dateToFormat = '' + let dayTo = '' + let durasi = '' + + if (minTime == '46' && maxTime != '143998560') { + durasi = 'Melebihi SLA (>45 Menit)' + } else if (minTime == '1' && maxTime == '45') { + durasi = 'Dibawah / Sesuai SLA (<=45 Menit)' + } else { + durasi = 'Durasi Menit' + } + + if (periode != '') { + const dateFrom = new Date(periode[0].split('-').reverse().join('-')) + const dateTo = new Date(periode[1].split('-').reverse().join('-')) + + dateFromFormat = `${dateFrom.getDate()}-${dateFrom.toLocaleString('default', { + month: 'long' + })}-${dateFrom.getFullYear()}` + + dateToFormat = `${dateTo.getDate()}-${dateTo.toLocaleString('default', { + month: 'long' + })}-${dateTo.getFullYear()}` + + dayTo = dateTo.toLocaleString('default', { weekday: 'long' }) + } + if (e.format === 'pdf') { const doc = new jsPDF({ orientation: 'landscape' @@ -365,7 +397,60 @@ const onExporting = (e: any) => { autoTable(doc, { head: [ + ['PT. PLN(Persero)', '', ''], [ + { content: 'UNIT INDUK', styles: { cellWidth: 25 } }, + { content: ':', styles: { cellWidth: 1 } }, + reportMeta.value.uid + ? reportMeta.value.uid.name.toUpperCase() + : 'Semua Unit Induk Distribusi/Wilayah'.toUpperCase() + ], + [ + 'UNIT PELAKSANA PELAYANAN PELANGGAN', + ':', + reportMeta.value.up3 + ? reportMeta.value.up3.name.toUpperCase() + : 'Semua Unit Pelaksanaan Pelayanan Pelanggan'.toUpperCase() + ], + [ + 'UNIT LAYANAN PELANGGAN', + ':', + reportMeta.value.ulp + ? reportMeta.value.ulp.name.toUpperCase() + : 'Semua Unit Layanan Pelanggan'.toUpperCase() + ], + ['Durasi', ':', `${durasi} ${durasi == 'Durasi Menit' ? minTime + ' - ' + maxTime : ''}`] + ], + styles: { + fontSize: 3, + cellPadding: 0.1, + textColor: [0, 0, 0], + fontStyle: 'bold' + }, + theme: 'plain', + startY: 10 + }) + + autoTable(doc, { + head: [ + ['Daftar Keluhan Response Time'.toUpperCase()], + [`PERIODE TANGGAL : ${dateFromFormat} SD TGL ${dateToFormat}`] + ], + styles: { + fontSize: 3, + cellPadding: 0.1, + textColor: [0, 0, 0], + fontStyle: 'bold', + halign: 'center' + }, + theme: 'plain', + startY: 18 + }) + + autoTable(doc, { + head: [ + [ + 'No', 'No Laporan', 'Tgl Lapor', 'Tgl Response', @@ -381,7 +466,8 @@ const onExporting = (e: any) => { 'Nama ULP' ] ], - body: data.value.map((item: any) => [ + body: data.value.map((item: any, i: any) => [ + { content: ++i, styles: { halign: 'right' } }, item.no_laporan, item.waktu_lapor, item.waktu_response, @@ -397,11 +483,58 @@ const onExporting = (e: any) => { item.nama_ulp ]), styles: { - fontSize: 4 - } + fontSize: 3, + cellPadding: 1, + lineColor: [0, 0, 0], + lineWidth: 0.1, + cellWidth: 'auto' + }, + rowPageBreak: 'auto', + headStyles: { + fillColor: [192, 192, 192], + textColor: [0, 0, 0], + fontStyle: 'bold', + cellWidth: 'wrap', + halign: 'center' + }, + bodyStyles: { + textColor: [0, 0, 0] + }, + didParseCell: function (data) { + if (data.row.section === 'head') { + data.cell.text = data.cell.text.map(function (word: any) { + return word.toUpperCase() + }) + } + }, + startY: 23 }) - doc.save('Daftar Keluhan Response Time.pdf') + autoTable(doc, { + head: [ + [`${dayTo}, ${dateToFormat}`], + [ + { + content: '(.........................................)', + styles: { minCellHeight: 8, valign: 'bottom' } + } + ] + ], + styles: { + fontSize: 3, + cellPadding: 0.1, + textColor: [0, 0, 0], + fontStyle: 'bold', + halign: 'center' + }, + theme: 'plain', + tableWidth: 50, + margin: { left: 230 } + }) + + doc.save('Laporan Daftar Keluhan Response Time.pdf', { returnPromise: true }).then(() => { + console.log('pdf berhasil disimpan') + }) } else { const workbook = new Workbook() const worksheet = workbook.addWorksheet('Daftar Keluhan Response Time') @@ -441,6 +574,7 @@ const { onResult, onError, loading, refetch } = useQuery( const filterData = (params: any) => { const dateValue = params.periode.split(' s/d ') const { ulp, uid, up3, maxTime, minTime } = params + refetch({ dateFrom: dateValue[0] ? dateValue[0].split('-').reverse().join('-') @@ -459,16 +593,28 @@ const filterData = (params: any) => { if (queryResult.data != undefined) { data.value = queryResult.data.daftarKeluhanResponseTime } + + reportMeta.value = filters.value console.log(queryResult.data) console.log(queryResult.loading) console.log(queryResult.networkStatus) }) + onError((error) => { console.log(error) }) } const filters = ref() +const reportMeta = ref({ + uid: { id: 0, name: 'Semua Unit Induk Distribusi/Wilayah' }, + up3: { id: 0, name: 'Semua Unit Pelaksanaan Pelayanan Pelanggan' }, + ulp: { id: 0, name: 'Semua Unit Layanan Pelanggan' }, + periode: '', + minTime: '', + maxTime: '' +}) + onMounted(() => { if (import.meta.env.DEV) { data.value = dummyData.keluhan.daftar.daftarKeluhanResponseTime From 6d2bae42485a4c72da7f7aac59ca8c7f0aaf59e0 Mon Sep 17 00:00:00 2001 From: kur0nek-o Date: Sat, 16 Mar 2024 16:44:27 +0700 Subject: [PATCH 09/12] fix: pdf style daftar keluhan recovery time --- .../Daftar/DGangguan_RecoveryTime.vue | 4 +- .../Daftar/DGangguan_ResponseTime.vue | 4 +- .../Keluhan/Daftar/DKeluhan_RecoveryTime.vue | 181 ++++++++++++++++-- .../Keluhan/Daftar/DKeluhan_ResponseTime.vue | 12 +- 4 files changed, 174 insertions(+), 27 deletions(-) diff --git a/src/components/Pages/Gangguan/Daftar/DGangguan_RecoveryTime.vue b/src/components/Pages/Gangguan/Daftar/DGangguan_RecoveryTime.vue index 3f77a88..165e63d 100755 --- a/src/components/Pages/Gangguan/Daftar/DGangguan_RecoveryTime.vue +++ b/src/components/Pages/Gangguan/Daftar/DGangguan_RecoveryTime.vue @@ -517,8 +517,8 @@ const onExporting = (e: any) => { item.waktu_lapor, item.waktu_response, item.waktu_recovery, - item.durasi_response_time, - item.durasi_recovery_time, + parseInt(item.durasi_response_time) ? formatWaktu(item.durasi_response_time) : '-', + parseInt(item.durasi_recovery_time) ? formatWaktu(item.durasi_recovery_time) : '-', item.status_akhir, item.referensi_marking, item.idpel_nometer, diff --git a/src/components/Pages/Gangguan/Daftar/DGangguan_ResponseTime.vue b/src/components/Pages/Gangguan/Daftar/DGangguan_ResponseTime.vue index 47c3f1f..c5a6643 100755 --- a/src/components/Pages/Gangguan/Daftar/DGangguan_ResponseTime.vue +++ b/src/components/Pages/Gangguan/Daftar/DGangguan_ResponseTime.vue @@ -504,8 +504,8 @@ const onExporting = (e: any) => { item.waktu_lapor, item.waktu_response, item.waktu_recovery, - item.durasi_response_time, - item.durasi_recovery_time, + parseInt(item.durasi_response_time) ? formatWaktu(item.durasi_response_time) : '-', + parseInt(item.durasi_recovery_time) ? formatWaktu(item.durasi_recovery_time) : '-', item.status_akhir, item.referensi_marking, item.idpel_nometer, diff --git a/src/components/Pages/Keluhan/Daftar/DKeluhan_RecoveryTime.vue b/src/components/Pages/Keluhan/Daftar/DKeluhan_RecoveryTime.vue index 633f14c..0547316 100755 --- a/src/components/Pages/Keluhan/Daftar/DKeluhan_RecoveryTime.vue +++ b/src/components/Pages/Keluhan/Daftar/DKeluhan_RecoveryTime.vue @@ -339,6 +339,38 @@ const onSelectionChanged = ({ selectedRowsData }: any) => { } const onExporting = (e: any) => { + const periode = reportMeta.value.periode ? reportMeta.value.periode.split(' s/d ') : '' + const minTime = reportMeta.value.minTime ? reportMeta.value.minTime : '' + const maxTime = reportMeta.value.maxTime ? reportMeta.value.maxTime : '' + + let dateFromFormat = '' + let dateToFormat = '' + let dayTo = '' + let durasi = '' + + if (minTime == '1441' && maxTime != '143998560') { + durasi = 'Melebihi SLA (>1 hari)' + } else if (minTime == '1' && maxTime == '1440') { + durasi = 'Dibawah / Sesuai SLA (<=1 hari)' + } else { + durasi = 'Durasi Menit' + } + + if (periode != '') { + const dateFrom = new Date(periode[0].split('-').reverse().join('-')) + const dateTo = new Date(periode[1].split('-').reverse().join('-')) + + dateFromFormat = `${dateFrom.getDate()}-${dateFrom.toLocaleString('default', { + month: 'long' + })}-${dateFrom.getFullYear()}` + + dateToFormat = `${dateTo.getDate()}-${dateTo.toLocaleString('default', { + month: 'long' + })}-${dateTo.getFullYear()}` + + dayTo = dateTo.toLocaleString('default', { weekday: 'long' }) + } + if (e.format === 'pdf') { const doc = new jsPDF({ orientation: 'landscape' @@ -346,7 +378,60 @@ const onExporting = (e: any) => { autoTable(doc, { head: [ + ['PT. PLN(Persero)', '', ''], [ + { content: 'UNIT INDUK', styles: { cellWidth: 25 } }, + { content: ':', styles: { cellWidth: 1 } }, + reportMeta.value.uid + ? reportMeta.value.uid.name.toUpperCase() + : 'Semua Unit Induk Distribusi/Wilayah'.toUpperCase() + ], + [ + 'UNIT PELAKSANA PELAYANAN PELANGGAN', + ':', + reportMeta.value.up3 + ? reportMeta.value.up3.name.toUpperCase() + : 'Semua Unit Pelaksanaan Pelayanan Pelanggan'.toUpperCase() + ], + [ + 'UNIT LAYANAN PELANGGAN', + ':', + reportMeta.value.ulp + ? reportMeta.value.ulp.name.toUpperCase() + : 'Semua Unit Layanan Pelanggan'.toUpperCase() + ], + ['Durasi', ':', `${durasi} ${durasi == 'Durasi Menit' ? minTime + ' - ' + maxTime : ''}`] + ], + styles: { + fontSize: 3, + cellPadding: 0.1, + textColor: [0, 0, 0], + fontStyle: 'bold' + }, + theme: 'plain', + startY: 10 + }) + + autoTable(doc, { + head: [ + ['Daftar Keluhan Recovery Time'.toUpperCase()], + [`PERIODE TANGGAL : ${dateFromFormat} SD TGL ${dateToFormat}`] + ], + styles: { + fontSize: 3, + cellPadding: 0.1, + textColor: [0, 0, 0], + fontStyle: 'bold', + halign: 'center' + }, + theme: 'plain', + startY: 18 + }) + + autoTable(doc, { + head: [ + [ + 'No', 'No Laporan', 'Tgl Lapor', 'Tgl Response', @@ -362,27 +447,75 @@ const onExporting = (e: any) => { 'Nama ULP' ] ], - body: data.value.map((i) => [ - i.no_laporan, - i.waktu_lapor, - i.waktu_response, - i.waktu_recovery, - parseInt(i.durasi_response_time) ? formatWaktu(i.durasi_response_time) : '-', - parseInt(i.durasi_recovery_time) ? formatWaktu(i.durasi_recovery_time) : '-', - i.status_akhir, - i.idpel_nometer, - i.nama_pelapor, - i.alamat_pelapor, - i.no_telp_pelapor, - i.keterangan_pelapor, - i.nama_ulp + body: data.value.map((item: any, i: any) => [ + { content: ++i, styles: { halign: 'right' } }, + item.no_laporan, + item.waktu_lapor, + item.waktu_response, + item.waktu_recovery, + parseInt(item.durasi_response_time) ? formatWaktu(item.durasi_response_time) : '-', + parseInt(item.durasi_recovery_time) ? formatWaktu(item.durasi_recovery_time) : '-', + item.status_akhir, + item.idpel_nometer, + item.nama_pelapor, + item.alamat_pelapor, + item.no_telp_pelapor, + item.keterangan_pelapor, + item.nama_ulp ]), styles: { - fontSize: 4 - } + fontSize: 3, + cellPadding: 1, + lineColor: [0, 0, 0], + lineWidth: 0.1, + cellWidth: 'auto' + }, + rowPageBreak: 'auto', + headStyles: { + fillColor: [192, 192, 192], + textColor: [0, 0, 0], + fontStyle: 'bold', + cellWidth: 'wrap', + halign: 'center' + }, + bodyStyles: { + textColor: [0, 0, 0] + }, + didParseCell: function (data) { + if (data.row.section === 'head') { + data.cell.text = data.cell.text.map(function (word: any) { + return word.toUpperCase() + }) + } + }, + startY: 23 }) - doc.save('Daftar Keluhan Recovery Time.pdf') + autoTable(doc, { + head: [ + [`${dayTo}, ${dateToFormat}`], + [ + { + content: '(.........................................)', + styles: { minCellHeight: 8, valign: 'bottom' } + } + ] + ], + styles: { + fontSize: 3, + cellPadding: 0.1, + textColor: [0, 0, 0], + fontStyle: 'bold', + halign: 'center' + }, + theme: 'plain', + tableWidth: 50, + margin: { left: 230 } + }) + + doc.save('Laporan Daftar Keluhan Recovery Time.pdf', { returnPromise: true }).then(() => { + console.log('pdf berhasil disimpan') + }) } else { const workbook = new Workbook() const worksheet = workbook.addWorksheet('Daftar Keluhan Recovery Time') @@ -422,6 +555,7 @@ const { onResult, onError, loading, refetch } = useQuery( const filterData = (params: any) => { const dateValue = params.periode.split(' s/d ') const { ulp, uid, up3, minTime, maxTime } = params + refetch({ dateFrom: dateValue[0] ? dateValue[0].split('-').reverse().join('-') @@ -435,20 +569,33 @@ const filterData = (params: any) => { idUid: uid ? uid.id : 0, idUp3: up3 ? up3.id : 0 }) + onResult((queryResult) => { if (queryResult.data != undefined) { data.value = queryResult.data.daftarKeluhanRecoveryTime } + + reportMeta.value = filters.value console.log(queryResult.data) console.log(queryResult.loading) console.log(queryResult.networkStatus) }) + onError((error) => { console.log(error) }) } const filters = ref() +const reportMeta = ref({ + uid: { id: 0, name: 'Semua Unit Induk Distribusi/Wilayah' }, + up3: { id: 0, name: 'Semua Unit Pelaksanaan Pelayanan Pelanggan' }, + ulp: { id: 0, name: 'Semua Unit Layanan Pelanggan' }, + periode: '', + minTime: '', + maxTime: '' +}) + onMounted(() => { if (import.meta.env.DEV) { data.value = dummyData.keluhan.daftar.daftarKeluhanRecoveryTime diff --git a/src/components/Pages/Keluhan/Daftar/DKeluhan_ResponseTime.vue b/src/components/Pages/Keluhan/Daftar/DKeluhan_ResponseTime.vue index e589816..6023195 100755 --- a/src/components/Pages/Keluhan/Daftar/DKeluhan_ResponseTime.vue +++ b/src/components/Pages/Keluhan/Daftar/DKeluhan_ResponseTime.vue @@ -367,10 +367,10 @@ const onExporting = (e: any) => { let dayTo = '' let durasi = '' - if (minTime == '46' && maxTime != '143998560') { - durasi = 'Melebihi SLA (>45 Menit)' - } else if (minTime == '1' && maxTime == '45') { - durasi = 'Dibawah / Sesuai SLA (<=45 Menit)' + if (minTime == '1441' && maxTime != '143998560') { + durasi = 'Melebihi SLA (>1 hari)' + } else if (minTime == '1' && maxTime == '1440') { + durasi = 'Dibawah / Sesuai SLA (<=1 hari)' } else { durasi = 'Durasi Menit' } @@ -472,8 +472,8 @@ const onExporting = (e: any) => { item.waktu_lapor, item.waktu_response, item.waktu_recovery, - item.durasi_response_time, - item.durasi_recovery_time, + parseInt(item.durasi_response_time) ? formatWaktu(item.durasi_response_time) : '-', + parseInt(item.durasi_recovery_time) ? formatWaktu(item.durasi_recovery_time) : '-', item.status_akhir, item.idpel_nometer, item.nama_pelapor, From 952c277b0f30780aea2ced1d91ae08d9d5c380de Mon Sep 17 00:00:00 2001 From: kur0nek-o Date: Sat, 16 Mar 2024 17:03:09 +0700 Subject: [PATCH 10/12] fix: pdf style daftar keluhan selesai tanpa id pelanggan --- .../Pages/Gangguan/Daftar/DGangguan_BM.vue | 4 +- .../Pages/Gangguan/Daftar/DGangguan_DKPL.vue | 4 +- .../Gangguan/Daftar/DGangguan_DMAPKT.vue | 4 +- .../Pages/Gangguan/Daftar/DGangguan_MLD1K.vue | 4 +- .../Pages/Gangguan/Daftar/DGangguan_STIDP.vue | 4 +- .../Pages/Keluhan/Daftar/DKeluhan_DKUL.vue | 4 +- .../Pages/Keluhan/Daftar/DKeluhan_PLD1K.vue | 4 +- .../Keluhan/Daftar/DKeluhan_RecoveryTime.vue | 12 +- .../Keluhan/Daftar/DKeluhan_ResponseTime.vue | 8 +- .../Pages/Keluhan/Daftar/DKeluhan_STIDP.vue | 142 +++++++++++++++++- 10 files changed, 162 insertions(+), 28 deletions(-) diff --git a/src/components/Pages/Gangguan/Daftar/DGangguan_BM.vue b/src/components/Pages/Gangguan/Daftar/DGangguan_BM.vue index 5b2c9ce..e61c88f 100755 --- a/src/components/Pages/Gangguan/Daftar/DGangguan_BM.vue +++ b/src/components/Pages/Gangguan/Daftar/DGangguan_BM.vue @@ -374,8 +374,8 @@ const onExporting = (e: any) => { item.waktu_lapor, item.waktu_response, item.waktu_recovery, - item.durasi_response_time, - item.durasi_recovery_time, + parseInt(item.durasi_response_time) ? formatWaktu(item.durasi_response_time) : '-', + parseInt(item.durasi_recovery_time) ? formatWaktu(item.durasi_recovery_time) : '-', item.nama_posko, item.waktu_media, item.keterangan_media diff --git a/src/components/Pages/Gangguan/Daftar/DGangguan_DKPL.vue b/src/components/Pages/Gangguan/Daftar/DGangguan_DKPL.vue index 801a3f1..2e94060 100755 --- a/src/components/Pages/Gangguan/Daftar/DGangguan_DKPL.vue +++ b/src/components/Pages/Gangguan/Daftar/DGangguan_DKPL.vue @@ -484,8 +484,8 @@ const onExporting = (e: any) => { item.waktu_dialihkan, item.waktu_response, item.waktu_recovery, - item.durasi_response_time, - item.durasi_recovery_time, + parseInt(item.durasi_response_time) ? formatWaktu(item.durasi_response_time) : '-', + parseInt(item.durasi_recovery_time) ? formatWaktu(item.durasi_recovery_time) : '-', item.nama_posko_lama, item.nama_posko_baru, item.status_akhir, diff --git a/src/components/Pages/Gangguan/Daftar/DGangguan_DMAPKT.vue b/src/components/Pages/Gangguan/Daftar/DGangguan_DMAPKT.vue index 4c1d658..e511c79 100755 --- a/src/components/Pages/Gangguan/Daftar/DGangguan_DMAPKT.vue +++ b/src/components/Pages/Gangguan/Daftar/DGangguan_DMAPKT.vue @@ -363,8 +363,8 @@ const onExporting = (e: any) => { item.waktu_lapor, item.waktu_response, item.waktu_recovery, - item.durasi_response_time, - item.durasi_recovery_time, + parseInt(item.durasi_response_time) ? formatWaktu(item.durasi_response_time) : '-', + parseInt(item.durasi_recovery_time) ? formatWaktu(item.durasi_recovery_time) : '-', item.status_akhir, item.idpel_nometer, item.nama_pelapor, diff --git a/src/components/Pages/Gangguan/Daftar/DGangguan_MLD1K.vue b/src/components/Pages/Gangguan/Daftar/DGangguan_MLD1K.vue index 18cc71d..e4ca451 100755 --- a/src/components/Pages/Gangguan/Daftar/DGangguan_MLD1K.vue +++ b/src/components/Pages/Gangguan/Daftar/DGangguan_MLD1K.vue @@ -506,8 +506,8 @@ const onExporting = (e: any) => { item.waktu_response, item.waktu_recovery, item.jumlah_lapor, - item.durasi_response_time, - item.durasi_recovery_time, + parseInt(item.durasi_response_time) ? formatWaktu(item.durasi_response_time) : '-', + parseInt(item.durasi_recovery_time) ? formatWaktu(item.durasi_recovery_time) : '-', item.status_akhir, item.idpel_nometer, item.nama_pelapor, diff --git a/src/components/Pages/Gangguan/Daftar/DGangguan_STIDP.vue b/src/components/Pages/Gangguan/Daftar/DGangguan_STIDP.vue index 63e56da..dd39211 100755 --- a/src/components/Pages/Gangguan/Daftar/DGangguan_STIDP.vue +++ b/src/components/Pages/Gangguan/Daftar/DGangguan_STIDP.vue @@ -363,8 +363,8 @@ const onExporting = (e: any) => { item.waktu_lapor, item.waktu_response, item.waktu_recovery, - item.durasi_response_time, - item.durasi_recovery_time, + parseInt(item.durasi_response_time) ? formatWaktu(item.durasi_response_time) : '-', + parseInt(item.durasi_recovery_time) ? formatWaktu(item.durasi_recovery_time) : '-', item.status_akhir, item.idpel_nometer, item.nama_pelapor, diff --git a/src/components/Pages/Keluhan/Daftar/DKeluhan_DKUL.vue b/src/components/Pages/Keluhan/Daftar/DKeluhan_DKUL.vue index d0f62dd..32d2584 100755 --- a/src/components/Pages/Keluhan/Daftar/DKeluhan_DKUL.vue +++ b/src/components/Pages/Keluhan/Daftar/DKeluhan_DKUL.vue @@ -342,8 +342,8 @@ const onExporting = (e: any) => { item.waktu_dialihkan, item.waktu_response, item.waktu_recovery, - item.durasi_response_time, - item.durasi_recovery_time, + parseInt(item.durasi_response_time) ? formatWaktu(item.durasi_response_time) : '-', + parseInt(item.durasi_recovery_time) ? formatWaktu(item.durasi_recovery_time) : '-', item.nama_unit_lama, item.status_akhir, item.idpel_nometer, diff --git a/src/components/Pages/Keluhan/Daftar/DKeluhan_PLD1K.vue b/src/components/Pages/Keluhan/Daftar/DKeluhan_PLD1K.vue index 088a47c..8e474bc 100755 --- a/src/components/Pages/Keluhan/Daftar/DKeluhan_PLD1K.vue +++ b/src/components/Pages/Keluhan/Daftar/DKeluhan_PLD1K.vue @@ -468,8 +468,8 @@ const onExporting = (e: any) => { item.waktu_response, item.waktu_recovery, item.jumlah_lapor, - item.durasi_response_time, - item.durasi_recovery_time, + parseInt(item.durasi_response_time) ? formatWaktu(item.durasi_response_time) : '-', + parseInt(item.durasi_recovery_time) ? formatWaktu(item.durasi_recovery_time) : '-', item.status_akhir, item.idpel_nometer, item.nama_pelapor, diff --git a/src/components/Pages/Keluhan/Daftar/DKeluhan_RecoveryTime.vue b/src/components/Pages/Keluhan/Daftar/DKeluhan_RecoveryTime.vue index 0547316..4f844c6 100755 --- a/src/components/Pages/Keluhan/Daftar/DKeluhan_RecoveryTime.vue +++ b/src/components/Pages/Keluhan/Daftar/DKeluhan_RecoveryTime.vue @@ -7,12 +7,12 @@ id: 1, name: 'Dibawah / Sesuai SLA (<= 3 hari)', min: '1', - max: '4320' + max: '4381' }, { id: 2, name: 'Melebihi SLA (> 3 hari)', - min: '4321', + min: '4382', max: `${99999 * 60 * 24}` } ]" @@ -348,10 +348,10 @@ const onExporting = (e: any) => { let dayTo = '' let durasi = '' - if (minTime == '1441' && maxTime != '143998560') { - durasi = 'Melebihi SLA (>1 hari)' - } else if (minTime == '1' && maxTime == '1440') { - durasi = 'Dibawah / Sesuai SLA (<=1 hari)' + if (minTime == '4382' && maxTime != '143998560') { + durasi = 'Melebihi SLA (>3 hari)' + } else if (minTime == '1' && maxTime == '4381') { + durasi = 'Dibawah / Sesuai SLA (<=3 hari)' } else { durasi = 'Durasi Menit' } diff --git a/src/components/Pages/Keluhan/Daftar/DKeluhan_ResponseTime.vue b/src/components/Pages/Keluhan/Daftar/DKeluhan_ResponseTime.vue index 6023195..501139a 100755 --- a/src/components/Pages/Keluhan/Daftar/DKeluhan_ResponseTime.vue +++ b/src/components/Pages/Keluhan/Daftar/DKeluhan_ResponseTime.vue @@ -7,12 +7,12 @@ id: 1, name: 'Dibawah / Sesuai SLA (<= 1 hari)', min: '1', - max: '1440' + max: '1501' }, { id: 2, name: 'Melebihi SLA (> 1 hari)', - min: '1441', + min: '1502', max: `${99999 * 60 * 24}` } ]" @@ -367,9 +367,9 @@ const onExporting = (e: any) => { let dayTo = '' let durasi = '' - if (minTime == '1441' && maxTime != '143998560') { + if (minTime == '1502' && maxTime != '143998560') { durasi = 'Melebihi SLA (>1 hari)' - } else if (minTime == '1' && maxTime == '1440') { + } else if (minTime == '1' && maxTime == '1501') { durasi = 'Dibawah / Sesuai SLA (<=1 hari)' } else { durasi = 'Durasi Menit' diff --git a/src/components/Pages/Keluhan/Daftar/DKeluhan_STIDP.vue b/src/components/Pages/Keluhan/Daftar/DKeluhan_STIDP.vue index 020cf91..9e68fab 100755 --- a/src/components/Pages/Keluhan/Daftar/DKeluhan_STIDP.vue +++ b/src/components/Pages/Keluhan/Daftar/DKeluhan_STIDP.vue @@ -330,6 +330,27 @@ const onSelectionChanged = ({ selectedRowsData }: any) => { } const onExporting = (e: any) => { + const periode = reportMeta.value.periode ? reportMeta.value.periode.split(' s/d ') : '' + + let dateFromFormat = '' + let dateToFormat = '' + let dayTo = '' + + if (periode != '') { + const dateFrom = new Date(periode[0].split('-').reverse().join('-')) + const dateTo = new Date(periode[1].split('-').reverse().join('-')) + + dateFromFormat = `${dateFrom.getDate()}-${dateFrom.toLocaleString('default', { + month: 'long' + })}-${dateFrom.getFullYear()}` + + dateToFormat = `${dateTo.getDate()}-${dateTo.toLocaleString('default', { + month: 'long' + })}-${dateTo.getFullYear()}` + + dayTo = dateTo.toLocaleString('default', { weekday: 'long' }) + } + if (e.format === 'pdf') { const doc = new jsPDF({ orientation: 'landscape' @@ -337,7 +358,59 @@ const onExporting = (e: any) => { autoTable(doc, { head: [ + ['PT. PLN(Persero)', '', ''], [ + { content: 'UNIT INDUK', styles: { cellWidth: 25 } }, + { content: ':', styles: { cellWidth: 1 } }, + reportMeta.value.uid + ? reportMeta.value.uid.name.toUpperCase() + : 'Semua Unit Induk Distribusi/Wilayah'.toUpperCase() + ], + [ + 'UNIT PELAKSANA PELAYANAN PELANGGAN', + ':', + reportMeta.value.up3 + ? reportMeta.value.up3.name.toUpperCase() + : 'Semua Unit Pelaksanaan Pelayanan Pelanggan'.toUpperCase() + ], + [ + 'UNIT LAYANAN PELANGGAN', + ':', + reportMeta.value.ulp + ? reportMeta.value.ulp.name.toUpperCase() + : 'Semua Unit Layanan Pelanggan'.toUpperCase() + ] + ], + styles: { + fontSize: 3, + cellPadding: 0.1, + textColor: [0, 0, 0], + fontStyle: 'bold' + }, + theme: 'plain', + startY: 10 + }) + + autoTable(doc, { + head: [ + ['Daftar Keluhan Selesai Tanpa ID Pelanggan'.toUpperCase()], + [`PERIODE TANGGAL : ${dateFromFormat} SD TGL ${dateToFormat}`] + ], + styles: { + fontSize: 3, + cellPadding: 0.1, + textColor: [0, 0, 0], + fontStyle: 'bold', + halign: 'center' + }, + theme: 'plain', + startY: 18 + }) + + autoTable(doc, { + head: [ + [ + 'No', 'No Laporan', 'Tgl Lapor', 'Tgl Response', @@ -354,7 +427,8 @@ const onExporting = (e: any) => { 'Nama ULP' ] ], - body: data.value.map((item: any) => [ + body: data.value.map((item: any, i: any) => [ + { content: ++i, styles: { halign: 'right' } }, item.no_laporan, item.waktu_lapor, item.waktu_response, @@ -371,11 +445,60 @@ const onExporting = (e: any) => { item.nama_ulp ]), styles: { - fontSize: 4 - } + fontSize: 3, + cellPadding: 1, + lineColor: [0, 0, 0], + lineWidth: 0.1, + cellWidth: 'auto' + }, + rowPageBreak: 'auto', + headStyles: { + fillColor: [192, 192, 192], + textColor: [0, 0, 0], + fontStyle: 'bold', + cellWidth: 'wrap', + halign: 'center' + }, + bodyStyles: { + textColor: [0, 0, 0] + }, + didParseCell: function (data) { + if (data.row.section === 'head') { + data.cell.text = data.cell.text.map(function (word: any) { + return word.toUpperCase() + }) + } + }, + startY: 23 }) - doc.save('Daftar Keluhan Selesai Tanpa ID Pelanggan.pdf') + autoTable(doc, { + head: [ + [`${dayTo}, ${dateToFormat}`], + [ + { + content: '(.........................................)', + styles: { minCellHeight: 8, valign: 'bottom' } + } + ] + ], + styles: { + fontSize: 3, + cellPadding: 0.1, + textColor: [0, 0, 0], + fontStyle: 'bold', + halign: 'center' + }, + theme: 'plain', + tableWidth: 50, + margin: { left: 230 } + }) + + doc + .save('Laporan Daftar Keluhan Selesai Tanpa ID Pelanggan.pdf', { returnPromise: true }) + .then(() => { + console.log('pdf berhasil disimpan') + }) } else { const workbook = new Workbook() const worksheet = workbook.addWorksheet('Daftar Keluhan Selesai Tanpa ID Pelanggan') @@ -413,6 +536,7 @@ const { onResult, onError, loading, refetch } = useQuery( const filterData = (params: any) => { const dateValue = params.periode.split(' s/d ') const { ulp, uid, up3 } = params + refetch({ dateFrom: dateValue[0] ? dateValue[0].split('-').reverse().join('-') @@ -429,16 +553,26 @@ const filterData = (params: any) => { if (queryResult.data != undefined) { data.value = queryResult.data.daftarKeluhanSelesaiTanpaIdPelanggan } + + reportMeta.value = filters.value console.log(queryResult.data) console.log(queryResult.loading) console.log(queryResult.networkStatus) }) + onError((error) => { console.log(error) }) } const filters = ref() +const reportMeta = ref({ + uid: { id: 0, name: 'Semua Unit Induk Distribusi/Wilayah' }, + up3: { id: 0, name: 'Semua Unit Pelaksanaan Pelayanan Pelanggan' }, + ulp: { id: 0, name: 'Semua Unit Layanan Pelanggan' }, + periode: '' +}) + onMounted(() => { if (import.meta.env.DEV) { data.value = dummyData.keluhan.daftar.daftarKeluhanSelesaiTanpaIdPelanggan From b8ffe217ebc1ab6be46b04c68eef78ff2adb2706 Mon Sep 17 00:00:00 2001 From: kur0nek-o Date: Sat, 16 Mar 2024 17:07:59 +0700 Subject: [PATCH 11/12] fix: pdf style daftar keluhan berdasarkan media --- .../Keluhan/Daftar/DKeluhan_BerdasarMedia.vue | 136 +++++++++++++++++- 1 file changed, 133 insertions(+), 3 deletions(-) diff --git a/src/components/Pages/Keluhan/Daftar/DKeluhan_BerdasarMedia.vue b/src/components/Pages/Keluhan/Daftar/DKeluhan_BerdasarMedia.vue index 9dabd0d..a16850c 100755 --- a/src/components/Pages/Keluhan/Daftar/DKeluhan_BerdasarMedia.vue +++ b/src/components/Pages/Keluhan/Daftar/DKeluhan_BerdasarMedia.vue @@ -337,11 +337,83 @@ const onSelectionChanged = ({ selectedRowsData }: any) => { } const onExporting = (e: any) => { + const periode = reportMeta.value.periode ? reportMeta.value.periode.split(' s/d ') : '' + + let dateFromFormat = '' + let dateToFormat = '' + let dayTo = '' + + if (periode != '') { + const dateFrom = new Date(periode[0].split('-').reverse().join('-')) + const dateTo = new Date(periode[1].split('-').reverse().join('-')) + + dateFromFormat = `${dateFrom.getDate()}-${dateFrom.toLocaleString('default', { + month: 'long' + })}-${dateFrom.getFullYear()}` + + dateToFormat = `${dateTo.getDate()}-${dateTo.toLocaleString('default', { + month: 'long' + })}-${dateTo.getFullYear()}` + + dayTo = dateTo.toLocaleString('default', { weekday: 'long' }) + } + if (e.format === 'pdf') { const doc = new jsPDF({ orientation: 'landscape' }) + autoTable(doc, { + head: [ + ['PT. PLN(Persero)', '', ''], + [ + { content: 'UNIT INDUK', styles: { cellWidth: 25 } }, + { content: ':', styles: { cellWidth: 1 } }, + reportMeta.value.uid + ? reportMeta.value.uid.name.toUpperCase() + : 'Semua Unit Induk Distribusi/Wilayah'.toUpperCase() + ], + [ + 'UNIT PELAKSANA PELAYANAN PELANGGAN', + ':', + reportMeta.value.up3 + ? reportMeta.value.up3.name.toUpperCase() + : 'Semua Unit Pelaksanaan Pelayanan Pelanggan'.toUpperCase() + ], + [ + 'UNIT LAYANAN PELANGGAN', + ':', + reportMeta.value.ulp + ? reportMeta.value.ulp.name.toUpperCase() + : 'Semua Unit Layanan Pelanggan'.toUpperCase() + ] + ], + styles: { + fontSize: 3, + cellPadding: 0.1, + textColor: [0, 0, 0], + fontStyle: 'bold' + }, + theme: 'plain', + startY: 10 + }) + + autoTable(doc, { + head: [ + ['Daftar Keluhan Berdasarkan Media'.toUpperCase()], + [`PERIODE TANGGAL : ${dateFromFormat} SD TGL ${dateToFormat}`] + ], + styles: { + fontSize: 3, + cellPadding: 0.1, + textColor: [0, 0, 0], + fontStyle: 'bold', + halign: 'center' + }, + theme: 'plain', + startY: 18 + }) + autoTable(doc, { head: [ [ @@ -378,11 +450,58 @@ const onExporting = (e: any) => { item.keterangan_media ]), styles: { - fontSize: 4 - } + fontSize: 3, + cellPadding: 1, + lineColor: [0, 0, 0], + lineWidth: 0.1, + cellWidth: 'auto' + }, + rowPageBreak: 'auto', + headStyles: { + fillColor: [192, 192, 192], + textColor: [0, 0, 0], + fontStyle: 'bold', + cellWidth: 'wrap', + halign: 'center' + }, + bodyStyles: { + textColor: [0, 0, 0] + }, + didParseCell: function (data) { + if (data.row.section === 'head') { + data.cell.text = data.cell.text.map(function (word: any) { + return word.toUpperCase() + }) + } + }, + startY: 23 }) - doc.save('Daftar Keluhan Berdasarkan Media.pdf') + autoTable(doc, { + head: [ + [`${dayTo}, ${dateToFormat}`], + [ + { + content: '(.........................................)', + styles: { minCellHeight: 8, valign: 'bottom' } + } + ] + ], + styles: { + fontSize: 3, + cellPadding: 0.1, + textColor: [0, 0, 0], + fontStyle: 'bold', + halign: 'center' + }, + theme: 'plain', + tableWidth: 50, + margin: { left: 230 } + }) + + doc.save('Laporan Daftar Keluhan Berdasarkan Media.pdf', { returnPromise: true }).then(() => { + console.log('pdf berhasil disimpan') + }) } else { const workbook = new Workbook() const worksheet = workbook.addWorksheet('Daftar Keluhan Berdasarkan Media') @@ -420,6 +539,7 @@ const { onResult, onError, loading, refetch } = useQuery( const filterData = (params: any) => { const dateValue = params.periode.split(' s/d ') const { ulp, uid, up3 } = params + refetch({ dateFrom: dateValue[0] ? dateValue[0].split('-').reverse().join('-') @@ -436,16 +556,26 @@ const filterData = (params: any) => { if (queryResult.data != undefined) { data.value = queryResult.data.daftarKeluhanBerdasarkanMedia } + + reportMeta.value = filters.value console.log(queryResult.data) console.log(queryResult.loading) console.log(queryResult.networkStatus) }) + onError((error) => { console.log(error) }) } const filters = ref() +const reportMeta = ref({ + uid: { id: 0, name: 'Semua Unit Induk Distribusi/Wilayah' }, + up3: { id: 0, name: 'Semua Unit Pelaksanaan Pelayanan Pelanggan' }, + ulp: { id: 0, name: 'Semua Unit Layanan Pelanggan' }, + periode: '' +}) + onMounted(() => { if (import.meta.env.DEV) { data.value = dummyData.keluhan.daftar.daftarKeluhanBerdasarkanMedia From cee09740c291e1107bb3a96cf4fc877978cdf324 Mon Sep 17 00:00:00 2001 From: kur0nek-o Date: Sat, 16 Mar 2024 17:12:50 +0700 Subject: [PATCH 12/12] fix: pdf style daftar keluhan selesai di cc --- .../Keluhan/Daftar/DKeluhan_BerdasarMedia.vue | 4 +- .../Keluhan/Daftar/DKeluhan_SelesaiCC.vue | 142 +++++++++++++++++- 2 files changed, 140 insertions(+), 6 deletions(-) diff --git a/src/components/Pages/Keluhan/Daftar/DKeluhan_BerdasarMedia.vue b/src/components/Pages/Keluhan/Daftar/DKeluhan_BerdasarMedia.vue index a16850c..ad49917 100755 --- a/src/components/Pages/Keluhan/Daftar/DKeluhan_BerdasarMedia.vue +++ b/src/components/Pages/Keluhan/Daftar/DKeluhan_BerdasarMedia.vue @@ -417,6 +417,7 @@ const onExporting = (e: any) => { autoTable(doc, { head: [ [ + 'No', 'No Laporan', 'Nama Pelapor', 'Alamat Pelapor', @@ -433,7 +434,8 @@ const onExporting = (e: any) => { 'Keterangan Media' ] ], - body: data.value.map((item) => [ + body: data.value.map((item: any, i: any) => [ + { content: ++i, styles: { halign: 'right' } }, item.no_laporan, item.nama_pelapor, item.alamat_pelapor, diff --git a/src/components/Pages/Keluhan/Daftar/DKeluhan_SelesaiCC.vue b/src/components/Pages/Keluhan/Daftar/DKeluhan_SelesaiCC.vue index 1c66c79..0b45b10 100755 --- a/src/components/Pages/Keluhan/Daftar/DKeluhan_SelesaiCC.vue +++ b/src/components/Pages/Keluhan/Daftar/DKeluhan_SelesaiCC.vue @@ -223,6 +223,27 @@ const shading = ref(true) const showPane = ref(true) const onExporting = (e: any) => { + const periode = reportMeta.value.periode ? reportMeta.value.periode.split(' s/d ') : '' + + let dateFromFormat = '' + let dateToFormat = '' + let dayTo = '' + + if (periode != '') { + const dateFrom = new Date(periode[0].split('-').reverse().join('-')) + const dateTo = new Date(periode[1].split('-').reverse().join('-')) + + dateFromFormat = `${dateFrom.getDate()}-${dateFrom.toLocaleString('default', { + month: 'long' + })}-${dateFrom.getFullYear()}` + + dateToFormat = `${dateTo.getDate()}-${dateTo.toLocaleString('default', { + month: 'long' + })}-${dateTo.getFullYear()}` + + dayTo = dateTo.toLocaleString('default', { weekday: 'long' }) + } + if (e.format === 'pdf') { const doc = new jsPDF({ orientation: 'landscape' @@ -230,7 +251,59 @@ const onExporting = (e: any) => { autoTable(doc, { head: [ + ['PT. PLN(Persero)', '', ''], [ + { content: 'UNIT INDUK', styles: { cellWidth: 25 } }, + { content: ':', styles: { cellWidth: 1 } }, + reportMeta.value.uid + ? reportMeta.value.uid.name.toUpperCase() + : 'Semua Unit Induk Distribusi/Wilayah'.toUpperCase() + ], + [ + 'UNIT PELAKSANA PELAYANAN PELANGGAN', + ':', + reportMeta.value.up3 + ? reportMeta.value.up3.name.toUpperCase() + : 'Semua Unit Pelaksanaan Pelayanan Pelanggan'.toUpperCase() + ], + [ + 'UNIT LAYANAN PELANGGAN', + ':', + reportMeta.value.ulp + ? reportMeta.value.ulp.name.toUpperCase() + : 'Semua Unit Layanan Pelanggan'.toUpperCase() + ] + ], + styles: { + fontSize: 3, + cellPadding: 0.1, + textColor: [0, 0, 0], + fontStyle: 'bold' + }, + theme: 'plain', + startY: 10 + }) + + autoTable(doc, { + head: [ + ['Daftar Keluhan Selesai di Contact Center'.toUpperCase()], + [`PERIODE TANGGAL : ${dateFromFormat} SD TGL ${dateToFormat}`] + ], + styles: { + fontSize: 3, + cellPadding: 0.1, + textColor: [0, 0, 0], + fontStyle: 'bold', + halign: 'center' + }, + theme: 'plain', + startY: 18 + }) + + autoTable(doc, { + head: [ + [ + 'No', 'No Laporan', 'Contact Center', 'UI Dist.', @@ -249,7 +322,8 @@ const onExporting = (e: any) => { 'Sub Issue Type' ] ], - body: data.value.map((item: any) => [ + body: data.value.map((item: any, i: any) => [ + { content: ++i, styles: { halign: 'right' } }, item.no_laporan, item.nama_ulp, item.nama_uid, @@ -268,11 +342,60 @@ const onExporting = (e: any) => { item.nama_subissuetype ]), styles: { - fontSize: 4 - } + fontSize: 3, + cellPadding: 1, + lineColor: [0, 0, 0], + lineWidth: 0.1, + cellWidth: 'auto' + }, + rowPageBreak: 'auto', + headStyles: { + fillColor: [192, 192, 192], + textColor: [0, 0, 0], + fontStyle: 'bold', + cellWidth: 'wrap', + halign: 'center' + }, + bodyStyles: { + textColor: [0, 0, 0] + }, + didParseCell: function (data) { + if (data.row.section === 'head') { + data.cell.text = data.cell.text.map(function (word: any) { + return word.toUpperCase() + }) + } + }, + startY: 23 }) - doc.save('Daftar Keluhan Selesai di Contact Center.pdf') + autoTable(doc, { + head: [ + [`${dayTo}, ${dateToFormat}`], + [ + { + content: '(.........................................)', + styles: { minCellHeight: 8, valign: 'bottom' } + } + ] + ], + styles: { + fontSize: 3, + cellPadding: 0.1, + textColor: [0, 0, 0], + fontStyle: 'bold', + halign: 'center' + }, + theme: 'plain', + tableWidth: 50, + margin: { left: 230 } + }) + + doc + .save('Laporan Daftar Keluhan Selesai di Contact Center.pdf', { returnPromise: true }) + .then(() => { + console.log('pdf berhasil disimpan') + }) } else { const workbook = new Workbook() const worksheet = workbook.addWorksheet('Daftar Keluhan Selesai di Contact Center') @@ -312,11 +435,17 @@ const { onResult, onError, loading, refetch } = useQuery( } ) const filters = ref() +const reportMeta = ref({ + uid: { id: 0, name: 'Semua Unit Induk Distribusi/Wilayah' }, + up3: { id: 0, name: 'Semua Unit Pelaksanaan Pelayanan Pelanggan' }, + ulp: { id: 0, name: 'Semua Unit Layanan Pelanggan' }, + periode: '' +}) const filterData = (params: any) => { const dateValue = params.periode.split(' s/d ') const { ulp, uid, up3 } = params - const media = params.media ? params.media.id : '' + refetch({ dateFrom: dateValue[0] ? dateValue[0].split('-').reverse().join('-') @@ -333,10 +462,13 @@ const filterData = (params: any) => { if (queryResult.data != undefined) { data.value = queryResult.data.daftarKeluhanDiselesaikanCC123 } + + reportMeta.value = filters.value console.log(queryResult.data) console.log(queryResult.loading) console.log(queryResult.networkStatus) }) + onError((error) => { console.log(error) })