From 1139035e4583310d6c4d6bb4b17453414758081a Mon Sep 17 00:00:00 2001
From: alexm <alexm@verdnatura.es>
Date: Fri, 14 Mar 2025 09:13:45 +0100
Subject: [PATCH] refactor: refs #8463 replace CardDescriptor with
 EntityDescriptor in multiple components

---
 src/components/common/VnCard.vue              |  4 +-
 src/components/ui/CardDescriptor.vue          | 78 +++++--------------
 src/components/ui/CardDescriptorBeta.vue      | 38 ---------
 src/components/ui/EntityDescriptor.vue        | 78 +++++++++++++++++++
 src/components/ui/VnDescriptor.vue            |  6 +-
 .../Account/Alias/Card/AliasDescriptor.vue    |  6 +-
 src/pages/Account/Card/AccountDescriptor.vue  |  6 +-
 .../Account/Role/Card/RoleDescriptor.vue      |  6 +-
 src/pages/Claim/Card/ClaimDescriptor.vue      |  6 +-
 .../Customer/Card/CustomerDescriptor.vue      |  6 +-
 src/pages/Entry/Card/EntryDescriptor.vue      |  6 +-
 .../InvoiceIn/Card/InvoiceInDescriptor.vue    |  6 +-
 .../InvoiceOut/Card/InvoiceOutDescriptor.vue  |  6 +-
 src/pages/Item/Card/ItemDescriptor.vue        |  6 +-
 .../Item/ItemType/Card/ItemTypeDescriptor.vue |  6 +-
 src/pages/Order/Card/OrderDescriptor.vue      |  6 +-
 .../Route/Agency/Card/AgencyDescriptor.vue    |  6 +-
 src/pages/Route/Card/RouteDescriptor.vue      |  6 +-
 src/pages/Route/Roadmap/RoadmapDescriptor.vue |  6 +-
 .../Route/Vehicle/Card/VehicleDescriptor.vue  |  6 +-
 .../Shelving/Card/ShelvingDescriptor.vue      |  6 +-
 .../Parking/Card/ParkingDescriptor.vue        |  6 +-
 .../Supplier/Card/SupplierDescriptor.vue      |  6 +-
 src/pages/Ticket/Card/TicketDescriptor.vue    |  6 +-
 src/pages/Travel/Card/TravelDescriptor.vue    |  6 +-
 src/pages/Worker/Card/WorkerDescriptor.vue    |  6 +-
 .../Department/Card/DepartmentDescriptor.vue  |  6 +-
 src/pages/Zone/Card/ZoneDescriptor.vue        |  6 +-
 28 files changed, 171 insertions(+), 171 deletions(-)
 delete mode 100644 src/components/ui/CardDescriptorBeta.vue
 create mode 100644 src/components/ui/EntityDescriptor.vue

diff --git a/src/components/common/VnCard.vue b/src/components/common/VnCard.vue
index 4848f1490..21cdc9df5 100644
--- a/src/components/common/VnCard.vue
+++ b/src/components/common/VnCard.vue
@@ -73,10 +73,10 @@ function hasRouteParam(params, valueToCheck = ':addressId') {
 }
 </script>
 <template>
-    <span v-if="visual">
+    <template v-if="visual">
         <VnSubToolbar />
         <div :class="[useCardSize(), $attrs.class]">
             <RouterView :key="$route.path" />
         </div>
-    </span>
+    </template>
 </template>
diff --git a/src/components/ui/CardDescriptor.vue b/src/components/ui/CardDescriptor.vue
index a5dced551..5f9a89d64 100644
--- a/src/components/ui/CardDescriptor.vue
+++ b/src/components/ui/CardDescriptor.vue
@@ -1,76 +1,36 @@
 <script setup>
