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

add: delete load

Browse Source
This commit is contained in:
Alexandro Uc Santos
2023-12-14 21:59:45 -06:00
parent 292d125216
commit 4228ba5129
7 changed files with 179 additions and 78 deletions
Download Patch File Download Diff File Expand all files Collapse all files

49
src/components/CardLoad.vue
View File

@@ -3,6 +3,7 @@
import { getStatusPublished } from '../helpers/status';
import { getStatusLoad } from '../helpers/status';
import { useLoadsStore } from '../stores/loads';
import Swal from 'sweetalert2'
const loadsStore = useLoadsStore();
@@ -11,13 +12,55 @@
type: Object,
required: true,
}
})
});
const openAttachmentsModal = () => {
loadsStore.currentLoad = props.load;
loadsStore.openAttachmentsModal = true;
}
const handleDeleteLoad = async() => {
Swal.fire({
title: 'Eliminar carga!',
text: '¿Estás seguro de eliminar esta carga?',
icon: 'warning',
showCancelButton: true,
cancelButtonColor: "#d33",
confirmButtonText: 'Eliminar',
cancelButtonText: 'Cancelar',
}).then(async(result) => {
if(result.isConfirmed) {
Swal.fire({
title: 'Por favor espere!',
html: 'Eliminando carga...',// add html attribute if you want or remove
allowOutsideClick: false,
didOpen: () => {
Swal.showLoading()
},
});
const resp = await loadsStore.deleteLoad(props.load._id);
if(resp != null) {
loadsStore.loads = loadsStore.loads.filter(load => load._id !== props.load._id);
Swal.fire({
title: "Carga eliminada!",
text: "Tu carga ha sido eliminada exitosamente.",
icon: "success"
});
} else {
Swal.fire({
title: "No eliminado!",
text: "Tu carga no se pudo eliminar, intente más tarde.",
icon: "error"
});
}
}
});
}
const openEditModal = () => {
loadsStore.currentLoad = props.load
loadsStore.openModalEdit = true;
@@ -74,7 +117,7 @@
<div class="btn-row">
<button
class="btn-primary-sm bg-dark"
data-toggle="modal" data-target="#editcompanymodal"
@click="handleDeleteLoad"
><i class="fa-solid fa-ban clear-sm"></i> Cancelar</button>
<button v-if="load.status !== 'Draft' && load.load_status !== 'Published' && load.load_status !== 'Loading'"
type="button"
@@ -86,11 +129,13 @@
Evidencias
</button>
<button
v-if="load.load_status !== 'Delivered'"
class="btn-primary-sm"
data-toggle="modal" data-target="#formLoadModal"
@click="openEditModal"
><i class="fa-solid fa-pen-to-square clear-sm"></i> Editar carga</button>
<button
v-if="load.status !== 'Draft'"
class="btn-primary-sm"
@click="openProposalsModal"
data-toggle="modal"

69
src/components/FormLoadModal.vue
View File

@@ -6,13 +6,12 @@
import TruckTypes from './ui/TruckTypes.vue';
import Cities from './ui/Cities.vue';
import States from './ui/States.vue';
import Spiner from './ui/Spiner.vue';
import Products from './ui/Products.vue';
import { GoogleMap, Marker, Polyline } from "vue3-google-map";
import useDirectionsRender from '../composables/useDirectionRender';
import { useAuthStore } from '../stores/auth';
import { useRouter } from 'vue-router';
const router = useRouter()
const loadStore = useLoadsStore();
const auth = useAuthStore();
const windowWidth = ref(window.innerWidth);
@@ -22,6 +21,7 @@
const destinationCoords = ref(null);
const startLocation = ref(null);
const endLocation = ref(null);
const isLoading = ref(false);
const { geocodeAddress } = useDirectionsRender();
@@ -61,8 +61,8 @@
formLoad.owner = loadStore.currentLoad.posted_by_name;
formLoad.notes = loadStore.currentLoad.notes;
formLoad.weight = loadStore.currentLoad.weight;
formLoad.dateLoad = loadStore.currentLoad.est_loading_date.substring(0, 10);
formLoad.dateDownload = loadStore.currentLoad.est_unloading_date.substring(0, 10);
formLoad.dateLoad = loadStore.currentLoad.est_loading_date?.substring(0, 10);
formLoad.dateDownload = loadStore.currentLoad.est_unloading_date?.substring(0, 10);
formLoad.truckType = {meta_value: loadStore.currentLoad.truck_type};
origin.locationName = loadStore.currentLoad.origin.company_name;
@@ -84,6 +84,7 @@
}
watch(origin, async() => {
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);
@@ -103,8 +104,12 @@
})
const getCoordsMap = async() => {
originCoords.value = await geocodeAddress(loadStore.currentLoad.origin_formatted_address);
destinationCoords.value = await geocodeAddress(loadStore.currentLoad.destination_formatted_address);
if(loadStore.currentLoad.origin_formatted_address) {
originCoords.value = await geocodeAddress(loadStore.currentLoad.origin_formatted_address);
}
if(loadStore.currentLoad.destination_formatted_address){
destinationCoords.value = await geocodeAddress(loadStore.currentLoad.destination_formatted_address);
}
}
@@ -158,8 +163,8 @@
country : origin.country,
landmark : origin.ref,
zipcode : origin.postalCode,
lat : originCoords.value.lat,
lng : originCoords.value.lng
lat : originCoords.value?.lat,
lng : originCoords.value?.lng
},
destination:{
company_name : destination.locationName,
@@ -169,8 +174,8 @@
country : destination.country,
landmark : destination.ref,
zipcode : destination.postalCode,
lat : destinationCoords.value.lat,
lng : destinationCoords.value.lng
lat : destinationCoords.value?.lat,
lng : destinationCoords.value?.lng
},
company: auth.user.company,
posted_by: auth.user._id,
@@ -178,14 +183,18 @@
};
console.log('loadData: ', loadData);
isLoading.value = true;
if(loadStore.currentLoad){
const resp = await loadStore.updateLoad(loadStore.currentLoad._id, loadData);
const index = loadStore.loads.findIndex((load) => load._id === resp._id);
isLoading.value = false;
loadStore.loads[index] = resp;
document.getElementById('btnCloseFormLoadModal').click();
} else{
const resp = await loadStore.saveLoad(loadData);
loadStore.loads.push(resp);
isLoading.value = false;
loadStore.loads.unshift(resp);
document.getElementById('btnCloseFormLoadModal').click();
}
}
</script>
@@ -406,21 +415,24 @@
</GoogleMap>
</div>
<div class="modal-footer custom-footer">
<button
type="button"
class="btn btn-dark"
@click="clearLoad"
data-dismiss="modal">Cerrar</button>
<button
type="button"
class="btn btn-dark"
@click="handleSave"
>Guardar</button>
<button
type="button"
class="btn-primary-sm radius-sm"
@click=""
>Publicar</button>
<Spiner v-if="isLoading"/>
<div v-else class="btns-footer">
<button
type="button"
class="btn btn-dark"
@click="clearLoad"
data-dismiss="modal">Cerrar</button>
<button
type="button"
class="btn btn-dark"
@click="handleSave"
>Guardar</button>
<button
type="button"
class="btn-primary-sm radius-sm"
@click=""
>Publicar</button>
</div>
</div>
</div>
</div>
@@ -455,6 +467,11 @@
justify-content: center;
}
.btns-footer {
display: flex;
gap: 1rem;
}
.radius-sm{
border-radius: 5px;
}

