DOCUMENT rekapitulasi
This commit is contained in:
280
src/report/Gangguan/Rekap/doc/RGangguan_BerdasarMedia_DOC.ts
Normal file
280
src/report/Gangguan/Rekap/doc/RGangguan_BerdasarMedia_DOC.ts
Normal file
@ -0,0 +1,280 @@
|
||||
|
||||
const company = "PT. PLN (Persero)";
|
||||
const exportToWord = (reportMeta: any, rawData: any, filename: any, periode: any) => {
|
||||
console.log(rawData)
|
||||
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 === 'GRAND TOTAL') {
|
||||
styleTotal = 'style="background-color: #c0c0c0"'
|
||||
};
|
||||
i === 0 ?
|
||||
column += `<td ${styleTotal} ${colSpan} align="left">${content.content}</td>`
|
||||
: column += `<td ${styleTotal}>${content}</td>`;
|
||||
}
|
||||
column += `</tr>`;
|
||||
tbody += column;
|
||||
}
|
||||
const header =
|
||||
[
|
||||
{
|
||||
content: 'No',
|
||||
rowSpan: 2
|
||||
},
|
||||
{
|
||||
content: 'Nama Media',
|
||||
rowSpan: 2
|
||||
},
|
||||
{
|
||||
content: 'Tanggal',
|
||||
colSpan: 31
|
||||
},
|
||||
{
|
||||
content: 'Total',
|
||||
rowSpan: 2
|
||||
}
|
||||
];
|
||||
var columnHeader = '';
|
||||
for (let i = 0; i < header.length; i++) {
|
||||
const content = header[i];
|
||||
const rowSpan = content.rowSpan ? `rowspan="${content.rowSpan}"` : '';
|
||||
const colSpan = content?.colSpan !== undefined ? `colspan="${content.colSpan}"` : ''
|
||||
|
||||
columnHeader += `<th ${rowSpan} ${colSpan} align="center">${content.content}</th>`;
|
||||
}
|
||||
var columnTanggal = '';
|
||||
for (let index = 1; index <= 31; index++) {
|
||||
columnTanggal += `<td>${index}</td>`;
|
||||
}
|
||||
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>
|
||||
${columnHeader}
|
||||
</tr>
|
||||
<tr>
|
||||
${columnTanggal}
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
${tbody}
|
||||
</tbody>
|
||||
</table>
|
||||
`
|
||||
|
||||
var postHtml = "</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.referensi_marking}</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.tindakan}</td>`;
|
||||
cr += `<td>${item.penyebab}</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>Referensi Marking</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>Tidakan</th>
|
||||
<th>Penyebab</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
${tbody}
|
||||
</tbody>
|
||||
</table>
|
||||
`
|
||||
|
||||
var postHtml = "</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