From 8a6a3083a3a969acfac8d3a673502ce145f05e06 Mon Sep 17 00:00:00 2001
From: carlossa <carlossa@verdnatura.es>
Date: Wed, 25 Oct 2023 14:06:15 +0200
Subject: [PATCH] refs #6157 cardDescriptor

---
 src/components/ui/CardDescriptor.vue       | 24 ++++++++++++++--------
 src/pages/Claim/Card/ClaimCard.vue         | 12 +++++++----
 src/pages/Worker/Card/WorkerDescriptor.vue | 12 ++++++-----
 3 files changed, 31 insertions(+), 17 deletions(-)

diff --git a/src/components/ui/CardDescriptor.vue b/src/components/ui/CardDescriptor.vue
index 82e0193d2..5356c964b 100644
--- a/src/components/ui/CardDescriptor.vue
+++ b/src/components/ui/CardDescriptor.vue
@@ -1,5 +1,5 @@
 <script setup>
-import { onMounted, useSlots, ref, watch, watchEffect } from 'vue';
+import { computed, useSlots, ref, watch, watchEffect } from 'vue';
 import { useI18n } from 'vue-i18n';
 import axios from 'axios';
 import SkeletonDescriptor from 'components/ui/SkeletonDescriptor.vue';
@@ -25,7 +25,7 @@ const $props = defineProps({
     },
     subtitle: {
         type: Number,
-        default: 0,
+        default: null,
     },
 });
 const arrayData = useArrayData('claimData');
@@ -34,16 +34,15 @@ const slots = useSlots();
 const { t } = useI18n();
 const entity = ref(null);
 let lastUrl = ref(null);
-entity.value = arrayData.store.data;
-
-///
-onMounted(async () => {
-    //await fetch();
+entity.value = computed(() => {
+    console.log('COMPUTED ', arrayData.store.data.id);
+    return arrayData.store.data;
 });
 
 const emit = defineEmits(['onFetch']);
 
 async function fetch() {
+    console.log('MY FETCH');
     lastUrl.value = $props.url;
     const params = {};
 
@@ -56,17 +55,26 @@ async function fetch() {
 }
 
 watch($props, async () => {
+    console.log(useArrayData('claimData'));
     if (lastUrl.value == $props.url) return;
     entity.value = null;
-    /* await fetch(); */
+    // await fetch();
 });
 
 watchEffect(() => {
+    console.log(arrayData.store.data);
     entity.value = arrayData.store.data;
 });
+
+async function myFn() {
+    const arrayData = useArrayData('claimData');
+    const store = arrayData.store;
+    console.log('myFn', store);
+}
 </script>
 
 <template>
+    <QBtn @click="myFn()">a</QBtn>
     <div class="descriptor">
         <template v-if="entity">
             <div class="header bg-primary q-pa-sm">
diff --git a/src/pages/Claim/Card/ClaimCard.vue b/src/pages/Claim/Card/ClaimCard.vue
index e205e9801..d29c28970 100644
--- a/src/pages/Claim/Card/ClaimCard.vue
+++ b/src/pages/Claim/Card/ClaimCard.vue
@@ -1,10 +1,9 @@
 <script setup>
-import { onMounted, computed } from 'vue';
+import { onMounted, computed, watch, ref } from 'vue';
 import { useRoute } from 'vue-router';
 import { useI18n } from 'vue-i18n';
 import { useStateStore } from 'stores/useStateStore';
 import { useArrayData } from 'src/composables/useArrayData';
-import { getUrl } from 'composables/getUrl';
 import VnSearchbar from 'src/components/ui/VnSearchbar.vue';
 import LeftMenu from 'components/LeftMenu.vue';
 import ClaimDescriptor from './ClaimDescriptor.vue';
@@ -63,9 +62,14 @@ const $props = defineProps({
 let salixUrl;
 
 onMounted(async () => {
-    salixUrl = await getUrl(`claim/${entityId.value}`);
     await arrayData.fetch({ append: false });
-    console.log('store', arrayData.store.data);
+    watch(
+        () => route.params.id,
+        async (id) => {
+            arrayData.store.url = `Claims/${id}`;
+            await arrayData.fetch({ append: false });
+        }
+    );
 });
 </script>
 <template>
diff --git a/src/pages/Worker/Card/WorkerDescriptor.vue b/src/pages/Worker/Card/WorkerDescriptor.vue
index ba64a5abb..2faa714ef 100644
--- a/src/pages/Worker/Card/WorkerDescriptor.vue
+++ b/src/pages/Worker/Card/WorkerDescriptor.vue
@@ -47,15 +47,17 @@ const filter = {
     ],
 };
 
-const sip = computed(() => worker.value.sip && worker.value.sip.extension);
+const sip = computed(() => worker.value?.sip && worker.value.sip.extension);
 
 function getWorkerAvatar() {
     const token = getToken();
     return `/api/Images/user/160x160/${route.params.id}/download?access_token=${token}`;
 }
 const data = ref(useCardDescription());
-const setData = (entity) =>
-    (data.value = useCardDescription(entity.user.nickname, entity.id));
+const setData = (entity) => {
+    console.log('entity ASDASD', entity);
+    data.value = useCardDescription(entity.user.nickname, entity.id);
+};
 </script>
 <template>
     <CardDescriptor
@@ -90,8 +92,8 @@ const setData = (entity) =>
             </QImg>
         </template>
         <template #body="{ entity }">
-            <VnLv :label="t('worker.card.name')" :value="entity.user.nickname" />
-            <VnLv :label="t('worker.card.email')" :value="entity.user.email"> </VnLv>
+            <VnLv :label="t('worker.card.name')" :value="entity.user?.nickname" />
+            <VnLv :label="t('worker.card.email')" :value="entity.user?.email"> </VnLv>
             <VnLv
                 :label="t('worker.list.department')"
                 :value="entity.department ? entity.department.department.name : null"