add: post load

This commit is contained in:
Alexandro Uc Santos
2023-12-16 19:30:12 -06:00
parent 106349f9a2
commit e6eae48c73
4 changed files with 140 additions and 31 deletions

View File

@@ -12,8 +12,10 @@
import useDirectionsRender from '../composables/useDirectionRender';
import { useAuthStore } from '../stores/auth';
import Swal from 'sweetalert2';
import { useNotificationsStore } from '../stores/notifications';
const loadStore = useLoadsStore();
const notyStore = useNotificationsStore();
const auth = useAuthStore();
const windowWidth = ref(window.innerWidth);
const zoom = ref(6);
@@ -23,7 +25,18 @@
const startLocation = ref(null);
const endLocation = ref(null);
const isLoading = ref(false);
const submited = ref(false);
const { geocodeAddress } = useDirectionsRender();
const formRef = ref(null);
const errors = ref({
segment: null,
product: null,
truckType: null,
cityOrigin: null,
stateOrigin: null,
cityDestination: null,
stateDestination: null,
});
const clearLoad = () => {
@@ -85,12 +98,12 @@
}
watch(origin, async() => {
console.log(origin);
// console.log(origin);
if(origin.address && origin.city && origin.state) {
startLocation.value = origin.address + ', ' + origin.city.city_name + ', ' + origin.state.state_name + ', ' + origin.country + ', ' +origin.postalCode;
originCoords.value = await geocodeAddress(startLocation.value);
console.log('Origin:')
console.log(originCoords.value)
// console.log('Origin:')
// console.log(originCoords.value)
}
})
@@ -98,8 +111,8 @@
if(destination.address && destination.city && destination.state) {
endLocation.value = destination.address + ', ' + destination.city.city_name + ', ' + destination.state.state_name + ', ' + destination.country + ', ' +destination.postalCode;
destinationCoords.value = await geocodeAddress(endLocation.value);
console.log('Destination:')
console.log(destinationCoords.value);
// console.log('Destination:')
// console.log(destinationCoords.value);
}
})
})
@@ -154,7 +167,7 @@
est_unloading_date : formLoad.dateDownload,
notes : formLoad.notes,
weight : formLoad.weight,
product: formLoad.terms || null,
product: formLoad.terms.length <= 0 ? null : formLoad.terms,
categories: formLoad.segment || null,
origin:{
company_name : origin.locationName,
@@ -190,13 +203,12 @@
isLoading.value = true;
if(loadStore.currentLoad){
const resp = await loadStore.updateLoad(loadStore.currentLoad._id, loadData);
console.log({resp});
isLoading.value = false;
if(resp) {
const index = loadStore.loads.findIndex((load) => load._id === resp._id);
loadStore.loads[index] = {
...loadStore.loads[index],
resp
...resp
};
return 'success';
} else {
@@ -206,7 +218,10 @@
const resp = await loadStore.saveLoad(loadData);
isLoading.value = false;
if(resp) {
loadStore.loads.unshift(resp);
loadStore.loads.push({
...resp,
...loadData
});
return 'success';
} else {
return 'error';
@@ -215,12 +230,12 @@
}
const handleSave = async() => {
submited.value = false;
const loadData = setLoadData();
// console.log('loadData: ', loadData);
const resp = await updateLoad(loadData);
if(resp === 'success') {
notyStore.show = 'true';
notyStore.text = 'Carga guardada!'
document.getElementById('btnCloseFormLoadModal').click();
} else {
Swal.fire({
@@ -231,7 +246,21 @@
}
}
const validations = () => {
errors.value = {
segment: formLoad.segment.length <= 0 ? 'Seleccione segmento' : null,
product: formLoad.terms.length <= 0 ? 'Seleccione producto' : null,
truckType: formLoad.truckType.length <= 0 ? 'Seleccione tipo de transporte' : null,
cityOrigin: origin.city.length <= 0 ? 'Seleccione ciudad' : null,
stateOrigin: origin.state.length <= 0 ? 'Seleccione estado' : null,
cityDestination: destination.city.length <= 0 ? 'Seleccione ciudad' : null,
stateDestination: destination.state.length <= 0 ? 'Seleccione estado' : null,
};
}
const handlePostLoad = async() => {
submited.value = true;
let loadData = setLoadData();
loadData = {
@@ -240,16 +269,31 @@
load_status: "Published"
}
const resp = await updateLoad(loadData);
if(resp === 'success') {
document.getElementById('btnCloseFormLoadModal').click();
} else {
Swal.fire({
title: "Error!",
text: "No se pudo publicar carga, intente más tarde",
icon: "error"
});
}
setTimeout(async() => {
const formValid = formRef.value.checkValidity();
validations()
console.log(formValid);
if(formValid){
const hasError = Object.values(errors.value).some(val => val != null);
console.log(hasError);
if(!hasError) {
const resp = await updateLoad(loadData);
if(resp === 'success') {
notyStore.show = 'true';
notyStore.text = 'Carga publicada!'
document.getElementById('btnCloseFormLoadModal').click();
} else {
Swal.fire({
title: "Error!",
text: "No se pudo publicar carga, intente más tarde",
icon: "error"
});
}
} else {
console.log('Hay errores');
}
}
}, 200)
}
</script>
@@ -271,7 +315,7 @@
</button>
</div>
<div class="modal-body">
<form class="form-content">
<form class="form-content" ref="formRef">
<div class="form-box">
<div class="form-section">
<div class="mb-4 mt-3">
@@ -279,18 +323,22 @@
<Segments
v-model="formLoad.segment"
/>
<span class="error-msg" v-if="submited && errors.segment">{{ errors.segment }}</span>
</div>
<div class="mb-4 mt-3">
<label class="custom-label">Tipo de transporte*</label>
<TruckTypes
v-model="formLoad.truckType"
/>
<span class="error-msg" v-if="submited && errors.truckType">{{ errors.truckType }}</span>
</div>
<Custominput
label="Fecha de carga*"
type="date"
:filled="false"
name="date-load"
:required="submited ? true : false"
:error="(submited && !formLoad.dateLoad) ? 'Fecha es requerida' : null"
v-model:field="formLoad.dateLoad"
/>
<Custominput
@@ -298,6 +346,8 @@
type="date"
:filled="false"
name="date-download"
:required="submited ? true : false"
:error="(submited && !formLoad.dateDownload) ? 'Fecha es requerida' : null"
v-model:field="formLoad.dateDownload"
/>
<Custominput
@@ -305,6 +355,8 @@
type="number"
:filled="false"
name="weight"
:required="submited ? true : false"
:error="(submited && !formLoad.weight) ? 'Ingrese peso en KG' : null"
v-model:field="formLoad.weight"
/>
</div>
@@ -314,6 +366,7 @@
<Products
v-model="formLoad.terms"
/>
<span class="error-msg" v-if="submited && errors.product">{{ errors.product }}</span>
</div>
<Custominput
label="Precio*"
@@ -321,6 +374,8 @@
:filled="false"
name="price"
v-model:field="formLoad.price"
:required="submited ? true : false"
:error="(submited && !formLoad.price) ? 'Ingrese precio en MXN' : null"
/>
<Custominput
label="Notas"
@@ -348,6 +403,8 @@
:filled="false"
name="name-location-origin"
v-model:field="origin.locationName"
:required="submited ? true : false"
:error="(submited && !origin.locationName) ? 'Ingrese nombre' : null"
/>
<Custominput
label="Dirección*"
@@ -355,18 +412,22 @@
:filled="false"
name="address-origin"
v-model:field="origin.address"
:required="submited ? true : false"
:error="(submited && !origin.address) ? 'Ingrese dirección' : null"
/>
<div class="mb-4 mt-3">
<label class="custom-label">Ciudad*</label>
<Cities
v-model="origin.city"
/>
<span class="error-msg" v-if="submited && errors.cityOrigin">{{ errors.cityOrigin }}</span>
</div>
<div class="mb-4 mt-3">
<label class="custom-label">Estado*</label>
<States
v-model="origin.state"
/>
<span class="error-msg" v-if="submited && errors.stateOrigin">{{ errors.stateOrigin }}</span>
</div>
<Custominput
label="País*"
@@ -374,6 +435,8 @@
:filled="false"
name="country-origin"
v-model:field="origin.country"
:required="submited ? true : false"
:error="(submited && !origin.country) ? 'Ingrese país' : null"
/>
<Custominput
label="Código Postal*"
@@ -381,6 +444,8 @@
:filled="false"
name="postalCode-origin"
v-model:field="origin.postalCode"
:required="submited ? true : false"
:error="(submited && !origin.postalCode) ? 'Ingrese Código postal' : null"
/>
<Custominput
label="Punto de referencia"
@@ -398,6 +463,8 @@
:filled="false"
name="name-location-destination"
v-model:field="destination.locationName"
:required="submited ? true : false"
:error="(submited && !destination.locationName) ? 'Ingrese nombre' : null"
/>
<Custominput
label="Dirección"
@@ -405,18 +472,22 @@
:filled="false"
name="address-destination"
v-model:field="destination.address"
:required="submited ? true : false"
:error="(submited && !destination.address) ? 'Ingrese dirección' : null"
/>
<div class="mb-4 mt-3">
<label class="custom-label">Ciudad*</label>
<Cities
v-model="destination.city"
/>
<span class="error-msg" v-if="submited && errors.cityDestination">{{ errors.cityDestination }}</span>
</div>
<div class="mb-4 mt-3">
<label class="custom-label">Estado*</label>
<States
v-model="destination.state"
/>
<span class="error-msg" v-if="submited && errors.stateDestination">{{ errors.stateDestination }}</span>
</div>
<Custominput
label="País*"
@@ -424,6 +495,8 @@
:filled="false"
name="country-destination"
v-model:field="destination.country"
:required="submited ? true : false"
:error="(submited && !destination.country) ? 'Ingrese país' : null"
/>
<Custominput
label="Código Postal*"
@@ -431,6 +504,8 @@
:filled="false"
name="postalCode-destination"
v-model:field="destination.postalCode"
:required="submited ? true : false"
:error="(submited && !destination.postalCode) ? 'Ingrese código postal' : null"
/>
<Custominput
label="Punto de referencia"
@@ -483,9 +558,9 @@
@click="handleSave"
>Guardar</button>
<button
type="button"
type="submit"
@click.prevent="handlePostLoad"
class="btn-primary-sm radius-sm"
@click="handlePostLoad"
>Publicar</button>
</div>
</div>
@@ -522,6 +597,12 @@
justify-content: center;
}
.error-msg {
color: red;
font-size: 12px;
font-weight: 300;
}
.btns-footer {
display: flex;
gap: 1rem;