feat: create export pdf, xlsx ctt
This commit is contained in:
@ -1,7 +1,8 @@
|
||||
<template>
|
||||
<Filters @run-search="() => filterData(filters)" class="mb-4">
|
||||
<Filters @reset-form="data = []" @run-search="() => filterData(filters)" class="mb-4">
|
||||
<Type3 @update:filters="(value) => (filters = value)" />
|
||||
</Filters>
|
||||
|
||||
<div id="data">
|
||||
<DxDataGrid
|
||||
ref="dataGridRef"
|
||||
@ -925,15 +926,8 @@ import {
|
||||
DxSelection,
|
||||
DxSummary
|
||||
} 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 { Type3 } from '@/components/Form/FiltersType'
|
||||
import { useQuery } from '@vue/apollo-composable'
|
||||
import Filters from '@/components/Form/Filters.vue'
|
||||
import gql from 'graphql-tag'
|
||||
import { apolloClient, queries, requestGraphQl } from '@/utils/api/api.graphql'
|
||||
import { provideApolloClient } from '@vue/apollo-composable'
|
||||
import { formatNumber, formatPercentage, isNumber } from '@/utils/numbers'
|
||||
@ -941,6 +935,12 @@ import BufferDialog from '@/components/Dialogs/BufferDialog.vue'
|
||||
import DetailDialog from '@/components/Dialogs/DetailDialog.vue'
|
||||
import { formatWaktu } from '@/components/Form/FiltersType/reference'
|
||||
import InputText from '@/components/InputText.vue'
|
||||
import {
|
||||
exportToPDF,
|
||||
exportToXLSX,
|
||||
exportDetailToPDF,
|
||||
exportDetailToXLSX
|
||||
} from '@/report/Ctt/CTT_LaporanCttKwhPeriksa'
|
||||
|
||||
const client = apolloClient()
|
||||
provideApolloClient(client)
|
||||
@ -962,6 +962,12 @@ const requirementData = ref<any>({
|
||||
dlpd: 0,
|
||||
historyP2tl: 0
|
||||
})
|
||||
const reportMeta = ref({
|
||||
uid: { id: 0, name: 'Semua Unit Induk Distribusi/Wilayah' },
|
||||
up3: { id: 0, name: 'Semua Unit Pelaksanaan Pelayanan Pelanggan' },
|
||||
ulp: { id: 0, name: 'Semua Unit Layanan Pelanggan' },
|
||||
periode: ''
|
||||
})
|
||||
|
||||
const setRequirementData = (data: any) => (requirementData.value = data)
|
||||
|
||||
@ -1007,34 +1013,21 @@ const calculateCustomSummary = (options: any) => {
|
||||
|
||||
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, true)
|
||||
} else if (e.format === 'xlsx') {
|
||||
exportToXLSX(reportMeta.value, e)
|
||||
} else {
|
||||
const workbook = new Workbook()
|
||||
const worksheet = workbook.addWorksheet('Employees')
|
||||
|
||||
exportToExcel({
|
||||
component: e.component,
|
||||
worksheet,
|
||||
autoFilterEnabled: true
|
||||
}).then(() => {
|
||||
workbook.xlsx.writeBuffer().then((buffer: any) => {
|
||||
saveAs(new Blob([buffer], { type: 'application/octet-stream' }), 'DataGrid.xlsx')
|
||||
})
|
||||
})
|
||||
|
||||
e.cancel = true
|
||||
}
|
||||
}
|
||||
|
||||
const onExportingDetail = (e: any) => {}
|
||||
const onExportingDetail = (e: any) => {
|
||||
if (e.format === 'pdf') {
|
||||
exportDetailToPDF(reportMeta.value, dataSub.value)
|
||||
} else if (e.format === 'xlsx') {
|
||||
exportDetailToXLSX(reportMeta.value, e)
|
||||
} else {
|
||||
}
|
||||
}
|
||||
|
||||
const resetData = () => {
|
||||
data.value = []
|
||||
@ -1068,6 +1061,8 @@ const filterData = async (params: any) => {
|
||||
} else {
|
||||
data.value = []
|
||||
}
|
||||
|
||||
reportMeta.value = filters.value
|
||||
})
|
||||
.catch((err) => {
|
||||
console.error(err)
|
||||
|
Reference in New Issue
Block a user