Refactor code to improve readability and fix bugs in Gangguan and Monalisa components

src/components/Pages/Gangguan/Rekap/RGangguan_DMAPKT.vue

@@ -334,13 +334,13 @@
       </DxColumn>
 
       <template #formatText="{ data }">
-        <p class="text-left cursor-pointer">
+        <p class="text-left" @click="setAgreementDialog(data.column.caption)">
           {{ data.text }}
         </p>
       </template>
 
       <template #formatNumber="{ data }">
-        <p class="text-right cursor-pointer">
+        <p class="text-right cursor-pointer" @click="setAgreementDialog(data.column.caption)">
           {{
             isNumber(data.text)
               ? data.column.caption == '%'
@@ -352,13 +352,13 @@
       </template>
 
       <template #formatPercentage="{ data }">
-        <p class="text-right cursor-pointer">
+        <p class="text-right" @click="setAgreementDialog(data.column.caption)">
           {{ parseFloat(data.text) ? formatPercentage(data.text) : '0%' }}
         </p>
       </template>
 
       <template #formatTime="{ data }">
-        <p class="!text-right cursor-pointer">
+        <p class="!text-right" @click="setAgreementDialog(data.column.caption)">
           {{ parseInt(data.text) ? formatWaktu(data.text) : '-' }}
         </p>
       </template>
@@ -796,6 +796,8 @@ const dataSubSelected = ref<any>()
 const dialogDetail = ref(false)
 const loadingData = ref(false)
 const loadingSubData = ref(false)
+const progressSelected = ref(0)
+const agreeToShowDialog = ref(false)
 const reportMeta = ref({
   uid: { id: 0, name: 'Semua Unit Induk Distribusi/Wilayah' },
   up3: { id: 0, name: 'Semua Unit Pelaksanaan Pelayanan Pelanggan' },
@@ -803,6 +805,21 @@ const reportMeta = ref({
   periode: ''
 })
 
+const setAgreementDialog = (column: string) => {
+  if (column == 'd=(e+g)' || column == 'e' || column == 'g') {
+    agreeToShowDialog.value = true
+    if (column == 'd=(e+g)') {
+      progressSelected.value = 0
+    } else if (column == 'e') {
+      progressSelected.value = 1
+    } else {
+      progressSelected.value = 2
+    }
+  } else {
+    agreeToShowDialog.value = false
+  }
+}
+
 const getDetail = async () => {
   loadingSubData.value = true
   const dateValue = filters.value.periode.split(' s/d ')
@@ -819,7 +836,8 @@ const getDetail = async () => {
     posko: posko ? posko.id : 0,
     idUid: uid ? uid.id : 0,
     idUp3: up3 ? up3.id : 0,
-    idRegu: ref.id_regu
+    idRegu: ref?.id_regu ? ref.id_regu : 0,
+    isSelesai: progressSelected.value
   }
 
   await requestGraphQl(queries.gangguan.rekap.gangguanDiselesaikanMobileAPKTDetail, query)
@@ -846,10 +864,11 @@ const clearSelection = () => {
 }
 const showDetail = () => {
   clearSelection()
-  dataSub.value = []
-  dataSubSelected.value = null
-  // dialogDetail.value = true
-  getDetail()
+  if (agreeToShowDialog.value) {
+    dataSub.value = []
+    dataSubSelected.value = null
+    getDetail()
+  }
 }
 
 const closeDialog = () => {