feat: refs #7119 update vehicle components and localization, add vehicle type selection

src/i18n/locale/en.yml

@@ -355,6 +355,8 @@ globals:
     isVies: Vies
     model: Model
     fuel: Fuel
+    active: Active
+    inactive: Inactive
 errors:
     statusUnauthorized: Access denied
     statusInternalServerError: An internal server error has ocurred

src/i18n/locale/es.yml

@@ -357,6 +357,8 @@ globals:
     isVies: Vies
     model: Modelo
     fuel: Combustible
+    active: Activo
+    inactive: Inactivo
 errors:
     statusUnauthorized: Acceso denegado
     statusInternalServerError: Ha ocurrido un error interno del servidor

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

@@ -64,6 +64,11 @@ const bankPolicies = ref([]);
                     :label="$t('globals.model')"
                     :required="true"
                 />
+                <VnSelect
+                    url="VehicleTypes"
+                    v-model="data.vehicleTypeFk"
+                    :label="$t('globals.type')"
+                />
                 <VnSelect
                     url="Ppes"
                     option-label="id"

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

@@ -15,7 +15,7 @@ import CardDescriptor from 'components/ui/CardDescriptor.vue';
             <VnLv :label="$t('vehicle.numberPlate')" :value="entity.numberPlate" />
             <VnLv :label="$t('vehicle.tradeMark')" :value="entity.tradeMark" />
             <VnLv :label="$t('globals.model')" :value="entity.model" />
-            <VnLv :label="$t('vehicle.countryCode')" :value="entity.countryCodeFk" />
+            <VnLv :label="$t('globals.country')" :value="entity.countryCodeFk" />
         </template>
     </CardDescriptor>
 </template>

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

@@ -1,7 +0,0 @@
-<script setup>
-import VnNotes from 'src/components/ui/VnNotes.vue';
-</script>
-
-<template>
-    <VnNotes :add-note="true" url="VehicleNotes" :body="{ userFk: $route.params.id }" />
-</template>

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

