feat: create pdf, xlsx report in anomali

This commit is contained in:
kur0nek-o
2024-04-04 14:09:47 +07:00
parent f2259e7f2c
commit c104c1183b
15 changed files with 2517 additions and 174 deletions

View File

@ -17,7 +17,7 @@
@update:data-sub="dataSub = $event"
@update:loading-sub-data="loadingSubData = $event"
/>
<Anomali_LAPPGP_LPP :data="dataSub" />
<Anomali_LAPPGP_LPP :data="dataSub" :filters="filters" />
</template>
<script setup lang="ts">

View File

@ -216,16 +216,14 @@ import {
DxSearchPanel,
DxSelection
} from 'devextreme-vue/data-grid'
import { jsPDF } from 'jspdf'
import { exportDataGrid as exportToPdf } from 'devextreme/pdf_exporter'
import { exportDataGrid as exportToExcel } from 'devextreme/excel_exporter'
import { saveAs } from 'file-saver'
import { Workbook } from 'exceljs'
import { computed, ref } from 'vue'
import { formatNumber, formatPercentage, isNumber } from '@/utils/numbers'
import { formatWaktu } from '@/components/Form/FiltersType/reference'
import { exportToPDF, exportToXLSX } from '@/report/Anomali/Gangguan/Anomali_LAPPGP_LPP'
const props = defineProps({
data: Array as () => any[]
data: Array as () => any[],
filters: Object as () => any
})
const data = computed(() => props.data)
const dataSub = ref([])
@ -233,6 +231,7 @@ const dataSelected = ref({})
const dataSubSelected = ref({})
const dialogDetail = ref(false)
const dataGridRef = ref<DxDataGrid | null>(null)
const reportMeta = ref<any>(computed(() => props.filters))
const clearSelection = () => {
const dataGrid = dataGridRef.value!.instance!
dataGrid.clearSelection()
@ -247,30 +246,10 @@ const closeDialog = () => {
const onExporting = (e: any) => {
if (e.format === 'pdf') {
const doc = new jsPDF()
exportToPdf({
jsPDFDocument: doc,
component: e.component,
indent: 5
}).then(() => {
doc.save(`.pdf`)
})
exportToPDF(reportMeta.value, data.value)
} else if (e.format === 'xlsx') {
exportToXLSX(reportMeta.value, e)
} else {
const workbook = new Workbook()
const worksheet = workbook.addWorksheet('Employees')
exportToExcel({
component: e.component,
worksheet,
autoFilterEnabled: true
}).then(() => {
workbook.xlsx.writeBuffer().then((buffer: any) => {
saveAs(new Blob([buffer], { type: 'application/octet-stream' }), 'DataGrid.xlsx')
})
})
e.cancel = true
}
}

View File

@ -435,6 +435,8 @@
/>
</DxSummary>
</DxDataGrid>
<BufferDialog v-if="loading" />
</template>
<script setup lang="ts">
@ -453,14 +455,11 @@ import {
DxSelection,
DxSummary
} from 'devextreme-vue/data-grid'
import { jsPDF } from 'jspdf'
import { exportDataGrid as exportToPdf } from 'devextreme/pdf_exporter'
import { exportDataGrid as exportToExcel } from 'devextreme/excel_exporter'
import { saveAs } from 'file-saver'
import { Workbook } from 'exceljs'
import { formatNumber, formatPercentage, isNumber } from '@/utils/numbers'
import { formatWaktu } from '@/components/Form/FiltersType/reference'
import { queries, requestGraphQl } from '@/utils/api/api.graphql'
import { exportToPDF, exportToXLSX } from '@/report/Anomali/Gangguan/Anomali_LAPPGP_LPT'
import BufferDialog from '@/components/Dialogs/BufferDialog.vue'
const position = { of: '#data' }
const showIndicator = ref(true)
@ -485,6 +484,7 @@ const loadingSubData = ref(false)
const agreeToShowDialog = ref(false)
const mediaSelected = ref<any>(null)
const markingSelected = ref<any>(null)
const reportMeta = ref<any>(computed(() => props.filters))
const emit = defineEmits(['update:dataSub', 'update:loadingSubData'])
@ -580,30 +580,10 @@ const showDetail = () => {
const onExporting = (e: any) => {
if (e.format === 'pdf') {
const doc = new jsPDF()
exportToPdf({
jsPDFDocument: doc,
component: e.component,
indent: 5
}).then(() => {
doc.save(`.pdf`)
})
exportToPDF(reportMeta.value, data.value)
} else if (e.format === 'xlsx') {
exportToXLSX(reportMeta.value, e)
} else {
const workbook = new Workbook()
const worksheet = workbook.addWorksheet('Employees')
exportToExcel({
component: e.component,
worksheet,
autoFilterEnabled: true
}).then(() => {
workbook.xlsx.writeBuffer().then((buffer: any) => {
saveAs(new Blob([buffer], { type: 'application/octet-stream' }), 'DataGrid.xlsx')
})
})
e.cancel = true
}
}

View File

@ -11,7 +11,7 @@
</Filters>
<Anomali_LAPPGU_LPT :data="data" :loading="loadingData" :filters="filters" />
<Anomali_LAPPGU_LPP :data="dataSecond" />
<Anomali_LAPPGU_LPP :data="dataSecond" :filters="filters" />
</template>
<script setup lang="ts">

View File

@ -123,17 +123,16 @@ import {
DxSearchPanel,
DxSelection
} from 'devextreme-vue/data-grid'
import { jsPDF } from 'jspdf'
import { exportDataGrid as exportToPdf } from 'devextreme/pdf_exporter'
import { exportDataGrid as exportToExcel } from 'devextreme/excel_exporter'
import { saveAs } from 'file-saver'
import { Workbook } from 'exceljs'
import { computed, ref } from 'vue'
import { formatNumber, formatPercentage, isNumber } from '@/utils/numbers'
import { formatWaktu } from '@/components/Form/FiltersType/reference'
import { exportToPDF, exportToXLSX } from '@/report/Anomali/Gangguan/Anomali_LAPPGU_LPP'
const props = defineProps({
data: Array as () => any[]
data: Array as () => any[],
filters: Object as () => any
})
const reportMeta = ref<any>(computed(() => props.filters))
const data = computed(() => props.data)
const dataSub = ref<any[]>([])
const dataSelected = ref<any>({})
@ -154,30 +153,10 @@ const closeDialog = () => {
const onExporting = (e: any) => {
if (e.format === 'pdf') {
const doc = new jsPDF()
exportToPdf({
jsPDFDocument: doc,
component: e.component,
indent: 5
}).then(() => {
doc.save(`.pdf`)
})
exportToPDF(reportMeta.value, data.value)
} else if (e.format === 'xlsx') {
exportToXLSX(reportMeta.value, e)
} else {
const workbook = new Workbook()
const worksheet = workbook.addWorksheet('Employees')
exportToExcel({
component: e.component,
worksheet,
autoFilterEnabled: true
}).then(() => {
workbook.xlsx.writeBuffer().then((buffer: any) => {
saveAs(new Blob([buffer], { type: 'application/octet-stream' }), 'DataGrid.xlsx')
})
})
e.cancel = true
}
}

View File

@ -2,6 +2,7 @@
<div class="mt-4 lg:mt-6 max-w-7xl">
<h1 class="text-xl font-medium md:text-2xl text-dark">Laporan Pengaduan Total</h1>
</div>
<DxDataGrid
ref="dataGridRef"
:allow-column-reordering="true"
@ -1021,6 +1022,8 @@
</div>
</div>
</DetailDialog>
<BufferDialog v-if="loading || loadingSubData" />
</template>
<script setup lang="ts">
@ -1040,16 +1043,14 @@ import {
DxSelection,
DxSummary
} from 'devextreme-vue/data-grid'
import { jsPDF } from 'jspdf'
import { exportDataGrid as exportToPdf } from 'devextreme/pdf_exporter'
import { exportDataGrid as exportToExcel } from 'devextreme/excel_exporter'
import { saveAs } from 'file-saver'
import { Workbook } from 'exceljs'
import { formatWaktu } from '@/components/Form/FiltersType/reference'
import { formatNumber, formatPercentage, isNumber } from '@/utils/numbers'
import { queries, requestGraphQl } from '@/utils/api/api.graphql'
import InputText from '@/components/InputText.vue'
import DetailDialog from '@/components/Dialogs/DetailDialog.vue'
import { exportToPDF, exportToXLSX } from '@/report/Anomali/Gangguan/Anomali_LAPPGU_LPT'
import BufferDialog from '@/components/Dialogs/BufferDialog.vue'
const position = { of: '#data' }
const showIndicator = ref(true)
const loading = ref(computed(() => props.loading))
@ -1075,6 +1076,7 @@ const loadingSubData = ref(false)
const agreeToShowDialog = ref(false)
const mediaSelected = ref<any>(null)
const markingSelected = ref<any>(null)
const reportMeta = ref<any>(computed(() => props.filters))
const setParameterRequest = (media: any, marking: any) => {
mediaSelected.value = media
@ -1168,30 +1170,10 @@ const showDetail = () => {
const onExporting = (e: any) => {
if (e.format === 'pdf') {
const doc = new jsPDF()
exportToPdf({
jsPDFDocument: doc,
component: e.component,
indent: 5
}).then(() => {
doc.save(`.pdf`)
})
exportToPDF(reportMeta.value, data.value)
} else if (e.format === 'xlsx') {
exportToXLSX(reportMeta.value, e)
} else {
const workbook = new Workbook()
const worksheet = workbook.addWorksheet('Employees')
exportToExcel({
component: e.component,
worksheet,
autoFilterEnabled: true
}).then(() => {
workbook.xlsx.writeBuffer().then((buffer: any) => {
saveAs(new Blob([buffer], { type: 'application/octet-stream' }), 'DataGrid.xlsx')
})
})
e.cancel = true
}
}

View File

@ -11,7 +11,7 @@
</Filters>
<Anomali_LAPPKU_LPT :data="data" :loading="loadingData" :filters="filters" />
<Anomali_LAPPKU_LPP :data="dataSecond" />
<Anomali_LAPPKU_LPP :data="dataSecond" :filters="filters" />
</template>
<script setup lang="ts">

View File

@ -124,20 +124,18 @@ import {
DxSearchPanel,
DxSelection
} from 'devextreme-vue/data-grid'
import { jsPDF } from 'jspdf'
import { exportDataGrid as exportToPdf } from 'devextreme/pdf_exporter'
import { exportDataGrid as exportToExcel } from 'devextreme/excel_exporter'
import { saveAs } from 'file-saver'
import { Workbook } from 'exceljs'
import { computed, ref } from 'vue'
import { formatNumber, formatPercentage, isNumber } from '@/utils/numbers'
import { formatWaktu } from '@/components/Form/FiltersType/reference'
import { exportToPDF, exportToXLSX } from '@/report/Anomali/Keluhan/Anomali_LAPPKU_LPP'
const position = { of: '#data' }
const showIndicator = ref(true)
const shading = ref(true)
const showPane = ref(true)
const props = defineProps({
data: Array as () => any[],
filters: Object as () => any,
loading: {
type: Boolean,
default: false
@ -145,36 +143,16 @@ const props = defineProps({
})
const data = computed(() => props.data)
const loading = ref(false)
const reportMeta = ref<any>(computed(() => props.filters))
const onExporting = (e: any) => {
if (e.format === 'pdf') {
const doc = new jsPDF()
exportToPdf({
jsPDFDocument: doc,
component: e.component,
indent: 5
}).then(() => {
doc.save(`.pdf`)
})
exportToPDF(reportMeta.value, data.value, true)
} else if (e.format === 'xlsx') {
exportToXLSX(reportMeta.value, e)
} else {
const workbook = new Workbook()
const worksheet = workbook.addWorksheet('Employees')
exportToExcel({
component: e.component,
worksheet,
autoFilterEnabled: true
}).then(() => {
workbook.xlsx.writeBuffer().then((buffer: any) => {
saveAs(new Blob([buffer], { type: 'application/octet-stream' }), 'DataGrid.xlsx')
})
})
e.cancel = true
}
}
const dataGridRef = ref<DxDataGrid | null>(null)
const clearSelection = () => {
const dataGrid = dataGridRef.value!.instance!

View File

@ -728,6 +728,8 @@
</div>
</div>
</DetailDialog>
<BufferDialog v-if="loading" />
</template>
<script setup lang="ts">
@ -747,16 +749,14 @@ import {
DxSelection,
DxSummary
} from 'devextreme-vue/data-grid'
import { jsPDF } from 'jspdf'
import { exportDataGrid as exportToPdf } from 'devextreme/pdf_exporter'
import { exportDataGrid as exportToExcel } from 'devextreme/excel_exporter'
import { saveAs } from 'file-saver'
import { Workbook } from 'exceljs'
import { formatNumber, formatPercentage, isNumber } from '@/utils/numbers'
import { formatWaktu } from '@/components/Form/FiltersType/reference'
import { queries, requestGraphQl } from '@/utils/api/api.graphql'
import DetailDialog from '@/components/Dialogs/DetailDialog.vue'
import InputText from '@/components/InputText.vue'
import { exportToPDF, exportToXLSX } from '@/report/Anomali/Keluhan/Anomali_LAPPKU_LPT'
import BufferDialog from '@/components/Dialogs/BufferDialog.vue'
const position = { of: '#data' }
const showIndicator = ref(true)
const shading = ref(true)
@ -780,6 +780,7 @@ const loadingData = ref(false)
const loadingSubData = ref(false)
const agreeToShowDialog = ref(false)
const mediaSelected = ref<any>(null)
const reportMeta = ref<any>(computed(() => props.filters))
const setParameterRequest = (media: any) => {
mediaSelected.value = media
@ -855,30 +856,10 @@ const getDetail = async () => {
const onExporting = (e: any) => {
if (e.format === 'pdf') {
const doc = new jsPDF()
exportToPdf({
jsPDFDocument: doc,
component: e.component,
indent: 5
}).then(() => {
doc.save(`.pdf`)
})
exportToPDF(reportMeta.value, data.value)
} else if (e.format === 'xlsx') {
exportToXLSX(reportMeta.value, e)
} else {
const workbook = new Workbook()
const worksheet = workbook.addWorksheet('Employees')
exportToExcel({
component: e.component,
worksheet,
autoFilterEnabled: true
}).then(() => {
workbook.xlsx.writeBuffer().then((buffer: any) => {
saveAs(new Blob([buffer], { type: 'application/octet-stream' }), 'DataGrid.xlsx')
})
})
e.cancel = true
}
}

View File

@ -0,0 +1,325 @@
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 { setHeaderStyle } from '@/report/utils/xlsx'
import { formatNumber, formatPercentage } from '@/utils/numbers'
const reportName = 'Laporan Anomali Penanganan Pengaduan Gangguan Petugas'
const fontSize = 5
const formatData = (rawData: any) => {
const formattedData: any = []
const total: any = {
wo_total: 0,
anomali_pln_mobile_marking: 0,
anomali_cc123_marking: 0
// total_anomali_marking: 0
// persen_anomali_pln_mobile_marking: 0
// persen_anomali_cc123_marking
// persen_anomali_marking
}
rawData.forEach((item: any) => {
total.wo_total += item.wo_total
total.anomali_pln_mobile_marking += item.anomali_pln_mobile_marking
total.anomali_cc123_marking += item.anomali_cc123_marking
})
const total_anomali_marking = total.anomali_pln_mobile_marking + total.anomali_cc123_marking
const persen_anomali_pln_mobile_marking = total.anomali_pln_mobile_marking / total.wo_total
const persen_anomali_cc123_marking = total.anomali_cc123_marking / total.wo_total
const persen_anomali_marking = persen_anomali_pln_mobile_marking + persen_anomali_cc123_marking
formattedData.push([
{
content: 'Semua Unit',
colSpan: 2
},
formatNumber(total.wo_total),
formatNumber(total.anomali_pln_mobile_marking),
formatNumber(total.anomali_cc123_marking),
formatNumber(total_anomali_marking),
formatPercentage(
!persen_anomali_pln_mobile_marking ? 0 : persen_anomali_pln_mobile_marking * 100
),
formatPercentage(!persen_anomali_cc123_marking ? 0 : persen_anomali_cc123_marking * 100),
formatPercentage(!persen_anomali_marking ? 0 : persen_anomali_marking * 100)
])
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()
],
[
'UNIT LAYANAN PELANGGAN',
':',
reportMeta.ulp
? reportMeta.ulp.name.toUpperCase()
: 'Semua Unit Layanan Pelanggan'.toUpperCase()
],
['JENIS LAPORAN', ':', reportMeta.jenisLaporan.name.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: 25
})
autoTable(doc, {
head: [
[
{
content: 'Nama Unit',
rowSpan: 3
},
{
content: 'Nama Petugas',
rowSpan: 3
},
'Total WO',
{
content: 'Total Pengaduan Yang Diselesaikan Secara Anomali',
colSpan: 3
},
{
content: '% Pengaduan Diselesaikan Secara Anomali',
colSpan: 3
}
],
[
'(PLN Mobile, CC123, DLL)',
'PLN Mobile',
'CC 123',
'Total',
'PLN Mobile',
'CC 123',
'Total'
],
['a', 'b', 'c', 'd=b+c', 'e=b/a', 'f=c/a', 'g=e+f']
],
body: data,
styles: {
fontSize,
cellPadding: 1,
lineColor: [0, 0, 0],
lineWidth: 0.1,
cellWidth: 'auto'
},
rowPageBreak: 'auto',
headStyles: {
fillColor: [192, 192, 192],
textColor: [0, 0, 0],
fontStyle: 'bold',
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()
})
}
if (data.cell.text[0] === 'TOTAL') {
for (const key in data.row.cells) {
data.row.cells[key].styles.fillColor = [192, 192, 192]
data.row.cells[key].styles.fontStyle = 'bold'
}
}
},
startY: 35
})
autoTable(doc, {
head: [
[`${meta.dayTo}, ${meta.dateToFormat}`],
[
{
content: '(.........................................)',
styles: { minCellHeight: 8, valign: 'bottom' }
}
]
],
styles: {
fontSize,
cellPadding: 0.1,
textColor: [0, 0, 0],
fontStyle: 'bold',
halign: 'center'
},
theme: 'plain',
tableWidth: 50,
margin: { left: 230 }
})
if (preview) {
doc.setProperties({
title: `${reportName}`
})
window.open(doc.output('bloburl'))
} else {
doc.save(`Laporan ${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,
4,
1,
`UNIT LAYANAN PELANGGAN : ${
reportMeta.ulp
? reportMeta.ulp.name.toUpperCase()
: 'Semua Unit Layanan Pelanggan'.toUpperCase()
}`
)
setHeaderStyle(worksheet, 5, 1, `JENIS LAPORAN : ${reportMeta.jenisLaporan.name.toUpperCase()}`)
setHeaderStyle(worksheet, 7, 1, `${reportName}`.toUpperCase(), true)
setHeaderStyle(
worksheet,
8,
1,
`PERIODE TANGGAL : ${meta.dateFromFormat} SD TGL ${meta.dateToFormat}`,
true
)
worksheet.mergeCells('A1:I1')
worksheet.mergeCells('A2:I2')
worksheet.mergeCells('A3:I3')
worksheet.mergeCells('A4:I4')
worksheet.mergeCells('A5:I5')
worksheet.mergeCells('A7:I7')
worksheet.mergeCells('A8:I8')
exportToExcel({
component: e.component,
worksheet,
autoFilterEnabled: true,
topLeftCell: { row: 10, 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
}
export { exportToPDF, exportToXLSX }

View File

@ -0,0 +1,420 @@
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 = 'Laporan Anomali Penanganan Pengaduan Gangguan Petugas'
const fontSize = 5
const formatData = (rawData: any) => {
const formattedData: any = []
const total: any = {
total_petugas: 0,
anomali_pln_mobile_marking: 0,
anomali_pln_mobile_non_marking: 0,
anomali_cc123_marking: 0,
anomali_cc123_non_marking: 0
// total_anomali_marking: 0,
// total_anomali_non_marking: 0,
// persen_anomali_pln_mobile_marking
// persen_anomali_pln_mobile_non_marking
// persen_anomali_cc123_marking
// persen_anomali_cc123_non_marking
// persen_anomali_marking
// persen_anomali_non_marking
}
rawData.forEach((item: any) => {
total.total_petugas += item.total_petugas
total.anomali_pln_mobile_marking += item.anomali_pln_mobile_marking
total.anomali_pln_mobile_non_marking += item.anomali_pln_mobile_non_marking
total.anomali_cc123_marking += item.anomali_cc123_marking
total.anomali_cc123_non_marking += item.anomali_cc123_non_marking
})
const total_anomali_marking = total.anomali_pln_mobile_marking + total.anomali_cc123_marking
const total_anomali_non_marking =
total.anomali_pln_mobile_non_marking + total.anomali_cc123_non_marking
const persen_anomali_pln_mobile_marking = total.anomali_pln_mobile_marking / total.total_petugas
const persen_anomali_pln_mobile_non_marking =
total.anomali_pln_mobile_non_marking / total.total_petugas
const persen_anomali_cc123_marking = total.anomali_cc123_marking / total.total_petugas
const persen_anomali_cc123_non_marking = total.anomali_cc123_non_marking / total.total_petugas
const persen_anomali_marking = persen_anomali_pln_mobile_marking + persen_anomali_cc123_marking
const persen_anomali_non_marking =
persen_anomali_pln_mobile_non_marking + persen_anomali_cc123_non_marking
formattedData.push([
'Semua Unit',
formatNumber(total.total_petugas),
formatNumber(total.anomali_pln_mobile_marking),
formatNumber(total.anomali_pln_mobile_non_marking),
formatNumber(total.anomali_cc123_marking),
formatNumber(total.anomali_cc123_non_marking),
formatNumber(total_anomali_marking),
formatNumber(total_anomali_non_marking),
formatPercentage(
!persen_anomali_pln_mobile_marking || !isFinite(persen_anomali_pln_mobile_marking)
? 0
: persen_anomali_pln_mobile_marking * 100
),
formatPercentage(
!persen_anomali_pln_mobile_non_marking || !isFinite(persen_anomali_pln_mobile_non_marking)
? 0
: persen_anomali_pln_mobile_non_marking * 100
),
formatPercentage(
!persen_anomali_cc123_marking || !isFinite(persen_anomali_cc123_marking)
? 0
: persen_anomali_cc123_marking * 100
),
formatPercentage(
!persen_anomali_cc123_non_marking || !isFinite(persen_anomali_cc123_non_marking)
? 0
: persen_anomali_cc123_non_marking * 100
),
formatPercentage(
!persen_anomali_marking || !isFinite(persen_anomali_marking) ? 0 : persen_anomali_marking
),
formatPercentage(
!persen_anomali_non_marking || !isFinite(persen_anomali_non_marking)
? 0
: persen_anomali_non_marking * 100
)
])
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()
],
[
'UNIT LAYANAN PELANGGAN',
':',
reportMeta.ulp
? reportMeta.ulp.name.toUpperCase()
: 'Semua Unit Layanan Pelanggan'.toUpperCase()
],
['JENIS LAPORAN', ':', reportMeta.jenisLaporan.name.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: 25
})
autoTable(doc, {
head: [
[
{
content: 'Nama Unit',
rowSpan: 4
},
'Total Petugas',
{
content: 'Total Petugas Yang Pengaduan Diselesaikan Secara Anomali',
colSpan: 6
},
{
content: '% Petugas Yang Pengaduan Diselesaikan Secara Anomali',
colSpan: 6
}
],
[
{
content: 'a',
rowSpan: 3
},
{
content: 'PLN Mobile',
colSpan: 2
},
{
content: 'CC 123',
colSpan: 2
},
{
content: 'Total',
colSpan: 2
},
{
content: 'PLN Mobile',
colSpan: 2
},
{
content: 'CC 123',
colSpan: 2
},
{
content: 'Total',
colSpan: 2
}
],
[
{
content: 'b',
colSpan: 2
},
{
content: 'c',
colSpan: 2
},
{
content: 'd=b+c',
colSpan: 2
},
{
content: 'e=b/a',
colSpan: 2
},
{
content: 'f=c/a',
colSpan: 2
},
{
content: 'g=e+f',
colSpan: 2
}
],
[
'Marking',
'Non Marking',
'Marking',
'Non Marking',
'Marking',
'Non Marking',
'Marking',
'Non Marking',
'Marking',
'Non Marking',
'Marking',
'Non Marking'
]
],
body: data,
styles: {
fontSize,
cellPadding: 1,
lineColor: [0, 0, 0],
lineWidth: 0.1,
cellWidth: 'auto'
},
rowPageBreak: 'auto',
headStyles: {
fillColor: [192, 192, 192],
textColor: [0, 0, 0],
fontStyle: 'bold',
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()
})
}
if (data.cell.text[0] === 'TOTAL') {
for (const key in data.row.cells) {
data.row.cells[key].styles.fillColor = [192, 192, 192]
data.row.cells[key].styles.fontStyle = 'bold'
}
}
},
startY: 35
})
autoTable(doc, {
head: [
[`${meta.dayTo}, ${meta.dateToFormat}`],
[
{
content: '(.........................................)',
styles: { minCellHeight: 8, valign: 'bottom' }
}
]
],
styles: {
fontSize,
cellPadding: 0.1,
textColor: [0, 0, 0],
fontStyle: 'bold',
halign: 'center'
},
theme: 'plain',
tableWidth: 50,
margin: { left: 230 }
})
if (preview) {
doc.setProperties({
title: `${reportName}`
})
window.open(doc.output('bloburl'))
} else {
doc.save(`Laporan ${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,
4,
1,
`UNIT LAYANAN PELANGGAN : ${
reportMeta.ulp
? reportMeta.ulp.name.toUpperCase()
: 'Semua Unit Layanan Pelanggan'.toUpperCase()
}`
)
setHeaderStyle(worksheet, 5, 1, `JENIS LAPORAN : ${reportMeta.jenisLaporan.name.toUpperCase()}`)
setHeaderStyle(worksheet, 7, 1, `${reportName}`.toUpperCase(), true)
setHeaderStyle(
worksheet,
8,
1,
`PERIODE TANGGAL : ${meta.dateFromFormat} SD TGL ${meta.dateToFormat}`,
true
)
worksheet.mergeCells('A1:N1')
worksheet.mergeCells('A2:N2')
worksheet.mergeCells('A3:N3')
worksheet.mergeCells('A4:N4')
worksheet.mergeCells('A5:N5')
worksheet.mergeCells('A7:N7')
worksheet.mergeCells('A8:N8')
exportToExcel({
component: e.component,
worksheet,
autoFilterEnabled: true,
topLeftCell: { row: 10, 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
}
export { exportToPDF, exportToXLSX }

View File

@ -0,0 +1,292 @@
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 { setHeaderStyle } from '@/report/utils/xlsx'
import { formatNumber, formatPercentage } from '@/utils/numbers'
const reportName = 'Laporan Anomali Penanganan Pengaduan Gangguan Unit'
const fontSize = 5
const formatData = (rawData: any) => {
const formattedData: any = []
const total: any = {
wo_pln_mobile: 0,
total_anomali_marking: 0
// persen_anomali_marking
}
rawData.forEach((item: any) => {
total.wo_pln_mobile += item.wo_pln_mobile
total.total_anomali_marking += item.total_anomali_marking
})
const persen_anomali_marking = (total.total_anomali_marking / total.wo_pln_mobile) * 100
formattedData.push([
'Semua Unit',
formatNumber(total.wo_pln_mobile),
formatNumber(total.total_anomali_marking),
formatPercentage(persen_anomali_marking),
formatPercentage(
!persen_anomali_marking || !isFinite(persen_anomali_marking) ? 0 : persen_anomali_marking
)
])
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()
],
[
'UNIT LAYANAN PELANGGAN',
':',
reportMeta.ulp
? reportMeta.ulp.name.toUpperCase()
: 'Semua Unit Layanan Pelanggan'.toUpperCase()
],
['JENIS LAPORAN', ':', reportMeta.jenisLaporan.name.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: 25
})
autoTable(doc, {
head: [
[
{
content: 'Nama Unit',
rowSpan: 2
},
'Total WO PLN Mobile',
'Total Pengaduan Yang Diselesaikan Secara Anomali',
'% Pengaduan Yang Diselesaikan Secara Anomali'
],
['a', 'b', 'c=b/a']
],
body: data,
styles: {
fontSize,
cellPadding: 1,
lineColor: [0, 0, 0],
lineWidth: 0.1,
cellWidth: 'auto'
},
rowPageBreak: 'auto',
headStyles: {
fillColor: [192, 192, 192],
textColor: [0, 0, 0],
fontStyle: 'bold',
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()
})
}
if (data.cell.text[0] === 'TOTAL') {
for (const key in data.row.cells) {
data.row.cells[key].styles.fillColor = [192, 192, 192]
data.row.cells[key].styles.fontStyle = 'bold'
}
}
},
startY: 35
})
autoTable(doc, {
head: [
[`${meta.dayTo}, ${meta.dateToFormat}`],
[
{
content: '(.........................................)',
styles: { minCellHeight: 8, valign: 'bottom' }
}
]
],
styles: {
fontSize,
cellPadding: 0.1,
textColor: [0, 0, 0],
fontStyle: 'bold',
halign: 'center'
},
theme: 'plain',
tableWidth: 50,
margin: { left: 230 }
})
if (preview) {
doc.setProperties({
title: `${reportName}`
})
window.open(doc.output('bloburl'))
} else {
doc.save(`Laporan ${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,
4,
1,
`UNIT LAYANAN PELANGGAN : ${
reportMeta.ulp
? reportMeta.ulp.name.toUpperCase()
: 'Semua Unit Layanan Pelanggan'.toUpperCase()
}`
)
setHeaderStyle(worksheet, 5, 1, `JENIS LAPORAN : ${reportMeta.jenisLaporan.name.toUpperCase()}`)
setHeaderStyle(worksheet, 7, 1, `${reportName}`.toUpperCase(), true)
setHeaderStyle(
worksheet,
8,
1,
`PERIODE TANGGAL : ${meta.dateFromFormat} SD TGL ${meta.dateToFormat}`,
true
)
worksheet.mergeCells('A1:D1')
worksheet.mergeCells('A2:D2')
worksheet.mergeCells('A3:D3')
worksheet.mergeCells('A4:D4')
worksheet.mergeCells('A5:D5')
worksheet.mergeCells('A7:D7')
worksheet.mergeCells('A8:D8')
exportToExcel({
component: e.component,
worksheet,
autoFilterEnabled: true,
topLeftCell: { row: 10, 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
}
export { exportToPDF, exportToXLSX }

View File

@ -0,0 +1,629 @@
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 = 'Laporan Anomali Penanganan Pengaduan Gangguan Unit'
const fontSize = 5
const detailFontSize = 5
const formatData = (rawData: any) => {
const formattedData: any = []
const total: any = {
wo_cc123: 0,
wo_pln_mobile: 0,
wo_loket: 0,
wo_lainnya: 0,
// wo_total
anomali_pln_mobile_marking: 0,
anomali_pln_mobile_non_marking: 0,
anomali_cc123_marking: 0,
anomali_cc123_non_marking: 0
// total_anomali_marking
// total_anomali_non_marking
// persen_anomali_pln_mobile_marking
// persen_anomali_pln_mobile_non_marking
// persen_anomali_cc123_marking
// persen_anomali_cc123_non_marking
// persen_anomali_marking
// persen_anomali_non_marking
}
rawData.forEach((item: any) => {
total.wo_cc123 += item.wo_cc123
total.wo_pln_mobile += item.wo_pln_mobile
total.wo_loket += item.wo_loket
total.wo_lainnya += item.wo_lainnya
total.anomali_pln_mobile_marking += item.anomali_pln_mobile_marking
total.anomali_pln_mobile_non_marking += item.anomali_pln_mobile_non_marking
total.anomali_cc123_marking += item.anomali_cc123_marking
total.anomali_cc123_non_marking += item.anomali_cc123_non_marking
})
const wo_total = total.wo_cc123 + total.wo_pln_mobile + total.wo_loket + total.wo_lainnya
const total_anomali_marking = total.anomali_pln_mobile_marking + total.anomali_cc123_marking
const total_anomali_non_marking =
total.anomali_pln_mobile_non_marking + total.anomali_cc123_non_marking
const persen_anomali_pln_mobile_marking = total.anomali_pln_mobile_marking / wo_total
const persen_anomali_pln_mobile_non_marking = total.anomali_pln_mobile_non_marking / wo_total
const persen_anomali_cc123_marking = total.anomali_cc123_marking / wo_total
const persen_anomali_cc123_non_marking = total.anomali_cc123_non_marking / wo_total
const persen_anomali_marking = persen_anomali_pln_mobile_marking + persen_anomali_cc123_marking
const persen_anomali_non_marking =
persen_anomali_pln_mobile_non_marking + persen_anomali_cc123_non_marking
formattedData.push([
'Semua Unit',
formatNumber(total.wo_cc123),
formatNumber(total.wo_pln_mobile),
formatNumber(total.wo_loket),
formatNumber(total.wo_lainnya),
formatNumber(wo_total),
formatNumber(total.anomali_pln_mobile_marking),
formatNumber(total.anomali_pln_mobile_non_marking),
formatNumber(total.anomali_cc123_marking),
formatNumber(total.anomali_cc123_non_marking),
formatNumber(total_anomali_marking),
formatNumber(total_anomali_non_marking),
formatPercentage(
!persen_anomali_pln_mobile_marking || !isFinite(persen_anomali_pln_mobile_marking)
? 0
: persen_anomali_pln_mobile_marking * 100
),
formatPercentage(
!persen_anomali_pln_mobile_non_marking || !isFinite(persen_anomali_pln_mobile_non_marking)
? 0
: persen_anomali_pln_mobile_non_marking * 100
),
formatPercentage(
!persen_anomali_cc123_marking || !isFinite(persen_anomali_cc123_marking)
? 0
: persen_anomali_cc123_marking * 100
),
formatPercentage(
!persen_anomali_cc123_non_marking || !isFinite(persen_anomali_cc123_non_marking)
? 0
: persen_anomali_cc123_non_marking * 100
),
formatPercentage(
!persen_anomali_marking || !isFinite(persen_anomali_marking)
? 0
: persen_anomali_marking * 100
),
formatPercentage(
!persen_anomali_non_marking || !isFinite(persen_anomali_non_marking)
? 0
: persen_anomali_non_marking * 100
)
])
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()
],
[
'UNIT LAYANAN PELANGGAN',
':',
reportMeta.ulp
? reportMeta.ulp.name.toUpperCase()
: 'Semua Unit Layanan Pelanggan'.toUpperCase()
],
['JENIS LAPORAN', ':', reportMeta.jenisLaporan.name.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: 25
})
autoTable(doc, {
head: [
[
{
content: 'Nama Unit',
rowSpan: 4
},
{
content: 'Total WO',
colSpan: 5
},
{
content: 'Total Pengaduan Yang Diselesaikan Secara Anomali',
colSpan: 6
},
{
content: '% Pengaduan Yang Diselesaikan Secara Anomali',
colSpan: 6
}
],
[
'CC 123',
'PLN Mobile',
'Loket',
'Lainnya',
'Total',
{
content: 'PLN Mobile',
colSpan: 2
},
{
content: 'CC 123',
colSpan: 2
},
{
content: 'Total',
colSpan: 2
},
{
content: 'PLN Mobile',
colSpan: 2
},
{
content: 'CC 123',
colSpan: 2
},
{
content: 'Total',
colSpan: 2
}
],
[
{
content: 'a',
rowSpan: 2
},
{
content: 'b',
rowSpan: 2
},
{
content: 'c',
rowSpan: 2
},
{
content: 'd',
rowSpan: 2
},
{
content: 'e=a+b+c+d',
rowSpan: 2
},
{
content: 'f',
colSpan: 2
},
{
content: 'g',
colSpan: 2
},
{
content: 'h=f+g',
colSpan: 2
},
{
content: 'i=f/e',
colSpan: 2
},
{
content: 'j=g/e',
colSpan: 2
},
{
content: 'k=i+j',
colSpan: 2
}
],
[
'Marking',
'Non Marking',
'Marking',
'Non Marking',
'Marking',
'Non Marking',
'Marking',
'Non Marking',
'Marking',
'Non Marking',
'Marking',
'Non Marking'
]
],
body: data,
styles: {
fontSize,
cellPadding: 1,
lineColor: [0, 0, 0],
lineWidth: 0.1,
cellWidth: 'auto'
},
rowPageBreak: 'auto',
headStyles: {
fillColor: [192, 192, 192],
textColor: [0, 0, 0],
fontStyle: 'bold',
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()
})
}
if (data.cell.text[0] === 'TOTAL') {
for (const key in data.row.cells) {
data.row.cells[key].styles.fillColor = [192, 192, 192]
data.row.cells[key].styles.fontStyle = 'bold'
}
}
},
startY: 35
})
autoTable(doc, {
head: [
[`${meta.dayTo}, ${meta.dateToFormat}`],
[
{
content: '(.........................................)',
styles: { minCellHeight: 8, valign: 'bottom' }
}
]
],
styles: {
fontSize,
cellPadding: 0.1,
textColor: [0, 0, 0],
fontStyle: 'bold',
halign: 'center'
},
theme: 'plain',
tableWidth: 50,
margin: { left: 230 }
})
if (preview) {
doc.setProperties({
title: `${reportName}`
})
window.open(doc.output('bloburl'))
} else {
doc.save(`Laporan ${reportName}.pdf`, { returnPromise: true }).then(() => {
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 ? formatWaktu(item.durasi_response_time) : '-',
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,
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,
4,
1,
`UNIT LAYANAN PELANGGAN : ${
reportMeta.ulp
? reportMeta.ulp.name.toUpperCase()
: 'Semua Unit Layanan Pelanggan'.toUpperCase()
}`
)
setHeaderStyle(worksheet, 5, 1, `JENIS LAPORAN : ${reportMeta.jenisLaporan.name.toUpperCase()}`)
setHeaderStyle(worksheet, 7, 1, `${reportName}`.toUpperCase(), true)
setHeaderStyle(
worksheet,
8,
1,
`PERIODE TANGGAL : ${meta.dateFromFormat} SD TGL ${meta.dateToFormat}`,
true
)
worksheet.mergeCells('A1:R1')
worksheet.mergeCells('A2:R2')
worksheet.mergeCells('A3:R3')
worksheet.mergeCells('A4:R4')
worksheet.mergeCells('A5:R5')
worksheet.mergeCells('A7:R7')
worksheet.mergeCells('A8:R8')
exportToExcel({
component: e.component,
worksheet,
autoFilterEnabled: true,
topLeftCell: { row: 10, 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 }

View File

@ -0,0 +1,290 @@
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 { setHeaderStyle } from '@/report/utils/xlsx'
import { formatNumber, formatPercentage } from '@/utils/numbers'
const reportName = 'Laporan Anomali Penanganan Pengaduan Keluhan Unit'
const fontSize = 5
const formatData = (rawData: any) => {
const formattedData: any = []
const total: any = {
wo_pln_mobile: 0,
total_anomali: 0
// persen_anomali
}
rawData.forEach((item: any) => {
total.wo_pln_mobile += item.wo_pln_mobile
total.total_anomali += item.total_anomali
})
const persen_anomali = (total.total_anomali / total.wo_pln_mobile) * 100
formattedData.push([
'Semua Unit',
formatNumber(total.wo_pln_mobile),
formatNumber(total.total_anomali),
formatPercentage(persen_anomali),
formatPercentage(!persen_anomali || !isFinite(persen_anomali) ? 0 : persen_anomali)
])
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()
],
[
'UNIT LAYANAN PELANGGAN',
':',
reportMeta.ulp
? reportMeta.ulp.name.toUpperCase()
: 'Semua Unit Layanan Pelanggan'.toUpperCase()
],
['JENIS LAPORAN', ':', reportMeta.jenisLaporan.name.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: 25
})
autoTable(doc, {
head: [
[
{
content: 'Nama Unit',
rowSpan: 2
},
'Total WO PLN Mobile',
'Total Pengaduan Yang Diselesaikan Secara Anomali',
'% Pengaduan Yang Diselesaikan Secara Anomali'
],
['a', 'b', 'c=b/a']
],
body: data,
styles: {
fontSize,
cellPadding: 1,
lineColor: [0, 0, 0],
lineWidth: 0.1,
cellWidth: 'auto'
},
rowPageBreak: 'auto',
headStyles: {
fillColor: [192, 192, 192],
textColor: [0, 0, 0],
fontStyle: 'bold',
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()
})
}
if (data.cell.text[0] === 'TOTAL') {
for (const key in data.row.cells) {
data.row.cells[key].styles.fillColor = [192, 192, 192]
data.row.cells[key].styles.fontStyle = 'bold'
}
}
},
startY: 35
})
autoTable(doc, {
head: [
[`${meta.dayTo}, ${meta.dateToFormat}`],
[
{
content: '(.........................................)',
styles: { minCellHeight: 8, valign: 'bottom' }
}
]
],
styles: {
fontSize,
cellPadding: 0.1,
textColor: [0, 0, 0],
fontStyle: 'bold',
halign: 'center'
},
theme: 'plain',
tableWidth: 50,
margin: { left: 230 }
})
if (preview) {
doc.setProperties({
title: `${reportName}`
})
window.open(doc.output('bloburl'))
} else {
doc.save(`Laporan ${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,
4,
1,
`UNIT LAYANAN PELANGGAN : ${
reportMeta.ulp
? reportMeta.ulp.name.toUpperCase()
: 'Semua Unit Layanan Pelanggan'.toUpperCase()
}`
)
setHeaderStyle(worksheet, 5, 1, `JENIS LAPORAN : ${reportMeta.jenisLaporan.name.toUpperCase()}`)
setHeaderStyle(worksheet, 7, 1, `${reportName}`.toUpperCase(), true)
setHeaderStyle(
worksheet,
8,
1,
`PERIODE TANGGAL : ${meta.dateFromFormat} SD TGL ${meta.dateToFormat}`,
true
)
worksheet.mergeCells('A1:D1')
worksheet.mergeCells('A2:D2')
worksheet.mergeCells('A3:D3')
worksheet.mergeCells('A4:D4')
worksheet.mergeCells('A5:D5')
worksheet.mergeCells('A7:D7')
worksheet.mergeCells('A8:D8')
exportToExcel({
component: e.component,
worksheet,
autoFilterEnabled: true,
topLeftCell: { row: 10, 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
}
export { exportToPDF, exportToXLSX }

View File

@ -0,0 +1,508 @@
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 = 'Laporan Anomali Penanganan Pengaduan Keluhan Unit'
const fontSize = 5
const detailFontSize = 5
const formatData = (rawData: any) => {
const formattedData: any = []
const total: any = {
wo_cc123: 0,
wo_pln_mobile: 0,
wo_loket: 0,
wo_lainnya: 0,
// wo_total
anomali_pln_mobile: 0,
anomali_cc123: 0
// total_anomali: 0,
// persen_anomali_pln_mobile
// persen_anomali_cc123
// total_persen_anomali
}
rawData.forEach((item: any) => {
total.wo_cc123 += item.wo_cc123
total.wo_pln_mobile += item.wo_pln_mobile
total.wo_loket += item.wo_loket
total.wo_lainnya += item.wo_lainnya
total.anomali_pln_mobile += item.anomali_pln_mobile
total.anomali_cc123 += item.anomali_cc123
})
const wo_total = total.wo_cc123 + total.wo_pln_mobile + total.wo_loket + total.wo_lainnya
const total_anomali = total.anomali_pln_mobile + total.anomali_cc123
const persen_anomali_pln_mobile = total.anomali_pln_mobile / wo_total
const persen_anomali_cc123 = total.anomali_cc123 / wo_total
const total_persen_anomali = persen_anomali_pln_mobile + persen_anomali_cc123
formattedData.push([
'Semua Unit',
formatNumber(total.wo_cc123),
formatNumber(total.wo_pln_mobile),
formatNumber(total.wo_loket),
formatNumber(total.wo_lainnya),
formatNumber(wo_total),
formatNumber(total.anomali_pln_mobile),
formatNumber(total.anomali_cc123),
formatNumber(total_anomali),
formatPercentage(!persen_anomali_pln_mobile ? 0 : persen_anomali_pln_mobile * 100),
formatPercentage(!persen_anomali_cc123 ? 0 : persen_anomali_cc123 * 100),
formatPercentage(!total_persen_anomali ? 0 : total_persen_anomali * 100)
])
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()
],
[
'UNIT LAYANAN PELANGGAN',
':',
reportMeta.ulp
? reportMeta.ulp.name.toUpperCase()
: 'Semua Unit Layanan Pelanggan'.toUpperCase()
],
['JENIS LAPORAN', ':', reportMeta.jenisLaporan.name.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: 25
})
autoTable(doc, {
head: [
[
{
content: 'Nama Unit',
rowSpan: 3
},
{
content: 'Total WO',
colSpan: 5
},
{
content: 'Total Pengaduan Yang Diselesaikan Secara Anomali',
colSpan: 3
},
{
content: '% Pengaduan Yang Diselesaikan Secara Anomali',
colSpan: 3
}
],
[
'CC 123',
'PLN Mobile',
'Loket',
'Lainnya',
'Total',
'PLN Mobile',
'CC 123',
'Total',
'PLN Mobile',
'CC 123',
'Total'
],
['a', 'b', 'c', 'd', 'e=a+b+c+d', 'f', 'g', 'h=f+g', 'i=f/e', 'j=g/e', 'k=i+j']
],
body: data,
styles: {
fontSize,
cellPadding: 1,
lineColor: [0, 0, 0],
lineWidth: 0.1,
cellWidth: 'auto'
},
rowPageBreak: 'auto',
headStyles: {
fillColor: [192, 192, 192],
textColor: [0, 0, 0],
fontStyle: 'bold',
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()
})
}
if (data.cell.text[0] === 'TOTAL') {
for (const key in data.row.cells) {
data.row.cells[key].styles.fillColor = [192, 192, 192]
data.row.cells[key].styles.fontStyle = 'bold'
}
}
},
startY: 35
})
autoTable(doc, {
head: [
[`${meta.dayTo}, ${meta.dateToFormat}`],
[
{
content: '(.........................................)',
styles: { minCellHeight: 8, valign: 'bottom' }
}
]
],
styles: {
fontSize,
cellPadding: 0.1,
textColor: [0, 0, 0],
fontStyle: 'bold',
halign: 'center'
},
theme: 'plain',
tableWidth: 50,
margin: { left: 230 }
})
if (preview) {
doc.setProperties({
title: `${reportName}`
})
window.open(doc.output('bloburl'))
} else {
doc.save(`Laporan ${reportName}.pdf`, { returnPromise: true }).then(() => {
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 ? formatWaktu(item.durasi_response_time) : '-',
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,
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,
4,
1,
`UNIT LAYANAN PELANGGAN : ${
reportMeta.ulp
? reportMeta.ulp.name.toUpperCase()
: 'Semua Unit Layanan Pelanggan'.toUpperCase()
}`
)
setHeaderStyle(worksheet, 5, 1, `JENIS LAPORAN : ${reportMeta.jenisLaporan.name.toUpperCase()}`)
setHeaderStyle(worksheet, 7, 1, `${reportName}`.toUpperCase(), true)
setHeaderStyle(
worksheet,
8,
1,
`PERIODE TANGGAL : ${meta.dateFromFormat} SD TGL ${meta.dateToFormat}`,
true
)
worksheet.mergeCells('A1:L1')
worksheet.mergeCells('A2:L2')
worksheet.mergeCells('A3:L3')
worksheet.mergeCells('A4:L4')
worksheet.mergeCells('A5:L5')
worksheet.mergeCells('A7:L7')
worksheet.mergeCells('A8:L8')
exportToExcel({
component: e.component,
worksheet,
autoFilterEnabled: true,
topLeftCell: { row: 10, 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 }