import { exportDataGrid as exportToExcel } from 'devextreme/excel_exporter' import { Document, AlignmentType, Packer, Paragraph, Table, TableCell, TableRow, VerticalAlign, TextRun, WidthType, PageOrientation } from 'docx' import { saveAs } from 'file-saver' import { jsPDF } from 'jspdf' import autoTable from 'jspdf-autotable' import { Workbook } from 'exceljs' import { formatWaktu } from '@/components/Form/FiltersType/reference' import { setHeaderStyle } from '@/report/utils/xlsx' import { formatNumber, formatPercentage } from '@/utils/numbers' const reportName = 'Rekapitulasi Keluhan Per Unit' const fontSize = 5 const detailFontSize = 3 const groupingData = (data: any) => { const groupedData: any = {} data.forEach((item: any) => { const { nama_up3 } = item if (!groupedData[nama_up3]) { groupedData[nama_up3] = [] } groupedData[nama_up3].push(item) }) return groupedData } const formatData = (rawData: any) => { const data = groupingData(rawData) const formattedData: any = [] const grandTotal: any = { total_laporan: 0, total_laporan_sudah_selesai: 0, total_laporan_belum_selesai: 0, total_response_time_total: 0, total_response_time_rata_rata: [], total_response_time_max: [], total_response_time_min: [], total_response_time_lebih_sla: 0, total_response_time_kurang_sla: 0, total_recovery_time_total: 0, total_recovery_time_rata_rata: [], total_recovery_time_max: [], total_recovery_time_min: [], total_recovery_time_lebih_sla: 0, total_recovery_time_kurang_sla: 0 } for (const key of Object.keys(data)) { const nama_up3 = key const total: any = { total_laporan: 0, total_laporan_sudah_selesai: 0, total_laporan_belum_selesai: 0, total_response_time_total: 0, total_response_time_rata_rata: [], total_response_time_max: [], total_response_time_min: [], total_response_time_lebih_sla: 0, total_response_time_kurang_sla: 0, total_recovery_time_total: 0, total_recovery_time_rata_rata: [], total_recovery_time_max: [], total_recovery_time_min: [], total_recovery_time_lebih_sla: 0, total_recovery_time_kurang_sla: 0 } formattedData.push([ { content: nama_up3, colSpan: 19, styles: { fontStyle: 'bold' } } ]) for (let i = 0; i < data[nama_up3].length; i++) { formattedData.push([ { content: i + 1, styles: { halign: 'right' } }, data[nama_up3][i].nama_ulp, formatNumber(data[nama_up3][i].total), formatNumber(data[nama_up3][i].total_selesai), formatPercentage( !data[nama_up3][i].total || !data[nama_up3][i].total_selesai ? '0%' : (data[nama_up3][i].total_selesai / data[nama_up3][i].total) * 100 ), formatNumber(data[nama_up3][i].total_inproses), formatPercentage( !data[nama_up3][i].total_inproses || !data[nama_up3][i].total ? '0%' : (data[nama_up3][i].total_inproses / data[nama_up3][i].total) * 100 ), formatNumber(data[nama_up3][i].total_durasi_response), formatNumber(data[nama_up3][i].avg_durasi_response), formatWaktu(data[nama_up3][i].max_durasi_response), formatWaktu(data[nama_up3][i].min_durasi_response), formatNumber(data[nama_up3][i].total_diatas_sla_response), formatNumber(data[nama_up3][i].total_dibawah_sla_response), formatNumber(data[nama_up3][i].total_durasi_recovery), formatNumber(data[nama_up3][i].avg_durasi_recovery), formatWaktu(data[nama_up3][i].max_durasi_recovery), formatWaktu(data[nama_up3][i].min_durasi_recovery), formatNumber(data[nama_up3][i].total_diatas_sla_recovery), formatNumber(data[nama_up3][i].total_dibawah_sla_recovery) ]) total.total_laporan += data[nama_up3][i].total total.total_laporan_sudah_selesai += data[nama_up3][i].total_selesai total.total_laporan_belum_selesai += data[nama_up3][i].total_inproses total.total_response_time_total += data[nama_up3][i].total_durasi_response total.total_response_time_rata_rata.push(data[nama_up3][i].avg_durasi_response) total.total_response_time_max.push(data[nama_up3][i].max_durasi_response) total.total_response_time_min.push(data[nama_up3][i].min_durasi_response) total.total_response_time_lebih_sla += data[nama_up3][i].total_diatas_sla_response total.total_response_time_kurang_sla += data[nama_up3][i].total_dibawah_sla_response total.total_recovery_time_total += data[nama_up3][i].total_durasi_recovery total.total_recovery_time_rata_rata.push(data[nama_up3][i].avg_durasi_recovery) total.total_recovery_time_max.push(data[nama_up3][i].max_durasi_recovery) total.total_recovery_time_min.push(data[nama_up3][i].min_durasi_recovery) total.total_recovery_time_lebih_sla += data[nama_up3][i].total_diatas_sla_recovery total.total_recovery_time_kurang_sla += data[nama_up3][i].total_dibawah_sla_recovery grandTotal.total_laporan += data[nama_up3][i].total grandTotal.total_laporan_sudah_selesai += data[nama_up3][i].total_selesai grandTotal.total_laporan_belum_selesai += data[nama_up3][i].total_inproses grandTotal.total_response_time_total += data[nama_up3][i].total_durasi_response grandTotal.total_response_time_rata_rata.push(data[nama_up3][i].avg_durasi_response) grandTotal.total_response_time_max.push(data[nama_up3][i].max_durasi_response) grandTotal.total_response_time_min.push(data[nama_up3][i].min_durasi_response) grandTotal.total_response_time_lebih_sla += data[nama_up3][i].total_diatas_sla_response grandTotal.total_response_time_kurang_sla += data[nama_up3][i].total_dibawah_sla_response grandTotal.total_recovery_time_total += data[nama_up3][i].total_durasi_recovery grandTotal.total_recovery_time_rata_rata.push(data[nama_up3][i].avg_durasi_recovery) grandTotal.total_recovery_time_max.push(data[nama_up3][i].max_durasi_recovery) grandTotal.total_recovery_time_min.push(data[nama_up3][i].min_durasi_recovery) grandTotal.total_recovery_time_lebih_sla += data[nama_up3][i].total_diatas_sla_recovery grandTotal.total_recovery_time_kurang_sla += data[nama_up3][i].total_dibawah_sla_recovery } formattedData.push([ { content: 'TOTAL', colSpan: 2, styles: { fontStyle: 'bold' } }, formatNumber(total.total_laporan), formatNumber(total.total_laporan_sudah_selesai), formatPercentage( !total.total_laporan_sudah_selesai || !total.total_laporan ? '0%' : (total.total_laporan_sudah_selesai / total.total_laporan) * 100 ), formatNumber(total.total_laporan_belum_selesai), formatPercentage( !total.total_laporan_belum_selesai || !total.total_laporan ? '0%' : (total.total_laporan_belum_selesai / total.total_laporan) * 100 ), formatNumber(total.total_response_time_total), formatNumber( total.total_response_time_rata_rata.length ? total.total_response_time_rata_rata.reduce((a: any, b: any) => a + b) / total.total_response_time_rata_rata.length : 0 ), formatWaktu(Math.max(...total.total_response_time_max)), formatWaktu(Math.min(...total.total_response_time_min)), formatNumber(total.total_response_time_lebih_sla), formatNumber(total.total_response_time_kurang_sla), formatNumber(total.total_recovery_time_total), formatNumber( total.total_recovery_time_rata_rata.length ? total.total_recovery_time_rata_rata.reduce((a: any, b: any) => a + b) / total.total_recovery_time_rata_rata.length : 0 ), formatWaktu(Math.max(...total.total_recovery_time_max)), formatWaktu(Math.min(...total.total_recovery_time_min)), formatNumber(total.total_recovery_time_lebih_sla), formatNumber(total.total_recovery_time_kurang_sla) ]) } formattedData.push([ { content: 'GRAND TOTAL', colSpan: 2, styles: { fontStyle: 'bold' } }, formatNumber(grandTotal.total_laporan), formatNumber(grandTotal.total_laporan_sudah_selesai), formatPercentage( !grandTotal.total_laporan || !grandTotal.total_laporan_sudah_selesai ? '0%' : (grandTotal.total_laporan_sudah_selesai / grandTotal.total_laporan) * 100 ), formatNumber(grandTotal.total_laporan_belum_selesai), formatPercentage( !grandTotal.total_laporan || !grandTotal.total_laporan_belum_selesai ? '0%' : (grandTotal.total_laporan_belum_selesai / grandTotal.total_laporan) * 100 ), formatNumber(grandTotal.total_response_time_total), formatNumber( grandTotal.total_response_time_rata_rata.length ? grandTotal.total_response_time_rata_rata.reduce((a: any, b: any) => a + b) / grandTotal.total_response_time_rata_rata.length : 0 ), formatWaktu(Math.max(...grandTotal.total_response_time_max)), formatWaktu(Math.min(...grandTotal.total_response_time_min)), formatNumber(grandTotal.total_response_time_lebih_sla), formatNumber(grandTotal.total_response_time_kurang_sla), formatNumber(grandTotal.total_recovery_time_total), formatNumber( grandTotal.total_recovery_time_rata_rata.length ? grandTotal.total_recovery_time_rata_rata.reduce((a: any, b: any) => a + b) / grandTotal.total_recovery_time_rata_rata.length : 0 ), formatWaktu(Math.max(...grandTotal.total_recovery_time_max)), formatWaktu(Math.min(...grandTotal.total_recovery_time_min)), formatNumber(grandTotal.total_recovery_time_lebih_sla), formatNumber(grandTotal.total_recovery_time_kurang_sla) ]) return formattedData } const formatMetaData = (reportMeta: any) => { const periode = reportMeta.periode ? reportMeta.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('id-ID', { month: 'long' })}-${dateFrom.getFullYear()}` dateToFormat = `${dateTo.getDate()}-${dateTo.toLocaleString('id-ID', { month: 'long' })}-${dateTo.getFullYear()}` dayTo = dateTo.toLocaleString('id-ID', { weekday: 'long' }) } return { dateFromFormat, dateToFormat, dayTo } } const exportToPDF = (reportMeta: any, rawData: any, preview: boolean = false) => { const data = formatData(rawData) const meta = formatMetaData(reportMeta) const doc = new jsPDF({ orientation: 'landscape' }) autoTable(doc, { head: [ ['PT. PLN(Persero)', '', ''], [ { content: 'UNIT INDUK', styles: { cellWidth: 40 } }, { content: ':', styles: { cellWidth: 1 } }, reportMeta.uid ? reportMeta.uid.name.toUpperCase() : 'Semua Unit Induk Distribusi/Wilayah'.toUpperCase() ], [ 'UNIT PELAKSANA PELAYANAN PELANGGAN', ':', reportMeta.up3 ? reportMeta.up3.name.toUpperCase() : 'Semua Unit Pelaksanaan Pelayanan Pelanggan'.toUpperCase() ] ], styles: { fontSize, cellPadding: 0.1, textColor: [0, 0, 0], fontStyle: 'bold' }, theme: 'plain', startY: 10 }) autoTable(doc, { head: [ [`${reportName}`.toUpperCase()], [`PERIODE TANGGAL : ${meta.dateFromFormat} SD TGL ${meta.dateToFormat}`] ], styles: { fontSize, cellPadding: 0.1, textColor: [0, 0, 0], fontStyle: 'bold', halign: 'center' }, theme: 'plain', startY: 23 }) autoTable(doc, { head: [ [ { content: 'No', rowSpan: 3 }, { content: 'Unit', rowSpan: 3 }, { content: 'Laporan', colSpan: 5 }, { content: 'Response Time', colSpan: 6 }, { content: 'Penyelesaian', colSpan: 6 } ], [ { content: 'Total', rowSpan: 2 }, { content: 'Sudah Selesai', colSpan: 2 }, { content: 'Belum Selesai', colSpan: 2 }, { content: 'Hari', colSpan: 4 }, { content: 'Laporan', colSpan: 2 }, { content: 'Hari', colSpan: 4 }, { content: 'Laporan', colSpan: 2 } ], [ 'Jml', '%', 'Jml', '%', 'Total', 'Rata-Rata', 'Max', 'Min', '>Sla', 'Sla', ' { console.log('pdf berhasil disimpan') }) } } const exportDetailToPDF = (reportMeta: any, rawData: any) => { const meta = formatMetaData(reportMeta) const doc = new jsPDF({ orientation: 'landscape' }) autoTable(doc, { head: [['PT. PLN(Persero)']], styles: { fontSize: detailFontSize, cellPadding: 0.1, textColor: [0, 0, 0], fontStyle: 'bold' }, theme: 'plain', startY: 10, margin: 5 }) autoTable(doc, { head: [ [`Daftar Detail ${reportName}`.toUpperCase()], [`PERIODE TANGGAL : ${meta.dateFromFormat} SD TGL ${meta.dateToFormat}`] ], styles: { fontSize: detailFontSize, cellPadding: 0.1, textColor: [0, 0, 0], fontStyle: 'bold', halign: 'center' }, theme: 'plain', startY: 18, margin: 5 }) autoTable(doc, { head: [ [ 'No', 'No Laporan', 'Tgl Lapor', 'Dalam Proses Bidang', 'Selesai Bidang Unit', 'Durasi Response Time', 'Durasi Recovery Time', 'Status', 'IDPEL/NO METER', 'Nama Pelapor', 'Alamat Pelapor', 'No Telp Pelapor', 'Keterangan Pelapor', 'Rayon', 'Uraian', 'Response Pelanggan' ] ], body: rawData.map((item: any, i: any) => [ { content: i + 1, styles: { halign: 'right' } }, item.no_laporan, item.waktu_lapor, item.waktu_response, item.waktu_recovery, item.durasi_response_time, 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, item.uraian, item.respon_pelanggan ]), styles: { fontSize: detailFontSize, 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', valign: 'middle' }, 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: 24, margin: 5 }) autoTable(doc, { head: [ [`${meta.dayTo}, ${meta.dateToFormat}`], [ { content: '(.........................................)', styles: { minCellHeight: 8, valign: 'bottom' } } ] ], styles: { fontSize: detailFontSize, cellPadding: 0.1, textColor: [0, 0, 0], fontStyle: 'bold', halign: 'center' }, theme: 'plain', tableWidth: 50, margin: { left: 230 } }) doc.save(`Laporan Detail ${reportName}.pdf`, { returnPromise: true }).then(() => { console.log('pdf berhasil disimpan') }) } const exportToXLSX = (reportMeta: any, e: any) => { const meta = formatMetaData(reportMeta) const workbook = new Workbook() const worksheet = workbook.addWorksheet(`${reportName}`) setHeaderStyle(worksheet, 1, 1, 'PT. PLN(Persero)') setHeaderStyle( worksheet, 2, 1, `UNIT INDUK : ${ reportMeta.uid ? reportMeta.uid.name.toUpperCase() : 'Semua Unit Induk Distribusi/Wilayah'.toUpperCase() }` ) setHeaderStyle( worksheet, 3, 1, `UNIT PELAKSANA PELAYANAN PELANGGAN : ${ reportMeta.up3 ? reportMeta.up3.name.toUpperCase() : 'Semua Unit Pelaksanaan Pelayanan Pelanggan'.toUpperCase() }` ) setHeaderStyle(worksheet, 5, 1, `${reportName}`.toUpperCase(), true) setHeaderStyle( worksheet, 6, 1, `PERIODE TANGGAL : ${meta.dateFromFormat} SD TGL ${meta.dateToFormat}`, true ) worksheet.mergeCells('A1:S1') worksheet.mergeCells('A2:S2') worksheet.mergeCells('A3:S3') worksheet.mergeCells('A5:S5') worksheet.mergeCells('A6:S6') exportToExcel({ component: e.component, worksheet, autoFilterEnabled: true, topLeftCell: { row: 8, column: 1 }, loadPanel: { enabled: false } }).then(() => { workbook.xlsx.writeBuffer().then((buffer: any) => { saveAs(new Blob([buffer], { type: 'application/octet-stream' }), `Laporan ${reportName}.xlsx`) }) }) e.cancel = true } const exportDetailToXLSX = (reportMeta: any, e: any) => { const meta = formatMetaData(reportMeta) const workbook = new Workbook() const worksheet = workbook.addWorksheet(`Detail ${reportName}`) setHeaderStyle(worksheet, 1, 1, 'PT. PLN(Persero)') setHeaderStyle(worksheet, 3, 1, `Daftar Detail ${reportName}`.toUpperCase(), true) setHeaderStyle( worksheet, 4, 1, `PERIODE TANGGAL : ${meta.dateFromFormat} SD TGL ${meta.dateToFormat}`, true ) worksheet.mergeCells('A1:P1') worksheet.mergeCells('A3:P3') worksheet.mergeCells('A4:P4') exportToExcel({ component: e.component, worksheet, autoFilterEnabled: true, topLeftCell: { row: 6, column: 1 }, loadPanel: { enabled: false } }).then(() => { workbook.xlsx.writeBuffer().then((buffer: any) => { saveAs( new Blob([buffer], { type: 'application/octet-stream' }), `Laporan Detail ${reportName}.xlsx` ) }) }) e.cancel = true } export { exportToPDF, exportToXLSX, exportDetailToPDF, exportDetailToXLSX }