Merge branch 'dev-bagus' of https://github.com/defuj/eis into dev-defuj

src/components/Pages/Gangguan/Daftar/DGangguan_MLD1K.vue

@@ -14,7 +14,7 @@
       :hover-state-enabled="true"
       @selection-changed="onSelectionChanged"
       :column-width="100"
-      @exporting=""
+      @exporting="onExporting"
       :allow-column-resizing="true"
       column-resizing-mode="widget"
     >
@@ -323,6 +323,11 @@ import { useQuery } from '@vue/apollo-composable'
 import { queries } from '@/utils/api/api.graphql'
 import { dummyData } from '@/utils/dummy'
 import { formatNumber, isNumber } from '@/utils/numbers'
+import { jsPDF } from 'jspdf'
+import autoTable from 'jspdf-autotable'
+import { exportDataGrid as exportToExcel } from 'devextreme/excel_exporter'
+import { saveAs } from 'file-saver'
+import { Workbook } from 'exceljs'
 
 const position = { of: '#data' }
 const showIndicator = ref(true)
@@ -384,6 +389,76 @@ const filterData = (params: any) => {
   })
 }
 
+const onExporting = (e: any) => {
+  if (e.format === 'pdf') {
+    const doc = new jsPDF({
+      orientation: 'landscape'
+    })
+
+    autoTable(doc, {
+      head: [
+        [
+          'No Laporan',
+          'Tgl Lapor',
+          'Tgl Response',
+          'Tgl Recovery',
+          'Jml Lapor',
+          'Durasi Response Time',
+          'Durasi Recovery Time',
+          'Status',
+          'IDPEL/NO METER',
+          'Nama Pelapor',
+          'Alamat Pelapor',
+          'No Telp Pelapor',
+          'Keterangan Pelapor',
+          'Sumber Lapor',
+          'Posko'
+        ]
+      ],
+      body: data.value.map((item) => [
+        item.no_laporan,
+        item.waktu_lapor,
+        item.waktu_response,
+        item.waktu_recovery,
+        item.jumlah_lapor,
+        item.durasi_response_time,
+        item.durasi_recovery_time,
+        item.status_akhir,
+        item.idpel_nometer,
+        item.nama_pelapor,
+        item.alamat_pelapor,
+        item.no_telp_pelapor,
+        item.keterangan_pelapor,
+        item.media,
+        item.nama_posko
+      ]),
+      styles: {
+        fontSize: 4
+      }
+    })
+
+    doc.save('Daftar Gangguan Melapor Lebih Dari 1 Kali.pdf')
+  } else {
+    const workbook = new Workbook()
+    const worksheet = workbook.addWorksheet('Daftar Gangguan Melapor Lebih Dari 1 Kali')
+
+    exportToExcel({
+      component: e.component,
+      worksheet,
+      autoFilterEnabled: true
+    }).then(() => {
+      workbook.xlsx.writeBuffer().then((buffer: any) => {
+        saveAs(
+          new Blob([buffer], { type: 'application/octet-stream' }),
+          'Daftar Gangguan Melapor Lebih Dari 1 Kali.xlsx'
+        )
+      })
+    })
+
+    e.cancel = true
+  }
+}
+
 onMounted(() => {
   if (import.meta.env.DEV) {
     data.value = dummyData.gangguan.daftar.melaporLebihDariSatuKali

src/components/Pages/Gangguan/Daftar/DGangguan_RecoveryTime.vue

@@ -29,7 +29,7 @@
       :row-alternation-enabled="true"
       :hover-state-enabled="true"
       :column-width="100"
-      @exporting=""
+      @exporting="onExporting"
       :allow-column-resizing="true"
       @selection-changed="onSelectionChanged"
       column-resizing-mode="widget"
@@ -345,6 +345,11 @@ import {
 import { useQuery } from '@vue/apollo-composable'
 import { queries } from '@/utils/api/api.graphql'
 import { dummyData } from '@/utils/dummy'
+import { jsPDF } from 'jspdf'
+import autoTable from 'jspdf-autotable'
+import { exportDataGrid as exportToExcel } from 'devextreme/excel_exporter'
+import { saveAs } from 'file-saver'
+import { Workbook } from 'exceljs'
 
 const position = { of: '#data' }
 const showIndicator = ref(true)
@@ -393,6 +398,74 @@ const filterData = (params: any) => {
   })
 }
 
+const onExporting = (e: any) => {
+  if (e.format === 'pdf') {
+    const doc = new jsPDF({
+      orientation: 'landscape'
+    })
+
+    autoTable(doc, {
+      head: [
+        [
+          'No Laporan',
+          'Tgl Lapor',
+          'Tgl Response',
+          'Tgl Recovery',
+          'Durasi Response Time',
+          'Durasi Recovery Time',
+          'Status',
+          'Referensi Marking',
+          'IDPEL/NO METER',
+          'Nama Pelapor',
+          'Alamat Pelapor',
+          'No Telp Pelapor',
+          'Keterangan Pelapor',
+          'Posko'
+        ]
+      ],
+      body: data.value.map((item) => [
+        item.no_laporan,
+        item.waktu_lapor,
+        item.waktu_response,
+        item.waktu_recovery,
+        item.durasi_response_time,
+        item.durasi_recovery_time,
+        item.status_akhir,
+        item.referensi_marking,
+        item.idpel_nometer,
+        item.nama_pelapor,
+        item.alamat_pelapor,
+        item.no_telp_pelapor,
+        item.keterangan_pelapor,
+        item.nama_posko
+      ]),
+      styles: {
+        fontSize: 4
+      }
+    })
+
+    doc.save('Daftar Gangguan Recovery Time.pdf')
+  } else {
+    const workbook = new Workbook()
+    const worksheet = workbook.addWorksheet('Daftar Gangguan Recovery Time')
+
+    exportToExcel({
+      component: e.component,
+      worksheet,
+      autoFilterEnabled: true
+    }).then(() => {
+      workbook.xlsx.writeBuffer().then((buffer: any) => {
+        saveAs(
+          new Blob([buffer], { type: 'application/octet-stream' }),
+          'Daftar Gangguan Recovery Time.xlsx'
+        )
+      })
+    })
+
+    e.cancel = true
+  }
+}
+
 const { onResult, onError, loading, refetch } = useQuery(queries.gangguan.daftar.recoveryTime, {
   dateFrom: new Date().toISOString().slice(0, 10),
   dateTo: new Date().toISOString().slice(0, 10),

src/components/Pages/Gangguan/Daftar/DGangguan_ResponseTime.vue

@@ -14,7 +14,7 @@
       :hover-state-enabled="true"
       @selection-changed="onSelectionChanged"
       :column-width="100"
-      @exporting=""
+      @exporting="onExporting"
       :allow-column-resizing="true"
       column-resizing-mode="widget"
     >
@@ -322,6 +322,11 @@ import InputText from '@/components/InputText.vue'
 import { useQuery } from '@vue/apollo-composable'
 import { queries } from '@/utils/api/api.graphql'
 import { dummyData } from '@/utils/dummy'
+import { jsPDF } from 'jspdf'
+import autoTable from 'jspdf-autotable'
+import { exportDataGrid as exportToExcel } from 'devextreme/excel_exporter'
+import { saveAs } from 'file-saver'
+import { Workbook } from 'exceljs'
 
 const position = { of: '#data' }
 const showIndicator = ref(true)
@@ -378,6 +383,74 @@ const { onResult, onError, loading, refetch } = useQuery(queries.gangguan.daftar
   idUp3: 0
 })
 
+const onExporting = (e: any) => {
+  if (e.format === 'pdf') {
+    const doc = new jsPDF({
+      orientation: 'landscape'
+    })
+
+    autoTable(doc, {
+      head: [
+        [
+          'No Laporan',
+          'Tgl Lapor',
+          'Tgl Response',
+          'Tgl Recovery',
+          'Durasi Response Time',
+          'Durasi Recovery Time',
+          'Status',
+          'Referensi Marking',
+          'IDPEL/NO METER',
+          'Nama Pelapor',
+          'Alamat Pelapor',
+          'No Telp Pelapor',
+          'Keterangan Pelapor',
+          'Posko'
+        ]
+      ],
+      body: data.value.map((item) => [
+        item.no_laporan,
+        item.waktu_lapor,
+        item.waktu_response,
+        item.waktu_recovery,
+        item.durasi_response_time,
+        item.durasi_recovery_time,
+        item.status_akhir,
+        item.referensi_marking,
+        item.idpel_nometer,
+        item.nama_pelapor,
+        item.alamat_pelapor,
+        item.no_telp_pelapor,
+        item.keterangan_pelapor,
+        item.nama_posko
+      ]),
+      styles: {
+        fontSize: 4
+      }
+    })
+
+    doc.save('Daftar Gangguan Response Time.pdf')
+  } else {
+    const workbook = new Workbook()
+    const worksheet = workbook.addWorksheet('Daftar Gangguan Response Time')
+
+    exportToExcel({
+      component: e.component,
+      worksheet,
+      autoFilterEnabled: true
+    }).then(() => {
+      workbook.xlsx.writeBuffer().then((buffer: any) => {
+        saveAs(
+          new Blob([buffer], { type: 'application/octet-stream' }),
+          'Daftar Gangguan Response Time.xlsx'
+        )
+      })
+    })
+
+    e.cancel = true
+  }
+}
+
 const filters = ref()
 onMounted(() => {
   if (import.meta.env.DEV) {

src/components/Pages/Gangguan/Daftar/DGangguan_STIDP.vue

@@ -14,7 +14,7 @@
       :hover-state-enabled="true"
       @selection-changed=""
       :column-width="100"
-      @exporting=""
+      @exporting="onExporting"
       :allow-column-resizing="true"
       column-resizing-mode="widget"
     >
@@ -204,6 +204,11 @@ import {
 import { useQuery } from '@vue/apollo-composable'
 import { queries } from '@/utils/api/api.graphql'
 import { dummyData } from '@/utils/dummy'
+import { jsPDF } from 'jspdf'
+import autoTable from 'jspdf-autotable'
+import { exportDataGrid as exportToExcel } from 'devextreme/excel_exporter'
+import { saveAs } from 'file-saver'
+import { Workbook } from 'exceljs'
 
 const position = { of: '#data' }
 const showIndicator = ref(true)
@@ -249,6 +254,74 @@ const filterData = (params: any) => {
   })
 }
 
+const onExporting = (e: any) => {
+  if (e.format === 'pdf') {
+    const doc = new jsPDF({
+      orientation: 'landscape'
+    })
+
+    autoTable(doc, {
+      head: [
+        [
+          'No Laporan',
+          'Tgl Lapor',
+          'Tgl Response',
+          'Tgl Recovery',
+          'Durasi Response Time',
+          'Durasi Recovery Time',
+          'Status',
+          'IDPEL/NO METER',
+          'Nama Pelapor',
+          'Alamat Pelapor',
+          'No Telp Pelapor',
+          'Keterangan Pelapor',
+          'Sumber Lapor',
+          'Posko'
+        ]
+      ],
+      body: data.value.map((item) => [
+        item.no_laporan,
+        item.waktu_lapor,
+        item.waktu_response,
+        item.waktu_recovery,
+        item.durasi_response_time,
+        item.durasi_recovery_time,
+        item.status_akhir,
+        item.idpel_nometer,
+        item.nama_pelapor,
+        item.alamat_pelapor,
+        item.no_telp_pelapor,
+        item.keterangan_pelapor,
+        item.media,
+        item.nama_posko
+      ]),
+      styles: {
+        fontSize: 4
+      }
+    })
+
+    doc.save('Daftar Gangguan Selesai Tanpa ID Pelanggan.pdf')
+  } else {
+    const workbook = new Workbook()
+    const worksheet = workbook.addWorksheet('Daftar Gangguan Selesai Tanpa ID Pelanggan')
+
+    exportToExcel({
+      component: e.component,
+      worksheet,
+      autoFilterEnabled: true
+    }).then(() => {
+      workbook.xlsx.writeBuffer().then((buffer: any) => {
+        saveAs(
+          new Blob([buffer], { type: 'application/octet-stream' }),
+          'Daftar Gangguan Selesai Tanpa ID Pelanggan.xlsx'
+        )
+      })
+    })
+
+    e.cancel = true
+  }
+}
+
 const filters = ref()
 onMounted(() => {
   if (import.meta.env.DEV) {

src/components/Pages/Keluhan/Daftar/DKeluhan_BerdasarMedia.vue

@@ -308,13 +308,13 @@ import {
   DxSelection
 } from 'devextreme-vue/data-grid'
 import { jsPDF } from 'jspdf'
-import { exportDataGrid as exportToPdf } from 'devextreme/pdf_exporter'
 import { exportDataGrid as exportToExcel } from 'devextreme/excel_exporter'
 import { saveAs } from 'file-saver'
 import { Workbook } from 'exceljs'
 import { useQuery } from '@vue/apollo-composable'
 import { queries } from '@/utils/api/api.graphql'
 import { dummyData } from '@/utils/dummy'
+import autoTable from 'jspdf-autotable'
 
 const position = { of: '#data' }
 const showIndicator = ref(true)
@@ -338,18 +338,54 @@ const onSelectionChanged = ({ selectedRowsData }: any) => {
 
 const onExporting = (e: any) => {
   if (e.format === 'pdf') {
-    const doc = new jsPDF()
+    const doc = new jsPDF({
-
+      orientation: 'landscape'
-    exportToPdf({
-      jsPDFDocument: doc,
-      component: e.component,
-      indent: 5
-    }).then(() => {
-      doc.save(`.pdf`)
     })
+
+    autoTable(doc, {
+      head: [
+        [
+          'No Laporan',
+          'Nama Pelapor',
+          'Alamat Pelapor',
+          'No Telp Pelapor',
+          'Keterangan Pelapor',
+          'Status',
+          'Tgl Lapor',
+          'Tgl Response',
+          'Tgl Recovery',
+          'Response Time',
+          'Recovery Time',
+          'Sumber Lapor',
+          'Tgl Media',
+          'Keterangan Media'
+        ]
+      ],
+      body: data.value.map((item) => [
+        item.no_laporan,
+        item.nama_pelapor,
+        item.alamat_pelapor,
+        item.no_telp_pelapor,
+        item.keterangan_pelapor,
+        item.status_akhir,
+        item.waktu_lapor,
+        item.waktu_response,
+        item.waktu_recovery,
+        parseInt(item.durasi_response_time) ? formatWaktu(item.durasi_response_time) : '-',
+        parseInt(item.durasi_recovery_time) ? formatWaktu(item.durasi_recovery_time) : '-',
+        item.media,
+        item.waktu_media,
+        item.keterangan_media
+      ]),
+      styles: {
+        fontSize: 4
+      }
+    })
+
+    doc.save('Daftar Keluhan Berdasarkan Media.pdf')
   } else {
     const workbook = new Workbook()
-    const worksheet = workbook.addWorksheet('Employees')
+    const worksheet = workbook.addWorksheet('Daftar Keluhan Berdasarkan Media')
 
     exportToExcel({
       component: e.component,
@@ -357,7 +393,10 @@ const onExporting = (e: any) => {
       autoFilterEnabled: true
     }).then(() => {
       workbook.xlsx.writeBuffer().then((buffer: any) => {
-        saveAs(new Blob([buffer], { type: 'application/octet-stream' }), 'DataGrid.xlsx')
+        saveAs(
+          new Blob([buffer], { type: 'application/octet-stream' }),
+          'Daftar Keluhan Berdasarkan Media.xlsx'
+        )
       })
     })
 

src/components/Pages/Keluhan/Daftar/DKeluhan_DKUL.vue

@@ -220,8 +220,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'
@@ -229,6 +227,8 @@ import { useQuery } from '@vue/apollo-composable'
 import { queries } from '@/utils/api/api.graphql'
 import { dummyData } from '@/utils/dummy'
 import { formatNumber, formatPercentage, isNumber } from '@/utils/numbers'
+import { jsPDF } from 'jspdf'
+import autoTable from 'jspdf-autotable'
 
 const position = { of: '#data' }
 const showIndicator = ref(true)
@@ -237,18 +237,56 @@ const showPane = ref(true)
 
 const onExporting = (e: any) => {
   if (e.format === 'pdf') {
-    const doc = new jsPDF()
+    const doc = new jsPDF({
-
+      orientation: 'landscape'
-    exportToPdf({
-      jsPDFDocument: doc,
-      component: e.component,
-      indent: 5
-    }).then(() => {
-      doc.save(`.pdf`)
     })
+
+    autoTable(doc, {
+      head: [
+        [
+          'No Laporan',
+          'Pembuat Laporan',
+          'Tgl Lapor',
+          'Tgl Dialihkan',
+          'Tgl Response',
+          'Tgl Recovery',
+          'Durasi Response Time',
+          'Durasi Recovery Time',
+          'Unit Asal',
+          'Status',
+          'IDPEL/NO METER',
+          'Nama Pelapor',
+          'Alamat Pelapor',
+          'No Telp Pelapor',
+          'Keterangan Pelapor'
+        ]
+      ],
+      body: data.value.map((item: any) => [
+        item.no_laporan,
+        item.pembuat_laporan,
+        item.waktu_lapor,
+        item.waktu_dialihkan,
+        item.waktu_response,
+        item.waktu_recovery,
+        item.durasi_response_time,
+        item.durasi_recovery_time,
+        item.nama_unit_lama,
+        item.status_akhir,
+        item.idpel_nometer,
+        item.nama_pelapor,
+        item.alamat_pelapor,
+        item.no_telp_pelapor,
+        item.keterangan_pelapor
+      ]),
+      styles: {
+        fontSize: 4
+      }
+    })
+
+    doc.save('Daftar Keluhan Dialihkan Ke Unit Lain.pdf')
   } else {
     const workbook = new Workbook()
-    const worksheet = workbook.addWorksheet('Employees')
+    const worksheet = workbook.addWorksheet('Daftar Keluhan Dialihkan Ke Unit Lain')
 
     exportToExcel({
       component: e.component,
@@ -256,7 +294,10 @@ const onExporting = (e: any) => {
       autoFilterEnabled: true
     }).then(() => {
       workbook.xlsx.writeBuffer().then((buffer: any) => {
-        saveAs(new Blob([buffer], { type: 'application/octet-stream' }), 'DataGrid.xlsx')
+        saveAs(
+          new Blob([buffer], { type: 'application/octet-stream' }),
+          'Daftar Keluhan Dialihkan Ke Unit Lain.xlsx'
+        )
       })
     })
 

src/components/Pages/Keluhan/Daftar/DKeluhan_PLD1K.vue

@@ -332,7 +332,6 @@ import {
   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'
@@ -340,6 +339,7 @@ import { useQuery } from '@vue/apollo-composable'
 import { queries } from '@/utils/api/api.graphql'
 import { dummyData } from '@/utils/dummy'
 import { formatNumber, formatPercentage, isNumber } from '@/utils/numbers'
+import autoTable from 'jspdf-autotable'
 
 const position = { of: '#data' }
 const showIndicator = ref(true)
@@ -363,18 +363,56 @@ const onSelectionChanged = ({ selectedRowsData }: any) => {
 
 const onExporting = (e: any) => {
   if (e.format === 'pdf') {
-    const doc = new jsPDF()
+    const doc = new jsPDF({
-
+      orientation: 'landscape'
-    exportToPdf({
-      jsPDFDocument: doc,
-      component: e.component,
-      indent: 5
-    }).then(() => {
-      doc.save(`.pdf`)
     })
+
+    autoTable(doc, {
+      head: [
+        [
+          'No Laporan',
+          'Tgl Lapor',
+          'Tgl Response',
+          'Tgl Recovery',
+          'Jml Lapor',
+          'Durasi Response Time',
+          'Durasi Recovery Time',
+          'Status',
+          'IDPEL/NO METER',
+          'Nama Pelapor',
+          'Alamat Pelapor',
+          'No Telp Pelapor',
+          'Keterangan Pelapor',
+          'Sumber Lapor',
+          'Nama ULP'
+        ]
+      ],
+      body: data.value.map((item: any) => [
+        item.no_laporan,
+        item.waktu_lapor,
+        item.waktu_response,
+        item.waktu_recovery,
+        item.jumlah_lapor,
+        item.durasi_response_time,
+        item.durasi_recovery_time,
+        item.status_akhir,
+        item.idpel_nometer,
+        item.nama_pelapor,
+        item.alamat_pelapor,
+        item.no_telp_pelapor,
+        item.keterangan_pelapor,
+        item.media,
+        item.nama_ulp
+      ]),
+      styles: {
+        fontSize: 4
+      }
+    })
+
+    doc.save('Daftar Keluhan Pelanggan Lebih Dari 1 Kali.pdf')
   } else {
     const workbook = new Workbook()
-    const worksheet = workbook.addWorksheet('Employees')
+    const worksheet = workbook.addWorksheet('Daftar Keluhan Pelanggan Lebih Dari 1 Kali')
 
     exportToExcel({
       component: e.component,
@@ -382,7 +420,10 @@ const onExporting = (e: any) => {
       autoFilterEnabled: true
     }).then(() => {
       workbook.xlsx.writeBuffer().then((buffer: any) => {
-        saveAs(new Blob([buffer], { type: 'application/octet-stream' }), 'DataGrid.xlsx')
+        saveAs(
+          new Blob([buffer], { type: 'application/octet-stream' }),
+          'Daftar Keluhan Pelanggan Lebih Dari 1 Kali.xlsx'
+        )
       })
     })
 

src/components/Pages/Keluhan/Daftar/DKeluhan_RecoveryTime.vue

@@ -294,13 +294,13 @@ import {
   DxSelection
 } from 'devextreme-vue/data-grid'
 import { jsPDF } from 'jspdf'
-import { exportDataGrid as exportToPdf } from 'devextreme/pdf_exporter'
 import { exportDataGrid as exportToExcel } from 'devextreme/excel_exporter'
 import { saveAs } from 'file-saver'
 import { Workbook } from 'exceljs'
 import { useQuery } from '@vue/apollo-composable'
 import { queries } from '@/utils/api/api.graphql'
 import { dummyData } from '@/utils/dummy'
+import autoTable from 'jspdf-autotable'
 
 const position = { of: '#data' }
 const showIndicator = ref(true)
@@ -324,18 +324,52 @@ const onSelectionChanged = ({ selectedRowsData }: any) => {
 
 const onExporting = (e: any) => {
   if (e.format === 'pdf') {
-    const doc = new jsPDF()
+    const doc = new jsPDF({
-
+      orientation: 'landscape'
-    exportToPdf({
-      jsPDFDocument: doc,
-      component: e.component,
-      indent: 5
-    }).then(() => {
-      doc.save(`.pdf`)
     })
+
+    autoTable(doc, {
+      head: [
+        [
+          'No Laporan',
+          'Tgl Lapor',
+          'Tgl Response',
+          'Tgl Recovery',
+          'Durasi Response Time',
+          'Durasi Recovery Time',
+          'Status',
+          'IDPEL/NO METER',
+          'Nama Pelapor',
+          'Alamat Pelapor',
+          'No Telp Pelapor',
+          'Keterangan Pelapor',
+          'Nama ULP'
+        ]
+      ],
+      body: data.value.map((i) => [
+        i.no_laporan,
+        i.waktu_lapor,
+        i.waktu_response,
+        i.waktu_recovery,
+        parseInt(i.durasi_response_time) ? formatWaktu(i.durasi_response_time) : '-',
+        parseInt(i.durasi_recovery_time) ? formatWaktu(i.durasi_recovery_time) : '-',
+        i.status_akhir,
+        i.idpel_nometer,
+        i.nama_pelapor,
+        i.alamat_pelapor,
+        i.no_telp_pelapor,
+        i.keterangan_pelapor,
+        i.nama_ulp
+      ]),
+      styles: {
+        fontSize: 4
+      }
+    })
+
+    doc.save('Daftar Keluhan Recovery Time.pdf')
   } else {
     const workbook = new Workbook()
-    const worksheet = workbook.addWorksheet('Employees')
+    const worksheet = workbook.addWorksheet('Daftar Keluhan Recovery Time')
 
     exportToExcel({
       component: e.component,
@@ -343,7 +377,10 @@ const onExporting = (e: any) => {
       autoFilterEnabled: true
     }).then(() => {
       workbook.xlsx.writeBuffer().then((buffer: any) => {
-        saveAs(new Blob([buffer], { type: 'application/octet-stream' }), 'DataGrid.xlsx')
+        saveAs(
+          new Blob([buffer], { type: 'application/octet-stream' }),
+          'Daftar Keluhan Recovery Time.xlsx'
+        )
       })
     })
 

src/components/Pages/Keluhan/Daftar/DKeluhan_ResponseTime.vue

@@ -312,7 +312,6 @@ import {
   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'
@@ -320,6 +319,7 @@ import { useQuery } from '@vue/apollo-composable'
 import { queries } from '@/utils/api/api.graphql'
 import { dummyData } from '@/utils/dummy'
 import { formatNumber, formatPercentage, isNumber } from '@/utils/numbers'
+import autoTable from 'jspdf-autotable'
 
 const position = { of: '#data' }
 const showIndicator = ref(true)
@@ -343,18 +343,52 @@ const onSelectionChanged = ({ selectedRowsData }: any) => {
 
 const onExporting = (e: any) => {
   if (e.format === 'pdf') {
-    const doc = new jsPDF()
+    const doc = new jsPDF({
-
+      orientation: 'landscape'
-    exportToPdf({
-      jsPDFDocument: doc,
-      component: e.component,
-      indent: 5
-    }).then(() => {
-      doc.save(`.pdf`)
     })
+
+    autoTable(doc, {
+      head: [
+        [
+          'No Laporan',
+          'Tgl Lapor',
+          'Tgl Response',
+          'Tgl Recovery',
+          'Durasi Response Time',
+          'Durasi Recovery Time',
+          'Status',
+          'IDPEL/NO METER',
+          'Nama Pelapor',
+          'Alamat Pelapor',
+          'No Telp Pelapor',
+          'Keterangan Pelapor',
+          'Nama ULP'
+        ]
+      ],
+      body: data.value.map((item: any) => [
+        item.no_laporan,
+        item.waktu_lapor,
+        item.waktu_response,
+        item.waktu_recovery,
+        item.durasi_response_time,
+        item.durasi_recovery_time,
+        item.status_akhir,
+        item.idpel_nometer,
+        item.nama_pelapor,
+        item.alamat_pelapor,
+        item.no_telp_pelapor,
+        item.keterangan_pelapor,
+        item.nama_ulp
+      ]),
+      styles: {
+        fontSize: 4
+      }
+    })
+
+    doc.save('Daftar Keluhan Response Time.pdf')
   } else {
     const workbook = new Workbook()
-    const worksheet = workbook.addWorksheet('Employees')
+    const worksheet = workbook.addWorksheet('Daftar Keluhan Response Time')
 
     exportToExcel({
       component: e.component,
@@ -362,7 +396,10 @@ const onExporting = (e: any) => {
       autoFilterEnabled: true
     }).then(() => {
       workbook.xlsx.writeBuffer().then((buffer: any) => {
-        saveAs(new Blob([buffer], { type: 'application/octet-stream' }), 'DataGrid.xlsx')
+        saveAs(
+          new Blob([buffer], { type: 'application/octet-stream' }),
+          'Daftar Keluhan Response Time.xlsx'
+        )
       })
     })
 

src/components/Pages/Keluhan/Daftar/DKeluhan_STIDP.vue

@@ -301,13 +301,13 @@ import {
   DxSelection
 } from 'devextreme-vue/data-grid'
 import { jsPDF } from 'jspdf'
-import { exportDataGrid as exportToPdf } from 'devextreme/pdf_exporter'
 import { exportDataGrid as exportToExcel } from 'devextreme/excel_exporter'
 import { saveAs } from 'file-saver'
 import { Workbook } from 'exceljs'
 import { useQuery } from '@vue/apollo-composable'
 import { queries } from '@/utils/api/api.graphql'
 import { dummyData } from '@/utils/dummy'
+import autoTable from 'jspdf-autotable'
 
 const position = { of: '#data' }
 const showIndicator = ref(true)
@@ -331,18 +331,54 @@ const onSelectionChanged = ({ selectedRowsData }: any) => {
 
 const onExporting = (e: any) => {
   if (e.format === 'pdf') {
-    const doc = new jsPDF()
+    const doc = new jsPDF({
-
+      orientation: 'landscape'
-    exportToPdf({
-      jsPDFDocument: doc,
-      component: e.component,
-      indent: 5
-    }).then(() => {
-      doc.save(`.pdf`)
     })
+
+    autoTable(doc, {
+      head: [
+        [
+          'No Laporan',
+          'Tgl Lapor',
+          'Tgl Response',
+          'Tgl Recovery',
+          'Durasi Response Time',
+          'Durasi Recovery Time',
+          'Status',
+          'IDPEL/NO METER',
+          'Nama Pelapor',
+          'Alamat Pelapor',
+          'No Telp Pelapor',
+          'Keterangan Pelapor',
+          'Sumber Lapor',
+          'Nama ULP'
+        ]
+      ],
+      body: data.value.map((item: any) => [
+        item.no_laporan,
+        item.waktu_lapor,
+        item.waktu_response,
+        item.waktu_recovery,
+        parseInt(item.durasi_response_time) ? formatWaktu(item.durasi_response_time) : '-',
+        parseInt(item.durasi_recovery_time) ? formatWaktu(item.durasi_recovery_time) : '-',
+        item.status_akhir,
+        item.idpel_nometer,
+        item.nama_pelapor,
+        item.alamat_pelapor,
+        item.no_telp_pelapor,
+        item.keterangan_pelapor,
+        item.media,
+        item.nama_ulp
+      ]),
+      styles: {
+        fontSize: 4
+      }
+    })
+
+    doc.save('Daftar Keluhan Selesai Tanpa ID Pelanggan.pdf')
   } else {
     const workbook = new Workbook()
-    const worksheet = workbook.addWorksheet('Employees')
+    const worksheet = workbook.addWorksheet('Daftar Keluhan Selesai Tanpa ID Pelanggan')
 
     exportToExcel({
       component: e.component,
@@ -350,7 +386,10 @@ const onExporting = (e: any) => {
       autoFilterEnabled: true
     }).then(() => {
       workbook.xlsx.writeBuffer().then((buffer: any) => {
-        saveAs(new Blob([buffer], { type: 'application/octet-stream' }), 'DataGrid.xlsx')
+        saveAs(
+          new Blob([buffer], { type: 'application/octet-stream' }),
+          'Daftar Keluhan Selesai Tanpa ID Pelanggan.xlsx'
+        )
       })
     })
 

src/components/Pages/Keluhan/Daftar/DKeluhan_SelesaiCC.vue

@@ -209,32 +209,73 @@ import {
   DxSelection
 } from 'devextreme-vue/data-grid'
 import { jsPDF } from 'jspdf'
-import { exportDataGrid as exportToPdf } from 'devextreme/pdf_exporter'
 import { exportDataGrid as exportToExcel } from 'devextreme/excel_exporter'
 import { saveAs } from 'file-saver'
 import { Workbook } from 'exceljs'
 import { useQuery } from '@vue/apollo-composable'
 import { queries } from '@/utils/api/api.graphql'
 import { dummyData } from '@/utils/dummy'
+import autoTable from 'jspdf-autotable'
 
 const position = { of: '#data' }
 const showIndicator = ref(true)
 const shading = ref(true)
 const showPane = ref(true)
+
 const onExporting = (e: any) => {
   if (e.format === 'pdf') {
-    const doc = new jsPDF()
+    const doc = new jsPDF({
-
+      orientation: 'landscape'
-    exportToPdf({
-      jsPDFDocument: doc,
-      component: e.component,
-      indent: 5
-    }).then(() => {
-      doc.save(`.pdf`)
     })
+
+    autoTable(doc, {
+      head: [
+        [
+          'No Laporan',
+          'Contact Center',
+          'UI Dist.',
+          'ULP',
+          'IDPEL/NO METER',
+          'Nama Pelapor',
+          'Alamat Pelapor',
+          'No Tlp Pelapor',
+          'Keterangan Pelapor',
+          'APKT Status',
+          'Created By',
+          'Tgl Penyelesaian',
+          'Lapor Ulang',
+          'Sumber Lapor',
+          'Issue Type',
+          'Sub Issue Type'
+        ]
+      ],
+      body: data.value.map((item: any) => [
+        item.no_laporan,
+        item.nama_ulp,
+        item.nama_uid,
+        item.nama_ulp,
+        item.idpel_nometer,
+        item.nama_pelapor,
+        item.alamat_pelapor,
+        item.no_telp_pelapor,
+        item.keterangan_pelapor,
+        item.status_akhir,
+        item.nama_pelapor,
+        item.waktu_recovery,
+        item.jumlah_lapor,
+        item.media,
+        item.nama_issuetype,
+        item.nama_subissuetype
+      ]),
+      styles: {
+        fontSize: 4
+      }
+    })
+
+    doc.save('Daftar Keluhan Selesai di Contact Center.pdf')
   } else {
     const workbook = new Workbook()
-    const worksheet = workbook.addWorksheet('Employees')
+    const worksheet = workbook.addWorksheet('Daftar Keluhan Selesai di Contact Center')
 
     exportToExcel({
       component: e.component,
@@ -242,7 +283,10 @@ const onExporting = (e: any) => {
       autoFilterEnabled: true
     }).then(() => {
       workbook.xlsx.writeBuffer().then((buffer: any) => {
-        saveAs(new Blob([buffer], { type: 'application/octet-stream' }), 'DataGrid.xlsx')
+        saveAs(
+          new Blob([buffer], { type: 'application/octet-stream' }),
+          'Daftar Keluhan Selesai di Contact Center.xlsx'
+        )
       })
     })