0
0
Fork 0

refs #6157 cardDescriptor

This commit is contained in:
Carlos Satorres 2023-10-25 14:06:15 +02:00
parent dfa29875d5
commit 8a6a3083a3
3 changed files with 31 additions and 17 deletions

View File

@ -1,5 +1,5 @@
<script setup> <script setup>
import { onMounted, useSlots, ref, watch, watchEffect } from 'vue'; import { computed, useSlots, ref, watch, watchEffect } from 'vue';
import { useI18n } from 'vue-i18n'; import { useI18n } from 'vue-i18n';
import axios from 'axios'; import axios from 'axios';
import SkeletonDescriptor from 'components/ui/SkeletonDescriptor.vue'; import SkeletonDescriptor from 'components/ui/SkeletonDescriptor.vue';
@ -25,7 +25,7 @@ const $props = defineProps({
}, },
subtitle: { subtitle: {
type: Number, type: Number,
default: 0, default: null,
}, },
}); });
const arrayData = useArrayData('claimData'); const arrayData = useArrayData('claimData');
@ -34,16 +34,15 @@ const slots = useSlots();
const { t } = useI18n(); const { t } = useI18n();
const entity = ref(null); const entity = ref(null);
let lastUrl = ref(null); let lastUrl = ref(null);
entity.value = arrayData.store.data; entity.value = computed(() => {
console.log('COMPUTED ', arrayData.store.data.id);
/// return arrayData.store.data;
onMounted(async () => {
//await fetch();
}); });
const emit = defineEmits(['onFetch']); const emit = defineEmits(['onFetch']);
async function fetch() { async function fetch() {
console.log('MY FETCH');
lastUrl.value = $props.url; lastUrl.value = $props.url;
const params = {}; const params = {};
@ -56,17 +55,26 @@ async function fetch() {
} }
watch($props, async () => { watch($props, async () => {
console.log(useArrayData('claimData'));
if (lastUrl.value == $props.url) return; if (lastUrl.value == $props.url) return;
entity.value = null; entity.value = null;
/* await fetch(); */ // await fetch();
}); });
watchEffect(() => { watchEffect(() => {
console.log(arrayData.store.data);
entity.value = arrayData.store.data; entity.value = arrayData.store.data;
}); });
async function myFn() {
const arrayData = useArrayData('claimData');
const store = arrayData.store;
console.log('myFn', store);
}
</script> </script>
<template> <template>
<QBtn @click="myFn()">a</QBtn>
<div class="descriptor"> <div class="descriptor">
<template v-if="entity"> <template v-if="entity">
<div class="header bg-primary q-pa-sm"> <div class="header bg-primary q-pa-sm">

View File

@ -1,10 +1,9 @@
<script setup> <script setup>
import { onMounted, computed } from 'vue'; import { onMounted, computed, watch, ref } from 'vue';
import { useRoute } from 'vue-router'; import { useRoute } from 'vue-router';
import { useI18n } from 'vue-i18n'; import { useI18n } from 'vue-i18n';
import { useStateStore } from 'stores/useStateStore'; import { useStateStore } from 'stores/useStateStore';
import { useArrayData } from 'src/composables/useArrayData'; import { useArrayData } from 'src/composables/useArrayData';
import { getUrl } from 'composables/getUrl';
import VnSearchbar from 'src/components/ui/VnSearchbar.vue'; import VnSearchbar from 'src/components/ui/VnSearchbar.vue';
import LeftMenu from 'components/LeftMenu.vue'; import LeftMenu from 'components/LeftMenu.vue';
import ClaimDescriptor from './ClaimDescriptor.vue'; import ClaimDescriptor from './ClaimDescriptor.vue';
@ -63,9 +62,14 @@ const $props = defineProps({
let salixUrl; let salixUrl;
onMounted(async () => { onMounted(async () => {
salixUrl = await getUrl(`claim/${entityId.value}`);
await arrayData.fetch({ append: false }); 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> </script>
<template> <template>

View File

@ -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() { function getWorkerAvatar() {
const token = getToken(); const token = getToken();
return `/api/Images/user/160x160/${route.params.id}/download?access_token=${token}`; return `/api/Images/user/160x160/${route.params.id}/download?access_token=${token}`;
} }
const data = ref(useCardDescription()); const data = ref(useCardDescription());
const setData = (entity) => const setData = (entity) => {
(data.value = useCardDescription(entity.user.nickname, entity.id)); console.log('entity ASDASD', entity);
data.value = useCardDescription(entity.user.nickname, entity.id);
};
</script> </script>
<template> <template>
<CardDescriptor <CardDescriptor
@ -90,8 +92,8 @@ const setData = (entity) =>
</QImg> </QImg>
</template> </template>
<template #body="{ entity }"> <template #body="{ entity }">
<VnLv :label="t('worker.card.name')" :value="entity.user.nickname" /> <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.email')" :value="entity.user?.email"> </VnLv>
<VnLv <VnLv
:label="t('worker.list.department')" :label="t('worker.list.department')"
:value="entity.department ? entity.department.department.name : null" :value="entity.department ? entity.department.department.name : null"