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

load tracking public

Browse Source
This commit is contained in:
Alexandro Uc Santos
2024-03-28 19:31:43 -06:00
parent 9b8fb0aac0
commit 479d7fbdc4
7 changed files with 88 additions and 31 deletions
Download Patch File Download Diff File Expand all files Collapse all files

37
src/views/TrackingLoadView.vue
View File

@@ -1,20 +1,18 @@
<script setup>
import { onMounted, ref } from 'vue';
import { useLoadsStore } from '../stores/loads';
import { useRoute } from 'vue-router';
import Spiner from '../components/ui/Spiner.vue';
import CardLoad from '../components/CardLoad.vue';
import useDirectionsRender from '../composables/useDirectionRender';
import { GoogleMap, Marker, CustomMarker, Polyline } from 'vue3-google-map';
import CardEmpty from '../components/CardEmpty.vue';
import useTrackingLoad from '../composables/useTrackingLoad';
const mapKey = import.meta.env.VITE_MAP_KEY;
const isLoading = ref(true);
const loadStore = useLoadsStore();
const { geocodeAddress, getDirections } = useDirectionsRender()
const { getLoadTracking, load, loading } = useTrackingLoad();
const route = useRoute();
const load = ref(null);
const zoom = ref(6);
const heightMap = ref(768);
const vehicleLastLocation = ref(null);
@@ -34,15 +32,18 @@
});
const initData = async() => {
isLoading.value = true;
const filter = "?shipment_code[$in]=" + route.params['code'];
const resp = await loadStore.getLoad(filter);
console.log(resp);
if(resp.total > 0) {
load.value = resp.data[0];
originCoords.value = await geocodeAddress(load.value.origin_formatted_address);
destinationCoords.value = await geocodeAddress(load.value.destination_formatted_address);
console.log(load.value.vehicle)
const id = route.params['code'];
await getLoadTracking(id)
if(load.value !== null) {
const addressOrigin = load.value.origin_geo?.coordinates;
const addressDestination = load.value.destination_geo?.coordinates;
if(addressOrigin !== null) {
originCoords.value = {lat: Number.parseFloat(addressOrigin[0]), lng: Number.parseFloat(addressOrigin[1])};
}
if(addressDestination !== null) {
destinationCoords.value = {lat: Number.parseFloat(addressDestination[0]), lng: Number.parseFloat(addressDestination[1])};
}
if(load.value.vehicle) {
vehicleLastLocation.value = {
lat: parseFloat(load.value.vehicle.last_location_lat),
@@ -71,7 +72,6 @@
}
}
isLoading.value = false;
}
const handleResize = () => {
@@ -87,11 +87,12 @@
</script>
<template>
<h2 class="title text-center">Seguimiento de carga</h2>
<Spiner v-if="isLoading"/>
<h2 class="title text-center mt-5">Seguimiento de carga</h2>
<Spiner v-if="loading"/>
<div v-else>
<div v-if="load">
<CardLoad :load="load" :read-only="true"/>
<br/>
<GoogleMap
:api-key="mapKey"
:center="{lat:19.432600, lng:-99.133209}"
@@ -108,8 +109,8 @@
fullscreenControl: true
}"
>
<Marker v-if="originCoords" :options="{position: originCoords, label: 'O', title: 'Destino'}" />
<Marker v-if="destinationCoords" :options="{position: destinationCoords, label: 'D', title: 'Origen'}" />
<Marker :options="{position: originCoords, label: 'O', title: 'Destino'}" />
<Marker :options="{position: destinationCoords, label: 'D', title: 'Origen'}" />
<CustomMarker
v-if="vehicleLastLocation && load.vehicle.background_tracking && isLoadActive"
:options="{position: vehicleLastLocation}"