Compare commits
No commits in common. "9baac2e5e20301bcb13f175d198df7d799d7a270" and "f8e84629f5587150729e7f7474834ae70430521b" have entirely different histories.
9baac2e5e2
...
f8e84629f5
@ -1,14 +1,15 @@
|
|||||||
|
# syntax=docker/dockerfile:1
|
||||||
# build stage
|
# build stage
|
||||||
FROM node:lts-alpine as builder
|
FROM node:lts-alpine as builder
|
||||||
WORKDIR /app
|
WORKDIR /apkt
|
||||||
COPY package*.json ./
|
COPY package*.json ./
|
||||||
RUN npm install
|
RUN npm install && npm install npm-run-all -g
|
||||||
COPY . .
|
COPY . .
|
||||||
RUN npm run build
|
RUN npm run build
|
||||||
# production stage
|
# production stage
|
||||||
FROM nginx:stable-alpine
|
FROM nginx:stable-alpine
|
||||||
COPY --from=builder /app/dist /usr/share/nginx/html
|
COPY --from=builder /apkt/dist /usr/share/nginx/html
|
||||||
COPY --from=builder /app/nginx.conf /etc/nginx/nginx.conf
|
COPY --from=builder /apkt/nginx.conf /etc/nginx/nginx.conf
|
||||||
EXPOSE 32166
|
EXPOSE 32166
|
||||||
CMD ["nginx", "-g", "daemon off;"]
|
CMD ["nginx", "-g", "daemon off;"]
|
||||||
|
|
||||||
|
@ -1 +1 @@
|
|||||||
{"name":"eis","version":"0.0.181-vm","private":true,"scripts":{"dev":"vite","host":"vite --host","tailwind":"tailwindcss -i ./src/assets/css/tailwind.css -o ./src/assets/css/style.css --watch","build":"run-p type-check build-only","preview":"vite preview --host","test:unit":"vitest","build-only":"vite build","type-check":"vue-tsc --noEmit -p tsconfig.vitest.json --composite false","lint":"eslint . --ext .vue,.js,.jsx,.cjs,.mjs,.ts,.tsx,.cts,.mts --fix --ignore-path .gitignore","format":"prettier --write src/","deploy":"node deploy.js","set-version":"node version.js","version":"echo $npm_package_version"},"dependencies":{"@apollo/client":"^3.8.10","@apollo/link-context":"^2.0.0-beta.3","@flavorly/vanilla-components":"^0.7.65","@headlessui/tailwindcss":"^0.2.0","@headlessui/vue":"^1.7.19","@heroicons/vue":"^2.0.18","@lottiefiles/lottie-player":"^2.0.4","@phosphor-icons/vue":"^2.1.6","@types/qs":"^6.9.12","@types/uuid":"^9.0.8","@types/vue-select":"^3.16.8","@vue/apollo-components":"^4.0.0","@vue/apollo-composable":"^4.0.1","@vue/apollo-option":"^4.0.0","axios":"^1.6.7","devextreme":"23.2.4","devextreme-vue":"23.2.4","docx":"^8.5.0","dotenv":"^16.3.1","encrypt-storage":"^2.12.22","exceljs":"^4.4.0","file-saver":"^2.0.5","graphql":"^16.8.1","graphql-tag":"^2.12.6","jspdf":"^2.5.1","jspdf-autotable":"^3.8.2","pinia":"^2.1.3","qs":"^6.11.2","uuid":"^9.0.1","vue":"^3.3.4","vue-html-to-paper":"^2.0.3","vue-router":"^4.2.2","vue-tailwind-datepicker":"^1.6.1","vue3-star-ratings":"^3.0.5"},"devDependencies":{"@rushstack/eslint-patch":"^1.5.1","@tailwindcss/aspect-ratio":"^0.4.2","@tailwindcss/container-queries":"^0.1.1","@tailwindcss/forms":"^0.5.7","@tailwindcss/typography":"^0.5.10","@tsconfig/node18":"^2.0.1","@types/file-saver":"^2.0.6","@types/jsdom":"^21.1.1","@types/node":"^18.16.17","@vitejs/plugin-vue":"^4.2.3","@vitejs/plugin-vue-jsx":"^3.0.1","@vue/eslint-config-prettier":"^8.0.0","@vue/eslint-config-typescript":"^12.0.0","@vue/test-utils":"^2.3.2","@vue/tsconfig":"^0.4.0","autoprefixer":"^10.4.14","eslint":"^8.39.0","eslint-plugin-vue":"^9.11.0","jsdom":"^22.1.0","npm-run-all":"^4.1.5","postcss":"^8.4.24","prettier":"^3.0.3","tailwindcss":"^3.3.2","typescript":"~5.2.2","vite":"^4.3.9","vitest":"^1.3.1","vue-tsc":"^2.0.5"}}
|
{"name":"eis","version":"0.0.174-vm","private":true,"scripts":{"dev":"vite","host":"vite --host","tailwind":"tailwindcss -i ./src/assets/css/tailwind.css -o ./src/assets/css/style.css --watch","build":"run-p type-check build-only","preview":"vite preview --host","test:unit":"vitest","build-only":"vite build","type-check":"vue-tsc --noEmit -p tsconfig.vitest.json --composite false","lint":"eslint . --ext .vue,.js,.jsx,.cjs,.mjs,.ts,.tsx,.cts,.mts --fix --ignore-path .gitignore","format":"prettier --write src/","deploy":"node deploy.js","set-version":"node version.js","version":"echo $npm_package_version"},"dependencies":{"@apollo/client":"^3.8.10","@apollo/link-context":"^2.0.0-beta.3","@flavorly/vanilla-components":"^0.7.65","@headlessui/tailwindcss":"^0.2.0","@headlessui/vue":"^1.7.19","@heroicons/vue":"^2.0.18","@lottiefiles/lottie-player":"^2.0.4","@phosphor-icons/vue":"^2.1.6","@types/qs":"^6.9.12","@types/uuid":"^9.0.8","@types/vue-select":"^3.16.8","@vue/apollo-components":"^4.0.0","@vue/apollo-composable":"^4.0.1","@vue/apollo-option":"^4.0.0","axios":"^1.6.7","devextreme":"23.2.4","devextreme-vue":"23.2.4","docx":"^8.5.0","dotenv":"^16.3.1","encrypt-storage":"^2.12.22","exceljs":"^4.4.0","file-saver":"^2.0.5","graphql":"^16.8.1","graphql-tag":"^2.12.6","jspdf":"^2.5.1","jspdf-autotable":"^3.8.2","pinia":"^2.1.3","qs":"^6.11.2","uuid":"^9.0.1","vue":"^3.3.4","vue-html-to-paper":"^2.0.3","vue-router":"^4.2.2","vue-tailwind-datepicker":"^1.6.1","vue3-star-ratings":"^3.0.5"},"devDependencies":{"@rushstack/eslint-patch":"^1.5.1","@tailwindcss/aspect-ratio":"^0.4.2","@tailwindcss/container-queries":"^0.1.1","@tailwindcss/forms":"^0.5.7","@tailwindcss/typography":"^0.5.10","@tsconfig/node18":"^2.0.1","@types/file-saver":"^2.0.6","@types/jsdom":"^21.1.1","@types/node":"^18.16.17","@vitejs/plugin-vue":"^4.2.3","@vitejs/plugin-vue-jsx":"^3.0.1","@vue/eslint-config-prettier":"^8.0.0","@vue/eslint-config-typescript":"^12.0.0","@vue/test-utils":"^2.3.2","@vue/tsconfig":"^0.4.0","autoprefixer":"^10.4.14","eslint":"^8.39.0","eslint-plugin-vue":"^9.11.0","jsdom":"^22.1.0","npm-run-all":"^4.1.5","postcss":"^8.4.24","prettier":"^3.0.3","tailwindcss":"^3.3.2","typescript":"~5.2.2","vite":"^4.3.9","vitest":"^1.3.1","vue-tsc":"^2.0.5"}}
|
@ -1 +1 @@
|
|||||||
{"version":"0.0.181-vm"}
|
{"version":"0.0.174-vm"}
|
@ -111,7 +111,7 @@ const showDialogLogout = () => {
|
|||||||
{{ user.user_access }}
|
{{ user.user_access }}
|
||||||
</p>
|
</p>
|
||||||
<p class="text-xs font-normal border-t border-white text-primary-50">
|
<p class="text-xs font-normal border-t border-white text-primary-50">
|
||||||
• {{ user.user_uid }}
|
• UID {{ user.user_uid }}
|
||||||
</p>
|
</p>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
@ -27,6 +27,13 @@
|
|||||||
/>
|
/>
|
||||||
<DxColumnFixing :enabled="true" />
|
<DxColumnFixing :enabled="true" />
|
||||||
|
|
||||||
|
<DxColumn
|
||||||
|
alignment="center"
|
||||||
|
data-field="nama_unit"
|
||||||
|
caption="Nama Unit"
|
||||||
|
css-class="custom-table-column"
|
||||||
|
cell-template="formatText"
|
||||||
|
/>
|
||||||
<!-- <DxColumn
|
<!-- <DxColumn
|
||||||
alignment="center"
|
alignment="center"
|
||||||
:min-width="170"
|
:min-width="170"
|
||||||
@ -58,14 +65,6 @@
|
|||||||
name="namaUID"
|
name="namaUID"
|
||||||
:calculate-group-value="(rowData: any) => rowData.nama_up3"
|
:calculate-group-value="(rowData: any) => rowData.nama_up3"
|
||||||
/> -->
|
/> -->
|
||||||
<DxColumn
|
|
||||||
:width="170"
|
|
||||||
alignment="center"
|
|
||||||
data-field="nama_unit"
|
|
||||||
caption="Nama Unit"
|
|
||||||
css-class="custom-table-column"
|
|
||||||
cell-template="formatText"
|
|
||||||
/>
|
|
||||||
<DxColumn
|
<DxColumn
|
||||||
:width="170"
|
:width="170"
|
||||||
alignment="center"
|
alignment="center"
|
||||||
@ -317,7 +316,7 @@
|
|||||||
|
|
||||||
<DetailDialog
|
<DetailDialog
|
||||||
:open="dialogDetail"
|
:open="dialogDetail"
|
||||||
:title="`Daftar Detail Anomali Penanganan Pengaduan Gangguan Petugas - ${filters.jenisLaporan.name}`"
|
:title="`Daftar Detail Anomali Penanganan Pengaduan Berulang Petugas ${filters.jenisLaporan.name}`"
|
||||||
@on-close="closedialogDetail"
|
@on-close="closedialogDetail"
|
||||||
:full-width="true"
|
:full-width="true"
|
||||||
>
|
>
|
||||||
@ -951,10 +950,7 @@ import { formatWaktu } from '@/components/Form/FiltersType/reference'
|
|||||||
import {
|
import {
|
||||||
exportToPDF,
|
exportToPDF,
|
||||||
exportToXLSX,
|
exportToXLSX,
|
||||||
exportToDOCX,
|
exportToDOCX
|
||||||
exportDetailToPDF,
|
|
||||||
exportDetailToXLSX,
|
|
||||||
exportDetailToDOCX
|
|
||||||
} from '@/report/Anomali/Gangguan/Anomali_LAPPGP_LPP'
|
} from '@/report/Anomali/Gangguan/Anomali_LAPPGP_LPP'
|
||||||
import { queries, requestGraphQl } from '@/utils/api/api.graphql'
|
import { queries, requestGraphQl } from '@/utils/api/api.graphql'
|
||||||
import DetailDialog from '@/components/Dialogs/DetailDialog.vue'
|
import DetailDialog from '@/components/Dialogs/DetailDialog.vue'
|
||||||
@ -1119,15 +1115,7 @@ const onDataSelectionChanged = ({ selectedRowsData }: any) => {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
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 {
|
|
||||||
exportDetailToDOCX(reportMeta.value, dataSub.value)
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
const onDataSubSelectionChanged = ({ selectedRowsData }: any) => {
|
const onDataSubSelectionChanged = ({ selectedRowsData }: any) => {
|
||||||
const data = selectedRowsData[0]
|
const data = selectedRowsData[0]
|
||||||
|
@ -540,7 +540,7 @@
|
|||||||
|
|
||||||
<DetailDialog
|
<DetailDialog
|
||||||
:open="dialogDetail"
|
:open="dialogDetail"
|
||||||
:title="`Daftar Detail Anomali Penanganan Pengaduan Gangguan Unit - ${filters.jenisLaporan.name}`"
|
:title="`Daftar Detail Anomali Penanganan Pengaduan ${filters.jenisLaporan.name}`"
|
||||||
@on-close="closedialogDetail"
|
@on-close="closedialogDetail"
|
||||||
:full-width="true"
|
:full-width="true"
|
||||||
>
|
>
|
||||||
|
@ -362,7 +362,7 @@
|
|||||||
|
|
||||||
<DetailDialog
|
<DetailDialog
|
||||||
:open="dialogDetail"
|
:open="dialogDetail"
|
||||||
:title="`Daftar Detail Anomali Penanganan Pengaduan Keluhan Unit - ${filters.jenisLaporan.name}`"
|
title="Daftar Detail Anomali Penanganan Pengaduan"
|
||||||
@on-close="closedialogDetail"
|
@on-close="closedialogDetail"
|
||||||
:full-width="true"
|
:full-width="true"
|
||||||
>
|
>
|
||||||
@ -437,16 +437,6 @@
|
|||||||
<DxColumn
|
<DxColumn
|
||||||
:width="150"
|
:width="150"
|
||||||
alignment="center"
|
alignment="center"
|
||||||
v-if="filters.jenisLaporan.name === 'Laporan Berulang Unit'"
|
|
||||||
data-field="no_laporan_anomali"
|
|
||||||
caption="No Laporan"
|
|
||||||
css-class="custom-table-column"
|
|
||||||
cell-template="formatText"
|
|
||||||
/>
|
|
||||||
<DxColumn
|
|
||||||
:width="150"
|
|
||||||
alignment="center"
|
|
||||||
v-else
|
|
||||||
data-field="no_laporan"
|
data-field="no_laporan"
|
||||||
caption="No Laporan"
|
caption="No Laporan"
|
||||||
css-class="custom-table-column"
|
css-class="custom-table-column"
|
||||||
@ -455,8 +445,7 @@
|
|||||||
<DxColumn
|
<DxColumn
|
||||||
:width="150"
|
:width="150"
|
||||||
alignment="center"
|
alignment="center"
|
||||||
v-if="filters.jenisLaporan.name === 'Laporan Berulang Unit'"
|
data-field="referensi_marking"
|
||||||
data-field="no_laporan_referensi"
|
|
||||||
caption="No Laporan Referensi"
|
caption="No Laporan Referensi"
|
||||||
css-class="custom-table-column"
|
css-class="custom-table-column"
|
||||||
cell-template="formatText"
|
cell-template="formatText"
|
||||||
@ -605,18 +594,14 @@
|
|||||||
|
|
||||||
<div class="flex flex-row items-center justify-between w-full">
|
<div class="flex flex-row items-center justify-between w-full">
|
||||||
<h3 class="text-sm font-medium w-[135px] text-gray-800">No Laporan:</h3>
|
<h3 class="text-sm font-medium w-[135px] text-gray-800">No Laporan:</h3>
|
||||||
<InputText
|
<InputText :readonly="true" :value="dataSubSelected?.no_laporan" class-name="flex-1" />
|
||||||
:readonly="true"
|
|
||||||
:value="dataSubSelected?.no_laporan_anomali"
|
|
||||||
class-name="flex-1"
|
|
||||||
/>
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="flex flex-row items-center justify-between w-full">
|
<div class="flex flex-row items-center justify-between w-full">
|
||||||
<h3 class="text-sm font-medium w-[135px] text-gray-800">No Laporan Referensi:</h3>
|
<h3 class="text-sm font-medium w-[135px] text-gray-800">No Laporan Referensi:</h3>
|
||||||
<InputText
|
<InputText
|
||||||
:readonly="true"
|
:readonly="true"
|
||||||
:value="dataSubSelected?.no_laporan_referensi"
|
:value="dataSubSelected?.referensi_marking"
|
||||||
class-name="flex-1"
|
class-name="flex-1"
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
|
@ -856,7 +856,7 @@
|
|||||||
<DxColumn
|
<DxColumn
|
||||||
:width="150"
|
:width="150"
|
||||||
alignment="center"
|
alignment="center"
|
||||||
data-field="media"
|
data-field="pembuat_laporan"
|
||||||
caption="Sumber Lapor"
|
caption="Sumber Lapor"
|
||||||
:allow-resizing="false"
|
:allow-resizing="false"
|
||||||
css-class="custom-table-column"
|
css-class="custom-table-column"
|
||||||
|
@ -14,6 +14,7 @@
|
|||||||
:hover-state-enabled="true"
|
:hover-state-enabled="true"
|
||||||
@selection-changed="onDataSelectionChanged"
|
@selection-changed="onDataSelectionChanged"
|
||||||
:column-width="100"
|
:column-width="100"
|
||||||
|
@exporting=""
|
||||||
:data-source="data"
|
:data-source="data"
|
||||||
v-if="loadingData == false"
|
v-if="loadingData == false"
|
||||||
:allow-column-resizing="true"
|
:allow-column-resizing="true"
|
||||||
@ -31,6 +32,11 @@
|
|||||||
/>
|
/>
|
||||||
|
|
||||||
<DxSearchPanel :visible="true" :highlight-case-sensitive="true" />
|
<DxSearchPanel :visible="true" :highlight-case-sensitive="true" />
|
||||||
|
<DxExport
|
||||||
|
:enabled="true"
|
||||||
|
:formats="['pdf', 'xlsx', 'document']"
|
||||||
|
:allow-export-selected-data="false"
|
||||||
|
/>
|
||||||
|
|
||||||
<DxColumn
|
<DxColumn
|
||||||
css-class="custom-table-column"
|
css-class="custom-table-column"
|
||||||
@ -143,8 +149,8 @@
|
|||||||
css-class="custom-table-column"
|
css-class="custom-table-column"
|
||||||
:width="170"
|
:width="170"
|
||||||
alignment="center"
|
alignment="center"
|
||||||
data-field="keterangan_pelapor"
|
data-field="keterangan_dlpd"
|
||||||
caption="Keterangan Pelapor"
|
caption="Keterangan DLPD"
|
||||||
cell-template="formatText"
|
cell-template="formatText"
|
||||||
/>
|
/>
|
||||||
|
|
||||||
@ -253,7 +259,14 @@ import { ref, onMounted } from 'vue'
|
|||||||
import { DxDataGrid } from 'devextreme-vue'
|
import { DxDataGrid } from 'devextreme-vue'
|
||||||
import DetailDialog from '@/components/Dialogs/DetailDialog.vue'
|
import DetailDialog from '@/components/Dialogs/DetailDialog.vue'
|
||||||
import InputText from '@/components/InputText.vue'
|
import InputText from '@/components/InputText.vue'
|
||||||
import { DxColumn, DxPager, DxPaging, DxSearchPanel, DxSelection } from 'devextreme-vue/data-grid'
|
import {
|
||||||
|
DxColumn,
|
||||||
|
DxExport,
|
||||||
|
DxPager,
|
||||||
|
DxPaging,
|
||||||
|
DxSearchPanel,
|
||||||
|
DxSelection
|
||||||
|
} from 'devextreme-vue/data-grid'
|
||||||
import { Type15 } from '@/components/Form/FiltersType'
|
import { Type15 } from '@/components/Form/FiltersType'
|
||||||
import Filters from '@/components/Form/Filters.vue'
|
import Filters from '@/components/Form/Filters.vue'
|
||||||
import { queries, requestGraphQl } from '@/utils/api/api.graphql'
|
import { queries, requestGraphQl } from '@/utils/api/api.graphql'
|
||||||
|
@ -3,32 +3,52 @@ import { saveAs } from 'file-saver'
|
|||||||
import { jsPDF } from 'jspdf'
|
import { jsPDF } from 'jspdf'
|
||||||
import autoTable from 'jspdf-autotable'
|
import autoTable from 'jspdf-autotable'
|
||||||
import { Workbook } from 'exceljs'
|
import { Workbook } from 'exceljs'
|
||||||
import { formatWaktu } from '@/components/Form/FiltersType/reference'
|
|
||||||
import { setHeaderStyle } from '@/report/utils/xlsx'
|
import { setHeaderStyle } from '@/report/utils/xlsx'
|
||||||
import { formatNumber, formatPercentage } from '@/utils/numbers'
|
import { formatNumber, formatPercentage } from '@/utils/numbers'
|
||||||
import { exportToWord, exportDetailToWord } from './doc/Anomali_LAPPGP_LPP'
|
import { exportToWord } from './doc/Anomali_LAPPGP_LPP'
|
||||||
|
|
||||||
const reportName = 'Anomali Penanganan Pengaduan Gangguan Petugas'
|
const reportName = 'Anomali Penanganan Pengaduan Gangguan Petugas'
|
||||||
const fontSize = 5
|
const fontSize = 5
|
||||||
const detailFontSize = 3
|
|
||||||
|
|
||||||
const formatData = (rawData: any) => {
|
const formatData = (rawData: any) => {
|
||||||
const formattedData: any = []
|
const formattedData: any = []
|
||||||
|
const total: any = {
|
||||||
|
wo_total: 0,
|
||||||
|
anomali_pln_mobile_marking: 0,
|
||||||
|
anomali_cc123_marking: 0
|
||||||
|
// total_anomali_marking: 0
|
||||||
|
// persen_anomali_pln_mobile_marking: 0
|
||||||
|
// persen_anomali_cc123_marking
|
||||||
|
// persen_anomali_marking
|
||||||
|
}
|
||||||
|
|
||||||
rawData.forEach((item: any) => {
|
rawData.forEach((item: any) => {
|
||||||
formattedData.push([
|
total.wo_total += item.wo_total
|
||||||
item.nama_unit,
|
total.anomali_pln_mobile_marking += item.anomali_pln_mobile_marking
|
||||||
item.nama_petugas,
|
total.anomali_cc123_marking += item.anomali_cc123_marking
|
||||||
formatNumber(item.wo_total),
|
|
||||||
formatNumber(item.wo_pln_mobile),
|
|
||||||
formatNumber(item.wo_cc123),
|
|
||||||
formatNumber(item.wo_pln_mobile + item.wo_cc123),
|
|
||||||
formatPercentage(item.persen_anomali_pln_mobile),
|
|
||||||
formatPercentage(item.persen_anomali_cc123),
|
|
||||||
formatPercentage(item.persen_anomali_pln_mobile + item.persen_anomali_cc123)
|
|
||||||
])
|
|
||||||
})
|
})
|
||||||
|
|
||||||
|
const total_anomali_marking = total.anomali_pln_mobile_marking + total.anomali_cc123_marking
|
||||||
|
const persen_anomali_pln_mobile_marking = total.anomali_pln_mobile_marking / total.wo_total
|
||||||
|
const persen_anomali_cc123_marking = total.anomali_cc123_marking / total.wo_total
|
||||||
|
const persen_anomali_marking = persen_anomali_pln_mobile_marking + persen_anomali_cc123_marking
|
||||||
|
|
||||||
|
formattedData.push([
|
||||||
|
{
|
||||||
|
content: 'Semua Unit',
|
||||||
|
colSpan: 2
|
||||||
|
},
|
||||||
|
formatNumber(total.wo_total),
|
||||||
|
formatNumber(total.anomali_pln_mobile_marking),
|
||||||
|
formatNumber(total.anomali_cc123_marking),
|
||||||
|
formatNumber(total_anomali_marking),
|
||||||
|
formatPercentage(
|
||||||
|
!persen_anomali_pln_mobile_marking ? 0 : persen_anomali_pln_mobile_marking * 100
|
||||||
|
),
|
||||||
|
formatPercentage(!persen_anomali_cc123_marking ? 0 : persen_anomali_cc123_marking * 100),
|
||||||
|
formatPercentage(!persen_anomali_marking ? 0 : persen_anomali_marking * 100)
|
||||||
|
])
|
||||||
|
|
||||||
return formattedData
|
return formattedData
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -62,8 +82,8 @@ const exportToPDF = (reportMeta: any, rawData: any, preview: boolean = false) =>
|
|||||||
const date = new Date().getDate()
|
const date = new Date().getDate()
|
||||||
const month = new Date().toLocaleString('id-ID', { month: 'long' })
|
const month = new Date().toLocaleString('id-ID', { month: 'long' })
|
||||||
const year = new Date().getFullYear()
|
const year = new Date().getFullYear()
|
||||||
const meta = formatMetaData(reportMeta)
|
|
||||||
const data = formatData(rawData)
|
const data = formatData(rawData)
|
||||||
|
const meta = formatMetaData(reportMeta)
|
||||||
const doc = new jsPDF({
|
const doc = new jsPDF({
|
||||||
orientation: 'landscape'
|
orientation: 'landscape'
|
||||||
})
|
})
|
||||||
@ -222,210 +242,6 @@ const exportToPDF = (reportMeta: any, rawData: any, preview: boolean = false) =>
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
const createDetailTableField = (reportMeta: any, rawData: any) => {
|
|
||||||
const field = ['No', 'UIW/D', 'UP3', 'Rayon', 'Nama Petugas']
|
|
||||||
|
|
||||||
if (reportMeta.jenisLaporan.name === 'Laporan Berulang Unit') {
|
|
||||||
field.push(
|
|
||||||
...[
|
|
||||||
'No Laporan',
|
|
||||||
'No Laporan Lapor Ulang',
|
|
||||||
'No Laporan Referensi',
|
|
||||||
'Status Induk',
|
|
||||||
'Referensi Marking Induk'
|
|
||||||
]
|
|
||||||
)
|
|
||||||
}
|
|
||||||
|
|
||||||
if (reportMeta.jenisLaporan.name === 'Laporan Rating Negatif') {
|
|
||||||
field.push(...['Rating', 'Feedback', 'Ulasan'])
|
|
||||||
}
|
|
||||||
|
|
||||||
field.push(
|
|
||||||
...[
|
|
||||||
'Tgl/Jam Lapor',
|
|
||||||
'Tgl/Jam Datang',
|
|
||||||
'Tgl/Jam Nyala',
|
|
||||||
'Durasi Response Time',
|
|
||||||
'Durasi Recovery Time',
|
|
||||||
'Durasi Penugasan Regu',
|
|
||||||
'Durasi Perjalanan Regu',
|
|
||||||
'Jarak Closing',
|
|
||||||
'Dispacth Oleh',
|
|
||||||
'IDPEL/NO METER',
|
|
||||||
'Nama Pelapor',
|
|
||||||
'Alamat Pelapor',
|
|
||||||
'No Telp Pelapor',
|
|
||||||
'Keterangan Pelapor',
|
|
||||||
'Sumber Lapor',
|
|
||||||
'Diselesaikan Oleh',
|
|
||||||
'Status',
|
|
||||||
'Referensi Marking',
|
|
||||||
'Kode Gangguan',
|
|
||||||
'Jenis Gangguan',
|
|
||||||
'Penyebab',
|
|
||||||
'Tindakan'
|
|
||||||
]
|
|
||||||
)
|
|
||||||
|
|
||||||
const rows = rawData.map((item: any, i: any) => {
|
|
||||||
const data = [
|
|
||||||
{ content: i + 1, styles: { halign: 'right' } },
|
|
||||||
item.nama_uid,
|
|
||||||
item.nama_up3,
|
|
||||||
item.nama_ulp,
|
|
||||||
item.nama_petugas
|
|
||||||
]
|
|
||||||
|
|
||||||
if (reportMeta.jenisLaporan.name === 'Laporan Berulang Unit') {
|
|
||||||
data.push(
|
|
||||||
...[
|
|
||||||
item.no_laporan,
|
|
||||||
item.no_laporan_laporulang,
|
|
||||||
item.no_laporan,
|
|
||||||
item.status_induk,
|
|
||||||
item.referensi_marking_induk
|
|
||||||
]
|
|
||||||
)
|
|
||||||
}
|
|
||||||
|
|
||||||
if (reportMeta.jenisLaporan.name === 'Laporan Rating Negatif') {
|
|
||||||
data.push(...[item.rating, item.feedback, item.ulasan])
|
|
||||||
}
|
|
||||||
|
|
||||||
data.push(
|
|
||||||
...[
|
|
||||||
item.waktu_lapor,
|
|
||||||
item.waktu_response,
|
|
||||||
item.waktu_recovery,
|
|
||||||
item.durasi_response_time ? formatWaktu(item.durasi_response_time) : '-',
|
|
||||||
item.durasi_recovery_time ? formatWaktu(item.durasi_recovery_time) : '-',
|
|
||||||
item.durasi_dispatch_time ? formatWaktu(item.durasi_dispatch_time) : '-',
|
|
||||||
item.durasi_perjalanan ? formatWaktu(item.durasi_perjalanan) : '-',
|
|
||||||
item.distance,
|
|
||||||
item.dispatch_by,
|
|
||||||
item.idpel_nometer,
|
|
||||||
item.nama_pelapor,
|
|
||||||
item.alamat_pelapor,
|
|
||||||
item.no_telp_pelapor,
|
|
||||||
item.keterangan_pelapor,
|
|
||||||
item.media,
|
|
||||||
item.diselesaikan_oleh,
|
|
||||||
item.status_akhir,
|
|
||||||
item.marking,
|
|
||||||
item.kode_gangguan,
|
|
||||||
item.jenis_gangguan,
|
|
||||||
item.penyebab,
|
|
||||||
item.tindakan
|
|
||||||
]
|
|
||||||
)
|
|
||||||
|
|
||||||
return data
|
|
||||||
})
|
|
||||||
|
|
||||||
return { field, rows }
|
|
||||||
}
|
|
||||||
|
|
||||||
const exportDetailToPDF = (reportMeta: any, rawData: any) => {
|
|
||||||
const day = new Date().toLocaleString('id-ID', { weekday: 'long' })
|
|
||||||
const date = new Date().getDate()
|
|
||||||
const month = new Date().toLocaleString('id-ID', { month: 'long' })
|
|
||||||
const year = new Date().getFullYear()
|
|
||||||
const meta = formatMetaData(reportMeta)
|
|
||||||
const { field, rows } = createDetailTableField(reportMeta, rawData)
|
|
||||||
const doc = new jsPDF({
|
|
||||||
orientation: 'landscape'
|
|
||||||
})
|
|
||||||
|
|
||||||
autoTable(doc, {
|
|
||||||
head: [['PT. PLN(Persero)']],
|
|
||||||
styles: {
|
|
||||||
fontSize: detailFontSize,
|
|
||||||
cellPadding: 0.1,
|
|
||||||
textColor: [0, 0, 0],
|
|
||||||
fontStyle: 'bold'
|
|
||||||
},
|
|
||||||
theme: 'plain',
|
|
||||||
startY: 10,
|
|
||||||
margin: 5
|
|
||||||
})
|
|
||||||
|
|
||||||
autoTable(doc, {
|
|
||||||
head: [
|
|
||||||
[`Daftar Detail ${reportName}`.toUpperCase()],
|
|
||||||
[`PERIODE TANGGAL : ${meta.dateFromFormat} SD TGL ${meta.dateToFormat}`]
|
|
||||||
],
|
|
||||||
styles: {
|
|
||||||
fontSize: detailFontSize,
|
|
||||||
cellPadding: 0.1,
|
|
||||||
textColor: [0, 0, 0],
|
|
||||||
fontStyle: 'bold',
|
|
||||||
halign: 'center'
|
|
||||||
},
|
|
||||||
theme: 'plain',
|
|
||||||
startY: 18,
|
|
||||||
margin: 5
|
|
||||||
})
|
|
||||||
|
|
||||||
autoTable(doc, {
|
|
||||||
head: [field],
|
|
||||||
body: rows,
|
|
||||||
styles: {
|
|
||||||
fontSize: detailFontSize,
|
|
||||||
cellPadding: 1,
|
|
||||||
lineColor: [0, 0, 0],
|
|
||||||
lineWidth: 0.1,
|
|
||||||
cellWidth: 'auto'
|
|
||||||
},
|
|
||||||
rowPageBreak: 'auto',
|
|
||||||
headStyles: {
|
|
||||||
fillColor: [192, 192, 192],
|
|
||||||
textColor: [0, 0, 0],
|
|
||||||
fontStyle: 'bold',
|
|
||||||
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: 24,
|
|
||||||
margin: 5
|
|
||||||
})
|
|
||||||
|
|
||||||
autoTable(doc, {
|
|
||||||
head: [
|
|
||||||
[`${day}, ${date}-${month}-${year}`],
|
|
||||||
[
|
|
||||||
{
|
|
||||||
content: '(.........................................)',
|
|
||||||
styles: { minCellHeight: 8, valign: 'bottom' }
|
|
||||||
}
|
|
||||||
]
|
|
||||||
],
|
|
||||||
styles: {
|
|
||||||
fontSize: detailFontSize,
|
|
||||||
cellPadding: 0.1,
|
|
||||||
textColor: [0, 0, 0],
|
|
||||||
fontStyle: 'bold',
|
|
||||||
halign: 'center'
|
|
||||||
},
|
|
||||||
theme: 'plain',
|
|
||||||
tableWidth: 50,
|
|
||||||
margin: { left: 230 }
|
|
||||||
})
|
|
||||||
|
|
||||||
doc.save(`Laporan Detail ${reportName}.pdf`, { returnPromise: true }).then(() => {
|
|
||||||
console.log('pdf berhasil disimpan')
|
|
||||||
})
|
|
||||||
}
|
|
||||||
|
|
||||||
const exportToXLSX = (reportMeta: any, e: any) => {
|
const exportToXLSX = (reportMeta: any, e: any) => {
|
||||||
const meta = formatMetaData(reportMeta)
|
const meta = formatMetaData(reportMeta)
|
||||||
const workbook = new Workbook()
|
const workbook = new Workbook()
|
||||||
@ -498,60 +314,9 @@ const exportToXLSX = (reportMeta: any, e: any) => {
|
|||||||
e.cancel = true
|
e.cancel = true
|
||||||
}
|
}
|
||||||
|
|
||||||
const exportDetailToXLSX = (reportMeta: any, e: any) => {
|
|
||||||
const meta = formatMetaData(reportMeta)
|
|
||||||
const workbook = new Workbook()
|
|
||||||
const worksheet = workbook.addWorksheet(`Detail ${reportName}`)
|
|
||||||
|
|
||||||
setHeaderStyle(worksheet, 1, 1, 'PT. PLN(Persero)')
|
|
||||||
setHeaderStyle(worksheet, 3, 1, `Daftar Detail ${reportName}`.toUpperCase(), true)
|
|
||||||
setHeaderStyle(
|
|
||||||
worksheet,
|
|
||||||
4,
|
|
||||||
1,
|
|
||||||
`PERIODE TANGGAL : ${meta.dateFromFormat} SD TGL ${meta.dateToFormat}`,
|
|
||||||
true
|
|
||||||
)
|
|
||||||
|
|
||||||
worksheet.mergeCells('A1:AC1')
|
|
||||||
worksheet.mergeCells('A3:AC3')
|
|
||||||
worksheet.mergeCells('A4:AC4')
|
|
||||||
|
|
||||||
exportToExcel({
|
|
||||||
component: e.component,
|
|
||||||
worksheet,
|
|
||||||
autoFilterEnabled: true,
|
|
||||||
topLeftCell: { row: 6, column: 1 },
|
|
||||||
loadPanel: {
|
|
||||||
enabled: false
|
|
||||||
}
|
|
||||||
}).then(() => {
|
|
||||||
workbook.xlsx.writeBuffer().then((buffer: any) => {
|
|
||||||
saveAs(
|
|
||||||
new Blob([buffer], { type: 'application/octet-stream' }),
|
|
||||||
`Laporan Detail ${reportName}.xlsx`
|
|
||||||
)
|
|
||||||
})
|
|
||||||
})
|
|
||||||
|
|
||||||
e.cancel = true
|
|
||||||
}
|
|
||||||
|
|
||||||
const exportToDOCX = (reportMeta: any, rawData: any) => {
|
const exportToDOCX = (reportMeta: any, rawData: any) => {
|
||||||
const meta = formatMetaData(reportMeta)
|
const meta = formatMetaData(reportMeta)
|
||||||
exportToWord(reportMeta, meta, formatData(rawData), reportName)
|
exportToWord(reportMeta, meta, formatData(rawData), reportName)
|
||||||
}
|
}
|
||||||
|
|
||||||
const exportDetailToDOCX = (reportMeta: any, rawData: any) => {
|
export { exportToPDF, exportToXLSX, exportToDOCX }
|
||||||
const meta = formatMetaData(reportMeta)
|
|
||||||
exportDetailToWord(meta, createDetailTableField(reportMeta, rawData), reportName)
|
|
||||||
}
|
|
||||||
|
|
||||||
export {
|
|
||||||
exportToPDF,
|
|
||||||
exportToXLSX,
|
|
||||||
exportToDOCX,
|
|
||||||
exportDetailToPDF,
|
|
||||||
exportDetailToXLSX,
|
|
||||||
exportDetailToDOCX
|
|
||||||
}
|
|
||||||
|
@ -35,7 +35,7 @@ export const exportToWord = (
|
|||||||
tbody += column
|
tbody += column
|
||||||
}
|
}
|
||||||
|
|
||||||
const preHtml = `
|
let 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'>
|
<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>
|
<head>
|
||||||
<meta charset='utf-8'>
|
<meta charset='utf-8'>
|
||||||
@ -178,100 +178,3 @@ export const exportToWord = (
|
|||||||
downloadLink.click()
|
downloadLink.click()
|
||||||
document.body.removeChild(downloadLink)
|
document.body.removeChild(downloadLink)
|
||||||
}
|
}
|
||||||
|
|
||||||
export const exportDetailToWord = (formattedMeta: any, rawData: any, reportName: String) => {
|
|
||||||
const day = new Date().toLocaleString('id-ID', { weekday: 'long' })
|
|
||||||
const date = new Date().getDate()
|
|
||||||
const month = new Date().toLocaleString('id-ID', { month: 'long' })
|
|
||||||
const year = new Date().getFullYear()
|
|
||||||
const filename = 'Laporan Detail ' + reportName + '.doc'
|
|
||||||
|
|
||||||
const 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>Daftar Detail ${reportName}</title>
|
|
||||||
<style type="text/css" media="print">
|
|
||||||
@page Section1 {
|
|
||||||
size:841.95pt 21.0cm;
|
|
||||||
mso-page-orientation:landscape;
|
|
||||||
margin:1.0cm 1.0cm 1.0cm 1.0cm;
|
|
||||||
mso-header-margin:35.4pt;
|
|
||||||
mso-footer-margin:35.4pt;
|
|
||||||
mso-paper-source:0;
|
|
||||||
}
|
|
||||||
|
|
||||||
div.Section1 {
|
|
||||||
page:Section1;
|
|
||||||
}
|
|
||||||
|
|
||||||
table.meta tr td {
|
|
||||||
text-align: left;
|
|
||||||
}
|
|
||||||
|
|
||||||
table.main {
|
|
||||||
border-collapse: collapse;
|
|
||||||
width: 100%;
|
|
||||||
text-transform: uppercase;
|
|
||||||
font-size: 5px;
|
|
||||||
}
|
|
||||||
|
|
||||||
table.main thead tr {
|
|
||||||
background-color: #c0c0c0;
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
</head>
|
|
||||||
<body>
|
|
||||||
`
|
|
||||||
|
|
||||||
const body = `
|
|
||||||
<div class=Section1>
|
|
||||||
<header>
|
|
||||||
<h6>PT. PLN(Persero)</h6>
|
|
||||||
<br>
|
|
||||||
<table width="100%">
|
|
||||||
<tr>
|
|
||||||
<th><h6>${'DAFTAR DETAIL ' + reportName.toUpperCase()}</h6></th>
|
|
||||||
</tr>
|
|
||||||
<tr>
|
|
||||||
<th><h6>${`PERIODE TANGGAL : ${formattedMeta.dateFromFormat} SD TGL ${formattedMeta.dateToFormat}`}</h6></th>
|
|
||||||
</tr>
|
|
||||||
</table>
|
|
||||||
</header>
|
|
||||||
|
|
||||||
<br>
|
|
||||||
|
|
||||||
<table border="1" class="main">
|
|
||||||
<thead>
|
|
||||||
<tr>
|
|
||||||
${rawData.field.map((item: any) => `<th>${item}</th>`).join('')}
|
|
||||||
</tr>
|
|
||||||
</thead>
|
|
||||||
<tbody>
|
|
||||||
${rawData.rows
|
|
||||||
.map((row: any) => {
|
|
||||||
return `<tr>${row.map((item: any) => `<td>${item.content || item}</td>`).join('')}</tr>`
|
|
||||||
})
|
|
||||||
.join('')}
|
|
||||||
</tbody>
|
|
||||||
</table>
|
|
||||||
<br>
|
|
||||||
<footer>
|
|
||||||
<p style="text-align: right; font-size: 10px;">${day}, ${date}-${month}-${year}</p>
|
|
||||||
<br>
|
|
||||||
<p style="text-align: right; font-size: 10px;">(.........................................)</p>
|
|
||||||
</footer>
|
|
||||||
</div>
|
|
||||||
`
|
|
||||||
|
|
||||||
const postHtml = '</body></html>'
|
|
||||||
const html = preHtml + body + postHtml
|
|
||||||
const url = 'data:application/vnd.ms-word;charset=utf-8,' + encodeURIComponent(html)
|
|
||||||
const downloadLink = document.createElement('a')
|
|
||||||
|
|
||||||
document.body.appendChild(downloadLink)
|
|
||||||
downloadLink.href = url
|
|
||||||
downloadLink.download = filename
|
|
||||||
downloadLink.click()
|
|
||||||
document.body.removeChild(downloadLink)
|
|
||||||
}
|
|
||||||
|
@ -27,7 +27,7 @@ export const exportToWord = (
|
|||||||
}
|
}
|
||||||
|
|
||||||
i === 0
|
i === 0
|
||||||
? (column += `<td ${styleTotal} ${colSpan ? `${colSpan} style="font-weight: bold;` : ''} align="left">${content.content || content}</td>`)
|
? (column += `<th ${styleTotal} ${colSpan} align="left">${content.content || content}</th>`)
|
||||||
: (column += `<td ${styleTotal}>${content}</td>`)
|
: (column += `<td ${styleTotal}>${content}</td>`)
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -35,7 +35,7 @@ export const exportToWord = (
|
|||||||
tbody += column
|
tbody += column
|
||||||
}
|
}
|
||||||
|
|
||||||
const preHtml = `
|
let 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'>
|
<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>
|
<head>
|
||||||
<meta charset='utf-8'>
|
<meta charset='utf-8'>
|
||||||
|
@ -37,7 +37,7 @@ export const exportToWord = (
|
|||||||
tbody += column
|
tbody += column
|
||||||
}
|
}
|
||||||
|
|
||||||
const preHtml = `
|
let 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'>
|
<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>
|
<head>
|
||||||
<meta charset='utf-8'>
|
<meta charset='utf-8'>
|
||||||
@ -209,7 +209,7 @@ export const exportDetailToWord = (formattedMeta: any, rawData: any, reportName:
|
|||||||
const year = new Date().getFullYear()
|
const year = new Date().getFullYear()
|
||||||
const filename = 'Laporan Detail ' + reportName + '.doc'
|
const filename = 'Laporan Detail ' + reportName + '.doc'
|
||||||
|
|
||||||
const preHtml = `
|
let 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'>
|
<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>
|
<head>
|
||||||
<meta charset='utf-8'>
|
<meta charset='utf-8'>
|
||||||
|
@ -10,14 +10,14 @@ import { exportDetailToWord, exportToWord } from './doc/RGangguan_KTI_DOC'
|
|||||||
const reportName = 'Rekapitulasi Koreksi Transaksi Individual'
|
const reportName = 'Rekapitulasi Koreksi Transaksi Individual'
|
||||||
const fontSize = 5
|
const fontSize = 5
|
||||||
const detailFontSize = 3
|
const detailFontSize = 3
|
||||||
let metaReport: any = {}
|
var metaReport: any = {}
|
||||||
|
|
||||||
const formatData = (rawData: any) => {
|
const formatData = (rawData: any) => {
|
||||||
const { uid, up3, posko } = metaReport
|
const { uid, up3, posko } = metaReport
|
||||||
const formattedData: any = []
|
const formattedData: any = []
|
||||||
const total: any = {
|
const total: any = {
|
||||||
month1: 0,
|
month1: 0,
|
||||||
month2: 0,
|
month2: 1,
|
||||||
month3: 0,
|
month3: 0,
|
||||||
month4: 0,
|
month4: 0,
|
||||||
month5: 0,
|
month5: 0,
|
||||||
|
@ -16,7 +16,7 @@ const groupingData = (data: any, reportMeta: any) => {
|
|||||||
const groupedData: any = {}
|
const groupedData: any = {}
|
||||||
|
|
||||||
const reportMetaMapping: any = {
|
const reportMetaMapping: any = {
|
||||||
up3: 'nama_ulp',
|
ulp: 'nama_ulp',
|
||||||
uid: 'nama_up3',
|
uid: 'nama_up3',
|
||||||
default: 'nama_uid'
|
default: 'nama_uid'
|
||||||
}
|
}
|
||||||
@ -117,8 +117,8 @@ const groupingData = (data: any, reportMeta: any) => {
|
|||||||
}
|
}
|
||||||
|
|
||||||
const getTitle = (reportMeta: any) => {
|
const getTitle = (reportMeta: any) => {
|
||||||
if (reportMeta.up3.id != 0) {
|
if (reportMeta.ulp.id != 0) {
|
||||||
return 'nama_up3'
|
return 'nama_ulp'
|
||||||
}
|
}
|
||||||
|
|
||||||
if (reportMeta.uid.id != 0) {
|
if (reportMeta.uid.id != 0) {
|
||||||
|
@ -2,17 +2,20 @@ import { ref, computed } from 'vue'
|
|||||||
import { defineStore } from 'pinia'
|
import { defineStore } from 'pinia'
|
||||||
import { dispatchNotification } from '@/components/Notification'
|
import { dispatchNotification } from '@/components/Notification'
|
||||||
import { readData, removeData, writeData, writeDataJson } from '@/utils/storage'
|
import { readData, removeData, writeData, writeDataJson } from '@/utils/storage'
|
||||||
import { authenticateUser } from '@/utils/api/api.rest'
|
import router from '@/router'
|
||||||
|
|
||||||
export const useAuthStore = defineStore('auth', () => {
|
export const useAuthStore = defineStore('auth', () => {
|
||||||
|
// token from localStorage
|
||||||
const token = ref(readData('token') || '')
|
const token = ref(readData('token') || '')
|
||||||
|
// create a shared state
|
||||||
const username = ref('')
|
const username = ref('')
|
||||||
const password = ref('')
|
const password = ref('')
|
||||||
const isLoading = ref(false)
|
const isLoading = ref(false)
|
||||||
const isLoggedIn = computed(() => token.value !== '')
|
const isLoggedIn = computed(() => token.value !== '')
|
||||||
const filterPresets: any = ref({})
|
const filterPresets: any = ref({})
|
||||||
|
|
||||||
const login = async () => {
|
// define your actions
|
||||||
|
const login = () => {
|
||||||
if (username.value == '' || password.value == '') {
|
if (username.value == '' || password.value == '') {
|
||||||
dispatchNotification({
|
dispatchNotification({
|
||||||
title: 'Perhatian',
|
title: 'Perhatian',
|
||||||
@ -20,101 +23,53 @@ export const useAuthStore = defineStore('auth', () => {
|
|||||||
type: 'warning'
|
type: 'warning'
|
||||||
})
|
})
|
||||||
} else {
|
} else {
|
||||||
if (username.value == 'demo' && password.value == 'demo') {
|
// filterPresets.value = {
|
||||||
isLoading.value = true
|
// uid: {
|
||||||
setTimeout(() => {
|
// id: 2,
|
||||||
isLoading.value = false
|
// name: 'DISTRIBUSI JAKARTA RAYA'
|
||||||
if (username.value == 'demo' && password.value == 'demo') {
|
// },
|
||||||
writeData('token', 'secret-token')
|
// up3: {
|
||||||
|
// id: 4,
|
||||||
|
// name: 'UP3 MENTENG'
|
||||||
|
// },
|
||||||
|
// posko: {
|
||||||
|
// id: 541101,
|
||||||
|
// name: 'POSKO MENTENG'
|
||||||
|
// }
|
||||||
|
// }
|
||||||
|
|
||||||
dispatchNotification({
|
isLoading.value = true
|
||||||
title: 'Berhasil',
|
setTimeout(() => {
|
||||||
content: 'Login berhasil, selamat datang kembali!',
|
isLoading.value = false
|
||||||
type: 'success'
|
if (username.value == 'demo' && password.value == 'demo') {
|
||||||
})
|
// store token in localStorage
|
||||||
|
writeData('token', 'secret-token')
|
||||||
|
|
||||||
window.location.reload()
|
if (Object.keys(filterPresets.value).length > 0) {
|
||||||
} else {
|
writeDataJson('filterPresets', filterPresets.value)
|
||||||
dispatchNotification({
|
|
||||||
title: 'Login Gagal',
|
|
||||||
content: 'Username atau password salah',
|
|
||||||
type: 'error'
|
|
||||||
})
|
|
||||||
}
|
}
|
||||||
}, 3000)
|
|
||||||
} else {
|
|
||||||
isLoading.value = true
|
|
||||||
|
|
||||||
try {
|
dispatchNotification({
|
||||||
const response = await authenticateUser(username.value, password.value)
|
title: 'Berhasil',
|
||||||
|
content: 'Login berhasil, selamat datang kembali!',
|
||||||
if (response.status) {
|
type: 'success'
|
||||||
const data = response.user
|
})
|
||||||
|
// redirect to home page after login
|
||||||
writeData('token', 'secret-token')
|
window.location.reload()
|
||||||
writeData('user_name', data.username)
|
} else {
|
||||||
writeData('user_access', 'Petugas')
|
|
||||||
writeData('user_uid', data.namaUid)
|
|
||||||
|
|
||||||
handlePresets(data, filterPresets)
|
|
||||||
|
|
||||||
dispatchNotification({
|
|
||||||
title: 'Berhasil',
|
|
||||||
content: 'Login berhasil, selamat datang kembali!',
|
|
||||||
type: 'success'
|
|
||||||
})
|
|
||||||
|
|
||||||
window.location.reload()
|
|
||||||
} else {
|
|
||||||
dispatchNotification({
|
|
||||||
title: 'Login Gagal',
|
|
||||||
content: 'Username atau password salah',
|
|
||||||
type: 'error'
|
|
||||||
})
|
|
||||||
}
|
|
||||||
} catch (error) {
|
|
||||||
dispatchNotification({
|
dispatchNotification({
|
||||||
title: 'Login Gagal',
|
title: 'Login Gagal',
|
||||||
content: 'Terjadi kesalahan saat melakukan login',
|
content: 'Username atau password salah',
|
||||||
type: 'error'
|
type: 'error'
|
||||||
})
|
})
|
||||||
} finally {
|
|
||||||
isLoading.value = false
|
|
||||||
}
|
}
|
||||||
}
|
}, 3000)
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
const handlePresets = (data: any, filterPresets: any) => {
|
|
||||||
const keys = ['regional', 'uid', 'up3', 'posko', 'ulp']
|
|
||||||
let isChanged = false
|
|
||||||
|
|
||||||
for (const key of keys) {
|
|
||||||
const idKey = `id${key.charAt(0).toUpperCase() + key.slice(1)}`
|
|
||||||
const nameKey = `nama${key.charAt(0).toUpperCase() + key.slice(1)}`
|
|
||||||
|
|
||||||
if (data[nameKey] && data[idKey]) {
|
|
||||||
filterPresets.value[key] = {
|
|
||||||
id: data[idKey],
|
|
||||||
name: data[nameKey]
|
|
||||||
}
|
|
||||||
isChanged = true
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
console.log(filterPresets.value)
|
|
||||||
|
|
||||||
if (isChanged) {
|
|
||||||
writeDataJson('filterPresets', filterPresets.value)
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
const logout = () => {
|
const logout = () => {
|
||||||
removeData('token')
|
removeData('token')
|
||||||
removeData('filterPresets')
|
removeData('filterPresets')
|
||||||
removeData('user_name')
|
|
||||||
removeData('user_access')
|
|
||||||
removeData('user_uid')
|
|
||||||
}
|
}
|
||||||
|
|
||||||
return {
|
return {
|
||||||
|
@ -1,16 +1,11 @@
|
|||||||
import { computed } from 'vue'
|
import { computed } from 'vue';
|
||||||
import { defineStore } from 'pinia'
|
import { defineStore } from 'pinia';
|
||||||
import { readData } from '@/utils/storage'
|
|
||||||
|
|
||||||
export const useUserStore = defineStore('user', () => {
|
export const useUserStore = defineStore('user', () => {
|
||||||
const user_name = computed(() => readData('user_name') || 'Demo User')
|
const user_name = computed(() => localStorage.getItem('user_name') || 'Demo User')
|
||||||
const user_access = computed(() => readData('user_access') || 'Super Admin')
|
const user_access = computed(() => localStorage.getItem('user_access') || 'Super Admin')
|
||||||
const user_uid = computed(() => readData('user_uid') || 'Jakarta Raya')
|
const user_uid = computed(() => localStorage.getItem('user_uid') || 'Jakarta Raya')
|
||||||
const user_image = computed(
|
const user_image = computed(() => localStorage.getItem('user_image') || 'https://iidamidamerica.org/wp-content/uploads/2020/12/male-placeholder-image.jpeg')
|
||||||
() =>
|
|
||||||
readData('user_image') ||
|
|
||||||
'https://iidamidamerica.org/wp-content/uploads/2020/12/male-placeholder-image.jpeg'
|
|
||||||
)
|
|
||||||
|
|
||||||
return { user_name, user_access, user_image, user_uid }
|
return { user_name, user_access, user_image, user_uid }
|
||||||
})
|
})
|
@ -20,6 +20,7 @@ const instance = axios.create({
|
|||||||
})
|
})
|
||||||
|
|
||||||
export const getQueryString = (query: DocumentNode) => query.loc?.source.body!
|
export const getQueryString = (query: DocumentNode) => query.loc?.source.body!
|
||||||
|
|
||||||
export const requestGraphQl = async (query: DocumentNode, data: any) => {
|
export const requestGraphQl = async (query: DocumentNode, data: any) => {
|
||||||
return await instance.post('', {
|
return await instance.post('', {
|
||||||
query: getQueryString(query),
|
query: getQueryString(query),
|
||||||
@ -30,7 +31,7 @@ export const requestGraphQl = async (query: DocumentNode, data: any) => {
|
|||||||
export const apolloClient = () => {
|
export const apolloClient = () => {
|
||||||
const httpLink = createHttpLink({
|
const httpLink = createHttpLink({
|
||||||
uri: import.meta.env.VITE_APP_GRAPHQL_ENDPOINT,
|
uri: import.meta.env.VITE_APP_GRAPHQL_ENDPOINT,
|
||||||
credentials: 'include'
|
credentials: 'include' // Include credentials for cross-origin requests
|
||||||
})
|
})
|
||||||
|
|
||||||
const apolloClient = new ApolloClient({
|
const apolloClient = new ApolloClient({
|
||||||
@ -4009,7 +4010,6 @@ export const queries = {
|
|||||||
pembuatLaporan: $pembuatLaporan
|
pembuatLaporan: $pembuatLaporan
|
||||||
) {
|
) {
|
||||||
id
|
id
|
||||||
keterangan_pelapor
|
|
||||||
keterangan_dlpd
|
keterangan_dlpd
|
||||||
no_laporan
|
no_laporan
|
||||||
idpel_nometer
|
idpel_nometer
|
||||||
@ -4021,7 +4021,6 @@ export const queries = {
|
|||||||
nama_up3
|
nama_up3
|
||||||
nama_ulp
|
nama_ulp
|
||||||
nama_posko
|
nama_posko
|
||||||
#nama_petugas
|
|
||||||
id_regu
|
id_regu
|
||||||
nama_regu
|
nama_regu
|
||||||
waktu_lapor
|
waktu_lapor
|
||||||
@ -4052,7 +4051,6 @@ export const queries = {
|
|||||||
pembuatLaporan: $pembuatLaporan
|
pembuatLaporan: $pembuatLaporan
|
||||||
) {
|
) {
|
||||||
id
|
id
|
||||||
keterangan_pelapor
|
|
||||||
keterangan_dlpd
|
keterangan_dlpd
|
||||||
no_laporan
|
no_laporan
|
||||||
idpel_nometer
|
idpel_nometer
|
||||||
@ -4778,8 +4776,7 @@ export const queries = {
|
|||||||
nama_up3
|
nama_up3
|
||||||
id_ulp
|
id_ulp
|
||||||
nama_ulp
|
nama_ulp
|
||||||
no_laporan_anomali
|
no_laporan
|
||||||
no_laporan_referensi
|
|
||||||
referensi_marking
|
referensi_marking
|
||||||
waktu_lapor
|
waktu_lapor
|
||||||
waktu_response
|
waktu_response
|
||||||
|
@ -18,16 +18,6 @@ const getUp3 = async (uid: number) => await instance.get('/up3?uid=' + uid)
|
|||||||
const getUlp = async (up3: number) => await instance.get('/ulp?up3=' + up3)
|
const getUlp = async (up3: number) => await instance.get('/ulp?up3=' + up3)
|
||||||
const getPosko = async (uppp: number) => await instance.get('/posko?up3=' + uppp)
|
const getPosko = async (uppp: number) => await instance.get('/posko?up3=' + uppp)
|
||||||
const getVersion = async () => await ax.get('/version.json')
|
const getVersion = async () => await ax.get('/version.json')
|
||||||
|
|
||||||
const authenticateUser = async (username: string, password: string) => {
|
|
||||||
const res = await instance.post('/auth', {
|
|
||||||
username,
|
|
||||||
password
|
|
||||||
})
|
|
||||||
|
|
||||||
return res.data
|
|
||||||
}
|
|
||||||
|
|
||||||
export {
|
export {
|
||||||
getUid,
|
getUid,
|
||||||
getUp3,
|
getUp3,
|
||||||
@ -37,6 +27,5 @@ export {
|
|||||||
getJenisTransaksi,
|
getJenisTransaksi,
|
||||||
getUidRegional,
|
getUidRegional,
|
||||||
getRegional,
|
getRegional,
|
||||||
getVersion,
|
getVersion
|
||||||
authenticateUser
|
|
||||||
}
|
}
|
||||||
|
@ -10,22 +10,22 @@ export default defineConfig({
|
|||||||
vue({
|
vue({
|
||||||
template: {
|
template: {
|
||||||
compilerOptions: {
|
compilerOptions: {
|
||||||
isCustomElement: (tag) => ['lottie-player', 'center'].includes(tag)
|
isCustomElement: (tag) => ['lottie-player', 'center'].includes(tag),
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}),
|
}),
|
||||||
vueJsx()
|
vueJsx(),
|
||||||
],
|
],
|
||||||
resolve: {
|
resolve: {
|
||||||
alias: {
|
alias: {
|
||||||
'@': fileURLToPath(new URL('./src', import.meta.url))
|
'@': fileURLToPath(new URL('./src', import.meta.url)),
|
||||||
}
|
}
|
||||||
|
},
|
||||||
|
build: {
|
||||||
|
// outDir: 'build',
|
||||||
|
emptyOutDir: true,
|
||||||
|
chunkSizeWarningLimit: 4096,
|
||||||
|
// cssCodeSplit: true,
|
||||||
|
// cssMinify: true,
|
||||||
}
|
}
|
||||||
// build: {
|
|
||||||
// // outDir: 'build',
|
|
||||||
// // emptyOutDir: true,
|
|
||||||
// // chunkSizeWarningLimit: 4096,
|
|
||||||
// // cssCodeSplit: true,
|
|
||||||
// // cssMinify: true,
|
|
||||||
// }
|
|
||||||
})
|
})
|
||||||
|
Loading…
x
Reference in New Issue
Block a user