ETA/WebETA
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

add: translations in carriers & public users

Browse Source
This commit is contained in:
Alexandro Uc Santos
2024-06-04 21:20:32 -06:00
parent 97f4f93fd3
commit b32b2c310c
8 changed files with 122 additions and 53 deletions
Download Patch File Download Diff File Expand all files Collapse all files

18
src/components/CardCompany.vue
View File

@@ -1,6 +1,7 @@
<script setup>
import { RouterLink } from 'vue-router';
import { getDateMonthDay } from '../helpers/date_formats';
import { useI18n } from 'vue-i18n';
defineProps({
company: {
@@ -9,6 +10,7 @@
}
});
const { t } = useI18n()
</script>
<template>
@@ -19,23 +21,23 @@
<div class="col-lg-6 col-sm-12">
<!-- <p><span>RFC:</span> {{ company.rfc }}</p> -->
<!-- <p><span>Tipo de empresa:</span> {{ company.company_type || 'No definido' }}</p> -->
<p><span>Código:</span> {{ company.company_code }}</p>
<p><span>Empresa miembro desde: </span>{{getDateMonthDay(company.createdAt)}}</p>
<p><span>Segmento empresa:</span> {{ company._categories }}</p>
<p><span>{{ t('labels.codeId') }}:</span> {{ company.company_code }}</p>
<p><span>{{ t('labels.dateMembership') }}: </span>{{getDateMonthDay(company.createdAt)}}</p>
<p><span>{{ t('company.segment') }}:</span> {{ company._categories }}</p>
<!-- <p><span>Afiliación: </span> {{company.membership}}</p> -->
</div>
<div class="col-lg-6 col-sm-12">
<p><span>Locaciones de carga por estado: </span>{{company._company_state}}</p>
<p><span>Locaciones de carga por municipio: </span>{{company._company_city}}</p>
<p><span>Transportes utilizados: </span>{{company._truck_types}}</p>
<p><span>Información general de la empresa: </span>{{company.company_description}}</p>
<p><span>{{ t('labels.locationLoadState') }}: </span>{{company._company_state}}</p>
<p><span>{{ t('labels.locationLoadCity') }}: </span>{{company._company_city}}</p>
<p><span>{{ t('labels.truckUsed') }}: </span>{{company._truck_types}}</p>
<p><span>{{ t('labels.infoCompany') }}: </span>{{company.company_description}}</p>
</div>
</div>
<div class="d-flex justify-content-end">
<RouterLink
class="btn-primary-sm"
:to="{name: 'public-users', params: {id: company._id}}"
>Ver perfil</RouterLink>
>{{ t('buttons.profile') }}</RouterLink>
</div>
</div>
</template>

43
src/components/CardVehicle.vue
View File

