From 98527693a742609ce0a57c88c1dddf7e8de38900 Mon Sep 17 00:00:00 2001
From: kur0nek-o <maulana21mh@gmail.com>
Date: Thu, 28 Mar 2024 11:10:07 +0700
Subject: [PATCH] feat: create export pdf in rekapitulasi rating per regu

---
 .../Rekap/RGangguan_RatingPerRegu.vue         | 513 +++++-------------
 .../Rekap/RGangguan_RatingPerPosko.ts         |   2 +-
 .../Gangguan/Rekap/RGangguan_RatingPerRegu.ts | 248 +++++++++
 3 files changed, 389 insertions(+), 374 deletions(-)
 create mode 100644 src/report/Gangguan/Rekap/RGangguan_RatingPerRegu.ts

diff --git a/src/components/Pages/Gangguan/Rekap/RGangguan_RatingPerRegu.vue b/src/components/Pages/Gangguan/Rekap/RGangguan_RatingPerRegu.vue
index 00d90c7..81f994c 100755
--- a/src/components/Pages/Gangguan/Rekap/RGangguan_RatingPerRegu.vue
+++ b/src/components/Pages/Gangguan/Rekap/RGangguan_RatingPerRegu.vue
@@ -1,5 +1,11 @@
 <template>
-  <Filters @run-search="() => filterData(filters)" :report-button="true" class="mb-4">
+  <Filters
+    @reset-form="data = []"
+    @run-report="() => exportToPDF(reportMeta, data, true)"
+    @run-search="() => filterData(filters)"
+    :report-button="true"
+    class="mb-4"
+  >
     <Type1 @update:filters="(value) => (filters = value)" />
   </Filters>
   <div id="data">
@@ -43,20 +49,11 @@
         :width="50"
         alignment="center"
         caption="NO"
-        data-field="number"
         data-type="number"
+        :calculateCellValue="(item: any) => data.findIndex((i) => i == item) + 1"
         css-class="custom-table-column"
         cell-template="formatNumber"
       />
-      <DxColumn
-        :width="150"
-        alignment="center"
-        data-field="nama_up3"
-        caption="UP3"
-        css-class="custom-table-column"
-        cell-template="formatText"
-        :group-index="0"
-      />
       <DxColumn
         :width="150"
         alignment="center"
@@ -618,8 +615,6 @@ import {
   DxSearchPanel,
   DxSelection
 } from 'devextreme-vue/data-grid'
-import { jsPDF } from 'jspdf'
-import { exportDataGrid as exportToPdf } from 'devextreme/pdf_exporter'
 import { exportDataGrid as exportToExcel } from 'devextreme/excel_exporter'
 import { saveAs } from 'file-saver'
 import { Workbook } from 'exceljs'
@@ -632,9 +627,11 @@ import DetailDialog from '@/components/Dialogs/DetailDialog.vue'
 import InputText from '@/components/InputText.vue'
 import { apolloClient } from '@/utils/api/api.graphql'
 import { provideApolloClient } from '@vue/apollo-composable'
+import { exportToPDF } from '@/report/Gangguan/Rekap/RGangguan_RatingPerRegu'
 
 const client = apolloClient()
 provideApolloClient(client)
+
 const position = { of: '#data' }
 const showIndicator = ref(true)
 const shading = ref(true)
@@ -646,6 +643,12 @@ const dataSubSelected = ref()
 const dialogDetail = ref(false)
 const loadingData = ref(false)
 const loadingSubData = ref(false)
