add: translation in direction & loads

src/views/HomeView.vue

@@ -38,13 +38,17 @@
 
   const getData = async() => {
     loading.value = true;
-    if(user.value?.permissions === "role_carrier") {
-      await loads.getProposalCompanyAll();
-    } else {
-      await loads.getLoadsAll();
+    try {
+      if(user.value?.permissions === "role_carrier") {
+        await loads.getProposalCompanyAll();
+      } else {
+        await loads.getLoadsAll();
+      }
+      dataMap();
+      loading.value = false;
+    } catch (error) {
+      loading.value = false;
     }
-    dataMap();
-    loading.value = false;
   }
 
 

src/views/LoadsPublishedView.vue

@@ -8,6 +8,7 @@
     import ProposalsModal from '../components/ProposalsModal.vue';
     import CardEmpty from '../components/CardEmpty.vue';
     import Pagination from '../components/Pagination.vue';
+    import { useI18n } from 'vue-i18n';
 
     const loadStore = useLoadsStore();
     const loading = ref(false);
@@ -22,6 +23,8 @@
 
     ///loads?company=64fa70c130d2650011ac4f3a&elements=3&page=0&status[$ne]=Closed&$sort%5BcreatedAt%5D=-1
 
+    const { t } = useI18n();
+
     watch(query, () => {
         filterQuery.value.page = "page="+ 0;
         filterQuery.value.limit = "elements="+ 100;
@@ -100,26 +103,26 @@
     <FormLoadModal v-if="loadStore.openModalEdit"/>
     <ProposalsModal v-if="loadStore.openProposalsModal"/>
     <div>
-        <h2 class="title mb-5">Mis cargas publicadas</h2>
+        <h2 class="title mb-5">{{ t('loads.title') }}</h2>
         <div>
             <div class="box-filters">
                 <div class="box-search">
-                    <input class="form-control custom-search" type="search" name="" placeholder="Nombre de la persona que publica" id="" @:input="search()" v-model="query" aria-label="Search">
+                    <input class="form-control custom-search" type="search" name="" :placeholder="t('loads.querySearch')" 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
                     @click="loadHistory"
                     class="btn-primary-sm radius-sm"
-                ><i class="fa-solid fa-clock-rotate-left"></i><span class="clear-sm"> Historial</span><span class="clear-md"> de cargas</span></button>
+                ><i class="fa-solid fa-clock-rotate-left"></i> <span class="clear-sm"> {{ t('loads.history') }}</span></button>
                 <button
                     class="btn-primary-sm radius-sm"
                     data-toggle="modal" data-target="#formLoadModal"
                     @click="loadStore.openModalEdit = true"
-                ><i class="fa-solid fa-plus"></i> <span class="clear-sm"> Crear</span><span class="clear-md"> carga</span></button>
+                ><i class="fa-solid fa-plus"></i> <span class="clear-sm"> {{ t('labels.create') }}</span> <span class="clear-md"> {{ t('labels.load').toLowerCase() }}</span></button>
             </div>
             <Spiner v-if="loading"/>
             <div v-else>
@@ -129,7 +132,7 @@
                     :key="load._id"
                     :load="load" 
                 />
-                <CardEmpty v-else text="No hay cargas agregadas"/>
+                <CardEmpty v-else :text="t('loads.empty')"/>
                 <Pagination
                     :limit="limit"
                     :total="loadStore.loadsTotal"
@@ -150,7 +153,9 @@
     }
 
     .box-search {
-        width: 40%;
+        /* width: 40%; */
+        display: flex;
+        flex: 1;
     }
 
     .radius-sm{

src/views/LocationsView.vue

@@ -16,9 +16,10 @@
     const query = ref('');
     const locationCurrent = ref(null);
     const openModal = ref(false);
-    const { t } = useI18n();
+    const { t, locale } = useI18n();
     // const typeDirection = ref(null)
     const typeDirection = ref({value: 'both', label: t('labels.both')})
+    const optionsFilter = ref([]);
     const openPopup = ref(false);
 
 
@@ -35,9 +36,22 @@
         filterQuery.value.limit = "elements=" + limit;
         filterQuery.value.page = "page=" + 0;
         await companyStore.getLocationsCompany(filterQuery.value, false)
+        optionsFilter.value = [
+            {value: 'both',label: t('labels.both')},
+            {value: 'load',label: t('labels.load')},
+            {value: 'download',label: t('labels.download')}
+        ]
         loading.value = false;
     }
 
+    watch(locale, () => {
+        optionsFilter.value = [
+            {value: 'both',label: t('labels.both')},
+            {value: 'load',label: t('labels.load')},
+            {value: 'download',label: t('labels.download')}
+        ]
+    })
+
     const getLocationsByPage = async(data) => {
         loading.value = true;
         filterQuery.value.company = "company="+ localStorage.getItem('id');
@@ -107,12 +121,6 @@
         openPopup.value = false
     }
 
-    const optionsFilter = [
-        {value: 'both',label: t('labels.both')},
-        {value: 'load',label: t('labels.load')},
-        {value: 'download',label: t('labels.download')}
-    ]
-
     const closePopup = () => {
         openPopup.value = false
     }
@@ -171,7 +179,7 @@
                 :location="location" 
                 @set-location="handleSetCurrentLocation(location)"
             />
-            <CardEmpty v-else text="No hay ubicaciones agregadas"/>
+            <CardEmpty v-else :text="t('directory.msgEmpty')"/>
             <Pagination
                 :limit="limit"
                 :total="companyStore.locationsTotal"