little-lines/frontend
1
0
Fork 0
mirror of https://gitlab.com/little-lines/frontend.git synced 2024-11-22 05:36:51 +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>
<script> <script>
import axios from "axios";
export default { export default {
props: { props: {
nearestStructureData: Object, nearestStructureData: Object,
@ -267,9 +268,6 @@ export default {
this.getUserLocation(); this.getUserLocation();
this.showRoute = true; this.showRoute = true;
}, },
enterRoute() {
console.log("Enter Route");
},
getUserLocation() { getUserLocation() {
this.isLocationRequested = true; this.isLocationRequested = true;
if (navigator.geolocation) { if (navigator.geolocation) {
@ -285,7 +283,6 @@ export default {
}; };
console.log('User Location:', this.userLocation); console.log('User Location:', this.userLocation);
}, },
handleLocationError(error) { handleLocationError(error) {
console.error('Error getting location:', error); console.error('Error getting location:', error);
}, },
@ -294,43 +291,83 @@ export default {
this.showRoute = false; this.showRoute = false;
}, },
addToFavorites() { addToFavorites() {
const currentUser = JSON.parse(sessionStorage.getItem('current_user')); const currentUser = JSON.parse(sessionStorage.getItem('current_user'));
if (currentUser) { if (currentUser) {
console.log('Logged in. Proceed to add to favorites.'); console.log('Logged in. Proceed to add to favorites.');
fetch("https://little-lines-backend.techtransthai.org/api/favorites/create", { fetch("https://little-lines-backend.techtransthai.org/api/favorites/create", {
method: "POST", method: "POST",
headers: { headers: {
'Content-Type': 'application/json', 'Content-Type': 'application/json',
}, },
body: JSON.stringify({ body: JSON.stringify({
user_id: currentUser.id, // ใช้ userId ของผู้ใช้ที่ล็อกอินอยู่ user_id: currentUser.id, // ใช้ userId ของผู้ใช้ที่ล็อกอินอยู่
place_name: this.nearestStructureData.display_name, place_name: this.nearestStructureData.display_name,
location: { location: {
type: "Point", type: "Point",
coordinates: [parseFloat(this.nearestStructureData.lon), parseFloat(this.nearestStructureData.lat)] coordinates: [parseFloat(this.nearestStructureData.lon), parseFloat(this.nearestStructureData.lat)]
}, },
wheelchair_access: 'Accessible', wheelchair_access: 'Accessible',
highway_type: 'Highway' highway_type: 'Highway'
}) })
}) })
.then((res) => { .then((res) => {
if (res.ok) { if (res.ok) {
console.log('Add to favorites success'); console.log('Add to favorites success');
return res.json(); return res.json();
} else { } else {
throw Error(`Add to favorites failed (${res.status})`); throw Error(`Add to favorites failed (${res.status})`);
} }
}) })
.catch((err) => { .catch((err) => {
console.log(err); console.log(err);
}); });
} else { } else {
console.log('User not logged in. Unable to add to favorites.'); console.log('User not logged in. Unable to add to favorites.');
this.$router.push({ name: 'login' }); 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
}, },