refs #6128 recharge photo

src/pages/Claim/Card/ClaimSummary.vue

@@ -1,5 +1,5 @@
 <script setup>
-import { onMounted, ref, computed } from 'vue';
+import { onMounted, ref, computed, watch } from 'vue';
 import { useRoute } from 'vue-router';
 import { useI18n } from 'vue-i18n';
 import { toDate, toCurrency } from 'src/filters';
@@ -26,12 +26,26 @@ const entityId = computed(() => $props.id || route.params.id);
 
 const claimUrl = ref();
 const salixUrl = ref();
+const claimDmsRef = ref();
+const claimDmsFilter = ref({
+    include: [
+        {
+            relation: 'dms',
+        },
+    ],
+    where: { claimFk: entityId.value },
+});
 
 onMounted(async () => {
     salixUrl.value = await getUrl('');
     claimUrl.value = salixUrl.value + `claim/${entityId.value}/`;
 });
 
+watch(entityId, async (id) => {
+    setDmsFilter(id);
+    await claimDmsRef.value.fetch();
+});
+
 const detailsColumns = ref([
     {
         name: 'item',
@@ -85,15 +99,10 @@ const detailsColumns = ref([
     },
 ]);
 
-const STATE_COLOR = {
-    pending: 'positive',
-
-    managed: 'warning',
-
-    resolved: 'negative',
-};
 function stateColor(code) {
-    return STATE_COLOR[code];
+    if (code === 'pending') return 'green';
+    if (code === 'managed') return 'orange';
+    if (code === 'resolved') return 'red';
 }
 
 const developmentColumns = ref([
@@ -131,18 +140,13 @@ const developmentColumns = ref([
 const claimDms = ref([]);
 const multimediaDialog = ref();
 const multimediaSlide = ref();
-const claimDmsFilter = ref({
-    include: [
-        {
-            relation: 'dms',
-        },
-    ],
-    where: { claimFk: entityId.value },
-});
+
+function setDmsFilter(id = entityId.value) {
+    claimDmsFilter.value.where = { claimFk: id };
+}
 
 function setClaimDms(data) {
-    if (!data) return;
-
+    claimDms.value = [];
     data.forEach((media) => {
         claimDms.value.push({
             isVideo: media.dms.contentType == 'video/mp4',
@@ -165,6 +169,7 @@ function openDialog(dmsId) {
         @on-fetch="(data) => setClaimDms(data)"
         limit="20"
         auto-load
+        ref="claimDmsRef"
     />
     <CardSummary ref="summary" :url="`Claims/${entityId}/getSummary`">
         <template #header="{ entity: { claim } }">