Add shading color to DxLoadPanel components

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

@@ -32,6 +32,7 @@
       <DxPaging :enabled="false" />
       <DxScrolling column-rendering-mode="virtual" mode="virtual" />
       <DxLoadPanel
+        shading-color="rgba(0,0,0,0.4)"
         :position="position"
         :show-indicator="showIndicator"
         :show-pane="showPane"
@@ -459,6 +460,7 @@
             :show-navigation-buttons="true"
           />
           <DxLoadPanel
+            shading-color="rgba(0,0,0,0.4)"
             :position="position"
             :show-indicator="showIndicator"
             :show-pane="showPane"
@@ -881,6 +883,7 @@ const getDetail = () => {
   loadingSubData.value = true
   const dateValue = filters.value.periode.split(' s/d ')
   const ref = dataSelected.value
+  const { posko, uid, up3 } = filters.value
 
   const query = {
     dateFrom: dateValue[0]
@@ -889,10 +892,10 @@ const getDetail = () => {
     dateTo: dateValue[1]
       ? dateValue[1].split('-').reverse().join('-')
       : new Date().toISOString().slice(0, 10),
-    posko: filters.value?.id_posko ? filters.value.id_posko : 0,
-    idUid: filters.value?.id_uid ? filters.value.id_uid : 0,
-    idUp3: filters.value?.id_up3 ? filters.value.id_up3 : 0,
-    idEquipment: ref?.kode ? ref.kode : 0
+    posko: posko ? posko.id : 0,
+    idUid: uid ? uid.id : 0,
+    idUp3: up3 ? up3.id : 0,
+    idEquipment: ref.kode ? ref.kode : 0
   }
 
   const { onResult, onError, loading, refetch } = useQuery(
@@ -902,7 +905,7 @@ const getDetail = () => {
 
   onResult((queryResult) => {
     if (queryResult.data != undefined) {
-      dataSub.value = queryResult.data.detailGangguan
+      dataSub.value = queryResult.data.detailGangguanJenisGangguanSE004
     }
   })
 
@@ -915,8 +918,9 @@ const getDetail = () => {
   })
 }
 
+const currentDataSelected = ref<any>(null)
 const showDetail = () => {
-  if (dataSelected.value != null) {
+  if (currentDataSelected.value === dataSelected.value) {
     dataSub.value = []
     dataSubSelected.value = null
     dialogDetail.value = true
@@ -926,6 +930,7 @@ const showDetail = () => {
 
 const onDataSelectionChanged = ({ selectedRowsData }: any) => {
   dataSelected.value = selectedRowsData[0]
+  currentDataSelected.value = selectedRowsData[0]
   showDetail()
 }