Update calculateCellValue to calculate-display-value in multiple files

src/components/Pages/Keluhan/Rekap/RKeluhan_BerdasarMedia.vue

@@ -49,7 +49,7 @@
       <DxColumn
         :width="100"
         alignment="center"
-        :calculateCellValue="(item: any) => data.findIndex((i) => i == item) + 1"
+        :calculate-display-value="(item: any) => data.findIndex((i) => i == item) + 1"
         caption="NO"
         css-class="custom-table-column"
         data-field="no"
@@ -102,7 +102,7 @@
       </DxSummary>
 
       <template #formatNumber="{ data }">
-        <p class="!text-right cursor-pointer">
+        <p class="!text-right cursor-pointer" @click="setDate(data.column.caption)">
           {{
             isNumber(data.text)
               ? data.column.caption == '%'
@@ -114,7 +114,7 @@
       </template>
 
       <template #formatText="{ data }">
-        <p class="text-left cursor-pointer">
+        <p class="text-left cursor-pointer" @click="setDate(data.column.caption)">
           {{ data.text }}
         </p>
       </template>
@@ -174,7 +174,7 @@
             css-class="custom-table-column"
             :width="50"
             alignment="center"
-            :calculateCellValue="(item: any) => dataSub.findIndex((i) => i == item) + 1"
+            :calculate-display-value="(item: any) => dataSub.findIndex((i) => i == item) + 1"
             data-type="number"
             caption="No"
             cell-template="formatNumber"
@@ -508,6 +508,19 @@ const dialogDetail = ref(false)
 const closedialogDetail = () => (dialogDetail.value = false)
 const loadingData = ref(false)
 const loadingSubData = ref(false)
+const date = ref('2023-02-04')
+
+const setDate = (value: any) => {
+  if (isNumber(value)) {
+    const tanggal = value < 10 ? `0${value}` : value
+    const dateValue = filters.value.periode.split(' s/d ')
+    const dateYear = dateValue[0].split('-').reverse().join('-').slice(0, -2) + tanggal
+    console.log('date', dateYear)
+    date.value = dateYear
+  } else {
+    date.value = ''
+  }
+}
 
 const filterData = async (params: any) => {
   const dateValue = params.periode.split(' s/d ')
@@ -556,7 +569,12 @@ const getDetail = async () => {
       : new Date().toISOString().slice(0, 10),
     idUlp: selected?.id_ulp ? selected?.id_ulp : 0,
     idUid: selected?.id_uid ? selected?.id_uid : 0,
-    idUp3: selected?.id_up3 ? selected?.id_up3 : 0
+    idUp3: selected?.id_up3 ? selected?.id_up3 : 0,
+    isSelesai: 0,
+    media: selected?.media ? selected?.media : '',
+    tanggal: date.value,
+    namaIssuetype: '',
+    namaSubissuetype: ''
   }
 
   loadingSubData.value = true
@@ -620,7 +638,10 @@ const onExporting = (e: any) => {
 const onDataSelectionChanged = ({ selectedRowsData }: any) => {
   if (selectedRowsData[0] != undefined) {
     dataSelected.value = selectedRowsData[0]
-    showDetail()
+
+    if (date.value != '') {
+      showDetail()
+    }
   }
 }