@@ -2,7 +2,8 @@
import Swal from 'sweetalert2';
import { getDateMonthDayEs } from '../helpers/date_formats';
import { useVehiclesStore } from '../stores/vehicles';
import { useAuthStore } from '../stores/auth';
import { useAuthStore } from '../stores/auth';
import { useI18n } from 'vue-i18n';
const props = defineProps({
vehicle: {
@@ -13,6 +14,8 @@ import { useAuthStore } from '../stores/auth';
console.log(props.vehicle);
defineEmits(['set-vehicle']);
const { t } = useI18n()
const vehicleStore = useVehiclesStore();
const authStore = useAuthStore();
@@ -23,12 +26,12 @@ import { useAuthStore } from '../stores/auth';
icon: 'warning',
showCancelButton: true,
cancelButtonColor: "#d33",
confirmButtonText: 'Eliminar',
cancelButtonText: 'Cancelar',
confirmButtonText: t('buttons.delete'),
cancelButtonText: t('buttons.cancel'),
}).then(async(result) => {
if(result.isConfirmed) {
Swal.fire({
title: 'Por favor espere!',
title: t('messages.loading'),
html: 'Eliminando vehiculo...',// add html attribute if you want or remove
allowOutsideClick: false,
didOpen: () => {
@@ -62,14 +65,14 @@ import { useAuthStore } from '../stores/auth';
<div class="card-fixed card-vehicle">
<div class="row my-2">
<div class="col-lg-6">
<p>Código: <span>{{ vehicle?.vehicle_code }}</span></p>
<p>Tipo de transporte: <span>{{ vehicle.truck_type }}</span></p>
<p>Número de Serie: <span>{{ vehicle.vehicle_number }}</span></p>
<p>Segmento: <span>{{vehicle.categories?.map((e) => e.name).join(', ')}}</span></p>
<p>Conductor:
<p>{{ t('labels.codeId') }}: <span>{{ vehicle?.vehicle_code }}</span></p>
<p>{{ t('directory.typeTruck') }}: <span>{{ vehicle.truck_type }}</span></p>
<p>{{ t('vehicles.serialNumber') }}: <span>{{ vehicle.vehicle_number }}</span></p>
<p>{{ t('global.segment') }}: <span>{{vehicle.categories?.map((e) => e.name).join(', ')}}</span></p>
<p>{{ t('labels.driver') }}:
<span>
<span v-if="vehicle?.driver">{{ vehicle?.driver?.first_name }} {{ vehicle?.driver?.last_name }} </span>
<span v-else>No asignado </span>
<span v-else>{{ t('vehicles.noDriver') }} </span>
<i
class="fa-solid fa-pen-to-square icon-btn"
data-toggle="modal"
@@ -78,15 +81,15 @@ import { useAuthStore } from '../stores/auth';
</i>
</span>
</p>
<p v-if="vehicle.is_available">Disponible en: <span>{{ vehicle.destino }}</span></p>
<p v-if="vehicle.is_available">{{ t('vehicles.availableIn') }}: <span>{{ vehicle.destino }}</span></p>
</div>
<div class="col-lg-6">
<p>Placas Tracto Camión: <span>{{ vehicle.circulation_serial_number }}</span></p>
<p>Placas Remolque 1: <span>{{ vehicle.trailer_plate_1 }}</span></p>
<p>Placas Remolque 2: <span>{{ vehicle.trailer_plate_2 }}</span></p>
<p>Base de carga: <span>{{ vehicle.city }}, {{ vehicle.state }}</span></p>
<p>{{ t('vehicles.truckPlates') }}: <span>{{ vehicle.circulation_serial_number }}</span></p>
<p>{{ t('vehicles.trailerPlates') }} 1: <span>{{ vehicle.trailer_plate_1 }}</span></p>
<p>{{ t('vehicles.trailerPlates') }} 2: <span>{{ vehicle.trailer_plate_2 }}</span></p>
<p>{{ t('vehicles.chargingBase') }}: <span>{{ vehicle.city }}, {{ vehicle.state }}</span></p>
<p>Status:
<span>{{ vehicle.is_available ? 'Disponible' : 'Reservado'}}
<span>{{ vehicle.is_available ? t('vehicles.available') : t('vehicles.reserved')}}
<i
class="fa-solid fa-pen-to-square icon-btn"
data-toggle="modal"
@@ -95,10 +98,10 @@ import { useAuthStore } from '../stores/auth';
</i>
</span>
</p>
<p v-if="vehicle.is_available">Fecha Disponible: <span>{{ getDateMonthDayEs(vehicle.available_date, false) }}</span></p>
<p v-if="vehicle.is_available">{{ t('vehicles.availableDate') }}: <span>{{ getDateMonthDayEs(vehicle.available_date, false) }}</span></p>
</div>
</div>
<p v-if="vehicle.notes">Información Adicional del Transporte:</p>
<p v-if="vehicle.notes">{{ t('vehicles.additionalInfoVehicle') }}:</p>
<div v-if="vehicle.notes" class="box-note mb-4">
{{ vehicle.notes }}
</div>
@@ -108,7 +111,7 @@ import { useAuthStore } from '../stores/auth';
class="btn btn-dark radius-sm"
@click="handleDeleteVehicle"
>
<i class="fa-solid fa-trash" /> <span class="clear-xsm">Eliminar</span>
<i class="fa-solid fa-trash" /> <span class="clear-xsm">{{ t('buttons.delete') }}</span>
</button>
<button
v-if="(authStore.user?.job_role === 'owner' || authStore.user?.job_role === 'manager') || authStore.user._id === props.vehicle.posted_by"
@@ -117,7 +120,7 @@ import { useAuthStore } from '../stores/auth';
data-toggle="modal"
data-target="#createVehicleModal"
>
<i class="fa-solid fa-pen-to-square" /> <span class="clear-xsm">Editar</span>
<i class="fa-solid fa-pen-to-square" /> <span class="clear-xsm">{{ t('buttons.edit') }}</span>
</button>
</div>
</div>

27
src/i18n/en.js
View File

@@ -76,6 +76,7 @@ const en = {
accepted: 'Accepted',
confirm: 'Confirm',
search: 'Search',
profile: 'View profile'
},
errors: {
requireds: "All fields required",
@@ -158,7 +159,13 @@ const en = {
notification: "Notification",
pagination: 'Pagination',
lang: 'Language',
prefs: 'User Preferences'
prefs: 'User Preferences',
loading: 'Loading',
published: 'Published',
transit: 'Transit',
delivered: 'Delivered',
downloading: 'Downloading',
add: 'Add',
},
login: {
title: 'Sign in',
@@ -188,6 +195,8 @@ const en = {
company: {
title: 'My company',
edit: 'Edit company',
segment: 'Company segment',
users: 'Company <span class="title-main">Users</span>'
},
users: {
titleDel: 'User deletion!',
@@ -294,12 +303,21 @@ const en = {
msgNotCancel: 'Could not withdraw offer, try later',
},
vehicles: {
title: 'Vehicles',
modalEdit: 'Edit vehicle',
search: 'Search vehicles',
infoVehicle: 'Vehicle information',
truckPlates: 'Truck Tract Plates',
trailerPlates: 'Trailer Plates',
chargingBase: 'Charging Base',
additionalInfoVehicle: 'Additional Transportation Information',
serialNumber: 'Serial Number',
empty: 'No vehicles added',
noDriver: 'Not assigned',
availableIn: 'Available in',
available: 'Available',
reserved: 'Reserved',
availableDate: 'Available date'
},
profile: {
profile: 'User data',
@@ -316,7 +334,12 @@ const en = {
},
carriers: {
title: '<span class="title-main">Carriers</span> directory',
searchByCarrier: 'Search by carrier'
searchByCarrier: 'Search by carrier',
empty: 'No records'
},
calendar: {
title: 'Calendar',
helpText: 'Load status indicators'
}
};

38
src/i18n/es.js
View File

@@ -29,8 +29,8 @@ const es = {
codeId: 'Código',
dateMembership: 'Empresa miembro desde',
segmentsCompany: 'Segmentos de la empresa',
locationLoadState: 'Ubicaciones de carga por estado',
locationLoadCity: 'Ubicaciones de carga por municipio',
locationLoadState: 'Locaciones de carga por estado',
locationLoadCity: 'Locaciones de carga por municipio',
truckUsed: 'Transportes utilizados',
infoCompany: 'Información general de la empresa',
registryNumber: "Número de registro",
@@ -78,6 +78,7 @@ const es = {
accepted: 'Aceptado',
confirm: 'Confirmar',
search: 'Buscar',
profile: 'Ver perfil'
},
errors: {
requireds: 'Todos los campos con obligatorios',
@@ -161,6 +162,12 @@ const es = {
pagination: 'Paginación',
lang: 'Idioma',
prefs: 'Preferencias de usuario',
loading: 'Cargando',
published: 'Publicado',
transit: 'En transito',
delivered: 'Entregado',
downloading: 'Descargando',
add: 'Agregar',
},
login: {
title: 'Iniciar sesión',
@@ -190,6 +197,8 @@ const es = {
company: {
title: 'Mi empresa',
edit: 'Editar empresa',
segment: 'Segmento empresa',
users: 'Usuarios de la <span class="title-main">Empresa</span>'
},
users: {
titleDel: 'Eliminación de usuario!',
@@ -300,12 +309,28 @@ const es = {
msgNotCancel: 'No se pudo retirar oferta, intente más tarde',
},
vehicles: {
title: 'Vehiculos',
modalEdit: 'Editar vehiculo',
search: 'Buscar vehiculos',
infoVehicle: 'Información del vehiculo',
truckPlates: 'Placas Tracto Camión',
trailerPlates: 'Placas Remolque',
chargingBase: 'Base de carga',
additionalInfoVehicle: 'Información Adicional del Transporte',
serialNumber: 'Número de Serie',
empty: 'No hay vehiculos agregados',
noDriver: 'No asignado',
availableIn: 'Disponible en',
available: 'Disponible',
reserved: 'Reservado',
availableDate: 'Fecha disponible',
titleDel: 'Eliminar Locación!',
textDel: '¿Estás seguro de eliminar este locación?',
loadingDel: 'Eliminando locación',
msgTitleDel: 'Locación eliminado!',
msgDel: 'Tu locación ha sido eliminado exitosamente.',
msgNotDel: 'Tu locación no se pudo eliminar, intente más tarde.',
},
profile: {
profile: 'Datos de usuario',
@@ -322,8 +347,13 @@ const es = {
},
carriers: {
title: 'Directorio de <span class="title-main">Transportistas</span>',
searchByCarrier: 'Buscar por transportista'
}
searchByCarrier: 'Buscar por transportista',
empty: 'No hay registros'
},
calendar: {
title: 'Calendario',
helpText: 'Indicadores de estado de la carga'
},
};
export default es;

18
src/views/CalendarView.vue
View File

@@ -5,8 +5,12 @@
import {getDateTime} from '../helpers/date_formats';
import { onMounted, ref } from 'vue';
import { useRouter } from 'vue-router';
import { useI18n } from 'vue-i18n';
const events = ref([]);
const router = useRouter();
const { t } = useI18n()
const config = {
week: {
startsOn: 'monday',
@@ -72,15 +76,15 @@
<template>
<div>
<h2 class="title mb-4">Calendario</h2>
<h2 class="title mb-4">{{ t('calendar.title') }}</h2>
<div class="box-indicators">
<h2>Indicadores de estado de la carga</h2>
<h2>{{ t('calendar.helpText') }}</h2>
<div class="indicators">
<i class="fa-solid fa-circle" style="color: yellow"></i> Publicado
<i class="fa-solid fa-circle" style="color: green"></i> Cargando
<i class="fa-solid fa-circle" style="color: red"></i> En transito
<i class="fa-solid fa-circle" style="color: blue"></i> Descargando
<i class="fa-solid fa-circle" style="color: blue"></i> Entregado
<i class="fa-solid fa-circle" style="color: yellow"></i> {{ t('global.published') }}
<i class="fa-solid fa-circle" style="color: green"></i> {{ t('global.loading') }}
<i class="fa-solid fa-circle" style="color: red"></i> {{ t('global.transit') }}
<i class="fa-solid fa-circle" style="color: blue"></i> {{ t('global.downloading') }}
<i class="fa-solid fa-circle" style="color: blue"></i> {{ t('global.delivered') }}
</div>
</div>
<div class="calendar">

2
src/views/CarriersView.vue
View File

@@ -166,7 +166,7 @@
v-if="loading === false && companies.length <= 0"
>
<img src="/images/logo.png" alt="logo" width="100">
<h2 class="title">No hay registros</h2>
<h2 class="title">{{ t('carriers.empty') }}</h2>
</div>
<CardCompany

5
src/views/PublicUsersCompanyView.vue
View File

@@ -4,11 +4,14 @@
import { useRoute } from 'vue-router';
import useDirectory from '../composables/useDirectory';
import CardUser from '../components/CardUser.vue';
import { useI18n } from 'vue-i18n';
const {loading, users, getUsersData} = useDirectory();
const {params} = useRoute();
const { t } = useI18n()
onMounted(() => {
const id = params.id;
getUsersData(id);
@@ -17,7 +20,7 @@
<template>
<div class="mb-5">
<h2 class="title mt-5 mb-5">Usuarios de la <span class="title-main">Empresa</span></h2>
<h2 class="title mt-5 mb-5" v-html="t('company.users')"></h2>
<Spiner v-if="loading"/>
<div
class="card-info flex-column align-items-center"

24
src/views/VehiclesView.vue
View File

@@ -9,6 +9,7 @@
import StatusVehicleModal from '../components/StatusVehicleModal.vue';
import DriverVehicleModal from '../components/DriverVehicleModal.vue';
import Pagination from '../components/Pagination.vue';
import { useI18n } from 'vue-i18n';
const companyStore = useCompanyStore();
const vehicleStore = useVehiclesStore();
@@ -27,6 +28,8 @@
getInitData();
})
const { t } = useI18n()
const getInitData = async() => {
loading.value = true;
filterQuery.value.limit = 'elements=' + limit;
@@ -127,22 +130,22 @@
:vehicle="vehicleCurrent"
@reset-vehicle="handleResetCurrentVehicle"
/>
<h2 class="title">Vehiculos</h2>
<h2 class="title">{{ t('vehicles.title') }}</h2>
<div class="box-filters">
<div class="box-search">
<input class="form-control custom-search" type="search" name="" placeholder="Buscar vehicles" id="" @:input="search()" v-model="query" aria-label="Search">
<input class="form-control custom-search" type="search" name="" :placeholder="t('vehicles.search')" id="" @:input="search()" v-model="query" aria-label="Search">
</div>
<button
class="btn btn-danger bg-dark" type="button" @click="clearFilter">
<i class="fa-solid fa-arrow-rotate-right"></i>
<span class="clear-sm"> Reset</span><span class="clear-md"> filtros</span>
<span class="clear-sm"> Reset </span><span class="clear-md"> {{ t('labels.filters').toLowerCase() }}</span>
</button>
<button
class="btn-primary-sm radius-sm"
data-toggle="modal"
data-target="#createVehicleModal"
@click="handleSetCurrentVehicle({vehicle: null, modal: 'form'})"
><i class="fa-solid fa-plus"></i> <span class="clear-sm"> Agregar</span><span class="clear-md"> vehiculo</span></button>
><i class="fa-solid fa-plus"></i> <span class="clear-sm"> {{ t('global.add') }} </span> <span class="clear-md"> {{ t('global.vehicles').toLowerCase() }}</span></button>
</div>
<Spiner v-if="loading"/>
<div v-else>
@@ -153,7 +156,7 @@
:key="vehicle._id"
@set-vehicle="handleSetCurrentVehicle"
/>
<CardEmpty v-else text="No hay vehiculos agregados"/>
<CardEmpty v-else :text="t('vehicles.empty')"/>
<Pagination
:current-page="vehicleStore.vehiclesCurrentPage"
:total="vehicleStore.vehiclesTotal"
@@ -174,7 +177,8 @@
}
.box-search {
width: 60%;
/* width: 60%; */
flex: 1;
}
.custom-search {
width: 100%;
@@ -182,9 +186,9 @@
}
@media (max-width: 1024px) {
.box-search {
/* .box-search {
width: 60%;
}
} */
.box-filters {
gap: .4rem;
}
@@ -192,9 +196,9 @@
@media (max-width: 768px) {
.box-search {
/* .box-search {
width: 100%;
}
} */
.box-filters {
gap: .3rem;
}