add: finish translation feature

src/components/MakeProposalModal.vue

@@ -10,6 +10,7 @@
     import { useVehiclesStore } from '../stores/vehicles';
     // import { saveProposal } from '../services/vehicles'
     import Swal from 'sweetalert2';
+    import { useI18n } from 'vue-i18n';
 
     const mapKey = import.meta.env.VITE_MAP_KEY;
 
@@ -46,6 +47,7 @@
 
 
     defineEmits(['reset-load'])
+    const { t } = useI18n()
 
     onMounted(() => {
         window.addEventListener('resize', handleResize);
@@ -86,13 +88,13 @@
     const handleSumit = async() => {
 
         if(form.vehicle === ""){
-            msgError.value = 'Selecciona vehiculo para continuar';
+            msgError.value = t('errors.vehicle');
             setTimeout(() => {
                 msgError.value = '';
             }, 5000);
             return;
         } else if (form.comments.trim().length <= 0) {
-            msgError.value = 'Agrega un comentario';
+            msgError.value = t('errors.comment');
             setTimeout(() => {
                 msgError.value = '';
             }, 5000);
@@ -111,7 +113,7 @@
                 load : props.load._id
             }
             loadingSubmit.value = true;
-            action = 'creada';
+            action = t('proposals.msgOffertDone');
             result = await companyStore.createPropsal(formData);
         } else {
             let formData = {
@@ -127,14 +129,14 @@
                 _driver: vehicleSelected?.driver.first_name + ' ' + vehicleSelected?.driver.last_name
             }
             loadingSubmit.value = true;
-            action = 'actualizada'
+            action = t('proposals.msgOffertUpdate')
             result = await companyStore.updatePropsalLoad(props.proposal._id, formData, localData);
         }
 
         if(result === 'success') {
             document.getElementById('btnClosemakeProposalModal').click();
             Swal.fire({
-                title: `<strong>Oferta ${action} con éxito!</strong>`,
+                title: `<strong>${action}</strong>`,
                 icon: 'success'
             })
         } else {
@@ -146,8 +148,8 @@
         loadingSubmit.value = false;
     }
 
-    const title = computed(() => (props.proposal) ? 'Modificar oferta' : 'Realizar oferta');
-    const btnSubmit = computed(() => (props.proposal) ? 'Guardar' : 'Enviar');
+    const title = computed(() => (props.proposal) ? t('proposals.modOffer') : t('proposals.makeOffer'));
+    const btnSubmit = computed(() => (props.proposal) ? t('buttons.save') : t('buttons.send'));
 </script>
 
 <template>
@@ -174,19 +176,19 @@
                             <form @submit.prevent="handleSumit" class="box-form mb-4">
                                 <BadgeError :msg="msgError"/>
                                 <div class="custom-selected-field">
-                                    <label class="custom-label" for="vehicle">Vehiculo:</label>
+                                    <label class="custom-label" for="vehicle">{{ t('labels.vehicle') }}:</label>
                                     <select 
                                         class="custom-input-light"
                                         name="vehicle" 
                                         id="vehicle" 
                                         v-model="form.vehicle"
                                     >
-                                        <option disabled value="">-- Seleccionar vehículo --</option>
+                                        <option disabled value="">-- {{ t('proposals.selectVehicle') }} --</option>
                                         <option v-for="vehicle in vehiclesStore.vehicles" :value="vehicle._id">{{vehicle.vehicle_code}}</option>
                                     </select>
                                 </div>
                                 <div class="custom-selected-field">
-                                    <label class="custom-label" for="comment">Comentario:</label>
+                                    <label class="custom-label" for="comment">{{ t('labels.comment') }}:</label>
                                     <textarea 
                                         class="custom-input-light"
                                         name="comment" 
@@ -247,7 +249,7 @@
                         class="btn btn-dark" 
                         data-dismiss="modal"
                         @click="$emit('reset-load')"
-                    >Cerrar</button>
+                    >{{ t('buttons.close') }}</button>
                 </div>
             </div>
         </div>