feat: refs #7119 add vehicle list localization and update VehicleList component

src/i18n/locale/en.yml

@@ -304,6 +304,7 @@ globals:
         wasteRecalc: Waste recaclulate
         operator: Operator
         parking: Parking
+        vehicleList: Vehicle list
     supplier: Supplier
     created: Created
     worker: Worker

src/i18n/locale/es.yml

@@ -308,6 +308,7 @@ globals:
         wasteRecalc: Recalcular mermas
         operator: Operario
         parking: Parking
+        vehicleList: Listado vehículos
     supplier: Proveedor
     created: Fecha creación
     worker: Trabajador

src/pages/Route/Vehicle/VehicleList.vue

@@ -1,66 +1,77 @@
 <script setup>
-import { computed } from 'vue';
+import { ref, computed } from 'vue';
 import { useI18n } from 'vue-i18n';
 import VnTable from 'components/VnTable/VnTable.vue';
+import FetchData from 'src/components/FetchData.vue';
 
 const { t } = useI18n();
-
+const warehouses = ref([]);
 const columns = computed(() => [
     {
-        align: 'left',
         name: 'id',
         label: 'Id',
-        chip: {
-            condition: () => true,
-        },
-        isId: true,
         columnFilter: false,
     },
     {
-        align: 'left',
+        name: 'description',
-        label: t('globals.name'),
+        label: 'Description',
-        name: 'name',
-        isTitle: true,
         columnFilter: false,
-        columnClass: 'expand',
     },
     {
-        align: 'left',
+        name: 'company',
-        label: t('isOwn'),
+        label: 'Company',
-        name: 'isOwn',
+        columnFilter: false,
-        component: 'checkbox',
+        format: (row, dashIfEmpty) => dashIfEmpty(row.company?.code),
-        cardVisible: true,
     },
     {
-        align: 'left',
+        name: 'tradeMark',
-        label: t('isAnyVolumeAllowed'),
+        label: 'TradeMark',
-        name: 'isAnyVolumeAllowed',
+        columnFilter: false,
-        component: 'checkbox',
-        cardVisible: true,
-        disable: true,
     },
     {
-        align: 'right',
+        name: 'numberPlate',
-        label: '',
+        label: 'Number Plate',
-        name: 'tableActions',
+        columnFilter: false,
-        actions: [
-            {
-                title: t('Client ticket list'),
-                icon: 'preview',
     },
-        ],
+    {
+        name: 'warehouseFk',
+        label: 'Warehouse',
+        columnFilter: false,
+        format: (row, dashIfEmpty) => dashIfEmpty(row.warehouse?.name),
+    },
+    {
+        name: 'chassis',
+        label: 'Chassis',
+        columnFilter: false,
+    },
+    {
+        name: 'leasing',
+        label: 'Leasing',
+        columnFilter: false,
+    },
+    {
+        name: 'countryCodeFk',
+        label: 'Country Code',
+        columnFilter: false,
+    },
+    {
+        name: 'state',
+        label: 'State',
+        columnFilter: false,
+        format: (row, dashIfEmpty) => dashIfEmpty(row.event?.state?.state),
     },
 ]);
 </script>
 <template>
+    <FetchData url="Warehouses" @on-fetch="(data) => (warehouses = data)" auto-load />
     <div class="list-container">
         <div class="list">
             <VnTable
                 data-key="VehicleList"
-                url="Vehicles"
+                url="Vehicles/filter"
                 :columns="columns"
-                :use-model="true"
                 redirect="vehicle"
+                auto-load
             />
         </div>
     </div>

src/router/modules/route.js

@@ -108,7 +108,7 @@ export default {
                             name: 'VehicleList',
                             meta: {
                                 title: 'vehicleList',
-                                icon: 'directions_list',
+                                icon: 'directions_car',
                             },
                             component: () =>
                                 import('src/pages/Route/Vehicle/VehicleList.vue'),