diff --git a/src/components/CustomPopup.vue b/src/components/CustomPopup.vue new file mode 100644 index 0000000..421ff1f --- /dev/null +++ b/src/components/CustomPopup.vue @@ -0,0 +1,93 @@ + + + + + + \ No newline at end of file diff --git a/src/components/FormLoadModal.vue b/src/components/FormLoadModal.vue index 4e0b148..70fe09f 100644 --- a/src/components/FormLoadModal.vue +++ b/src/components/FormLoadModal.vue @@ -79,7 +79,6 @@ formLoad.owner = auth.user?.first_name + ' ' + auth.user?.last_name; //origin_formatted_address if(loadStore.currentLoad){ - console.log(loadStore.currentLoad); formLoad.price = loadStore.currentLoad.actual_cost; formLoad.segment = loadStore.currentLoad.categories?.length <= 0 ? [] : loadStore.currentLoad.categories.map(m =>{ return m; @@ -131,7 +130,6 @@ watch([originCoords, destinationCoords], async() => { if(originCoords.value && destinationCoords.value) { - // console.log('Se llama api direcciones ') polylines.value = await getDirections(originCoords.value, destinationCoords.value); } }) @@ -406,7 +404,7 @@ v-model:field="formLoad.dateDownload" /> Dirección de origen
- -
@@ -521,8 +519,8 @@

Dirección de destino

- -
diff --git a/src/composables/useDirectionRender.js b/src/composables/useDirectionRender.js index ea59fea..7252f43 100644 --- a/src/composables/useDirectionRender.js +++ b/src/composables/useDirectionRender.js @@ -7,31 +7,39 @@ export default function useDirectionsRender() { const originCoords = ref(null); const destinationCoords = ref(null); - // const polylines = ref([]); + + // const geocodeAddress = async (address) => { + // try { + // const response = await fetch( + // `https://maps.googleapis.com/maps/api/geocode/json?address=${encodeURIComponent( + // address + // )}&key=${mapKey}` + // ); + // const data = await response.json(); + // const location = data.results[0].geometry.location; + // return location; + // } catch (error) { + // return null; + // } + // }; + const geocodeAddress = async (address) => { - // Utiliza la API de geocodificación de Google Maps para obtener las coordenadas - // const apiKey = 'AIzaSyAJtfvrAKy7vnUSv2nzk4dYQkOs3OP4MMs'; // Reemplaza con tu clave de API try { - const response = await fetch( - `https://maps.googleapis.com/maps/api/geocode/json?address=${encodeURIComponent( - address - )}&key=${mapKey}` - ); - const data = await response.json(); - const location = data.results[0].geometry.location; - return location; + const geocoder = new google.maps.Geocoder(); + console.log(address) + const data = await geocoder.geocode({ address: address }); + const latitude = data.results[0].geometry.location.lat(); + const longitude = data.results[0].geometry.location.lng(); + return {lng: longitude, lat: latitude}; } catch (error) { + console.log('Error location', error); return null; } }; const getDirections = async (originCoords, destinationCoords) => { - // const originLatLng = `${originCoords.lat},${originCoords.lng}`; - // const destinationLatLng = `${destinationCoords.lat},${destinationCoords.lng}`; try { const directionsService = new google.maps.DirectionsService(); - // const origin = google.maps.LatLng(originCoords.lat, originCoords.lng) - // const destination = google.maps.LatLng(destinationCoords.lat, destinationCoords.lng) const request = { origin: {lat: Number.parseFloat(originCoords.lat), lng: Number.parseFloat(originCoords.lng)}, destination: {lat: Number.parseFloat(destinationCoords.lat), lng: Number.parseFloat(destinationCoords.lng)}, diff --git a/src/services/auth.js b/src/services/auth.js index a8c4ea9..59a170c 100644 --- a/src/services/auth.js +++ b/src/services/auth.js @@ -9,7 +9,6 @@ export const login = async(body) => { console.log('auth: ', data); if(data.accessToken !== null){ if(data.user.job_role !== 'driver'){ - //TODO: Guardar token y datos del usuario return { msg: 'success', data diff --git a/src/views/LocationsView.vue b/src/views/LocationsView.vue index 9a7b40c..06e67d0 100644 --- a/src/views/LocationsView.vue +++ b/src/views/LocationsView.vue @@ -6,6 +6,7 @@ import CreateLocationModal from '../components/CreateLocationModal.vue'; import CardLocation from '../components/CardLocation.vue'; import Pagination from '../components/Pagination.vue'; +import CustomPopup from '../components/CustomPopup.vue'; const companyStore = useCompanyStore(); @@ -14,6 +15,9 @@ const query = ref(''); const locationCurrent = ref(null); const openModal = ref(false); + // const typeDirection = ref(null) + const typeDirection = ref({value: 'both', label: 'Ambas'}) + const openPopup = ref(false); onMounted(() => { getInitData(); @@ -94,9 +98,36 @@ locationCurrent.value = null; } + const selectedType = (type) => { + console.log(type) + typeDirection.value = type + openPopup.value = false + } + + const optionsFilter = [ + {value: 'both',label: 'Ambas'}, + {value: 'load',label: 'Carga'}, + {value: 'download',label: 'Descarga'} + ] + + const closePopup = () => { + openPopup.value = false + } +