rekap monalisa gangguan , kpi , material
This commit is contained in:
Eko Haryadi
@ -1,4 +1,5 @@
|
||||
|
||||
|
||||
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>
|
||||
@ -113,7 +114,12 @@ const exportToWord = (reportMeta: any, rawData: any, filename: any, periode: any
|
||||
</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;
|
||||
|
||||
@ -258,7 +264,12 @@ const exportDetailToWord = (reportMeta: any, rawData: any, filename: any, period
|
||||
</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;
|
||||
|
||||
|
||||
@ -92,7 +92,12 @@ const exportToWord = (reportMeta: any, rawData: any, filename: any, periode: any
|
||||
</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;
|
||||
|
||||
@ -226,7 +231,12 @@ const exportDetailToWord = (reportMeta: any, rawData: any, filename: any, period
|
||||
</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;
|
||||
|
||||
|
||||
@ -123,7 +123,12 @@ const exportToWord = (reportMeta: any, rawData: any, filename: any, periode: any
|
||||
</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;
|
||||
|
||||
@ -255,7 +260,12 @@ const exportDetailToWord = (reportMeta: any, rawData: any, filename: any, period
|
||||
</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;
|
||||
|
||||
|
||||
@ -134,7 +134,12 @@ const exportToWord = (reportMeta: any, rawData: any, filename: any, periode: any
|
||||
</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;
|
||||
|
||||
@ -254,7 +259,12 @@ const exportDetailToWord = (reportMeta: any, rawData: any, filename: any, period
|
||||
</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;
|
||||
|
||||
|
||||
@ -164,7 +164,12 @@ const exportToWord = (reportMeta: any, rawData: any, filename: any, periode: any
|
||||
</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;
|
||||
|
||||
@ -290,7 +295,12 @@ const exportDetailToWord = (reportMeta: any, rawData: any, filename: any, period
|
||||
</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;
|
||||
|
||||
|
||||
@ -123,7 +123,12 @@ const exportToWord = (reportMeta: any, rawData: any, filename: any, periode: any
|
||||
</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;
|
||||
|
||||
@ -255,7 +260,12 @@ const exportDetailToWord = (reportMeta: any, rawData: any, filename: any, period
|
||||
</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;
|
||||
|
||||
|
||||
@ -123,7 +123,12 @@ const exportToWord = (reportMeta: any, rawData: any, filename: any, periode: any
|
||||
</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;
|
||||
|
||||
@ -255,7 +260,12 @@ const exportDetailToWord = (reportMeta: any, rawData: any, filename: any, period
|
||||
</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;
|
||||
|
||||
|
||||
@ -108,7 +108,12 @@ const exportToWord = (reportMeta: any, rawData: any, filename: any, periode: any
|
||||
</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;
|
||||
|
||||
@ -268,7 +273,12 @@ const exportDetailToWord = (reportMeta: any, rawData: any, filename: any, period
|
||||
</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;
|
||||
|
||||
|
||||
@ -121,7 +121,12 @@ const exportToWord = (reportMeta: any, rawData: any, filename: any, periode: any
|
||||
</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;
|
||||
|
||||
@ -253,7 +258,12 @@ const exportDetailToWord = (reportMeta: any, rawData: any, filename: any, period
|
||||
</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;
|
||||
|
||||
|
||||
@ -122,7 +122,12 @@ const exportToWord = (reportMeta: any, rawData: any, filename: any, periode: any
|
||||
</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;
|
||||
|
||||
@ -256,7 +261,12 @@ const exportDetailToWord = (reportMeta: any, rawData: any, filename: any, period
|
||||
</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;
|
||||
|
||||
|
||||
@ -120,7 +120,12 @@ const exportToWord = (reportMeta: any, rawData: any, filename: any, periode: any
|
||||
</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;
|
||||
|
||||
@ -253,7 +258,12 @@ const exportDetailToWord = (reportMeta: any, rawData: any, filename: any, period
|
||||
</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;
|
||||
|
||||
|
||||
@ -118,7 +118,12 @@ const exportToWord = (reportMeta: any, rawData: any, filename: any, periode: any
|
||||
</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;
|
||||
|
||||
@ -251,7 +256,12 @@ const exportDetailToWord = (reportMeta: any, rawData: any, filename: any, period
|
||||
</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;
|
||||
|
||||
|
||||
@ -117,7 +117,12 @@ const exportToWord = (reportMeta: any, rawData: any, filename: any, periode: any
|
||||
</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;
|
||||
|
||||
@ -251,7 +256,12 @@ const exportDetailToWord = (reportMeta: any, rawData: any, filename: any, period
|
||||
</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;
|
||||
|
||||
|
||||
@ -17,6 +17,7 @@ import { jsPDF } from 'jspdf'
|
||||
import autoTable from 'jspdf-autotable'
|
||||
import { Workbook } from 'exceljs'
|
||||
import { setHeaderStyle } from '@/report/utils/xlsx'
|
||||
import { exportToWord } from './doc/Material_DGMYG_DOC'
|
||||
|
||||
const reportName = 'Daftar Gangguan Dan Material Yang Dipakai'
|
||||
const fontSize = 5
|
||||
@ -222,28 +223,25 @@ const exportToXLSX = (reportMeta: any, e: any) => {
|
||||
worksheet,
|
||||
2,
|
||||
1,
|
||||
`DISTRIBUSI/WILAYAH : ${
|
||||
reportMeta.value.uid
|
||||
? reportMeta.value.uid.name.toUpperCase()
|
||||
: 'Semua Distribusi/Wilayah'.toUpperCase()
|
||||
`DISTRIBUSI/WILAYAH : ${reportMeta.value.uid
|
||||
? reportMeta.value.uid.name.toUpperCase()
|
||||
: 'Semua Distribusi/Wilayah'.toUpperCase()
|
||||
}`
|
||||
)
|
||||
setHeaderStyle(
|
||||
worksheet,
|
||||
3,
|
||||
1,
|
||||
`AREA : ${
|
||||
reportMeta.value.up3 ? reportMeta.value.up3.name.toUpperCase() : 'Semua Area'.toUpperCase()
|
||||
`AREA : ${reportMeta.value.up3 ? reportMeta.value.up3.name.toUpperCase() : 'Semua Area'.toUpperCase()
|
||||
}`
|
||||
)
|
||||
setHeaderStyle(
|
||||
worksheet,
|
||||
4,
|
||||
1,
|
||||
`POSKO : ${
|
||||
reportMeta.value.posko
|
||||
? reportMeta.value.posko.name.toUpperCase()
|
||||
: 'Semua Posko'.toUpperCase()
|
||||
`POSKO : ${reportMeta.value.posko
|
||||
? reportMeta.value.posko.name.toUpperCase()
|
||||
: 'Semua Posko'.toUpperCase()
|
||||
}`
|
||||
)
|
||||
|
||||
@ -279,5 +277,8 @@ const exportToXLSX = (reportMeta: any, e: any) => {
|
||||
|
||||
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
271
src/report/Material/Daftar/doc/Material_DGMYG_DOC.ts
Normal 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 }
|
||||
@ -17,6 +17,7 @@ import { jsPDF } from 'jspdf'
|
||||
import autoTable from 'jspdf-autotable'
|
||||
import { Workbook } from 'exceljs'
|
||||
import { setHeaderStyle } from '@/report/utils/xlsx'
|
||||
import { exportToWord } from './doc/Material_RPM_DOC'
|
||||
|
||||
const reportName = 'Rekapitulasi Pemakaian Material'
|
||||
const fontSize = 5
|
||||
@ -212,28 +213,25 @@ const exportToXLSX = (reportMeta: any, e: any) => {
|
||||
worksheet,
|
||||
2,
|
||||
1,
|
||||
`DISTRIBUSI/WILAYAH : ${
|
||||
reportMeta.value.uid
|
||||
? reportMeta.value.uid.name.toUpperCase()
|
||||
: 'Semua Distribusi/Wilayah'.toUpperCase()
|
||||
`DISTRIBUSI/WILAYAH : ${reportMeta.value.uid
|
||||
? reportMeta.value.uid.name.toUpperCase()
|
||||
: 'Semua Distribusi/Wilayah'.toUpperCase()
|
||||
}`
|
||||
)
|
||||
setHeaderStyle(
|
||||
worksheet,
|
||||
3,
|
||||
1,
|
||||
`AREA : ${
|
||||
reportMeta.value.up3 ? reportMeta.value.up3.name.toUpperCase() : 'Semua Area'.toUpperCase()
|
||||
`AREA : ${reportMeta.value.up3 ? reportMeta.value.up3.name.toUpperCase() : 'Semua Area'.toUpperCase()
|
||||
}`
|
||||
)
|
||||
setHeaderStyle(
|
||||
worksheet,
|
||||
4,
|
||||
1,
|
||||
`POSKO : ${
|
||||
reportMeta.value.posko
|
||||
? reportMeta.value.posko.name.toUpperCase()
|
||||
: 'Semua Posko'.toUpperCase()
|
||||
`POSKO : ${reportMeta.value.posko
|
||||
? reportMeta.value.posko.name.toUpperCase()
|
||||
: 'Semua Posko'.toUpperCase()
|
||||
}`
|
||||
)
|
||||
|
||||
@ -270,4 +268,7 @@ const exportToXLSX = (reportMeta: any, e: any) => {
|
||||
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
264
src/report/Material/Rekapitulasi/doc/Material_RPM_DOC.ts
Normal 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 }
|
||||
@ -20,6 +20,7 @@ import { formatWaktu } from '@/components/Form/FiltersType/reference'
|
||||
import { setHeaderStyle } from '@/report/utils/xlsx'
|
||||
import { formatNumber, formatPercentage } from '@/utils/numbers'
|
||||
import { getMonthName } from '@/utils/texts'
|
||||
import { exportDetailToWord, exportToWord } from './doc/MonalisaGR_DispatchingTimeGangguan_DOC'
|
||||
|
||||
const reportName = 'Dispacthing Time (DT) Gangguan'
|
||||
const fontSize = 5
|
||||
@ -465,38 +466,34 @@ const exportToXLSX = (reportMeta: any, e: any) => {
|
||||
worksheet,
|
||||
2,
|
||||
1,
|
||||
`UNIT INDUK : ${
|
||||
reportMeta.uid
|
||||
? reportMeta.uid.name.toUpperCase()
|
||||
: 'Semua Unit Induk Distribusi/Wilayah'.toUpperCase()
|
||||
`UNIT INDUK : ${reportMeta.uid
|
||||
? reportMeta.uid.name.toUpperCase()
|
||||
: 'Semua Unit Induk Distribusi/Wilayah'.toUpperCase()
|
||||
}`
|
||||
)
|
||||
setHeaderStyle(
|
||||
worksheet,
|
||||
3,
|
||||
1,
|
||||
`UNIT PELAKSANA PELAYANAN PELANGGAN : ${
|
||||
reportMeta.up3
|
||||
? reportMeta.up3.name.toUpperCase()
|
||||
: 'Semua Unit Pelaksanaan Pelayanan Pelanggan'.toUpperCase()
|
||||
`UNIT PELAKSANA PELAYANAN PELANGGAN : ${reportMeta.up3
|
||||
? reportMeta.up3.name.toUpperCase()
|
||||
: 'Semua Unit Pelaksanaan Pelayanan Pelanggan'.toUpperCase()
|
||||
}`
|
||||
)
|
||||
setHeaderStyle(
|
||||
worksheet,
|
||||
4,
|
||||
1,
|
||||
`UNIT LAYANAN PELANGGAN : ${
|
||||
reportMeta.ulp
|
||||
? reportMeta.ulp.name.toUpperCase()
|
||||
: 'Semua Unit Layanan Pelanggan'.toUpperCase()
|
||||
`UNIT LAYANAN PELANGGAN : ${reportMeta.ulp
|
||||
? reportMeta.ulp.name.toUpperCase()
|
||||
: 'Semua Unit Layanan Pelanggan'.toUpperCase()
|
||||
}`
|
||||
)
|
||||
setHeaderStyle(
|
||||
worksheet,
|
||||
5,
|
||||
1,
|
||||
`REGIONAL : ${
|
||||
reportMeta.regional ? reportMeta.regional.name.toUpperCase() : 'Semua Regional'.toUpperCase()
|
||||
`REGIONAL : ${reportMeta.regional ? reportMeta.regional.name.toUpperCase() : 'Semua Regional'.toUpperCase()
|
||||
}`
|
||||
)
|
||||
|
||||
@ -560,4 +557,10 @@ const exportDetailToXLSX = (reportMeta: any, e: any) => {
|
||||
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 }
|
||||
|
||||
@ -19,6 +19,7 @@ import { Workbook } from 'exceljs'
|
||||
import { setHeaderStyle } from '@/report/utils/xlsx'
|
||||
import { formatNumber, formatPercentage } from '@/utils/numbers'
|
||||
import { getMonthName } from '@/utils/texts'
|
||||
import { exportToWord } from './doc/MonalisaGR_ENSGangguan_DOC'
|
||||
|
||||
const reportName = 'Rekapitulasi ENS Gangguan'
|
||||
const fontSize = 5
|
||||
@ -368,5 +369,7 @@ const exportToXLSX = (reportMeta: any, e: any) => {
|
||||
|
||||
e.cancel = true
|
||||
}
|
||||
|
||||
export { exportToPDF, exportToXLSX }
|
||||
const exportToDOCX = (reportMeta: any, rawData: any) => {
|
||||
exportToWord(reportMeta, formatData(rawData), `Laporan ${reportName}`, null)
|
||||
}
|
||||
export { exportToPDF, exportToXLSX , exportToDOCX}
|
||||
|
||||
@ -19,6 +19,7 @@ import { Workbook } from 'exceljs'
|
||||
import { setHeaderStyle } from '@/report/utils/xlsx'
|
||||
import { formatNumber } from '@/utils/numbers'
|
||||
import { formatWaktu } from '@/components/Form/FiltersType/reference'
|
||||
import { exportDetailToWord, exportToWord } from './doc/MonalisaGR_GangguanBelumSelesai_DOC'
|
||||
|
||||
const reportName = 'Rekapitulasi Gangguan Belum Selesai'
|
||||
const fontSize = 5
|
||||
@ -391,38 +392,34 @@ const exportToXLSX = (reportMeta: any, e: any) => {
|
||||
worksheet,
|
||||
2,
|
||||
1,
|
||||
`UNIT INDUK : ${
|
||||
reportMeta.uid
|
||||
? reportMeta.uid.name.toUpperCase()
|
||||
: 'Semua Unit Induk Distribusi/Wilayah'.toUpperCase()
|
||||
`UNIT INDUK : ${reportMeta.uid
|
||||
? reportMeta.uid.name.toUpperCase()
|
||||
: 'Semua Unit Induk Distribusi/Wilayah'.toUpperCase()
|
||||
}`
|
||||
)
|
||||
setHeaderStyle(
|
||||
worksheet,
|
||||
3,
|
||||
1,
|
||||
`UNIT PELAKSANA PELAYANAN PELANGGAN : ${
|
||||
reportMeta.up3
|
||||
? reportMeta.up3.name.toUpperCase()
|
||||
: 'Semua Unit Pelaksanaan Pelayanan Pelanggan'.toUpperCase()
|
||||
`UNIT PELAKSANA PELAYANAN PELANGGAN : ${reportMeta.up3
|
||||
? reportMeta.up3.name.toUpperCase()
|
||||
: 'Semua Unit Pelaksanaan Pelayanan Pelanggan'.toUpperCase()
|
||||
}`
|
||||
)
|
||||
setHeaderStyle(
|
||||
worksheet,
|
||||
4,
|
||||
1,
|
||||
`UNIT LAYANAN PELANGGAN : ${
|
||||
reportMeta.ulp
|
||||
? reportMeta.ulp.name.toUpperCase()
|
||||
: 'Semua Unit Layanan Pelanggan'.toUpperCase()
|
||||
`UNIT LAYANAN PELANGGAN : ${reportMeta.ulp
|
||||
? reportMeta.ulp.name.toUpperCase()
|
||||
: 'Semua Unit Layanan Pelanggan'.toUpperCase()
|
||||
}`
|
||||
)
|
||||
setHeaderStyle(
|
||||
worksheet,
|
||||
5,
|
||||
1,
|
||||
`REGIONAL : ${
|
||||
reportMeta.regional ? reportMeta.regional.name.toUpperCase() : 'Semua Regional'.toUpperCase()
|
||||
`REGIONAL : ${reportMeta.regional ? reportMeta.regional.name.toUpperCase() : 'Semua Regional'.toUpperCase()
|
||||
}`
|
||||
)
|
||||
|
||||
@ -490,4 +487,10 @@ const exportDetailToXLSX = (reportMeta: any, e: any) => {
|
||||
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 }
|
||||
|
||||
@ -18,6 +18,7 @@ import autoTable from 'jspdf-autotable'
|
||||
import { Workbook } from 'exceljs'
|
||||
import { setHeaderStyle } from '@/report/utils/xlsx'
|
||||
import { formatNumber, formatPercentage } from '@/utils/numbers'
|
||||
import { exportToWord } from './doc/MonalisaGR_GangguanPerJenisGangguan_DOC'
|
||||
|
||||
const reportName = 'Rekapitulasi Gangguan Per Jenis Gangguan'
|
||||
const fontSize = 5
|
||||
@ -283,4 +284,7 @@ const exportToXLSX = (reportMeta: any, e: any) => {
|
||||
e.cancel = true
|
||||
}
|
||||
|
||||
export { exportToPDF, exportToXLSX }
|
||||
const exportToDOCX = (reportMeta: any, rawData: any) => {
|
||||
exportToWord(reportMeta, formatData(rawData), `Laporan ${reportName}`, null)
|
||||
}
|
||||
export { exportToPDF, exportToXLSX , exportToDOCX}
|
||||
@ -19,6 +19,7 @@ import { Workbook } from 'exceljs'
|
||||
import { setHeaderStyle } from '@/report/utils/xlsx'
|
||||
import { formatNumber, formatPercentage } from '@/utils/numbers'
|
||||
import { getMonthName } from '@/utils/texts'
|
||||
import { exportToWord } from './doc/MonalisaGR_JumlahDDRPTRCTGangguan_DOC'
|
||||
|
||||
const reportName = 'Jumlah dan Durasi RPT RCT Gangguan'
|
||||
const fontSize = 5
|
||||
@ -322,4 +323,7 @@ const exportToXLSX = (reportMeta: any, e: any) => {
|
||||
e.cancel = true
|
||||
}
|
||||
|
||||
export { exportToPDF, exportToXLSX }
|
||||
const exportToDOCX = (reportMeta: any, rawData: any) => {
|
||||
exportToWord(reportMeta, formatData(rawData), `Laporan ${reportName}`, null)
|
||||
}
|
||||
export { exportToPDF, exportToXLSX , exportToDOCX}
|
||||
@ -20,6 +20,7 @@ import { formatWaktu } from '@/components/Form/FiltersType/reference'
|
||||
import { setHeaderStyle } from '@/report/utils/xlsx'
|
||||
import { formatNumber, formatPercentage } from '@/utils/numbers'
|
||||
import { getMonthName } from '@/utils/texts'
|
||||
import { exportToWord } from './doc/MonalisaGR_JumlahKaliGangguan_DOC'
|
||||
|
||||
const reportName = 'Jumlah Kali Gangguan'
|
||||
const fontSize = 5
|
||||
@ -308,38 +309,34 @@ const exportToXLSX = (reportMeta: any, e: any) => {
|
||||
worksheet,
|
||||
2,
|
||||
1,
|
||||
`UNIT INDUK : ${
|
||||
reportMeta.uid
|
||||
? reportMeta.uid.name.toUpperCase()
|
||||
: 'Semua Unit Induk Distribusi/Wilayah'.toUpperCase()
|
||||
`UNIT INDUK : ${reportMeta.uid
|
||||
? reportMeta.uid.name.toUpperCase()
|
||||
: 'Semua Unit Induk Distribusi/Wilayah'.toUpperCase()
|
||||
}`
|
||||
)
|
||||
setHeaderStyle(
|
||||
worksheet,
|
||||
3,
|
||||
1,
|
||||
`UNIT PELAKSANA PELAYANAN PELANGGAN : ${
|
||||
reportMeta.up3
|
||||
? reportMeta.up3.name.toUpperCase()
|
||||
: 'Semua Unit Pelaksanaan Pelayanan Pelanggan'.toUpperCase()
|
||||
`UNIT PELAKSANA PELAYANAN PELANGGAN : ${reportMeta.up3
|
||||
? reportMeta.up3.name.toUpperCase()
|
||||
: 'Semua Unit Pelaksanaan Pelayanan Pelanggan'.toUpperCase()
|
||||
}`
|
||||
)
|
||||
setHeaderStyle(
|
||||
worksheet,
|
||||
4,
|
||||
1,
|
||||
`UNIT LAYANAN PELANGGAN : ${
|
||||
reportMeta.ulp
|
||||
? reportMeta.ulp.name.toUpperCase()
|
||||
: 'Semua Unit Layanan Pelanggan'.toUpperCase()
|
||||
`UNIT LAYANAN PELANGGAN : ${reportMeta.ulp
|
||||
? reportMeta.ulp.name.toUpperCase()
|
||||
: 'Semua Unit Layanan Pelanggan'.toUpperCase()
|
||||
}`
|
||||
)
|
||||
setHeaderStyle(
|
||||
worksheet,
|
||||
5,
|
||||
1,
|
||||
`REGIONAL : ${
|
||||
reportMeta.regional ? reportMeta.regional.name.toUpperCase() : 'Semua Regional'.toUpperCase()
|
||||
`REGIONAL : ${reportMeta.regional ? reportMeta.regional.name.toUpperCase() : 'Semua Regional'.toUpperCase()
|
||||
}`
|
||||
)
|
||||
|
||||
@ -371,4 +368,8 @@ const exportToXLSX = (reportMeta: any, e: any) => {
|
||||
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 }
|
||||
@ -19,6 +19,7 @@ import { Workbook } from 'exceljs'
|
||||
import { setHeaderStyle } from '@/report/utils/xlsx'
|
||||
import { formatNumber, formatPercentage } from '@/utils/numbers'
|
||||
import { getMonthName } from '@/utils/texts'
|
||||
import { exportToWord } from './doc/MonalisaGR_LaporUlang_DOC'
|
||||
|
||||
const reportName = 'Rekapitulasi Lapor Ulang Gangguan'
|
||||
const fontSize = 5
|
||||
@ -369,4 +370,7 @@ const exportToXLSX = (reportMeta: any, e: any) => {
|
||||
e.cancel = true
|
||||
}
|
||||
|
||||
export { exportToPDF, exportToXLSX }
|
||||
const exportToDOCX = (reportMeta: any, rawData: any) => {
|
||||
exportToWord(reportMeta, formatData(rawData), `Laporan ${reportName}`, null)
|
||||
}
|
||||
export { exportToPDF, exportToXLSX , exportToDOCX}
|
||||
@ -20,6 +20,7 @@ import { formatWaktu } from '@/components/Form/FiltersType/reference'
|
||||
import { setHeaderStyle } from '@/report/utils/xlsx'
|
||||
import { formatNumber, formatPercentage } from '@/utils/numbers'
|
||||
import { getMonthName } from '@/utils/texts'
|
||||
import { exportToWord } from './doc/MonalisaGR_RecoveryTimeGangguan_DOC'
|
||||
|
||||
const reportName = 'Recovery Time (RCT) Gangguan'
|
||||
const fontSize = 5
|
||||
@ -381,4 +382,7 @@ const exportToXLSX = (reportMeta: any, e: any) => {
|
||||
e.cancel = true
|
||||
}
|
||||
|
||||
export { exportToPDF, exportToXLSX }
|
||||
const exportToDOCX = (reportMeta: any, rawData: any) => {
|
||||
exportToWord(reportMeta, formatData(rawData), `Laporan ${reportName}`, null)
|
||||
}
|
||||
export { exportToPDF, exportToXLSX , exportToDOCX}
|
||||
@ -20,6 +20,7 @@ import { formatWaktu } from '@/components/Form/FiltersType/reference'
|
||||
import { setHeaderStyle } from '@/report/utils/xlsx'
|
||||
import { formatNumber, formatPercentage } from '@/utils/numbers'
|
||||
import { getMonthName } from '@/utils/texts'
|
||||
import { exportToWord } from './doc/MonalisaGR_ResponseTimeGangguan_DOC'
|
||||
|
||||
const reportName = 'Response Time (RPT) Gangguan'
|
||||
const fontSize = 5
|
||||
@ -381,4 +382,7 @@ const exportToXLSX = (reportMeta: any, e: any) => {
|
||||
e.cancel = true
|
||||
}
|
||||
|
||||
export { exportToPDF, exportToXLSX }
|
||||
const exportToDOCX = (reportMeta: any, rawData: any) => {
|
||||
exportToWord(reportMeta, formatData(rawData), `Laporan ${reportName}`, null)
|
||||
}
|
||||
export { exportToPDF, exportToXLSX , exportToDOCX}
|
||||
|
||||
@ -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 }
|
||||
@ -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 }
|
||||
@ -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 }
|
||||
@ -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 }
|
||||
@ -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 }
|
||||
@ -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 }
|
||||
@ -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 }
|
||||
@ -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 }
|
||||
@ -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 }
|
||||
@ -20,6 +20,7 @@ import { setHeaderStyle } from '@/report/utils/xlsx'
|
||||
import { formatNumber, formatPercentage } from '@/utils/numbers'
|
||||
import { formatWaktu } from '@/components/Form/FiltersType/reference'
|
||||
import { getMonthNameShort } from '@/utils/texts'
|
||||
import { exportDetailToWord, exportToWord } from './doc/MonalisaLB_AgingComplaint_DOC'
|
||||
|
||||
const reportName = '(Monalisa) Aging Complaint'
|
||||
const fontSize = 5
|
||||
@ -581,5 +582,10 @@ const exportDetailToXLSX = (reportMeta: any, e: any) => {
|
||||
|
||||
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, exportToXLSX, exportDetailToPDF, exportDetailToXLSX ,exportToDOCX,exportDetailToDOCX}
|
||||
|
||||
@ -18,6 +18,7 @@ import autoTable from 'jspdf-autotable'
|
||||
import { Workbook } from 'exceljs'
|
||||
import { setHeaderStyle } from '@/report/utils/xlsx'
|
||||
import { formatNumber } from '@/utils/numbers'
|
||||
import { exportToWord } from './doc/MonalisaLB_EnergyNotSales_DOC'
|
||||
|
||||
const reportName = '(Monalisa) Energy Not Sales (ENS)'
|
||||
const fontSize = 5
|
||||
@ -327,5 +328,8 @@ const exportToXLSX = (reportMeta: any, e: any) => {
|
||||
|
||||
e.cancel = true
|
||||
}
|
||||
const exportToDOCX = (reportMeta: any, rawData: any) => {
|
||||
exportToWord(reportMeta, formatData(rawData), `Laporan ${reportName}`, null)
|
||||
}
|
||||
|
||||
export { exportToPDF, exportToXLSX }
|
||||
export { exportToPDF, exportToXLSX, exportToDOCX}
|
||||
|
||||
@ -19,6 +19,7 @@ import { Workbook } from 'exceljs'
|
||||
import { setHeaderStyle } from '@/report/utils/xlsx'
|
||||
import { formatNumber, formatPercentage } from '@/utils/numbers'
|
||||
import { getMonthNameShort } from '@/utils/texts'
|
||||
import { exportToWord } from './doc/MonalisaLB_KADDalamPelaporan_DOC'
|
||||
|
||||
const reportName = '(Monalisa) Kepatuhan dan Akurasi Dalam Pelaporan'
|
||||
const fontSize = 5
|
||||
@ -361,5 +362,8 @@ const exportToXLSX = (reportMeta: any, e: any) => {
|
||||
|
||||
e.cancel = true
|
||||
}
|
||||
const exportToDOCX = (reportMeta: any, rawData: any) => {
|
||||
exportToWord(reportMeta, formatData(rawData), `Laporan ${reportName}`, null)
|
||||
}
|
||||
|
||||
export { exportToPDF, exportToXLSX }
|
||||
export { exportToPDF, exportToXLSX, exportToDOCX}
|
||||
|
||||
@ -20,6 +20,7 @@ import { setHeaderStyle } from '@/report/utils/xlsx'
|
||||
import { formatNumber, formatPercentage } from '@/utils/numbers'
|
||||
import { formatWaktu } from '@/components/Form/FiltersType/reference'
|
||||
import { getMonthNameShort } from '@/utils/texts'
|
||||
import { exportDetailToWord, exportToWord } from './doc/MonalisaLB_PenurunanJumlahKomplain_DOC'
|
||||
|
||||
const reportName = '(Monalisa) Penurunan Jumlah Komplain'
|
||||
const fontSize = 5
|
||||
@ -713,5 +714,10 @@ const exportDetailToXLSX = (reportMeta: any, e: any) => {
|
||||
|
||||
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, exportToXLSX, exportDetailToPDF, exportDetailToXLSX, exportToDOCX, exportDetailToDOCX }
|
||||
|
||||
@ -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 }
|
||||
@ -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 }
|
||||
@ -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 }
|
||||
@ -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 }
|
||||
@ -19,6 +19,7 @@ import { Workbook } from 'exceljs'
|
||||
import { setHeaderStyle } from '@/report/utils/xlsx'
|
||||
import { formatNumber, formatPercentage } from '@/utils/numbers'
|
||||
import { getMonthNameShort } from '@/utils/texts'
|
||||
import { exportToWord } from './doc/MonalisaLK_AgingComplaint_DOC'
|
||||
|
||||
const reportName = 'Aging Complaint'
|
||||
const fontSize = 5
|
||||
@ -414,5 +415,8 @@ const exportToXLSX = (reportMeta: any, e: any) => {
|
||||
|
||||
e.cancel = true
|
||||
}
|
||||
const exportToDOCX = (reportMeta: any, rawData: any) => {
|
||||
exportToWord(reportMeta, formatData(rawData), `Laporan ${reportName}`, null)
|
||||
}
|
||||
|
||||
export { exportToPDF, exportToXLSX }
|
||||
export { exportToPDF, exportToXLSX ,exportToDOCX}
|
||||
|
||||
@ -18,6 +18,7 @@ import autoTable from 'jspdf-autotable'
|
||||
import { Workbook } from 'exceljs'
|
||||
import { setHeaderStyle } from '@/report/utils/xlsx'
|
||||
import { formatNumber } from '@/utils/numbers'
|
||||
import { exportToWord } from './doc/MonalisaLK_EnergyNotSales_DOC'
|
||||
|
||||
const reportName = 'Energy Not Sales (ENS)'
|
||||
const fontSize = 5
|
||||
@ -327,5 +328,8 @@ const exportToXLSX = (reportMeta: any, e: any) => {
|
||||
|
||||
e.cancel = true
|
||||
}
|
||||
const exportToDOCX = (reportMeta: any, rawData: any) => {
|
||||
exportToWord(reportMeta, formatData(rawData), `Laporan ${reportName}`, null)
|
||||
}
|
||||
|
||||
export { exportToPDF, exportToXLSX }
|
||||
export { exportToPDF, exportToXLSX , exportToDOCX}
|
||||
|
||||
@ -19,6 +19,7 @@ import { Workbook } from 'exceljs'
|
||||
import { setHeaderStyle } from '@/report/utils/xlsx'
|
||||
import { formatNumber, formatPercentage } from '@/utils/numbers'
|
||||
import { getMonthNameShort } from '@/utils/texts'
|
||||
import { exportToWord } from './doc/MonalisaLK_KDADPelaporan_DOC'
|
||||
|
||||
const reportName = 'Kepatuhan dan Akurasi Dalam Pelaporan'
|
||||
const fontSize = 5
|
||||
@ -361,5 +362,8 @@ const exportToXLSX = (reportMeta: any, e: any) => {
|
||||
|
||||
e.cancel = true
|
||||
}
|
||||
const exportToDOCX = (reportMeta: any, rawData: any) => {
|
||||
exportToWord(reportMeta, formatData(rawData), `Laporan ${reportName}`, null)
|
||||
}
|
||||
|
||||
export { exportToPDF, exportToXLSX }
|
||||
export { exportToPDF, exportToXLSX,exportToDOCX }
|
||||
|
||||
@ -19,6 +19,7 @@ import { Workbook } from 'exceljs'
|
||||
import { setHeaderStyle } from '@/report/utils/xlsx'
|
||||
import { formatNumber, formatPercentage } from '@/utils/numbers'
|
||||
import { getMonthNameShort } from '@/utils/texts'
|
||||
import { exportToWord } from './doc/MonalisaLK_PenurunanJumlahKomplain_DOC'
|
||||
|
||||
const reportName = 'Penurunan Jumlah Komplain'
|
||||
const fontSize = 5
|
||||
@ -547,5 +548,8 @@ const exportToXLSX = (reportMeta: any, e: any) => {
|
||||
|
||||
e.cancel = true
|
||||
}
|
||||
const exportToDOCX = (reportMeta: any, rawData: any) => {
|
||||
exportToWord(reportMeta, formatData(rawData), `Laporan ${reportName}`, null)
|
||||
}
|
||||
|
||||
export { exportToPDF, exportToXLSX }
|
||||
export { exportToPDF, exportToXLSX,exportToDOCX }
|
||||
|
||||
@ -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 }
|
||||
@ -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 }
|
||||
@ -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 }
|
||||
@ -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 }
|
||||
Reference in New Issue
Block a user