fix: transaksi

package.json

@@ -1 +1 @@
-{"name":"eis","version":"0.0.189-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.190-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"}}

public/version.json

@@ -1 +1 @@
-{"version":"0.0.189-vm"}
+{"version":"0.0.190-vm"}

src/components/Pages/Transaksi/Transaksi.vue

@@ -1,7 +1,7 @@
 <template>
   <div class="flex flex-row items-center w-full mb-6 space-x-4">
     <button
-      @click="tab = 'gangguan'"
+      @click="changeTab('gangguan')"
       type="button"
       class="px-1 py-4 text-sm"
       :class="[
@@ -13,7 +13,7 @@
       Gangguan: Transaksi Aktif > SLA
     </button>
     <button
-      @click="tab = 'keluhan'"
+      @click="changeTab('keluhan')"
       type="button"
       class="px-1 py-4 text-sm"
       :class="[
@@ -179,7 +179,6 @@
         cell-template="formatText"
       />
       <DxColumn
-        v-if="tab == 'keluhan'"
         :width="170"
         alignment="center"
         data-field="status_akhir"
@@ -188,7 +187,6 @@
         cell-template="formatText"
       />
       <DxColumn
-        v-if="tab == 'keluhan'"
         :width="170"
         alignment="center"
         data-field="durasi_time"
@@ -196,6 +194,14 @@
         css-class="custom-table-column"
         cell-template="formatTime"
       />
+      <DxColumn
+        :width="170"
+        alignment="center"
+        data-field="email_pelapor"
+        caption="Email"
+        css-class="custom-table-column"
+        cell-template="formatText"
+      />
 
       <template #formatText="{ data }">
         <p class="text-left">
@@ -274,6 +280,11 @@ const reportMeta = ref({
   periode: ''
 })
 
+const changeTab = (newTab: string) => {
+  tab.value = newTab
+  data.value = []
+}
+
 const formatMetaData = (reportMeta: any) => {
   const periode = reportMeta.periode ? reportMeta.periode.split(' s/d ') : ''
 
@@ -305,31 +316,12 @@ const onExporting = (e: any) => {
   const worksheet = workbook.addWorksheet('Transaksi APKT')
 
   setHeaderStyle(worksheet, 1, 1, 'PT. PLN(Persero)')
-  setHeaderStyle(
+
-    worksheet,
+  setHeaderStyle(worksheet, 3, 1, 'Transaksi APKT'.toUpperCase(), true)
-    2,
-    1,
-    `UNIT PLN : ${reportMeta.value.uid.id ? reportMeta.value.uid.name.toUpperCase() + ',' : ''} ${reportMeta.value.up3.id ? reportMeta.value.up3.name.toUpperCase() + ',' : ''} ${reportMeta.value.ulp.id ? reportMeta.value.ulp.name.toUpperCase() + ',' : ''}`
-  )
-  setHeaderStyle(
-    worksheet,
-    3,
-    1,
-    `STATUS : ${reportMeta.value.status ? reportMeta.value.status.name.toUpperCase() : ''}`
-  )
   setHeaderStyle(
     worksheet,
     4,
     1,
-    `SLA : ${reportMeta.value.sla ? reportMeta.value.sla.name.toUpperCase() : ''}`
-  )
-  setHeaderStyle(worksheet, 5, 1, `PENCARIAN : ${reportMeta.value.keyword.toUpperCase()}`)
-
-  setHeaderStyle(worksheet, 7, 1, 'Transaksi APKT'.toUpperCase(), true)
-  setHeaderStyle(
-    worksheet,
-    8,
-    1,
     `PERIODE TANGGAL : ${meta.dateFromFormat} SD TGL ${meta.dateToFormat}`,
     true
   )
@@ -338,15 +330,12 @@ const onExporting = (e: any) => {
   worksheet.mergeCells('A2:M2')
   worksheet.mergeCells('A3:M3')
   worksheet.mergeCells('A4:M4')
-  worksheet.mergeCells('A5:M5')
-  worksheet.mergeCells('A7:M7')
-  worksheet.mergeCells('A8:M8')
 
   exportToExcel({
     component: e.component,
     worksheet,
     autoFilterEnabled: true,
-    topLeftCell: { row: 10, column: 1 },
+    topLeftCell: { row: 6, column: 1 },
     loadPanel: {
       enabled: false
     }