feat: refs #560 refactor descriptor

src/pages/Route/Roadmap/RoadmapAddStopForm.vue

@@ -23,28 +23,43 @@ const props = defineProps({
 });
 
 const { t } = useI18n();
-const warehouseList = ref([]);
+const addressList = ref([]);
 const form = computed(() => props.formData);
 const isDialog = computed(() => props.layout === 'dialog');
+const onFetch = (data) => {
+    addressList.value = data.map((roadmap) => ({
+        id: roadmap.addressFk,
+        nickname: roadmap.address ? roadmap.address.nickname : '',
+    }));
+};
 </script>
+
 <template>
     <FetchData
-        url="Warehouses"
+        url="RoadmapAddresses"
         auto-load
-        :filter="{ fields: ['id', 'name'] }"
-        sort-by="name"
+        :filter="{
+            include: [
+                {
+                    relation: 'address',
+                    scope: {
+                        fields: ['nickname'],
+                    },
+                },
+            ],
+        }"
         limit="30"
-        @on-fetch="(data) => (warehouseList = data)"
+        @on-fetch="onFetch"
     />
     <div :class="[isDialog ? 'column' : 'form-gap', 'full-width flex']">
         <QCardSection class="flex-grow q-px-none flex-1">
             <VnSelect
-                v-model.number="form.warehouseFk"
+                v-model.number="form.addressFk"
                 class="full-width"
-                :label="t('Warehouse')"
-                :options="warehouseList"
+                :label="t('Address')"
+                :options="addressList"
                 option-value="id"
-                option-label="name"
+                option-label="nickname"
                 emit-value
                 map-options
                 use-input
@@ -80,6 +95,7 @@ const isDialog = computed(() => props.layout === 'dialog');
         </QCardSection>
     </div>
 </template>
+
 <style lang="scss" scoped>
 .form-gap {
     gap: 16px;
@@ -93,9 +109,10 @@ const isDialog = computed(() => props.layout === 'dialog');
     flex: 2;
 }
 </style>
+
 <i18n>
 es:
-    Warehouse: Almacén
+    Address: Dirección
     ETA date: Fecha ETA
     ETA hour: Hora ETA
     Description: Descripción

src/pages/Route/Roadmap/RoadmapCard.vue

@@ -1,21 +1,17 @@
 <script setup>
-import { useStateStore } from 'stores/useStateStore';
-import LeftMenu from 'components/LeftMenu.vue';
-import RoadmapDescriptor from "pages/Route/Roadmap/RoadmapDescriptor.vue";
-
-const stateStore = useStateStore();
+import VnCard from 'components/common/VnCard.vue';
+import RoadmapDescriptor from 'pages/Route/Roadmap/RoadmapDescriptor.vue';
+import RoadmapFilter from 'pages/Route/Roadmap/RoadmapFilter.vue';
 </script>
 <template>
-    <QDrawer v-model="stateStore.leftDrawer" show-if-above :width="256">
-        <QScrollArea class="fit">
-            <RoadmapDescriptor />
-            <QSeparator />
-            <LeftMenu source="card" />
-        </QScrollArea>
-    </QDrawer>
-    <QPageContainer>
-        <QPage>
-            <RouterView></RouterView>
-        </QPage>
-    </QPageContainer>
+    <VnCard
+        data-key="Roadmap"
+        base-url="Roadmaps"
+        :descriptor="RoadmapDescriptor"
+        :filter-panel="RoadmapFilter"
+        search-data-key="RoadmapList"
+        search-url="Roadmaps"
+        searchbar-label="Search roadmap"
+        searchbar-info="You can search by roadmap id or customer name"
+    />
 </template>

src/pages/Route/Roadmap/RoadmapSummary.vue

@@ -55,7 +55,16 @@ const filter = {
         { relation: 'worker' },
         {
             relation: 'roadmapStop',
-            scope: { include: [{ relation: 'address' }] },
+            scope: {
+                include: [
+                    {
+                        relation: 'address',
+                        scope: {
+                            fields: ['nickname'],
+                        },
+                    },
+                ],
+            },
         },
     ],
 };
@@ -154,8 +163,6 @@ const openAddStopDialog = () => {
                         :rows="entity?.roadmapStop"
                         :rows-per-page-options="[0]"
                         row-key="id"
-                        flat
-                        hide-pagination
                     />
                 </QCard>
             </template>
@@ -171,7 +178,7 @@ es:
     Worker: Trabajador
     Observations: Observaciones
     Stops: Paradas
-    Warehouse: Almacén
+    Address: Dirección
     Go to stops: Ir a paradas
     Add stop: Añadir parada
 </i18n>

src/pages/Route/RouteRoadmap.vue

@@ -284,9 +284,9 @@ function navigateToRoadmapSummary(event, row) {
 <i18n>
 es:
     Search roadmaps: Buscar troncales
-    You can search by roadmap reference: Puedes buscar por referencia de la troncal
+    You can search by roadmap reference: Puedes buscar por referencia del troncal
     Delete roadmap(s): Eliminar troncal(es)
-    Selected roadmaps will be removed: Las troncales seleccionadas serán eliminadas
+    Selected roadmaps will be removed: Los troncales seleccionadas serán eliminados
     Are you sure you want to continue?: ¿Seguro que quieres continuar?
     The date can't be empty: La fecha no puede estar vacía
     Clone Selected Routes: Clonar rutas seleccionadas