refactor: refs #8616 integrate summary dialog and update navigation in Agency and Vehicle components

src/pages/Route/Agency/AgencyList.vue

@@ -2,10 +2,13 @@
 import { computed } from 'vue';
 import { useRouter } from 'vue-router';
 import { useI18n } from 'vue-i18n';
+import { useSummaryDialog } from 'src/composables/useSummaryDialog';
 import VnTable from 'components/VnTable/VnTable.vue';
 import VnSection from 'src/components/common/VnSection.vue';
+import AgencySummary from 'pages/Route/Agency/Card/AgencySummary.vue';
 
 const { t } = useI18n();
+const { viewSummary } = useSummaryDialog();
 const router = useRouter();
 const dataKey = 'AgencyList';
 function navigate(id) {
@@ -60,7 +63,8 @@ const columns = computed(() => [
             {
                 title: t('Client ticket list'),
                 icon: 'preview',
-                action: (row) => navigate(row.id),
+                action: (row) => viewSummary(row?.id, AgencySummary),
+                isPrimary: true,
             },
         ],
     },

src/pages/Route/Agency/Card/AgencySummary.vue

@@ -7,19 +7,20 @@ import CardSummary from 'components/ui/CardSummary.vue';
 import VnLv from 'components/ui/VnLv.vue';
 import VnTitle from 'src/components/common/VnTitle.vue';
 
+const route = useRoute();
 const $props = defineProps({ id: { type: Number, default: 0 } });
 const { t } = useI18n();
-const entityId = computed(() => $props.id || useRoute().params.id);
+const entityId = computed(() => $props.id || route.params.id);
 </script>
 
 <template>
     <div class="q-pa-md">
-        <CardSummary :url="`Agencies/${entityId}`" data-key="Agency">
+        <CardSummary :url="`Agencies/${entityId}`" data-key="Agency" module-name="Agency">
             <template #header="{ entity: agency }">{{ agency.name }}</template>
             <template #body="{ entity: agency }">
                 <QCard class="vn-one">
                     <VnTitle
-                        :url="`#/agency/${entityId}/basic-data`"
+                        :url="`#/${route.meta.moduleName.toLowerCase()}/agency/${entityId}/basic-data`"
                         :text="t('globals.pageTitles.basicData')"
                     />
                     <VnLv :label="t('globals.name')" :value="agency.name" />

src/pages/Route/Card/RouteSummary.vue

@@ -135,7 +135,7 @@ const ticketColumns = ref([
             <template #body="{ entity }">
                 <QCard class="vn-max">
                     <VnTitle
-                        :url="`#/route/${entityId}/basic-data`"
+                        :url="`#/${route.meta.moduleName.toLowerCase()}/${entityId}/basic-data`"
                         :text="t('globals.pageTitles.basicData')"
                     />
                 </QCard>
@@ -168,7 +168,7 @@ const ticketColumns = ref([
                     <VnLv
                         :label="t('route.summary.volume')"
                         :value="`${dashIfEmpty(entity?.route?.m3)} / ${dashIfEmpty(
-                            entity?.route?.vehicle?.m3
+                            entity?.route?.vehicle?.m3,
                         )} m³`"
                     />
                     <VnLv

src/pages/Route/Vehicle/Card/VehicleSummary.vue

@@ -14,15 +14,20 @@ const props = defineProps({ id: { type: [Number, String], default: null } });
 const route = useRoute();
 const entityId = computed(() => props.id || +route.params.id);
 const links = {
-    'basic-data': `#/vehicle/${entityId.value}/basic-data`,
-    notes: `#/vehicle/${entityId.value}/notes`,
-    dms: `#/vehicle/${entityId.value}/dms`,
-    'invoice-in': `#/vehicle/${entityId.value}/invoice-in`,
-    events: `#/vehicle/${entityId.value}/events`,
+    'basic-data': `#/${route.meta.moduleName.toLowerCase()}/vehicle/${entityId.value}/basic-data`,
+    notes: `#/${route.meta.moduleName.toLowerCase()}/vehicle/${entityId.value}/notes`,
+    dms: `#/${route.meta.moduleName.toLowerCase()}/vehicle/${entityId.value}/dms`,
+    'invoice-in': `#/${route.meta.moduleName.toLowerCase()}/vehicle/${entityId.value}/invoice-in`,
+    events: `#/${route.meta.moduleName.toLowerCase()}/vehicle/${entityId.value}/events`,
 };
 </script>
 <template>
-    <CardSummary data-key="Vehicle" :url="`Vehicles/${entityId}`" :filter="VehicleFilter">
+    <CardSummary
+        data-key="Vehicle"
+        :url="`Vehicles/${entityId}`"
+        module-name="Vehicle"
+        :filter="VehicleFilter"
+    >
         <template #header="{ entity }">
             <div>{{ entity.id }} - {{ entity.numberPlate }}</div>
         </template>

src/pages/Route/Vehicle/VehicleList.vue

@@ -116,6 +116,7 @@ const columns = computed(() => [
                 title: t('components.smartCard.openSummary'),
                 icon: 'preview',
                 action: (row) => viewSummary(row.id, VehicleSummary),
+                isPrimary: true,
             },
         ],
     },