feat: refs #6480 locale

src/components/common/VnCard.vue

@@ -1,5 +1,5 @@
 <script setup>
-import { computed, onBeforeMount } from 'vue';
+import { onBeforeMount } from 'vue';
 import { useRoute, onBeforeRouteUpdate } from 'vue-router';
 import { useI18n } from 'vue-i18n';
 import { useArrayData } from 'src/composables/useArrayData';
@@ -10,10 +10,9 @@ import VnSearchbar from 'components/ui/VnSearchbar.vue';
 import LeftMenu from 'components/LeftMenu.vue';
 
 const props = defineProps({
-    dataKey: { type: String, default: null },
+    dataKey: { type: String, required: true },
-    baseUrl: { type: String, default: null },
+    baseUrl: { type: String, required: true },
-    model: { type: String, default: null },
+    filter: { type: Object, default: undefined },
-    filter: { type: Object, default: null },
     descriptor: { type: Object, required: true },
     searchbarDataKey: { type: String, required: true },
     searchbarUrl: { type: String, required: true },
@@ -24,28 +23,27 @@ const props = defineProps({
 const { t } = useI18n();
 const stateStore = useStateStore();
 const route = useRoute();
-const url = computed(() => `${props.baseUrl}/${route.params.id}`);
-let arrayData;
 
-if (props.dataKey) {
+const arrayData = useArrayData(props.dataKey, {
-    arrayData = useArrayData(props.dataKey, { url, filter: props.filter });
+    url: `${props.baseUrl}/${route.params.id}`,
+    filter: props.filter,
+});
 
-    onBeforeMount(async () => await arrayData.fetch({ append: false }));
+onBeforeMount(async () => await arrayData.fetch({ append: false }));
 
-    onBeforeRouteUpdate(async (to, from) => {
+onBeforeRouteUpdate(async (to, from) => {
-        if (!to.params.id !== from.params.id) {
+    if (to.params.id !== from.params.id) {
-            arrayData.store.url = url;
+        arrayData.store.url = `${props.baseUrl}/${route.params.id}`;
-            await arrayData.fetch({ append: false });
+        await arrayData.fetch({ append: false });
-        }
+    }
-    });
+});
-}
 </script>
 <template>
     <Teleport to="#searchbar" v-if="stateStore.isHeaderMounted()">
         <VnSearchbar
             :data-key="props.searchbarDataKey"
             :url="props.searchbarUrl"
-            :label="t(`${props.model}.searchbar.${props.searchbarLabel}`)"
+            :label="t(props.searchbarLabel)"
             :info="t(props.searchbarInfo)"
         />
     </Teleport>

src/pages/InvoiceIn/Card/InvoiceInCard.vue

@@ -31,8 +31,3 @@ const filter = {
         searchbar-info="You can search by invoice reference"
     />
 </template>
-<i18n>
-    es:
-        Search invoice: Buscar factura recibida
-        You can search by invoice reference: Puedes buscar por referencia de la factura
-</i18n>

src/pages/InvoiceIn/locale/es.yml

@@ -0,0 +1,2 @@
+Search invoice: Buscar factura recibida
+You can search by invoice reference: Puedes buscar por referencia de la factura

src/pages/InvoiceOut/Card/InvoiceOutCard.vue

@@ -4,6 +4,8 @@ import VnCard from 'components/common/VnCard.vue';
 </script>
 <template>
     <VnCard
+        data-key="InvoiceOut"
+        base-url="InvoiceOuts"
         :descriptor="InvoiceOutDescriptor"
         searchbar-data-key="InvoiceOutList"
         searchbar-url="InvoiceOuts/filter"
@@ -11,8 +13,3 @@ import VnCard from 'components/common/VnCard.vue';
         searchbar-info="You can search by invoice reference"
     />
 </template>
-<i18n>
-    es:
-        Search invoice: Buscar factura emitida
-        You can search by invoice reference: Puedes buscar por referencia de la factura
-</i18n>

src/pages/InvoiceOut/locale/es.yml

@@ -0,0 +1,2 @@
+Search invoice: Buscar factura emitida
+You can search by invoice reference: Puedes buscar por referencia de la factura