-import { onBeforeMount, watch, computed, ref } from 'vue';
-import { useArrayData } from 'composables/useArrayData';
-import { useState } from 'src/composables/useState';
-import { useRoute } from 'vue-router';
+import { ref } from 'vue';
 import VnDescriptor from './VnDescriptor.vue';
 
 const $props = defineProps({
-    url: {
-        type: String,
-        default: '',
+    id: {
+        type: Number,
+        default: false,
     },
-    filter: {
+    card: {
         type: Object,
         default: null,
     },
-    dataKey: {
-        type: String,
-        default: null,
-    },
 });
 
-const state = useState();
-const route = useRoute();
-let arrayData;
-let store;
-let entity;
-const isLoading = ref(false);
-const isSameDataKey = computed(() => $props.dataKey === route.meta.moduleName);
-defineExpose({ getData });
-
-onBeforeMount(async () => {
-    arrayData = useArrayData($props.dataKey, {
-        url: $props.url,
-        userFilter: $props.filter,
-        skip: 0,
-        oneRecord: true,
-    });
-    store = arrayData.store;
-    entity = computed(() => {
-        const data = store.data ?? {};
-        if (data) emit('onFetch', data);
-        return data;
-    });
-
-    // It enables to load data only once if the module is the same as the dataKey
-    if (!isSameDataKey.value || !route.params.id) await getData();
-    watch(
-        () => [$props.url, $props.filter],
-        async () => {
-            if (!isSameDataKey.value) await getData();
-        },
-    );
-});
-
-async function getData() {
-    store.url = $props.url;
-    store.filter = $props.filter ?? {};
-    isLoading.value = true;
-    try {
-        const { data } = await arrayData.fetch({ append: false, updateRouter: false });
-        state.set($props.dataKey, data);
-        emit('onFetch', data);
-    } finally {
-        isLoading.value = false;
-    }
-}
-
 const emit = defineEmits(['onFetch']);
+const entity = ref();
 </script>
 
 <template>
-    <VnDescriptor v-model="entity" v-bind="$attrs" :module="dataKey">
+    <component
+        :is="card"
+        :id
+        :visual="false"
+        v-bind="$attrs"
+        @on-fetch="
+            (data) => {
+                entity = data;
+                emit('onFetch', data);
+            }
+        "
+    />
+    <VnDescriptor v-model="entity" v-bind="$attrs">
         <template v-for="(_, slotName) in $slots" #[slotName]="slotData" :key="slotName">
             <slot :name="slotName" v-bind="slotData ?? {}" :key="slotName" />
         </template>
diff --git a/src/components/ui/CardDescriptorBeta.vue b/src/components/ui/CardDescriptorBeta.vue
deleted file mode 100644
index 5f9a89d64..000000000
--- a/src/components/ui/CardDescriptorBeta.vue
+++ /dev/null
@@ -1,38 +0,0 @@
-<script setup>
-import { ref } from 'vue';
-import VnDescriptor from './VnDescriptor.vue';
-
-const $props = defineProps({
-    id: {
-        type: Number,
-        default: false,
-    },
-    card: {
-        type: Object,
-        default: null,
-    },
-});
-
-const emit = defineEmits(['onFetch']);
-const entity = ref();
-</script>
-
-<template>
-    <component
-        :is="card"
-        :id
-        :visual="false"
-        v-bind="$attrs"
-        @on-fetch="
-            (data) => {
-                entity = data;
-                emit('onFetch', data);
-            }
-        "
-    />
-    <VnDescriptor v-model="entity" v-bind="$attrs">
-        <template v-for="(_, slotName) in $slots" #[slotName]="slotData" :key="slotName">
-            <slot :name="slotName" v-bind="slotData ?? {}" :key="slotName" />
-        </template>
-    </VnDescriptor>
-</template>
diff --git a/src/components/ui/EntityDescriptor.vue b/src/components/ui/EntityDescriptor.vue
new file mode 100644
index 000000000..a5dced551
--- /dev/null
+++ b/src/components/ui/EntityDescriptor.vue
@@ -0,0 +1,78 @@
+<script setup>
+import { onBeforeMount, watch, computed, ref } from 'vue';
+import { useArrayData } from 'composables/useArrayData';
+import { useState } from 'src/composables/useState';
+import { useRoute } from 'vue-router';
+import VnDescriptor from './VnDescriptor.vue';
+
+const $props = defineProps({
+    url: {
+        type: String,
+        default: '',
+    },
+    filter: {
+        type: Object,
+        default: null,
+    },
+    dataKey: {
+        type: String,
+        default: null,
+    },
+});
+
+const state = useState();
+const route = useRoute();
+let arrayData;
+let store;
+let entity;
+const isLoading = ref(false);
+const isSameDataKey = computed(() => $props.dataKey === route.meta.moduleName);
+defineExpose({ getData });
+
+onBeforeMount(async () => {
+    arrayData = useArrayData($props.dataKey, {
+        url: $props.url,
+        userFilter: $props.filter,
+        skip: 0,
+        oneRecord: true,
+    });
+    store = arrayData.store;
+    entity = computed(() => {
+        const data = store.data ?? {};
+        if (data) emit('onFetch', data);
+        return data;
+    });
+
+    // It enables to load data only once if the module is the same as the dataKey
+    if (!isSameDataKey.value || !route.params.id) await getData();
+    watch(
+        () => [$props.url, $props.filter],
+        async () => {
+            if (!isSameDataKey.value) await getData();
+        },
+    );
+});
+
+async function getData() {
+    store.url = $props.url;
+    store.filter = $props.filter ?? {};
+    isLoading.value = true;
+    try {
+        const { data } = await arrayData.fetch({ append: false, updateRouter: false });
+        state.set($props.dataKey, data);
+        emit('onFetch', data);
+    } finally {
+        isLoading.value = false;
+    }
+}
+
+const emit = defineEmits(['onFetch']);
+</script>
+
+<template>
+    <VnDescriptor v-model="entity" v-bind="$attrs" :module="dataKey">
+        <template v-for="(_, slotName) in $slots" #[slotName]="slotData" :key="slotName">
+            <slot :name="slotName" v-bind="slotData ?? {}" :key="slotName" />
+        </template>
+    </VnDescriptor>
+</template>
diff --git a/src/components/ui/VnDescriptor.vue b/src/components/ui/VnDescriptor.vue
index 2e6d98f16..7ca9a3a1e 100644
--- a/src/components/ui/VnDescriptor.vue
+++ b/src/components/ui/VnDescriptor.vue
@@ -118,7 +118,7 @@ const toModule = computed(() => {
                     </QBtn>
                 </slot>
                 <QBtn
-                    @click.stop="viewSummary(entity.id, $props.summary, $props.width)"
+                    @click.stop="viewSummary(entity.id, summary, width)"
                     round
                     flat
                     dense
@@ -158,8 +158,8 @@ const toModule = computed(() => {
                 <QList dense>
                     <QItemLabel header class="ellipsis text-h5" :lines="1">
                         <div class="title">
-                            <span v-if="$props.title" :title="getValueFromPath(title)">
-                                {{ getValueFromPath(title) ?? $props.title }}
+                            <span v-if="title" :title="getValueFromPath(title)">
+                                {{ getValueFromPath(title) ?? title }}
                             </span>
                             <slot v-else name="description" :entity="entity">
                                 <span :title="entity.name">
diff --git a/src/pages/Account/Alias/Card/AliasDescriptor.vue b/src/pages/Account/Alias/Card/AliasDescriptor.vue
index 671ef7fbc..c9fdf9540 100644
--- a/src/pages/Account/Alias/Card/AliasDescriptor.vue
+++ b/src/pages/Account/Alias/Card/AliasDescriptor.vue
@@ -4,7 +4,7 @@ import { useRoute, useRouter } from 'vue-router';
 import { useI18n } from 'vue-i18n';
 import { useQuasar } from 'quasar';
 
-import CardDescriptor from 'components/ui/CardDescriptor.vue';
+import EntityDescriptor from 'components/ui/EntityDescriptor.vue';
 import VnLv from 'src/components/ui/VnLv.vue';
 
 import axios from 'axios';
@@ -48,7 +48,7 @@ const removeAlias = () => {
 </script>
 
 <template>
-    <CardDescriptor
+    <EntityDescriptoror
         ref="descriptor"
         :url="`MailAliases/${entityId}`"
         data-key="Alias"
@@ -62,7 +62,7 @@ const removeAlias = () => {
         <template #body="{ entity }">
             <VnLv :label="t('role.description')" :value="entity.description" />
         </template>
-    </CardDescriptor>
+    </EntityDescriptoror>
 </template>
 
 <i18n>
diff --git a/src/pages/Account/Card/AccountDescriptor.vue b/src/pages/Account/Card/AccountDescriptor.vue
index 49328fe87..5537c9693 100644
--- a/src/pages/Account/Card/AccountDescriptor.vue
+++ b/src/pages/Account/Card/AccountDescriptor.vue
@@ -1,7 +1,7 @@
 <script setup>
 import { ref, computed, onMounted } from 'vue';
 import { useRoute } from 'vue-router';
-import CardDescriptor from 'components/ui/CardDescriptor.vue';
+import EntityDescriptor from 'components/ui/EntityDescriptor.vue';
 import VnLv from 'src/components/ui/VnLv.vue';
 import AccountDescriptorMenu from './AccountDescriptorMenu.vue';
 import VnImg from 'src/components/ui/VnImg.vue';
@@ -20,7 +20,7 @@ onMounted(async () => {
 </script>
 
 <template>
-    <CardDescriptor
+    <EntityDescriptoror
         ref="descriptor"
         :url="`VnUsers/preview`"
         :filter="{ ...filter, where: { id: entityId } }"
@@ -78,7 +78,7 @@ onMounted(async () => {
                 </QIcon>
             </QCardActions>
         </template>
-    </CardDescriptor>
+    </EntityDescriptoror>
 </template>
 <style scoped>
 .q-item__label {
diff --git a/src/pages/Account/Role/Card/RoleDescriptor.vue b/src/pages/Account/Role/Card/RoleDescriptor.vue
index 517517af0..b364001b6 100644
--- a/src/pages/Account/Role/Card/RoleDescriptor.vue
+++ b/src/pages/Account/Role/Card/RoleDescriptor.vue
@@ -2,7 +2,7 @@
 import { computed } from 'vue';
 import { useRoute } from 'vue-router';
 import { useI18n } from 'vue-i18n';
-import CardDescriptor from 'components/ui/CardDescriptor.vue';
+import EntityDescriptor from 'components/ui/EntityDescriptor.vue';
 import VnLv from 'src/components/ui/VnLv.vue';
 import axios from 'axios';
 import useNotify from 'src/composables/useNotify.js';
@@ -32,7 +32,7 @@ const removeRole = async () => {
 </script>
 
 <template>
-    <CardDescriptor
+    <EntityDescriptoror
         url="VnRoles"
         :filter="{ where: { id: entityId } }"
         data-key="Role"
@@ -46,7 +46,7 @@ const removeRole = async () => {
         <template #body="{ entity }">
             <VnLv :label="t('role.description')" :value="entity.description" />
         </template>
-    </CardDescriptor>
+    </EntityDescriptoror>
 </template>
 <style scoped>
 .q-item__label {
diff --git a/src/pages/Claim/Card/ClaimDescriptor.vue b/src/pages/Claim/Card/ClaimDescriptor.vue
index d789b63d3..e3eeade83 100644
--- a/src/pages/Claim/Card/ClaimDescriptor.vue
+++ b/src/pages/Claim/Card/ClaimDescriptor.vue
@@ -6,7 +6,7 @@ import { toDateHourMinSec, toPercentage } from 'src/filters';
 import TicketDescriptorProxy from 'pages/Ticket/Card/TicketDescriptorProxy.vue';
 import ClaimDescriptorMenu from 'pages/Claim/Card/ClaimDescriptorMenu.vue';
 import DepartmentDescriptorProxy from 'src/pages/Worker/Department/Card/DepartmentDescriptorProxy.vue';
-import CardDescriptor from 'components/ui/CardDescriptor.vue';
+import EntityDescriptor from 'components/ui/EntityDescriptor.vue';
 import VnLv from 'src/components/ui/VnLv.vue';
 import VnUserLink from 'src/components/ui/VnUserLink.vue';
 import { getUrl } from 'src/composables/getUrl';
@@ -44,7 +44,7 @@ onMounted(async () => {
 </script>
 
 <template>
-    <CardDescriptor
+    <EntityDescriptoror
         :url="`Claims/${entityId}`"
         :filter="filter"
         title="client.name"
@@ -147,7 +147,7 @@ onMounted(async () => {
                 </QBtn>
             </QCardActions>
         </template>
-    </CardDescriptor>
+    </EntityDescriptoror>
 </template>
 <style scoped>
 .q-item__label {
diff --git a/src/pages/Customer/Card/CustomerDescriptor.vue b/src/pages/Customer/Card/CustomerDescriptor.vue
index 8978c00f1..7696f086c 100644
--- a/src/pages/Customer/Card/CustomerDescriptor.vue
+++ b/src/pages/Customer/Card/CustomerDescriptor.vue
@@ -7,7 +7,7 @@ import { toCurrency, toDate } from 'src/filters';
 
 import useCardDescription from 'src/composables/useCardDescription';
 
-import CardDescriptor from 'components/ui/CardDescriptor.vue';
+import EntityDescriptor from 'components/ui/EntityDescriptor.vue';
 import VnLv from 'src/components/ui/VnLv.vue';
 import CustomerDescriptorMenu from './CustomerDescriptorMenu.vue';
 import DepartmentDescriptorProxy from 'src/pages/Worker/Department/Card/DepartmentDescriptorProxy.vue';
@@ -54,7 +54,7 @@ const debtWarning = computed(() => {
 </script>
 
 <template>
-    <CardDescriptor
+    <EntityDescriptoror
         :url="`Clients/${entityId}/getCard`"
         :summary="$props.summary"
         data-key="Customer"
@@ -232,7 +232,7 @@ const debtWarning = computed(() => {
                 </QBtn>
             </QCardActions>
         </template>
-    </CardDescriptor>
+    </EntityDescriptoror>
 </template>
 
 <i18n>
diff --git a/src/pages/Entry/Card/EntryDescriptor.vue b/src/pages/Entry/Card/EntryDescriptor.vue
index 313ed3d72..962f777ce 100644
--- a/src/pages/Entry/Card/EntryDescriptor.vue
+++ b/src/pages/Entry/Card/EntryDescriptor.vue
@@ -6,7 +6,7 @@ import { toDate } from 'src/filters';
 import { getUrl } from 'src/composables/getUrl';
 import { useQuasar } from 'quasar';
 import { usePrintService } from 'composables/usePrintService';
-import CardDescriptor from 'components/ui/CardDescriptor.vue';
+import EntityDescriptor from 'components/ui/EntityDescriptor.vue';
 import VnLv from 'src/components/ui/VnLv.vue';
 import TravelDescriptorProxy from 'src/pages/Travel/Card/TravelDescriptorProxy.vue';
 import axios from 'axios';
@@ -145,7 +145,7 @@ async function deleteEntry() {
 </script>
 
 <template>
-    <CardDescriptor
+    <EntityDescriptoror
         :url="`Entries/${entityId}`"
         :filter="entryFilter"
         title="supplier.nickname"
@@ -264,7 +264,7 @@ async function deleteEntry() {
                 </QBtn>
             </QCardActions>
         </template>
-    </CardDescriptor>
+    </EntityDescriptoror>
 </template>
 <i18n>
 es:
diff --git a/src/pages/InvoiceIn/Card/InvoiceInDescriptor.vue b/src/pages/InvoiceIn/Card/InvoiceInDescriptor.vue
index 3843f5bf7..22ddb25d4 100644
--- a/src/pages/InvoiceIn/Card/InvoiceInDescriptor.vue
+++ b/src/pages/InvoiceIn/Card/InvoiceInDescriptor.vue
@@ -5,7 +5,7 @@ import { useI18n } from 'vue-i18n';
 import axios from 'axios';
 import { toCurrency, toDate } from 'src/filters';
 import VnLv from 'src/components/ui/VnLv.vue';
-import CardDescriptor from 'components/ui/CardDescriptor.vue';
+import EntityDescriptor from 'components/ui/EntityDescriptor.vue';
 import SupplierDescriptorProxy from 'src/pages/Supplier/Card/SupplierDescriptorProxy.vue';
 import filter from './InvoiceInFilter.js';
 import InvoiceInDescriptorMenu from './InvoiceInDescriptorMenu.vue';
@@ -88,7 +88,7 @@ async function setInvoiceCorrection(id) {
 }
 </script>
 <template>
-    <CardDescriptor
+    <EntityDescriptoror
         ref="cardDescriptorRef"
         data-key="InvoiceIn"
         :url="`InvoiceIns/${entityId}`"
@@ -163,7 +163,7 @@ async function setInvoiceCorrection(id) {
                 </QBtn>
             </QCardActions>
         </template>
-    </CardDescriptor>
+    </EntityDescriptoror>
 </template>
 <style lang="scss" scoped>
 .q-dialog {
diff --git a/src/pages/InvoiceOut/Card/InvoiceOutDescriptor.vue b/src/pages/InvoiceOut/Card/InvoiceOutDescriptor.vue
index 2402c0bf6..6b4399ceb 100644
--- a/src/pages/InvoiceOut/Card/InvoiceOutDescriptor.vue
+++ b/src/pages/InvoiceOut/Card/InvoiceOutDescriptor.vue
@@ -3,7 +3,7 @@ import { ref, computed } from 'vue';
 import { useRoute } from 'vue-router';
 import { useI18n } from 'vue-i18n';
 
-import CardDescriptor from 'components/ui/CardDescriptor.vue';
+import EntityDescriptor from 'components/ui/EntityDescriptor.vue';
 import CustomerDescriptorProxy from 'pages/Customer/Card/CustomerDescriptorProxy.vue';
 import VnLv from 'src/components/ui/VnLv.vue';
 import InvoiceOutDescriptorMenu from './InvoiceOutDescriptorMenu.vue';
@@ -34,7 +34,7 @@ function ticketFilter(invoice) {
 </script>
 
 <template>
-    <CardDescriptor
+    <EntityDescriptoror
         ref="descriptor"
         :url="`InvoiceOuts/${entityId}`"
         :filter="filter"
@@ -93,5 +93,5 @@ function ticketFilter(invoice) {
                 </QBtn>
             </QCardActions>
         </template>
-    </CardDescriptor>
+    </EntityDescriptoror>
 </template>
diff --git a/src/pages/Item/Card/ItemDescriptor.vue b/src/pages/Item/Card/ItemDescriptor.vue
index 84e07a293..d624d8db9 100644
--- a/src/pages/Item/Card/ItemDescriptor.vue
+++ b/src/pages/Item/Card/ItemDescriptor.vue
@@ -3,7 +3,7 @@ import { computed, ref, onMounted } from 'vue';
 import { useRoute } from 'vue-router';
 import { useI18n } from 'vue-i18n';
 
-import CardDescriptor from 'src/components/ui/CardDescriptor.vue';
+import EntityDescriptor from 'src/components/ui/EntityDescriptor.vue';
 import VnLv from 'src/components/ui/VnLv.vue';
 import WorkerDescriptorProxy from 'src/pages/Worker/Card/WorkerDescriptorProxy.vue';
 import ItemDescriptorImage from 'src/pages/Item/Card/ItemDescriptorImage.vue';
@@ -90,7 +90,7 @@ const updateStock = async () => {
 </script>
 
 <template>
-    <CardDescriptor
+    <EntityDescriptoror
         data-key="Item"
         :summary="$props.summary"
         :url="`Items/${entityId}/getCard`"
@@ -162,7 +162,7 @@ const updateStock = async () => {
                 </QBtn>
             </QCardActions>
         </template>
-    </CardDescriptor>
+    </EntityDescriptoror>
 </template>
 
 <i18n>
diff --git a/src/pages/Item/ItemType/Card/ItemTypeDescriptor.vue b/src/pages/Item/ItemType/Card/ItemTypeDescriptor.vue
index 725fb30aa..7bc1925a1 100644
--- a/src/pages/Item/ItemType/Card/ItemTypeDescriptor.vue
+++ b/src/pages/Item/ItemType/Card/ItemTypeDescriptor.vue
@@ -2,7 +2,7 @@
 import { computed } from 'vue';
 import { useRoute } from 'vue-router';
 
-import CardDescriptor from 'components/ui/CardDescriptor.vue';
+import EntityDescriptor from 'components/ui/EntityDescriptor.vue';
 import VnLv from 'src/components/ui/VnLv.vue';
 import WorkerDescriptorProxy from 'src/pages/Worker/Card/WorkerDescriptorProxy.vue';
 import filter from './ItemTypeFilter.js';
@@ -25,7 +25,7 @@ const entityId = computed(() => {
 });
 </script>
 <template>
-    <CardDescriptor
+    <EntityDescriptoror
         :url="`ItemTypes/${entityId}`"
         :filter="filter"
         title="code"
@@ -45,5 +45,5 @@ const entityId = computed(() => {
                 :value="entity.category?.name"
             />
         </template>
-    </CardDescriptor>
+    </EntityDescriptoror>
 </template>
diff --git a/src/pages/Order/Card/OrderDescriptor.vue b/src/pages/Order/Card/OrderDescriptor.vue
index 9fcb44580..ee66bb57e 100644
--- a/src/pages/Order/Card/OrderDescriptor.vue
+++ b/src/pages/Order/Card/OrderDescriptor.vue
@@ -7,7 +7,7 @@ import { useState } from 'src/composables/useState';
 import VnLv from 'src/components/ui/VnLv.vue';
 import FetchData from 'components/FetchData.vue';
 import OrderCard from './OrderCard.vue';
-import CardDescriptorBeta from 'src/components/ui/CardDescriptorBeta.vue';
+import CardDescriptor from 'src/components/ui/CardDescriptor.vue';
 import DepartmentDescriptorProxy from 'src/pages/Worker/Department/Card/DepartmentDescriptorProxy.vue';
 
 const DEFAULT_ITEMS = 0;
@@ -53,7 +53,7 @@ const getConfirmationValue = (isConfirmed) => {
             }
         "
     />
-    <CardDescriptorBeta
+    <CardDescriptor
         v-bind="$attrs"
         :id="entityId"
         :card="OrderCard"
@@ -110,5 +110,5 @@ const getConfirmationValue = (isConfirmed) => {
                 </QBtn>
             </QCardActions>
         </template>
-    </CardDescriptorBeta>
+    </CardDescriptor>
 </template>
diff --git a/src/pages/Route/Agency/Card/AgencyDescriptor.vue b/src/pages/Route/Agency/Card/AgencyDescriptor.vue
index a0472c6c3..f2cb80b98 100644
--- a/src/pages/Route/Agency/Card/AgencyDescriptor.vue
+++ b/src/pages/Route/Agency/Card/AgencyDescriptor.vue
@@ -3,7 +3,7 @@ import { computed } from 'vue';
 import { useI18n } from 'vue-i18n';
 import { useRoute } from 'vue-router';
 import { useArrayData } from 'src/composables/useArrayData';
-import CardDescriptor from 'components/ui/CardDescriptor.vue';
+import EntityDescriptor from 'components/ui/EntityDescriptor.vue';
 import VnLv from 'components/ui/VnLv.vue';
 
 const props = defineProps({
@@ -21,7 +21,7 @@ const { store } = useArrayData('Parking');
 const card = computed(() => store.data);
 </script>
 <template>
-    <CardDescriptor
+    <EntityDescriptoror
         data-key="Agency"
         :url="`Agencies/${entityId}`"
         :title="card?.name"
@@ -30,5 +30,5 @@ const card = computed(() => store.data);
         <template #body="{ entity: agency }">
             <VnLv :label="t('globals.name')" :value="agency.name" />
         </template>
-    </CardDescriptor>
+    </EntityDescriptoror>
 </template>
diff --git a/src/pages/Route/Card/RouteDescriptor.vue b/src/pages/Route/Card/RouteDescriptor.vue
index 01fb9c4ba..4659e8a81 100644
--- a/src/pages/Route/Card/RouteDescriptor.vue
+++ b/src/pages/Route/Card/RouteDescriptor.vue
@@ -1,7 +1,7 @@
 <script setup>
 import { ref, computed, onMounted } from 'vue';
 import { useRoute } from 'vue-router';
-import CardDescriptor from 'components/ui/CardDescriptor.vue';
+import EntityDescriptor from 'components/ui/EntityDescriptor.vue';
 import VnLv from 'components/ui/VnLv.vue';
 import { dashIfEmpty, toDate } from 'src/filters';
 import RouteDescriptorMenu from 'pages/Route/Card/RouteDescriptorMenu.vue';
@@ -47,7 +47,7 @@ onMounted(async () => {
 });
 </script>
 <template>
-    <CardDescriptor
+    <EntityDescriptoror
         :url="`Routes/${entityId}`"
         :filter="filter"
         :title="null"
@@ -69,7 +69,7 @@ onMounted(async () => {
         <template #menu="{ entity }">
             <RouteDescriptorMenu :route="entity" />
         </template>
-    </CardDescriptor>
+    </EntityDescriptoror>
 </template>
 <i18n>
 es:
diff --git a/src/pages/Route/Roadmap/RoadmapDescriptor.vue b/src/pages/Route/Roadmap/RoadmapDescriptor.vue
index 198bcf8c7..92c471fc4 100644
--- a/src/pages/Route/Roadmap/RoadmapDescriptor.vue
+++ b/src/pages/Route/Roadmap/RoadmapDescriptor.vue
@@ -2,7 +2,7 @@
 import { computed } from 'vue';
 import { useRoute } from 'vue-router';
 import { useI18n } from 'vue-i18n';
-import CardDescriptor from 'components/ui/CardDescriptor.vue';
+import EntityDescriptor from 'components/ui/EntityDescriptor.vue';
 import VnLv from 'components/ui/VnLv.vue';
 import { dashIfEmpty, toDateHourMin } from 'src/filters';
 import SupplierDescriptorProxy from 'pages/Supplier/Card/SupplierDescriptorProxy.vue';
@@ -30,7 +30,7 @@ const entityId = computed(() => {
 </script>
 
 <template>
-    <CardDescriptor
+    <EntityDescriptoror
         :url="`Roadmaps/${entityId}`"
         :filter="filter"
         data-key="Roadmap"
@@ -51,7 +51,7 @@ const entityId = computed(() => {
         <template #menu="{ entity }">
             <RoadmapDescriptorMenu :route="entity" />
         </template>
-    </CardDescriptor>
+    </EntityDescriptoror>
 </template>
 <i18n>
 es:
diff --git a/src/pages/Route/Vehicle/Card/VehicleDescriptor.vue b/src/pages/Route/Vehicle/Card/VehicleDescriptor.vue
index ad2ae61e4..5966b1abe 100644
--- a/src/pages/Route/Vehicle/Card/VehicleDescriptor.vue
+++ b/src/pages/Route/Vehicle/Card/VehicleDescriptor.vue
@@ -2,7 +2,7 @@
 import { computed } from 'vue';
 import { useRoute } from 'vue-router';
 import VnLv from 'src/components/ui/VnLv.vue';
-import CardDescriptor from 'components/ui/CardDescriptor.vue';
+import EntityDescriptor from 'components/ui/EntityDescriptor.vue';
 import axios from 'axios';
 import useNotify from 'src/composables/useNotify.js';
 
@@ -20,7 +20,7 @@ const route = useRoute();
 const entityId = computed(() => props.id || route.params.id);
 </script>
 <template>
-    <CardDescriptor
+    <EntityDescriptoror
         :url="`Vehicles/${entityId}`"
         data-key="Vehicle"
         title="numberPlate"
@@ -53,7 +53,7 @@ const entityId = computed(() => props.id || route.params.id);
             <VnLv :label="$t('globals.model')" :value="entity.model" />
             <VnLv :label="$t('globals.country')" :value="entity.countryCodeFk" />
         </template>
-    </CardDescriptor>
+    </EntityDescriptoror>
 </template>
 <i18n>
 es:
diff --git a/src/pages/Shelving/Card/ShelvingDescriptor.vue b/src/pages/Shelving/Card/ShelvingDescriptor.vue
index 5e618aa7f..5e76e7c2d 100644
--- a/src/pages/Shelving/Card/ShelvingDescriptor.vue
+++ b/src/pages/Shelving/Card/ShelvingDescriptor.vue
@@ -2,7 +2,7 @@
 import { computed } from 'vue';
 import { useRoute } from 'vue-router';
 import { useI18n } from 'vue-i18n';
-import CardDescriptor from 'components/ui/CardDescriptor.vue';
+import EntityDescriptor from 'components/ui/EntityDescriptor.vue';
 import VnLv from 'components/ui/VnLv.vue';
 import ShelvingDescriptorMenu from 'pages/Shelving/Card/ShelvingDescriptorMenu.vue';
 import VnUserLink from 'src/components/ui/VnUserLink.vue';
@@ -24,7 +24,7 @@ const entityId = computed(() => {
 });
 </script>
 <template>
-    <CardDescriptor
+    <EntityDescriptoror
         :url="`Shelvings/${entityId}`"
         :filter="filter"
         title="code"
@@ -45,5 +45,5 @@ const entityId = computed(() => {
         <template #menu="{ entity }">
             <ShelvingDescriptorMenu :shelving="entity" />
         </template>
-    </CardDescriptor>
+    </EntityDescriptoror>
 </template>
diff --git a/src/pages/Shelving/Parking/Card/ParkingDescriptor.vue b/src/pages/Shelving/Parking/Card/ParkingDescriptor.vue
index 46c9f8ea0..3daf9726d 100644
--- a/src/pages/Shelving/Parking/Card/ParkingDescriptor.vue
+++ b/src/pages/Shelving/Parking/Card/ParkingDescriptor.vue
@@ -1,7 +1,7 @@
 <script setup>
 import { computed } from 'vue';
 import { useRoute } from 'vue-router';
-import CardDescriptor from 'components/ui/CardDescriptor.vue';
+import EntityDescriptor from 'components/ui/EntityDescriptor.vue';
 import VnLv from 'components/ui/VnLv.vue';
 import filter from './ParkingFilter.js';
 const props = defineProps({
@@ -16,7 +16,7 @@ const route = useRoute();
 const entityId = computed(() => props.id || route.params.id);
 </script>
 <template>
-    <CardDescriptor
+    <EntityDescriptoror
         data-key="Parking"
         :url="`Parkings/${entityId}`"
         title="code"
@@ -28,5 +28,5 @@ const entityId = computed(() => props.id || route.params.id);
             <VnLv :label="$t('parking.pickingOrder')" :value="entity.pickingOrder" />
             <VnLv :label="$t('parking.sector')" :value="entity.sector?.description" />
         </template>
-    </CardDescriptor>
+    </EntityDescriptoror>
 </template>
diff --git a/src/pages/Supplier/Card/SupplierDescriptor.vue b/src/pages/Supplier/Card/SupplierDescriptor.vue
index 462bdf853..42489f201 100644
--- a/src/pages/Supplier/Card/SupplierDescriptor.vue
+++ b/src/pages/Supplier/Card/SupplierDescriptor.vue
@@ -3,7 +3,7 @@ import { ref, computed, onMounted } from 'vue';
 import { useRoute } from 'vue-router';
 import { useI18n } from 'vue-i18n';
 
-import CardDescriptor from 'components/ui/CardDescriptor.vue';
+import EntityDescriptor from 'components/ui/EntityDescriptor.vue';
 import VnLv from 'src/components/ui/VnLv.vue';
 
 import { toDateString } from 'src/filters';
@@ -61,7 +61,7 @@ const getEntryQueryParams = (supplier) => {
 </script>
 
 <template>
-    <CardDescriptor
+    <EntityDescriptoror
         :url="`Suppliers/${entityId}`"
         :filter="filter"
         data-key="Supplier"
@@ -136,7 +136,7 @@ const getEntryQueryParams = (supplier) => {
                 </QBtn>
             </QCardActions>
         </template>
-    </CardDescriptor>
+    </EntityDescriptoror>
 </template>
 
 <i18n>
diff --git a/src/pages/Ticket/Card/TicketDescriptor.vue b/src/pages/Ticket/Card/TicketDescriptor.vue
index 743f2188c..6f6fe69a3 100644
--- a/src/pages/Ticket/Card/TicketDescriptor.vue
+++ b/src/pages/Ticket/Card/TicketDescriptor.vue
@@ -4,7 +4,7 @@ import { useRoute } from 'vue-router';
 import { useI18n } from 'vue-i18n';
 import CustomerDescriptorProxy from 'pages/Customer/Card/CustomerDescriptorProxy.vue';
 import DepartmentDescriptorProxy from 'pages/Worker/Department/Card/DepartmentDescriptorProxy.vue';
-import CardDescriptor from 'components/ui/CardDescriptor.vue';
+import EntityDescriptor from 'components/ui/EntityDescriptor.vue';
 import TicketDescriptorMenu from './TicketDescriptorMenu.vue';
 import VnLv from 'src/components/ui/VnLv.vue';
 import { toDateTimeFormat } from 'src/filters/date';
@@ -57,7 +57,7 @@ function getInfo() {
 </script>
 
 <template>
-    <CardDescriptor
+    <EntityDescriptoror
         :url="`Tickets/${entityId}`"
         :filter="filter"
         data-key="Ticket"
@@ -155,7 +155,7 @@ function getInfo() {
                 </QBtn>
             </QCardActions>
         </template>
-    </CardDescriptor>
+    </EntityDescriptoror>
 </template>
 
 <i18n>
diff --git a/src/pages/Travel/Card/TravelDescriptor.vue b/src/pages/Travel/Card/TravelDescriptor.vue
index 922f89f33..f32034a6a 100644
--- a/src/pages/Travel/Card/TravelDescriptor.vue
+++ b/src/pages/Travel/Card/TravelDescriptor.vue
@@ -3,7 +3,7 @@ import { computed, ref } from 'vue';
 import { useRoute } from 'vue-router';
 import { useI18n } from 'vue-i18n';
 
-import CardDescriptor from 'components/ui/CardDescriptor.vue';
+import EntityDescriptor from 'components/ui/EntityDescriptor.vue';
 import VnLv from 'src/components/ui/VnLv.vue';
 import useCardDescription from 'src/composables/useCardDescription';
 import TravelDescriptorMenuItems from './TravelDescriptorMenuItems.vue';
@@ -31,7 +31,7 @@ const setData = (entity) => (data.value = useCardDescription(entity.ref, entity.
 </script>
 
 <template>
-    <CardDescriptor
+    <EntityDescriptoror
         :url="`Travels/${entityId}`"
         :title="data.title"
         :subtitle="data.subtitle"
@@ -79,7 +79,7 @@ const setData = (entity) => (data.value = useCardDescription(entity.ref, entity.
                 </QBtn>
             </QCardActions>
         </template>
-    </CardDescriptor>
+    </EntityDescriptoror>
 </template>
 
 <i18n>
diff --git a/src/pages/Worker/Card/WorkerDescriptor.vue b/src/pages/Worker/Card/WorkerDescriptor.vue
index 6e3a5e83f..ecaac12f8 100644
--- a/src/pages/Worker/Card/WorkerDescriptor.vue
+++ b/src/pages/Worker/Card/WorkerDescriptor.vue
@@ -2,7 +2,7 @@
 import { computed, ref } from 'vue';
 import { useRoute } from 'vue-router';
 import { useI18n } from 'vue-i18n';
-import CardDescriptor from 'src/components/ui/CardDescriptor.vue';
+import EntityDescriptor from 'src/components/ui/EntityDescriptor.vue';
 import VnLv from 'src/components/ui/VnLv.vue';
 import VnLinkPhone from 'src/components/ui/VnLinkPhone.vue';
 import VnChangePassword from 'src/components/common/VnChangePassword.vue';
@@ -52,7 +52,7 @@ const handlePhotoUpdated = (evt = false) => {
 };
 </script>
 <template>
-    <CardDescriptor
+    <EntityDescriptoror
         ref="cardDescriptorRef"
         :data-key="dataKey"
         :summary="$props.summary"
@@ -167,7 +167,7 @@ const handlePhotoUpdated = (evt = false) => {
                 </QBtn>
             </QCardActions>
         </template>
-    </CardDescriptor>
+    </EntityDescriptoror>
     <VnChangePassword
         ref="changePassRef"
         :submit-fn="
diff --git a/src/pages/Worker/Department/Card/DepartmentDescriptor.vue b/src/pages/Worker/Department/Card/DepartmentDescriptor.vue
index 4b7dfd9b8..17bf52a83 100644
--- a/src/pages/Worker/Department/Card/DepartmentDescriptor.vue
+++ b/src/pages/Worker/Department/Card/DepartmentDescriptor.vue
@@ -4,7 +4,7 @@ import { useRoute, useRouter } from 'vue-router';
 import { useI18n } from 'vue-i18n';
 import { useVnConfirm } from 'composables/useVnConfirm';
 import VnLv from 'src/components/ui/VnLv.vue';
-import CardDescriptor from 'src/components/ui/CardDescriptor.vue';
+import EntityDescriptor from 'src/components/ui/EntityDescriptor.vue';
 
 import axios from 'axios';
 import useNotify from 'src/composables/useNotify.js';
@@ -40,7 +40,7 @@ const removeDepartment = async () => {
 const { openConfirmationModal } = useVnConfirm();
 </script>
 <template>
-    <CardDescriptor
+    <EntityDescriptoror
         ref="DepartmentDescriptorRef"
         :url="`Departments/${entityId}`"
         :summary="$props.summary"
@@ -95,7 +95,7 @@ const { openConfirmationModal } = useVnConfirm();
                 </QBtn>
             </QCardActions>
         </template>
-    </CardDescriptor>
+    </EntityDescriptoror>
 </template>
 
 <i18n>
diff --git a/src/pages/Zone/Card/ZoneDescriptor.vue b/src/pages/Zone/Card/ZoneDescriptor.vue
index 27676212e..65cc1ae70 100644
--- a/src/pages/Zone/Card/ZoneDescriptor.vue
+++ b/src/pages/Zone/Card/ZoneDescriptor.vue
@@ -2,7 +2,7 @@
 import { computed } from 'vue';
 import { useRoute } from 'vue-router';
 
-import CardDescriptor from 'components/ui/CardDescriptor.vue';
+import EntityDescriptor from 'components/ui/EntityDescriptor.vue';
 import VnLv from 'src/components/ui/VnLv.vue';
 import { toTimeFormat } from 'src/filters/date';
 import { toCurrency } from 'filters/index';
@@ -25,7 +25,7 @@ const entityId = computed(() => {
 </script>
 
 <template>
-    <CardDescriptor :url="`Zones/${entityId}`" :filter="filter" data-key="Zone">
+    <EntityDescriptoror :url="`Zones/${entityId}`" :filter="filter" data-key="Zone">
         <template #menu="{ entity }">
             <ZoneDescriptorMenuItems :zone="entity" />
         </template>
@@ -36,5 +36,5 @@ const entityId = computed(() => {
             <VnLv :label="$t('list.price')" :value="toCurrency(entity.price)" />
             <VnLv :label="$t('zone.bonus')" :value="toCurrency(entity.bonus)" />
         </template>
-    </CardDescriptor>
+    </EntityDescriptoror>
 </template>