feat: create export xlsx in rekapitulasi keluhan all
This commit is contained in:
parent
6337cd10cc
commit
57beb6eb2d
@ -5545,10 +5545,6 @@ body {
|
|||||||
grid-column-start: 2;
|
grid-column-start: 2;
|
||||||
}
|
}
|
||||||
|
|
||||||
.sm\:m-8 {
|
|
||||||
margin: 2rem;
|
|
||||||
}
|
|
||||||
|
|
||||||
.sm\:mx-0 {
|
.sm\:mx-0 {
|
||||||
margin-left: 0px;
|
margin-left: 0px;
|
||||||
margin-right: 0px;
|
margin-right: 0px;
|
||||||
|
@ -8,6 +8,7 @@
|
|||||||
>
|
>
|
||||||
<Type3 @update:filters="(value) => (filters = value)" />
|
<Type3 @update:filters="(value) => (filters = value)" />
|
||||||
</Filters>
|
</Filters>
|
||||||
|
|
||||||
<div>
|
<div>
|
||||||
<DxDataGrid
|
<DxDataGrid
|
||||||
@cell-click="onCellClicked"
|
@cell-click="onCellClicked"
|
||||||
@ -723,6 +724,7 @@
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</DetailDialog>
|
</DetailDialog>
|
||||||
|
|
||||||
<BufferDialog v-if="loadingData || loadingSubData" />
|
<BufferDialog v-if="loadingData || loadingSubData" />
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
@ -731,7 +733,7 @@ import DetailDialog from '@/components/Dialogs/DetailDialog.vue'
|
|||||||
import InputText from '@/components/InputText.vue'
|
import InputText from '@/components/InputText.vue'
|
||||||
import Filters from '@/components/Form/Filters.vue'
|
import Filters from '@/components/Form/Filters.vue'
|
||||||
import Type3 from '@/components/Form/FiltersType/Type3.vue'
|
import Type3 from '@/components/Form/FiltersType/Type3.vue'
|
||||||
import { ref, onMounted, watch } from 'vue'
|
import { ref, onMounted } from 'vue'
|
||||||
import { DxDataGrid } from 'devextreme-vue'
|
import { DxDataGrid } from 'devextreme-vue'
|
||||||
import {
|
import {
|
||||||
DxColumn,
|
DxColumn,
|
||||||
@ -752,7 +754,12 @@ import { queries, requestGraphQl } from '@/utils/api/api.graphql'
|
|||||||
import { formatNumber, formatPercentage, isNumber } from '@/utils/numbers'
|
import { formatNumber, formatPercentage, isNumber } from '@/utils/numbers'
|
||||||
import { apolloClient } from '@/utils/api/api.graphql'
|
import { apolloClient } from '@/utils/api/api.graphql'
|
||||||
import { provideApolloClient } from '@vue/apollo-composable'
|
import { provideApolloClient } from '@vue/apollo-composable'
|
||||||
import { exportToPDF, exportDetailToPDF } from '@/report/Keluhan/Rekap/RKeluhan_ALL'
|
import {
|
||||||
|
exportToPDF,
|
||||||
|
exportDetailToPDF,
|
||||||
|
exportToXLSX,
|
||||||
|
exportDetailToXLSX
|
||||||
|
} from '@/report/Keluhan/Rekap/RKeluhan_ALL'
|
||||||
import BufferDialog from '@/components/Dialogs/BufferDialog.vue'
|
import BufferDialog from '@/components/Dialogs/BufferDialog.vue'
|
||||||
|
|
||||||
const client = apolloClient()
|
const client = apolloClient()
|
||||||
@ -986,6 +993,7 @@ const onExporting = (e: any) => {
|
|||||||
if (e.format === 'pdf') {
|
if (e.format === 'pdf') {
|
||||||
exportToPDF(reportMeta.value, data.value)
|
exportToPDF(reportMeta.value, data.value)
|
||||||
} else if (e.format === 'xlsx') {
|
} else if (e.format === 'xlsx') {
|
||||||
|
exportToXLSX(reportMeta.value, e)
|
||||||
} else {
|
} else {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
@ -994,6 +1002,7 @@ const onExportingDetail = (e: any) => {
|
|||||||
if (e.format === 'pdf') {
|
if (e.format === 'pdf') {
|
||||||
exportDetailToPDF(reportMeta.value, dataSub.value)
|
exportDetailToPDF(reportMeta.value, dataSub.value)
|
||||||
} else if (e.format === 'xlsx') {
|
} else if (e.format === 'xlsx') {
|
||||||
|
exportDetailToXLSX(reportMeta.value, e)
|
||||||
} else {
|
} else {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@ -567,32 +567,37 @@ const exportToXLSX = (reportMeta: any, e: any) => {
|
|||||||
worksheet,
|
worksheet,
|
||||||
4,
|
4,
|
||||||
1,
|
1,
|
||||||
`POSKO : ${
|
`UNIT LAYANAN PELANGGAN : ${
|
||||||
reportMeta.posko ? reportMeta.posko.name.toUpperCase() : 'Semua Posko'.toUpperCase()
|
reportMeta.ulp
|
||||||
|
? reportMeta.ulp.name.toUpperCase()
|
||||||
|
: 'Semua Unit Layanan Pelanggan'.toUpperCase()
|
||||||
}`
|
}`
|
||||||
)
|
)
|
||||||
|
|
||||||
setHeaderStyle(worksheet, 7, 8, `${reportName}`.toUpperCase(), true)
|
setHeaderStyle(worksheet, 6, 1, `${reportName}`.toUpperCase(), true)
|
||||||
setHeaderStyle(
|
setHeaderStyle(
|
||||||
worksheet,
|
worksheet,
|
||||||
8,
|
7,
|
||||||
8,
|
1,
|
||||||
`PERIODE TANGGAL : ${meta.dateFromFormat} SD TGL ${meta.dateToFormat}`,
|
`PERIODE TANGGAL : ${meta.dateFromFormat} SD TGL ${meta.dateToFormat}`,
|
||||||
true
|
true
|
||||||
)
|
)
|
||||||
|
|
||||||
worksheet.mergeCells('A1:F1')
|
worksheet.mergeCells('A1:Q1')
|
||||||
worksheet.mergeCells('A2:F2')
|
worksheet.mergeCells('A2:Q2')
|
||||||
worksheet.mergeCells('A3:F3')
|
worksheet.mergeCells('A3:Q3')
|
||||||
worksheet.mergeCells('A4:F4')
|
worksheet.mergeCells('A4:Q4')
|
||||||
worksheet.mergeCells('H7:J7')
|
worksheet.mergeCells('A6:Q6')
|
||||||
worksheet.mergeCells('H8:J8')
|
worksheet.mergeCells('A7:Q7')
|
||||||
|
|
||||||
exportToExcel({
|
exportToExcel({
|
||||||
component: e.component,
|
component: e.component,
|
||||||
worksheet,
|
worksheet,
|
||||||
autoFilterEnabled: true,
|
autoFilterEnabled: true,
|
||||||
topLeftCell: { row: 10, column: 1 }
|
topLeftCell: { row: 9, column: 1 },
|
||||||
|
loadPanel: {
|
||||||
|
enabled: false
|
||||||
|
}
|
||||||
}).then(() => {
|
}).then(() => {
|
||||||
workbook.xlsx.writeBuffer().then((buffer: any) => {
|
workbook.xlsx.writeBuffer().then((buffer: any) => {
|
||||||
saveAs(new Blob([buffer], { type: 'application/octet-stream' }), `Laporan ${reportName}.xlsx`)
|
saveAs(new Blob([buffer], { type: 'application/octet-stream' }), `Laporan ${reportName}.xlsx`)
|
||||||
@ -608,23 +613,27 @@ const exportDetailToXLSX = (reportMeta: any, e: any) => {
|
|||||||
const worksheet = workbook.addWorksheet(`Detail ${reportName}`)
|
const worksheet = workbook.addWorksheet(`Detail ${reportName}`)
|
||||||
|
|
||||||
setHeaderStyle(worksheet, 1, 1, 'PT. PLN(Persero)')
|
setHeaderStyle(worksheet, 1, 1, 'PT. PLN(Persero)')
|
||||||
setHeaderStyle(worksheet, 3, 8, `Daftar Detail ${reportName}`.toUpperCase(), true)
|
setHeaderStyle(worksheet, 3, 1, `Daftar Detail ${reportName}`.toUpperCase(), true)
|
||||||
setHeaderStyle(
|
setHeaderStyle(
|
||||||
worksheet,
|
worksheet,
|
||||||
4,
|
4,
|
||||||
8,
|
1,
|
||||||
`PERIODE TANGGAL : ${meta.dateFromFormat} SD TGL ${meta.dateToFormat}`,
|
`PERIODE TANGGAL : ${meta.dateFromFormat} SD TGL ${meta.dateToFormat}`,
|
||||||
true
|
true
|
||||||
)
|
)
|
||||||
|
|
||||||
worksheet.mergeCells('H3:J3')
|
worksheet.mergeCells('A1:P1')
|
||||||
worksheet.mergeCells('H4:J4')
|
worksheet.mergeCells('A3:P3')
|
||||||
|
worksheet.mergeCells('A4:P4')
|
||||||
|
|
||||||
exportToExcel({
|
exportToExcel({
|
||||||
component: e.component,
|
component: e.component,
|
||||||
worksheet,
|
worksheet,
|
||||||
autoFilterEnabled: true,
|
autoFilterEnabled: true,
|
||||||
topLeftCell: { row: 6, column: 1 }
|
topLeftCell: { row: 6, column: 1 },
|
||||||
|
loadPanel: {
|
||||||
|
enabled: false
|
||||||
|
}
|
||||||
}).then(() => {
|
}).then(() => {
|
||||||
workbook.xlsx.writeBuffer().then((buffer: any) => {
|
workbook.xlsx.writeBuffer().then((buffer: any) => {
|
||||||
saveAs(
|
saveAs(
|
||||||
|
Loading…
x
Reference in New Issue
Block a user