defuj/apkt-eis
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

rekap monalisa gangguan , kpi , material

Browse Source
This commit is contained in:
Eko Haryadi
2024-04-05 22:20:45 +07:00
parent d671b797b2
commit f8da3e92d4
70 changed files with 6315 additions and 1631 deletions
Download Patch File Download Diff File Expand all files Collapse all files

164
src/components/Pages/Material/Daftar/Material_DGMYG.vue
View File

@ -4,137 +4,43 @@
</Filters> </Filters>
<div id="data"> <div id="data">
<DxDataGrid <DxDataGrid ref="dataGridRef" :allow-column-reordering="true" class="max-h-[calc(100vh-140px)] mb-10"
ref="dataGridRef" :data-source="data" :show-column-lines="true" :show-row-lines="false" :show-borders="true"
:allow-column-reordering="true" :row-alternation-enabled="true" :hover-state-enabled="true" @selection-changed="onSelectionChanged"
class="max-h-[calc(100vh-140px)] mb-10" :column-width="100" @exporting="onExporting" :allow-column-resizing="true" column-resizing-mode="widget">
:data-source="data"
:show-column-lines="true"
:show-row-lines="false"
:show-borders="true"
:row-alternation-enabled="true"
:hover-state-enabled="true"
@selection-changed="onSelectionChanged"
:column-width="100"
@exporting="onExporting"
:allow-column-resizing="true"
column-resizing-mode="widget"
>
<DxSelection mode="single" /> <DxSelection mode="single" />
<DxPaging :page-size="20" :enabled="true" /> <DxPaging :page-size="20" :enabled="true" />
<DxPager <DxPager :visible="true" :allowed-page-sizes="[20, 50, 100]" display-mode="full" :show-page-size-selector="true"
:visible="true" :show-info="true" :show-navigation-buttons="true" />
:allowed-page-sizes="[20, 50, 100]"
display-mode="full"
:show-page-size-selector="true"
:show-info="true"
:show-navigation-buttons="true"
/>
<DxSearchPanel :visible="true" :highlight-case-sensitive="true" /> <DxSearchPanel :visible="true" :highlight-case-sensitive="true" />
<DxExport <DxExport :enabled="true" :formats="['pdf', 'xlsx', 'document']" :allow-export-selected-data="false" />
:enabled="true" <DxColumn css-class="custom-table-column" :width="50" alignment="center"
:formats="['pdf', 'xlsx', 'document']" :calculate-display-value="(item: any) => data.findIndex((i) => i == item) + 1" data-type="number" caption="No"
:allow-export-selected-data="false" cell-template="formatNumber" />
/>
<DxColumn
css-class="custom-table-column"
:width="50"
alignment="center"
:calculate-display-value="(item: any) => data.findIndex((i) => i == item) + 1"
data-type="number"
caption="No"
cell-template="formatNumber"
/>
<DxColumn <DxColumn css-class="custom-table-column" :width="170" alignment="center" data-field="no_laporan"
css-class="custom-table-column" caption="Nomor Gangguan" cell-template="formatText" />
:width="170" <DxColumn css-class="custom-table-column" :width="170" alignment="center" data-field="nama_pelapor"
alignment="center" caption="Nama Pelanggan" cell-template="formatText" />
data-field="no_laporan" <DxColumn css-class="custom-table-column" :width="300" alignment="center" data-field="keterangan_pelapor"
caption="Nomor Gangguan" caption="Isi Laporan" cell-template="formatText" />
cell-template="formatText" <DxColumn css-class="custom-table-column" :width="300" alignment="center" data-field="penyebab"
/> caption="Penyebab Gangguan" cell-template="formatText" />
<DxColumn <DxColumn css-class="custom-table-column" :width="170" alignment="center" data-field="waktu_lapor"
css-class="custom-table-column" caption="Tgl Padam" cell-template="formatText" />
:width="170" <DxColumn css-class="custom-table-column" :width="170" alignment="center" data-field="waktu_recovery"
alignment="center" caption="Tgl Nyala" cell-template="formatText" />
data-field="nama_pelapor" <DxColumn css-class="custom-table-column" :width="170" alignment="center" data-field="regu" caption="Regu"
caption="Nama Pelanggan" cell-template="formatText" />
cell-template="formatText"
/>
<DxColumn
css-class="custom-table-column"
:width="300"
alignment="center"
data-field="keterangan_pelapor"
caption="Isi Laporan"
cell-template="formatText"
/>
<DxColumn
css-class="custom-table-column"
:width="300"
alignment="center"
data-field="penyebab"
caption="Penyebab Gangguan"
cell-template="formatText"
/>
<DxColumn
css-class="custom-table-column"
:width="170"
alignment="center"
data-field="waktu_lapor"
caption="Tgl Padam"
cell-template="formatText"
/>
<DxColumn
css-class="custom-table-column"
:width="170"
alignment="center"
data-field="waktu_recovery"
caption="Tgl Nyala"
cell-template="formatText"
/>
<DxColumn
css-class="custom-table-column"
:width="170"
alignment="center"
data-field="regu"
caption="Regu"
cell-template="formatText"
/>
<DxColumn css-class="custom-table-column" alignment="center" caption="Material Yang Dipakai"> <DxColumn css-class="custom-table-column" alignment="center" caption="Material Yang Dipakai">
<DxColumn <DxColumn css-class="custom-table-column" :width="170" alignment="center" data-field="media" caption="Sumber"
css-class="custom-table-column" cell-template="formatText" />
:width="170" <DxColumn css-class="custom-table-column" :width="170" alignment="center" data-field="nama_material"
alignment="center" caption="Nama" cell-template="formatText" />
data-field="media" <DxColumn css-class="custom-table-column" :width="170" alignment="center" data-field="satuan_material"
caption="Sumber" caption="Satuan" cell-template="formatText" />
cell-template="formatText" <DxColumn css-class="custom-table-column" :width="170" alignment="center" data-field="volume_material"
/> caption="Vol" cell-template="formatText" />
<DxColumn
css-class="custom-table-column"
:width="170"
alignment="center"
data-field="nama_material"
caption="Nama"
cell-template="formatText"
/>
<DxColumn
css-class="custom-table-column"
:width="170"
alignment="center"
data-field="satuan_material"
caption="Satuan"
cell-template="formatText"
/>
<DxColumn
css-class="custom-table-column"
:width="170"
alignment="center"
data-field="volume_material"
caption="Vol"
cell-template="formatText"
/>
</DxColumn> </DxColumn>
<template #formatText="{ data }"> <template #formatText="{ data }">
@ -238,7 +144,9 @@ import BufferDialog from '@/components/Dialogs/BufferDialog.vue'
import { formatNumber, formatPercentage, isNumber } from '@/utils/numbers' import { formatNumber, formatPercentage, isNumber } from '@/utils/numbers'
import DetailDialog from '@/components/Dialogs/DetailDialog.vue' import DetailDialog from '@/components/Dialogs/DetailDialog.vue'
import InputText from '@/components/InputText.vue' import InputText from '@/components/InputText.vue'
import { exportToPDF, exportToXLSX } from '@/report/Material/Daftar/Material_DGMYG' import { exportToPDF, exportToXLSX,
exportToDOCX
} from '@/report/Material/Daftar/Material_DGMYG'
const position = { of: '#data' } const position = { of: '#data' }
const showIndicator = ref(true) const showIndicator = ref(true)
@ -334,6 +242,8 @@ const onExporting = (e: any) => {
} else if (e.format === 'xlsx') { } else if (e.format === 'xlsx') {
exportToXLSX(reportMeta, e) exportToXLSX(reportMeta, e)
} else { } else {
exportToDOCX(reportMeta, data)
} }
} }

119
src/components/Pages/Material/Rekap/Material_RPM.vue
View File

@ -3,100 +3,34 @@
<Type14 @update:filters="(value) => (filters = value)" /> <Type14 @update:filters="(value) => (filters = value)" />
</Filters> </Filters>
<div id="data"> <div id="data">
<DxDataGrid <DxDataGrid ref="dataGridRef" :allow-column-reordering="true" class="max-h-[calc(100vh-140px)] mb-10"
ref="dataGridRef" :data-source="data" :show-column-lines="true" :show-row-lines="false" :show-borders="true"
:allow-column-reordering="true" :row-alternation-enabled="true" :hover-state-enabled="true" @selection-changed="onSelectionChanged"
class="max-h-[calc(100vh-140px)] mb-10" :column-width="100" @exporting="onExporting" :allow-column-resizing="true" column-resizing-mode="widget">
:data-source="data"
:show-column-lines="true"
:show-row-lines="false"
:show-borders="true"
:row-alternation-enabled="true"
:hover-state-enabled="true"
@selection-changed="onSelectionChanged"
:column-width="100"
@exporting="onExporting"
:allow-column-resizing="true"
column-resizing-mode="widget"
>
<DxSelection mode="single" /> <DxSelection mode="single" />
<DxPaging :page-size="20" :enabled="true" /> <DxPaging :page-size="20" :enabled="true" />
<DxPager <DxPager :visible="true" :allowed-page-sizes="[20, 50, 100]" display-mode="full" :show-page-size-selector="true"
:visible="true" :show-info="true" :show-navigation-buttons="true" />
:allowed-page-sizes="[20, 50, 100]"
display-mode="full"
:show-page-size-selector="true"
:show-info="true"
:show-navigation-buttons="true"
/>
<DxSearchPanel :visible="true" :highlight-case-sensitive="true" /> <DxSearchPanel :visible="true" :highlight-case-sensitive="true" />
<DxExport <DxExport :enabled="true" :formats="['pdf', 'xlsx', 'document']" :allow-export-selected-data="false" />
:enabled="true" <DxColumn css-class="custom-table-column" :width="50" alignment="center"
:formats="['pdf', 'xlsx', 'document']" :calculate-display-value="(item: any) => data.findIndex((i) => i == item) + 1" data-type="number" caption="No"
:allow-export-selected-data="false" cell-template="formatNumber" />
/>
<DxColumn
css-class="custom-table-column"
:width="50"
alignment="center"
:calculate-display-value="(item: any) => data.findIndex((i) => i == item) + 1"
data-type="number"
caption="No"
cell-template="formatNumber"
/>
<DxColumn <DxColumn css-class="custom-table-column" :width="170" alignment="center" data-field="kode"
css-class="custom-table-column" caption="Kode Material" cell-template="formatText" />
:width="170" <DxColumn css-class="custom-table-column" :width="170" alignment="center" data-field="nama_material"
alignment="center" caption="Nama Material" cell-template="formatText" />
data-field="kode" <DxColumn css-class="custom-table-column" :width="120" alignment="center" data-field="satuan" caption="Satuan"
caption="Kode Material" cell-template="formatText" />
cell-template="formatText" <DxColumn css-class="custom-table-column" :width="170" alignment="center" data-field="sumber_material"
/> caption="Sumber Material" cell-template="formatText" />
<DxColumn
css-class="custom-table-column"
:width="170"
alignment="center"
data-field="nama_material"
caption="Nama Material"
cell-template="formatText"
/>
<DxColumn
css-class="custom-table-column"
:width="120"
alignment="center"
data-field="satuan"
caption="Satuan"
cell-template="formatText"
/>
<DxColumn
css-class="custom-table-column"
:width="170"
alignment="center"
data-field="sumber_material"
caption="Sumber Material"
cell-template="formatText"
/>
<DxColumn css-class="custom-table-column" alignment="center" caption="Tanggal"> <DxColumn css-class="custom-table-column" alignment="center" caption="Tanggal">
<DxColumn <DxColumn v-for="i in 31" :width="150" alignment="center" :data-field="`tgl${i}`" data-type="number"
v-for="i in 31" :caption="i" css-class="custom-table-column" cell-template="formatNumber" />
:width="150"
alignment="center"
:data-field="`tgl${i}`"
data-type="number"
:caption="i"
css-class="custom-table-column"
cell-template="formatNumber"
/>
</DxColumn> </DxColumn>
<DxColumn <DxColumn css-class="custom-table-column" :width="170" alignment="center" data-field="total" caption="Jumlah"
css-class="custom-table-column" cell-template="formatNumber" />
:width="170"
alignment="center"
data-field="total"
caption="Jumlah"
cell-template="formatNumber"
/>
<template #formatText="{ data }"> <template #formatText="{ data }">
<p class="text-left"> <p class="text-left">
@ -118,11 +52,7 @@
</DxDataGrid> </DxDataGrid>
</div> </div>
<DetailDialog <DetailDialog :open="dialogDetail" title="Detail Rekapitulasi Pemakaian Material" @on-close="closeDialog">
:open="dialogDetail"
title="Detail Rekapitulasi Pemakaian Material"
@on-close="closeDialog"
>
<div class="w-full p-4 space-y-2 bg-white rounded-xl"> <div class="w-full p-4 space-y-2 bg-white rounded-xl">
<div class="flex flex-row items-center justify-between w-full"> <div class="flex flex-row items-center justify-between w-full">
<h3 class="text-sm font-medium w-[170px] text-gray-800">Kode Material:</h3> <h3 class="text-sm font-medium w-[170px] text-gray-800">Kode Material:</h3>
@ -180,7 +110,7 @@ import BufferDialog from '@/components/Dialogs/BufferDialog.vue'
import { formatNumber, formatPercentage, isNumber } from '@/utils/numbers' import { formatNumber, formatPercentage, isNumber } from '@/utils/numbers'
import DetailDialog from '@/components/Dialogs/DetailDialog.vue' import DetailDialog from '@/components/Dialogs/DetailDialog.vue'
import InputText from '@/components/InputText.vue' import InputText from '@/components/InputText.vue'
import { exportToPDF, exportToXLSX } from '@/report/Material/Rekapitulasi/Material_RPM' import { exportToPDF, exportToXLSX, exportToDOCX } from '@/report/Material/Rekapitulasi/Material_RPM'
const position = { of: '#data' } const position = { of: '#data' }
const showIndicator = ref(true) const showIndicator = ref(true)
@ -275,6 +205,7 @@ const onExporting = (e: any) => {
} else if (e.format === 'xlsx') { } else if (e.format === 'xlsx') {
exportToXLSX(reportMeta, e) exportToXLSX(reportMeta, e)
} else { } else {
exportToDOCX(reportMeta, data)
} }
} }

6
src/components/Pages/Monalisa/Gangguan/Rekap/MonalisaGR_DispatchingTimeGangguan.vue
View File

@ -784,7 +784,9 @@ import {
exportToPDF, exportToPDF,
exportToXLSX, exportToXLSX,
exportDetailToPDF, exportDetailToPDF,
exportDetailToXLSX exportDetailToXLSX,
exportToDOCX,
exportDetailToDOCX
} from '@/report/Monalisa/Gangguan/Rekap/MonalisaGR_DispatchingTimeGangguan' } from '@/report/Monalisa/Gangguan/Rekap/MonalisaGR_DispatchingTimeGangguan'
const client = apolloClient() const client = apolloClient()
@ -838,6 +840,7 @@ const onExporting = (e: any) => {
} else if (e.format === 'xlsx') { } else if (e.format === 'xlsx') {
exportToXLSX(reportMeta.value, e) exportToXLSX(reportMeta.value, e)
} else { } else {
exportToDOCX(reportMeta.value, data.value)
} }
} }
@ -847,6 +850,7 @@ const onExportingDetail = (e: any) => {
} else if (e.format === 'xlsx') { } else if (e.format === 'xlsx') {
exportDetailToXLSX(reportMeta.value, e) exportDetailToXLSX(reportMeta.value, e)
} else { } else {
exportDetailToDOCX(reportMeta.value, dataSub.value)
} }
} }

3
src/components/Pages/Monalisa/Gangguan/Rekap/MonalisaGR_ENSGangguan.vue
View File

@ -292,7 +292,7 @@ import { formatNumber, formatPercentage, isNumber } from '@/utils/numbers'
import { apolloClient } from '@/utils/api/api.graphql' import { apolloClient } from '@/utils/api/api.graphql'
import { provideApolloClient } from '@vue/apollo-composable' import { provideApolloClient } from '@vue/apollo-composable'
import BufferDialog from '@/components/Dialogs/BufferDialog.vue' import BufferDialog from '@/components/Dialogs/BufferDialog.vue'
import { exportToPDF, exportToXLSX } from '@/report/Monalisa/Gangguan/Rekap/MonalisaGR_ENSGangguan' import { exportToPDF, exportToXLSX,exportToDOCX } from '@/report/Monalisa/Gangguan/Rekap/MonalisaGR_ENSGangguan'
const client = apolloClient() const client = apolloClient()
provideApolloClient(client) provideApolloClient(client)
@ -391,6 +391,7 @@ const onExporting = (e: any) => {
} else if (e.format === 'xlsx') { } else if (e.format === 'xlsx') {
exportToXLSX(reportMeta.value, e) exportToXLSX(reportMeta.value, e)
} else { } else {
exportToDOCX(reportMeta.value, data.value)
} }
} }

6
src/components/Pages/Monalisa/Gangguan/Rekap/MonalisaGR_GangguanBelumSelesai.vue
View File

@ -538,7 +538,9 @@ import {
exportToPDF, exportToPDF,
exportToXLSX, exportToXLSX,
exportDetailToPDF, exportDetailToPDF,
exportDetailToXLSX exportDetailToXLSX,
exportToDOCX,
exportDetailToDOCX
} from '@/report/Monalisa/Gangguan/Rekap/MonalisaGR_GangguanBelumSelesai' } from '@/report/Monalisa/Gangguan/Rekap/MonalisaGR_GangguanBelumSelesai'
const client = apolloClient() const client = apolloClient()
@ -626,6 +628,7 @@ const onExporting = (e: any) => {
} else if (e.format === 'xlsx') { } else if (e.format === 'xlsx') {
exportToXLSX(reportMeta.value, e) exportToXLSX(reportMeta.value, e)
} else { } else {
exportToDOCX(reportMeta.value, data.value)
} }
} }
@ -635,6 +638,7 @@ const onExportingDetail = (e: any) => {
} else if (e.format === 'xlsx') { } else if (e.format === 'xlsx') {
exportDetailToXLSX(reportMeta.value, e) exportDetailToXLSX(reportMeta.value, e)
} else { } else {
exportDetailToDOCX(reportMeta.value, dataSub.value)
} }
} }
const getDetail = async () => { const getDetail = async () => {

5
src/components/Pages/Monalisa/Gangguan/Rekap/MonalisaGR_GangguanPerJenisGangguan.vue
View File

@ -161,7 +161,8 @@ import BufferDialog from '@/components/Dialogs/BufferDialog.vue'
import { getMonthName } from '@/utils/texts' import { getMonthName } from '@/utils/texts'
import { import {
exportToPDF, exportToPDF,
exportToXLSX exportToXLSX,
exportToDOCX
} from '@/report/Monalisa/Gangguan/Rekap/MonalisaGR_GangguanPerJenisGangguan' } from '@/report/Monalisa/Gangguan/Rekap/MonalisaGR_GangguanPerJenisGangguan'
const client = apolloClient() const client = apolloClient()
@ -241,6 +242,8 @@ const onExporting = (e: any) => {
} else if (e.format === 'xlsx') { } else if (e.format === 'xlsx') {
exportToXLSX(reportMeta.value, e) exportToXLSX(reportMeta.value, e)
} else { } else {
exportToDOCX(reportMeta.value, data.value)
} }
} }
const getDetail = async () => { const getDetail = async () => {

5
src/components/Pages/Monalisa/Gangguan/Rekap/MonalisaGR_JumlahDDRPTRCTGangguan.vue
View File

@ -389,7 +389,9 @@ import { provideApolloClient } from '@vue/apollo-composable'
import BufferDialog from '@/components/Dialogs/BufferDialog.vue' import BufferDialog from '@/components/Dialogs/BufferDialog.vue'
import { import {
exportToPDF, exportToPDF,
exportToXLSX exportToXLSX,
exportToDOCX
} from '@/report/Monalisa/Gangguan/Rekap/MonalisaGR_JumlahDDRPTRCTGangguan' } from '@/report/Monalisa/Gangguan/Rekap/MonalisaGR_JumlahDDRPTRCTGangguan'
const client = apolloClient() const client = apolloClient()
@ -474,6 +476,7 @@ const onExporting = (e: any) => {
} else if (e.format === 'xlsx') { } else if (e.format === 'xlsx') {
exportToXLSX(reportMeta.value, e) exportToXLSX(reportMeta.value, e)
} else { } else {
exportToDOCX(reportMeta.value, data.value)
} }
} }
const getDetail = async () => { const getDetail = async () => {

5
src/components/Pages/Monalisa/Gangguan/Rekap/MonalisaGR_JumlahKaliGangguan.vue
View File

@ -295,7 +295,9 @@ import { provideApolloClient } from '@vue/apollo-composable'
import BufferDialog from '@/components/Dialogs/BufferDialog.vue' import BufferDialog from '@/components/Dialogs/BufferDialog.vue'
import { import {
exportToPDF, exportToPDF,
exportToXLSX exportToXLSX,
exportToDOCX
} from '@/report/Monalisa/Gangguan/Rekap/MonalisaGR_JumlahKaliGangguan' } from '@/report/Monalisa/Gangguan/Rekap/MonalisaGR_JumlahKaliGangguan'
const client = apolloClient() const client = apolloClient()
@ -333,6 +335,7 @@ const onExporting = (e: any) => {
} else if (e.format === 'xlsx') { } else if (e.format === 'xlsx') {
exportToXLSX(reportMeta.value, e) exportToXLSX(reportMeta.value, e)
} else { } else {
exportToDOCX(reportMeta.value, data.value)
} }
} }
const lastMonth = ref(new Date().getMonth() == 1 ? 12 : new Date().getMonth() - 1) const lastMonth = ref(new Date().getMonth() == 1 ? 12 : new Date().getMonth() - 1)

2
src/components/Pages/Monalisa/Gangguan/Rekap/MonalisaGR_LaporUlang.vue
View File

@ -294,7 +294,7 @@ import { formatNumber, formatPercentage, isNumber } from '@/utils/numbers'
import { apolloClient } from '@/utils/api/api.graphql' import { apolloClient } from '@/utils/api/api.graphql'
import { provideApolloClient } from '@vue/apollo-composable' import { provideApolloClient } from '@vue/apollo-composable'
import BufferDialog from '@/components/Dialogs/BufferDialog.vue' import BufferDialog from '@/components/Dialogs/BufferDialog.vue'
import { exportToPDF, exportToXLSX } from '@/report/Monalisa/Gangguan/Rekap/MonalisaGR_LaporUlang' import { exportToPDF, exportToXLSX,exportToDOCX} from '@/report/Monalisa/Gangguan/Rekap/MonalisaGR_LaporUlang'
const client = apolloClient() const client = apolloClient()
provideApolloClient(client) provideApolloClient(client)

5
src/components/Pages/Monalisa/Gangguan/Rekap/MonalisaGR_RecoveryTimeGangguan.vue
View File

@ -302,7 +302,9 @@ import { provideApolloClient } from '@vue/apollo-composable'
import BufferDialog from '@/components/Dialogs/BufferDialog.vue' import BufferDialog from '@/components/Dialogs/BufferDialog.vue'
import { import {
exportToPDF, exportToPDF,
exportToXLSX exportToXLSX,
exportToDOCX
} from '@/report/Monalisa/Gangguan/Rekap/MonalisaGR_RecoveryTimeGangguan' } from '@/report/Monalisa/Gangguan/Rekap/MonalisaGR_RecoveryTimeGangguan'
const client = apolloClient() const client = apolloClient()
@ -402,6 +404,7 @@ const onExporting = (e: any) => {
} else if (e.format === 'xlsx') { } else if (e.format === 'xlsx') {
exportToXLSX(reportMeta.value, e) exportToXLSX(reportMeta.value, e)
} else { } else {
exportToDOCX(reportMeta.value, data.value)
} }
} }
const getDetail = async () => { const getDetail = async () => {

303
src/components/Pages/Monalisa/Gangguan/Rekap/MonalisaGR_ResponseTimeGangguan.vue
View File

@ -1,255 +1,90 @@
<template> <template>
<Filters <Filters @run-report="() => exportToPDF(reportMeta, data, true)" @reset-form="data = []" :report-button="true"
@run-report="() => exportToPDF(reportMeta, data, true)" @run-search="() => filterData(filters)" class="mb-4">
@reset-form="data = []"
:report-button="true"
@run-search="() => filterData(filters)"
class="mb-4"
>
<Type2 @update:filters="(value) => (filters = value)" /> <Type2 @update:filters="(value) => (filters = value)" />
</Filters> </Filters>
<div id="data"> <div id="data">
<DxDataGrid <DxDataGrid ref="dataGridRef" :allow-column-reordering="true" class="max-h-[calc(100vh-140px)] mb-10"
ref="dataGridRef" :data-source="data" :show-column-lines="true" :show-row-lines="false" :show-borders="true"
:allow-column-reordering="true" :row-alternation-enabled="true" :hover-state-enabled="true" @selection-changed="onDataSelectionChanged"
class="max-h-[calc(100vh-140px)] mb-10" @exporting="onExporting" :allow-column-resizing="true" column-resizing-mode="widget" :word-wrap-enabled="true">
:data-source="data"
:show-column-lines="true"
:show-row-lines="false"
:show-borders="true"
:row-alternation-enabled="true"
:hover-state-enabled="true"
@selection-changed="onDataSelectionChanged"
@exporting="onExporting"
:allow-column-resizing="true"
column-resizing-mode="widget"
:word-wrap-enabled="true"
>
<DxGrouping expand-mode="rowClick" :auto-expand-all="false" /> <DxGrouping expand-mode="rowClick" :auto-expand-all="false" />
<DxSelection mode="single" /> <DxSelection mode="single" />
<DxPaging :enabled="false" /> <DxPaging :enabled="false" />
<DxScrolling column-rendering-mode="virtual" mode="virtual" /> <DxScrolling column-rendering-mode="virtual" mode="virtual" />
<DxSearchPanel :visible="true" :highlight-case-sensitive="true" /> <DxSearchPanel :visible="true" :highlight-case-sensitive="true" />
<DxExport <DxExport :enabled="true" :formats="['pdf', 'xlsx', 'document']" :allow-export-selected-data="false" />
:enabled="true"
:formats="['pdf', 'xlsx', 'document']"
:allow-export-selected-data="false"
/>
<DxColumnFixing :enabled="true" /> <DxColumnFixing :enabled="true" />
<DxColumn <DxColumn alignment="center" :min-width="170" data-type="text" data-field="nama_regional" caption="Regional"
alignment="center" css-class="custom-table-column" :group-index="0" name="namaRegional" />
:min-width="170" <DxColumn alignment="center" :min-width="170" data-type="text" data-field="id_uid" caption="UIW"
data-type="text" css-class="custom-table-column" :group-index="1" name="namaUID"
data-field="nama_regional" :calculate-group-value="(rowData: any) => rowData.nama_uid" />
caption="Regional" <DxColumn alignment="center" :min-width="170" data-type="text" data-field="id_up3" caption="UP3"
css-class="custom-table-column" css-class="custom-table-column" :group-index="1" name="namaUID"
:group-index="0" :calculate-group-value="(rowData: any) => rowData.nama_up3" />
name="namaRegional" <DxColumn alignment="center" :min-width="170" data-type="text" data-field="nama_ulp" caption="Nama Unit"
/> css-class="custom-table-column" cell-template="formatText" />
<DxColumn <DxColumn alignment="center" caption="Jumlah RPT Kali Gangguan" css-class="custom-table-column">
alignment="center"
:min-width="170"
data-type="text"
data-field="id_uid"
caption="UIW"
css-class="custom-table-column"
:group-index="1"
name="namaUID"
:calculate-group-value="(rowData: any) => rowData.nama_uid"
/>
<DxColumn
alignment="center"
:min-width="170"
data-type="text"
data-field="id_up3"
caption="UP3"
css-class="custom-table-column"
:group-index="1"
name="namaUID"
:calculate-group-value="(rowData: any) => rowData.nama_up3"
/>
<DxColumn
alignment="center"
:min-width="170"
data-type="text"
data-field="nama_ulp"
caption="Nama Unit"
css-class="custom-table-column"
cell-template="formatText"
/>
<DxColumn
alignment="center"
caption="Jumlah RPT Kali Gangguan"
css-class="custom-table-column"
>
<DxColumn alignment="center" caption="MoM" css-class="custom-table-column"> <DxColumn alignment="center" caption="MoM" css-class="custom-table-column">
<DxColumn <DxColumn :width="150" alignment="center" data-field="mom_bulan_kemarin" data-type="number"
:width="150" :caption="`${getMonthName(lastMonth)} ${lastYearMoM}`" css-class="custom-table-column"
alignment="center" cell-template="formatNumber" />
data-field="mom_bulan_kemarin" <DxColumn :width="150" alignment="center" data-field="mom_bulan_ini" data-type="number"
data-type="number" :caption="`${getMonthName(currentMonth)} ${currentYear}`" css-class="custom-table-column"
:caption="`${getMonthName(lastMonth)} ${lastYearMoM}`" cell-template="formatNumber" />
css-class="custom-table-column" <DxColumn :width="70" alignment="center" data-field="persen_mom" data-type="number" caption="%"
cell-template="formatNumber" css-class="custom-table-column" cell-template="formatNumber" />
/>
<DxColumn
:width="150"
alignment="center"
data-field="mom_bulan_ini"
data-type="number"
:caption="`${getMonthName(currentMonth)} ${currentYear}`"
css-class="custom-table-column"
cell-template="formatNumber"
/>
<DxColumn
:width="70"
alignment="center"
data-field="persen_mom"
data-type="number"
caption="%"
css-class="custom-table-column"
cell-template="formatNumber"
/>
</DxColumn> </DxColumn>
<DxColumn alignment="center" caption="YoY" css-class="custom-table-column"> <DxColumn alignment="center" caption="YoY" css-class="custom-table-column">
<DxColumn <DxColumn :width="150" alignment="center" data-field="yoy_tahun_kemarin" data-type="number"
:width="150" :caption="`s.d ${getMonthName(currentMonth)} ${lastYear}`" css-class="custom-table-column"
alignment="center" cell-template="formatNumber" />
data-field="yoy_tahun_kemarin" <DxColumn :width="150" alignment="center" data-field="yoy_tahun_ini" data-type="number"
data-type="number" :caption="`s.d ${getMonthName(currentMonth)} ${currentYear}`" css-class="custom-table-column"
:caption="`s.d ${getMonthName(currentMonth)} ${lastYear}`" cell-template="formatNumber" />
css-class="custom-table-column" <DxColumn :width="70" alignment="center" data-field="persen_yoy" data-type="number" caption="%"
cell-template="formatNumber" css-class="custom-table-column" cell-template="formatNumber" />
/>
<DxColumn
:width="150"
alignment="center"
data-field="yoy_tahun_ini"
data-type="number"
:caption="`s.d ${getMonthName(currentMonth)} ${currentYear}`"
css-class="custom-table-column"
cell-template="formatNumber"
/>
<DxColumn
:width="70"
alignment="center"
data-field="persen_yoy"
data-type="number"
caption="%"
css-class="custom-table-column"
cell-template="formatNumber"
/>
</DxColumn> </DxColumn>
</DxColumn> </DxColumn>
<DxSummary> <DxSummary>
<DxTotalItem <DxTotalItem summary-type="sum" display-format="Total" show-in-column="nama_ulp"
summary-type="sum" css-class="text-white !text-left" />
display-format="Total" <DxTotalItem column="mom_bulan_kemarin" summary-type="sum" display-format="{0}"
show-in-column="nama_ulp" css-class="text-white !text-right" :customize-text="(e: any) => formatNumber(e.value)" />
css-class="text-white !text-left" <DxTotalItem column="mom_bulan_ini" summary-type="sum" display-format="{0}" css-class="text-white !text-right"
/> :customize-text="(e: any) => formatNumber(e.value)" />
<DxTotalItem <DxTotalItem column="persen_mom" summary-type="avg" display-format="{0}" css-class="text-white !text-right"
column="mom_bulan_kemarin" :customize-text="(e: any) => formatPercentage(e.value)" />
summary-type="sum" <DxTotalItem column="yoy_tahun_kemarin" summary-type="sum" display-format="{0}"
display-format="{0}" css-class="text-white !text-right" :customize-text="(e: any) => formatNumber(e.value)" />
css-class="text-white !text-right" <DxTotalItem column="yoy_tahun_ini" summary-type="sum" display-format="{0}" css-class="text-white !text-right"
:customize-text="(e: any) => formatNumber(e.value)" :customize-text="(e: any) => formatNumber(e.value)" />
/> <DxTotalItem column="persen_yoy" summary-type="avg" display-format="{0}" css-class="text-white !text-right"
<DxTotalItem :customize-text="(e: any) => formatPercentage(e.value)" />
column="mom_bulan_ini"
summary-type="sum"
display-format="{0}"
css-class="text-white !text-right"
:customize-text="(e: any) => formatNumber(e.value)"
/>
<DxTotalItem
column="persen_mom"
summary-type="avg"
display-format="{0}"
css-class="text-white !text-right"
:customize-text="(e: any) => formatPercentage(e.value)"
/>
<DxTotalItem
column="yoy_tahun_kemarin"
summary-type="sum"
display-format="{0}"
css-class="text-white !text-right"
:customize-text="(e: any) => formatNumber(e.value)"
/>
<DxTotalItem
column="yoy_tahun_ini"
summary-type="sum"
display-format="{0}"
css-class="text-white !text-right"
:customize-text="(e: any) => formatNumber(e.value)"
/>
<DxTotalItem
column="persen_yoy"
summary-type="avg"
display-format="{0}"
css-class="text-white !text-right"
:customize-text="(e: any) => formatPercentage(e.value)"
/>
<DxGroupItem <DxGroupItem :show-in-group-footer="false" :align-by-column="true" summary-type="sum" display-format="{0}"
:show-in-group-footer="false" show-in-column="mom_bulan_kemarin" column="mom_bulan_kemarin" css-class="!text-right"
:align-by-column="true" :customize-text="(e: any) => formatNumber(e.value)" />
summary-type="sum" <DxGroupItem :show-in-group-footer="false" :align-by-column="true" summary-type="sum"
display-format="{0}" show-in-column="mom_bulan_ini" column="mom_bulan_ini" css-class="!text-right"
show-in-column="mom_bulan_kemarin" :customize-text="(e: any) => formatNumber(e.value)" />
column="mom_bulan_kemarin" <DxGroupItem :show-in-group-footer="false" :align-by-column="true" summary-type="sum"
css-class="!text-right" show-in-column="persen_mom" column="persen_mom" css-class="!text-right"
:customize-text="(e: any) => formatNumber(e.value)" :customize-text="(e: any) => formatPercentage(e.value)" />
/> <DxGroupItem :show-in-group-footer="false" :align-by-column="true" summary-type="sum"
<DxGroupItem show-in-column="yoy_tahun_kemarin" column="yoy_tahun_kemarin" css-class="!text-right"
:show-in-group-footer="false" :customize-text="(e: any) => formatNumber(e.value)" />
:align-by-column="true" <DxGroupItem :show-in-group-footer="false" :align-by-column="true" summary-type="sum"
summary-type="sum" show-in-column="yoy_tahun_ini" column="yoy_tahun_ini" css-class="!text-right"
show-in-column="mom_bulan_ini" :customize-text="(e: any) => formatNumber(e.value)" />
column="mom_bulan_ini" <DxGroupItem :show-in-group-footer="false" :align-by-column="true" summary-type="sum"
css-class="!text-right" show-in-column="persen_yoy" column="persen_yoy" css-class="!text-right"
:customize-text="(e: any) => formatNumber(e.value)" :customize-text="(e: any) => formatPercentage(e.value)" />
/>
<DxGroupItem
:show-in-group-footer="false"
:align-by-column="true"
summary-type="sum"
show-in-column="persen_mom"
column="persen_mom"
css-class="!text-right"
:customize-text="(e: any) => formatPercentage(e.value)"
/>
<DxGroupItem
:show-in-group-footer="false"
:align-by-column="true"
summary-type="sum"
show-in-column="yoy_tahun_kemarin"
column="yoy_tahun_kemarin"
css-class="!text-right"
:customize-text="(e: any) => formatNumber(e.value)"
/>
<DxGroupItem
:show-in-group-footer="false"
:align-by-column="true"
summary-type="sum"
show-in-column="yoy_tahun_ini"
column="yoy_tahun_ini"
css-class="!text-right"
:customize-text="(e: any) => formatNumber(e.value)"
/>
<DxGroupItem
:show-in-group-footer="false"
:align-by-column="true"
summary-type="sum"
show-in-column="persen_yoy"
column="persen_yoy"
css-class="!text-right"
:customize-text="(e: any) => formatPercentage(e.value)"
/>
</DxSummary> </DxSummary>
<template #formatNumber="{ data }"> <template #formatNumber="{ data }">
@ -302,7 +137,9 @@ import { provideApolloClient } from '@vue/apollo-composable'
import BufferDialog from '@/components/Dialogs/BufferDialog.vue' import BufferDialog from '@/components/Dialogs/BufferDialog.vue'
import { import {
exportToPDF, exportToPDF,
exportToXLSX exportToXLSX,
exportToDOCX
} from '@/report/Monalisa/Gangguan/Rekap/MonalisaGR_ResponseTimeGangguan' } from '@/report/Monalisa/Gangguan/Rekap/MonalisaGR_ResponseTimeGangguan'
const client = apolloClient() const client = apolloClient()
@ -402,6 +239,8 @@ const onExporting = (e: any) => {
} else if (e.format === 'xlsx') { } else if (e.format === 'xlsx') {
exportToXLSX(reportMeta.value, e) exportToXLSX(reportMeta.value, e)
} else { } else {
exportToDOCX(reportMeta.value, data.value)
} }
} }
const getDetail = async () => { const getDetail = async () => {

6
src/components/Pages/Monalisa/Laporan/Bulanan/MonalisaLB_AgingComplaint.vue
View File

@ -660,7 +660,9 @@ import {
exportToPDF, exportToPDF,
exportToXLSX, exportToXLSX,
exportDetailToPDF, exportDetailToPDF,
exportDetailToXLSX exportDetailToXLSX,
exportToDOCX,
exportDetailToDOCX
} from '@/report/Monalisa/Laporan/Bulanan/MonalisaLB_AgingComplaint' } from '@/report/Monalisa/Laporan/Bulanan/MonalisaLB_AgingComplaint'
const client = apolloClient() const client = apolloClient()
@ -699,6 +701,7 @@ const onExporting = (e: any) => {
} else if (e.format === 'xlsx') { } else if (e.format === 'xlsx') {
exportToXLSX(reportMeta.value, e) exportToXLSX(reportMeta.value, e)
} else { } else {
exportToDOCX(reportMeta.value, data.value)
} }
} }
@ -708,6 +711,7 @@ const onExportingDetail = (e: any) => {
} else if (e.format === 'xlsx') { } else if (e.format === 'xlsx') {
exportDetailToXLSX(reportMeta.value, e) exportDetailToXLSX(reportMeta.value, e)
} else { } else {
exportDetailToDOCX(reportMeta.value, dataSub.value)
} }
} }

271
src/components/Pages/Monalisa/Laporan/Bulanan/MonalisaLB_EnergyNotSales.vue
View File

@ -1,233 +1,78 @@
<template> <template>
<Filters <Filters @run-report="() => exportToPDF(reportMeta, data, true)" :report-button="true" @reset-form="data = []"
@run-report="() => exportToPDF(reportMeta, data, true)" @run-search="() => filterData(filters)" class="mb-4">
:report-button="true"
@reset-form="data = []"
@run-search="() => filterData(filters)"
class="mb-4"
>
<Type2 @update:filters="(value) => (filters = value)" /> <Type2 @update:filters="(value) => (filters = value)" />
</Filters> </Filters>
<div id="data"> <div id="data">
<DxDataGrid <DxDataGrid ref="dataGridRef" :allow-column-reordering="true" class="max-h-[calc(100vh-140px)] mb-10"
ref="dataGridRef" :data-source="data" :show-column-lines="true" :show-row-lines="false" :show-borders="true"
:allow-column-reordering="true" :row-alternation-enabled="true" :hover-state-enabled="true" @selection-changed="onDataSelectionChanged"
class="max-h-[calc(100vh-140px)] mb-10" @exporting="onExporting" :allow-column-resizing="true" column-resizing-mode="widget" :word-wrap-enabled="true">
:data-source="data"
:show-column-lines="true"
:show-row-lines="false"
:show-borders="true"
:row-alternation-enabled="true"
:hover-state-enabled="true"
@selection-changed="onDataSelectionChanged"
@exporting="onExporting"
:allow-column-resizing="true"
column-resizing-mode="widget"
:word-wrap-enabled="true"
>
<DxGrouping expand-mode="rowClick" :auto-expand-all="false" /> <DxGrouping expand-mode="rowClick" :auto-expand-all="false" />
<DxSelection mode="single" /> <DxSelection mode="single" />
<DxPaging :enabled="false" /> <DxPaging :enabled="false" />
<DxScrolling column-rendering-mode="virtual" mode="virtual" /> <DxScrolling column-rendering-mode="virtual" mode="virtual" />
<DxSearchPanel :visible="true" :highlight-case-sensitive="true" /> <DxSearchPanel :visible="true" :highlight-case-sensitive="true" />
<DxExport <DxExport :enabled="true" :formats="['pdf', 'xlsx', 'document']" :allow-export-selected-data="false" />
:enabled="true"
:formats="['pdf', 'xlsx', 'document']"
:allow-export-selected-data="false"
/>
<DxColumnFixing :enabled="true" /> <DxColumnFixing :enabled="true" />
<DxColumn <DxColumn alignment="center" :caption="`Periode: ${getMonthName(currentMonth)}, ${currentYear}`"
alignment="center" css-class="custom-table-column">
:caption="`Periode: ${getMonthName(currentMonth)}, ${currentYear}`" <DxColumn alignment="center" :min-width="170" data-type="text" data-field="nama_regional" caption="Regional"
css-class="custom-table-column" css-class="custom-table-column" :group-index="0" name="namaRegional" />
> <DxColumn alignment="center" :min-width="170" data-type="text" data-field="id_uid" caption="UID"
<DxColumn css-class="custom-table-column" :group-index="1" name="namaUID"
alignment="center" :calculate-group-value="(rowData: any) => rowData.nama_uid" />
:min-width="170" <DxColumn alignment="center" :min-width="170" data-type="text" data-field="id_up3" caption="UP3"
data-type="text" css-class="custom-table-column" :group-index="1" name="namaUID"
data-field="nama_regional" :calculate-group-value="(rowData: any) => rowData.nama_up3" />
caption="Regional" <DxColumn alignment="center" :min-width="170" data-type="text" data-field="nama_ulp" caption="Nama Unit"
css-class="custom-table-column" css-class="custom-table-column" name="namaULP" cell-template="formatText" />
:group-index="0"
name="namaRegional"
/>
<DxColumn
alignment="center"
:min-width="170"
data-type="text"
data-field="id_uid"
caption="UID"
css-class="custom-table-column"
:group-index="1"
name="namaUID"
:calculate-group-value="(rowData: any) => rowData.nama_uid"
/>
<DxColumn
alignment="center"
:min-width="170"
data-type="text"
data-field="id_up3"
caption="UP3"
css-class="custom-table-column"
:group-index="1"
name="namaUID"
:calculate-group-value="(rowData: any) => rowData.nama_up3"
/>
<DxColumn
alignment="center"
:min-width="170"
data-type="text"
data-field="nama_ulp"
caption="Nama Unit"
css-class="custom-table-column"
name="namaULP"
cell-template="formatText"
/>
</DxColumn> </DxColumn>
<DxColumn alignment="center" caption="ENS (Distribusi)" css-class="custom-table-column"> <DxColumn alignment="center" caption="ENS (Distribusi)" css-class="custom-table-column">
<DxColumn <DxColumn :width="150" alignment="center" data-field="terencana" data-type="number" caption="Terencana"
:width="150" css-class="custom-table-column" cell-template="formatNumber" />
alignment="center" <DxColumn :width="150" alignment="center" data-field="tidak_terencana" data-type="number"
data-field="terencana" caption="Tidak Terencana" css-class="custom-table-column" cell-template="formatNumber" />
data-type="number" <DxColumn :width="150" alignment="center" data-field="bencana_alam" data-type="number" caption="Bencana Alam"
caption="Terencana" css-class="custom-table-column" cell-template="formatNumber" />
css-class="custom-table-column"
cell-template="formatNumber"
/>
<DxColumn
:width="150"
alignment="center"
data-field="tidak_terencana"
data-type="number"
caption="Tidak Terencana"
css-class="custom-table-column"
cell-template="formatNumber"
/>
<DxColumn
:width="150"
alignment="center"
data-field="bencana_alam"
data-type="number"
caption="Bencana Alam"
css-class="custom-table-column"
cell-template="formatNumber"
/>
</DxColumn> </DxColumn>
<DxColumn <DxColumn :width="170" alignment="center" data-field="total" data-type="number" caption="Total"
:width="170" css-class="custom-table-column" cell-template="formatNumber" />
alignment="center" <DxColumn :min-width="170" alignment="center" data-field="kpi_ens" data-type="number" caption="KPI ENS"
data-field="total" css-class="custom-table-column" cell-template="formatNumber" />
data-type="number"
caption="Total"
css-class="custom-table-column"
cell-template="formatNumber"
/>
<DxColumn
:min-width="170"
alignment="center"
data-field="kpi_ens"
data-type="number"
caption="KPI ENS"
css-class="custom-table-column"
cell-template="formatNumber"
/>
<DxSummary> <DxSummary>
<DxTotalItem <DxTotalItem summary-type="sum" display-format="Total" show-in-column="nama_ulp"
summary-type="sum" css-class="text-white !text-left" />
display-format="Total" <DxTotalItem column="terencana" summary-type="sum" display-format="{0}" css-class="text-white !text-right"
show-in-column="nama_ulp" :customize-text="(e: any) => formatNumber(e.value)" />
css-class="text-white !text-left" <DxTotalItem column="tidak_terencana" summary-type="sum" display-format="{0}" css-class="text-white !text-right"
/> :customize-text="(e: any) => formatNumber(e.value)" />
<DxTotalItem <DxTotalItem column="bencana_alam" summary-type="sum" display-format="{0}" css-class="text-white !text-right"
column="terencana" :customize-text="(e: any) => formatNumber(e.value)" />
summary-type="sum" <DxTotalItem column="total" summary-type="sum" display-format="{0}" css-class="text-white !text-right"
display-format="{0}" :customize-text="(e: any) => formatNumber(e.value)" />
css-class="text-white !text-right" <DxTotalItem column="kpi_ens" summary-type="sum" display-format="{0}" css-class="text-white !text-right"
:customize-text="(e: any) => formatNumber(e.value)" :customize-text="(e: any) => formatNumber(e.value)" />
/>
<DxTotalItem
column="tidak_terencana"
summary-type="sum"
display-format="{0}"
css-class="text-white !text-right"
:customize-text="(e: any) => formatNumber(e.value)"
/>
<DxTotalItem
column="bencana_alam"
summary-type="sum"
display-format="{0}"
css-class="text-white !text-right"
:customize-text="(e: any) => formatNumber(e.value)"
/>
<DxTotalItem
column="total"
summary-type="sum"
display-format="{0}"
css-class="text-white !text-right"
:customize-text="(e: any) => formatNumber(e.value)"
/>
<DxTotalItem
column="kpi_ens"
summary-type="sum"
display-format="{0}"
css-class="text-white !text-right"
:customize-text="(e: any) => formatNumber(e.value)"
/>
<DxGroupItem <DxGroupItem css-class="!text-right" show-in-column="terencana" :show-in-group-footer="false"
css-class="!text-right" :align-by-column="true" column="terencana" summary-type="sum" display-format="{0}"
show-in-column="terencana" :customize-text="(e: any) => formatNumber(e.value)" />
:show-in-group-footer="false" <DxGroupItem css-class="!text-right" show-in-column="tidak_terencana" :show-in-group-footer="false"
:align-by-column="true" :align-by-column="true" column="tidak_terencana" summary-type="sum" display-format="{0}"
column="terencana" :customize-text="(e: any) => formatNumber(e.value)" />
summary-type="sum" <DxGroupItem css-class="!text-right" show-in-column="bencana_alam" :show-in-group-footer="false"
display-format="{0}" :align-by-column="true" column="bencana_alam" summary-type="sum" display-format="{0}"
:customize-text="(e: any) => formatNumber(e.value)" :customize-text="(e: any) => formatNumber(e.value)" />
/> <DxGroupItem css-class="!text-right" show-in-column="total" :show-in-group-footer="false"
<DxGroupItem :align-by-column="true" column="total" summary-type="sum" display-format="{0}"
css-class="!text-right" :customize-text="(e: any) => formatNumber(e.value)" />
show-in-column="tidak_terencana" <DxGroupItem css-class="!text-right" show-in-column="kpi_ens" :show-in-group-footer="false"
:show-in-group-footer="false" :align-by-column="true" column="kpi_ens" summary-type="sum" display-format="{0}"
:align-by-column="true" :customize-text="(e: any) => formatNumber(e.value)" />
column="tidak_terencana"
summary-type="sum"
display-format="{0}"
:customize-text="(e: any) => formatNumber(e.value)"
/>
<DxGroupItem
css-class="!text-right"
show-in-column="bencana_alam"
:show-in-group-footer="false"
:align-by-column="true"
column="bencana_alam"
summary-type="sum"
display-format="{0}"
:customize-text="(e: any) => formatNumber(e.value)"
/>
<DxGroupItem
css-class="!text-right"
show-in-column="total"
:show-in-group-footer="false"
:align-by-column="true"
column="total"
summary-type="sum"
display-format="{0}"
:customize-text="(e: any) => formatNumber(e.value)"
/>
<DxGroupItem
css-class="!text-right"
show-in-column="kpi_ens"
:show-in-group-footer="false"
:align-by-column="true"
column="kpi_ens"
summary-type="sum"
display-format="{0}"
:customize-text="(e: any) => formatNumber(e.value)"
/>
</DxSummary> </DxSummary>
<template #formatNumber="{ data }"> <template #formatNumber="{ data }">
@ -279,7 +124,8 @@ import { provideApolloClient } from '@vue/apollo-composable'
import BufferDialog from '@/components/Dialogs/BufferDialog.vue' import BufferDialog from '@/components/Dialogs/BufferDialog.vue'
import { import {
exportToPDF, exportToPDF,
exportToXLSX exportToXLSX,
exportToDOCX
} from '@/report/Monalisa/Laporan/Bulanan/MonalisaLB_EnergyNotSales' } from '@/report/Monalisa/Laporan/Bulanan/MonalisaLB_EnergyNotSales'
const client = apolloClient() const client = apolloClient()
@ -316,6 +162,7 @@ const onExporting = (e: any) => {
} else if (e.format === 'xlsx') { } else if (e.format === 'xlsx') {
exportToXLSX(reportMeta.value, e) exportToXLSX(reportMeta.value, e)
} else { } else {
exportToDOCX(reportMeta.value, data.value)
} }
} }

277
src/components/Pages/Monalisa/Laporan/Bulanan/MonalisaLB_KADDalamPelaporan.vue
View File

@ -1,239 +1,82 @@
<template> <template>
<Filters <Filters @run-report="() => exportToPDF(reportMeta, data, true)" :report-button="true" @reset-form="data = []"
@run-report="() => exportToPDF(reportMeta, data, true)" @run-search="() => filterData(filters)" class="mb-4">
:report-button="true"
@reset-form="data = []"
@run-search="() => filterData(filters)"
class="mb-4"
>
<Type2 @update:filters="(value) => (filters = value)" /> <Type2 @update:filters="(value) => (filters = value)" />
</Filters> </Filters>
<div id="data"> <div id="data">
<DxDataGrid <DxDataGrid ref="dataGridRef" :allow-column-reordering="true" class="max-h-[calc(100vh-140px)] mb-10"
ref="dataGridRef" :data-source="data" :show-column-lines="true" :show-row-lines="false" :show-borders="true"
:allow-column-reordering="true" :row-alternation-enabled="true" :hover-state-enabled="true" @selection-changed="onSelectionChanged"
class="max-h-[calc(100vh-140px)] mb-10" @exporting="onExporting" :allow-column-resizing="true" column-resizing-mode="widget" :word-wrap-enabled="true">
:data-source="data"
:show-column-lines="true"
:show-row-lines="false"
:show-borders="true"
:row-alternation-enabled="true"
:hover-state-enabled="true"
@selection-changed="onSelectionChanged"
@exporting="onExporting"
:allow-column-resizing="true"
column-resizing-mode="widget"
:word-wrap-enabled="true"
>
<DxGrouping expand-mode="rowClick" :auto-expand-all="false" /> <DxGrouping expand-mode="rowClick" :auto-expand-all="false" />
<DxSelection mode="single" /> <DxSelection mode="single" />
<DxPaging :enabled="false" /> <DxPaging :enabled="false" />
<DxScrolling column-rendering-mode="virtual" mode="virtual" /> <DxScrolling column-rendering-mode="virtual" mode="virtual" />
<DxSearchPanel :visible="true" :highlight-case-sensitive="true" /> <DxSearchPanel :visible="true" :highlight-case-sensitive="true" />
<DxExport <DxExport :enabled="true" :formats="['pdf', 'xlsx', 'document']" :allow-export-selected-data="false" />
:enabled="true"
:formats="['pdf', 'xlsx', 'document']"
:allow-export-selected-data="false"
/>
<DxColumnFixing :enabled="true" /> <DxColumnFixing :enabled="true" />
<DxColumn <DxColumn alignment="center" :min-width="170" data-type="text" data-field="nama_regional" caption="Regional"
alignment="center" css-class="custom-table-column" :group-index="0" name="namaRegional" />
:min-width="170" <DxColumn alignment="center" :min-width="170" data-type="text" data-field="id_uid" caption="UID"
data-type="text" css-class="custom-table-column" :group-index="1" name="namaUID"
data-field="nama_regional" :calculate-group-value="(rowData: any) => rowData.nama_uid" />
caption="Regional" <DxColumn alignment="center" :min-width="170" data-type="text" data-field="id_up3" caption="UP3"
css-class="custom-table-column" css-class="custom-table-column" :group-index="1" name="namaUID"
:group-index="0" :calculate-group-value="(rowData: any) => rowData.nama_up3" />
name="namaRegional" <DxColumn alignment="center" :min-width="170" data-type="text" data-field="nama_ulp" caption="Nama Unit"
/> css-class="custom-table-column" name="namaULP" cell-template="formatText" />
<DxColumn <DxColumn alignment="center" caption="Kepatuhan dan Akurasi APKT" css-class="custom-table-column">
alignment="center"
:min-width="170"
data-type="text"
data-field="id_uid"
caption="UID"
css-class="custom-table-column"
:group-index="1"
name="namaUID"
:calculate-group-value="(rowData: any) => rowData.nama_uid"
/>
<DxColumn
alignment="center"
:min-width="170"
data-type="text"
data-field="id_up3"
caption="UP3"
css-class="custom-table-column"
:group-index="1"
name="namaUID"
:calculate-group-value="(rowData: any) => rowData.nama_up3"
/>
<DxColumn
alignment="center"
:min-width="170"
data-type="text"
data-field="nama_ulp"
caption="Nama Unit"
css-class="custom-table-column"
name="namaULP"
cell-template="formatText"
/>
<DxColumn
alignment="center"
caption="Kepatuhan dan Akurasi APKT"
css-class="custom-table-column"
>
<DxColumn alignment="center" caption="Gangguan Berulang" css-class="custom-table-column"> <DxColumn alignment="center" caption="Gangguan Berulang" css-class="custom-table-column">
<DxColumn <DxColumn :width="150" alignment="center" data-field="gangguan_berulang" data-type="number"
:width="150" :caption="`${getMonthNameShort(currentMonth)}, ${currentYear}`" css-class="custom-table-column"
alignment="center" cell-template="formatNumber" />
data-field="gangguan_berulang" <DxColumn :width="150" alignment="center" data-field="gangguan_total" data-type="number"
data-type="number" caption="Total Gangguan" css-class="custom-table-column" cell-template="formatNumber" />
:caption="`${getMonthNameShort(currentMonth)}, ${currentYear}`"
css-class="custom-table-column"
cell-template="formatNumber"
/>
<DxColumn
:width="150"
alignment="center"
data-field="gangguan_total"
data-type="number"
caption="Total Gangguan"
css-class="custom-table-column"
cell-template="formatNumber"
/>
</DxColumn> </DxColumn>
<DxColumn alignment="center" caption="Keluhan Berulang" css-class="custom-table-column"> <DxColumn alignment="center" caption="Keluhan Berulang" css-class="custom-table-column">
<DxColumn <DxColumn :width="150" alignment="center" data-field="keluhan_berulang" data-type="number"
:width="150" :caption="`${getMonthNameShort(currentMonth)}, ${currentYear}`" css-class="custom-table-column"
alignment="center" cell-template="formatNumber" />
data-field="keluhan_berulang" <DxColumn :width="150" alignment="center" data-field="keluhan_total" data-type="number"
data-type="number" caption="Total Keluhan" css-class="custom-table-column" cell-template="formatNumber" />
:caption="`${getMonthNameShort(currentMonth)}, ${currentYear}`"
css-class="custom-table-column"
cell-template="formatNumber"
/>
<DxColumn
:width="150"
alignment="center"
data-field="keluhan_total"
data-type="number"
caption="Total Keluhan"
css-class="custom-table-column"
cell-template="formatNumber"
/>
</DxColumn> </DxColumn>
</DxColumn> </DxColumn>
<DxColumn <DxColumn :min-width="150" alignment="center" data-field="komplain_pelanggan" data-type="number"
:min-width="150" caption="Komplain Pelanggan %" css-class="custom-table-column" cell-template="formatPercentage" />
alignment="center"
data-field="komplain_pelanggan"
data-type="number"
caption="Komplain Pelanggan %"
css-class="custom-table-column"
cell-template="formatPercentage"
/>
<DxSummary> <DxSummary>
<DxTotalItem <DxTotalItem summary-type="sum" display-format="Total" show-in-column="nama_ulp"
summary-type="sum" css-class="text-white !text-left" />
display-format="Total" <DxTotalItem column="gangguan_berulang" summary-type="sum" display-format="{0}"
show-in-column="nama_ulp" css-class="text-white !text-right" :customize-text="(e: any) => formatNumber(e.value)" />
css-class="text-white !text-left" <DxTotalItem column="gangguan_total" summary-type="sum" display-format="{0}" css-class="text-white !text-right"
/> :customize-text="(e: any) => formatNumber(e.value)" />
<DxTotalItem <DxTotalItem column="keluhan_berulang" summary-type="sum" display-format="{0}"
column="gangguan_berulang" css-class="text-white !text-right" :customize-text="(e: any) => formatNumber(e.value)" />
summary-type="sum" <DxTotalItem column="keluhan_total" summary-type="sum" display-format="{0}" css-class="text-white !text-right"
display-format="{0}" :customize-text="(e: any) => formatNumber(e.value)" />
css-class="text-white !text-right" <DxTotalItem column="komplain_pelanggan" summary-type="sum" display-format="{0}"
:customize-text="(e: any) => formatNumber(e.value)" css-class="text-white !text-right" :customize-text="(e: any) => (parseFloat(e.value.toString()) ? formatPercentage(e.value) : '0%')
/> " />
<DxTotalItem
column="gangguan_total"
summary-type="sum"
display-format="{0}"
css-class="text-white !text-right"
:customize-text="(e: any) => formatNumber(e.value)"
/>
<DxTotalItem
column="keluhan_berulang"
summary-type="sum"
display-format="{0}"
css-class="text-white !text-right"
:customize-text="(e: any) => formatNumber(e.value)"
/>
<DxTotalItem
column="keluhan_total"
summary-type="sum"
display-format="{0}"
css-class="text-white !text-right"
:customize-text="(e: any) => formatNumber(e.value)"
/>
<DxTotalItem
column="komplain_pelanggan"
summary-type="sum"
display-format="{0}"
css-class="text-white !text-right"
:customize-text="
(e: any) => (parseFloat(e.value.toString()) ? formatPercentage(e.value) : '0%')
"
/>
<DxGroupItem <DxGroupItem css-class="!text-right" show-in-column="gangguan_berulang" :show-in-group-footer="false"
css-class="!text-right" :align-by-column="true" column="gangguan_berulang" summary-type="sum" display-format="{0}"
show-in-column="gangguan_berulang" :customize-text="(e: any) => formatNumber(e.value)" />
:show-in-group-footer="false" <DxGroupItem css-class="!text-right" show-in-column="gangguan_total" :show-in-group-footer="false"
:align-by-column="true" :align-by-column="true" column="gangguan_total" summary-type="sum" display-format="{0}"
column="gangguan_berulang" :customize-text="(e: any) => formatNumber(e.value)" />
summary-type="sum" <DxGroupItem css-class="!text-right" show-in-column="keluhan_berulang" :show-in-group-footer="false"
display-format="{0}" :align-by-column="true" column="keluhan_berulang" summary-type="sum" display-format="{0}"
:customize-text="(e: any) => formatNumber(e.value)" :customize-text="(e: any) => formatNumber(e.value)" />
/> <DxGroupItem css-class="!text-right" show-in-column="keluhan_total" :show-in-group-footer="false"
<DxGroupItem :align-by-column="true" column="keluhan_total" summary-type="sum" display-format="{0}"
css-class="!text-right" :customize-text="(e: any) => formatNumber(e.value)" />
show-in-column="gangguan_total" <DxGroupItem css-class="!text-right" show-in-column="komplain_pelanggan" :show-in-group-footer="false"
:show-in-group-footer="false" :align-by-column="true" column="komplain_pelanggan" summary-type="sum" display-format="{0}" :customize-text="(e: any) => (parseFloat(e.value.toString()) ? formatPercentage(e.value) : '0%')
:align-by-column="true" " />
column="gangguan_total"
summary-type="sum"
display-format="{0}"
:customize-text="(e: any) => formatNumber(e.value)"
/>
<DxGroupItem
css-class="!text-right"
show-in-column="keluhan_berulang"
:show-in-group-footer="false"
:align-by-column="true"
column="keluhan_berulang"
summary-type="sum"
display-format="{0}"
:customize-text="(e: any) => formatNumber(e.value)"
/>
<DxGroupItem
css-class="!text-right"
show-in-column="keluhan_total"
:show-in-group-footer="false"
:align-by-column="true"
column="keluhan_total"
summary-type="sum"
display-format="{0}"
:customize-text="(e: any) => formatNumber(e.value)"
/>
<DxGroupItem
css-class="!text-right"
show-in-column="komplain_pelanggan"
:show-in-group-footer="false"
:align-by-column="true"
column="komplain_pelanggan"
summary-type="sum"
display-format="{0}"
:customize-text="
(e: any) => (parseFloat(e.value.toString()) ? formatPercentage(e.value) : '0%')
"
/>
</DxSummary> </DxSummary>
<template #formatNumber="{ data }"> <template #formatNumber="{ data }">
@ -292,7 +135,8 @@ import { provideApolloClient } from '@vue/apollo-composable'
import BufferDialog from '@/components/Dialogs/BufferDialog.vue' import BufferDialog from '@/components/Dialogs/BufferDialog.vue'
import { import {
exportToPDF, exportToPDF,
exportToXLSX exportToXLSX,
exportToDOCX
} from '@/report/Monalisa/Laporan/Bulanan/MonalisaLB_KADDalamPelaporan' } from '@/report/Monalisa/Laporan/Bulanan/MonalisaLB_KADDalamPelaporan'
const client = apolloClient() const client = apolloClient()
@ -331,6 +175,7 @@ const onExporting = (e: any) => {
} else if (e.format === 'xlsx') { } else if (e.format === 'xlsx') {
exportToXLSX(reportMeta.value, e) exportToXLSX(reportMeta.value, e)
} else { } else {
exportToDOCX(reportMeta.value, data.value)
} }
} }
const dataGridRef = ref<DxDataGrid | null>(null) const dataGridRef = ref<DxDataGrid | null>(null)

7
src/components/Pages/Monalisa/Laporan/Bulanan/MonalisaLB_PenurunanJumlahKomplain.vue
View File

@ -1190,7 +1190,10 @@ import {
exportToPDF, exportToPDF,
exportToXLSX, exportToXLSX,
exportDetailToPDF, exportDetailToPDF,
exportDetailToXLSX exportDetailToXLSX,
exportToDOCX,
exportDetailToDOCX,
} from '@/report/Monalisa/Laporan/Bulanan/MonalisaLB_PenurunanJumlahKomplain' } from '@/report/Monalisa/Laporan/Bulanan/MonalisaLB_PenurunanJumlahKomplain'
import { formatWaktu } from '@/components/Form/FiltersType/reference' import { formatWaktu } from '@/components/Form/FiltersType/reference'
@ -1247,6 +1250,7 @@ const onExporting = (e: any) => {
} else if (e.format === 'xlsx') { } else if (e.format === 'xlsx') {
exportToXLSX(reportMeta.value, e) exportToXLSX(reportMeta.value, e)
} else { } else {
exportToDOCX(reportMeta.value, data.value)
} }
} }
@ -1256,6 +1260,7 @@ const onExportingDetail = (e: any) => {
} else if (e.format === 'xlsx') { } else if (e.format === 'xlsx') {
exportDetailToXLSX(reportMeta.value, e) exportDetailToXLSX(reportMeta.value, e)
} else { } else {
exportToDOCX(reportMeta.value, data.value)
} }
} }

4
src/components/Pages/Monalisa/Laporan/Kumulatif/MonalisaLK_AgingComplaint.vue
View File

@ -360,7 +360,8 @@ import { formatNumber, formatPercentage, isNumber } from '@/utils/numbers'
import BufferDialog from '@/components/Dialogs/BufferDialog.vue' import BufferDialog from '@/components/Dialogs/BufferDialog.vue'
import { import {
exportToPDF, exportToPDF,
exportToXLSX exportToXLSX,
exportToDOCX
} from '@/report/Monalisa/Laporan/Kumulatif/MonalisaLK_AgingComplaint' } from '@/report/Monalisa/Laporan/Kumulatif/MonalisaLK_AgingComplaint'
const position = { of: '#data' } const position = { of: '#data' }
@ -395,6 +396,7 @@ const onExporting = (e: any) => {
} else if (e.format === 'xlsx') { } else if (e.format === 'xlsx') {
exportToXLSX(reportMeta.value, e) exportToXLSX(reportMeta.value, e)
} else { } else {
exportToDOCX(reportMeta.value, data.value)
} }
} }
const getDetail = async () => { const getDetail = async () => {

5
src/components/Pages/Monalisa/Laporan/Kumulatif/MonalisaLK_EnergyNotSales.vue
View File

@ -279,7 +279,9 @@ import { provideApolloClient } from '@vue/apollo-composable'
import BufferDialog from '@/components/Dialogs/BufferDialog.vue' import BufferDialog from '@/components/Dialogs/BufferDialog.vue'
import { import {
exportToPDF, exportToPDF,
exportToXLSX exportToXLSX,
exportToDOCX
} from '@/report/Monalisa/Laporan/Kumulatif/MonalisaLK_EnergyNotSales' } from '@/report/Monalisa/Laporan/Kumulatif/MonalisaLK_EnergyNotSales'
const client = apolloClient() const client = apolloClient()
@ -316,6 +318,7 @@ const onExporting = (e: any) => {
} else if (e.format === 'xlsx') { } else if (e.format === 'xlsx') {
exportToXLSX(reportMeta.value, e) exportToXLSX(reportMeta.value, e)
} else { } else {
exportToDOCX(reportMeta.value, e)
} }
} }
const getDetail = async () => { const getDetail = async () => {

7
src/components/Pages/Monalisa/Laporan/Kumulatif/MonalisaLK_KDADPelaporan.vue
View File

@ -291,7 +291,9 @@ import { provideApolloClient } from '@vue/apollo-composable'
import BufferDialog from '@/components/Dialogs/BufferDialog.vue' import BufferDialog from '@/components/Dialogs/BufferDialog.vue'
import { import {
exportToPDF, exportToPDF,
exportToXLSX exportToXLSX,
exportToDOCX
} from '@/report/Monalisa/Laporan/Kumulatif/MonalisaLK_KDADPelaporan' } from '@/report/Monalisa/Laporan/Kumulatif/MonalisaLK_KDADPelaporan'
const client = apolloClient() const client = apolloClient()
@ -330,7 +332,10 @@ const onExporting = (e: any) => {
} else if (e.format === 'xlsx') { } else if (e.format === 'xlsx') {
exportToXLSX(reportMeta.value, e) exportToXLSX(reportMeta.value, e)
} else { } else {
exportToDOCX(reportMeta.value, data.value)
} }
} }
const getDetail = async () => { const getDetail = async () => {
const dateValue = filters.value.periode.split(' s/d ') const dateValue = filters.value.periode.split(' s/d ')

758
src/components/Pages/Monalisa/Laporan/Kumulatif/MonalisaLK_PenurunanJumlahKomplain.vue
View File

@ -1,623 +1,196 @@
<template> <template>
<Filters <Filters @run-report="() => exportToPDF(reportMeta, data, true)" @reset-form="data = []"
@run-report="() => exportToPDF(reportMeta, data, true)" @run-search="() => filterData(filters)" :report-button="true" class="mb-4">
@reset-form="data = []"
@run-search="() => filterData(filters)"
:report-button="true"
class="mb-4"
>
<Type2 @update:filters="(value) => (filters = value)" /> <Type2 @update:filters="(value) => (filters = value)" />
</Filters> </Filters>
<div id="data"> <div id="data">
<DxDataGrid <DxDataGrid ref="dataGridRef" :allow-column-reordering="true" class="max-h-[calc(100vh-140px)] mb-10"
ref="dataGridRef" :data-source="data" :show-column-lines="true" :show-row-lines="false" :show-borders="true"
:allow-column-reordering="true" :row-alternation-enabled="true" :hover-state-enabled="true" @selection-changed="onDataSelectionChanged"
class="max-h-[calc(100vh-140px)] mb-10" :column-width="100" @exporting="onExporting" :allow-column-resizing="true" column-resizing-mode="widget"
:data-source="data" :word-wrap-enabled="true">
:show-column-lines="true"
:show-row-lines="false"
:show-borders="true"
:row-alternation-enabled="true"
:hover-state-enabled="true"
@selection-changed="onDataSelectionChanged"
:column-width="100"
@exporting="onExporting"
:allow-column-resizing="true"
column-resizing-mode="widget"
:word-wrap-enabled="true"
>
<DxGrouping expand-mode="rowClick" :auto-expand-all="false" /> <DxGrouping expand-mode="rowClick" :auto-expand-all="false" />
<DxSelection mode="single" /> <DxSelection mode="single" />
<DxPaging :enabled="false" /> <DxPaging :enabled="false" />
<DxScrolling column-rendering-mode="virtual" mode="virtual" /> <DxScrolling column-rendering-mode="virtual" mode="virtual" />
<DxSearchPanel :visible="true" :highlight-case-sensitive="true" /> <DxSearchPanel :visible="true" :highlight-case-sensitive="true" />
<DxExport <DxExport :enabled="true" :formats="['pdf', 'xlsx', 'document']" :allow-export-selected-data="false" />
:enabled="true"
:formats="['pdf', 'xlsx', 'document']"
:allow-export-selected-data="false"
/>
<DxColumnFixing :enabled="true" /> <DxColumnFixing :enabled="true" />
<DxColumn <DxColumn alignment="center" :min-width="170" data-type="text" data-field="nama_regional" caption="Regional"
alignment="center" css-class="custom-table-column" :group-index="0" name="namaRegional" />
:min-width="170" <DxColumn alignment="center" :min-width="170" data-type="text" data-field="id_uid" caption="UID"
data-type="text" css-class="custom-table-column" :group-index="1" name="namaUID"
data-field="nama_regional" :calculate-group-value="(rowData: any) => rowData.nama_uid" />
caption="Regional" <DxColumn alignment="center" :min-width="170" data-type="text" data-field="id_up3" caption="UP3"
css-class="custom-table-column" css-class="custom-table-column" :group-index="1" name="namaUID"
:group-index="0" :calculate-group-value="(rowData: any) => rowData.nama_up3" />
name="namaRegional" <DxColumn alignment="center" :min-width="170" data-type="text" data-field="nama_ulp" caption="Nama Unit"
/> css-class="custom-table-column" name="namaULP" cell-template="formatText" />
<DxColumn
alignment="center"
:min-width="170"
data-type="text"
data-field="id_uid"
caption="UID"
css-class="custom-table-column"
:group-index="1"
name="namaUID"
:calculate-group-value="(rowData: any) => rowData.nama_uid"
/>
<DxColumn
alignment="center"
:min-width="170"
data-type="text"
data-field="id_up3"
caption="UP3"
css-class="custom-table-column"
:group-index="1"
name="namaUID"
:calculate-group-value="(rowData: any) => rowData.nama_up3"
/>
<DxColumn
alignment="center"
:min-width="170"
data-type="text"
data-field="nama_ulp"
caption="Nama Unit"
css-class="custom-table-column"
name="namaULP"
cell-template="formatText"
/>
<DxColumn <DxColumn alignment="center" :caption="`s.d ${getMonthName(currentMonth)} ${lastYear}`"
alignment="center" css-class="custom-table-column">
:caption="`s.d ${getMonthName(currentMonth)} ${lastYear}`" <DxColumn :width="120" alignment="center" data-field="total_keluhan_tahun_sebelumnya" data-type="number"
css-class="custom-table-column" caption="Keluhan" css-class="custom-table-column" name="keluhanBulanLalu" />
> <DxColumn :width="120" alignment="center" data-field="total_gangguan_tahun_sebelumnya" data-type="number"
<DxColumn caption="Gangguan" css-class="custom-table-column" />
:width="120"
alignment="center"
data-field="total_keluhan_tahun_sebelumnya"
data-type="number"
caption="Keluhan"
css-class="custom-table-column"
name="keluhanBulanLalu"
/>
<DxColumn
:width="120"
alignment="center"
data-field="total_gangguan_tahun_sebelumnya"
data-type="number"
caption="Gangguan"
css-class="custom-table-column"
/>
<DxColumn alignment="center" caption="Informasi" css-class="custom-table-column"> <DxColumn alignment="center" caption="Informasi" css-class="custom-table-column">
<DxColumn <DxColumn :width="120" alignment="center" data-field="total_keluhan_informasi_tahun_sebelumnya"
:width="120" data-type="number" caption="Keluhan" css-class="custom-table-column" />
alignment="center" <DxColumn :width="120" alignment="center" data-field="total_gangguan_informasi_tahun_sebelumnya"
data-field="total_keluhan_informasi_tahun_sebelumnya" data-type="number" caption="Gangguan" css-class="custom-table-column" />
data-type="number" <DxColumn :width="120" alignment="center" data-field="total_informasi_tahun_sebelumnya" data-type="number"
caption="Keluhan" caption="Total" css-class="custom-table-column" />
css-class="custom-table-column"
/>
<DxColumn
:width="120"
alignment="center"
data-field="total_gangguan_informasi_tahun_sebelumnya"
data-type="number"
caption="Gangguan"
css-class="custom-table-column"
/>
<DxColumn
:width="120"
alignment="center"
data-field="total_informasi_tahun_sebelumnya"
data-type="number"
caption="Total"
css-class="custom-table-column"
/>
</DxColumn> </DxColumn>
<DxColumn <DxColumn alignment="center" caption="Total Komplain" css-class="custom-table-column"
alignment="center" data-field="total_tahun_sebelumnya" data-type="number" />
caption="Total Komplain"
css-class="custom-table-column"
data-field="total_tahun_sebelumnya"
data-type="number"
/>
</DxColumn> </DxColumn>
<DxColumn <DxColumn alignment="center" :caption="`s.d ${getMonthName(currentMonth)} ${currentYear}`"
alignment="center" css-class="custom-table-column">
:caption="`s.d ${getMonthName(currentMonth)} ${currentYear}`" <DxColumn :width="120" alignment="center" data-field="total_keluhan_tahun_ini" data-type="number"
css-class="custom-table-column" caption="Keluhan" css-class="custom-table-column" cell-template="formatNumber" />
> <DxColumn :width="120" alignment="center" data-field="total_gangguan_tahun_ini" data-type="number"
<DxColumn caption="Gangguan" css-class="custom-table-column" cell-template="formatNumber" />
:width="120"
alignment="center"
data-field="total_keluhan_tahun_ini"
data-type="number"
caption="Keluhan"
css-class="custom-table-column"
cell-template="formatNumber"
/>
<DxColumn
:width="120"
alignment="center"
data-field="total_gangguan_tahun_ini"
data-type="number"
caption="Gangguan"
css-class="custom-table-column"
cell-template="formatNumber"
/>
<DxColumn alignment="center" caption="Informasi" css-class="custom-table-column"> <DxColumn alignment="center" caption="Informasi" css-class="custom-table-column">
<DxColumn <DxColumn :width="120" alignment="center" data-field="total_keluhan_informasi_tahun_ini" data-type="number"
:width="120" caption="Keluhan" css-class="custom-table-column" cell-template="formatNumber" />
alignment="center" <DxColumn :width="120" alignment="center" data-field="total_gangguan_informasi_tahun_ini" data-type="number"
data-field="total_keluhan_informasi_tahun_ini" caption="Gangguan" css-class="custom-table-column" cell-template="formatNumber" />
data-type="number" <DxColumn :width="120" alignment="center" data-field="total_informasi_tahun_ini" data-type="number"
caption="Keluhan" caption="Total" css-class="custom-table-column" cell-template="formatNumber" />
css-class="custom-table-column"
cell-template="formatNumber"
/>
<DxColumn
:width="120"
alignment="center"
data-field="total_gangguan_informasi_tahun_ini"
data-type="number"
caption="Gangguan"
css-class="custom-table-column"
cell-template="formatNumber"
/>
<DxColumn
:width="120"
alignment="center"
data-field="total_informasi_tahun_ini"
data-type="number"
caption="Total"
css-class="custom-table-column"
cell-template="formatNumber"
/>
</DxColumn> </DxColumn>
<DxColumn <DxColumn alignment="center" caption="Total Komplain" css-class="custom-table-column"
alignment="center" data-field="total_tahun_ini" data-type="number" cell-template="formatNumber" />
caption="Total Komplain"
css-class="custom-table-column"
data-field="total_tahun_ini"
data-type="number"
cell-template="formatNumber"
/>
</DxColumn> </DxColumn>
<DxColumn alignment="center" caption="Delta Penurunan" css-class="custom-table-column"> <DxColumn alignment="center" caption="Delta Penurunan" css-class="custom-table-column">
<DxColumn <DxColumn :width="150" alignment="center" data-field="delta_keluhan" data-type="number" caption="Keluhan"
:width="150" css-class="custom-table-column" cell-template="formatNumber" />
alignment="center" <DxColumn :width="150" alignment="center" data-field="delta_gangguan" data-type="number" caption="Gangguan"
data-field="delta_keluhan" css-class="custom-table-column" cell-template="formatNumber" />
data-type="number" <DxColumn :width="150" alignment="center" data-field="delta_informasi" data-type="number" caption="Informasi"
caption="Keluhan" css-class="custom-table-column" cell-template="formatNumber" />
css-class="custom-table-column"
cell-template="formatNumber"
/>
<DxColumn
:width="150"
alignment="center"
data-field="delta_gangguan"
data-type="number"
caption="Gangguan"
css-class="custom-table-column"
cell-template="formatNumber"
/>
<DxColumn
:width="150"
alignment="center"
data-field="delta_informasi"
data-type="number"
caption="Informasi"
css-class="custom-table-column"
cell-template="formatNumber"
/>
</DxColumn> </DxColumn>
<DxColumn alignment="center" caption="% Penurunan YoY" css-class="custom-table-column"> <DxColumn alignment="center" caption="% Penurunan YoY" css-class="custom-table-column">
<DxColumn <DxColumn :width="150" alignment="center" data-field="persen_delta_keluhan" data-type="number" caption="Keluhan"
:width="150" css-class="custom-table-column" cell-template="formatPercentage" />
alignment="center" <DxColumn :width="150" alignment="center" data-field="persen_delta_gangguan" data-type="number"
data-field="persen_delta_keluhan" caption="Gangguan" css-class="custom-table-column" cell-template="formatPercentage" />
data-type="number" <DxColumn :width="150" alignment="center" data-field="persen_delta_informasi" data-type="number"
caption="Keluhan" caption="Informasi" css-class="custom-table-column" cell-template="formatPercentage" />
css-class="custom-table-column" <DxColumn :width="150" alignment="center" data-field="persen_delta_total" data-type="number" caption="% Total"
cell-template="formatPercentage" css-class="custom-table-column" cell-template="formatPercentage" />
/>
<DxColumn
:width="150"
alignment="center"
data-field="persen_delta_gangguan"
data-type="number"
caption="Gangguan"
css-class="custom-table-column"
cell-template="formatPercentage"
/>
<DxColumn
:width="150"
alignment="center"
data-field="persen_delta_informasi"
data-type="number"
caption="Informasi"
css-class="custom-table-column"
cell-template="formatPercentage"
/>
<DxColumn
:width="150"
alignment="center"
data-field="persen_delta_total"
data-type="number"
caption="% Total"
css-class="custom-table-column"
cell-template="formatPercentage"
/>
</DxColumn> </DxColumn>
<DxSummary> <DxSummary>
<DxTotalItem <DxTotalItem summary-type="sum" display-format="Total" show-in-column="nama_ulp"
summary-type="sum" css-class="text-white !text-left" />
display-format="Total" <DxTotalItem column="total_keluhan_tahun_sebelumnya" summary-type="sum" display-format="{0}"
show-in-column="nama_ulp" css-class="text-white !text-right" :customize-text="(e: any) => formatNumber(e.value)" />
css-class="text-white !text-left" <DxTotalItem column="total_gangguan_tahun_sebelumnya" summary-type="sum" display-format="{0}"
/> css-class="text-white !text-right" :customize-text="(e: any) => formatNumber(e.value)" />
<DxTotalItem <DxTotalItem column="total_keluhan_informasi_tahun_sebelumnya" summary-type="sum" display-format="{0}"
column="total_keluhan_tahun_sebelumnya" css-class="text-white !text-right" :customize-text="(e: any) => formatNumber(e.value)" />
summary-type="sum" <DxTotalItem column="total_gangguan_informasi_tahun_sebelumnya" summary-type="sum" display-format="{0}"
display-format="{0}" css-class="text-white !text-right" :customize-text="(e: any) => formatNumber(e.value)" />
css-class="text-white !text-right" <DxTotalItem column="total_informasi_tahun_sebelumnya" summary-type="sum" display-format="{0}"
:customize-text="(e: any) => formatNumber(e.value)" css-class="text-white !text-right" :customize-text="(e: any) => formatNumber(e.value)" />
/> <DxTotalItem column="total_tahun_sebelumnya" summary-type="sum" display-format="{0}"
<DxTotalItem css-class="text-white !text-right" :customize-text="(e: any) => formatNumber(e.value)" />
column="total_gangguan_tahun_sebelumnya" <DxTotalItem column="total_keluhan_tahun_ini" summary-type="sum" display-format="{0}"
summary-type="sum" css-class="text-white !text-right" :customize-text="(e: any) => formatNumber(e.value)" />
display-format="{0}" <DxTotalItem column="total_gangguan_tahun_ini" summary-type="sum" display-format="{0}"
css-class="text-white !text-right" css-class="text-white !text-right" :customize-text="(e: any) => formatNumber(e.value)" />
:customize-text="(e: any) => formatNumber(e.value)" <DxTotalItem column="total_keluhan_informasi_tahun_ini" summary-type="sum" display-format="{0}"
/> css-class="text-white !text-right" :customize-text="(e: any) => formatNumber(e.value)" />
<DxTotalItem <DxTotalItem column="total_gangguan_informasi_tahun_ini" summary-type="sum" display-format="{0}"
column="total_keluhan_informasi_tahun_sebelumnya" css-class="text-white !text-right" :customize-text="(e: any) => formatNumber(e.value)" />
summary-type="sum" <DxTotalItem column="total_informasi_tahun_ini" summary-type="sum" display-format="{0}"
display-format="{0}" css-class="text-white !text-right" :customize-text="(e: any) => formatNumber(e.value)" />
css-class="text-white !text-right" <DxTotalItem column="total_tahun_ini" summary-type="sum" display-format="{0}" css-class="text-white !text-right"
:customize-text="(e: any) => formatNumber(e.value)" :customize-text="(e: any) => formatNumber(e.value)" />
/> <DxTotalItem column="delta_keluhan" summary-type="sum" display-format="{0}" css-class="text-white !text-right"
<DxTotalItem :customize-text="(e: any) => formatNumber(e.value)" />
column="total_gangguan_informasi_tahun_sebelumnya" <DxTotalItem column="delta_gangguan" summary-type="sum" display-format="{0}" css-class="text-white !text-right"
summary-type="sum" :customize-text="(e: any) => formatNumber(e.value)" />
display-format="{0}" <DxTotalItem column="delta_informasi" summary-type="sum" display-format="{0}" css-class="text-white !text-right"
css-class="text-white !text-right" :customize-text="(e: any) => formatNumber(e.value)" />
:customize-text="(e: any) => formatNumber(e.value)" <DxTotalItem column="persen_delta_keluhan" summary-type="avg" display-format="{0}"
/> css-class="text-white !text-right" :customize-text="(e: any) => (parseFloat(e.value.toString()) ? formatPercentage(e.value) : '0%')
<DxTotalItem " />
column="total_informasi_tahun_sebelumnya" <DxTotalItem column="persen_delta_gangguan" summary-type="avg" display-format="{0}"
summary-type="sum" css-class="text-white !text-right" :customize-text="(e: any) => (parseFloat(e.value.toString()) ? formatPercentage(e.value) : '0%')
display-format="{0}" " />
css-class="text-white !text-right" <DxTotalItem column="persen_delta_informasi" summary-type="avg" display-format="{0}"
:customize-text="(e: any) => formatNumber(e.value)" css-class="text-white !text-right" :customize-text="(e: any) => (parseFloat(e.value.toString()) ? formatPercentage(e.value) : '0%')
/> " />
<DxTotalItem <DxTotalItem column="persen_delta_total" summary-type="avg" display-format="{0}"
column="total_tahun_sebelumnya" css-class="text-white !text-right" :customize-text="(e: any) => (parseFloat(e.value.toString()) ? formatPercentage(e.value) : '0%')
summary-type="sum" " />
display-format="{0}"
css-class="text-white !text-right"
:customize-text="(e: any) => formatNumber(e.value)"
/>
<DxTotalItem
column="total_keluhan_tahun_ini"
summary-type="sum"
display-format="{0}"
css-class="text-white !text-right"
:customize-text="(e: any) => formatNumber(e.value)"
/>
<DxTotalItem
column="total_gangguan_tahun_ini"
summary-type="sum"
display-format="{0}"
css-class="text-white !text-right"
:customize-text="(e: any) => formatNumber(e.value)"
/>
<DxTotalItem
column="total_keluhan_informasi_tahun_ini"
summary-type="sum"
display-format="{0}"
css-class="text-white !text-right"
:customize-text="(e: any) => formatNumber(e.value)"
/>
<DxTotalItem
column="total_gangguan_informasi_tahun_ini"
summary-type="sum"
display-format="{0}"
css-class="text-white !text-right"
:customize-text="(e: any) => formatNumber(e.value)"
/>
<DxTotalItem
column="total_informasi_tahun_ini"
summary-type="sum"
display-format="{0}"
css-class="text-white !text-right"
:customize-text="(e: any) => formatNumber(e.value)"
/>
<DxTotalItem
column="total_tahun_ini"
summary-type="sum"
display-format="{0}"
css-class="text-white !text-right"
:customize-text="(e: any) => formatNumber(e.value)"
/>
<DxTotalItem
column="delta_keluhan"
summary-type="sum"
display-format="{0}"
css-class="text-white !text-right"
:customize-text="(e: any) => formatNumber(e.value)"
/>
<DxTotalItem
column="delta_gangguan"
summary-type="sum"
display-format="{0}"
css-class="text-white !text-right"
:customize-text="(e: any) => formatNumber(e.value)"
/>
<DxTotalItem
column="delta_informasi"
summary-type="sum"
display-format="{0}"
css-class="text-white !text-right"
:customize-text="(e: any) => formatNumber(e.value)"
/>
<DxTotalItem
column="persen_delta_keluhan"
summary-type="avg"
display-format="{0}"
css-class="text-white !text-right"
:customize-text="
(e: any) => (parseFloat(e.value.toString()) ? formatPercentage(e.value) : '0%')
"
/>
<DxTotalItem
column="persen_delta_gangguan"
summary-type="avg"
display-format="{0}"
css-class="text-white !text-right"
:customize-text="
(e: any) => (parseFloat(e.value.toString()) ? formatPercentage(e.value) : '0%')
"
/>
<DxTotalItem
column="persen_delta_informasi"
summary-type="avg"
display-format="{0}"
css-class="text-white !text-right"
:customize-text="
(e: any) => (parseFloat(e.value.toString()) ? formatPercentage(e.value) : '0%')
"
/>
<DxTotalItem
column="persen_delta_total"
summary-type="avg"
display-format="{0}"
css-class="text-white !text-right"
:customize-text="
(e: any) => (parseFloat(e.value.toString()) ? formatPercentage(e.value) : '0%')
"
/>
<DxGroupItem <DxGroupItem css-class="!text-right" show-in-column="total_keluhan_tahun_sebelumnya"
css-class="!text-right" :show-in-group-footer="false" :align-by-column="true" column="total_keluhan_tahun_sebelumnya"
show-in-column="total_keluhan_tahun_sebelumnya" summary-type="sum" display-format="{0}" :customize-text="(e: any) => formatNumber(e.value)" />
:show-in-group-footer="false" <DxGroupItem css-class="!text-right" show-in-column="total_gangguan_tahun_sebelumnya"
:align-by-column="true" :show-in-group-footer="false" :align-by-column="true" column="total_gangguan_tahun_sebelumnya"
column="total_keluhan_tahun_sebelumnya" summary-type="sum" display-format="{0}" :customize-text="(e: any) => formatNumber(e.value)" />
summary-type="sum" <DxGroupItem css-class="!text-right" show-in-column="total_keluhan_informasi_tahun_sebelumnya"
display-format="{0}" :show-in-group-footer="false" :align-by-column="true" column="total_keluhan_informasi_tahun_sebelumnya"
:customize-text="(e: any) => formatNumber(e.value)" summary-type="sum" display-format="{0}" :customize-text="(e: any) => formatNumber(e.value)" />
/> <DxGroupItem css-class="!text-right" show-in-column="total_gangguan_informasi_tahun_sebelumnya"
<DxGroupItem :show-in-group-footer="false" :align-by-column="true" column="total_gangguan_informasi_tahun_sebelumnya"
css-class="!text-right" summary-type="sum" display-format="{0}" :customize-text="(e: any) => formatNumber(e.value)" />
show-in-column="total_gangguan_tahun_sebelumnya" <DxGroupItem css-class="!text-right" show-in-column="total_informasi_tahun_sebelumnya"
:show-in-group-footer="false" :show-in-group-footer="false" :align-by-column="true" column="total_informasi_tahun_sebelumnya"
:align-by-column="true" summary-type="sum" display-format="{0}" :customize-text="(e: any) => formatNumber(e.value)" />
column="total_gangguan_tahun_sebelumnya" <DxGroupItem css-class="!text-right" show-in-column="total_tahun_sebelumnya" :show-in-group-footer="false"
summary-type="sum" :align-by-column="true" column="total_tahun_sebelumnya" summary-type="sum" display-format="{0}"
display-format="{0}" :customize-text="(e: any) => formatNumber(e.value)" />
:customize-text="(e: any) => formatNumber(e.value)" <DxGroupItem css-class="!text-right" show-in-column="total_keluhan_tahun_ini" :show-in-group-footer="false"
/> :align-by-column="true" column="total_keluhan_tahun_ini" summary-type="sum" display-format="{0}"
<DxGroupItem :customize-text="(e: any) => formatNumber(e.value)" />
css-class="!text-right" <DxGroupItem css-class="!text-right" show-in-column="total_gangguan_tahun_ini" :show-in-group-footer="false"
show-in-column="total_keluhan_informasi_tahun_sebelumnya" :align-by-column="true" column="total_gangguan_tahun_ini" summary-type="sum" display-format="{0}"
:show-in-group-footer="false" :customize-text="(e: any) => formatNumber(e.value)" />
:align-by-column="true" <DxGroupItem css-class="!text-right" show-in-column="total_keluhan_informasi_tahun_ini"
column="total_keluhan_informasi_tahun_sebelumnya" :show-in-group-footer="false" :align-by-column="true" column="total_keluhan_informasi_tahun_ini"
summary-type="sum" summary-type="sum" display-format="{0}" :customize-text="(e: any) => formatNumber(e.value)" />
display-format="{0}" <DxGroupItem css-class="!text-right" show-in-column="total_gangguan_informasi_tahun_ini"
:customize-text="(e: any) => formatNumber(e.value)" :show-in-group-footer="false" :align-by-column="true" column="total_gangguan_informasi_tahun_ini"
/> summary-type="sum" display-format="{0}" :customize-text="(e: any) => formatNumber(e.value)" />
<DxGroupItem <DxGroupItem css-class="!text-right" show-in-column="total_informasi_tahun_ini" :show-in-group-footer="false"
css-class="!text-right" :align-by-column="true" column="total_informasi_tahun_ini" summary-type="sum" display-format="{0}"
show-in-column="total_gangguan_informasi_tahun_sebelumnya" :customize-text="(e: any) => formatNumber(e.value)" />
:show-in-group-footer="false" <DxGroupItem css-class="!text-right" show-in-column="total_tahun_ini" :show-in-group-footer="false"
:align-by-column="true" :align-by-column="true" column="total_tahun_ini" summary-type="sum" display-format="{0}"
column="total_gangguan_informasi_tahun_sebelumnya" :customize-text="(e: any) => formatNumber(e.value)" />
summary-type="sum" <DxGroupItem css-class="!text-right" show-in-column="delta_keluhan" :show-in-group-footer="false"
display-format="{0}" :align-by-column="true" column="delta_keluhan" summary-type="sum" display-format="{0}"
:customize-text="(e: any) => formatNumber(e.value)" :customize-text="(e: any) => formatNumber(e.value)" />
/> <DxGroupItem css-class="!text-right" show-in-column="delta_gangguan" :show-in-group-footer="false"
<DxGroupItem :align-by-column="true" column="delta_gangguan" summary-type="sum" display-format="{0}"
css-class="!text-right" :customize-text="(e: any) => formatNumber(e.value)" />
show-in-column="total_informasi_tahun_sebelumnya" <DxGroupItem css-class="!text-right" show-in-column="delta_informasi" :show-in-group-footer="false"
:show-in-group-footer="false" :align-by-column="true" column="delta_informasi" summary-type="sum" display-format="{0}"
:align-by-column="true" :customize-text="(e: any) => formatNumber(e.value)" />
column="total_informasi_tahun_sebelumnya" <DxGroupItem css-class="!text-right" show-in-column="persen_delta_keluhan" :show-in-group-footer="false"
summary-type="sum" :align-by-column="true" column="persen_delta_keluhan" summary-type="avg" display-format="{0}" :customize-text="(e: any) => (parseFloat(e.value.toString()) ? formatPercentage(e.value) : '0%')
display-format="{0}" " />
:customize-text="(e: any) => formatNumber(e.value)" <DxGroupItem css-class="!text-right" show-in-column="persen_delta_gangguan" :show-in-group-footer="false"
/> :align-by-column="true" column="persen_delta_gangguan" summary-type="avg" display-format="{0}"
<DxGroupItem :customize-text="(e: any) => (parseFloat(e.value.toString()) ? formatPercentage(e.value) : '0%')
css-class="!text-right" " />
show-in-column="total_tahun_sebelumnya" <DxGroupItem css-class="!text-right" show-in-column="persen_delta_informasi" :show-in-group-footer="false"
:show-in-group-footer="false" :align-by-column="true" column="persen_delta_informasi" summary-type="avg" display-format="{0}"
:align-by-column="true" :customize-text="(e: any) => (parseFloat(e.value.toString()) ? formatPercentage(e.value) : '0%')
column="total_tahun_sebelumnya" " />
summary-type="sum" <DxGroupItem css-class="!text-right" show-in-column="persen_delta_total" :show-in-group-footer="false"
display-format="{0}" :align-by-column="true" column="persen_delta_total" summary-type="avg" display-format="{0}" :customize-text="(e: any) => (parseFloat(e.value.toString()) ? formatPercentage(e.value) : '0%')
:customize-text="(e: any) => formatNumber(e.value)" " />
/>
<DxGroupItem
css-class="!text-right"
show-in-column="total_keluhan_tahun_ini"
:show-in-group-footer="false"
:align-by-column="true"
column="total_keluhan_tahun_ini"
summary-type="sum"
display-format="{0}"
:customize-text="(e: any) => formatNumber(e.value)"
/>
<DxGroupItem
css-class="!text-right"
show-in-column="total_gangguan_tahun_ini"
:show-in-group-footer="false"
:align-by-column="true"
column="total_gangguan_tahun_ini"
summary-type="sum"
display-format="{0}"
:customize-text="(e: any) => formatNumber(e.value)"
/>
<DxGroupItem
css-class="!text-right"
show-in-column="total_keluhan_informasi_tahun_ini"
:show-in-group-footer="false"
:align-by-column="true"
column="total_keluhan_informasi_tahun_ini"
summary-type="sum"
display-format="{0}"
:customize-text="(e: any) => formatNumber(e.value)"
/>
<DxGroupItem
css-class="!text-right"
show-in-column="total_gangguan_informasi_tahun_ini"
:show-in-group-footer="false"
:align-by-column="true"
column="total_gangguan_informasi_tahun_ini"
summary-type="sum"
display-format="{0}"
:customize-text="(e: any) => formatNumber(e.value)"
/>
<DxGroupItem
css-class="!text-right"
show-in-column="total_informasi_tahun_ini"
:show-in-group-footer="false"
:align-by-column="true"
column="total_informasi_tahun_ini"
summary-type="sum"
display-format="{0}"
:customize-text="(e: any) => formatNumber(e.value)"
/>
<DxGroupItem
css-class="!text-right"
show-in-column="total_tahun_ini"
:show-in-group-footer="false"
:align-by-column="true"
column="total_tahun_ini"
summary-type="sum"
display-format="{0}"
:customize-text="(e: any) => formatNumber(e.value)"
/>
<DxGroupItem
css-class="!text-right"
show-in-column="delta_keluhan"
:show-in-group-footer="false"
:align-by-column="true"
column="delta_keluhan"
summary-type="sum"
display-format="{0}"
:customize-text="(e: any) => formatNumber(e.value)"
/>
<DxGroupItem
css-class="!text-right"
show-in-column="delta_gangguan"
:show-in-group-footer="false"
:align-by-column="true"
column="delta_gangguan"
summary-type="sum"
display-format="{0}"
:customize-text="(e: any) => formatNumber(e.value)"
/>
<DxGroupItem
css-class="!text-right"
show-in-column="delta_informasi"
:show-in-group-footer="false"
:align-by-column="true"
column="delta_informasi"
summary-type="sum"
display-format="{0}"
:customize-text="(e: any) => formatNumber(e.value)"
/>
<DxGroupItem
css-class="!text-right"
show-in-column="persen_delta_keluhan"
:show-in-group-footer="false"
:align-by-column="true"
column="persen_delta_keluhan"
summary-type="avg"
display-format="{0}"
:customize-text="
(e: any) => (parseFloat(e.value.toString()) ? formatPercentage(e.value) : '0%')
"
/>
<DxGroupItem
css-class="!text-right"
show-in-column="persen_delta_gangguan"
:show-in-group-footer="false"
:align-by-column="true"
column="persen_delta_gangguan"
summary-type="avg"
display-format="{0}"
:customize-text="
(e: any) => (parseFloat(e.value.toString()) ? formatPercentage(e.value) : '0%')
"
/>
<DxGroupItem
css-class="!text-right"
show-in-column="persen_delta_informasi"
:show-in-group-footer="false"
:align-by-column="true"
column="persen_delta_informasi"
summary-type="avg"
display-format="{0}"
:customize-text="
(e: any) => (parseFloat(e.value.toString()) ? formatPercentage(e.value) : '0%')
"
/>
<DxGroupItem
css-class="!text-right"
show-in-column="persen_delta_total"
:show-in-group-footer="false"
:align-by-column="true"
column="persen_delta_total"
summary-type="avg"
display-format="{0}"
:customize-text="
(e: any) => (parseFloat(e.value.toString()) ? formatPercentage(e.value) : '0%')
"
/>
</DxSummary> </DxSummary>
<template #formatNumber="{ data }"> <template #formatNumber="{ data }">
@ -675,7 +248,9 @@ import { provideApolloClient } from '@vue/apollo-composable'
import BufferDialog from '@/components/Dialogs/BufferDialog.vue' import BufferDialog from '@/components/Dialogs/BufferDialog.vue'
import { import {
exportToPDF, exportToPDF,
exportToXLSX exportToXLSX,
exportToDOCX
} from '@/report/Monalisa/Laporan/Kumulatif/MonalisaLK_PenurunanJumlahKomplain' } from '@/report/Monalisa/Laporan/Kumulatif/MonalisaLK_PenurunanJumlahKomplain'
const client = apolloClient() const client = apolloClient()
@ -715,6 +290,7 @@ const onExporting = (e: any) => {
} else if (e.format === 'xlsx') { } else if (e.format === 'xlsx') {
exportToXLSX(reportMeta.value, e) exportToXLSX(reportMeta.value, e)
} else { } else {
exportToDOCX(reportMeta.value, data.value)
} }
} }
const getDetail = async () => { const getDetail = async () => {

15
src/report/Gangguan/Rekap/doc/RGangguan_ALL_DOC.ts
View File

@ -1,4 +1,5 @@
const company = "PT. PLN (Persero)"; const company = "PT. PLN (Persero)";
const exportToWord = (reportMeta: any, rawData: any, filename: any, periode: any) => { const exportToWord = (reportMeta: any, rawData: any, filename: any, periode: any) => {
var preHtml = `<html xmlns:o='urn:schemas-microsoft-com:office:office' xmlns:w='urn:schemas-microsoft-com:office:word' xmlns='http://www.w3.org/TR/REC-html40'><head><meta charset='utf-8'><title>${filename}</title> var preHtml = `<html xmlns:o='urn:schemas-microsoft-com:office:office' xmlns:w='urn:schemas-microsoft-com:office:word' xmlns='http://www.w3.org/TR/REC-html40'><head><meta charset='utf-8'><title>${filename}</title>
@ -113,7 +114,12 @@ const exportToWord = (reportMeta: any, rawData: any, filename: any, periode: any
</table> </table>
` `
var postHtml = "</div></body></html>"; var postHtml = `<br>
<footer>
<p style="text-align: right; font-size: 10px;">${periode.dayTo}, ${periode.dateToFormat}</p>
<br>
<p style="text-align: right; font-size: 10px;">(.........................................)</p>
</footer></div></body></html>`;
var html = preHtml + body + postHtml; var html = preHtml + body + postHtml;
@ -258,7 +264,12 @@ const exportDetailToWord = (reportMeta: any, rawData: any, filename: any, period
</table> </table>
` `
var postHtml = "</div></body></html>"; var postHtml = `<br>
<footer>
<p style="text-align: right; font-size: 10px;">${periode.dayTo}, ${periode.dateToFormat}</p>
<br>
<p style="text-align: right; font-size: 10px;">(.........................................)</p>
</footer></div></body></html>`;
var html = preHtml + body + postHtml; var html = preHtml + body + postHtml;

14
src/report/Gangguan/Rekap/doc/RGangguan_AlihPosko_DOC.ts
View File

@ -92,7 +92,12 @@ const exportToWord = (reportMeta: any, rawData: any, filename: any, periode: any
</table> </table>
` `
var postHtml = "</div></body></html>"; var postHtml = `<br>
<footer>
<p style="text-align: right; font-size: 10px;">${periode.dayTo}, ${periode.dateToFormat}</p>
<br>
<p style="text-align: right; font-size: 10px;">(.........................................)</p>
</footer></div></body></html>`;
var html = preHtml + body + postHtml; var html = preHtml + body + postHtml;
@ -226,7 +231,12 @@ const exportDetailToWord = (reportMeta: any, rawData: any, filename: any, period
</table> </table>
` `
var postHtml = "</div></body></html>"; var postHtml = `<br>
<footer>
<p style="text-align: right; font-size: 10px;">${periode.dayTo}, ${periode.dateToFormat}</p>
<br>
<p style="text-align: right; font-size: 10px;">(.........................................)</p>
</footer></div></body></html>`;
var html = preHtml + body + postHtml; var html = preHtml + body + postHtml;

14
src/report/Gangguan/Rekap/doc/RGangguan_BerdasarMedia_DOC.ts
View File

@ -123,7 +123,12 @@ const exportToWord = (reportMeta: any, rawData: any, filename: any, periode: any
</table> </table>
` `
var postHtml = "</div></body></html>"; var postHtml = `<br>
<footer>
<p style="text-align: right; font-size: 10px;">${periode.dayTo}, ${periode.dateToFormat}</p>
<br>
<p style="text-align: right; font-size: 10px;">(.........................................)</p>
</footer></div></body></html>`;
var html = preHtml + body + postHtml; var html = preHtml + body + postHtml;
@ -255,7 +260,12 @@ const exportDetailToWord = (reportMeta: any, rawData: any, filename: any, period
</table> </table>
` `
var postHtml = "</div></body></html>"; var postHtml = `<br>
<footer>
<p style="text-align: right; font-size: 10px;">${periode.dayTo}, ${periode.dateToFormat}</p>
<br>
<p style="text-align: right; font-size: 10px;">(.........................................)</p>
</footer></div></body></html>`;
var html = preHtml + body + postHtml; var html = preHtml + body + postHtml;

14
src/report/Gangguan/Rekap/doc/RGangguan_CTTM_DOC.ts
View File

@ -134,7 +134,12 @@ const exportToWord = (reportMeta: any, rawData: any, filename: any, periode: any
</table> </table>
` `
var postHtml = "</div></body></html>"; var postHtml = `<br>
<footer>
<p style="text-align: right; font-size: 10px;">${periode.dayTo}, ${periode.dateToFormat}</p>
<br>
<p style="text-align: right; font-size: 10px;">(.........................................)</p>
</footer></div></body></html>`;
var html = preHtml + body + postHtml; var html = preHtml + body + postHtml;
@ -254,7 +259,12 @@ const exportDetailToWord = (reportMeta: any, rawData: any, filename: any, period
</table> </table>
` `
var postHtml = "</div></body></html>"; var postHtml = `<br>
<footer>
<p style="text-align: right; font-size: 10px;">${periode.dayTo}, ${periode.dateToFormat}</p>
<br>
<p style="text-align: right; font-size: 10px;">(.........................................)</p>
</footer></div></body></html>`;
var html = preHtml + body + postHtml; var html = preHtml + body + postHtml;

14
src/report/Gangguan/Rekap/doc/RGangguan_DMAPKT_DOC.ts
View File

@ -164,7 +164,12 @@ const exportToWord = (reportMeta: any, rawData: any, filename: any, periode: any
</table> </table>
` `
var postHtml = "</div></body></html>"; var postHtml = `<br>
<footer>
<p style="text-align: right; font-size: 10px;">${periode.dayTo}, ${periode.dateToFormat}</p>
<br>
<p style="text-align: right; font-size: 10px;">(.........................................)</p>
</footer></div></body></html>`;
var html = preHtml + body + postHtml; var html = preHtml + body + postHtml;
@ -290,7 +295,12 @@ const exportDetailToWord = (reportMeta: any, rawData: any, filename: any, period
</table> </table>
` `
var postHtml = "</div></body></html>"; var postHtml = `<br>
<footer>
<p style="text-align: right; font-size: 10px;">${periode.dayTo}, ${periode.dateToFormat}</p>
<br>
<p style="text-align: right; font-size: 10px;">(.........................................)</p>
</footer></div></body></html>`;
var html = preHtml + body + postHtml; var html = preHtml + body + postHtml;

14
src/report/Gangguan/Rekap/doc/RGangguan_JenisGangguanSE_DOC.ts
View File

@ -123,7 +123,12 @@ const exportToWord = (reportMeta: any, rawData: any, filename: any, periode: any
</table> </table>
` `
var postHtml = "</div></body></html>"; var postHtml = `<br>
<footer>
<p style="text-align: right; font-size: 10px;">${periode.dayTo}, ${periode.dateToFormat}</p>
<br>
<p style="text-align: right; font-size: 10px;">(.........................................)</p>
</footer></div></body></html>`;
var html = preHtml + body + postHtml; var html = preHtml + body + postHtml;
@ -255,7 +260,12 @@ const exportDetailToWord = (reportMeta: any, rawData: any, filename: any, period
</table> </table>
` `
var postHtml = "</div></body></html>"; var postHtml = `<br>
<footer>
<p style="text-align: right; font-size: 10px;">${periode.dayTo}, ${periode.dateToFormat}</p>
<br>
<p style="text-align: right; font-size: 10px;">(.........................................)</p>
</footer></div></body></html>`;
var html = preHtml + body + postHtml; var html = preHtml + body + postHtml;

14
src/report/Gangguan/Rekap/doc/RGangguan_JenisGangguan_DOC.ts
View File

@ -123,7 +123,12 @@ const exportToWord = (reportMeta: any, rawData: any, filename: any, periode: any
</table> </table>
` `
var postHtml = "</div></body></html>"; var postHtml = `<br>
<footer>
<p style="text-align: right; font-size: 10px;">${periode.dayTo}, ${periode.dateToFormat}</p>
<br>
<p style="text-align: right; font-size: 10px;">(.........................................)</p>
</footer></div></body></html>`;
var html = preHtml + body + postHtml; var html = preHtml + body + postHtml;
@ -255,7 +260,12 @@ const exportDetailToWord = (reportMeta: any, rawData: any, filename: any, period
</table> </table>
` `
var postHtml = "</div></body></html>"; var postHtml = `<br>
<footer>
<p style="text-align: right; font-size: 10px;">${periode.dayTo}, ${periode.dateToFormat}</p>
<br>
<p style="text-align: right; font-size: 10px;">(.........................................)</p>
</footer></div></body></html>`;
var html = preHtml + body + postHtml; var html = preHtml + body + postHtml;

14
src/report/Gangguan/Rekap/doc/RGangguan_KTI_DOC.ts
View File

@ -108,7 +108,12 @@ const exportToWord = (reportMeta: any, rawData: any, filename: any, periode: any
</table> </table>
` `
var postHtml = "</div></body></html>"; var postHtml = `<br>
<footer>
<p style="text-align: right; font-size: 10px;">${periode.dayTo}, ${periode.dateToFormat}</p>
<br>
<p style="text-align: right; font-size: 10px;">(.........................................)</p>
</footer></div></body></html>`;
var html = preHtml + body + postHtml; var html = preHtml + body + postHtml;
@ -268,7 +273,12 @@ const exportDetailToWord = (reportMeta: any, rawData: any, filename: any, period
</table> </table>
` `
var postHtml = "</div></body></html>"; var postHtml = `<br>
<footer>
<p style="text-align: right; font-size: 10px;">${periode.dayTo}, ${periode.dateToFormat}</p>
<br>
<p style="text-align: right; font-size: 10px;">(.........................................)</p>
</footer></div></body></html>`;
var html = preHtml + body + postHtml; var html = preHtml + body + postHtml;

14
src/report/Gangguan/Rekap/doc/RGangguan_PerPosko_DOC.ts
View File

@ -121,7 +121,12 @@ const exportToWord = (reportMeta: any, rawData: any, filename: any, periode: any
</table> </table>
` `
var postHtml = "</div></body></html>"; var postHtml = `<br>
<footer>
<p style="text-align: right; font-size: 10px;">${periode.dayTo}, ${periode.dateToFormat}</p>
<br>
<p style="text-align: right; font-size: 10px;">(.........................................)</p>
</footer></div></body></html>`;
var html = preHtml + body + postHtml; var html = preHtml + body + postHtml;
@ -253,7 +258,12 @@ const exportDetailToWord = (reportMeta: any, rawData: any, filename: any, period
</table> </table>
` `
var postHtml = "</div></body></html>"; var postHtml = `<br>
<footer>
<p style="text-align: right; font-size: 10px;">${periode.dayTo}, ${periode.dateToFormat}</p>
<br>
<p style="text-align: right; font-size: 10px;">(.........................................)</p>
</footer></div></body></html>`;
var html = preHtml + body + postHtml; var html = preHtml + body + postHtml;

14
src/report/Gangguan/Rekap/doc/RGangguan_PerRegu_DOC.ts
View File

@ -122,7 +122,12 @@ const exportToWord = (reportMeta: any, rawData: any, filename: any, periode: any
</table> </table>
` `
var postHtml = "</div></body></html>"; var postHtml = `<br>
<footer>
<p style="text-align: right; font-size: 10px;">${periode.dayTo}, ${periode.dateToFormat}</p>
<br>
<p style="text-align: right; font-size: 10px;">(.........................................)</p>
</footer></div></body></html>`;
var html = preHtml + body + postHtml; var html = preHtml + body + postHtml;
@ -256,7 +261,12 @@ const exportDetailToWord = (reportMeta: any, rawData: any, filename: any, period
</table> </table>
` `
var postHtml = "</div></body></html>"; var postHtml = `<br>
<footer>
<p style="text-align: right; font-size: 10px;">${periode.dayTo}, ${periode.dateToFormat}</p>
<br>
<p style="text-align: right; font-size: 10px;">(.........................................)</p>
</footer></div></body></html>`;
var html = preHtml + body + postHtml; var html = preHtml + body + postHtml;

14
src/report/Gangguan/Rekap/doc/RGangguan_PerTanggal_DOC.ts
View File

@ -120,7 +120,12 @@ const exportToWord = (reportMeta: any, rawData: any, filename: any, periode: any
</table> </table>
` `
var postHtml = "</div></body></html>"; var postHtml = `<br>
<footer>
<p style="text-align: right; font-size: 10px;">${periode.dayTo}, ${periode.dateToFormat}</p>
<br>
<p style="text-align: right; font-size: 10px;">(.........................................)</p>
</footer></div></body></html>`;
var html = preHtml + body + postHtml; var html = preHtml + body + postHtml;
@ -253,7 +258,12 @@ const exportDetailToWord = (reportMeta: any, rawData: any, filename: any, period
</table> </table>
` `
var postHtml = "</div></body></html>"; var postHtml = `<br>
<footer>
<p style="text-align: right; font-size: 10px;">${periode.dayTo}, ${periode.dateToFormat}</p>
<br>
<p style="text-align: right; font-size: 10px;">(.........................................)</p>
</footer></div></body></html>`;
var html = preHtml + body + postHtml; var html = preHtml + body + postHtml;

14
src/report/Gangguan/Rekap/doc/RGangguan_RatingPerPosko_DOC.ts
View File

@ -118,7 +118,12 @@ const exportToWord = (reportMeta: any, rawData: any, filename: any, periode: any
</table> </table>
` `
var postHtml = "</div></body></html>"; var postHtml = `<br>
<footer>
<p style="text-align: right; font-size: 10px;">${periode.dayTo}, ${periode.dateToFormat}</p>
<br>
<p style="text-align: right; font-size: 10px;">(.........................................)</p>
</footer></div></body></html>`;
var html = preHtml + body + postHtml; var html = preHtml + body + postHtml;
@ -251,7 +256,12 @@ const exportDetailToWord = (reportMeta: any, rawData: any, filename: any, period
</table> </table>
` `
var postHtml = "</div></body></html>"; var postHtml = `<br>
<footer>
<p style="text-align: right; font-size: 10px;">${periode.dayTo}, ${periode.dateToFormat}</p>
<br>
<p style="text-align: right; font-size: 10px;">(.........................................)</p>
</footer></div></body></html>`;
var html = preHtml + body + postHtml; var html = preHtml + body + postHtml;

14
src/report/Gangguan/Rekap/doc/RGangguan_RatingPerRegu_DOC.ts
View File

@ -117,7 +117,12 @@ const exportToWord = (reportMeta: any, rawData: any, filename: any, periode: any
</table> </table>
` `
var postHtml = "</div></body></html>"; var postHtml = `<br>
<footer>
<p style="text-align: right; font-size: 10px;">${periode.dayTo}, ${periode.dateToFormat}</p>
<br>
<p style="text-align: right; font-size: 10px;">(.........................................)</p>
</footer></div></body></html>`;
var html = preHtml + body + postHtml; var html = preHtml + body + postHtml;
@ -251,7 +256,12 @@ const exportDetailToWord = (reportMeta: any, rawData: any, filename: any, period
</table> </table>
` `
var postHtml = "</div></body></html>"; var postHtml = `<br>
<footer>
<p style="text-align: right; font-size: 10px;">${periode.dayTo}, ${periode.dateToFormat}</p>
<br>
<p style="text-align: right; font-size: 10px;">(.........................................)</p>
</footer></div></body></html>`;
var html = preHtml + body + postHtml; var html = preHtml + body + postHtml;

15
src/report/Material/Daftar/Material_DGMYG.ts
View File

@ -17,6 +17,7 @@ import { jsPDF } from 'jspdf'
import autoTable from 'jspdf-autotable' import autoTable from 'jspdf-autotable'
import { Workbook } from 'exceljs' import { Workbook } from 'exceljs'
import { setHeaderStyle } from '@/report/utils/xlsx' import { setHeaderStyle } from '@/report/utils/xlsx'
import { exportToWord } from './doc/Material_DGMYG_DOC'
const reportName = 'Daftar Gangguan Dan Material Yang Dipakai' const reportName = 'Daftar Gangguan Dan Material Yang Dipakai'
const fontSize = 5 const fontSize = 5
@ -222,8 +223,7 @@ const exportToXLSX = (reportMeta: any, e: any) => {
worksheet, worksheet,
2, 2,
1, 1,
`DISTRIBUSI/WILAYAH : ${ `DISTRIBUSI/WILAYAH : ${reportMeta.value.uid
reportMeta.value.uid
? reportMeta.value.uid.name.toUpperCase() ? reportMeta.value.uid.name.toUpperCase()
: 'Semua Distribusi/Wilayah'.toUpperCase() : 'Semua Distribusi/Wilayah'.toUpperCase()
}` }`
@ -232,16 +232,14 @@ const exportToXLSX = (reportMeta: any, e: any) => {
worksheet, worksheet,
3, 3,
1, 1,
`AREA : ${ `AREA : ${reportMeta.value.up3 ? reportMeta.value.up3.name.toUpperCase() : 'Semua Area'.toUpperCase()
reportMeta.value.up3 ? reportMeta.value.up3.name.toUpperCase() : 'Semua Area'.toUpperCase()
}` }`
) )
setHeaderStyle( setHeaderStyle(
worksheet, worksheet,
4, 4,
1, 1,
`POSKO : ${ `POSKO : ${reportMeta.value.posko
reportMeta.value.posko
? reportMeta.value.posko.name.toUpperCase() ? reportMeta.value.posko.name.toUpperCase()
: 'Semua Posko'.toUpperCase() : 'Semua Posko'.toUpperCase()
}` }`
@ -279,5 +277,8 @@ const exportToXLSX = (reportMeta: any, e: any) => {
e.cancel = true e.cancel = true
} }
const exportToDOCX = (reportMeta: any, rawData: any) => {
exportToWord(reportMeta, rawData, `Laporan ${reportName}`, formatMetaData(reportMeta))
}
export { exportToPDF, exportToXLSX, exportToDOCX }
export { exportToPDF, exportToXLSX }

271
src/report/Material/Daftar/doc/Material_DGMYG_DOC.ts Normal file
View File

@ -0,0 +1,271 @@
const company = "PT. PLN (Persero)";
const exportToWord = (reportMeta: any, rawData: any, filename: any, periode: any) => {
var preHtml = `<html xmlns:o='urn:schemas-microsoft-com:office:office' xmlns:w='urn:schemas-microsoft-com:office:word' xmlns='http://www.w3.org/TR/REC-html40'><head><meta charset='utf-8'><title>${filename}</title>
<style type="text/css" media="print">
@page Section1 {
size:841.95pt 21.0cm;
mso-page-orientation:landscape;
margin:72.0pt 72.0pt 72.0pt 72.0pt;
mso-header-margin:35.4pt;
mso-footer-margin:35.4pt;
mso-paper-source:0;
}
@page{
size: landscape;
font-size: 5px;
}
div.Section1 {
page:Section1;
}
table.main {
border-collapse: collapse;
width: 100%;
text-transform: uppercase;
font-size: 8px;
}
table.main thead tr {
background-color: #c0c0c0;
}
</style>
</head><body>
<div class="Section1">
`;
var tbody = ``;
var column = '';
for (let index = 0; index < rawData.value.length; index++) {
const item = rawData.value[index];
column += '<tr>';
column += `<td>${item.no_laporan}</td>`;
column += `<td>${item.nama_pelapor}</td>`;
column += `<td>${item.keterangan_pelapor}</td>`;
column += `<td>${item.penyebab}</td>`;
column += `<td>${item.waktu_lapor}</td>`;
column += `<td>${item.waktu_recovery}</td>`;
column += `<td>${item.regu}</td>`;
column += `<td>${item.media}</td>`;
column += `<td>${item.nama_material}</td>`;
column += `<td>${item.satuan_material}</td>`;
column += `<td>${item.volume_material}</td>`;
column += '</tr>';
}
tbody += column;
var body = `
<table border=0 style="border:none">
<tr>
<td colspan="3"> ${company.toUpperCase()}</td>
</tr>
<tr>Distribusi/Wilayah </td>
<td>:</td>
<td> ${reportMeta.uid
? reportMeta.uid.name.toUpperCase()
: 'Semua Unit Induk Distribusi/Wilayah'.toUpperCase()}</td>
<tr>
<td> Area</td>
<td>:</td>
<td> ${reportMeta.up3
? reportMeta.up3.name.toUpperCase()
: 'Semua Area'.toUpperCase()}</td>
</tr>
<tr>
<td> Posko</td>
<td>:</td>
<td> ${reportMeta.posko ? reportMeta.posko.name.toUpperCase() : 'Semua Posko'.toUpperCase()}</td>
</tr>
</table>
<center><h6>${filename.toUpperCase()}</h6></center>
<center><h6>Periode : ${periode.dateFromFormat} s/d ${periode.dateToFormat} (${periode.dayTo})<h6></center>
<table class="main">
<thead>
<tr>
<th rowspan="2">No</th>
<th rowspan="2">Nomor Gangguan</th>
<th rowspan="2">Nama Pelanggan</th>
<th rowspan="2">Isi Laporan</th>
<th rowspan="2">Penyebab Gangguan</th>
<th rowspan="2">Tgl Padam</th>
<th rowspan="2">Tgl Nyala</th>
<th rowspan="2">Regu</th>
<th colspan="4">Material Yang Dipakai</th>
</tr>
<tr>
<th>Sumber</th>
<th>Nama</th>
<th>Satuan</th>
<th>Vol</th>
</tr>
</thead>
<tbody>
${tbody}
</tbody>
</table>
`
var postHtml = `<br>
<footer>
<p style="text-align: right; font-size: 10px;">${periode.dayTo}, ${periode.dateToFormat}</p>
<br>
<p style="text-align: right; font-size: 10px;">(.........................................)</p>
</footer></div></body></html>`;
var html = preHtml + body + postHtml;
var url =
"data:application/vnd.ms-word;charset=utf-8," + encodeURIComponent(html);
filename = filename ? filename + ".doc" : "document.doc";
var downloadLink = document.createElement("a");
document.body.appendChild(downloadLink);
downloadLink.href = url;
downloadLink.download = filename;
downloadLink.click();
document.body.removeChild(downloadLink);
}
const exportDetailToWord = (reportMeta: any, rawData: any, filename: any, periode: any) => {
var preHtml = `<html xmlns:o='urn:schemas-microsoft-com:office:office' xmlns:w='urn:schemas-microsoft-com:office:word' xmlns='http://www.w3.org/TR/REC-html40'><head><meta charset='utf-8'><title>${filename}</title>
<style type="text/css" media="print">
@page Section1 {
size:841.95pt 21.0cm;
mso-page-orientation:landscape;
margin:72.0pt 72.0pt 72.0pt 72.0pt;
mso-header-margin:35.4pt;
mso-footer-margin:35.4pt;
mso-paper-source:0;
}
@page{
size: landscape;
font-size: 5px;
}
div.Section1 {
page:Section1;
}
table.main {
border-collapse: collapse;
width: 100%;
text-transform: uppercase;
font-size: 8px;
}
table.main thead tr {
background-color: #c0c0c0;
}
</style>
</head><body>
<div class="Section1">
`;
var tbody = ``;
var cr = ``;
rawData.map((item: any, i: any) => {
cr += '<tr>';
cr += `<td>${i + 1}</td>`;
cr += `<td>${item.no_laporan}</td>`;
cr += `<td>${item.waktu_lapor}</td>`;
cr += `<td>${item.waktu_response}</td>`;
cr += `<td>${item.waktu_recovery}</td>`;
cr += `<td>${item.durasi_response_time}</td>`;
cr += `<td>${item.durasi_recovery_time}</td>`;
cr += `<td>${item.status_akhir}</td>`;
cr += `<td>${item.idpel_nometer}</td>`;
cr += `<td>${item.nama_pelapor}</td>`;
cr += `<td>${item.alamat_pelapor}</td>`;
cr += `<td>${item.no_telp_pelapor}</td>`;
cr += `<td>${item.keterangan_pelapor}</td>`;
cr += `<td>${item.nama_posko}</td>`;
cr += `<td>${item.media}</td>`;
cr += '<td></td>';
cr += '<td></td>';
cr += '<td></td>';
cr += '</tr>';
});
tbody += cr;
var body = `
<table border=0 style="border:none">
<tr>
<td colspan="3"> ${company.toUpperCase()}</td>
</tr>
<tr>
<td> Unit Induk Distribusi/Wilayah </td>
<td>:</td>
<td> ${reportMeta.uid
? reportMeta.uid.name.toUpperCase()
: 'Semua Unit Induk Distribusi/Wilayah'.toUpperCase()}</td>
<tr>
<td> Unit Pelaksanaan Pelayanan Pelanggan</td>
<td>:</td>
<td> ${reportMeta.up3
? reportMeta.up3.name.toUpperCase()
: 'Semua Unit Pelaksanaan Pelayanan Pelanggan'.toUpperCase()}</td>
</tr>
<tr>
<td> Posko</td>
<td>:</td>
<td> ${reportMeta.posko ? reportMeta.posko.name.toUpperCase() : 'Semua Posko'.toUpperCase()}</td>
</tr>
</table>
<center><h6>${filename.toUpperCase()}</h6></center>
<center><h6>Periode : ${periode.dateFromFormat} s/d ${periode.dateToFormat} (${periode.dayTo})<h6></center>
<table class="main">
<thead>
<tr>
<th>No</th>
<th>No Laporan</th>
<th>Tgl Lapor</th>
<th>Tgl Datang</th>
<th>Tgl Nyala</th>
<th>Durasi Response Time</th>
<th>Durasi Recovery Time</th>
<th>Status</th>
<th>IDPEL/NO METER</th>
<th>Nama Pelapor</th>
<th>Alamat Pelapor</th>
<th>No Telp Pelapor</th>
<th>Keterangan Pelapor</th>
<th>Posko</th>
<th>Sumber Lapor</th>
<th>Nama Petugas</th>
<th>Posko Asal</th>
<th>Posko Tujuan</th>
</tr>
</thead>
<tbody>
${tbody}
</tbody>
</table>
`
var postHtml = `<br>
<footer>
<p style="text-align: right; font-size: 10px;">${periode.dayTo}, ${periode.dateToFormat}</p>
<br>
<p style="text-align: right; font-size: 10px;">(.........................................)</p>
</footer></div></body></html>`;
var html = preHtml + body + postHtml;
var url =
"data:application/vnd.ms-word;charset=utf-8," + encodeURIComponent(html);
filename = filename ? filename + ".doc" : "document.doc";
var downloadLink = document.createElement("a");
document.body.appendChild(downloadLink);
downloadLink.href = url;
downloadLink.download = filename;
downloadLink.click();
document.body.removeChild(downloadLink);
}
export { exportToWord, exportDetailToWord }

15
src/report/Material/Rekapitulasi/Material_RPM.ts
View File

@ -17,6 +17,7 @@ import { jsPDF } from 'jspdf'
import autoTable from 'jspdf-autotable' import autoTable from 'jspdf-autotable'
import { Workbook } from 'exceljs' import { Workbook } from 'exceljs'
import { setHeaderStyle } from '@/report/utils/xlsx' import { setHeaderStyle } from '@/report/utils/xlsx'
import { exportToWord } from './doc/Material_RPM_DOC'
const reportName = 'Rekapitulasi Pemakaian Material' const reportName = 'Rekapitulasi Pemakaian Material'
const fontSize = 5 const fontSize = 5
@ -212,8 +213,7 @@ const exportToXLSX = (reportMeta: any, e: any) => {
worksheet, worksheet,
2, 2,
1, 1,
`DISTRIBUSI/WILAYAH : ${ `DISTRIBUSI/WILAYAH : ${reportMeta.value.uid
reportMeta.value.uid
? reportMeta.value.uid.name.toUpperCase() ? reportMeta.value.uid.name.toUpperCase()
: 'Semua Distribusi/Wilayah'.toUpperCase() : 'Semua Distribusi/Wilayah'.toUpperCase()
}` }`
@ -222,16 +222,14 @@ const exportToXLSX = (reportMeta: any, e: any) => {
worksheet, worksheet,
3, 3,
1, 1,
`AREA : ${ `AREA : ${reportMeta.value.up3 ? reportMeta.value.up3.name.toUpperCase() : 'Semua Area'.toUpperCase()
reportMeta.value.up3 ? reportMeta.value.up3.name.toUpperCase() : 'Semua Area'.toUpperCase()
}` }`
) )
setHeaderStyle( setHeaderStyle(
worksheet, worksheet,
4, 4,
1, 1,
`POSKO : ${ `POSKO : ${reportMeta.value.posko
reportMeta.value.posko
? reportMeta.value.posko.name.toUpperCase() ? reportMeta.value.posko.name.toUpperCase()
: 'Semua Posko'.toUpperCase() : 'Semua Posko'.toUpperCase()
}` }`
@ -270,4 +268,7 @@ const exportToXLSX = (reportMeta: any, e: any) => {
e.cancel = true e.cancel = true
} }
export { exportToPDF, exportToXLSX } const exportToDOCX = (reportMeta: any, rawData: any) => {
exportToWord(reportMeta, rawData, `Laporan ${reportName}`, formatMetaData(reportMeta))
}
export { exportToPDF, exportToXLSX, exportToDOCX }

264
src/report/Material/Rekapitulasi/doc/Material_RPM_DOC.ts Normal file
View File

@ -0,0 +1,264 @@
const company = "PT. PLN (Persero)";
const exportToWord = (reportMeta: any, rawData: any, filename: any, periode: any) => {
var preHtml = `<html xmlns:o='urn:schemas-microsoft-com:office:office' xmlns:w='urn:schemas-microsoft-com:office:word' xmlns='http://www.w3.org/TR/REC-html40'><head><meta charset='utf-8'><title>${filename}</title>
<style type="text/css" media="print">
@page Section1 {
size:841.95pt 21.0cm;
mso-page-orientation:landscape;
margin:72.0pt 72.0pt 72.0pt 72.0pt;
mso-header-margin:35.4pt;
mso-footer-margin:35.4pt;
mso-paper-source:0;
}
@page{
size: landscape;
font-size: 5px;
}
div.Section1 {
page:Section1;
}
table.main {
border-collapse: collapse;
width: 100%;
text-transform: uppercase;
font-size: 8px;
}
table.main thead tr {
background-color: #c0c0c0;
}
</style>
</head><body>
<div class="Section1">
`;
var tbody = ``;
var column = '';
for (let i = 0; i < rawData.value.length; i++) {
column += '<tr>';
const item = rawData.value[i];
column += `<td>${item.kode}</td>`;
column += `<td>${item.nama_material}</td>`;
column += `<td>${item.satuan}</td>`;
column += `<td>${item.sumber_material}</td>`;
for (let a = 1; a <= 31; a++) {
column += `<td>${item[`tgl${a}`]}</td>`;
}
column += `<td>${item.total}</td>`;
column += '</tr>';
}
tbody += column;
var body = `
<table border=0 style="border:none">
<tr>
<td colspan="3"> ${company.toUpperCase()}</td>
</tr>
<tr>
<td> Distribusi/Wilayah </td>
<td>:</td>
<td> ${reportMeta.uid
? reportMeta.uid.name.toUpperCase()
: 'Semua Unit Induk Distribusi/Wilayah'.toUpperCase()}</td>
<tr>
<td> Area</td>
<td>:</td>
<td> ${reportMeta.up3
? reportMeta.up3.name.toUpperCase()
: 'Semua Unit Pelaksanaan Pelayanan Pelanggan'.toUpperCase()}</td>
</tr>
<tr>
<td> Posko</td>
<td>:</td>
<td> ${reportMeta.posko ? reportMeta.posko.name.toUpperCase() : 'Semua Posko'.toUpperCase()}</td>
</tr>
</table>
<center><h6>${filename.toUpperCase()}</h6></center>
<center><h6>Periode : ${periode.dateFromFormat} s/d ${periode.dateToFormat} (${periode.dayTo})<h6></center>
<table class="main">
<thead>
<tr>
<th rowspan="2">No</th>
<th rowspan="2">Kode Material</th>
<th rowspan="2">Nama Material</th>
<th rowspan="2">Satuan</th>
<th rowspan="2">Sumber Material</th>
<th colspan="31">Tanggal</th>
<th rowspan="2">Jumlah</th>
</tr>
<tr>
${Array.from({ length: 31 }, (_, i) => `<th>${i + 1}</th>`).join('\n')}
</tr>
</thead>
<tbody>
${tbody}
</tbody>
</table>
`
var postHtml = `<br>
<footer>
<p style="text-align: right; font-size: 10px;">${periode.dayTo}, ${periode.dateToFormat}</p>
<br>
<p style="text-align: right; font-size: 10px;">(.........................................)</p>
</footer></div></body></html>`;
var html = preHtml + body + postHtml;
var url =
"data:application/vnd.ms-word;charset=utf-8," + encodeURIComponent(html);
filename = filename ? filename + ".doc" : "document.doc";
var downloadLink = document.createElement("a");
document.body.appendChild(downloadLink);
downloadLink.href = url;
downloadLink.download = filename;
downloadLink.click();
document.body.removeChild(downloadLink);
}
const exportDetailToWord = (reportMeta: any, rawData: any, filename: any, periode: any) => {
var preHtml = `<html xmlns:o='urn:schemas-microsoft-com:office:office' xmlns:w='urn:schemas-microsoft-com:office:word' xmlns='http://www.w3.org/TR/REC-html40'><head><meta charset='utf-8'><title>${filename}</title>
<style type="text/css" media="print">
@page Section1 {
size:841.95pt 21.0cm;
mso-page-orientation:landscape;
margin:72.0pt 72.0pt 72.0pt 72.0pt;
mso-header-margin:35.4pt;
mso-footer-margin:35.4pt;
mso-paper-source:0;
}
@page{
size: landscape;
font-size: 5px;
}
div.Section1 {
page:Section1;
}
table.main {
border-collapse: collapse;
width: 100%;
text-transform: uppercase;
font-size: 8px;
}
table.main thead tr {
background-color: #c0c0c0;
}
</style>
</head><body>
<div class="Section1">
`;
var tbody = ``;
var cr = ``;
rawData.map((item: any, i: any) => {
cr += '<tr>';
cr += `<td>${i + 1}</td>`;
cr += `<td>${item.no_laporan}</td>`;
cr += `<td>${item.waktu_lapor}</td>`;
cr += `<td>${item.waktu_response}</td>`;
cr += `<td>${item.waktu_recovery}</td>`;
cr += `<td>${item.durasi_response_time}</td>`;
cr += `<td>${item.durasi_recovery_time}</td>`;
cr += `<td>${item.status_akhir}</td>`;
cr += `<td>${item.idpel_nometer}</td>`;
cr += `<td>${item.nama_pelapor}</td>`;
cr += `<td>${item.alamat_pelapor}</td>`;
cr += `<td>${item.no_telp_pelapor}</td>`;
cr += `<td>${item.keterangan_pelapor}</td>`;
cr += `<td>${item.nama_posko}</td>`;
cr += `<td>${item.media}</td>`;
cr += '<td></td>';
cr += '<td></td>';
cr += '<td></td>';
cr += '</tr>';
});
tbody += cr;
var body = `
<table border=0 style="border:none">
<tr>
<td colspan="3"> ${company.toUpperCase()}</td>
</tr>
<tr>
<td> Unit Induk Distribusi/Wilayah </td>
<td>:</td>
<td> ${reportMeta.uid
? reportMeta.uid.name.toUpperCase()
: 'Semua Unit Induk Distribusi/Wilayah'.toUpperCase()}</td>
<tr>
<td> Unit Pelaksanaan Pelayanan Pelanggan</td>
<td>:</td>
<td> ${reportMeta.up3
? reportMeta.up3.name.toUpperCase()
: 'Semua Unit Pelaksanaan Pelayanan Pelanggan'.toUpperCase()}</td>
</tr>
<tr>
<td> Posko</td>
<td>:</td>
<td> ${reportMeta.posko ? reportMeta.posko.name.toUpperCase() : 'Semua Posko'.toUpperCase()}</td>
</tr>
</table>
<center><h6>${filename.toUpperCase()}</h6></center>
<center><h6>Periode : ${periode.dateFromFormat} s/d ${periode.dateToFormat} (${periode.dayTo})<h6></center>
<table class="main">
<thead>
<tr>
<th>No</th>
<th>No Laporan</th>
<th>Tgl Lapor</th>
<th>Tgl Datang</th>
<th>Tgl Nyala</th>
<th>Durasi Response Time</th>
<th>Durasi Recovery Time</th>
<th>Status</th>
<th>IDPEL/NO METER</th>
<th>Nama Pelapor</th>
<th>Alamat Pelapor</th>
<th>No Telp Pelapor</th>
<th>Keterangan Pelapor</th>
<th>Posko</th>
<th>Sumber Lapor</th>
<th>Nama Petugas</th>
<th>Posko Asal</th>
<th>Posko Tujuan</th>
</tr>
</thead>
<tbody>
${tbody}
</tbody>
</table>
`
var postHtml = `<br>
<footer>
<p style="text-align: right; font-size: 10px;">${periode.dayTo}, ${periode.dateToFormat}</p>
<br>
<p style="text-align: right; font-size: 10px;">(.........................................)</p>
</footer></div></body></html>`;
var html = preHtml + body + postHtml;
var url =
"data:application/vnd.ms-word;charset=utf-8," + encodeURIComponent(html);
filename = filename ? filename + ".doc" : "document.doc";
var downloadLink = document.createElement("a");
document.body.appendChild(downloadLink);
downloadLink.href = url;
downloadLink.download = filename;
downloadLink.click();
document.body.removeChild(downloadLink);
}
export { exportToWord, exportDetailToWord }

21
src/report/Monalisa/Gangguan/Rekap/MonalisaGR_DispatchingTimeGangguan.ts
View File

@ -20,6 +20,7 @@ import { formatWaktu } from '@/components/Form/FiltersType/reference'
import { setHeaderStyle } from '@/report/utils/xlsx' import { setHeaderStyle } from '@/report/utils/xlsx'
import { formatNumber, formatPercentage } from '@/utils/numbers' import { formatNumber, formatPercentage } from '@/utils/numbers'
import { getMonthName } from '@/utils/texts' import { getMonthName } from '@/utils/texts'
import { exportDetailToWord, exportToWord } from './doc/MonalisaGR_DispatchingTimeGangguan_DOC'
const reportName = 'Dispacthing Time (DT) Gangguan' const reportName = 'Dispacthing Time (DT) Gangguan'
const fontSize = 5 const fontSize = 5
@ -465,8 +466,7 @@ const exportToXLSX = (reportMeta: any, e: any) => {
worksheet, worksheet,
2, 2,
1, 1,
`UNIT INDUK : ${ `UNIT INDUK : ${reportMeta.uid
reportMeta.uid
? reportMeta.uid.name.toUpperCase() ? reportMeta.uid.name.toUpperCase()
: 'Semua Unit Induk Distribusi/Wilayah'.toUpperCase() : 'Semua Unit Induk Distribusi/Wilayah'.toUpperCase()
}` }`
@ -475,8 +475,7 @@ const exportToXLSX = (reportMeta: any, e: any) => {
worksheet, worksheet,
3, 3,
1, 1,
`UNIT PELAKSANA PELAYANAN PELANGGAN : ${ `UNIT PELAKSANA PELAYANAN PELANGGAN : ${reportMeta.up3
reportMeta.up3
? reportMeta.up3.name.toUpperCase() ? reportMeta.up3.name.toUpperCase()
: 'Semua Unit Pelaksanaan Pelayanan Pelanggan'.toUpperCase() : 'Semua Unit Pelaksanaan Pelayanan Pelanggan'.toUpperCase()
}` }`
@ -485,8 +484,7 @@ const exportToXLSX = (reportMeta: any, e: any) => {
worksheet, worksheet,
4, 4,
1, 1,
`UNIT LAYANAN PELANGGAN : ${ `UNIT LAYANAN PELANGGAN : ${reportMeta.ulp
reportMeta.ulp
? reportMeta.ulp.name.toUpperCase() ? reportMeta.ulp.name.toUpperCase()
: 'Semua Unit Layanan Pelanggan'.toUpperCase() : 'Semua Unit Layanan Pelanggan'.toUpperCase()
}` }`
@ -495,8 +493,7 @@ const exportToXLSX = (reportMeta: any, e: any) => {
worksheet, worksheet,
5, 5,
1, 1,
`REGIONAL : ${ `REGIONAL : ${reportMeta.regional ? reportMeta.regional.name.toUpperCase() : 'Semua Regional'.toUpperCase()
reportMeta.regional ? reportMeta.regional.name.toUpperCase() : 'Semua Regional'.toUpperCase()
}` }`
) )
@ -560,4 +557,10 @@ const exportDetailToXLSX = (reportMeta: any, e: any) => {
e.cancel = true e.cancel = true
} }
export { exportToPDF, exportToXLSX, exportDetailToPDF, exportDetailToXLSX } const exportToDOCX = (reportMeta: any, rawData: any) => {
exportToWord(reportMeta, formatData(rawData), `Laporan ${reportName}`, null)
}
const exportDetailToDOCX = (reportMeta: any, rawData: any) => {
exportDetailToWord(reportMeta, rawData, `Laporan Detail ${reportName}`, null)
}
export { exportToPDF, exportDetailToPDF, exportToXLSX, exportDetailToXLSX, exportToDOCX, exportDetailToDOCX }

7
src/report/Monalisa/Gangguan/Rekap/MonalisaGR_ENSGangguan.ts
View File

@ -19,6 +19,7 @@ import { Workbook } from 'exceljs'
import { setHeaderStyle } from '@/report/utils/xlsx' import { setHeaderStyle } from '@/report/utils/xlsx'
import { formatNumber, formatPercentage } from '@/utils/numbers' import { formatNumber, formatPercentage } from '@/utils/numbers'
import { getMonthName } from '@/utils/texts' import { getMonthName } from '@/utils/texts'
import { exportToWord } from './doc/MonalisaGR_ENSGangguan_DOC'
const reportName = 'Rekapitulasi ENS Gangguan' const reportName = 'Rekapitulasi ENS Gangguan'
const fontSize = 5 const fontSize = 5
@ -368,5 +369,7 @@ const exportToXLSX = (reportMeta: any, e: any) => {
e.cancel = true e.cancel = true
} }
const exportToDOCX = (reportMeta: any, rawData: any) => {
export { exportToPDF, exportToXLSX } exportToWord(reportMeta, formatData(rawData), `Laporan ${reportName}`, null)
}
export { exportToPDF, exportToXLSX , exportToDOCX}

21
src/report/Monalisa/Gangguan/Rekap/MonalisaGR_GangguanBelumSelesai.ts
View File

@ -19,6 +19,7 @@ import { Workbook } from 'exceljs'
import { setHeaderStyle } from '@/report/utils/xlsx' import { setHeaderStyle } from '@/report/utils/xlsx'
import { formatNumber } from '@/utils/numbers' import { formatNumber } from '@/utils/numbers'
import { formatWaktu } from '@/components/Form/FiltersType/reference' import { formatWaktu } from '@/components/Form/FiltersType/reference'
import { exportDetailToWord, exportToWord } from './doc/MonalisaGR_GangguanBelumSelesai_DOC'
const reportName = 'Rekapitulasi Gangguan Belum Selesai' const reportName = 'Rekapitulasi Gangguan Belum Selesai'
const fontSize = 5 const fontSize = 5
@ -391,8 +392,7 @@ const exportToXLSX = (reportMeta: any, e: any) => {
worksheet, worksheet,
2, 2,
1, 1,
`UNIT INDUK : ${ `UNIT INDUK : ${reportMeta.uid
reportMeta.uid
? reportMeta.uid.name.toUpperCase() ? reportMeta.uid.name.toUpperCase()
: 'Semua Unit Induk Distribusi/Wilayah'.toUpperCase() : 'Semua Unit Induk Distribusi/Wilayah'.toUpperCase()
}` }`
@ -401,8 +401,7 @@ const exportToXLSX = (reportMeta: any, e: any) => {
worksheet, worksheet,
3, 3,
1, 1,
`UNIT PELAKSANA PELAYANAN PELANGGAN : ${ `UNIT PELAKSANA PELAYANAN PELANGGAN : ${reportMeta.up3
reportMeta.up3
? reportMeta.up3.name.toUpperCase() ? reportMeta.up3.name.toUpperCase()
: 'Semua Unit Pelaksanaan Pelayanan Pelanggan'.toUpperCase() : 'Semua Unit Pelaksanaan Pelayanan Pelanggan'.toUpperCase()
}` }`
@ -411,8 +410,7 @@ const exportToXLSX = (reportMeta: any, e: any) => {
worksheet, worksheet,
4, 4,
1, 1,
`UNIT LAYANAN PELANGGAN : ${ `UNIT LAYANAN PELANGGAN : ${reportMeta.ulp
reportMeta.ulp
? reportMeta.ulp.name.toUpperCase() ? reportMeta.ulp.name.toUpperCase()
: 'Semua Unit Layanan Pelanggan'.toUpperCase() : 'Semua Unit Layanan Pelanggan'.toUpperCase()
}` }`
@ -421,8 +419,7 @@ const exportToXLSX = (reportMeta: any, e: any) => {
worksheet, worksheet,
5, 5,
1, 1,
`REGIONAL : ${ `REGIONAL : ${reportMeta.regional ? reportMeta.regional.name.toUpperCase() : 'Semua Regional'.toUpperCase()
reportMeta.regional ? reportMeta.regional.name.toUpperCase() : 'Semua Regional'.toUpperCase()
}` }`
) )
@ -490,4 +487,10 @@ const exportDetailToXLSX = (reportMeta: any, e: any) => {
e.cancel = true e.cancel = true
} }
export { exportToPDF, exportToXLSX, exportDetailToPDF, exportDetailToXLSX } const exportToDOCX = (reportMeta: any, rawData: any) => {
exportToWord(reportMeta, formatData(rawData), `Laporan ${reportName}`, null)
}
const exportDetailToDOCX = (reportMeta: any, rawData: any) => {
exportDetailToWord(reportMeta, rawData, `Laporan Detail ${reportName}`, null)
}
export { exportToPDF, exportDetailToPDF, exportToXLSX, exportDetailToXLSX, exportToDOCX, exportDetailToDOCX }

6
src/report/Monalisa/Gangguan/Rekap/MonalisaGR_GangguanPerJenisGangguan.ts
View File

@ -18,6 +18,7 @@ import autoTable from 'jspdf-autotable'
import { Workbook } from 'exceljs' import { Workbook } from 'exceljs'
import { setHeaderStyle } from '@/report/utils/xlsx' import { setHeaderStyle } from '@/report/utils/xlsx'
import { formatNumber, formatPercentage } from '@/utils/numbers' import { formatNumber, formatPercentage } from '@/utils/numbers'
import { exportToWord } from './doc/MonalisaGR_GangguanPerJenisGangguan_DOC'
const reportName = 'Rekapitulasi Gangguan Per Jenis Gangguan' const reportName = 'Rekapitulasi Gangguan Per Jenis Gangguan'
const fontSize = 5 const fontSize = 5
@ -283,4 +284,7 @@ const exportToXLSX = (reportMeta: any, e: any) => {
e.cancel = true e.cancel = true
} }
export { exportToPDF, exportToXLSX } const exportToDOCX = (reportMeta: any, rawData: any) => {
exportToWord(reportMeta, formatData(rawData), `Laporan ${reportName}`, null)
}
export { exportToPDF, exportToXLSX , exportToDOCX}

6
src/report/Monalisa/Gangguan/Rekap/MonalisaGR_JumlahDDRPTRCTGangguan.ts
View File

@ -19,6 +19,7 @@ import { Workbook } from 'exceljs'
import { setHeaderStyle } from '@/report/utils/xlsx' import { setHeaderStyle } from '@/report/utils/xlsx'
import { formatNumber, formatPercentage } from '@/utils/numbers' import { formatNumber, formatPercentage } from '@/utils/numbers'
import { getMonthName } from '@/utils/texts' import { getMonthName } from '@/utils/texts'
import { exportToWord } from './doc/MonalisaGR_JumlahDDRPTRCTGangguan_DOC'
const reportName = 'Jumlah dan Durasi RPT RCT Gangguan' const reportName = 'Jumlah dan Durasi RPT RCT Gangguan'
const fontSize = 5 const fontSize = 5
@ -322,4 +323,7 @@ const exportToXLSX = (reportMeta: any, e: any) => {
e.cancel = true e.cancel = true
} }
export { exportToPDF, exportToXLSX } const exportToDOCX = (reportMeta: any, rawData: any) => {
exportToWord(reportMeta, formatData(rawData), `Laporan ${reportName}`, null)
}
export { exportToPDF, exportToXLSX , exportToDOCX}

19
src/report/Monalisa/Gangguan/Rekap/MonalisaGR_JumlahKaliGangguan.ts
View File

@ -20,6 +20,7 @@ import { formatWaktu } from '@/components/Form/FiltersType/reference'
import { setHeaderStyle } from '@/report/utils/xlsx' import { setHeaderStyle } from '@/report/utils/xlsx'
import { formatNumber, formatPercentage } from '@/utils/numbers' import { formatNumber, formatPercentage } from '@/utils/numbers'
import { getMonthName } from '@/utils/texts' import { getMonthName } from '@/utils/texts'
import { exportToWord } from './doc/MonalisaGR_JumlahKaliGangguan_DOC'
const reportName = 'Jumlah Kali Gangguan' const reportName = 'Jumlah Kali Gangguan'
const fontSize = 5 const fontSize = 5
@ -308,8 +309,7 @@ const exportToXLSX = (reportMeta: any, e: any) => {
worksheet, worksheet,
2, 2,
1, 1,
`UNIT INDUK : ${ `UNIT INDUK : ${reportMeta.uid
reportMeta.uid
? reportMeta.uid.name.toUpperCase() ? reportMeta.uid.name.toUpperCase()
: 'Semua Unit Induk Distribusi/Wilayah'.toUpperCase() : 'Semua Unit Induk Distribusi/Wilayah'.toUpperCase()
}` }`
@ -318,8 +318,7 @@ const exportToXLSX = (reportMeta: any, e: any) => {
worksheet, worksheet,
3, 3,
1, 1,
`UNIT PELAKSANA PELAYANAN PELANGGAN : ${ `UNIT PELAKSANA PELAYANAN PELANGGAN : ${reportMeta.up3
reportMeta.up3
? reportMeta.up3.name.toUpperCase() ? reportMeta.up3.name.toUpperCase()
: 'Semua Unit Pelaksanaan Pelayanan Pelanggan'.toUpperCase() : 'Semua Unit Pelaksanaan Pelayanan Pelanggan'.toUpperCase()
}` }`
@ -328,8 +327,7 @@ const exportToXLSX = (reportMeta: any, e: any) => {
worksheet, worksheet,
4, 4,
1, 1,
`UNIT LAYANAN PELANGGAN : ${ `UNIT LAYANAN PELANGGAN : ${reportMeta.ulp
reportMeta.ulp
? reportMeta.ulp.name.toUpperCase() ? reportMeta.ulp.name.toUpperCase()
: 'Semua Unit Layanan Pelanggan'.toUpperCase() : 'Semua Unit Layanan Pelanggan'.toUpperCase()
}` }`
@ -338,8 +336,7 @@ const exportToXLSX = (reportMeta: any, e: any) => {
worksheet, worksheet,
5, 5,
1, 1,
`REGIONAL : ${ `REGIONAL : ${reportMeta.regional ? reportMeta.regional.name.toUpperCase() : 'Semua Regional'.toUpperCase()
reportMeta.regional ? reportMeta.regional.name.toUpperCase() : 'Semua Regional'.toUpperCase()
}` }`
) )
@ -371,4 +368,8 @@ const exportToXLSX = (reportMeta: any, e: any) => {
e.cancel = true e.cancel = true
} }
export { exportToPDF, exportToXLSX } const exportToDOCX = (reportMeta: any, rawData: any) => {
console.log(reportMeta, rawData)
exportToWord(reportMeta, formatData(rawData), `Laporan ${reportName}`, null)
}
export { exportToPDF, exportToXLSX, exportToDOCX }

6
src/report/Monalisa/Gangguan/Rekap/MonalisaGR_LaporUlang.ts
View File

@ -19,6 +19,7 @@ import { Workbook } from 'exceljs'
import { setHeaderStyle } from '@/report/utils/xlsx' import { setHeaderStyle } from '@/report/utils/xlsx'
import { formatNumber, formatPercentage } from '@/utils/numbers' import { formatNumber, formatPercentage } from '@/utils/numbers'
import { getMonthName } from '@/utils/texts' import { getMonthName } from '@/utils/texts'
import { exportToWord } from './doc/MonalisaGR_LaporUlang_DOC'
const reportName = 'Rekapitulasi Lapor Ulang Gangguan' const reportName = 'Rekapitulasi Lapor Ulang Gangguan'
const fontSize = 5 const fontSize = 5
@ -369,4 +370,7 @@ const exportToXLSX = (reportMeta: any, e: any) => {
e.cancel = true e.cancel = true
} }
export { exportToPDF, exportToXLSX } const exportToDOCX = (reportMeta: any, rawData: any) => {
exportToWord(reportMeta, formatData(rawData), `Laporan ${reportName}`, null)
}
export { exportToPDF, exportToXLSX , exportToDOCX}

6
src/report/Monalisa/Gangguan/Rekap/MonalisaGR_RecoveryTimeGangguan.ts
View File

@ -20,6 +20,7 @@ import { formatWaktu } from '@/components/Form/FiltersType/reference'
import { setHeaderStyle } from '@/report/utils/xlsx' import { setHeaderStyle } from '@/report/utils/xlsx'
import { formatNumber, formatPercentage } from '@/utils/numbers' import { formatNumber, formatPercentage } from '@/utils/numbers'
import { getMonthName } from '@/utils/texts' import { getMonthName } from '@/utils/texts'
import { exportToWord } from './doc/MonalisaGR_RecoveryTimeGangguan_DOC'
const reportName = 'Recovery Time (RCT) Gangguan' const reportName = 'Recovery Time (RCT) Gangguan'
const fontSize = 5 const fontSize = 5
@ -381,4 +382,7 @@ const exportToXLSX = (reportMeta: any, e: any) => {
e.cancel = true e.cancel = true
} }
export { exportToPDF, exportToXLSX } const exportToDOCX = (reportMeta: any, rawData: any) => {
exportToWord(reportMeta, formatData(rawData), `Laporan ${reportName}`, null)
}
export { exportToPDF, exportToXLSX , exportToDOCX}

6
src/report/Monalisa/Gangguan/Rekap/MonalisaGR_ResponseTimeGangguan.ts
View File

@ -20,6 +20,7 @@ import { formatWaktu } from '@/components/Form/FiltersType/reference'
import { setHeaderStyle } from '@/report/utils/xlsx' import { setHeaderStyle } from '@/report/utils/xlsx'
import { formatNumber, formatPercentage } from '@/utils/numbers' import { formatNumber, formatPercentage } from '@/utils/numbers'
import { getMonthName } from '@/utils/texts' import { getMonthName } from '@/utils/texts'
import { exportToWord } from './doc/MonalisaGR_ResponseTimeGangguan_DOC'
const reportName = 'Response Time (RPT) Gangguan' const reportName = 'Response Time (RPT) Gangguan'
const fontSize = 5 const fontSize = 5
@ -381,4 +382,7 @@ const exportToXLSX = (reportMeta: any, e: any) => {
e.cancel = true e.cancel = true
} }
export { exportToPDF, exportToXLSX } const exportToDOCX = (reportMeta: any, rawData: any) => {
exportToWord(reportMeta, formatData(rawData), `Laporan ${reportName}`, null)
}
export { exportToPDF, exportToXLSX , exportToDOCX}

287
src/report/Monalisa/Gangguan/Rekap/doc/MonalisaGR_DispatchingTimeGangguan_DOC.ts Normal file
View File

@ -0,0 +1,287 @@
import { formatWaktu } from "@/components/Form/FiltersType/reference";
import { getMonthName } from "@/utils/texts";
const day = new Date().toLocaleString('id-ID', { weekday: 'long' })
const date = new Date().getDate()
const month = new Date().toLocaleString('id-ID', { month: 'long' })
const year = new Date().getFullYear()
const company = "PT. PLN (Persero)";
const exportToWord = (reportMeta: any, rawData: any, filename: any, periode: any) => {
var preHtml = `<html xmlns:o='urn:schemas-microsoft-com:office:office' xmlns:w='urn:schemas-microsoft-com:office:word' xmlns='http://www.w3.org/TR/REC-html40'><head><meta charset='utf-8'><title>${filename}</title>
<style type="text/css" media="print">
@page Section1 {
size:841.95pt 21.0cm;
mso-page-orientation:landscape;
margin:72.0pt 72.0pt 72.0pt 72.0pt;
mso-header-margin:35.4pt;
mso-footer-margin:35.4pt;
mso-paper-source:0;
}
@page{
size: landscape;
font-size: 5px;
}
div.Section1 {
page:Section1;
}
table.main {
border-collapse: collapse;
width: 100%;
text-transform: uppercase;
font-size: 8px;
}
table.main thead tr {
background-color: #c0c0c0;
}
</style>
</head><body>
<div class="Section1">
`;
var tbody = ``;
for (let index = 0; index < rawData.length; index++) {
const element = rawData[index];
var column = `<tr>`;
let styleTotal = '';
for (let i = 0; i < element.length; i++) {
const content = element[i];
const colSpan = content?.colSpan !== undefined ? `colspan="${content.colSpan}"` : ''
if (content && (content.content === 'TOTAL' || content.content === 'GRAND TOTAL')) {
styleTotal = 'style="background-color: #c0c0c0; font-weight: bold;"'
}
i === 0 ?
column += `<td ${styleTotal} ${colSpan} align="left">${content.content}</td>`
: column += `<td ${styleTotal}>${content}</td>`;
}
column += `</tr>`;
tbody += column;
}
var body = `
<table border=0 style="border:none">
<tr>
<td colspan="3"> ${company.toUpperCase()}</td>
</tr>
<tr>
<td> Unit Induk Distribusi/Wilayah </td>
<td>:</td>
<td> ${reportMeta.uid
? reportMeta.uid.name.toUpperCase()
: 'Semua Unit Induk Distribusi/Wilayah'.toUpperCase()}</td>
<tr>
<td> Unit Pelaksanaan Pelayanan Pelanggan</td>
<td>:</td>
<td> ${reportMeta.up3
? reportMeta.up3.name.toUpperCase()
: 'Semua Unit Pelaksanaan Pelayanan Pelanggan'.toUpperCase()}</td>
</tr>
<tr>
<td> Unit Layanan Pelanggan</td>
<td>:</td>
<td> ${reportMeta.ulp ? reportMeta.ulp.name.toUpperCase() : 'Semua Unit Layanan Pelanggan'.toUpperCase()}</td>
</tr>
</table>
<center><h6>${filename.toUpperCase()}</h6></center>
<table class="main">
<thead>
<tr>
<th rowspan="3">No</th>
<th rowspan="3">Nama Unit</th>
<th colspan="6">Jumlah Dispatching Time Gangguan</th>
</tr>
<tr>
<th colspan="3">MOM</th>
<th colspan="3">YOY</th>
</tr>
<tr>
<th>${getMonthName(reportMeta.lastMonth)} ${reportMeta.lastYearMoM}</th>
<th>${getMonthName(reportMeta.currentMonth)} ${reportMeta.currentYear}</th>
<th>%</th>
<th>s.d ${getMonthName(reportMeta.currentMonth)} ${reportMeta.lastYear}</th>
<th>s.d ${getMonthName(reportMeta.currentMonth)} ${reportMeta.currentYear}</th>
<th>%</th>
</tr>
</thead>
<tbody>
${tbody}
</tbody>
</table>
`
var postHtml = `<br>
<footer>
<p style="text-align: right; font-size: 10px;">${day}, ${date}-${month}-${year}</p>
<br>
<p style="text-align: right; font-size: 10px;">(.........................................)</p>
</footer></div></body></html>`;
var html = preHtml + body + postHtml;
var url =
"data:application/vnd.ms-word;charset=utf-8," + encodeURIComponent(html);
filename = filename ? filename + ".doc" : "document.doc";
var downloadLink = document.createElement("a");
document.body.appendChild(downloadLink);
downloadLink.href = url;
downloadLink.download = filename;
downloadLink.click();
document.body.removeChild(downloadLink);
}
const exportDetailToWord = (reportMeta: any, rawData: any, filename: any, periode: any) => {
var preHtml = `<html xmlns:o='urn:schemas-microsoft-com:office:office' xmlns:w='urn:schemas-microsoft-com:office:word' xmlns='http://www.w3.org/TR/REC-html40'><head><meta charset='utf-8'><title>${filename}</title>
<style type="text/css" media="print">
@page Section1 {
size:841.95pt 21.0cm;
mso-page-orientation:landscape;
margin:72.0pt 72.0pt 72.0pt 72.0pt;
mso-header-margin:35.4pt;
mso-footer-margin:35.4pt;
mso-paper-source:0;
}
@page{
size: landscape;
font-size: 5px;
}
div.Section1 {
page:Section1;
}
table.main {
border-collapse: collapse;
width: 100%;
text-transform: uppercase;
font-size: 8px;
}
table.main thead tr {
background-color: #c0c0c0;
}
</style>
</head><body>
<div class="Section1">
`;
var tbody = ``;
var cr = ``;
rawData.map((item: any, i: any) => {
cr += '<tr>';
cr += `<td>${i + 1}</td>`;
cr += `<td>${item.nama_ulp}</td>`;
cr += `<td>${item.no_laporan}</td>`;
cr += `<td>${item.waktu_lapor}</td>`;
cr += `<td>${item.waktu_response}</td>`;
cr += `<td>${item.waktu_recovery}</td>`;
cr += `<td>${item.durasi_response_time ? formatWaktu(item.durasi_response_time) : ''}</td>`;
cr += `<td>${item.durasi_recovery_time ? formatWaktu(item.durasi_recovery_time) : ''}</td>`;
cr += '<td></td>';
cr += '<td></td>';
cr += '<td></td>';
cr += `<td>${item.idpel_nometer}</td>`;
cr += `<td>${item.nama_pelapor}</td>`;
cr += `<td>${item.alamat_pelapor}</td>`;
cr += `<td>${item.no_telp_pelapor}</td>`;
cr += `<td>${item.keterangan_pelapor}</td>`;
cr += '<td></td>';
cr += '<td></td>';
cr += `<td>${item.status_akhir}</td>`;
cr += '<td></td>';
cr += '<td></td>';
cr += '<td></td>';
cr += '<td></td>';
cr += '</tr>';
});
tbody += cr;
var body = `
<table border=0 style="border:none">
<tr>
<td colspan="3"> ${company.toUpperCase()}</td>
</tr>
<tr>
<td> Unit Induk Distribusi/Wilayah </td>
<td>:</td>
<td> ${reportMeta.uid
? reportMeta.uid.name.toUpperCase()
: 'Semua Unit Induk Distribusi/Wilayah'.toUpperCase()}</td>
<tr>
<td> Unit Pelaksanaan Pelayanan Pelanggan</td>
<td>:</td>
<td> ${reportMeta.up3
? reportMeta.up3.name.toUpperCase()
: 'Semua Unit Pelaksanaan Pelayanan Pelanggan'.toUpperCase()}</td>
</tr>
<tr>
<td> Unit Layanan Pelanggan</td>
<td>:</td>
<td> ${reportMeta.posko ? reportMeta.ulp.name.toUpperCase() : 'Semua Unit Layanan Pelanggan'.toUpperCase()}</td>
</tr>
</table>
<center><h6>${filename.toUpperCase()}</h6></center>
<table class="main">
<thead>
<tr>
<th>No</th>
<th>ULP</th>
<th>No Laporan</th>
<th>Tgl/ Jam Lapor</th>
<th>Tgl/ Jam Datang</th>
<th>Tgl/ Jam Nyala</th>
<th>Durasi Response Time</th>
<th>Durasi Recovery Time</th>
<th>Durasi Penugasan Regu</th>
<th>Durasi Perjalanan Regu</th>
<th>Dispatch Oleh</th>
<th>IDPEL/NO METER</th>
<th>Nama Pelapor</th>
<th>Alamat Pelapor</th>
<th>No Telp Pelapor</th>
<th>Keterangan Pelapor</th>
<th>Sumber Lapor</th>
<th>Diselesaikan Oleh</th>
<th>Status</th>
<th>Referensi Marking</th>
<th>Kode Gangguan</th>
<th>Jenis Gangguan</th>
<th>Tindakan</th>
</tr>
</thead>
<tbody>
${tbody}
</tbody>
</table>
`
var postHtml = `<br>
<footer>
<p style="text-align: right; font-size: 10px;">${day}, ${date}-${month}-${year}</p>
<br>
<p style="text-align: right; font-size: 10px;">(.........................................)</p>
</footer></div></body></html>`;
var html = preHtml + body + postHtml;
var url =
"data:application/vnd.ms-word;charset=utf-8," + encodeURIComponent(html);
filename = filename ? filename + ".doc" : "document.doc";
var downloadLink = document.createElement("a");
document.body.appendChild(downloadLink);
downloadLink.href = url;
downloadLink.download = filename;
downloadLink.click();
document.body.removeChild(downloadLink);
}
export { exportToWord, exportDetailToWord }

288
src/report/Monalisa/Gangguan/Rekap/doc/MonalisaGR_ENSGangguan_DOC.ts Normal file
View File

@ -0,0 +1,288 @@
import { formatWaktu } from "@/components/Form/FiltersType/reference";
import { getMonthName } from "@/utils/texts";
const day = new Date().toLocaleString('id-ID', { weekday: 'long' })
const date = new Date().getDate()
const month = new Date().toLocaleString('id-ID', { month: 'long' })
const year = new Date().getFullYear()
const company = "PT. PLN (Persero)";
const exportToWord = (reportMeta: any, rawData: any, filename: any, periode: any) => {
var preHtml = `<html xmlns:o='urn:schemas-microsoft-com:office:office' xmlns:w='urn:schemas-microsoft-com:office:word' xmlns='http://www.w3.org/TR/REC-html40'><head><meta charset='utf-8'><title>${filename}</title>
<style type="text/css" media="print">
@page Section1 {
size:841.95pt 21.0cm;
mso-page-orientation:landscape;
margin:72.0pt 72.0pt 72.0pt 72.0pt;
mso-header-margin:35.4pt;
mso-footer-margin:35.4pt;
mso-paper-source:0;
}
@page{
size: landscape;
font-size: 5px;
}
div.Section1 {
page:Section1;
}
table.main {
border-collapse: collapse;
width: 100%;
text-transform: uppercase;
font-size: 8px;
}
table.main thead tr {
background-color: #c0c0c0;
}
</style>
</head><body>
<div class="Section1">
`;
var tbody = ``;
for (let index = 0; index < rawData.length; index++) {
const element = rawData[index];
var column = `<tr>`;
let styleTotal = '';
for (let i = 0; i < element.length; i++) {
const content = element[i];
const colSpan = content?.colSpan !== undefined ? `colspan="${content.colSpan}"` : ''
if (content && (content.content === 'TOTAL' || content.content === 'GRAND TOTAL')) {
styleTotal = 'style="background-color: #c0c0c0; font-weight: bold;"'
}
i === 0 ?
column += `<td ${styleTotal} ${colSpan} align="left">${content.content}</td>`
: column += `<td ${styleTotal}>${content}</td>`;
}
column += `</tr>`;
tbody += column;
}
var body = `
<table border=0 style="border:none">
<tr>
<td colspan="3"> ${company.toUpperCase()}</td>
</tr>
<tr>
<td> Unit Induk Distribusi/Wilayah </td>
<td>:</td>
<td> ${reportMeta.uid
? reportMeta.uid.name.toUpperCase()
: 'Semua Unit Induk Distribusi/Wilayah'.toUpperCase()}</td>
<tr>
<td> Unit Pelaksanaan Pelayanan Pelanggan</td>
<td>:</td>
<td> ${reportMeta.up3
? reportMeta.up3.name.toUpperCase()
: 'Semua Unit Pelaksanaan Pelayanan Pelanggan'.toUpperCase()}</td>
</tr>
<tr>
<td> Unit Layanan Pelanggan</td>
<td>:</td>
<td> ${reportMeta.ulp ? reportMeta.ulp.name.toUpperCase() : 'Semua Unit Layanan Pelanggan'.toUpperCase()}</td>
</tr>
</table>
<center><h6>${filename.toUpperCase()}</h6></center>
<table class="main">
<thead>
<tr>
<th rowspan="3">No</th>
<th rowspan="3">Nama Unit</th>
<th colspan="6">ENS Gangguan</th>
</tr>
<tr>
<th colspan="3">MOM</th>
<th colspan="3">YOY</th>
</tr>
<tr>
<th>${getMonthName(reportMeta.lastMonth)} ${reportMeta.lastYearMoM}</th>
<th>${getMonthName(reportMeta.currentMonth)} ${reportMeta.currentYear}</th>
<th>%</th>
<th>s.d ${getMonthName(reportMeta.currentMonth)} ${reportMeta.lastYear}</th>
<th>s.d ${getMonthName(reportMeta.currentMonth)} ${reportMeta.currentYear}</th>
<th>%</th>
</tr>
</thead>
<tbody>
${tbody}
</tbody>
</table>
`
var postHtml = `<br>
<footer>
<p style="text-align: right; font-size: 10px;">${day}, ${date}-${month}-${year}</p>
<br>
<p style="text-align: right; font-size: 10px;">(.........................................)</p>
</footer></div></body></html>`;
var html = preHtml + body + postHtml;
var url =
"data:application/vnd.ms-word;charset=utf-8," + encodeURIComponent(html);
filename = filename ? filename + ".doc" : "document.doc";
var downloadLink = document.createElement("a");
document.body.appendChild(downloadLink);
downloadLink.href = url;
downloadLink.download = filename;
downloadLink.click();
document.body.removeChild(downloadLink);
}
const exportDetailToWord = (reportMeta: any, rawData: any, filename: any, periode: any) => {
var preHtml = `<html xmlns:o='urn:schemas-microsoft-com:office:office' xmlns:w='urn:schemas-microsoft-com:office:word' xmlns='http://www.w3.org/TR/REC-html40'><head><meta charset='utf-8'><title>${filename}</title>
<style type="text/css" media="print">
@page Section1 {
size:841.95pt 21.0cm;
mso-page-orientation:landscape;
margin:72.0pt 72.0pt 72.0pt 72.0pt;
mso-header-margin:35.4pt;
mso-footer-margin:35.4pt;
mso-paper-source:0;
}
@page{
size: landscape;
font-size: 5px;
}
div.Section1 {
page:Section1;
}
table.main {
border-collapse: collapse;
width: 100%;
text-transform: uppercase;
font-size: 8px;
}
table.main thead tr {
background-color: #c0c0c0;
}
</style>
</head><body>
<div class="Section1">
`;
var tbody = ``;
var cr = ``;
rawData.map((item: any, i: any) => {
cr += '<tr>';
cr += `<td>${i + 1}</td>`;
cr += `<td>${item.nama_ulp}</td>`;
cr += `<td>${item.no_laporan}</td>`;
cr += `<td>${item.waktu_lapor}</td>`;
cr += `<td>${item.waktu_response}</td>`;
cr += `<td>${item.waktu_recovery}</td>`;
cr += `<td>${item.durasi_response_time ? formatWaktu(item.durasi_response_time) : ''}</td>`;
cr += `<td>${item.durasi_recovery_time ? formatWaktu(item.durasi_recovery_time) : ''}</td>`;
cr += '<td></td>';
cr += '<td></td>';
cr += '<td></td>';
cr += `<td>${item.idpel_nometer}</td>`;
cr += `<td>${item.nama_pelapor}</td>`;
cr += `<td>${item.alamat_pelapor}</td>`;
cr += `<td>${item.no_telp_pelapor}</td>`;
cr += `<td>${item.keterangan_pelapor}</td>`;
cr += '<td></td>';
cr += '<td></td>';
cr += `<td>${item.status_akhir}</td>`;
cr += '<td></td>';
cr += '<td></td>';
cr += '<td></td>';
cr += '<td></td>';
cr += '</tr>';
});
tbody += cr;
var body = `
<table border=0 style="border:none">
<tr>
<td colspan="3"> ${company.toUpperCase()}</td>
</tr>
<tr>
<td> Unit Induk Distribusi/Wilayah </td>
<td>:</td>
<td> ${reportMeta.uid
? reportMeta.uid.name.toUpperCase()
: 'Semua Unit Induk Distribusi/Wilayah'.toUpperCase()}</td>
<tr>
<td> Unit Pelaksanaan Pelayanan Pelanggan</td>
<td>:</td>
<td> ${reportMeta.up3
? reportMeta.up3.name.toUpperCase()
: 'Semua Unit Pelaksanaan Pelayanan Pelanggan'.toUpperCase()}</td>
</tr>
<tr>
<td> Unit Layanan Pelanggan</td>
<td>:</td>
<td> ${reportMeta.posko ? reportMeta.ulp.name.toUpperCase() : 'Semua Unit Layanan Pelanggan'.toUpperCase()}</td>
</tr>
</table>
<center><h6>${filename.toUpperCase()}</h6></center>
<table class="main">
<thead>
<tr>
<th>No</th>
<th>ULP</th>
<th>No Laporan</th>
<th>Tgl/ Jam Lapor</th>
<th>Tgl/ Jam Datang</th>
<th>Tgl/ Jam Nyala</th>
<th>Durasi Response Time</th>
<th>Durasi Recovery Time</th>
<th>Durasi Penugasan Regu</th>
<th>Durasi Perjalanan Regu</th>
<th>Dispatch Oleh</th>
<th>IDPEL/NO METER</th>
<th>Nama Pelapor</th>
<th>Alamat Pelapor</th>
<th>No Telp Pelapor</th>
<th>Keterangan Pelapor</th>
<th>Sumber Lapor</th>
<th>Diselesaikan Oleh</th>
<th>Status</th>
<th>Referensi Marking</th>
<th>Kode Gangguan</th>
<th>Jenis Gangguan</th>
<th>Tindakan</th>
</tr>
</thead>
<tbody>
${tbody}
</tbody>
</table>
`
var postHtml = `<br>
<footer>
<p style="text-align: right; font-size: 10px;">${day}, ${date}-${month}-${year}</p>
<br>
<p style="text-align: right; font-size: 10px;">(.........................................)</p>
</footer></div></body></html>`;
var html = preHtml + body + postHtml;
var url =
"data:application/vnd.ms-word;charset=utf-8," + encodeURIComponent(html);
filename = filename ? filename + ".doc" : "document.doc";
var downloadLink = document.createElement("a");
document.body.appendChild(downloadLink);
downloadLink.href = url;
downloadLink.download = filename;
downloadLink.click();
document.body.removeChild(downloadLink);
}
export { exportToWord, exportDetailToWord }

266
src/report/Monalisa/Gangguan/Rekap/doc/MonalisaGR_GangguanBelumSelesai_DOC.ts Normal file
View File

@ -0,0 +1,266 @@
import { formatWaktu } from "@/components/Form/FiltersType/reference";
import { getMonthName } from "@/utils/texts";
const day = new Date().toLocaleString('id-ID', { weekday: 'long' })
const date = new Date().getDate()
const month = new Date().toLocaleString('id-ID', { month: 'long' })
const year = new Date().getFullYear()
const company = "PT. PLN (Persero)";
const exportToWord = (reportMeta: any, rawData: any, filename: any, periode: any) => {
var preHtml = `<html xmlns:o='urn:schemas-microsoft-com:office:office' xmlns:w='urn:schemas-microsoft-com:office:word' xmlns='http://www.w3.org/TR/REC-html40'><head><meta charset='utf-8'><title>${filename}</title>
<style type="text/css" media="print">
@page Section1 {
size:841.95pt 21.0cm;
mso-page-orientation:landscape;
margin:72.0pt 72.0pt 72.0pt 72.0pt;
mso-header-margin:35.4pt;
mso-footer-margin:35.4pt;
mso-paper-source:0;
}
@page{
size: landscape;
font-size: 5px;
}
div.Section1 {
page:Section1;
}
table.main {
border-collapse: collapse;
width: 100%;
text-transform: uppercase;
font-size: 8px;
}
table.main thead tr {
background-color: #c0c0c0;
}
</style>
</head><body>
<div class="Section1">
`;
var tbody = ``;
for (let index = 0; index < rawData.length; index++) {
const element = rawData[index];
var column = `<tr>`;
let styleTotal = '';
for (let i = 0; i < element.length; i++) {
const content = element[i];
const colSpan = content?.colSpan !== undefined ? `colspan="${content.colSpan}"` : ''
if (content && (content.content === 'TOTAL' || content.content === 'GRAND TOTAL')) {
styleTotal = 'style="background-color: #c0c0c0; font-weight: bold;"'
}
i === 0 ?
column += `<td ${styleTotal} ${colSpan} align="left">${content.content}</td>`
: column += `<td ${styleTotal}>${content}</td>`;
}
column += `</tr>`;
tbody += column;
}
var body = `
<table border=0 style="border:none">
<tr>
<td colspan="3"> ${company.toUpperCase()}</td>
</tr>
<tr>
<td> Unit Induk Distribusi/Wilayah </td>
<td>:</td>
<td> ${reportMeta.uid
? reportMeta.uid.name.toUpperCase()
: 'Semua Unit Induk Distribusi/Wilayah'.toUpperCase()}</td>
<tr>
<td> Unit Pelaksanaan Pelayanan Pelanggan</td>
<td>:</td>
<td> ${reportMeta.up3
? reportMeta.up3.name.toUpperCase()
: 'Semua Unit Pelaksanaan Pelayanan Pelanggan'.toUpperCase()}</td>
</tr>
<tr>
<td> Unit Layanan Pelanggan</td>
<td>:</td>
<td> ${reportMeta.ulp ? reportMeta.ulp.name.toUpperCase() : 'Semua Unit Layanan Pelanggan'.toUpperCase()}</td>
</tr>
</table>
<center><h6>${filename.toUpperCase()}</h6></center>
<table class="main">
<thead>
<tr>
<th rowspan="2">No</th>
<th rowspan="2">Nama Unit</th>
<th colspan="3">Tahun</th>
</tr>
<tr>
<th>Gangguan</th>
<th>Informasi</th>
<th>Total</th>
</tr>
</thead>
<tbody>
${tbody}
</tbody>
</table>
`
var postHtml = `<br>
<footer>
<p style="text-align: right; font-size: 10px;">${day}, ${date}-${month}-${year}</p>
<br>
<p style="text-align: right; font-size: 10px;">(.........................................)</p>
</footer></div></body></html>`;
var html = preHtml + body + postHtml;
var url =
"data:application/vnd.ms-word;charset=utf-8," + encodeURIComponent(html);
filename = filename ? filename + ".doc" : "document.doc";
var downloadLink = document.createElement("a");
document.body.appendChild(downloadLink);
downloadLink.href = url;
downloadLink.download = filename;
downloadLink.click();
document.body.removeChild(downloadLink);
}
const exportDetailToWord = (reportMeta: any, rawData: any, filename: any, periode: any) => {
var preHtml = `<html xmlns:o='urn:schemas-microsoft-com:office:office' xmlns:w='urn:schemas-microsoft-com:office:word' xmlns='http://www.w3.org/TR/REC-html40'><head><meta charset='utf-8'><title>${filename}</title>
<style type="text/css" media="print">
@page Section1 {
size:841.95pt 21.0cm;
mso-page-orientation:landscape;
margin:72.0pt 72.0pt 72.0pt 72.0pt;
mso-header-margin:35.4pt;
mso-footer-margin:35.4pt;
mso-paper-source:0;
}
@page{
size: landscape;
font-size: 5px;
}
div.Section1 {
page:Section1;
}
table.main {
border-collapse: collapse;
width: 100%;
text-transform: uppercase;
font-size: 8px;
}
table.main thead tr {
background-color: #c0c0c0;
}
</style>
</head><body>
<div class="Section1">
`;
var tbody = ``;
var cr = ``;
rawData.map((item: any, i: any) => {
cr += '<tr>';
cr += `<td>${i + 1}</td>`;
cr += `<td> item.no_laporan}</td>`;
cr += `<td>${item.nama_uid}</td>`;
cr += `<td>${item.nama_ulp}</td>`;
cr += `<td>${item.id_pelanggan}</td>`;
cr += `<td>${item.nama_pelapor}</td>`;
cr += `<td>${item.alamat_pelapor}</td>`;
cr += `<td>${item.no_telp_pelapor}</td>`;
cr += `<td>${item.keterangan_pelapor}</td>`;
cr += `<td>${item.penyebab}</td>`;
cr += `<td>${item.kode_gangguan}</td>`;
cr += `<td>${item.jenis_gangguan}</td>`;
cr += `<td>${item.durasi_response_time ? formatWaktu(item.durasi_response_time) : '-'}</td>`;
cr += `<td>${item.durasi_recovery_time ? formatWaktu(item.durasi_recovery_time) : '-'}</td>`;
cr += `<td>${item.waktu_lapor}</td>`;
cr += '</tr>';
});
tbody += cr;
var body = `
<table border=0 style="border:none">
<tr>
<td colspan="3"> ${company.toUpperCase()}</td>
</tr>
<tr>
<td> Unit Induk Distribusi/Wilayah </td>
<td>:</td>
<td> ${reportMeta.uid
? reportMeta.uid.name.toUpperCase()
: 'Semua Unit Induk Distribusi/Wilayah'.toUpperCase()}</td>
<tr>
<td> Unit Pelaksanaan Pelayanan Pelanggan</td>
<td>:</td>
<td> ${reportMeta.up3
? reportMeta.up3.name.toUpperCase()
: 'Semua Unit Pelaksanaan Pelayanan Pelanggan'.toUpperCase()}</td>
</tr>
<tr>
<td> Unit Layanan Pelanggan</td>
<td>:</td>
<td> ${reportMeta.posko ? reportMeta.ulp.name.toUpperCase() : 'Semua Unit Layanan Pelanggan'.toUpperCase()}</td>
</tr>
</table>
<center><h6>${filename.toUpperCase()}</h6></center>
<table class="main">
<thead>
<tr>
<th>No</th>
<th>No Laporan</th>
<th>UID/UIW</th>
<th>UP3</th>
<th>ULP</th>
<th>ID Pelanggan</th>
<th>Nama Pelapor</th>
<th>Alamat Pelapor</th>
<th>No Telp Pelapor</th>
<th>Keterangan Pelapor</th>
<th>Penyebab</th>
<th>Kode Gangguan</th>
<th>Jenis Gangguan</th>
<th>Durasi Response Time</th>
<th>Durasi Recovery Time</th>
<th>Tgl Lapor</th>
</tr>
</thead>
<tbody>
${tbody}
</tbody>
</table>
`
var postHtml = `<br>
<footer>
<p style="text-align: right; font-size: 10px;">${day}, ${date}-${month}-${year}</p>
<br>
<p style="text-align: right; font-size: 10px;">(.........................................)</p>
</footer></div></body></html>`;
var html = preHtml + body + postHtml;
var url =
"data:application/vnd.ms-word;charset=utf-8," + encodeURIComponent(html);
filename = filename ? filename + ".doc" : "document.doc";
var downloadLink = document.createElement("a");
document.body.appendChild(downloadLink);
downloadLink.href = url;
downloadLink.download = filename;
downloadLink.click();
document.body.removeChild(downloadLink);
}
export { exportToWord, exportDetailToWord }

278
src/report/Monalisa/Gangguan/Rekap/doc/MonalisaGR_GangguanPerJenisGangguan_DOC.ts Normal file
View File

@ -0,0 +1,278 @@
import { formatWaktu } from "@/components/Form/FiltersType/reference";
import { getMonthName } from "@/utils/texts";
const day = new Date().toLocaleString('id-ID', { weekday: 'long' })
const date = new Date().getDate()
const month = new Date().toLocaleString('id-ID', { month: 'long' })
const year = new Date().getFullYear()
const company = "PT. PLN (Persero)";
const exportToWord = (reportMeta: any, rawData: any, filename: any, periode: any) => {
var preHtml = `<html xmlns:o='urn:schemas-microsoft-com:office:office' xmlns:w='urn:schemas-microsoft-com:office:word' xmlns='http://www.w3.org/TR/REC-html40'><head><meta charset='utf-8'><title>${filename}</title>
<style type="text/css" media="print">
@page Section1 {
size:841.95pt 21.0cm;
mso-page-orientation:landscape;
margin:72.0pt 72.0pt 72.0pt 72.0pt;
mso-header-margin:35.4pt;
mso-footer-margin:35.4pt;
mso-paper-source:0;
}
@page{
size: landscape;
font-size: 5px;
}
div.Section1 {
page:Section1;
}
table.main {
border-collapse: collapse;
width: 100%;
text-transform: uppercase;
font-size: 8px;
}
table.main thead tr {
background-color: #c0c0c0;
}
</style>
</head><body>
<div class="Section1">
`;
var tbody = ``;
for (let index = 0; index < rawData.length; index++) {
const element = rawData[index];
var column = `<tr>`;
let styleTotal = '';
for (let i = 0; i < element.length; i++) {
const content = element[i];
const colSpan = content?.colSpan !== undefined ? `colspan="${content.colSpan}"` : ''
if (content && (content.content === 'TOTAL' || content.content === 'GRAND TOTAL')) {
styleTotal = 'style="background-color: #c0c0c0; font-weight: bold;"'
}
i === 0 ?
column += `<td ${styleTotal} ${colSpan} align="left">${content.content}</td>`
: column += `<td ${styleTotal}>${content}</td>`;
}
column += `</tr>`;
tbody += column;
}
var body = `
<table border=0 style="border:none">
<tr>
<td colspan="3"> ${company.toUpperCase()}</td>
</tr>
<tr>
<td> Unit Induk Distribusi/Wilayah </td>
<td>:</td>
<td> ${reportMeta.uid
? reportMeta.uid.name.toUpperCase()
: 'Semua Unit Induk Distribusi/Wilayah'.toUpperCase()}</td>
<tr>
<td> Unit Pelaksanaan Pelayanan Pelanggan</td>
<td>:</td>
<td> ${reportMeta.up3
? reportMeta.up3.name.toUpperCase()
: 'Semua Unit Pelaksanaan Pelayanan Pelanggan'.toUpperCase()}</td>
</tr>
<tr>
<td> Unit Layanan Pelanggan</td>
<td>:</td>
<td> ${reportMeta.ulp ? reportMeta.ulp.name.toUpperCase() : 'Semua Unit Layanan Pelanggan'.toUpperCase()}</td>
</tr>
</table>
<center><h6>${filename.toUpperCase()}</h6></center>
<table class="main">
<thead>
<tr>
<th>No</th>
<th>ID Gangguan</th>
<th>Jenis Gangguan</th>
<th>Jumlah</th>
<th>%</th>
</tr>
</thead>
<tbody>
${tbody}
</tbody>
</table>
`
var postHtml = `<br>
<footer>
<p style="text-align: right; font-size: 10px;">${day}, ${date}-${month}-${year}</p>
<br>
<p style="text-align: right; font-size: 10px;">(.........................................)</p>
</footer></div></body></html>`;
var html = preHtml + body + postHtml;
var url =
"data:application/vnd.ms-word;charset=utf-8," + encodeURIComponent(html);
filename = filename ? filename + ".doc" : "document.doc";
var downloadLink = document.createElement("a");
document.body.appendChild(downloadLink);
downloadLink.href = url;
downloadLink.download = filename;
downloadLink.click();
document.body.removeChild(downloadLink);
}
const exportDetailToWord = (reportMeta: any, rawData: any, filename: any, periode: any) => {
var preHtml = `<html xmlns:o='urn:schemas-microsoft-com:office:office' xmlns:w='urn:schemas-microsoft-com:office:word' xmlns='http://www.w3.org/TR/REC-html40'><head><meta charset='utf-8'><title>${filename}</title>
<style type="text/css" media="print">
@page Section1 {
size:841.95pt 21.0cm;
mso-page-orientation:landscape;
margin:72.0pt 72.0pt 72.0pt 72.0pt;
mso-header-margin:35.4pt;
mso-footer-margin:35.4pt;
mso-paper-source:0;
}
@page{
size: landscape;
font-size: 5px;
}
div.Section1 {
page:Section1;
}
table.main {
border-collapse: collapse;
width: 100%;
text-transform: uppercase;
font-size: 8px;
}
table.main thead tr {
background-color: #c0c0c0;
}
</style>
</head><body>
<div class="Section1">
`;
var tbody = ``;
var cr = ``;
rawData.map((item: any, i: any) => {
cr += '<tr>';
cr += `<td>${i + 1}</td>`;
cr += `<td>${item.nama_ulp}</td>`;
cr += `<td>${item.no_laporan}</td>`;
cr += `<td>${item.waktu_lapor}</td>`;
cr += `<td>${item.waktu_response}</td>`;
cr += `<td>${item.waktu_recovery}</td>`;
cr += `<td>${item.durasi_response_time ? formatWaktu(item.durasi_response_time) : ''}</td>`;
cr += `<td>${item.durasi_recovery_time ? formatWaktu(item.durasi_recovery_time) : ''}</td>`;
cr += '<td></td>';
cr += '<td></td>';
cr += '<td></td>';
cr += `<td>${item.idpel_nometer}</td>`;
cr += `<td>${item.nama_pelapor}</td>`;
cr += `<td>${item.alamat_pelapor}</td>`;
cr += `<td>${item.no_telp_pelapor}</td>`;
cr += `<td>${item.keterangan_pelapor}</td>`;
cr += '<td></td>';
cr += '<td></td>';
cr += `<td>${item.status_akhir}</td>`;
cr += '<td></td>';
cr += '<td></td>';
cr += '<td></td>';
cr += '<td></td>';
cr += '</tr>';
});
tbody += cr;
var body = `
<table border=0 style="border:none">
<tr>
<td colspan="3"> ${company.toUpperCase()}</td>
</tr>
<tr>
<td> Unit Induk Distribusi/Wilayah </td>
<td>:</td>
<td> ${reportMeta.uid
? reportMeta.uid.name.toUpperCase()
: 'Semua Unit Induk Distribusi/Wilayah'.toUpperCase()}</td>
<tr>
<td> Unit Pelaksanaan Pelayanan Pelanggan</td>
<td>:</td>
<td> ${reportMeta.up3
? reportMeta.up3.name.toUpperCase()
: 'Semua Unit Pelaksanaan Pelayanan Pelanggan'.toUpperCase()}</td>
</tr>
<tr>
<td> Unit Layanan Pelanggan</td>
<td>:</td>
<td> ${reportMeta.posko ? reportMeta.ulp.name.toUpperCase() : 'Semua Unit Layanan Pelanggan'.toUpperCase()}</td>
</tr>
</table>
<center><h6>${filename.toUpperCase()}</h6></center>
<table class="main">
<thead>
<tr>
<th>No</th>
<th>ULP</th>
<th>No Laporan</th>
<th>Tgl/ Jam Lapor</th>
<th>Tgl/ Jam Datang</th>
<th>Tgl/ Jam Nyala</th>
<th>Durasi Response Time</th>
<th>Durasi Recovery Time</th>
<th>Durasi Penugasan Regu</th>
<th>Durasi Perjalanan Regu</th>
<th>Dispatch Oleh</th>
<th>IDPEL/NO METER</th>
<th>Nama Pelapor</th>
<th>Alamat Pelapor</th>
<th>No Telp Pelapor</th>
<th>Keterangan Pelapor</th>
<th>Sumber Lapor</th>
<th>Diselesaikan Oleh</th>
<th>Status</th>
<th>Referensi Marking</th>
<th>Kode Gangguan</th>
<th>Jenis Gangguan</th>
<th>Tindakan</th>
</tr>
</thead>
<tbody>
${tbody}
</tbody>
</table>
`
var postHtml = `<br>
<footer>
<p style="text-align: right; font-size: 10px;">${day}, ${date}-${month}-${year}</p>
<br>
<p style="text-align: right; font-size: 10px;">(.........................................)</p>
</footer></div></body></html>`;
var html = preHtml + body + postHtml;
var url =
"data:application/vnd.ms-word;charset=utf-8," + encodeURIComponent(html);
filename = filename ? filename + ".doc" : "document.doc";
var downloadLink = document.createElement("a");
document.body.appendChild(downloadLink);
downloadLink.href = url;
downloadLink.download = filename;
downloadLink.click();
document.body.removeChild(downloadLink);
}
export { exportToWord, exportDetailToWord }

311
src/report/Monalisa/Gangguan/Rekap/doc/MonalisaGR_JumlahDDRPTRCTGangguan_DOC.ts Normal file
View File

@ -0,0 +1,311 @@
import { formatWaktu } from "@/components/Form/FiltersType/reference";
import { getMonthName } from "@/utils/texts";
const day = new Date().toLocaleString('id-ID', { weekday: 'long' })
const date = new Date().getDate()
const month = new Date().toLocaleString('id-ID', { month: 'long' })
const year = new Date().getFullYear()
const company = "PT. PLN (Persero)";
const exportToWord = (reportMeta: any, rawData: any, filename: any, periode: any) => {
var preHtml = `<html xmlns:o='urn:schemas-microsoft-com:office:office' xmlns:w='urn:schemas-microsoft-com:office:word' xmlns='http://www.w3.org/TR/REC-html40'><head><meta charset='utf-8'><title>${filename}</title>
<style type="text/css" media="print">
@page Section1 {
size:841.95pt 21.0cm;
mso-page-orientation:landscape;
margin:72.0pt 72.0pt 72.0pt 72.0pt;
mso-header-margin:35.4pt;
mso-footer-margin:35.4pt;
mso-paper-source:0;
}
@page{
size: landscape;
font-size: 5px;
}
div.Section1 {
page:Section1;
}
table.main {
border-collapse: collapse;
width: 100%;
text-transform: uppercase;
font-size: 8px;
}
table.main thead tr {
background-color: #c0c0c0;
}
</style>
</head><body>
<div class="Section1">
`;
var tbody = ``;
for (let index = 0; index < rawData.length; index++) {
const element = rawData[index];
var column = `<tr>`;
let styleTotal = '';
for (let i = 0; i < element.length; i++) {
const content = element[i];
const colSpan = content?.colSpan !== undefined ? `colspan="${content.colSpan}"` : ''
if (content && (content.content === 'TOTAL' || content.content === 'GRAND TOTAL')) {
styleTotal = 'style="background-color: #c0c0c0; font-weight: bold;"'
}
i === 0 ?
column += `<td ${styleTotal} ${colSpan} align="left">${content.content}</td>`
: column += `<td ${styleTotal}>${content}</td>`;
}
column += `</tr>`;
tbody += column;
}
var body = `
<table border=0 style="border:none">
<tr>
<td colspan="3"> ${company.toUpperCase()}</td>
</tr>
<tr>
<td> Unit Induk Distribusi/Wilayah </td>
<td>:</td>
<td> ${reportMeta.uid
? reportMeta.uid.name.toUpperCase()
: 'Semua Unit Induk Distribusi/Wilayah'.toUpperCase()}</td>
<tr>
<td> Unit Pelaksanaan Pelayanan Pelanggan</td>
<td>:</td>
<td> ${reportMeta.up3
? reportMeta.up3.name.toUpperCase()
: 'Semua Unit Pelaksanaan Pelayanan Pelanggan'.toUpperCase()}</td>
</tr>
<tr>
<td> Unit Layanan Pelanggan</td>
<td>:</td>
<td> ${reportMeta.ulp ? reportMeta.ulp.name.toUpperCase() : 'Semua Unit Layanan Pelanggan'.toUpperCase()}</td>
</tr>
</table>
<center><h6>${filename.toUpperCase()}</h6></center>
<table class="main">
<thead>
<<tr>
<th rowspan="4">Nama Unit</th>
<th colspan="12">Jumlah dan Durasi RPT & RCT Gangguan</th>
</tr>
<tr>
<th colspan="6">
${getMonthName(reportMeta.currentMonth)} ${reportMeta.currentYear}
</th>
<th colspan="6">
s.d ${getMonthName(reportMeta.currentMonth)} ${reportMeta.currentYear}
</th>
</tr>
<tr>
<th>Total RPT</th>
<th>Jumlah Gangguan</th>
<th>RPT Gangguan</th>
<th>Total RCT</th>
<th>Jumlah Gangguan</th>
<th>RCT Gangguan</th>
<th>Total RPT</th>
<th>Jumlah Gangguan</th>
<th>RPT Gangguan</th>
<th>Total RCT</th>
<th>Jumlah Gangguan</th>
<th>RCT Gangguan</th>
</tr>
<tr>
<td>a</td>
<td>b</td>
<td>c=a/b</td>
<td>d</td>
<td>e</td>
<td>f=d/e</td>
<td>a</td>
<td>b</td>
<td>c=a/b</td>
<td>d</td>
<td>e</td>
<td>f=d/e</td>
</tr>
</thead>
<tbody>
${tbody}
</tbody>
</table>
`
var postHtml = `<br>
<footer>
<p style="text-align: right; font-size: 10px;">${day}, ${date}-${month}-${year}</p>
<br>
<p style="text-align: right; font-size: 10px;">(.........................................)</p>
</footer></div></body></html>`;
var html = preHtml + body + postHtml;
var url =
"data:application/vnd.ms-word;charset=utf-8," + encodeURIComponent(html);
filename = filename ? filename + ".doc" : "document.doc";
var downloadLink = document.createElement("a");
document.body.appendChild(downloadLink);
downloadLink.href = url;
downloadLink.download = filename;
downloadLink.click();
document.body.removeChild(downloadLink);
}
const exportDetailToWord = (reportMeta: any, rawData: any, filename: any, periode: any) => {
var preHtml = `<html xmlns:o='urn:schemas-microsoft-com:office:office' xmlns:w='urn:schemas-microsoft-com:office:word' xmlns='http://www.w3.org/TR/REC-html40'><head><meta charset='utf-8'><title>${filename}</title>
<style type="text/css" media="print">
@page Section1 {
size:841.95pt 21.0cm;
mso-page-orientation:landscape;
margin:72.0pt 72.0pt 72.0pt 72.0pt;
mso-header-margin:35.4pt;
mso-footer-margin:35.4pt;
mso-paper-source:0;
}
@page{
size: landscape;
font-size: 5px;
}
div.Section1 {
page:Section1;
}
table.main {
border-collapse: collapse;
width: 100%;
text-transform: uppercase;
font-size: 8px;
}
table.main thead tr {
background-color: #c0c0c0;
}
</style>
</head><body>
<div class="Section1">
`;
var tbody = ``;
var cr = ``;
rawData.map((item: any, i: any) => {
cr += '<tr>';
cr += `<td>${i + 1}</td>`;
cr += `<td>${item.nama_ulp}</td>`;
cr += `<td>${item.no_laporan}</td>`;
cr += `<td>${item.waktu_lapor}</td>`;
cr += `<td>${item.waktu_response}</td>`;
cr += `<td>${item.waktu_recovery}</td>`;
cr += `<td>${item.durasi_response_time ? formatWaktu(item.durasi_response_time) : ''}</td>`;
cr += `<td>${item.durasi_recovery_time ? formatWaktu(item.durasi_recovery_time) : ''}</td>`;
cr += '<td></td>';
cr += '<td></td>';
cr += '<td></td>';
cr += `<td>${item.idpel_nometer}</td>`;
cr += `<td>${item.nama_pelapor}</td>`;
cr += `<td>${item.alamat_pelapor}</td>`;
cr += `<td>${item.no_telp_pelapor}</td>`;
cr += `<td>${item.keterangan_pelapor}</td>`;
cr += '<td></td>';
cr += '<td></td>';
cr += `<td>${item.status_akhir}</td>`;
cr += '<td></td>';
cr += '<td></td>';
cr += '<td></td>';
cr += '<td></td>';
cr += '</tr>';
});
tbody += cr;
var body = `
<table border=0 style="border:none">
<tr>
<td colspan="3"> ${company.toUpperCase()}</td>
</tr>
<tr>
<td> Unit Induk Distribusi/Wilayah </td>
<td>:</td>
<td> ${reportMeta.uid
? reportMeta.uid.name.toUpperCase()
: 'Semua Unit Induk Distribusi/Wilayah'.toUpperCase()}</td>
<tr>
<td> Unit Pelaksanaan Pelayanan Pelanggan</td>
<td>:</td>
<td> ${reportMeta.up3
? reportMeta.up3.name.toUpperCase()
: 'Semua Unit Pelaksanaan Pelayanan Pelanggan'.toUpperCase()}</td>
</tr>
<tr>
<td> Unit Layanan Pelanggan</td>
<td>:</td>
<td> ${reportMeta.posko ? reportMeta.ulp.name.toUpperCase() : 'Semua Unit Layanan Pelanggan'.toUpperCase()}</td>
</tr>
</table>
<center><h6>${filename.toUpperCase()}</h6></center>
<table class="main">
<thead>
<tr>
<th>No</th>
<th>ULP</th>
<th>No Laporan</th>
<th>Tgl/ Jam Lapor</th>
<th>Tgl/ Jam Datang</th>
<th>Tgl/ Jam Nyala</th>
<th>Durasi Response Time</th>
<th>Durasi Recovery Time</th>
<th>Durasi Penugasan Regu</th>
<th>Durasi Perjalanan Regu</th>
<th>Dispatch Oleh</th>
<th>IDPEL/NO METER</th>
<th>Nama Pelapor</th>
<th>Alamat Pelapor</th>
<th>No Telp Pelapor</th>
<th>Keterangan Pelapor</th>
<th>Sumber Lapor</th>
<th>Diselesaikan Oleh</th>
<th>Status</th>
<th>Referensi Marking</th>
<th>Kode Gangguan</th>
<th>Jenis Gangguan</th>
<th>Tindakan</th>
</tr>
</thead>
<tbody>
${tbody}
</tbody>
</table>
`
var postHtml = `<br>
<footer>
<p style="text-align: right; font-size: 10px;">${day}, ${date}-${month}-${year}</p>
<br>
<p style="text-align: right; font-size: 10px;">(.........................................)</p>
</footer></div></body></html>`;
var html = preHtml + body + postHtml;
var url =
"data:application/vnd.ms-word;charset=utf-8," + encodeURIComponent(html);
filename = filename ? filename + ".doc" : "document.doc";
var downloadLink = document.createElement("a");
document.body.appendChild(downloadLink);
downloadLink.href = url;
downloadLink.download = filename;
downloadLink.click();
document.body.removeChild(downloadLink);
}
export { exportToWord, exportDetailToWord }

288
src/report/Monalisa/Gangguan/Rekap/doc/MonalisaGR_JumlahKaliGangguan_DOC.ts Normal file
View File

@ -0,0 +1,288 @@
import { formatWaktu } from "@/components/Form/FiltersType/reference";
import { getMonthName } from "@/utils/texts";
const day = new Date().toLocaleString('id-ID', { weekday: 'long' })
const date = new Date().getDate()
const month = new Date().toLocaleString('id-ID', { month: 'long' })
const year = new Date().getFullYear()
const company = "PT. PLN (Persero)";
const exportToWord = (reportMeta: any, rawData: any, filename: any, periode: any) => {
var preHtml = `<html xmlns:o='urn:schemas-microsoft-com:office:office' xmlns:w='urn:schemas-microsoft-com:office:word' xmlns='http://www.w3.org/TR/REC-html40'><head><meta charset='utf-8'><title>${filename}</title>
<style type="text/css" media="print">
@page Section1 {
size:841.95pt 21.0cm;
mso-page-orientation:landscape;
margin:72.0pt 72.0pt 72.0pt 72.0pt;
mso-header-margin:35.4pt;
mso-footer-margin:35.4pt;
mso-paper-source:0;
}
@page{
size: landscape;
font-size: 5px;
}
div.Section1 {
page:Section1;
}
table.main {
border-collapse: collapse;
width: 100%;
text-transform: uppercase;
font-size: 8px;
}
table.main thead tr {
background-color: #c0c0c0;
}
</style>
</head><body>
<div class="Section1">
`;
var tbody = ``;
for (let index = 0; index < rawData.length; index++) {
const element = rawData[index];
var column = `<tr>`;
let styleTotal = '';
for (let i = 0; i < element.length; i++) {
const content = element[i];
const colSpan = content?.colSpan !== undefined ? `colspan="${content.colSpan}"` : ''
if (content && (content.content === 'TOTAL' || content.content === 'GRAND TOTAL')) {
styleTotal = 'style="background-color: #c0c0c0; font-weight: bold;"'
}
i === 0 ?
column += `<td ${styleTotal} ${colSpan} align="left">${content.content}</td>`
: column += `<td ${styleTotal}>${content}</td>`;
}
column += `</tr>`;
tbody += column;
}
var body = `
<table border=0 style="border:none">
<tr>
<td colspan="3"> ${company.toUpperCase()}</td>
</tr>
<tr>
<td> Unit Induk Distribusi/Wilayah </td>
<td>:</td>
<td> ${reportMeta.uid
? reportMeta.uid.name.toUpperCase()
: 'Semua Unit Induk Distribusi/Wilayah'.toUpperCase()}</td>
<tr>
<td> Unit Pelaksanaan Pelayanan Pelanggan</td>
<td>:</td>
<td> ${reportMeta.up3
? reportMeta.up3.name.toUpperCase()
: 'Semua Unit Pelaksanaan Pelayanan Pelanggan'.toUpperCase()}</td>
</tr>
<tr>
<td> Unit Layanan Pelanggan</td>
<td>:</td>
<td> ${reportMeta.ulp ? reportMeta.ulp.name.toUpperCase() : 'Semua Unit Layanan Pelanggan'.toUpperCase()}</td>
</tr>
</table>
<center><h6>${filename.toUpperCase()}</h6></center>
<table class="main">
<thead>
<tr>
<th rowspan="3">No</th>
<th rowspan="3">Nama Unit</th>
<th colspan="6">Jumlah Kali Gangguan</th>
</tr>
<tr>
<th colspan="3">MOM</th>
<th colspan="3">YOY</th>
</tr>
<tr>
<th>${getMonthName(reportMeta.lastMonth)} ${reportMeta.lastYearMoM}</th>
<th>${getMonthName(reportMeta.currentMonth)} ${reportMeta.currentYear}</th>
<th>%</th>
<th>s.d ${getMonthName(reportMeta.currentMonth)} ${reportMeta.lastYear}</th>
<th>s.d ${getMonthName(reportMeta.currentMonth)} ${reportMeta.currentYear}</th>
<th>%</th>
</tr>
</thead>
<tbody>
${tbody}
</tbody>
</table>
`
var postHtml = `<br>
<footer>
<p style="text-align: right; font-size: 10px;">${day}, ${date}-${month}-${year}</p>
<br>
<p style="text-align: right; font-size: 10px;">(.........................................)</p>
</footer></div></body></html>`;
var html = preHtml + body + postHtml;
var url =
"data:application/vnd.ms-word;charset=utf-8," + encodeURIComponent(html);
filename = filename ? filename + ".doc" : "document.doc";
var downloadLink = document.createElement("a");
document.body.appendChild(downloadLink);
downloadLink.href = url;
downloadLink.download = filename;
downloadLink.click();
document.body.removeChild(downloadLink);
}
const exportDetailToWord = (reportMeta: any, rawData: any, filename: any, periode: any) => {
var preHtml = `<html xmlns:o='urn:schemas-microsoft-com:office:office' xmlns:w='urn:schemas-microsoft-com:office:word' xmlns='http://www.w3.org/TR/REC-html40'><head><meta charset='utf-8'><title>${filename}</title>
<style type="text/css" media="print">
@page Section1 {
size:841.95pt 21.0cm;
mso-page-orientation:landscape;
margin:72.0pt 72.0pt 72.0pt 72.0pt;
mso-header-margin:35.4pt;
mso-footer-margin:35.4pt;
mso-paper-source:0;
}
@page{
size: landscape;
font-size: 5px;
}
div.Section1 {
page:Section1;
}
table.main {
border-collapse: collapse;
width: 100%;
text-transform: uppercase;
font-size: 8px;
}
table.main thead tr {
background-color: #c0c0c0;
}
</style>
</head><body>
<div class="Section1">
`;
var tbody = ``;
var cr = ``;
rawData.map((item: any, i: any) => {
cr += '<tr>';
cr += `<td>${i + 1}</td>`;
cr += `<td>${item.nama_ulp}</td>`;
cr += `<td>${item.no_laporan}</td>`;
cr += `<td>${item.waktu_lapor}</td>`;
cr += `<td>${item.waktu_response}</td>`;
cr += `<td>${item.waktu_recovery}</td>`;
cr += `<td>${item.durasi_response_time ? formatWaktu(item.durasi_response_time) : ''}</td>`;
cr += `<td>${item.durasi_recovery_time ? formatWaktu(item.durasi_recovery_time) : ''}</td>`;
cr += '<td></td>';
cr += '<td></td>';
cr += '<td></td>';
cr += `<td>${item.idpel_nometer}</td>`;
cr += `<td>${item.nama_pelapor}</td>`;
cr += `<td>${item.alamat_pelapor}</td>`;
cr += `<td>${item.no_telp_pelapor}</td>`;
cr += `<td>${item.keterangan_pelapor}</td>`;
cr += '<td></td>';
cr += '<td></td>';
cr += `<td>${item.status_akhir}</td>`;
cr += '<td></td>';
cr += '<td></td>';
cr += '<td></td>';
cr += '<td></td>';
cr += '</tr>';
});
tbody += cr;
var body = `
<table border=0 style="border:none">
<tr>
<td colspan="3"> ${company.toUpperCase()}</td>
</tr>
<tr>
<td> Unit Induk Distribusi/Wilayah </td>
<td>:</td>
<td> ${reportMeta.uid
? reportMeta.uid.name.toUpperCase()
: 'Semua Unit Induk Distribusi/Wilayah'.toUpperCase()}</td>
<tr>
<td> Unit Pelaksanaan Pelayanan Pelanggan</td>
<td>:</td>
<td> ${reportMeta.up3
? reportMeta.up3.name.toUpperCase()
: 'Semua Unit Pelaksanaan Pelayanan Pelanggan'.toUpperCase()}</td>
</tr>
<tr>
<td> Unit Layanan Pelanggan</td>
<td>:</td>
<td> ${reportMeta.posko ? reportMeta.ulp.name.toUpperCase() : 'Semua Unit Layanan Pelanggan'.toUpperCase()}</td>
</tr>
</table>
<center><h6>${filename.toUpperCase()}</h6></center>
<table class="main">
<thead>
<tr>
<th>No</th>
<th>ULP</th>
<th>No Laporan</th>
<th>Tgl/ Jam Lapor</th>
<th>Tgl/ Jam Datang</th>
<th>Tgl/ Jam Nyala</th>
<th>Durasi Response Time</th>
<th>Durasi Recovery Time</th>
<th>Durasi Penugasan Regu</th>
<th>Durasi Perjalanan Regu</th>
<th>Dispatch Oleh</th>
<th>IDPEL/NO METER</th>
<th>Nama Pelapor</th>
<th>Alamat Pelapor</th>
<th>No Telp Pelapor</th>
<th>Keterangan Pelapor</th>
<th>Sumber Lapor</th>
<th>Diselesaikan Oleh</th>
<th>Status</th>
<th>Referensi Marking</th>
<th>Kode Gangguan</th>
<th>Jenis Gangguan</th>
<th>Tindakan</th>
</tr>
</thead>
<tbody>
${tbody}
</tbody>
</table>
`
var postHtml = `<br>
<footer>
<p style="text-align: right; font-size: 10px;">${day}, ${date}-${month}-${year}</p>
<br>
<p style="text-align: right; font-size: 10px;">(.........................................)</p>
</footer></div></body></html>`;
var html = preHtml + body + postHtml;
var url =
"data:application/vnd.ms-word;charset=utf-8," + encodeURIComponent(html);
filename = filename ? filename + ".doc" : "document.doc";
var downloadLink = document.createElement("a");
document.body.appendChild(downloadLink);
downloadLink.href = url;
downloadLink.download = filename;
downloadLink.click();
document.body.removeChild(downloadLink);
}
export { exportToWord, exportDetailToWord }

288
src/report/Monalisa/Gangguan/Rekap/doc/MonalisaGR_LaporUlang_DOC.ts Normal file
View File

@ -0,0 +1,288 @@
import { formatWaktu } from "@/components/Form/FiltersType/reference";
import { getMonthName } from "@/utils/texts";
const day = new Date().toLocaleString('id-ID', { weekday: 'long' })
const date = new Date().getDate()
const month = new Date().toLocaleString('id-ID', { month: 'long' })
const year = new Date().getFullYear()
const company = "PT. PLN (Persero)";
const exportToWord = (reportMeta: any, rawData: any, filename: any, periode: any) => {
var preHtml = `<html xmlns:o='urn:schemas-microsoft-com:office:office' xmlns:w='urn:schemas-microsoft-com:office:word' xmlns='http://www.w3.org/TR/REC-html40'><head><meta charset='utf-8'><title>${filename}</title>
<style type="text/css" media="print">
@page Section1 {
size:841.95pt 21.0cm;
mso-page-orientation:landscape;
margin:72.0pt 72.0pt 72.0pt 72.0pt;
mso-header-margin:35.4pt;
mso-footer-margin:35.4pt;
mso-paper-source:0;
}
@page{
size: landscape;
font-size: 5px;
}
div.Section1 {
page:Section1;
}
table.main {
border-collapse: collapse;
width: 100%;
text-transform: uppercase;
font-size: 8px;
}
table.main thead tr {
background-color: #c0c0c0;
}
</style>
</head><body>
<div class="Section1">
`;
var tbody = ``;
for (let index = 0; index < rawData.length; index++) {
const element = rawData[index];
var column = `<tr>`;
let styleTotal = '';
for (let i = 0; i < element.length; i++) {
const content = element[i];
const colSpan = content?.colSpan !== undefined ? `colspan="${content.colSpan}"` : ''
if (content && (content.content === 'TOTAL' || content.content === 'GRAND TOTAL')) {
styleTotal = 'style="background-color: #c0c0c0; font-weight: bold;"'
}
i === 0 ?
column += `<td ${styleTotal} ${colSpan} align="left">${content.content}</td>`
: column += `<td ${styleTotal}>${content}</td>`;
}
column += `</tr>`;
tbody += column;
}
var body = `
<table border=0 style="border:none">
<tr>
<td colspan="3"> ${company.toUpperCase()}</td>
</tr>
<tr>
<td> Unit Induk Distribusi/Wilayah </td>
<td>:</td>
<td> ${reportMeta.uid
? reportMeta.uid.name.toUpperCase()
: 'Semua Unit Induk Distribusi/Wilayah'.toUpperCase()}</td>
<tr>
<td> Unit Pelaksanaan Pelayanan Pelanggan</td>
<td>:</td>
<td> ${reportMeta.up3
? reportMeta.up3.name.toUpperCase()
: 'Semua Unit Pelaksanaan Pelayanan Pelanggan'.toUpperCase()}</td>
</tr>
<tr>
<td> Unit Layanan Pelanggan</td>
<td>:</td>
<td> ${reportMeta.ulp ? reportMeta.ulp.name.toUpperCase() : 'Semua Unit Layanan Pelanggan'.toUpperCase()}</td>
</tr>
</table>
<center><h6>${filename.toUpperCase()}</h6></center>
<table class="main">
<thead>
<tr>
<th rowspan="3">No</th>
<th rowspan="3">Nama Unit</th>
<th colspan="6">Lapor Ulang Gangguan</th>
</tr>
<tr>
<th colspan="3">MOM</th>
<th colspan="3">YOY</th>
</tr>
<tr>
<th>${getMonthName(reportMeta.lastMonth)} ${reportMeta.lastYearMoM}</th>
<th>${getMonthName(reportMeta.currentMonth)} ${reportMeta.currentYear}</th>
<th>%</th>
<th>s.d ${getMonthName(reportMeta.currentMonth)} ${reportMeta.lastYear}</th>
<th>s.d ${getMonthName(reportMeta.currentMonth)} ${reportMeta.currentYear}</th>
<th>%</th>
</tr>
</thead>
<tbody>
${tbody}
</tbody>
</table>
`
var postHtml = `<br>
<footer>
<p style="text-align: right; font-size: 10px;">${day}, ${date}-${month}-${year}</p>
<br>
<p style="text-align: right; font-size: 10px;">(.........................................)</p>
</footer></div></body></html>`;
var html = preHtml + body + postHtml;
var url =
"data:application/vnd.ms-word;charset=utf-8," + encodeURIComponent(html);
filename = filename ? filename + ".doc" : "document.doc";
var downloadLink = document.createElement("a");
document.body.appendChild(downloadLink);
downloadLink.href = url;
downloadLink.download = filename;
downloadLink.click();
document.body.removeChild(downloadLink);
}
const exportDetailToWord = (reportMeta: any, rawData: any, filename: any, periode: any) => {
var preHtml = `<html xmlns:o='urn:schemas-microsoft-com:office:office' xmlns:w='urn:schemas-microsoft-com:office:word' xmlns='http://www.w3.org/TR/REC-html40'><head><meta charset='utf-8'><title>${filename}</title>
<style type="text/css" media="print">
@page Section1 {
size:841.95pt 21.0cm;
mso-page-orientation:landscape;
margin:72.0pt 72.0pt 72.0pt 72.0pt;
mso-header-margin:35.4pt;
mso-footer-margin:35.4pt;
mso-paper-source:0;
}
@page{
size: landscape;
font-size: 5px;
}
div.Section1 {
page:Section1;
}
table.main {
border-collapse: collapse;
width: 100%;
text-transform: uppercase;
font-size: 8px;
}
table.main thead tr {
background-color: #c0c0c0;
}
</style>
</head><body>
<div class="Section1">
`;
var tbody = ``;
var cr = ``;
rawData.map((item: any, i: any) => {
cr += '<tr>';
cr += `<td>${i + 1}</td>`;
cr += `<td>${item.nama_ulp}</td>`;
cr += `<td>${item.no_laporan}</td>`;
cr += `<td>${item.waktu_lapor}</td>`;
cr += `<td>${item.waktu_response}</td>`;
cr += `<td>${item.waktu_recovery}</td>`;
cr += `<td>${item.durasi_response_time ? formatWaktu(item.durasi_response_time) : ''}</td>`;
cr += `<td>${item.durasi_recovery_time ? formatWaktu(item.durasi_recovery_time) : ''}</td>`;
cr += '<td></td>';
cr += '<td></td>';
cr += '<td></td>';
cr += `<td>${item.idpel_nometer}</td>`;
cr += `<td>${item.nama_pelapor}</td>`;
cr += `<td>${item.alamat_pelapor}</td>`;
cr += `<td>${item.no_telp_pelapor}</td>`;
cr += `<td>${item.keterangan_pelapor}</td>`;
cr += '<td></td>';
cr += '<td></td>';
cr += `<td>${item.status_akhir}</td>`;
cr += '<td></td>';
cr += '<td></td>';
cr += '<td></td>';
cr += '<td></td>';
cr += '</tr>';
});
tbody += cr;
var body = `
<table border=0 style="border:none">
<tr>
<td colspan="3"> ${company.toUpperCase()}</td>
</tr>
<tr>
<td> Unit Induk Distribusi/Wilayah </td>
<td>:</td>
<td> ${reportMeta.uid
? reportMeta.uid.name.toUpperCase()
: 'Semua Unit Induk Distribusi/Wilayah'.toUpperCase()}</td>
<tr>
<td> Unit Pelaksanaan Pelayanan Pelanggan</td>
<td>:</td>
<td> ${reportMeta.up3
? reportMeta.up3.name.toUpperCase()
: 'Semua Unit Pelaksanaan Pelayanan Pelanggan'.toUpperCase()}</td>
</tr>
<tr>
<td> Unit Layanan Pelanggan</td>
<td>:</td>
<td> ${reportMeta.posko ? reportMeta.ulp.name.toUpperCase() : 'Semua Unit Layanan Pelanggan'.toUpperCase()}</td>
</tr>
</table>
<center><h6>${filename.toUpperCase()}</h6></center>
<table class="main">
<thead>
<tr>
<th>No</th>
<th>ULP</th>
<th>No Laporan</th>
<th>Tgl/ Jam Lapor</th>
<th>Tgl/ Jam Datang</th>
<th>Tgl/ Jam Nyala</th>
<th>Durasi Response Time</th>
<th>Durasi Recovery Time</th>
<th>Durasi Penugasan Regu</th>
<th>Durasi Perjalanan Regu</th>
<th>Dispatch Oleh</th>
<th>IDPEL/NO METER</th>
<th>Nama Pelapor</th>
<th>Alamat Pelapor</th>
<th>No Telp Pelapor</th>
<th>Keterangan Pelapor</th>
<th>Sumber Lapor</th>
<th>Diselesaikan Oleh</th>
<th>Status</th>
<th>Referensi Marking</th>
<th>Kode Gangguan</th>
<th>Jenis Gangguan</th>
<th>Tindakan</th>
</tr>
</thead>
<tbody>
${tbody}
</tbody>
</table>
`
var postHtml = `<br>
<footer>
<p style="text-align: right; font-size: 10px;">${day}, ${date}-${month}-${year}</p>
<br>
<p style="text-align: right; font-size: 10px;">(.........................................)</p>
</footer></div></body></html>`;
var html = preHtml + body + postHtml;
var url =
"data:application/vnd.ms-word;charset=utf-8," + encodeURIComponent(html);
filename = filename ? filename + ".doc" : "document.doc";
var downloadLink = document.createElement("a");
document.body.appendChild(downloadLink);
downloadLink.href = url;
downloadLink.download = filename;
downloadLink.click();
document.body.removeChild(downloadLink);
}
export { exportToWord, exportDetailToWord }

288
src/report/Monalisa/Gangguan/Rekap/doc/MonalisaGR_RecoveryTimeGangguan_DOC.ts Normal file
View File

@ -0,0 +1,288 @@
import { formatWaktu } from "@/components/Form/FiltersType/reference";
import { getMonthName } from "@/utils/texts";
const day = new Date().toLocaleString('id-ID', { weekday: 'long' })
const date = new Date().getDate()
const month = new Date().toLocaleString('id-ID', { month: 'long' })
const year = new Date().getFullYear()
const company = "PT. PLN (Persero)";
const exportToWord = (reportMeta: any, rawData: any, filename: any, periode: any) => {
var preHtml = `<html xmlns:o='urn:schemas-microsoft-com:office:office' xmlns:w='urn:schemas-microsoft-com:office:word' xmlns='http://www.w3.org/TR/REC-html40'><head><meta charset='utf-8'><title>${filename}</title>
<style type="text/css" media="print">
@page Section1 {
size:841.95pt 21.0cm;
mso-page-orientation:landscape;
margin:72.0pt 72.0pt 72.0pt 72.0pt;
mso-header-margin:35.4pt;
mso-footer-margin:35.4pt;
mso-paper-source:0;
}
@page{
size: landscape;
font-size: 5px;
}
div.Section1 {
page:Section1;
}
table.main {
border-collapse: collapse;
width: 100%;
text-transform: uppercase;
font-size: 8px;
}
table.main thead tr {
background-color: #c0c0c0;
}
</style>
</head><body>
<div class="Section1">
`;
var tbody = ``;
for (let index = 0; index < rawData.length; index++) {
const element = rawData[index];
var column = `<tr>`;
let styleTotal = '';
for (let i = 0; i < element.length; i++) {
const content = element[i];
const colSpan = content?.colSpan !== undefined ? `colspan="${content.colSpan}"` : ''
if (content && (content.content === 'TOTAL' || content.content === 'GRAND TOTAL')) {
styleTotal = 'style="background-color: #c0c0c0; font-weight: bold;"'
}
i === 0 ?
column += `<td ${styleTotal} ${colSpan} align="left">${content.content}</td>`
: column += `<td ${styleTotal}>${content}</td>`;
}
column += `</tr>`;
tbody += column;
}
var body = `
<table border=0 style="border:none">
<tr>
<td colspan="3"> ${company.toUpperCase()}</td>
</tr>
<tr>
<td> Unit Induk Distribusi/Wilayah </td>
<td>:</td>
<td> ${reportMeta.uid
? reportMeta.uid.name.toUpperCase()
: 'Semua Unit Induk Distribusi/Wilayah'.toUpperCase()}</td>
<tr>
<td> Unit Pelaksanaan Pelayanan Pelanggan</td>
<td>:</td>
<td> ${reportMeta.up3
? reportMeta.up3.name.toUpperCase()
: 'Semua Unit Pelaksanaan Pelayanan Pelanggan'.toUpperCase()}</td>
</tr>
<tr>
<td> Unit Layanan Pelanggan</td>
<td>:</td>
<td> ${reportMeta.ulp ? reportMeta.ulp.name.toUpperCase() : 'Semua Unit Layanan Pelanggan'.toUpperCase()}</td>
</tr>
</table>
<center><h6>${filename.toUpperCase()}</h6></center>
<table class="main">
<thead>
<tr>
<th rowspan="3">No</th>
<th rowspan="3">Nama Unit</th>
<th colspan="6">Jumlah RCT Kali Gangguan</th>
</tr>
<tr>
<th colspan="3">MOM</th>
<th colspan="3">YOY</th>
</tr>
<tr>
<th>${getMonthName(reportMeta.lastMonth)} ${reportMeta.lastYearMoM}</th>
<th>${getMonthName(reportMeta.currentMonth)} ${reportMeta.currentYear}</th>
<th>%</th>
<th>s.d ${getMonthName(reportMeta.currentMonth)} ${reportMeta.lastYear}</th>
<th>s.d ${getMonthName(reportMeta.currentMonth)} ${reportMeta.currentYear}</th>
<th>%</th>
</tr>
</thead>
<tbody>
${tbody}
</tbody>
</table>
`
var postHtml = `<br>
<footer>
<p style="text-align: right; font-size: 10px;">${day}, ${date}-${month}-${year}</p>
<br>
<p style="text-align: right; font-size: 10px;">(.........................................)</p>
</footer></div></body></html>`;
var html = preHtml + body + postHtml;
var url =
"data:application/vnd.ms-word;charset=utf-8," + encodeURIComponent(html);
filename = filename ? filename + ".doc" : "document.doc";
var downloadLink = document.createElement("a");
document.body.appendChild(downloadLink);
downloadLink.href = url;
downloadLink.download = filename;
downloadLink.click();
document.body.removeChild(downloadLink);
}
const exportDetailToWord = (reportMeta: any, rawData: any, filename: any, periode: any) => {
var preHtml = `<html xmlns:o='urn:schemas-microsoft-com:office:office' xmlns:w='urn:schemas-microsoft-com:office:word' xmlns='http://www.w3.org/TR/REC-html40'><head><meta charset='utf-8'><title>${filename}</title>
<style type="text/css" media="print">
@page Section1 {
size:841.95pt 21.0cm;
mso-page-orientation:landscape;
margin:72.0pt 72.0pt 72.0pt 72.0pt;
mso-header-margin:35.4pt;
mso-footer-margin:35.4pt;
mso-paper-source:0;
}
@page{
size: landscape;
font-size: 5px;
}
div.Section1 {
page:Section1;
}
table.main {
border-collapse: collapse;
width: 100%;
text-transform: uppercase;
font-size: 8px;
}
table.main thead tr {
background-color: #c0c0c0;
}
</style>
</head><body>
<div class="Section1">
`;
var tbody = ``;
var cr = ``;
rawData.map((item: any, i: any) => {
cr += '<tr>';
cr += `<td>${i + 1}</td>`;
cr += `<td>${item.nama_ulp}</td>`;
cr += `<td>${item.no_laporan}</td>`;
cr += `<td>${item.waktu_lapor}</td>`;
cr += `<td>${item.waktu_response}</td>`;
cr += `<td>${item.waktu_recovery}</td>`;
cr += `<td>${item.durasi_response_time ? formatWaktu(item.durasi_response_time) : ''}</td>`;
cr += `<td>${item.durasi_recovery_time ? formatWaktu(item.durasi_recovery_time) : ''}</td>`;
cr += '<td></td>';
cr += '<td></td>';
cr += '<td></td>';
cr += `<td>${item.idpel_nometer}</td>`;
cr += `<td>${item.nama_pelapor}</td>`;
cr += `<td>${item.alamat_pelapor}</td>`;
cr += `<td>${item.no_telp_pelapor}</td>`;
cr += `<td>${item.keterangan_pelapor}</td>`;
cr += '<td></td>';
cr += '<td></td>';
cr += `<td>${item.status_akhir}</td>`;
cr += '<td></td>';
cr += '<td></td>';
cr += '<td></td>';
cr += '<td></td>';
cr += '</tr>';
});
tbody += cr;
var body = `
<table border=0 style="border:none">
<tr>
<td colspan="3"> ${company.toUpperCase()}</td>
</tr>
<tr>
<td> Unit Induk Distribusi/Wilayah </td>
<td>:</td>
<td> ${reportMeta.uid
? reportMeta.uid.name.toUpperCase()
: 'Semua Unit Induk Distribusi/Wilayah'.toUpperCase()}</td>
<tr>
<td> Unit Pelaksanaan Pelayanan Pelanggan</td>
<td>:</td>
<td> ${reportMeta.up3
? reportMeta.up3.name.toUpperCase()
: 'Semua Unit Pelaksanaan Pelayanan Pelanggan'.toUpperCase()}</td>
</tr>
<tr>
<td> Unit Layanan Pelanggan</td>
<td>:</td>
<td> ${reportMeta.posko ? reportMeta.ulp.name.toUpperCase() : 'Semua Unit Layanan Pelanggan'.toUpperCase()}</td>
</tr>
</table>
<center><h6>${filename.toUpperCase()}</h6></center>
<table class="main">
<thead>
<tr>
<th>No</th>
<th>ULP</th>
<th>No Laporan</th>
<th>Tgl/ Jam Lapor</th>
<th>Tgl/ Jam Datang</th>
<th>Tgl/ Jam Nyala</th>
<th>Durasi Response Time</th>
<th>Durasi Recovery Time</th>
<th>Durasi Penugasan Regu</th>
<th>Durasi Perjalanan Regu</th>
<th>Dispatch Oleh</th>
<th>IDPEL/NO METER</th>
<th>Nama Pelapor</th>
<th>Alamat Pelapor</th>
<th>No Telp Pelapor</th>
<th>Keterangan Pelapor</th>
<th>Sumber Lapor</th>
<th>Diselesaikan Oleh</th>
<th>Status</th>
<th>Referensi Marking</th>
<th>Kode Gangguan</th>
<th>Jenis Gangguan</th>
<th>Tindakan</th>
</tr>
</thead>
<tbody>
${tbody}
</tbody>
</table>
`
var postHtml = `<br>
<footer>
<p style="text-align: right; font-size: 10px;">${day}, ${date}-${month}-${year}</p>
<br>
<p style="text-align: right; font-size: 10px;">(.........................................)</p>
</footer></div></body></html>`;
var html = preHtml + body + postHtml;
var url =
"data:application/vnd.ms-word;charset=utf-8," + encodeURIComponent(html);
filename = filename ? filename + ".doc" : "document.doc";
var downloadLink = document.createElement("a");
document.body.appendChild(downloadLink);
downloadLink.href = url;
downloadLink.download = filename;
downloadLink.click();
document.body.removeChild(downloadLink);
}
export { exportToWord, exportDetailToWord }

288
src/report/Monalisa/Gangguan/Rekap/doc/MonalisaGR_ResponseTimeGangguan_DOC.ts Normal file
View File

@ -0,0 +1,288 @@
import { formatWaktu } from "@/components/Form/FiltersType/reference";
import { getMonthName } from "@/utils/texts";
const day = new Date().toLocaleString('id-ID', { weekday: 'long' })
const date = new Date().getDate()
const month = new Date().toLocaleString('id-ID', { month: 'long' })
const year = new Date().getFullYear()
const company = "PT. PLN (Persero)";
const exportToWord = (reportMeta: any, rawData: any, filename: any, periode: any) => {
var preHtml = `<html xmlns:o='urn:schemas-microsoft-com:office:office' xmlns:w='urn:schemas-microsoft-com:office:word' xmlns='http://www.w3.org/TR/REC-html40'><head><meta charset='utf-8'><title>${filename}</title>
<style type="text/css" media="print">
@page Section1 {
size:841.95pt 21.0cm;
mso-page-orientation:landscape;
margin:72.0pt 72.0pt 72.0pt 72.0pt;
mso-header-margin:35.4pt;
mso-footer-margin:35.4pt;
mso-paper-source:0;
}
@page{
size: landscape;
font-size: 5px;
}
div.Section1 {
page:Section1;
}
table.main {
border-collapse: collapse;
width: 100%;
text-transform: uppercase;
font-size: 8px;
}
table.main thead tr {
background-color: #c0c0c0;
}
</style>
</head><body>
<div class="Section1">
`;
var tbody = ``;
for (let index = 0; index < rawData.length; index++) {
const element = rawData[index];
var column = `<tr>`;
let styleTotal = '';
for (let i = 0; i < element.length; i++) {
const content = element[i];
const colSpan = content?.colSpan !== undefined ? `colspan="${content.colSpan}"` : ''
if (content && (content.content === 'TOTAL' || content.content === 'GRAND TOTAL')) {
styleTotal = 'style="background-color: #c0c0c0; font-weight: bold;"'
}
i === 0 ?
column += `<td ${styleTotal} ${colSpan} align="left">${content.content}</td>`
: column += `<td ${styleTotal}>${content}</td>`;
}
column += `</tr>`;
tbody += column;
}
var body = `
<table border=0 style="border:none">
<tr>
<td colspan="3"> ${company.toUpperCase()}</td>
</tr>
<tr>
<td> Unit Induk Distribusi/Wilayah </td>
<td>:</td>
<td> ${reportMeta.uid
? reportMeta.uid.name.toUpperCase()
: 'Semua Unit Induk Distribusi/Wilayah'.toUpperCase()}</td>
<tr>
<td> Unit Pelaksanaan Pelayanan Pelanggan</td>
<td>:</td>
<td> ${reportMeta.up3
? reportMeta.up3.name.toUpperCase()
: 'Semua Unit Pelaksanaan Pelayanan Pelanggan'.toUpperCase()}</td>
</tr>
<tr>
<td> Unit Layanan Pelanggan</td>
<td>:</td>
<td> ${reportMeta.ulp ? reportMeta.ulp.name.toUpperCase() : 'Semua Unit Layanan Pelanggan'.toUpperCase()}</td>
</tr>
</table>
<center><h6>${filename.toUpperCase()}</h6></center>
<table class="main">
<thead>
<tr>
<th rowspan="3">No</th>
<th rowspan="3">Nama Unit</th>
<th colspan="6">Jumlah RCT Kali Gangguan</th>
</tr>
<tr>
<th colspan="3">MOM</th>
<th colspan="3">YOY</th>
</tr>
<tr>
<th>${getMonthName(reportMeta.lastMonth)} ${reportMeta.lastYearMoM}</th>
<th>${getMonthName(reportMeta.currentMonth)} ${reportMeta.currentYear}</th>
<th>%</th>
<th>s.d ${getMonthName(reportMeta.currentMonth)} ${reportMeta.lastYear}</th>
<th>s.d ${getMonthName(reportMeta.currentMonth)} ${reportMeta.currentYear}</th>
<th>%</th>
</tr>
</thead>
<tbody>
${tbody}
</tbody>
</table>
`
var postHtml = `<br>
<footer>
<p style="text-align: right; font-size: 10px;">${day}, ${date}-${month}-${year}</p>
<br>
<p style="text-align: right; font-size: 10px;">(.........................................)</p>
</footer></div></body></html>`;
var html = preHtml + body + postHtml;
var url =
"data:application/vnd.ms-word;charset=utf-8," + encodeURIComponent(html);
filename = filename ? filename + ".doc" : "document.doc";
var downloadLink = document.createElement("a");
document.body.appendChild(downloadLink);
downloadLink.href = url;
downloadLink.download = filename;
downloadLink.click();
document.body.removeChild(downloadLink);
}
const exportDetailToWord = (reportMeta: any, rawData: any, filename: any, periode: any) => {
var preHtml = `<html xmlns:o='urn:schemas-microsoft-com:office:office' xmlns:w='urn:schemas-microsoft-com:office:word' xmlns='http://www.w3.org/TR/REC-html40'><head><meta charset='utf-8'><title>${filename}</title>
<style type="text/css" media="print">
@page Section1 {
size:841.95pt 21.0cm;
mso-page-orientation:landscape;
margin:72.0pt 72.0pt 72.0pt 72.0pt;
mso-header-margin:35.4pt;
mso-footer-margin:35.4pt;
mso-paper-source:0;
}
@page{
size: landscape;
font-size: 5px;
}
div.Section1 {
page:Section1;
}
table.main {
border-collapse: collapse;
width: 100%;
text-transform: uppercase;
font-size: 8px;
}
table.main thead tr {
background-color: #c0c0c0;
}
</style>
</head><body>
<div class="Section1">
`;
var tbody = ``;
var cr = ``;
rawData.map((item: any, i: any) => {
cr += '<tr>';
cr += `<td>${i + 1}</td>`;
cr += `<td>${item.nama_ulp}</td>`;
cr += `<td>${item.no_laporan}</td>`;
cr += `<td>${item.waktu_lapor}</td>`;
cr += `<td>${item.waktu_response}</td>`;
cr += `<td>${item.waktu_recovery}</td>`;
cr += `<td>${item.durasi_response_time ? formatWaktu(item.durasi_response_time) : ''}</td>`;
cr += `<td>${item.durasi_recovery_time ? formatWaktu(item.durasi_recovery_time) : ''}</td>`;
cr += '<td></td>';
cr += '<td></td>';
cr += '<td></td>';
cr += `<td>${item.idpel_nometer}</td>`;
cr += `<td>${item.nama_pelapor}</td>`;
cr += `<td>${item.alamat_pelapor}</td>`;
cr += `<td>${item.no_telp_pelapor}</td>`;
cr += `<td>${item.keterangan_pelapor}</td>`;
cr += '<td></td>';
cr += '<td></td>';
cr += `<td>${item.status_akhir}</td>`;
cr += '<td></td>';
cr += '<td></td>';
cr += '<td></td>';
cr += '<td></td>';
cr += '</tr>';
});
tbody += cr;
var body = `
<table border=0 style="border:none">
<tr>
<td colspan="3"> ${company.toUpperCase()}</td>
</tr>
<tr>
<td> Unit Induk Distribusi/Wilayah </td>
<td>:</td>
<td> ${reportMeta.uid
? reportMeta.uid.name.toUpperCase()
: 'Semua Unit Induk Distribusi/Wilayah'.toUpperCase()}</td>
<tr>
<td> Unit Pelaksanaan Pelayanan Pelanggan</td>
<td>:</td>
<td> ${reportMeta.up3
? reportMeta.up3.name.toUpperCase()
: 'Semua Unit Pelaksanaan Pelayanan Pelanggan'.toUpperCase()}</td>
</tr>
<tr>
<td> Unit Layanan Pelanggan</td>
<td>:</td>
<td> ${reportMeta.posko ? reportMeta.ulp.name.toUpperCase() : 'Semua Unit Layanan Pelanggan'.toUpperCase()}</td>
</tr>
</table>
<center><h6>${filename.toUpperCase()}</h6></center>
<table class="main">
<thead>
<tr>
<th>No</th>
<th>ULP</th>
<th>No Laporan</th>
<th>Tgl/ Jam Lapor</th>
<th>Tgl/ Jam Datang</th>
<th>Tgl/ Jam Nyala</th>
<th>Durasi Response Time</th>
<th>Durasi Recovery Time</th>
<th>Durasi Penugasan Regu</th>
<th>Durasi Perjalanan Regu</th>
<th>Dispatch Oleh</th>
<th>IDPEL/NO METER</th>
<th>Nama Pelapor</th>
<th>Alamat Pelapor</th>
<th>No Telp Pelapor</th>
<th>Keterangan Pelapor</th>
<th>Sumber Lapor</th>
<th>Diselesaikan Oleh</th>
<th>Status</th>
<th>Referensi Marking</th>
<th>Kode Gangguan</th>
<th>Jenis Gangguan</th>
<th>Tindakan</th>
</tr>
</thead>
<tbody>
${tbody}
</tbody>
</table>
`
var postHtml = `<br>
<footer>
<p style="text-align: right; font-size: 10px;">${day}, ${date}-${month}-${year}</p>
<br>
<p style="text-align: right; font-size: 10px;">(.........................................)</p>
</footer></div></body></html>`;
var html = preHtml + body + postHtml;
var url =
"data:application/vnd.ms-word;charset=utf-8," + encodeURIComponent(html);
filename = filename ? filename + ".doc" : "document.doc";
var downloadLink = document.createElement("a");
document.body.appendChild(downloadLink);
downloadLink.href = url;
downloadLink.download = filename;
downloadLink.click();
document.body.removeChild(downloadLink);
}
export { exportToWord, exportDetailToWord }

10
src/report/Monalisa/Laporan/Bulanan/MonalisaLB_AgingComplaint.ts
View File

@ -20,6 +20,7 @@ import { setHeaderStyle } from '@/report/utils/xlsx'
import { formatNumber, formatPercentage } from '@/utils/numbers' import { formatNumber, formatPercentage } from '@/utils/numbers'
import { formatWaktu } from '@/components/Form/FiltersType/reference' import { formatWaktu } from '@/components/Form/FiltersType/reference'
import { getMonthNameShort } from '@/utils/texts' import { getMonthNameShort } from '@/utils/texts'
import { exportDetailToWord, exportToWord } from './doc/MonalisaLB_AgingComplaint_DOC'
const reportName = '(Monalisa) Aging Complaint' const reportName = '(Monalisa) Aging Complaint'
const fontSize = 5 const fontSize = 5
@ -581,5 +582,10 @@ const exportDetailToXLSX = (reportMeta: any, e: any) => {
e.cancel = true e.cancel = true
} }
const exportToDOCX = (reportMeta: any, rawData: any) => {
export { exportToPDF, exportToXLSX, exportDetailToPDF, exportDetailToXLSX } exportToWord(reportMeta, formatData(rawData), `Laporan ${reportName}`, null)
}
const exportDetailToDOCX = (reportMeta: any, rawData: any) => {
exportDetailToWord(reportMeta, rawData, `Laporan Detail ${reportName}`, null)
}
export { exportToPDF, exportToXLSX, exportDetailToPDF, exportDetailToXLSX ,exportToDOCX,exportDetailToDOCX}

6
src/report/Monalisa/Laporan/Bulanan/MonalisaLB_EnergyNotSales.ts
View File

@ -18,6 +18,7 @@ import autoTable from 'jspdf-autotable'
import { Workbook } from 'exceljs' import { Workbook } from 'exceljs'
import { setHeaderStyle } from '@/report/utils/xlsx' import { setHeaderStyle } from '@/report/utils/xlsx'
import { formatNumber } from '@/utils/numbers' import { formatNumber } from '@/utils/numbers'
import { exportToWord } from './doc/MonalisaLB_EnergyNotSales_DOC'
const reportName = '(Monalisa) Energy Not Sales (ENS)' const reportName = '(Monalisa) Energy Not Sales (ENS)'
const fontSize = 5 const fontSize = 5
@ -327,5 +328,8 @@ const exportToXLSX = (reportMeta: any, e: any) => {
e.cancel = true e.cancel = true
} }
const exportToDOCX = (reportMeta: any, rawData: any) => {
exportToWord(reportMeta, formatData(rawData), `Laporan ${reportName}`, null)
}
export { exportToPDF, exportToXLSX } export { exportToPDF, exportToXLSX, exportToDOCX}

6
src/report/Monalisa/Laporan/Bulanan/MonalisaLB_KADDalamPelaporan.ts
View File

@ -19,6 +19,7 @@ import { Workbook } from 'exceljs'
import { setHeaderStyle } from '@/report/utils/xlsx' import { setHeaderStyle } from '@/report/utils/xlsx'
import { formatNumber, formatPercentage } from '@/utils/numbers' import { formatNumber, formatPercentage } from '@/utils/numbers'
import { getMonthNameShort } from '@/utils/texts' import { getMonthNameShort } from '@/utils/texts'
import { exportToWord } from './doc/MonalisaLB_KADDalamPelaporan_DOC'
const reportName = '(Monalisa) Kepatuhan dan Akurasi Dalam Pelaporan' const reportName = '(Monalisa) Kepatuhan dan Akurasi Dalam Pelaporan'
const fontSize = 5 const fontSize = 5
@ -361,5 +362,8 @@ const exportToXLSX = (reportMeta: any, e: any) => {
e.cancel = true e.cancel = true
} }
const exportToDOCX = (reportMeta: any, rawData: any) => {
exportToWord(reportMeta, formatData(rawData), `Laporan ${reportName}`, null)
}
export { exportToPDF, exportToXLSX } export { exportToPDF, exportToXLSX, exportToDOCX}

10
src/report/Monalisa/Laporan/Bulanan/MonalisaLB_PenurunanJumlahKomplain.ts
View File

@ -20,6 +20,7 @@ import { setHeaderStyle } from '@/report/utils/xlsx'
import { formatNumber, formatPercentage } from '@/utils/numbers' import { formatNumber, formatPercentage } from '@/utils/numbers'
import { formatWaktu } from '@/components/Form/FiltersType/reference' import { formatWaktu } from '@/components/Form/FiltersType/reference'
import { getMonthNameShort } from '@/utils/texts' import { getMonthNameShort } from '@/utils/texts'
import { exportDetailToWord, exportToWord } from './doc/MonalisaLB_PenurunanJumlahKomplain_DOC'
const reportName = '(Monalisa) Penurunan Jumlah Komplain' const reportName = '(Monalisa) Penurunan Jumlah Komplain'
const fontSize = 5 const fontSize = 5
@ -713,5 +714,10 @@ const exportDetailToXLSX = (reportMeta: any, e: any) => {
e.cancel = true e.cancel = true
} }
const exportToDOCX = (reportMeta: any, rawData: any) => {
export { exportToPDF, exportToXLSX, exportDetailToPDF, exportDetailToXLSX } exportToWord(reportMeta, formatData(rawData), `Laporan ${reportName}`, null)
}
const exportDetailToDOCX = (reportMeta: any, rawData: any) => {
exportDetailToWord(reportMeta, rawData, `Laporan Detail ${reportName}`, null)
}
export { exportToPDF, exportToXLSX, exportDetailToPDF, exportDetailToXLSX, exportToDOCX, exportDetailToDOCX }

288
src/report/Monalisa/Laporan/Bulanan/doc/MonalisaLB_AgingComplaint_DOC.ts Normal file
View File

@ -0,0 +1,288 @@
import { formatWaktu } from "@/components/Form/FiltersType/reference";
import { getMonthName, getMonthNameShort } from "@/utils/texts";
const day = new Date().toLocaleString('id-ID', { weekday: 'long' })
const date = new Date().getDate()
const month = new Date().toLocaleString('id-ID', { month: 'long' })
const year = new Date().getFullYear()
const company = "PT. PLN (Persero)";
const exportToWord = (reportMeta: any, rawData: any, filename: any, periode: any) => {
var preHtml = `<html xmlns:o='urn:schemas-microsoft-com:office:office' xmlns:w='urn:schemas-microsoft-com:office:word' xmlns='http://www.w3.org/TR/REC-html40'><head><meta charset='utf-8'><title>${filename}</title>
<style type="text/css" media="print">
@page Section1 {
size:841.95pt 21.0cm;
mso-page-orientation:landscape;
margin:72.0pt 72.0pt 72.0pt 72.0pt;
mso-header-margin:35.4pt;
mso-footer-margin:35.4pt;
mso-paper-source:0;
}
@page{
size: landscape;
font-size: 5px;
}
div.Section1 {
page:Section1;
}
table.main {
border-collapse: collapse;
width: 100%;
text-transform: uppercase;
font-size: 8px;
}
table.main thead tr {
background-color: #c0c0c0;
}
</style>
</head><body>
<div class="Section1">
`;
var tbody = ``;
for (let index = 0; index < 5; index++) {
const element = rawData[index];
var column = `<tr>`;
let styleTotal = '';
for (let i = 0; i < element.length; i++) {
const content = element[i];
const colSpan = content?.colSpan !== undefined ? `colspan="${content.colSpan}"` : ''
if (content && (content.content === 'TOTAL' || content.content === 'GRAND TOTAL')) {
styleTotal = 'style="background-color: #c0c0c0; font-weight: bold;"'
}
i === 0 ?
column += `<td ${styleTotal} ${colSpan} align="left">${content.content}</td>`
: column += `<td ${styleTotal}>${content}</td>`;
}
column += `</tr>`;
tbody += column;
}
var body = `
<table border=0 style="border:none">
<tr>
<td colspan="3"> ${company.toUpperCase()}</td>
</tr>
<tr>
<td> Unit Induk Distribusi/Wilayah </td>
<td>:</td>
<td> ${reportMeta.uid
? reportMeta.uid.name.toUpperCase()
: 'Semua Unit Induk Distribusi/Wilayah'.toUpperCase()}</td>
<tr>
<td> Unit Pelaksanaan Pelayanan Pelanggan</td>
<td>:</td>
<td> ${reportMeta.up3
? reportMeta.up3.name.toUpperCase()
: 'Semua Unit Pelaksanaan Pelayanan Pelanggan'.toUpperCase()}</td>
</tr>
<tr>
<td> Unit Layanan Pelanggan</td>
<td>:</td>
<td> ${reportMeta.ulp ? reportMeta.ulp.name.toUpperCase() : 'Semua Unit Layanan Pelanggan'.toUpperCase()}</td>
</tr>
</table>
<center><h6>${filename.toUpperCase()}</h6></center>
<table class="main">
<thead>
<table>
<tr>
<th rowspan="3">Nama Unit</th>
<th colspan="4">Aging Complains</th>
<th colspan="2">% Aging Complains</th>
<th rowspan="3">% Rata2 Aging Complains</th>
</tr>
<tr>
<th colspan="2">Rata2 RCT Gangguan</th>
<th colspan="2">Rata2 RCT Keluhan</th>
<th rowspan="2">G</th>
<th rowspan="2">K</th>
</tr>
<tr>
<th>${getMonthNameShort(reportMeta.currentMonth)} ${reportMeta.currentYear} SLA (Menit)</th>
<th>${getMonthNameShort(reportMeta.currentMonth)} ${reportMeta.currentYear} SLA (Jam)</th>
<th>${getMonthNameShort(reportMeta.currentMonth)} ${reportMeta.currentYear} SLA (Menit)</th>
<th>${getMonthNameShort(reportMeta.currentMonth)} ${reportMeta.currentYear} SLA (Jam)</th>
</tr>
<tr>
<td>1</td>
<td>2</td>
<td>3</td>
<td>4</td>
<td>5</td>
<td>6 = 1-((2-3)/3))*100)</td>
<td>7 = 1-((4-5)/5))*100)</td>
<td>8 = (6+7)/2</td>
</tr>
</table>
</thead>
<tbody>
${tbody}
</tbody>
</table>
`
var postHtml = `<br>
<footer>
<p style="text-align: right; font-size: 10px;">${day}, ${date}-${month}-${year}</p>
<br>
<p style="text-align: right; font-size: 10px;">(.........................................)</p>
</footer></div></body></html>`;
var html = preHtml + body + postHtml;
var url =
"data:application/vnd.ms-word;charset=utf-8," + encodeURIComponent(html);
filename = filename ? filename + ".doc" : "document.doc";
var downloadLink = document.createElement("a");
document.body.appendChild(downloadLink);
downloadLink.href = url;
downloadLink.download = filename;
downloadLink.click();
document.body.removeChild(downloadLink);
}
const exportDetailToWord = (reportMeta: any, rawData: any, filename: any, periode: any) => {
var preHtml = `<html xmlns:o='urn:schemas-microsoft-com:office:office' xmlns:w='urn:schemas-microsoft-com:office:word' xmlns='http://www.w3.org/TR/REC-html40'><head><meta charset='utf-8'><title>${filename}</title>
<style type="text/css" media="print">
@page Section1 {
size:841.95pt 21.0cm;
mso-page-orientation:landscape;
margin:72.0pt 72.0pt 72.0pt 72.0pt;
mso-header-margin:35.4pt;
mso-footer-margin:35.4pt;
mso-paper-source:0;
}
@page{
size: landscape;
font-size: 5px;
}
div.Section1 {
page:Section1;
}
table.main {
border-collapse: collapse;
width: 100%;
text-transform: uppercase;
font-size: 8px;
}
table.main thead tr {
background-color: #c0c0c0;
}
</style>
</head><body>
<div class="Section1">
`;
var tbody = ``;
var cr = ``;
rawData.map((item: any, i: any) => {
cr += '<tr>';
cr += `<td>${i + 1}</td>`;
cr += `<td>${item.no_laporan}</td>`;
cr += `<td>${item.nama_uid}</td>`;
cr += `<td>${item.nama_ulp}</td>`;
cr += `<td>${item.id_pelanggan}</td>`;
cr += `<td>${item.nama_pelanggan}</td>`;
cr += `<td>${item.nama_pelapor}</td>`;
cr += `<td>${item.alamat_pelapor}</td>`;
cr += `<td>${item.no_telp_pelapor}</td>`;
cr += `<td>${item.keterangan_pelapor}</td>`;
cr += `<td>${item.penyebab}</td>`;
cr += `<td>${item.kode_gangguan}</td>`;
cr += `<td>${item.jenis_gangguan}</td>`;
cr += `<td>${item.durasi_response_time ? formatWaktu(item.durasi_response_time) : '-'}</td>`;
cr += `<td>${item.durasi_recovery_time ? formatWaktu(item.durasi_recovery_time) : '-'}</td>`;
cr += `<td>${item.waktu_lapor}</td>`;
cr += '</tr>';
});
tbody += cr;
var body = `
<table border=0 style="border:none">
<tr>
<td colspan="3"> ${company.toUpperCase()}</td>
</tr>
<tr>
<td> Unit Induk Distribusi/Wilayah </td>
<td>:</td>
<td> ${reportMeta.uid
? reportMeta.uid.name.toUpperCase()
: 'Semua Unit Induk Distribusi/Wilayah'.toUpperCase()}</td>
<tr>
<td> Unit Pelaksanaan Pelayanan Pelanggan</td>
<td>:</td>
<td> ${reportMeta.up3
? reportMeta.up3.name.toUpperCase()
: 'Semua Unit Pelaksanaan Pelayanan Pelanggan'.toUpperCase()}</td>
</tr>
<tr>
<td> Unit Layanan Pelanggan</td>
<td>:</td>
<td> ${reportMeta.posko ? reportMeta.ulp.name.toUpperCase() : 'Semua Unit Layanan Pelanggan'.toUpperCase()}</td>
</tr>
</table>
<center><h6>${filename.toUpperCase()}</h6></center>
<table class="main">
<thead>
<tr>
<th>No</th>
<th>No Laporan</th>
<th>UID/UIW</th>
<th>UP3</th>
<th>ULP</th>
<th>ID Pelanggan</th>
<th>Nama Pelanggan</th>
<th>Nama Pelapor</th>
<th>Alamat Pelapor</th>
<th>No Telp Pelapor</th>
<th>Keterangan Pelapor</th>
<th>Penyebab</th>
<th>Kode Gangguan</th>
<th>Jenis Gangguan</th>
<th>Durasi Response Time</th>
<th>Durasi Recovery Time</th>
<th>Tgl Lapor</th>
</tr>
</thead>
<tbody>
${tbody}
</tbody>
</table>
`
var postHtml = `<br>
<footer>
<p style="text-align: right; font-size: 10px;">${day}, ${date}-${month}-${year}</p>
<br>
<p style="text-align: right; font-size: 10px;">(.........................................)</p>
</footer></div></body></html>`;
var html = preHtml + body + postHtml;
var url =
"data:application/vnd.ms-word;charset=utf-8," + encodeURIComponent(html);
filename = filename ? filename + ".doc" : "document.doc";
var downloadLink = document.createElement("a");
document.body.appendChild(downloadLink);
downloadLink.href = url;
downloadLink.download = filename;
downloadLink.click();
document.body.removeChild(downloadLink);
}
export { exportToWord, exportDetailToWord }

289
src/report/Monalisa/Laporan/Bulanan/doc/MonalisaLB_EnergyNotSales_DOC.ts Normal file
View File

@ -0,0 +1,289 @@
import { formatWaktu } from "@/components/Form/FiltersType/reference";
import { getMonthName } from "@/utils/texts";
const day = new Date().toLocaleString('id-ID', { weekday: 'long' })
const date = new Date().getDate()
const month = new Date().toLocaleString('id-ID', { month: 'long' })
const year = new Date().getFullYear()
const company = "PT. PLN (Persero)";
const exportToWord = (reportMeta: any, rawData: any, filename: any, periode: any) => {
var preHtml = `<html xmlns:o='urn:schemas-microsoft-com:office:office' xmlns:w='urn:schemas-microsoft-com:office:word' xmlns='http://www.w3.org/TR/REC-html40'><head><meta charset='utf-8'><title>${filename}</title>
<style type="text/css" media="print">
@page Section1 {
size:841.95pt 21.0cm;
mso-page-orientation:landscape;
margin:72.0pt 72.0pt 72.0pt 72.0pt;
mso-header-margin:35.4pt;
mso-footer-margin:35.4pt;
mso-paper-source:0;
}
@page{
size: landscape;
font-size: 5px;
}
div.Section1 {
page:Section1;
}
table.main {
border-collapse: collapse;
width: 100%;
text-transform: uppercase;
font-size: 8px;
}
table.main thead tr {
background-color: #c0c0c0;
}
</style>
</head><body>
<div class="Section1">
`;
var tbody = ``;
for (let index = 0; index < 5; index++) {
const element = rawData[index];
var column = `<tr>`;
let styleTotal = '';
for (let i = 0; i < element.length; i++) {
const content = element[i];
const colSpan = content?.colSpan !== undefined ? `colspan="${content.colSpan}"` : ''
if (content && (content.content === 'TOTAL' || content.content === 'GRAND TOTAL')) {
styleTotal = 'style="background-color: #c0c0c0; font-weight: bold;"'
}
i === 0 ?
column += `<td ${styleTotal} ${colSpan} align="left">${content.content}</td>`
: column += `<td ${styleTotal}>${content}</td>`;
}
column += `</tr>`;
tbody += column;
}
var body = `
<table border=0 style="border:none">
<tr>
<td colspan="3"> ${company.toUpperCase()}</td>
</tr>
<tr>
<td> Unit Induk Distribusi/Wilayah </td>
<td>:</td>
<td> ${reportMeta.uid
? reportMeta.uid.name.toUpperCase()
: 'Semua Unit Induk Distribusi/Wilayah'.toUpperCase()}</td>
<tr>
<td> Unit Pelaksanaan Pelayanan Pelanggan</td>
<td>:</td>
<td> ${reportMeta.up3
? reportMeta.up3.name.toUpperCase()
: 'Semua Unit Pelaksanaan Pelayanan Pelanggan'.toUpperCase()}</td>
</tr>
<tr>
<td> Unit Layanan Pelanggan</td>
<td>:</td>
<td> ${reportMeta.ulp ? reportMeta.ulp.name.toUpperCase() : 'Semua Unit Layanan Pelanggan'.toUpperCase()}</td>
</tr>
</table>
<center><h6>${filename.toUpperCase()}</h6></center>
<table class="main">
<thead>
<tr>
<th rowspan="2">Nama Unit</th>
<th colspan="3">ENS (Distribusi)</th>
<th rowspan="2">Total</th>
<th rowspan="2">KPI ENS</th>
</tr>
<tr>
<th>Terencana</th>
<th>Tidak Terencana</th>
<th>Bencana Alam</th>
</tr>
<tr>
<td>1</td>
<td>2</td>
<td>3</td>
<td>4</td>
<td>5 = 2+3+4</td>
<td>6 = 2+3</td>
</tr>
</thead>
<tbody>
${tbody}
</tbody>
</table>
`
var postHtml = `<br>
<footer>
<p style="text-align: right; font-size: 10px;">${day}, ${date}-${month}-${year}</p>
<br>
<p style="text-align: right; font-size: 10px;">(.........................................)</p>
</footer></div></body></html>`;
var html = preHtml + body + postHtml;
var url =
"data:application/vnd.ms-word;charset=utf-8," + encodeURIComponent(html);
filename = filename ? filename + ".doc" : "document.doc";
var downloadLink = document.createElement("a");
document.body.appendChild(downloadLink);
downloadLink.href = url;
downloadLink.download = filename;
downloadLink.click();
document.body.removeChild(downloadLink);
}
const exportDetailToWord = (reportMeta: any, rawData: any, filename: any, periode: any) => {
var preHtml = `<html xmlns:o='urn:schemas-microsoft-com:office:office' xmlns:w='urn:schemas-microsoft-com:office:word' xmlns='http://www.w3.org/TR/REC-html40'><head><meta charset='utf-8'><title>${filename}</title>
<style type="text/css" media="print">
@page Section1 {
size:841.95pt 21.0cm;
mso-page-orientation:landscape;
margin:72.0pt 72.0pt 72.0pt 72.0pt;
mso-header-margin:35.4pt;
mso-footer-margin:35.4pt;
mso-paper-source:0;
}
@page{
size: landscape;
font-size: 5px;
}
div.Section1 {
page:Section1;
}
table.main {
border-collapse: collapse;
width: 100%;
text-transform: uppercase;
font-size: 8px;
}
table.main thead tr {
background-color: #c0c0c0;
}
</style>
</head><body>
<div class="Section1">
`;
var tbody = ``;
var cr = ``;
rawData.map((item: any, i: any) => {
cr += '<tr>';
cr += `<td>${i + 1}</td>`;
cr += `<td>${item.nama_ulp}</td>`;
cr += `<td>${item.no_laporan}</td>`;
cr += `<td>${item.waktu_lapor}</td>`;
cr += `<td>${item.waktu_response}</td>`;
cr += `<td>${item.waktu_recovery}</td>`;
cr += `<td>${item.durasi_response_time ? formatWaktu(item.durasi_response_time) : ''}</td>`;
cr += `<td>${item.durasi_recovery_time ? formatWaktu(item.durasi_recovery_time) : ''}</td>`;
cr += '<td></td>';
cr += '<td></td>';
cr += '<td></td>';
cr += `<td>${item.idpel_nometer}</td>`;
cr += `<td>${item.nama_pelapor}</td>`;
cr += `<td>${item.alamat_pelapor}</td>`;
cr += `<td>${item.no_telp_pelapor}</td>`;
cr += `<td>${item.keterangan_pelapor}</td>`;
cr += '<td></td>';
cr += '<td></td>';
cr += `<td>${item.status_akhir}</td>`;
cr += '<td></td>';
cr += '<td></td>';
cr += '<td></td>';
cr += '<td></td>';
cr += '</tr>';
});
tbody += cr;
var body = `
<table border=0 style="border:none">
<tr>
<td colspan="3"> ${company.toUpperCase()}</td>
</tr>
<tr>
<td> Unit Induk Distribusi/Wilayah </td>
<td>:</td>
<td> ${reportMeta.uid
? reportMeta.uid.name.toUpperCase()
: 'Semua Unit Induk Distribusi/Wilayah'.toUpperCase()}</td>
<tr>
<td> Unit Pelaksanaan Pelayanan Pelanggan</td>
<td>:</td>
<td> ${reportMeta.up3
? reportMeta.up3.name.toUpperCase()
: 'Semua Unit Pelaksanaan Pelayanan Pelanggan'.toUpperCase()}</td>
</tr>
<tr>
<td> Unit Layanan Pelanggan</td>
<td>:</td>
<td> ${reportMeta.posko ? reportMeta.ulp.name.toUpperCase() : 'Semua Unit Layanan Pelanggan'.toUpperCase()}</td>
</tr>
</table>
<center><h6>${filename.toUpperCase()}</h6></center>
<table class="main">
<thead>
<tr>
<th>No</th>
<th>ULP</th>
<th>No Laporan</th>
<th>Tgl/ Jam Lapor</th>
<th>Tgl/ Jam Datang</th>
<th>Tgl/ Jam Nyala</th>
<th>Durasi Response Time</th>
<th>Durasi Recovery Time</th>
<th>Durasi Penugasan Regu</th>
<th>Durasi Perjalanan Regu</th>
<th>Dispatch Oleh</th>
<th>IDPEL/NO METER</th>
<th>Nama Pelapor</th>
<th>Alamat Pelapor</th>
<th>No Telp Pelapor</th>
<th>Keterangan Pelapor</th>
<th>Sumber Lapor</th>
<th>Diselesaikan Oleh</th>
<th>Status</th>
<th>Referensi Marking</th>
<th>Kode Gangguan</th>
<th>Jenis Gangguan</th>
<th>Tindakan</th>
</tr>
</thead>
<tbody>
${tbody}
</tbody>
</table>
`
var postHtml = `<br>
<footer>
<p style="text-align: right; font-size: 10px;">${day}, ${date}-${month}-${year}</p>
<br>
<p style="text-align: right; font-size: 10px;">(.........................................)</p>
</footer></div></body></html>`;
var html = preHtml + body + postHtml;
var url =
"data:application/vnd.ms-word;charset=utf-8," + encodeURIComponent(html);
filename = filename ? filename + ".doc" : "document.doc";
var downloadLink = document.createElement("a");
document.body.appendChild(downloadLink);
downloadLink.href = url;
downloadLink.download = filename;
downloadLink.click();
document.body.removeChild(downloadLink);
}
export { exportToWord, exportDetailToWord }

284
src/report/Monalisa/Laporan/Bulanan/doc/MonalisaLB_KADDalamPelaporan_DOC.ts Normal file
View File

@ -0,0 +1,284 @@
import { formatWaktu } from "@/components/Form/FiltersType/reference";
import { getMonthName, getMonthNameShort } from "@/utils/texts";
const day = new Date().toLocaleString('id-ID', { weekday: 'long' })
const date = new Date().getDate()
const month = new Date().toLocaleString('id-ID', { month: 'long' })
const year = new Date().getFullYear()
const company = "PT. PLN (Persero)";
const exportToWord = (reportMeta: any, rawData: any, filename: any, periode: any) => {
var preHtml = `<html xmlns:o='urn:schemas-microsoft-com:office:office' xmlns:w='urn:schemas-microsoft-com:office:word' xmlns='http://www.w3.org/TR/REC-html40'><head><meta charset='utf-8'><title>${filename}</title>
<style type="text/css" media="print">
@page Section1 {
size:841.95pt 21.0cm;
mso-page-orientation:landscape;
margin:72.0pt 72.0pt 72.0pt 72.0pt;
mso-header-margin:35.4pt;
mso-footer-margin:35.4pt;
mso-paper-source:0;
}
@page{
size: landscape;
font-size: 5px;
}
div.Section1 {
page:Section1;
}
table.main {
border-collapse: collapse;
width: 100%;
text-transform: uppercase;
font-size: 8px;
}
table.main thead tr {
background-color: #c0c0c0;
}
</style>
</head><body>
<div class="Section1">
`;
var tbody = ``;
for (let index = 0; index < 5; index++) {
const element = rawData[index];
var column = `<tr>`;
let styleTotal = '';
for (let i = 0; i < element.length; i++) {
const content = element[i];
const colSpan = content?.colSpan !== undefined ? `colspan="${content.colSpan}"` : ''
if (content && (content.content === 'TOTAL' || content.content === 'GRAND TOTAL')) {
styleTotal = 'style="background-color: #c0c0c0; font-weight: bold;"'
}
i === 0 ?
column += `<td ${styleTotal} ${colSpan} align="left">${content.content}</td>`
: column += `<td ${styleTotal}>${content}</td>`;
}
column += `</tr>`;
tbody += column;
}
var body = `
<table border=0 style="border:none">
<tr>
<td colspan="3"> ${company.toUpperCase()}</td>
</tr>
<tr>
<td> Unit Induk Distribusi/Wilayah </td>
<td>:</td>
<td> ${reportMeta.uid
? reportMeta.uid.name.toUpperCase()
: 'Semua Unit Induk Distribusi/Wilayah'.toUpperCase()}</td>
<tr>
<td> Unit Pelaksanaan Pelayanan Pelanggan</td>
<td>:</td>
<td> ${reportMeta.up3
? reportMeta.up3.name.toUpperCase()
: 'Semua Unit Pelaksanaan Pelayanan Pelanggan'.toUpperCase()}</td>
</tr>
<tr>
<td> Unit Layanan Pelanggan</td>
<td>:</td>
<td> ${reportMeta.ulp ? reportMeta.ulp.name.toUpperCase() : 'Semua Unit Layanan Pelanggan'.toUpperCase()}</td>
</tr>
</table>
<center><h6>${filename.toUpperCase()}</h6></center>
<table class="main">
<thead>
<th colspan="2">Keluhan Berulang</th>
</tr>
<tr>
<th>${getMonthNameShort(reportMeta.currentMonth)} ${reportMeta.currentYear} Total Gangguan</th>
<th>${getMonthNameShort(reportMeta.currentMonth)} ${reportMeta.currentYear} Total Keluhan</th>
</tr>
<tr>
<td>1</td>
<td>2</td>
<td>3</td>
<td>4</td>
<td>5</td>
<td>6 = ((2/3)+(4/5))/2)*100</td>
</tr>
</thead>
<tbody>
${tbody}
</tbody>
</table>
`
var postHtml = `<br>
<footer>
<p style="text-align: right; font-size: 10px;">${day}, ${date}-${month}-${year}</p>
<br>
<p style="text-align: right; font-size: 10px;">(.........................................)</p>
</footer></div></body></html>`;
var html = preHtml + body + postHtml;
var url =
"data:application/vnd.ms-word;charset=utf-8," + encodeURIComponent(html);
filename = filename ? filename + ".doc" : "document.doc";
var downloadLink = document.createElement("a");
document.body.appendChild(downloadLink);
downloadLink.href = url;
downloadLink.download = filename;
downloadLink.click();
document.body.removeChild(downloadLink);
}
const exportDetailToWord = (reportMeta: any, rawData: any, filename: any, periode: any) => {
var preHtml = `<html xmlns:o='urn:schemas-microsoft-com:office:office' xmlns:w='urn:schemas-microsoft-com:office:word' xmlns='http://www.w3.org/TR/REC-html40'><head><meta charset='utf-8'><title>${filename}</title>
<style type="text/css" media="print">
@page Section1 {
size:841.95pt 21.0cm;
mso-page-orientation:landscape;
margin:72.0pt 72.0pt 72.0pt 72.0pt;
mso-header-margin:35.4pt;
mso-footer-margin:35.4pt;
mso-paper-source:0;
}
@page{
size: landscape;
font-size: 5px;
}
div.Section1 {
page:Section1;
}
table.main {
border-collapse: collapse;
width: 100%;
text-transform: uppercase;
font-size: 8px;
}
table.main thead tr {
background-color: #c0c0c0;
}
</style>
</head><body>
<div class="Section1">
`;
var tbody = ``;
var cr = ``;
rawData.map((item: any, i: any) => {
cr += '<tr>';
cr += `<td>${i + 1}</td>`;
cr += `<td>${item.nama_ulp}</td>`;
cr += `<td>${item.no_laporan}</td>`;
cr += `<td>${item.waktu_lapor}</td>`;
cr += `<td>${item.waktu_response}</td>`;
cr += `<td>${item.waktu_recovery}</td>`;
cr += `<td>${item.durasi_response_time ? formatWaktu(item.durasi_response_time) : ''}</td>`;
cr += `<td>${item.durasi_recovery_time ? formatWaktu(item.durasi_recovery_time) : ''}</td>`;
cr += '<td></td>';
cr += '<td></td>';
cr += '<td></td>';
cr += `<td>${item.idpel_nometer}</td>`;
cr += `<td>${item.nama_pelapor}</td>`;
cr += `<td>${item.alamat_pelapor}</td>`;
cr += `<td>${item.no_telp_pelapor}</td>`;
cr += `<td>${item.keterangan_pelapor}</td>`;
cr += '<td></td>';
cr += '<td></td>';
cr += `<td>${item.status_akhir}</td>`;
cr += '<td></td>';
cr += '<td></td>';
cr += '<td></td>';
cr += '<td></td>';
cr += '</tr>';
});
tbody += cr;
var body = `
<table border=0 style="border:none">
<tr>
<td colspan="3"> ${company.toUpperCase()}</td>
</tr>
<tr>
<td> Unit Induk Distribusi/Wilayah </td>
<td>:</td>
<td> ${reportMeta.uid
? reportMeta.uid.name.toUpperCase()
: 'Semua Unit Induk Distribusi/Wilayah'.toUpperCase()}</td>
<tr>
<td> Unit Pelaksanaan Pelayanan Pelanggan</td>
<td>:</td>
<td> ${reportMeta.up3
? reportMeta.up3.name.toUpperCase()
: 'Semua Unit Pelaksanaan Pelayanan Pelanggan'.toUpperCase()}</td>
</tr>
<tr>
<td> Unit Layanan Pelanggan</td>
<td>:</td>
<td> ${reportMeta.posko ? reportMeta.ulp.name.toUpperCase() : 'Semua Unit Layanan Pelanggan'.toUpperCase()}</td>
</tr>
</table>
<center><h6>${filename.toUpperCase()}</h6></center>
<table class="main">
<thead>
<tr>
<th>No</th>
<th>ULP</th>
<th>No Laporan</th>
<th>Tgl/ Jam Lapor</th>
<th>Tgl/ Jam Datang</th>
<th>Tgl/ Jam Nyala</th>
<th>Durasi Response Time</th>
<th>Durasi Recovery Time</th>
<th>Durasi Penugasan Regu</th>
<th>Durasi Perjalanan Regu</th>
<th>Dispatch Oleh</th>
<th>IDPEL/NO METER</th>
<th>Nama Pelapor</th>
<th>Alamat Pelapor</th>
<th>No Telp Pelapor</th>
<th>Keterangan Pelapor</th>
<th>Sumber Lapor</th>
<th>Diselesaikan Oleh</th>
<th>Status</th>
<th>Referensi Marking</th>
<th>Kode Gangguan</th>
<th>Jenis Gangguan</th>
<th>Tindakan</th>
</tr>
</thead>
<tbody>
${tbody}
</tbody>
</table>
`
var postHtml = `<br>
<footer>
<p style="text-align: right; font-size: 10px;">${day}, ${date}-${month}-${year}</p>
<br>
<p style="text-align: right; font-size: 10px;">(.........................................)</p>
</footer></div></body></html>`;
var html = preHtml + body + postHtml;
var url =
"data:application/vnd.ms-word;charset=utf-8," + encodeURIComponent(html);
filename = filename ? filename + ".doc" : "document.doc";
var downloadLink = document.createElement("a");
document.body.appendChild(downloadLink);
downloadLink.href = url;
downloadLink.download = filename;
downloadLink.click();
document.body.removeChild(downloadLink);
}
export { exportToWord, exportDetailToWord }

320
src/report/Monalisa/Laporan/Bulanan/doc/MonalisaLB_PenurunanJumlahKomplain_DOC.ts Normal file
View File

@ -0,0 +1,320 @@
import { formatWaktu } from "@/components/Form/FiltersType/reference";
import { getMonthName, getMonthNameShort } from "@/utils/texts";
const day = new Date().toLocaleString('id-ID', { weekday: 'long' })
const date = new Date().getDate()
const month = new Date().toLocaleString('id-ID', { month: 'long' })
const year = new Date().getFullYear()
const company = "PT. PLN (Persero)";
const exportToWord = (reportMeta: any, rawData: any, filename: any, periode: any) => {
var preHtml = `<html xmlns:o='urn:schemas-microsoft-com:office:office' xmlns:w='urn:schemas-microsoft-com:office:word' xmlns='http://www.w3.org/TR/REC-html40'><head><meta charset='utf-8'><title>${filename}</title>
<style type="text/css" media="print">
@page Section1 {
size:841.95pt 21.0cm;
mso-page-orientation:landscape;
margin:72.0pt 72.0pt 72.0pt 72.0pt;
mso-header-margin:35.4pt;
mso-footer-margin:35.4pt;
mso-paper-source:0;
}
@page{
size: landscape;
font-size: 5px;
}
div.Section1 {
page:Section1;
}
table.main {
border-collapse: collapse;
width: 100%;
text-transform: uppercase;
font-size: 8px;
}
table.main thead tr {
background-color: #c0c0c0;
}
</style>
</head><body>
<div class="Section1">
`;
var tbody = ``;
for (let index = 0; index < 5; index++) {
const element = rawData[index];
var column = `<tr>`;
let styleTotal = '';
for (let i = 0; i < element.length; i++) {
const content = element[i];
const colSpan = content?.colSpan !== undefined ? `colspan="${content.colSpan}"` : ''
if (content && (content.content === 'TOTAL' || content.content === 'GRAND TOTAL')) {
styleTotal = 'style="background-color: #c0c0c0; font-weight: bold;"'
}
i === 0 ?
column += `<td ${styleTotal} ${colSpan} align="left">${content.content}</td>`
: column += `<td ${styleTotal}>${content}</td>`;
}
column += `</tr>`;
tbody += column;
}
var body = `
<table border=0 style="border:none">
<tr>
<td colspan="3"> ${company.toUpperCase()}</td>
</tr>
<tr>
<td> Unit Induk Distribusi/Wilayah </td>
<td>:</td>
<td> ${reportMeta.uid
? reportMeta.uid.name.toUpperCase()
: 'Semua Unit Induk Distribusi/Wilayah'.toUpperCase()}</td>
<tr>
<td> Unit Pelaksanaan Pelayanan Pelanggan</td>
<td>:</td>
<td> ${reportMeta.up3
? reportMeta.up3.name.toUpperCase()
: 'Semua Unit Pelaksanaan Pelayanan Pelanggan'.toUpperCase()}</td>
</tr>
<tr>
<td> Unit Layanan Pelanggan</td>
<td>:</td>
<td> ${reportMeta.ulp ? reportMeta.ulp.name.toUpperCase() : 'Semua Unit Layanan Pelanggan'.toUpperCase()}</td>
</tr>
</table>
<center><h6>${filename.toUpperCase()}</h6></center>
<table class="main">
<thead>
<tr>
<th rowspan="3">Nama Unit</th>
<th colspan="6">${getMonthNameShort(reportMeta.currentMonth)} ${reportMeta.lastYear}</th>
<th colspan="6">${getMonthNameShort(reportMeta.currentMonth)} ${reportMeta.currentYear}</th>
<th colspan="3">Delta Penurunan</th>
<th colspan="4">% Penurunan YoY</th>
</tr>
<tr>
<th colspan="2">Keluhan</th>
<th colspan="2">Gangguan</th>
<th>Total</th>
<th>Keluhan</th>
<th colspan="2">Gangguan</th>
<th>Total</th>
<th>Keluhan</th>
<th colspan="2">Gangguan</th>
<th>Total</th>
<th>Keluhan</th>
<th colspan="2">Gangguan</th>
<th>Total</th>
<th>% Total</th>
</tr>
<tr>
<th>Keluhan</th>
<th>Gangguan</th>
<th>Total</th>
<th>Keluhan</th>
<th>Gangguan</th>
<th>Total</th>
<th>Keluhan</th>
<th>Gangguan</th>
<th>Total</th>
<th>Keluhan</th>
<th>Gangguan</th>
<th>Total</th>
<th>Keluhan</th>
<th>Gangguan</th>
<th>Total</th>
<th>Keluhan</th>
<th>Gangguan</th>
<th>Total</th>
</tr>
<tr>
<td>1</td>
<td>2</td>
<td>3</td>
<td>4</td>
<td>5</td>
<td>6=4+5</td>
<td>7=2+3+6</td>
<td>8</td>
<td>9</td>
<td>10</td>
<td>11</td>
<td>12=10+11</td>
<td>13=8+9+12</td>
<td>14=2-8</td>
<td>15=3-9</td>
<td>16=6-12</td>
<td>17=40%*(14/2)</td>
<td>18=40%*(15/3)</td>
<td>19=20%*(16/6)</td>
<td>20=17+18+19</td>
</tr>
</thead>
<tbody>
${tbody}
</tbody>
</table>
`
var postHtml = `<br>
<footer>
<p style="text-align: right; font-size: 10px;">${day}, ${date}-${month}-${year}</p>
<br>
<p style="text-align: right; font-size: 10px;">(.........................................)</p>
</footer></div></body></html>`;
var html = preHtml + body + postHtml;
var url =
"data:application/vnd.ms-word;charset=utf-8," + encodeURIComponent(html);
filename = filename ? filename + ".doc" : "document.doc";
var downloadLink = document.createElement("a");
document.body.appendChild(downloadLink);
downloadLink.href = url;
downloadLink.download = filename;
downloadLink.click();
document.body.removeChild(downloadLink);
}
const exportDetailToWord = (reportMeta: any, rawData: any, filename: any, periode: any) => {
var preHtml = `<html xmlns:o='urn:schemas-microsoft-com:office:office' xmlns:w='urn:schemas-microsoft-com:office:word' xmlns='http://www.w3.org/TR/REC-html40'><head><meta charset='utf-8'><title>${filename}</title>
<style type="text/css" media="print">
@page Section1 {
size:841.95pt 21.0cm;
mso-page-orientation:landscape;
margin:72.0pt 72.0pt 72.0pt 72.0pt;
mso-header-margin:35.4pt;
mso-footer-margin:35.4pt;
mso-paper-source:0;
}
@page{
size: landscape;
font-size: 5px;
}
div.Section1 {
page:Section1;
}
table.main {
border-collapse: collapse;
width: 100%;
text-transform: uppercase;
font-size: 8px;
}
table.main thead tr {
background-color: #c0c0c0;
}
</style>
</head><body>
<div class="Section1">
`;
var tbody = ``;
var cr = ``;
rawData.map((item: any, i: any) => {
cr += '<tr>';
cr += `<td>${i + 1}</td>`;
cr += `<td>${item.no_laporan}</td>`;
cr += `<td>${item.nama_uid}</td>`;
cr += `<td>${item.nama_ulp}</td>`;
cr += `<td>${item.id_pelanggan}</td>`;
cr += `<td>${item.nama_pelanggan}</td>`;
cr += `<td>${item.nama_pelapor}</td>`;
cr += `<td>${item.alamat_pelapor}</td>`;
cr += `<td>${item.no_telp_pelapor}</td>`;
cr += `<td>${item.keterangan_pelapor}</td>`;
cr += `<td>${item.penyebab}</td>`;
cr += `<td>${item.kode_gangguan}</td>`;
cr += `<td>${item.jenis_gangguan}</td>`;
cr += `<td>${item.durasi_response_time ? formatWaktu(item.durasi_response_time) : ''}</td>`;
cr += `<td>${item.durasi_recovery_time ? formatWaktu(item.durasi_recovery_time) : ''}</td>`;
cr += `<td>${item.waktu_lapor}</td>`;
cr += '</tr>';
});
tbody += cr;
var body = `
<table border=0 style="border:none">
<tr>
<td colspan="3"> ${company.toUpperCase()}</td>
</tr>
<tr>
<td> Unit Induk Distribusi/Wilayah </td>
<td>:</td>
<td> ${reportMeta.uid
? reportMeta.uid.name.toUpperCase()
: 'Semua Unit Induk Distribusi/Wilayah'.toUpperCase()}</td>
<tr>
<td> Unit Pelaksanaan Pelayanan Pelanggan</td>
<td>:</td>
<td> ${reportMeta.up3
? reportMeta.up3.name.toUpperCase()
: 'Semua Unit Pelaksanaan Pelayanan Pelanggan'.toUpperCase()}</td>
</tr>
<tr>
<td> Unit Layanan Pelanggan</td>
<td>:</td>
<td> ${reportMeta.posko ? reportMeta.ulp.name.toUpperCase() : 'Semua Unit Layanan Pelanggan'.toUpperCase()}</td>
</tr>
</table>
<center><h6>${filename.toUpperCase()}</h6></center>
<table class="main">
<thead>
<tr>
<th>No</th>
<th>No Laporan</th>
<th>UID/UIW</th>
<th>UP3</th>
<th>ULP</th>
<th>ID Pelanggan</th>
<th>Nama Pelanggan</th>
<th>Nama Pelapor</th>
<th>Alamat Pelapor</th>
<th>No Telp Pelapor</th>
<th>Keterangan Pelapor</th>
<th>Penyebab</th>
<th>Kode Gangguan</th>
<th>Jenis Gangguan</th>
<th>Durasi Response Time</th>
<th>Durasi Recovery Time</th>
<th>Tgl Lapor</th>
</tr>
</thead>
<tbody>
${tbody}
</tbody>
</table>
`
var postHtml = `<br>
<footer>
<p style="text-align: right; font-size: 10px;">${day}, ${date}-${month}-${year}</p>
<br>
<p style="text-align: right; font-size: 10px;">(.........................................)</p>
</footer></div></body></html>`;
var html = preHtml + body + postHtml;
var url =
"data:application/vnd.ms-word;charset=utf-8," + encodeURIComponent(html);
filename = filename ? filename + ".doc" : "document.doc";
var downloadLink = document.createElement("a");
document.body.appendChild(downloadLink);
downloadLink.href = url;
downloadLink.download = filename;
downloadLink.click();
document.body.removeChild(downloadLink);
}
export { exportToWord, exportDetailToWord }

6
src/report/Monalisa/Laporan/Kumulatif/MonalisaLK_AgingComplaint.ts
View File

@ -19,6 +19,7 @@ import { Workbook } from 'exceljs'
import { setHeaderStyle } from '@/report/utils/xlsx' import { setHeaderStyle } from '@/report/utils/xlsx'
import { formatNumber, formatPercentage } from '@/utils/numbers' import { formatNumber, formatPercentage } from '@/utils/numbers'
import { getMonthNameShort } from '@/utils/texts' import { getMonthNameShort } from '@/utils/texts'
import { exportToWord } from './doc/MonalisaLK_AgingComplaint_DOC'
const reportName = 'Aging Complaint' const reportName = 'Aging Complaint'
const fontSize = 5 const fontSize = 5
@ -414,5 +415,8 @@ const exportToXLSX = (reportMeta: any, e: any) => {
e.cancel = true e.cancel = true
} }
const exportToDOCX = (reportMeta: any, rawData: any) => {
exportToWord(reportMeta, formatData(rawData), `Laporan ${reportName}`, null)
}
export { exportToPDF, exportToXLSX } export { exportToPDF, exportToXLSX ,exportToDOCX}

6
src/report/Monalisa/Laporan/Kumulatif/MonalisaLK_EnergyNotSales.ts
View File

@ -18,6 +18,7 @@ import autoTable from 'jspdf-autotable'
import { Workbook } from 'exceljs' import { Workbook } from 'exceljs'
import { setHeaderStyle } from '@/report/utils/xlsx' import { setHeaderStyle } from '@/report/utils/xlsx'
import { formatNumber } from '@/utils/numbers' import { formatNumber } from '@/utils/numbers'
import { exportToWord } from './doc/MonalisaLK_EnergyNotSales_DOC'
const reportName = 'Energy Not Sales (ENS)' const reportName = 'Energy Not Sales (ENS)'
const fontSize = 5 const fontSize = 5
@ -327,5 +328,8 @@ const exportToXLSX = (reportMeta: any, e: any) => {
e.cancel = true e.cancel = true
} }
const exportToDOCX = (reportMeta: any, rawData: any) => {
exportToWord(reportMeta, formatData(rawData), `Laporan ${reportName}`, null)
}
export { exportToPDF, exportToXLSX } export { exportToPDF, exportToXLSX , exportToDOCX}

6
src/report/Monalisa/Laporan/Kumulatif/MonalisaLK_KDADPelaporan.ts
View File

@ -19,6 +19,7 @@ import { Workbook } from 'exceljs'
import { setHeaderStyle } from '@/report/utils/xlsx' import { setHeaderStyle } from '@/report/utils/xlsx'
import { formatNumber, formatPercentage } from '@/utils/numbers' import { formatNumber, formatPercentage } from '@/utils/numbers'
import { getMonthNameShort } from '@/utils/texts' import { getMonthNameShort } from '@/utils/texts'
import { exportToWord } from './doc/MonalisaLK_KDADPelaporan_DOC'
const reportName = 'Kepatuhan dan Akurasi Dalam Pelaporan' const reportName = 'Kepatuhan dan Akurasi Dalam Pelaporan'
const fontSize = 5 const fontSize = 5
@ -361,5 +362,8 @@ const exportToXLSX = (reportMeta: any, e: any) => {
e.cancel = true e.cancel = true
} }
const exportToDOCX = (reportMeta: any, rawData: any) => {
exportToWord(reportMeta, formatData(rawData), `Laporan ${reportName}`, null)
}
export { exportToPDF, exportToXLSX } export { exportToPDF, exportToXLSX,exportToDOCX }

6
src/report/Monalisa/Laporan/Kumulatif/MonalisaLK_PenurunanJumlahKomplain.ts
View File

@ -19,6 +19,7 @@ import { Workbook } from 'exceljs'
import { setHeaderStyle } from '@/report/utils/xlsx' import { setHeaderStyle } from '@/report/utils/xlsx'
import { formatNumber, formatPercentage } from '@/utils/numbers' import { formatNumber, formatPercentage } from '@/utils/numbers'
import { getMonthNameShort } from '@/utils/texts' import { getMonthNameShort } from '@/utils/texts'
import { exportToWord } from './doc/MonalisaLK_PenurunanJumlahKomplain_DOC'
const reportName = 'Penurunan Jumlah Komplain' const reportName = 'Penurunan Jumlah Komplain'
const fontSize = 5 const fontSize = 5
@ -547,5 +548,8 @@ const exportToXLSX = (reportMeta: any, e: any) => {
e.cancel = true e.cancel = true
} }
const exportToDOCX = (reportMeta: any, rawData: any) => {
exportToWord(reportMeta, formatData(rawData), `Laporan ${reportName}`, null)
}
export { exportToPDF, exportToXLSX } export { exportToPDF, exportToXLSX,exportToDOCX }

298
src/report/Monalisa/Laporan/Kumulatif/doc/MonalisaLK_AgingComplaint_DOC.ts Normal file
View File

@ -0,0 +1,298 @@
import { formatWaktu } from "@/components/Form/FiltersType/reference";
import { getMonthName, getMonthNameShort } from "@/utils/texts";
const day = new Date().toLocaleString('id-ID', { weekday: 'long' })
const date = new Date().getDate()
const month = new Date().toLocaleString('id-ID', { month: 'long' })
const year = new Date().getFullYear()
const company = "PT. PLN (Persero)";
const exportToWord = (reportMeta: any, rawData: any, filename: any, periode: any) => {
var preHtml = `<html xmlns:o='urn:schemas-microsoft-com:office:office' xmlns:w='urn:schemas-microsoft-com:office:word' xmlns='http://www.w3.org/TR/REC-html40'><head><meta charset='utf-8'><title>${filename}</title>
<style type="text/css" media="print">
@page Section1 {
size:841.95pt 21.0cm;
mso-page-orientation:landscape;
margin:72.0pt 72.0pt 72.0pt 72.0pt;
mso-header-margin:35.4pt;
mso-footer-margin:35.4pt;
mso-paper-source:0;
}
@page{
size: landscape;
font-size: 5px;
}
div.Section1 {
page:Section1;
}
table.main {
border-collapse: collapse;
width: 100%;
text-transform: uppercase;
font-size: 8px;
}
table.main thead tr {
background-color: #c0c0c0;
}
</style>
</head><body>
<div class="Section1">
`;
var tbody = ``;
for (let index = 0; index < 5; index++) {
const element = rawData[index];
var column = `<tr>`;
let styleTotal = '';
for (let i = 0; i < element.length; i++) {
const content = element[i];
const colSpan = content?.colSpan !== undefined ? `colspan="${content.colSpan}"` : ''
if (content && (content.content === 'TOTAL' || content.content === 'GRAND TOTAL')) {
styleTotal = 'style="background-color: #c0c0c0; font-weight: bold;"'
}
i === 0 ?
column += `<td ${styleTotal} ${colSpan} align="left">${content.content}</td>`
: column += `<td ${styleTotal}>${content}</td>`;
}
column += `</tr>`;
tbody += column;
}
var body = `
<table border=0 style="border:none">
<tr>
<td colspan="3"> ${company.toUpperCase()}</td>
</tr>
<tr>
<td> Unit Induk Distribusi/Wilayah </td>
<td>:</td>
<td> ${reportMeta.uid
? reportMeta.uid.name.toUpperCase()
: 'Semua Unit Induk Distribusi/Wilayah'.toUpperCase()}</td>
<tr>
<td> Unit Pelaksanaan Pelayanan Pelanggan</td>
<td>:</td>
<td> ${reportMeta.up3
? reportMeta.up3.name.toUpperCase()
: 'Semua Unit Pelaksanaan Pelayanan Pelanggan'.toUpperCase()}</td>
</tr>
<tr>
<td> Unit Layanan Pelanggan</td>
<td>:</td>
<td> ${reportMeta.ulp ? reportMeta.ulp.name.toUpperCase() : 'Semua Unit Layanan Pelanggan'.toUpperCase()}</td>
</tr>
</table>
<center><h6>${filename.toUpperCase()}</h6></center>
<table class="main">
<thead>
<tr>
<th rowspan="3">Nama Unit</th>
<th colspan="4">Aging Complains</th>
<th colspan="2">% Aging Complains</th>
<th rowspan="3">% Rata2 Aging Complains</th>
</tr>
<tr>
<th colspan="2">Rata2 RCT Gangguan</th>
<th colspan="2">Rata2 RCT Keluhan</th>
<th rowspan="2">G</th>
<th rowspan="2">K</th>
</tr>
<tr>
<th>s.d. ${getMonthNameShort(reportMeta.currentMonth)} ${reportMeta.currentYear} SLA (Menit)</th>
<th>s.d. ${getMonthNameShort(reportMeta.currentMonth)} ${reportMeta.currentYear} SLA (Jam)</th>
<th>s.d. ${getMonthNameShort(reportMeta.currentMonth)} ${reportMeta.currentYear} SLA (Menit)</th>
<th>s.d. ${getMonthNameShort(reportMeta.currentMonth)} ${reportMeta.currentYear} SLA (Jam)</th>
</tr>
<tr>
<td>1</td>
<td>2</td>
<td>3</td>
<td>4</td>
<td>5</td>
<td>6 = 1-((2-3)/3))*100)</td>
<td>7 = 1-((4-5)/5))*100)</td>
<td>8 = (6+7)/2</td>
</tr>
</thead>
<tbody>
${tbody}
</tbody>
</table>
`
var postHtml = `<br>
<footer>
<p style="text-align: right; font-size: 10px;">${day}, ${date}-${month}-${year}</p>
<br>
<p style="text-align: right; font-size: 10px;">(.........................................)</p>
</footer></div></body></html>`;
var html = preHtml + body + postHtml;
var url =
"data:application/vnd.ms-word;charset=utf-8," + encodeURIComponent(html);
filename = filename ? filename + ".doc" : "document.doc";
var downloadLink = document.createElement("a");
document.body.appendChild(downloadLink);
downloadLink.href = url;
downloadLink.download = filename;
downloadLink.click();
document.body.removeChild(downloadLink);
}
const exportDetailToWord = (reportMeta: any, rawData: any, filename: any, periode: any) => {
var preHtml = `<html xmlns:o='urn:schemas-microsoft-com:office:office' xmlns:w='urn:schemas-microsoft-com:office:word' xmlns='http://www.w3.org/TR/REC-html40'><head><meta charset='utf-8'><title>${filename}</title>
<style type="text/css" media="print">
@page Section1 {
size:841.95pt 21.0cm;
mso-page-orientation:landscape;
margin:72.0pt 72.0pt 72.0pt 72.0pt;
mso-header-margin:35.4pt;
mso-footer-margin:35.4pt;
mso-paper-source:0;
}
@page{
size: landscape;
font-size: 5px;
}
div.Section1 {
page:Section1;
}
table.main {
border-collapse: collapse;
width: 100%;
text-transform: uppercase;
font-size: 8px;
}
table.main thead tr {
background-color: #c0c0c0;
}
</style>
</head><body>
<div class="Section1">
`;
var tbody = ``;
var cr = ``;
rawData.map((item: any, i: any) => {
cr += '<tr>';
cr += `<td>${i + 1}</td>`;
cr += `<td>${item.nama_ulp}</td>`;
cr += `<td>${item.no_laporan}</td>`;
cr += `<td>${item.waktu_lapor}</td>`;
cr += `<td>${item.waktu_response}</td>`;
cr += `<td>${item.waktu_recovery}</td>`;
cr += `<td>${item.durasi_response_time ? formatWaktu(item.durasi_response_time) : ''}</td>`;
cr += `<td>${item.durasi_recovery_time ? formatWaktu(item.durasi_recovery_time) : ''}</td>`;
cr += '<td></td>';
cr += '<td></td>';
cr += '<td></td>';
cr += `<td>${item.idpel_nometer}</td>`;
cr += `<td>${item.nama_pelapor}</td>`;
cr += `<td>${item.alamat_pelapor}</td>`;
cr += `<td>${item.no_telp_pelapor}</td>`;
cr += `<td>${item.keterangan_pelapor}</td>`;
cr += '<td></td>';
cr += '<td></td>';
cr += `<td>${item.status_akhir}</td>`;
cr += '<td></td>';
cr += '<td></td>';
cr += '<td></td>';
cr += '<td></td>';
cr += '</tr>';
});
tbody += cr;
var body = `
<table border=0 style="border:none">
<tr>
<td colspan="3"> ${company.toUpperCase()}</td>
</tr>
<tr>
<td> Unit Induk Distribusi/Wilayah </td>
<td>:</td>
<td> ${reportMeta.uid
? reportMeta.uid.name.toUpperCase()
: 'Semua Unit Induk Distribusi/Wilayah'.toUpperCase()}</td>
<tr>
<td> Unit Pelaksanaan Pelayanan Pelanggan</td>
<td>:</td>
<td> ${reportMeta.up3
? reportMeta.up3.name.toUpperCase()
: 'Semua Unit Pelaksanaan Pelayanan Pelanggan'.toUpperCase()}</td>
</tr>
<tr>
<td> Unit Layanan Pelanggan</td>
<td>:</td>
<td> ${reportMeta.posko ? reportMeta.ulp.name.toUpperCase() : 'Semua Unit Layanan Pelanggan'.toUpperCase()}</td>
</tr>
</table>
<center><h6>${filename.toUpperCase()}</h6></center>
<table class="main">
<thead>
<tr>
<th>No</th>
<th>ULP</th>
<th>No Laporan</th>
<th>Tgl/ Jam Lapor</th>
<th>Tgl/ Jam Datang</th>
<th>Tgl/ Jam Nyala</th>
<th>Durasi Response Time</th>
<th>Durasi Recovery Time</th>
<th>Durasi Penugasan Regu</th>
<th>Durasi Perjalanan Regu</th>
<th>Dispatch Oleh</th>
<th>IDPEL/NO METER</th>
<th>Nama Pelapor</th>
<th>Alamat Pelapor</th>
<th>No Telp Pelapor</th>
<th>Keterangan Pelapor</th>
<th>Sumber Lapor</th>
<th>Diselesaikan Oleh</th>
<th>Status</th>
<th>Referensi Marking</th>
<th>Kode Gangguan</th>
<th>Jenis Gangguan</th>
<th>Tindakan</th>
</tr>
</thead>
<tbody>
${tbody}
</tbody>
</table>
`
var postHtml = `<br>
<footer>
<p style="text-align: right; font-size: 10px;">${day}, ${date}-${month}-${year}</p>
<br>
<p style="text-align: right; font-size: 10px;">(.........................................)</p>
</footer></div></body></html>`;
var html = preHtml + body + postHtml;
var url =
"data:application/vnd.ms-word;charset=utf-8," + encodeURIComponent(html);
filename = filename ? filename + ".doc" : "document.doc";
var downloadLink = document.createElement("a");
document.body.appendChild(downloadLink);
downloadLink.href = url;
downloadLink.download = filename;
downloadLink.click();
document.body.removeChild(downloadLink);
}
export { exportToWord, exportDetailToWord }

289
src/report/Monalisa/Laporan/Kumulatif/doc/MonalisaLK_EnergyNotSales_DOC.ts Normal file
View File

@ -0,0 +1,289 @@
import { formatWaktu } from "@/components/Form/FiltersType/reference";
import { getMonthName } from "@/utils/texts";
const day = new Date().toLocaleString('id-ID', { weekday: 'long' })
const date = new Date().getDate()
const month = new Date().toLocaleString('id-ID', { month: 'long' })
const year = new Date().getFullYear()
const company = "PT. PLN (Persero)";
const exportToWord = (reportMeta: any, rawData: any, filename: any, periode: any) => {
var preHtml = `<html xmlns:o='urn:schemas-microsoft-com:office:office' xmlns:w='urn:schemas-microsoft-com:office:word' xmlns='http://www.w3.org/TR/REC-html40'><head><meta charset='utf-8'><title>${filename}</title>
<style type="text/css" media="print">
@page Section1 {
size:841.95pt 21.0cm;
mso-page-orientation:landscape;
margin:72.0pt 72.0pt 72.0pt 72.0pt;
mso-header-margin:35.4pt;
mso-footer-margin:35.4pt;
mso-paper-source:0;
}
@page{
size: landscape;
font-size: 5px;
}
div.Section1 {
page:Section1;
}
table.main {
border-collapse: collapse;
width: 100%;
text-transform: uppercase;
font-size: 8px;
}
table.main thead tr {
background-color: #c0c0c0;
}
</style>
</head><body>
<div class="Section1">
`;
var tbody = ``;
for (let index = 0; index < 5; index++) {
const element = rawData[index];
var column = `<tr>`;
let styleTotal = '';
for (let i = 0; i < element.length; i++) {
const content = element[i];
const colSpan = content?.colSpan !== undefined ? `colspan="${content.colSpan}"` : ''
if (content && (content.content === 'TOTAL' || content.content === 'GRAND TOTAL')) {
styleTotal = 'style="background-color: #c0c0c0; font-weight: bold;"'
}
i === 0 ?
column += `<td ${styleTotal} ${colSpan} align="left">${content.content}</td>`
: column += `<td ${styleTotal}>${content}</td>`;
}
column += `</tr>`;
tbody += column;
}
var body = `
<table border=0 style="border:none">
<tr>
<td colspan="3"> ${company.toUpperCase()}</td>
</tr>
<tr>
<td> Unit Induk Distribusi/Wilayah </td>
<td>:</td>
<td> ${reportMeta.uid
? reportMeta.uid.name.toUpperCase()
: 'Semua Unit Induk Distribusi/Wilayah'.toUpperCase()}</td>
<tr>
<td> Unit Pelaksanaan Pelayanan Pelanggan</td>
<td>:</td>
<td> ${reportMeta.up3
? reportMeta.up3.name.toUpperCase()
: 'Semua Unit Pelaksanaan Pelayanan Pelanggan'.toUpperCase()}</td>
</tr>
<tr>
<td> Unit Layanan Pelanggan</td>
<td>:</td>
<td> ${reportMeta.ulp ? reportMeta.ulp.name.toUpperCase() : 'Semua Unit Layanan Pelanggan'.toUpperCase()}</td>
</tr>
</table>
<center><h6>${filename.toUpperCase()}</h6></center>
<table class="main">
<thead>
<tr>
<th rowspan="2">Nama Unit</th>
<th colspan="3">ENS (Distribusi)</th>
<th rowspan="2">Total</th>
<th rowspan="2">KPI ENS</th>
</tr>
<tr>
<th>Terencana</th>
<th>Tidak Terencana</th>
<th>Bencana Alam</th>
</tr>
<tr>
<td>1</td>
<td>2</td>
<td>3</td>
<td>4</td>
<td>5 = 2+3+4</td>
<td>6 = 2+3</td>
</tr>
</thead>
<tbody>
${tbody}
</tbody>
</table>
`
var postHtml = `<br>
<footer>
<p style="text-align: right; font-size: 10px;">${day}, ${date}-${month}-${year}</p>
<br>
<p style="text-align: right; font-size: 10px;">(.........................................)</p>
</footer></div></body></html>`;
var html = preHtml + body + postHtml;
var url =
"data:application/vnd.ms-word;charset=utf-8," + encodeURIComponent(html);
filename = filename ? filename + ".doc" : "document.doc";
var downloadLink = document.createElement("a");
document.body.appendChild(downloadLink);
downloadLink.href = url;
downloadLink.download = filename;
downloadLink.click();
document.body.removeChild(downloadLink);
}
const exportDetailToWord = (reportMeta: any, rawData: any, filename: any, periode: any) => {
var preHtml = `<html xmlns:o='urn:schemas-microsoft-com:office:office' xmlns:w='urn:schemas-microsoft-com:office:word' xmlns='http://www.w3.org/TR/REC-html40'><head><meta charset='utf-8'><title>${filename}</title>
<style type="text/css" media="print">
@page Section1 {
size:841.95pt 21.0cm;
mso-page-orientation:landscape;
margin:72.0pt 72.0pt 72.0pt 72.0pt;
mso-header-margin:35.4pt;
mso-footer-margin:35.4pt;
mso-paper-source:0;
}
@page{
size: landscape;
font-size: 5px;
}
div.Section1 {
page:Section1;
}
table.main {
border-collapse: collapse;
width: 100%;
text-transform: uppercase;
font-size: 8px;
}
table.main thead tr {
background-color: #c0c0c0;
}
</style>
</head><body>
<div class="Section1">
`;
var tbody = ``;
var cr = ``;
rawData.map((item: any, i: any) => {
cr += '<tr>';
cr += `<td>${i + 1}</td>`;
cr += `<td>${item.nama_ulp}</td>`;
cr += `<td>${item.no_laporan}</td>`;
cr += `<td>${item.waktu_lapor}</td>`;
cr += `<td>${item.waktu_response}</td>`;
cr += `<td>${item.waktu_recovery}</td>`;
cr += `<td>${item.durasi_response_time ? formatWaktu(item.durasi_response_time) : ''}</td>`;
cr += `<td>${item.durasi_recovery_time ? formatWaktu(item.durasi_recovery_time) : ''}</td>`;
cr += '<td></td>';
cr += '<td></td>';
cr += '<td></td>';
cr += `<td>${item.idpel_nometer}</td>`;
cr += `<td>${item.nama_pelapor}</td>`;
cr += `<td>${item.alamat_pelapor}</td>`;
cr += `<td>${item.no_telp_pelapor}</td>`;
cr += `<td>${item.keterangan_pelapor}</td>`;
cr += '<td></td>';
cr += '<td></td>';
cr += `<td>${item.status_akhir}</td>`;
cr += '<td></td>';
cr += '<td></td>';
cr += '<td></td>';
cr += '<td></td>';
cr += '</tr>';
});
tbody += cr;
var body = `
<table border=0 style="border:none">
<tr>
<td colspan="3"> ${company.toUpperCase()}</td>
</tr>
<tr>
<td> Unit Induk Distribusi/Wilayah </td>
<td>:</td>
<td> ${reportMeta.uid
? reportMeta.uid.name.toUpperCase()
: 'Semua Unit Induk Distribusi/Wilayah'.toUpperCase()}</td>
<tr>
<td> Unit Pelaksanaan Pelayanan Pelanggan</td>
<td>:</td>
<td> ${reportMeta.up3
? reportMeta.up3.name.toUpperCase()
: 'Semua Unit Pelaksanaan Pelayanan Pelanggan'.toUpperCase()}</td>
</tr>
<tr>
<td> Unit Layanan Pelanggan</td>
<td>:</td>
<td> ${reportMeta.posko ? reportMeta.ulp.name.toUpperCase() : 'Semua Unit Layanan Pelanggan'.toUpperCase()}</td>
</tr>
</table>
<center><h6>${filename.toUpperCase()}</h6></center>
<table class="main">
<thead>
<tr>
<th>No</th>
<th>ULP</th>
<th>No Laporan</th>
<th>Tgl/ Jam Lapor</th>
<th>Tgl/ Jam Datang</th>
<th>Tgl/ Jam Nyala</th>
<th>Durasi Response Time</th>
<th>Durasi Recovery Time</th>
<th>Durasi Penugasan Regu</th>
<th>Durasi Perjalanan Regu</th>
<th>Dispatch Oleh</th>
<th>IDPEL/NO METER</th>
<th>Nama Pelapor</th>
<th>Alamat Pelapor</th>
<th>No Telp Pelapor</th>
<th>Keterangan Pelapor</th>
<th>Sumber Lapor</th>
<th>Diselesaikan Oleh</th>
<th>Status</th>
<th>Referensi Marking</th>
<th>Kode Gangguan</th>
<th>Jenis Gangguan</th>
<th>Tindakan</th>
</tr>
</thead>
<tbody>
${tbody}
</tbody>
</table>
`
var postHtml = `<br>
<footer>
<p style="text-align: right; font-size: 10px;">${day}, ${date}-${month}-${year}</p>
<br>
<p style="text-align: right; font-size: 10px;">(.........................................)</p>
</footer></div></body></html>`;
var html = preHtml + body + postHtml;
var url =
"data:application/vnd.ms-word;charset=utf-8," + encodeURIComponent(html);
filename = filename ? filename + ".doc" : "document.doc";
var downloadLink = document.createElement("a");
document.body.appendChild(downloadLink);
downloadLink.href = url;
downloadLink.download = filename;
downloadLink.click();
document.body.removeChild(downloadLink);
}
export { exportToWord, exportDetailToWord }

291
src/report/Monalisa/Laporan/Kumulatif/doc/MonalisaLK_KDADPelaporan_DOC.ts Normal file
View File

@ -0,0 +1,291 @@
import { formatWaktu } from "@/components/Form/FiltersType/reference";
import { getMonthName, getMonthNameShort } from "@/utils/texts";
const day = new Date().toLocaleString('id-ID', { weekday: 'long' })
const date = new Date().getDate()
const month = new Date().toLocaleString('id-ID', { month: 'long' })
const year = new Date().getFullYear()
const company = "PT. PLN (Persero)";
const exportToWord = (reportMeta: any, rawData: any, filename: any, periode: any) => {
var preHtml = `<html xmlns:o='urn:schemas-microsoft-com:office:office' xmlns:w='urn:schemas-microsoft-com:office:word' xmlns='http://www.w3.org/TR/REC-html40'><head><meta charset='utf-8'><title>${filename}</title>
<style type="text/css" media="print">
@page Section1 {
size:841.95pt 21.0cm;
mso-page-orientation:landscape;
margin:72.0pt 72.0pt 72.0pt 72.0pt;
mso-header-margin:35.4pt;
mso-footer-margin:35.4pt;
mso-paper-source:0;
}
@page{
size: landscape;
font-size: 5px;
}
div.Section1 {
page:Section1;
}
table.main {
border-collapse: collapse;
width: 100%;
text-transform: uppercase;
font-size: 8px;
}
table.main thead tr {
background-color: #c0c0c0;
}
</style>
</head><body>
<div class="Section1">
`;
var tbody = ``;
for (let index = 0; index < 5; index++) {
const element = rawData[index];
var column = `<tr>`;
let styleTotal = '';
for (let i = 0; i < element.length; i++) {
const content = element[i];
const colSpan = content?.colSpan !== undefined ? `colspan="${content.colSpan}"` : ''
if (content && (content.content === 'TOTAL' || content.content === 'GRAND TOTAL')) {
styleTotal = 'style="background-color: #c0c0c0; font-weight: bold;"'
}
i === 0 ?
column += `<td ${styleTotal} ${colSpan} align="left">${content.content}</td>`
: column += `<td ${styleTotal}>${content}</td>`;
}
column += `</tr>`;
tbody += column;
}
var body = `
<table border=0 style="border:none">
<tr>
<td colspan="3"> ${company.toUpperCase()}</td>
</tr>
<tr>
<td> Unit Induk Distribusi/Wilayah </td>
<td>:</td>
<td> ${reportMeta.uid
? reportMeta.uid.name.toUpperCase()
: 'Semua Unit Induk Distribusi/Wilayah'.toUpperCase()}</td>
<tr>
<td> Unit Pelaksanaan Pelayanan Pelanggan</td>
<td>:</td>
<td> ${reportMeta.up3
? reportMeta.up3.name.toUpperCase()
: 'Semua Unit Pelaksanaan Pelayanan Pelanggan'.toUpperCase()}</td>
</tr>
<tr>
<td> Unit Layanan Pelanggan</td>
<td>:</td>
<td> ${reportMeta.ulp ? reportMeta.ulp.name.toUpperCase() : 'Semua Unit Layanan Pelanggan'.toUpperCase()}</td>
</tr>
</table>
<center><h6>${filename.toUpperCase()}</h6></center>
<table class="main">
<thead>
<tr>
<th rowspan="3">Nama Unit</th>
<th colspan="4">Kepatuhan dan Akurasi APKT</th>
<th rowspan="3">Komplain Pelanggan (%)</th>
</tr>
<tr>
<th colspan="2">Gangguan Berulang</th>
<th colspan="2">Keluhan Berulang</th>
</tr>
<tr>
<th>s.d. ${getMonthNameShort(reportMeta.currentMonth)} ${reportMeta.currentYear} Total Gangguan</th>
<th>s.d. ${getMonthNameShort(reportMeta.currentMonth)} ${reportMeta.currentYear} Total Keluhan</th>
</tr>
<tr>
<td>1</td>
<td>2</td>
<td>3</td>
<td>4</td>
<td>5</td>
<td>6 = ((2/3)+(4/5))/2)*100</td>
</tr>
</thead>
<tbody>
${tbody}
</tbody>
</table>
`
var postHtml = `<br>
<footer>
<p style="text-align: right; font-size: 10px;">${day}, ${date}-${month}-${year}</p>
<br>
<p style="text-align: right; font-size: 10px;">(.........................................)</p>
</footer></div></body></html>`;
var html = preHtml + body + postHtml;
var url =
"data:application/vnd.ms-word;charset=utf-8," + encodeURIComponent(html);
filename = filename ? filename + ".doc" : "document.doc";
var downloadLink = document.createElement("a");
document.body.appendChild(downloadLink);
downloadLink.href = url;
downloadLink.download = filename;
downloadLink.click();
document.body.removeChild(downloadLink);
}
const exportDetailToWord = (reportMeta: any, rawData: any, filename: any, periode: any) => {
var preHtml = `<html xmlns:o='urn:schemas-microsoft-com:office:office' xmlns:w='urn:schemas-microsoft-com:office:word' xmlns='http://www.w3.org/TR/REC-html40'><head><meta charset='utf-8'><title>${filename}</title>
<style type="text/css" media="print">
@page Section1 {
size:841.95pt 21.0cm;
mso-page-orientation:landscape;
margin:72.0pt 72.0pt 72.0pt 72.0pt;
mso-header-margin:35.4pt;
mso-footer-margin:35.4pt;
mso-paper-source:0;
}
@page{
size: landscape;
font-size: 5px;
}
div.Section1 {
page:Section1;
}
table.main {
border-collapse: collapse;
width: 100%;
text-transform: uppercase;
font-size: 8px;
}
table.main thead tr {
background-color: #c0c0c0;
}
</style>
</head><body>
<div class="Section1">
`;
var tbody = ``;
var cr = ``;
rawData.map((item: any, i: any) => {
cr += '<tr>';
cr += `<td>${i + 1}</td>`;
cr += `<td>${item.nama_ulp}</td>`;
cr += `<td>${item.no_laporan}</td>`;
cr += `<td>${item.waktu_lapor}</td>`;
cr += `<td>${item.waktu_response}</td>`;
cr += `<td>${item.waktu_recovery}</td>`;
cr += `<td>${item.durasi_response_time ? formatWaktu(item.durasi_response_time) : ''}</td>`;
cr += `<td>${item.durasi_recovery_time ? formatWaktu(item.durasi_recovery_time) : ''}</td>`;
cr += '<td></td>';
cr += '<td></td>';
cr += '<td></td>';
cr += `<td>${item.idpel_nometer}</td>`;
cr += `<td>${item.nama_pelapor}</td>`;
cr += `<td>${item.alamat_pelapor}</td>`;
cr += `<td>${item.no_telp_pelapor}</td>`;
cr += `<td>${item.keterangan_pelapor}</td>`;
cr += '<td></td>';
cr += '<td></td>';
cr += `<td>${item.status_akhir}</td>`;
cr += '<td></td>';
cr += '<td></td>';
cr += '<td></td>';
cr += '<td></td>';
cr += '</tr>';
});
tbody += cr;
var body = `
<table border=0 style="border:none">
<tr>
<td colspan="3"> ${company.toUpperCase()}</td>
</tr>
<tr>
<td> Unit Induk Distribusi/Wilayah </td>
<td>:</td>
<td> ${reportMeta.uid
? reportMeta.uid.name.toUpperCase()
: 'Semua Unit Induk Distribusi/Wilayah'.toUpperCase()}</td>
<tr>
<td> Unit Pelaksanaan Pelayanan Pelanggan</td>
<td>:</td>
<td> ${reportMeta.up3
? reportMeta.up3.name.toUpperCase()
: 'Semua Unit Pelaksanaan Pelayanan Pelanggan'.toUpperCase()}</td>
</tr>
<tr>
<td> Unit Layanan Pelanggan</td>
<td>:</td>
<td> ${reportMeta.posko ? reportMeta.ulp.name.toUpperCase() : 'Semua Unit Layanan Pelanggan'.toUpperCase()}</td>
</tr>
</table>
<center><h6>${filename.toUpperCase()}</h6></center>
<table class="main">
<thead>
<tr>
<th>No</th>
<th>ULP</th>
<th>No Laporan</th>
<th>Tgl/ Jam Lapor</th>
<th>Tgl/ Jam Datang</th>
<th>Tgl/ Jam Nyala</th>
<th>Durasi Response Time</th>
<th>Durasi Recovery Time</th>
<th>Durasi Penugasan Regu</th>
<th>Durasi Perjalanan Regu</th>
<th>Dispatch Oleh</th>
<th>IDPEL/NO METER</th>
<th>Nama Pelapor</th>
<th>Alamat Pelapor</th>
<th>No Telp Pelapor</th>
<th>Keterangan Pelapor</th>
<th>Sumber Lapor</th>
<th>Diselesaikan Oleh</th>
<th>Status</th>
<th>Referensi Marking</th>
<th>Kode Gangguan</th>
<th>Jenis Gangguan</th>
<th>Tindakan</th>
</tr>
</thead>
<tbody>
${tbody}
</tbody>
</table>
`
var postHtml = `<br>
<footer>
<p style="text-align: right; font-size: 10px;">${day}, ${date}-${month}-${year}</p>
<br>
<p style="text-align: right; font-size: 10px;">(.........................................)</p>
</footer></div></body></html>`;
var html = preHtml + body + postHtml;
var url =
"data:application/vnd.ms-word;charset=utf-8," + encodeURIComponent(html);
filename = filename ? filename + ".doc" : "document.doc";
var downloadLink = document.createElement("a");
document.body.appendChild(downloadLink);
downloadLink.href = url;
downloadLink.download = filename;
downloadLink.click();
document.body.removeChild(downloadLink);
}
export { exportToWord, exportDetailToWord }

321
src/report/Monalisa/Laporan/Kumulatif/doc/MonalisaLK_PenurunanJumlahKomplain_DOC.ts Normal file
View File

@ -0,0 +1,321 @@
import { formatWaktu } from "@/components/Form/FiltersType/reference";
import { getMonthName, getMonthNameShort } from "@/utils/texts";
const day = new Date().toLocaleString('id-ID', { weekday: 'long' })
const date = new Date().getDate()
const month = new Date().toLocaleString('id-ID', { month: 'long' })
const year = new Date().getFullYear()
const company = "PT. PLN (Persero)";
const exportToWord = (reportMeta: any, rawData: any, filename: any, periode: any) => {
var preHtml = `<html xmlns:o='urn:schemas-microsoft-com:office:office' xmlns:w='urn:schemas-microsoft-com:office:word' xmlns='http://www.w3.org/TR/REC-html40'><head><meta charset='utf-8'><title>${filename}</title>
<style type="text/css" media="print">
@page Section1 {
size:841.95pt 21.0cm;
mso-page-orientation:landscape;
margin:72.0pt 72.0pt 72.0pt 72.0pt;
mso-header-margin:35.4pt;
mso-footer-margin:35.4pt;
mso-paper-source:0;
}
@page{
size: landscape;
font-size: 5px;
}
div.Section1 {
page:Section1;
}
table.main {
border-collapse: collapse;
width: 100%;
text-transform: uppercase;
font-size: 8px;
}
table.main thead tr {
background-color: #c0c0c0;
}
</style>
</head><body>
<div class="Section1">
`;
var tbody = ``;
for (let index = 0; index < 5; index++) {
const element = rawData[index];
var column = `<tr>`;
let styleTotal = '';
for (let i = 0; i < element.length; i++) {
const content = element[i];
const colSpan = content?.colSpan !== undefined ? `colspan="${content.colSpan}"` : ''
if (content && (content.content === 'TOTAL' || content.content === 'GRAND TOTAL')) {
styleTotal = 'style="background-color: #c0c0c0; font-weight: bold;"'
}
i === 0 ?
column += `<td ${styleTotal} ${colSpan} align="left">${content.content}</td>`
: column += `<td ${styleTotal}>${content}</td>`;
}
column += `</tr>`;
tbody += column;
}
var body = `
<table border=0 style="border:none">
<tr>
<td colspan="3"> ${company.toUpperCase()}</td>
</tr>
<tr>
<td> Unit Induk Distribusi/Wilayah </td>
<td>:</td>
<td> ${reportMeta.uid
? reportMeta.uid.name.toUpperCase()
: 'Semua Unit Induk Distribusi/Wilayah'.toUpperCase()}</td>
<tr>
<td> Unit Pelaksanaan Pelayanan Pelanggan</td>
<td>:</td>
<td> ${reportMeta.up3
? reportMeta.up3.name.toUpperCase()
: 'Semua Unit Pelaksanaan Pelayanan Pelanggan'.toUpperCase()}</td>
</tr>
<tr>
<td> Unit Layanan Pelanggan</td>
<td>:</td>
<td> ${reportMeta.ulp ? reportMeta.ulp.name.toUpperCase() : 'Semua Unit Layanan Pelanggan'.toUpperCase()}</td>
</tr>
</table>
<center><h6>${filename.toUpperCase()}</h6></center>
<table class="main">
<thead>
<tr>
<th rowspan="3">Nama Unit</th>
<th colspan="6">s.d. ${getMonthNameShort(reportMeta.currentMonth)} ${reportMeta.lastYear}</th>
<th colspan="6">s.d. ${getMonthNameShort(reportMeta.currentMonth)} ${reportMeta.currentYear}</th>
<th colspan="3">Delta Penurunan</th>
<th colspan="4">% Penurunan YoY</th>
</tr>
<tr>
<th rowspan="2">Keluhan</th>
<th rowspan="2">Gangguan</th>
<th colspan="3">Informasi</th>
<th rowspan="2">Total Komplain</th>
<th rowspan="2">Keluhan</th>
<th rowspan="2">Gangguan</th>
<th colspan="3">Informasi</th>
<th rowspan="2">Total Komplain</th>
<th rowspan="2">Keluhan</th>
<th rowspan="2">Gangguan</th>
<th rowspan="2">Informasi</th>
<th rowspan="2">% Total</th>
</tr>
<tr>
<th>Keluhan</th>
<th>Gangguan</th>
<th>Total</th>
<th>Keluhan</th>
<th>Gangguan</th>
<th>Total</th>
</tr>
<tr>
<td>1</td>
<td>2</td>
<td>3</td>
<td>4</td>
<td>5</td>
<td>6=4+5</td>
<td>7=2+3+6</td>
<td>8</td>
<td>9</td>
<td>10</td>
<td>11</td>
<td>12=10+11</td>
<td>13=8+9+12</td>
<td>14=2-8</td>
<td>15=3-9</td>
<td>16=6-12</td>
<td>17=40%*(14/2)</td>
<td>18=40%*(15/3)</td>
<td>19=20%*(16/6)</td>
<td>20=17+18+19</td>
</tr>
</thead>
<tbody>
${tbody}
</tbody>
</table>
`
var postHtml = `<br>
<footer>
<p style="text-align: right; font-size: 10px;">${day}, ${date}-${month}-${year}</p>
<br>
<p style="text-align: right; font-size: 10px;">(.........................................)</p>
</footer></div></body></html>`;
var html = preHtml + body + postHtml;
var url =
"data:application/vnd.ms-word;charset=utf-8," + encodeURIComponent(html);
filename = filename ? filename + ".doc" : "document.doc";
var downloadLink = document.createElement("a");
document.body.appendChild(downloadLink);
downloadLink.href = url;
downloadLink.download = filename;
downloadLink.click();
document.body.removeChild(downloadLink);
}
const exportDetailToWord = (reportMeta: any, rawData: any, filename: any, periode: any) => {
var preHtml = `<html xmlns:o='urn:schemas-microsoft-com:office:office' xmlns:w='urn:schemas-microsoft-com:office:word' xmlns='http://www.w3.org/TR/REC-html40'><head><meta charset='utf-8'><title>${filename}</title>
<style type="text/css" media="print">
@page Section1 {
size:841.95pt 21.0cm;
mso-page-orientation:landscape;
margin:72.0pt 72.0pt 72.0pt 72.0pt;
mso-header-margin:35.4pt;
mso-footer-margin:35.4pt;
mso-paper-source:0;
}
@page{
size: landscape;
font-size: 5px;
}
div.Section1 {
page:Section1;
}
table.main {
border-collapse: collapse;
width: 100%;
text-transform: uppercase;
font-size: 8px;
}
table.main thead tr {
background-color: #c0c0c0;
}
</style>
</head><body>
<div class="Section1">
`;
var tbody = ``;
var cr = ``;
rawData.map((item: any, i: any) => {
cr += '<tr>';
cr += `<td>${i + 1}</td>`;
cr += `<td>${item.nama_ulp}</td>`;
cr += `<td>${item.no_laporan}</td>`;
cr += `<td>${item.waktu_lapor}</td>`;
cr += `<td>${item.waktu_response}</td>`;
cr += `<td>${item.waktu_recovery}</td>`;
cr += `<td>${item.durasi_response_time ? formatWaktu(item.durasi_response_time) : ''}</td>`;
cr += `<td>${item.durasi_recovery_time ? formatWaktu(item.durasi_recovery_time) : ''}</td>`;
cr += '<td></td>';
cr += '<td></td>';
cr += '<td></td>';
cr += `<td>${item.idpel_nometer}</td>`;
cr += `<td>${item.nama_pelapor}</td>`;
cr += `<td>${item.alamat_pelapor}</td>`;
cr += `<td>${item.no_telp_pelapor}</td>`;
cr += `<td>${item.keterangan_pelapor}</td>`;
cr += '<td></td>';
cr += '<td></td>';
cr += `<td>${item.status_akhir}</td>`;
cr += '<td></td>';
cr += '<td></td>';
cr += '<td></td>';
cr += '<td></td>';
cr += '</tr>';
});
tbody += cr;
var body = `
<table border=0 style="border:none">
<tr>
<td colspan="3"> ${company.toUpperCase()}</td>
</tr>
<tr>
<td> Unit Induk Distribusi/Wilayah </td>
<td>:</td>
<td> ${reportMeta.uid
? reportMeta.uid.name.toUpperCase()
: 'Semua Unit Induk Distribusi/Wilayah'.toUpperCase()}</td>
<tr>
<td> Unit Pelaksanaan Pelayanan Pelanggan</td>
<td>:</td>
<td> ${reportMeta.up3
? reportMeta.up3.name.toUpperCase()
: 'Semua Unit Pelaksanaan Pelayanan Pelanggan'.toUpperCase()}</td>
</tr>
<tr>
<td> Unit Layanan Pelanggan</td>
<td>:</td>
<td> ${reportMeta.posko ? reportMeta.ulp.name.toUpperCase() : 'Semua Unit Layanan Pelanggan'.toUpperCase()}</td>
</tr>
</table>
<center><h6>${filename.toUpperCase()}</h6></center>
<table class="main">
<thead>
<tr>
<th>No</th>
<th>ULP</th>
<th>No Laporan</th>
<th>Tgl/ Jam Lapor</th>
<th>Tgl/ Jam Datang</th>
<th>Tgl/ Jam Nyala</th>
<th>Durasi Response Time</th>
<th>Durasi Recovery Time</th>
<th>Durasi Penugasan Regu</th>
<th>Durasi Perjalanan Regu</th>
<th>Dispatch Oleh</th>
<th>IDPEL/NO METER</th>
<th>Nama Pelapor</th>
<th>Alamat Pelapor</th>
<th>No Telp Pelapor</th>
<th>Keterangan Pelapor</th>
<th>Sumber Lapor</th>
<th>Diselesaikan Oleh</th>
<th>Status</th>
<th>Referensi Marking</th>
<th>Kode Gangguan</th>
<th>Jenis Gangguan</th>
<th>Tindakan</th>
</tr>
</thead>
<tbody>
${tbody}
</tbody>
</table>
`
var postHtml = `<br>
<footer>
<p style="text-align: right; font-size: 10px;">${day}, ${date}-${month}-${year}</p>
<br>
<p style="text-align: right; font-size: 10px;">(.........................................)</p>
</footer></div></body></html>`;
var html = preHtml + body + postHtml;
var url =
"data:application/vnd.ms-word;charset=utf-8," + encodeURIComponent(html);
filename = filename ? filename + ".doc" : "document.doc";
var downloadLink = document.createElement("a");
document.body.appendChild(downloadLink);
downloadLink.href = url;
downloadLink.download = filename;
downloadLink.click();
document.body.removeChild(downloadLink);
}
export { exportToWord, exportDetailToWord }