+const reportMeta = ref({
+  uid: { id: 0, name: 'Semua Unit Induk Distribusi/Wilayah' },
+  up3: { id: 0, name: 'Semua Unit Pelaksanaan Pelayanan Pelanggan' },
+  posko: { id: 0, name: 'Semua Posko' },
+  periode: ''
+})
 
 const getDetail = () => {
   loadingSubData.value = true
@@ -707,15 +710,7 @@ const closeDialog = () => {
 
 const onExporting = (e: any) => {
   if (e.format === 'pdf') {
-    const doc = new jsPDF()
-
-    exportToPdf({
-      jsPDFDocument: doc,
-      component: e.component,
-      indent: 5
-    }).then(() => {
-      doc.save(`.pdf`)
-    })
+    exportToPDF(reportMeta.value, data.value)
   } else {
     const workbook = new Workbook()
     const worksheet = workbook.addWorksheet('Employees')
@@ -774,16 +769,19 @@ const filterData = (params: any) => {
   })
   onResult((queryResult) => {
     if (queryResult.data != undefined) {
-      const refs = [...queryResult.data.rekapitulasiGangguanRatingPerRegu].sort((a: any, b: any) =>
-        a.nama_up3.localeCompare(b.nama_up3)
-      )
-      data.value = refs.map((ref: any, index: number) => {
-        return {
-          ...ref,
-          number: index + 1
-        }
-      })
+      // const refs = [...queryResult.data.rekapitulasiGangguanRatingPerRegu].sort((a: any, b: any) =>
+      //   a.nama_up3.localeCompare(b.nama_up3)
+      // )
+      // data.value = refs.map((ref: any, index: number) => {
+      //   return {
+      //     ...ref,
+      //     number: index + 1
+      //   }
+      // })
+      data.value = queryResult.data.rekapitulasiGangguanRatingPerRegu
     }
+
+    reportMeta.value = filters.value
     console.log(queryResult.data)
   })
   onError((error) => {
@@ -795,232 +793,134 @@ onMounted(() => {
   if (import.meta.env.DEV) {
     data.value = [
       {
-        id: 0,
-        nama_regional: 'REGIONAL JMB',
-        id_uid: 101,
-        nama_uid: 'DISTRIBUSI JAWA TENGAH & DIY',
-        id_up3: 52050,
-        nama_up3: 'UP3 SURAKARTA',
-        id_ulp: 52058,
-        nama_ulp: 'ULP SRAGEN',
-        id_posko: 520581,
-        nama_posko: 'POSKO ULP SRAGEN',
-        total: 5,
-        total_selesai: 5,
+        id: 16,
+        nama_regional: 'REGIONAL SUMKAL',
+        id_uid: 221,
+        nama_uid: 'WILAYAH KALIMANTAN SELATAN DAN TENGAH',
+        id_up3: 2210,
+        nama_up3: 'UP3 BANJARMASIN',
+        id_ulp: 22120,
+        nama_ulp: 'ULP BANJARBARU',
+        id_posko: 221201,
+        kode_regu: 'BANJARBARU12',
+        nama_regu: 'BANJARBARU12',
+        nama_posko: 'POSKO ULP BANJARBARU',
+        total: 13,
+        total_selesai: 13,
         persen_selesai: 100,
         total_inproses: 0,
         persen_inproses: 0,
         total_rating: 2,
-        persen_rating: 40,
+        persen_rating: 15.384615384615385,
         nilai_rating1: 0,
         nilai_rating2: 0,
         nilai_rating3: 0,
         nilai_rating4: 0,
         nilai_rating5: 2,
         indeks_rating: 1,
-        total_nonrating: 3,
-        persen_nonrating: 60
+        total_nonrating: 11,
+        persen_nonrating: 84.61538461538461
       },
       {
-        id: 1,
-        nama_regional: 'REGIONAL JMB',
-        id_uid: 103,
-        nama_uid: 'DISTRIBUSI JAWA TIMUR',
-        id_up3: 150,
-        nama_up3: 'UP3 PAMEKASAN',
-        id_ulp: 51750,
-        nama_ulp: 'ULP KETAPANG',
-        id_posko: 517506,
-        nama_posko: 'POSKO ULP KETAPANG',
-        total: 5,
-        total_selesai: 5,
-        persen_selesai: 100,
-        total_inproses: 0,
-        persen_inproses: 0,
-        total_rating: null,
-        persen_rating: null,
-        nilai_rating1: 0,
-        nilai_rating2: 0,
-        nilai_rating3: 0,
-        nilai_rating4: 0,
-        nilai_rating5: 0,
-        indeks_rating: null,
-        total_nonrating: null,
-        persen_nonrating: null
-      },
-      {
-        id: 2,
-        nama_regional: 'REGIONAL SUMKAL',
-        id_uid: 140,
-        nama_uid: 'WILAYAH SUMATERA SELATAN, JAMBI & BENGKULU (S2JB)',
-        id_up3: 1404,
-        nama_up3: 'UP3 JAMBI',
-        id_ulp: 14390,
-        nama_ulp: 'ULP SABAK',
-        id_posko: 143901,
-        nama_posko: 'POSKO ULP SABAK',
-        total: 2,
-        total_selesai: 2,
-        persen_selesai: 100,
-        total_inproses: 0,
-        persen_inproses: 0,
-        total_rating: 2,
-        persen_rating: 100,
-        nilai_rating1: 0,
-        nilai_rating2: 0,
-        nilai_rating3: 0,
-        nilai_rating4: 0,
-        nilai_rating5: 2,
-        indeks_rating: 1,
-        total_nonrating: 0,
-        persen_nonrating: 0
-      },
-      {
-        id: 3,
-        nama_regional: 'REGIONAL JMB',
-        id_uid: 427,
-        nama_uid: 'DISTRIBUSI JAWA BARAT',
-        id_up3: 539,
-        nama_up3: 'UP3 GUNUNG PUTRI',
-        id_ulp: 53867,
-        nama_ulp: 'ULP JONGGOL',
-        id_posko: 538671,
-        nama_posko: 'POSKO ULP JONGGOL',
-        total: 7,
-        total_selesai: 7,
-        persen_selesai: 100,
-        total_inproses: 0,
-        persen_inproses: 0,
-        total_rating: 4,
-        persen_rating: 57.14285714285714,
-        nilai_rating1: 0,
-        nilai_rating2: 0,
-        nilai_rating3: 0,
-        nilai_rating4: 0,
-        nilai_rating5: 4,
-        indeks_rating: 1,
-        total_nonrating: 3,
-        persen_nonrating: 42.857142857142854
-      },
-      {
-        id: 4,
-        nama_regional: 'REGIONAL JMB',
-        id_uid: 427,
-        nama_uid: 'DISTRIBUSI JAWA BARAT',
-        id_up3: 542,
-        nama_up3: 'UP3 MAJALAYA',
-        id_ulp: 53531,
-        nama_ulp: 'ULP MAJALAYA',
-        id_posko: 535311,
-        nama_posko: 'POSKO ULP MAJALAYA',
-        total: 4,
-        total_selesai: 4,
-        persen_selesai: 100,
-        total_inproses: 0,
-        persen_inproses: 0,
-        total_rating: null,
-        persen_rating: null,
-        nilai_rating1: 0,
-        nilai_rating2: 0,
-        nilai_rating3: 0,
-        nilai_rating4: 0,
-        nilai_rating5: 0,
-        indeks_rating: null,
-        total_nonrating: null,
-        persen_nonrating: null
-      },
-      {
-        id: 5,
-        nama_regional: 'REGIONAL SUMKAL',
-        id_uid: 120,
-        nama_uid: 'WILAYAH SUMATERA UTARA',
-        id_up3: 12100,
-        nama_up3: 'UP3 PEMATANG SIANTAR',
-        id_ulp: 12115,
-        nama_ulp: 'ULP PEMATANG RAYA',
-        id_posko: 121155,
-        nama_posko: 'POSKO ULP PEMATANG RAYA',
-        total: 1,
-        total_selesai: 1,
+        id: 17,
+        nama_regional: 'REGIONAL SULMAPANA',
+        id_uid: 31,
+        nama_uid: 'WILAYAH SULAWESI UTARA,TENGAH DAN GORONTALO',
+        id_up3: 31700,
+        nama_up3: 'UP3 KOTAMOBAGU',
+        id_ulp: 31710,
+        nama_ulp: 'ULP IMANDI',
+        id_posko: 317101,
+        kode_regu: 'MIKE',
+        nama_regu: 'MIKE',
+        nama_posko: 'POSKO ULP IMANDI',
+        total: 3,
+        total_selesai: 3,
         persen_selesai: 100,
         total_inproses: 0,
         persen_inproses: 0,
         total_rating: 1,
-        persen_rating: 100,
+        persen_rating: 33.33333333333333,
         nilai_rating1: 0,
         nilai_rating2: 0,
         nilai_rating3: 0,
         nilai_rating4: 0,
         nilai_rating5: 1,
         indeks_rating: 1,
-        total_nonrating: 0,
-        persen_nonrating: 0
+        total_nonrating: 2,
+        persen_nonrating: 66.66666666666666
       },
       {
-        id: 6,
-        nama_regional: 'REGIONAL SUMKAL',
-        id_uid: 171,
-        nama_uid: 'DISTRIBUSI LAMPUNG',
-        id_up3: 17172,
-        nama_up3: 'UP3 METRO',
-        id_ulp: 17210,
-        nama_ulp: 'ULP SRIBAWONO',
-        id_posko: 172101,
-        nama_posko: 'POSKO ULP SRIBAWONO',
-        total: 18,
-        total_selesai: 18,
-        persen_selesai: 100,
-        total_inproses: 0,
-        persen_inproses: 0,
-        total_rating: 12,
-        persen_rating: 66.66666666666666,
-        nilai_rating1: 0,
-        nilai_rating2: 0,
-        nilai_rating3: 0,
-        nilai_rating4: 0,
-        nilai_rating5: 12,
-        indeks_rating: 1,
-        total_nonrating: 6,
-        persen_nonrating: 33.33333333333333
-      },
-      {
-        id: 7,
+        id: 18,
         nama_regional: 'REGIONAL JMB',
-        id_uid: 101,
-        nama_uid: 'DISTRIBUSI JAWA TENGAH & DIY',
-        id_up3: 52200,
-        nama_up3: 'UP3 PURWOKERTO',
-        id_ulp: 52205,
-        nama_ulp: 'ULP WONOSOBO',
-        id_posko: 522051,
-        nama_posko: 'POSKO ULP WONOSOBO',
-        total: 23,
-        total_selesai: 23,
+        id_uid: 103,
+        nama_uid: 'DISTRIBUSI JAWA TIMUR',
+        id_up3: 143,
+        nama_up3: 'UP3 BOJONEGORO',
+        id_ulp: 51808,
+        nama_ulp: 'ULP SUMBER REJO',
+        id_posko: 518088,
+        kode_regu: 'SUMBERREJO14',
+        nama_regu: 'SUMBERREJO14',
+        nama_posko: 'POSKO ULP SUMBER REJO',
+        total: 12,
+        total_selesai: 12,
         persen_selesai: 100,
         total_inproses: 0,
         persen_inproses: 0,
-        total_rating: 22,
-        persen_rating: 95.65217391304348,
+        total_rating: null,
+        persen_rating: null,
         nilai_rating1: 0,
         nilai_rating2: 0,
         nilai_rating3: 0,
         nilai_rating4: 0,
-        nilai_rating5: 22,
-        indeks_rating: 1,
-        total_nonrating: 1,
-        persen_nonrating: 4.3478260869565215
+        nilai_rating5: 0,
+        indeks_rating: null,
+        total_nonrating: null,
+        persen_nonrating: null
       },
       {
-        id: 8,
-        nama_regional: 'REGIONAL SUMKAL',
-        id_uid: 120,
-        nama_uid: 'WILAYAH SUMATERA UTARA',
-        id_up3: 12500,
-        nama_up3: 'UP3 RANTAU PRAPAT',
-        id_ulp: 12513,
-        nama_ulp: 'ULP LABUHAN BILIK',
-        id_posko: 125133,
-        nama_posko: 'POSKO ULP LABUHAN BILIK',
+        id: 19,
+        nama_regional: 'REGIONAL SULMAPANA',
+        id_uid: 42,
+        nama_uid: 'WILAYAH PAPUA DAN PAPUA BARAT',
+        id_up3: 426,
+        nama_up3: 'UP3 TIMIKA',
+        id_ulp: 42610,
+        nama_ulp: 'ULP TIMIKA KOTA',
+        id_posko: 426101,
+        kode_regu: 'TIMIKA21',
+        nama_regu: 'TIMIKA21',
+        nama_posko: 'POSKO ULP TIMIKA KOTA',
+        total: 5,
+        total_selesai: 5,
+        persen_selesai: 100,
+        total_inproses: 0,
+        persen_inproses: 0,
+        total_rating: null,
+        persen_rating: null,
+        nilai_rating1: 0,
+        nilai_rating2: 0,
+        nilai_rating3: 0,
+        nilai_rating4: 0,
+        nilai_rating5: 0,
+        indeks_rating: null,
+        total_nonrating: null,
+        persen_nonrating: null
+      },
+      {
+        id: 20,
+        nama_regional: 'REGIONAL JMB',
+        id_uid: 103,
+        nama_uid: 'DISTRIBUSI JAWA TIMUR',
+        id_up3: 156,
+        nama_up3: 'UP3 SURABAYA SELATAN',
+        id_ulp: 51146,
+        nama_ulp: 'ULP GEDANGAN',
+        id_posko: 511465,
+        kode_regu: 'SDA KOTA 17',
+        nama_regu: 'SDA KOTA 17',
+        nama_posko: 'POSKO ULP GEDANGAN',
         total: 1,
         total_selesai: 1,
         persen_selesai: 100,
@@ -1038,7 +938,7 @@ onMounted(() => {
         persen_nonrating: null
       },
       {
-        id: 9,
+        id: 21,
         nama_regional: 'REGIONAL JMB',
         id_uid: 103,
         nama_uid: 'DISTRIBUSI JAWA TIMUR',
@@ -1047,166 +947,33 @@ onMounted(() => {
         id_ulp: 51730,
         nama_ulp: 'ULP BANGKALAN',
         id_posko: 517304,
+        kode_regu: 'BKLN.MS2',
+        nama_regu: 'BKLN.MS2',
         nama_posko: 'POSKO ULP BANGKALAN',
-        total: 32,
-        total_selesai: 32,
+        total: 23,
+        total_selesai: 23,
         persen_selesai: 100,
         total_inproses: 0,
         persen_inproses: 0,
-        total_rating: 3,
-        persen_rating: 9.375,
+        total_rating: 15,
+        persen_rating: 65.21739130434783,
         nilai_rating1: 0,
         nilai_rating2: 0,
         nilai_rating3: 0,
         nilai_rating4: 0,
-        nilai_rating5: 3,
+        nilai_rating5: 15,
         indeks_rating: 1,
-        total_nonrating: 29,
-        persen_nonrating: 90.625
-      },
-      {
-        id: 10,
-        nama_regional: 'REGIONAL SUMKAL',
-        id_uid: 180,
-        nama_uid: 'WILAYAH RIAU DAN KEPULAUAN RIAU',
-        id_up3: 181,
-        nama_up3: 'UP3 PEKANBARU',
-        id_ulp: 18111,
-        nama_ulp: 'ULP PEKANBARU KOTA BARAT',
-        id_posko: 181111,
-        nama_posko: 'POSKO ULP PEKANBARU KOTA BARAT',
-        total: 109,
-        total_selesai: 109,
-        persen_selesai: 100,
-        total_inproses: 0,
-        persen_inproses: 0,
-        total_rating: null,
-        persen_rating: null,
-        nilai_rating1: 0,
-        nilai_rating2: 0,
-        nilai_rating3: 0,
-        nilai_rating4: 0,
-        nilai_rating5: 0,
-        indeks_rating: null,
-        total_nonrating: null,
-        persen_nonrating: null
-      },
-      {
-        id: 11,
-        nama_regional: 'REGIONAL JMB',
-        id_uid: 427,
-        nama_uid: 'DISTRIBUSI JAWA BARAT',
-        id_up3: 536,
-        nama_up3: 'UP3 CIMAHI',
-        id_ulp: 53589,
-        nama_ulp: 'ULP LEMBANG',
-        id_posko: 535891,
-        nama_posko: 'POSKO ULP LEMBANG',
-        total: 17,
-        total_selesai: 17,
-        persen_selesai: 100,
-        total_inproses: 0,
-        persen_inproses: 0,
-        total_rating: 17,
-        persen_rating: 100,
-        nilai_rating1: 0,
-        nilai_rating2: 0,
-        nilai_rating3: 0,
-        nilai_rating4: 0,
-        nilai_rating5: 17,
-        indeks_rating: 1,
-        total_nonrating: 0,
-        persen_nonrating: 0
-      },
-      {
-        id: 12,
-        nama_regional: 'REGIONAL SULMAPANA',
-        id_uid: 32,
-        nama_uid: 'WILAYAH SULAWESI SELATAN, TENGGARA DAN BARAT',
-        id_up3: 32800,
-        nama_up3: 'UP3 BAUBAU',
-        id_ulp: 32820,
-        nama_ulp: 'ULP RAHA',
-        id_posko: 328201,
-        nama_posko: 'POSKO ULP RAHA',
-        total: 3,
-        total_selesai: 3,
-        persen_selesai: 100,
-        total_inproses: 0,
-        persen_inproses: 0,
-        total_rating: null,
-        persen_rating: null,
-        nilai_rating1: 0,
-        nilai_rating2: 0,
-        nilai_rating3: 0,
-        nilai_rating4: 0,
-        nilai_rating5: 0,
-        indeks_rating: null,
-        total_nonrating: null,
-        persen_nonrating: null
-      },
-      {
-        id: 13,
-        nama_regional: 'REGIONAL SULMAPANA',
-        id_uid: 32,
-        nama_uid: 'WILAYAH SULAWESI SELATAN, TENGGARA DAN BARAT',
-        id_up3: 32200,
-        nama_up3: 'UP3 WATAMPONE',
-        id_ulp: 32270,
-        nama_ulp: 'ULP PATANGKAI',
-        id_posko: 322701,
-        nama_posko: 'POSKO ULP PATANGKAI',
-        total: 3,
-        total_selesai: 3,
-        persen_selesai: 100,
-        total_inproses: 0,
-        persen_inproses: 0,
-        total_rating: null,
-        persen_rating: null,
-        nilai_rating1: 0,
-        nilai_rating2: 0,
-        nilai_rating3: 0,
-        nilai_rating4: 0,
-        nilai_rating5: 0,
-        indeks_rating: null,
-        total_nonrating: null,
-        persen_nonrating: null
-      },
-      {
-        id: 14,
-        nama_regional: 'REGIONAL SUMKAL',
-        id_uid: 221,
-        nama_uid: 'WILAYAH KALIMANTAN SELATAN DAN TENGAH',
-        id_up3: 2220,
-        nama_up3: 'UP3 BARABAI',
-        id_ulp: 22250,
-        nama_ulp: 'ULP PARINGIN',
-        id_posko: 222501,
-        nama_posko: 'POSKO ULP PARINGIN',
-        total: 1,
-        total_selesai: 1,
-        persen_selesai: 100,
-        total_inproses: 0,
-        persen_inproses: 0,
-        total_rating: 1,
-        persen_rating: 100,
-        nilai_rating1: 0,
-        nilai_rating2: 0,
-        nilai_rating3: 0,
-        nilai_rating4: 0,
-        nilai_rating5: 1,
-        indeks_rating: 1,
-        total_nonrating: 0,
-        persen_nonrating: 0
+        total_nonrating: 8,
+        persen_nonrating: 34.78260869565217
       }
     ]
-      .sort((a: any, b: any) => a.nama_up3.localeCompare(b.nama_up3))
-      .map((ref: any, index: number) => {
-        return {
-          ...ref,
-          number: index + 1
-        }
-      })
+    // .sort((a: any, b: any) => a.nama_up3.localeCompare(b.nama_up3))
+    // .map((ref: any, index: number) => {
+    //   return {
+    //     ...ref,
+    //     number: index + 1
+    //   }
+    // })
   }
 })
 </script>
diff --git a/src/report/Gangguan/Rekap/RGangguan_RatingPerPosko.ts b/src/report/Gangguan/Rekap/RGangguan_RatingPerPosko.ts
index 978057f..3fa2dc9 100644
--- a/src/report/Gangguan/Rekap/RGangguan_RatingPerPosko.ts
+++ b/src/report/Gangguan/Rekap/RGangguan_RatingPerPosko.ts
@@ -61,7 +61,7 @@ const formatData = (rawData: any) => {
         formatNumber(data[nama_up3][i].nilai_rating3),
         formatNumber(data[nama_up3][i].nilai_rating4),
         formatNumber(data[nama_up3][i].nilai_rating5),
-        formatNumber(data[nama_up3][i].index_rating),
+        formatNumber(data[nama_up3][i].indeks_rating),
         formatNumber(data[nama_up3][i].total_nonrating),
         formatPercentage(data[nama_up3][i].persen_nonrating)
       ])
diff --git a/src/report/Gangguan/Rekap/RGangguan_RatingPerRegu.ts b/src/report/Gangguan/Rekap/RGangguan_RatingPerRegu.ts
new file mode 100644
index 0000000..a7645a1
--- /dev/null
+++ b/src/report/Gangguan/Rekap/RGangguan_RatingPerRegu.ts
@@ -0,0 +1,248 @@
+import { exportDataGrid as exportToExcel } from 'devextreme/excel_exporter'
+import {
+  Document,
+  AlignmentType,
+  Packer,
+  Paragraph,
+  Table,
+  TableCell,
+  TableRow,
+  VerticalAlign,
+  TextRun,
+  WidthType,
+  PageOrientation
+} from 'docx'
+import { saveAs } from 'file-saver'
+import { jsPDF } from 'jspdf'
+import autoTable from 'jspdf-autotable'
+import { Workbook } from 'exceljs'
+import { formatWaktu } from '@/components/Form/FiltersType/reference'
+import { setHeaderStyle } from '@/report/utils/xlsx'
+import { formatNumber, formatPercentage } from '@/utils/numbers'
+
+const reportName = 'Rekapitulasi Rating Per Regu'
+
+const formatData = (rawData: any) => {
+  return rawData.map((item: any, i: any) => {
+    return [
+      { content: ++i, styles: { halign: 'right' } },
+      item.kode_regu,
+      item.nama_regu,
+      formatNumber(item.total),
+      formatNumber(item.total_inproses),
+      formatPercentage(item.persen_inproses),
+      formatNumber(item.total_selesai),
+      formatPercentage(item.persen_selesai),
+      formatNumber(item.total_rating),
+      formatNumber(item.nilai_rating1),
+      formatNumber(item.nilai_rating2),
+      formatNumber(item.nilai_rating3),
+      formatNumber(item.nilai_rating4),
+      formatNumber(item.nilai_rating5),
+      formatNumber(item.indeks_rating),
+      formatNumber(item.total_nonrating),
+      formatPercentage(item.persen_nonrating)
+    ]
+  })
+}
+
+const formatMetaData = (reportMeta: any) => {
+  const periode = reportMeta.periode ? reportMeta.periode.split(' s/d ') : ''
+
+  let dateFromFormat = ''
+  let dateToFormat = ''
+  let dayTo = ''
+
+  if (periode != '') {
+    const dateFrom = new Date(periode[0].split('-').reverse().join('-'))
+    const dateTo = new Date(periode[1].split('-').reverse().join('-'))
+
+    dateFromFormat = `${dateFrom.getDate()}-${dateFrom.toLocaleString('default', {
+      month: 'long'
+    })}-${dateFrom.getFullYear()}`
+
+    dateToFormat = `${dateTo.getDate()}-${dateTo.toLocaleString('default', {
+      month: 'long'
+    })}-${dateTo.getFullYear()}`
+
+    dayTo = dateTo.toLocaleString('default', { weekday: 'long' })
+  }
+
+  return { dateFromFormat, dateToFormat, dayTo }
+}
+
+const exportToPDF = (reportMeta: any, rawData: any, preview: boolean = false) => {
+  const data = formatData(rawData)
+  const meta = formatMetaData(reportMeta)
+  const doc = new jsPDF({
+    orientation: 'landscape'
+  })
+  const fontSize = 5
+
+  autoTable(doc, {
+    head: [
+      ['PT. PLN(Persero)', '', ''],
+      [
+        { content: 'UNIT INDUK', styles: { cellWidth: 40 } },
+        { content: ':', styles: { cellWidth: 1 } },
+        reportMeta.uid
+          ? reportMeta.uid.name.toUpperCase()
+          : 'Semua Unit Induk Distribusi/Wilayah'.toUpperCase()
+      ],
+      [
+        'UNIT PELAKSANA PELAYANAN PELANGGAN',
+        ':',
+        reportMeta.up3
+          ? reportMeta.up3.name.toUpperCase()
+          : 'Semua Unit Pelaksanaan Pelayanan Pelanggan'.toUpperCase()
+      ],
+      [
+        'POSKO',
+        ':',
+        reportMeta.posko ? reportMeta.posko.name.toUpperCase() : 'Semua Posko'.toUpperCase()
+      ]
+    ],
+    styles: {
+      fontSize,
+      cellPadding: 0.1,
+      textColor: [0, 0, 0],
+      fontStyle: 'bold'
+    },
+    theme: 'plain',
+    startY: 10
+  })
+
+  autoTable(doc, {
+    head: [
+      [`${reportName}`.toUpperCase()],
+      [`PERIODE TANGGAL : ${meta.dateFromFormat} SD TGL ${meta.dateToFormat}`]
+    ],
+    styles: {
+      fontSize,
+      cellPadding: 0.1,
+      textColor: [0, 0, 0],
+      fontStyle: 'bold',
+      halign: 'center'
+    },
+    theme: 'plain',
+    startY: 23
+  })
+
+  autoTable(doc, {
+    head: [
+      [
+        {
+          content: 'No',
+          rowSpan: 3
+        },
+        {
+          content: 'Kode',
+          rowSpan: 3
+        },
+        {
+          content: 'Nama Regu',
+          rowSpan: 3
+        },
+        {
+          content: 'Laporan',
+          colSpan: 5
+        },
+        {
+          content: 'Rating',
+          colSpan: 7
+        },
+        {
+          content: 'Non Rating',
+          colSpan: 2
+        }
+      ],
+      [
+        {
+          content: 'Total',
+          rowSpan: 2
+        },
+        {
+          content: 'Belum Selesai',
+          colSpan: 2
+        },
+        {
+          content: 'Sudah Selesai',
+          colSpan: 2
+        },
+        {
+          content: 'Bintang',
+          colSpan: 7
+        },
+        {
+          content: 'Jml',
+          rowSpan: 2
+        },
+        {
+          content: '%',
+          rowSpan: 2
+        }
+      ],
+      ['Jml', '%', 'Jml', '%', 'Jml', '1', '2', '3', '4', '5', 'Index']
+    ],
+    body: data,
+    styles: {
+      fontSize,
+      cellPadding: 1,
+      lineColor: [0, 0, 0],
+      lineWidth: 0.1,
+      cellWidth: 'auto'
+    },
+    rowPageBreak: 'auto',
+    headStyles: {
+      fillColor: [192, 192, 192],
+      textColor: [0, 0, 0],
+      fontStyle: 'bold',
+      cellWidth: 'wrap',
+      halign: 'center',
+      valign: 'middle'
+    },
+    bodyStyles: {
+      textColor: [0, 0, 0]
+    },
+    didParseCell: function (data) {
+      if (data.row.section === 'head') {
+        data.cell.text = data.cell.text.map(function (word: any) {
+          return word.toUpperCase()
+        })
+      }
+    },
+    startY: 30
+  })
+
+  autoTable(doc, {
+    head: [
+      [`${meta.dayTo}, ${meta.dateToFormat}`],
+      [
+        {
+          content: '(.........................................)',
+          styles: { minCellHeight: 8, valign: 'bottom' }
+        }
+      ]
+    ],
+    styles: {
+      fontSize,
+      cellPadding: 0.1,
+      textColor: [0, 0, 0],
+      fontStyle: 'bold',
+      halign: 'center'
+    },
+    theme: 'plain',
+    tableWidth: 50,
+    margin: { left: 230 }
+  })
+
+  if (preview) {
+    window.open(doc.output('bloburl'))
+  } else {
+    doc.save(`Laporan ${reportName}.pdf`, { returnPromise: true }).then(() => {
+      console.log('pdf berhasil disimpan')
+    })
+  }
+}
+
+export { exportToPDF }