little-lines/frontend
1
0
Fork 0
mirror of https://gitlab.com/little-lines/frontend.git synced 2024-11-22 00:36:52 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

use openrouteservice api

Browse source
This commit is contained in:
NekoVari 2023-11-29 18:50:44 +07:00
parent 2564098b6d
commit d75174d064
1 changed files with 76 additions and 39 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

115
src/components/DestinationInfoCard.vue
View file

@ -231,6 +231,7 @@ const detial = [
</script>
<script>
import axios from "axios";
export default {
props: {
nearestStructureData: Object,
@ -267,9 +268,6 @@ export default {
this.getUserLocation();
this.showRoute = true;
},
enterRoute() {
console.log("Enter Route");
},
getUserLocation() {
this.isLocationRequested = true;
if (navigator.geolocation) {
@ -285,7 +283,6 @@ export default {
};
console.log('User Location:', this.userLocation);
},
handleLocationError(error) {
console.error('Error getting location:', error);
},
@ -294,43 +291,83 @@ export default {
this.showRoute = false;
},
addToFavorites() {
const currentUser = JSON.parse(sessionStorage.getItem('current_user'));
const currentUser = JSON.parse(sessionStorage.getItem('current_user'));
if (currentUser) {
console.log('Logged in. Proceed to add to favorites.');
if (currentUser) {
console.log('Logged in. Proceed to add to favorites.');
fetch("https://little-lines-backend.techtransthai.org/api/favorites/create", {
method: "POST",
headers: {
'Content-Type': 'application/json',
},
body: JSON.stringify({
user_id: currentUser.id, // ใช้ userId ของผู้ใช้ที่ล็อกอินอยู่
place_name: this.nearestStructureData.display_name,
location: {
type: "Point",
coordinates: [parseFloat(this.nearestStructureData.lon), parseFloat(this.nearestStructureData.lat)]
},
wheelchair_access: 'Accessible',
highway_type: 'Highway'
})
})
.then((res) => {
if (res.ok) {
console.log('Add to favorites success');
return res.json();
} else {
throw Error(`Add to favorites failed (${res.status})`);
}
})
.catch((err) => {
console.log(err);
});
} else {
console.log('User not logged in. Unable to add to favorites.');
this.$router.push({ name: 'login' });
}
}
fetch("https://little-lines-backend.techtransthai.org/api/favorites/create", {
method: "POST",
headers: {
'Content-Type': 'application/json',
},
body: JSON.stringify({
user_id: currentUser.id, // ใช้ userId ของผู้ใช้ที่ล็อกอินอยู่
place_name: this.nearestStructureData.display_name,
location: {
type: "Point",
coordinates: [parseFloat(this.nearestStructureData.lon), parseFloat(this.nearestStructureData.lat)]
},
wheelchair_access: 'Accessible',
highway_type: 'Highway'
})
})
.then((res) => {
if (res.ok) {
console.log('Add to favorites success');
return res.json();
} else {
throw Error(`Add to favorites failed (${res.status})`);
}
})
.catch((err) => {
console.log(err);
});
} else {
console.log('User not logged in. Unable to add to favorites.');
this.$router.push({ name: 'login' });
}
},
enterRoute(){
console.log("start routing!.")
// Make a request to OpenRouteService API for a sample route
const apiKey = import.meta.env.VITE_OPENROUTESERVICE_API_KEY;
const startCoord = '100.53860,13.76410'; //(lon,lat) test data
const endCoord = '100.53928,13.76526';//(lon,lat) test data
axios.get(`https://api.openrouteservice.org/v2/directions/driving-car?api_key=${apiKey}&start=${startCoord}&end=${endCoord}`)
.then(response => {
const route = response.data.features[0].geometry.coordinates;
console.log('This is route :',route)
// this.plotRoute(route);
})
.catch(error => {
console.error('Error fetching route:', error);
});
},
// plotRoute(coordinates) {
// const routeFeature = new Feature({
// geometry: new LineString(coordinates).transform('EPSG:4326', 'EPSG:3857'),
// });
// routeFeature.setStyle(
// new Style({
// stroke: new Stroke({
// color: 'blue',
// width: 2,
// }),
// })
// );
// const vectorLayer = new VectorLayer({
// source: new VectorSource({
// features: [routeFeature],
// }),
// });
// this.map.addLayer(vectorLayer);
// this.ma
},