@@ -75,7 +75,7 @@ const links = {
                 </QCardSection>
                 <VnLv :label="$t('globals.warehouse')" :value="entity.warehouse?.name" />
                 <VnLv :label="$t('globals.company')" :value="entity.company?.code" />
-                <VnLv :label="$t('vehicle.countryCode')" :value="entity.countryCodeFk" />
+                <VnLv :label="$t('globals.country')" :value="entity.countryCodeFk" />
                 <VnLv
                     :label="$t('vehicle.isKmTruckRate')"
                     :value="!!entity.isKmTruckRate"

src/pages/Route/Vehicle/VehicleFilter.js

@@ -19,6 +19,7 @@ export default {
         'countryCodeFk',
         'leasing',
         'bankPolicyFk',
+        'vehicleTypeFk',
     ],
     include: [
         {

src/pages/Route/Vehicle/VehicleList.vue

@@ -13,8 +13,14 @@ const warehouses = ref([]);
 const companies = ref([]);
 const countries = ref([]);
 const vehicleStates = ref([]);
+const vehicleTypes = ref([]);
 
 const columns = computed(() => [
+    {
+        name: 'isActive',
+        columnFilter: false,
+        align: 'center',
+    },
     {
         name: 'id',
         label: t('globals.id'),
@@ -27,17 +33,6 @@ const columns = computed(() => [
         name: 'description',
         label: t('globals.description'),
     },
-    {
-        name: 'companyFk',
-        label: t('globals.company'),
-        format: (row, dashIfEmpty) => dashIfEmpty(row.company),
-        columnFilter: {
-            component: 'select',
-            name: 'companyFk',
-            optionLabel: 'code',
-            options: companies.value,
-        },
-    },
     {
         name: 'tradeMark',
         label: t('vehicle.tradeMark'),
@@ -48,6 +43,36 @@ const columns = computed(() => [
         label: t('vehicle.numberPlate'),
         isTitle: true,
     },
+    {
+        name: 'vehicleTypeFk',
+        label: t('globals.type'),
+        format: (row) => row.type,
+        columnFilter: {
+            component: 'select',
+            name: 'vehicleTypeFk',
+            options: vehicleTypes.value,
+        },
+        cardVisible: true,
+    },
+    {
+        name: 'vehicleStateFk',
+        label: t('globals.state'),
+        columnFilter: {
+            component: 'select',
+            name: 'vehicleStateFk',
+            optionLabel: 'state',
+            options: vehicleStates.value,
+        },
+        format: (row, dashIfEmpty) => dashIfEmpty(row.state),
+    },
+    {
+        name: 'chassis',
+        label: t('vehicle.chassis'),
+    },
+    {
+        name: 'leasing',
+        label: t('vehicle.leasing'),
+    },
     {
         name: 'warehouseFk',
         label: t('globals.warehouse'),
@@ -60,12 +85,15 @@ const columns = computed(() => [
         cardVisible: true,
     },
     {
-        name: 'chassis',
+        name: 'companyFk',
-        label: t('vehicle.chassis'),
+        label: t('globals.company'),
+        format: (row, dashIfEmpty) => dashIfEmpty(row.company),
+        columnFilter: {
+            component: 'select',
+            name: 'companyFk',
+            optionLabel: 'code',
+            options: companies.value,
         },
-    {
-        name: 'leasing',
-        label: t('vehicle.leasing'),
     },
     {
         name: 'countryCodeFk',
@@ -77,23 +105,6 @@ const columns = computed(() => [
             optionLabel: 'code',
             options: countries.value,
         },
-        cardVisible: true,
-    },
-    {
-        name: 'isKmTruckRate',
-        label: t('vehicle.isKmTruckRate'),
-    },
-    {
-        name: 'vehicleStateFk',
-        label: t('globals.state'),
-        columnFilter: {
-            component: 'select',
-            name: 'vehicleStateFk',
-            optionLabel: 'state',
-            options: vehicleStates.value,
-        },
-        sortable: false,
-        format: (row, dashIfEmpty) => dashIfEmpty(row.state),
     },
     {
         align: 'right',
@@ -133,11 +144,25 @@ const columns = computed(() => [
         @on-fetch="(data) => (vehicleStates = data)"
         auto-load
     />
+    <FetchData
+        url="VehicleTypes"
+        :filter="{ fields: ['id', 'name'] }"
+        @on-fetch="(data) => (vehicleTypes = data)"
+        auto-load
+    />
     <VehicleSearchbar />
     <VnTable
         data-key="VehicleList"
         url="Vehicles/filter"
         :columns="columns"
         redirect="vehicle"
-    />
+    >
+        <template #column-isActive="{ row }">
+            <span>
+                <QIcon v-if="!row.isActive" name="help" color="primary" size="xs">
+                    <QTooltip>{{ $t('globals.inactive') }}</QTooltip>
+                </QIcon>
+            </span>
+        </template>
+    </VnTable>
 </template>

src/pages/Route/Vehicle/locale/en.yml

@@ -1,10 +1,9 @@
 vehicle:
     tradeMark: Trade Mark
-    numberPlate: Number Plate
+    numberPlate: Nº Plate
     chassis: Chassis
     leasing: Leasing
     isKmTruckRate: Trailer
-    countryCode: Country Code
     delete: Delete Vehicle
     supplierCooler: Supplier Cooler
     vin: VIN

src/pages/Route/Vehicle/locale/es.yml

@@ -1,16 +1,15 @@
 vehicle:
     tradeMark: Marca
     numberPlate: Matrícula
-    chassis: Número de bastidor
+    chassis: Nº de bastidor
-    leasing: leasing
+    leasing: Leasing
     isKmTruckRate: Trailer
-    countryCode: Código de país
     delete: Eliminar vehículo
     supplierCooler: Proveedor Frío
     vin: VIN
-    ppe: nº Inmovilizado
+    ppe: Nº Inmovilizado
     isActive: Activo
-    nLeasing: Nº Leasing
+    nLeasing: Nº leasing
     searchbar:
         label: Buscar Vehículo
         info: Buscar por id o matrícula

src/router/modules/vehicle.js

@@ -41,16 +41,6 @@ export default {
                     component: () =>
                         import('src/pages/Route/Vehicle/Card/VehicleBasicData.vue'),
                 },
-                {
-                    name: 'VehicleNotes',
-                    path: 'notes',
-                    meta: {
-                        title: 'notes',
-                        icon: 'vn:notes',
-                    },
-                    component: () =>
-                        import('src/pages/Route/Vehicle/Card/VehicleNotes.vue'),
-                },
             ],
         },
     ],