101
src/components/ProposalsModal.vue
View File

@@ -4,6 +4,8 @@
import Spiner from './ui/Spiner.vue';
import { getDateMonthDay } from '../helpers/date_formats';
import VehicleInfo from './VehicleInfo.vue';
import Swal from 'sweetalert2'
const loadsStore = useLoadsStore();
const isLoading = ref(false);
@@ -32,13 +34,23 @@
};
}
const handleCancelProposal = (proposal) => {
const index = loadsStore.proposalsOfLoads.findIndex((p) => p._id === proposal._id);
// console.log(loadsStore.proposalsOfLoads[index])
loadsStore.proposalsOfLoads[index] = {
...proposal,
is_accepted: false
};
const handleCancelProposal = async(proposal) => {
const {isConfirmed} = await Swal.fire({
title: 'Cancelar oferta!',
text: '¿Estás seguro de cancelar esta oferta?',
icon: 'question',
showCancelButton: true,
confirmButtonText: 'Si',
cancelButtonText: 'No'
})
if( isConfirmed ) {
const index = loadsStore.proposalsOfLoads.findIndex((p) => p._id === proposal._id);
// console.log(loadsStore.proposalsOfLoads[index])
loadsStore.proposalsOfLoads[index] = {
...proposal,
is_accepted: false
};
}
}
</script>
@@ -59,44 +71,49 @@
</div>
<div class="modal-body view-proposals">
<Spiner v-if="isLoading"/>
<div v-else v-for="proposal in loadsStore.proposalsOfLoads" class="card-fixed card-proposal">
<div class="row">
<div class="col-lg-6 col-md-12">
<p>Empresa: <span>{{ proposal.carrier.company_name }}</span></p>
<p>Licitador: <span>{{ proposal.bidder.first_name }} {{ proposal.bidder.last_name }}</span></p>
<p># de registro del transportista: <span v-if="proposal.vehicle">{{proposal.vehicle.vehicle_code}}</span></p>
<div v-else>
<div v-if="loadsStore.proposalsOfLoads.length > 0" v-for="proposal in loadsStore.proposalsOfLoads" class="card-fixed card-proposal">
<div class="row">
<div class="col-lg-6 col-md-12">
<p>Empresa: <span>{{ proposal.carrier.company_name }}</span></p>
<p>Licitador: <span>{{ proposal.bidder.first_name }} {{ proposal.bidder.last_name }}</span></p>
<p># de registro del transportista: <span v-if="proposal.vehicle">{{proposal.vehicle.vehicle_code}}</span></p>
</div>
<div class="col-lg-6 col-md-12">
<p>Fecha: <span>{{ getDateMonthDay(proposal.createdAt) }}</span></p>
<p>Tipo de Transporte: <span v-if="proposal.vehicle">{{proposal.vehicle.truck_type}}</span></p>
<p>Transportista: <span v-if="proposal._driver">{{proposal._driver}}</span></p>
</div>
</div>
<div class="col-lg-6 col-md-12">
<p>Fecha: <span>{{ getDateMonthDay(proposal.createdAt) }}</span></p>
<p>Tipo de Transporte: <span v-if="proposal.vehicle">{{proposal.vehicle.truck_type}}</span></p>
<p>Transportista: <span v-if="proposal._driver">{{proposal._driver}}</span></p>
<div v-if="proposal.comment" class="box-note">
{{ proposal.comment }}
</div>
</div>
<div v-if="proposal.comment" class="box-note">
{{ proposal.comment }}
</div>
<VehicleInfo v-if="proposal.vehicle" :vehicle="proposal.vehicle"/>
<div class="d-flex justify-content-end gap-3">
<div v-if="proposal.is_accepted" class="indicator-check">
<i class="fa-solid fa-check"></i>
Aceptado
</div>
<button v-if="!proposal.is_accepted"
type="button"
class="btn-primary-sm"
@click="handleAceptedProposal(proposal)"
>
<i class="fa-solid fa-check"></i>
Aceptar
</button>
<button
v-if="proposal.load.load_status !== 'Delivered'"
class="btn-primary-sm"
@click="handleCancelProposal(proposal)"
<VehicleInfo v-if="proposal.vehicle" :vehicle="proposal.vehicle"/>
<div class="d-flex justify-content-end gap-3">
<div v-if="proposal.is_accepted" class="indicator-check">
<i class="fa-solid fa-check"></i>
Aceptado
</div>
<button v-if="!proposal.is_accepted"
type="button"
class="btn-primary-sm"
@click="handleAceptedProposal(proposal)"
>
<i class="fa-solid fa-ban clear-sm"></i>
Cancelar
</button>
<i class="fa-solid fa-check"></i>
Aceptar
</button>
<button
v-if="proposal.load.load_status !== 'Delivered' && proposal.is_accepted"
class="btn-primary-sm"
@click="handleCancelProposal(proposal)"
>
<i class="fa-solid fa-ban clear-sm"></i>
Cancelar
</button>
</div>
</div>
<div v-else>
No hay ofertas
</div>
</div>
</div>

4
src/helpers/status.js
View File

@@ -23,8 +23,8 @@ export const getStatusLoad = (load) => {
color = "#000000";
break;
default:
status = 'Publicado';
color = "#428502";
status = 'Sin publicar';
color = "#000000";
break;
}
return {

23
src/stores/loads.js
View File

@@ -23,7 +23,7 @@ export const useLoadsStore = defineStore('load', () => {
try {
const endpoint = `/loads?company=${companyid}&${filterStr}`;
const {data} = await api.get(endpoint);
console.log(data);
// console.log(data);
loads.value = data.data;
} catch (error) {
loads.value = [];
@@ -34,9 +34,8 @@ export const useLoadsStore = defineStore('load', () => {
const getProposalsOfLoads = async(filterQuery) => {
try {
const endpoint = `/proposals/?load=${filterQuery}`;
console.log(endpoint);
const {data} = await api.get(endpoint);
console.log(data);
// console.log(data);
proposalsOfLoads.value = data.data;
} catch (error) {
proposalsOfLoads.value = [];
@@ -47,9 +46,8 @@ export const useLoadsStore = defineStore('load', () => {
const saveLoad = async(load) => {
try {
const endpoint = `/loads/`;
console.log(endpoint);
const {data} = await api.post(endpoint, load);
console.log(data);
// console.log(data);
return data;
} catch (error) {
console.log(error);
@@ -60,8 +58,20 @@ export const useLoadsStore = defineStore('load', () => {
const updateLoad = async(loadId, load) => {
try {
const endpoint = `/loads/${loadId}`;
console.log(endpoint);
const {data} = await api.patch(endpoint, load);
// console.log(data);
return data;
} catch (error) {
console.log(error);
return null;
}
}
const deleteLoad = async(loadId) => {
try {
const endpoint = `/loads/${loadId}`;
console.log(endpoint);
const {data} = await api.delete(endpoint);
console.log(data);
return data;
} catch (error) {
@@ -77,6 +87,7 @@ export const useLoadsStore = defineStore('load', () => {
openAttachmentsModal,
getProposalsOfLoads,
getCompanyLoads,
deleteLoad,
saveLoad,
updateLoad,
loads,