Merge branch 'main' of gitlab.com:openKMITL/little-lines/frontend

This commit is contained in:
NekoVari 2023-11-30 22:14:44 +07:00
commit 09028f31ac
3 changed files with 62 additions and 76 deletions

View file

@ -37,7 +37,7 @@
<v-list-item-title class="text-decoration-underline">{{nearestStructureData.lon}} , {{nearestStructureData.lat}}</v-list-item-title>
</v-list-item>
<v-list-item>
<!-- <v-list-item>
<template v-slot:prepend>
<v-avatar>
<img :src="detial[2].icon"
@ -46,7 +46,7 @@
</v-avatar>
</template>
<v-list-item-title>{{detial[2].title}}</v-list-item-title>
</v-list-item>
</v-list-item> -->
</v-list>
@ -254,7 +254,7 @@ export default {
if (this.isLocationRequested && !this.userLocation) {
return 'Requesting location...';
} else if (this.userLocation) {
return `${this.userLocation.lat.toFixed(6)}, ${this.userLocation.lon.toFixed(6)}`;
return `${this.userLocation.lon.toFixed(6)}, ${this.userLocation.lat.toFixed(6)}`;
}
return 'Location not available';
},
@ -282,6 +282,7 @@ export default {
lon: position.coords.longitude
};
console.log('User Location:', this.userLocation);
this.$emit('updateLocation', this.userLocation);
},
handleLocationError(error) {
console.error('Error getting location:', error);

View file

@ -1,79 +1,58 @@
<template>
<!-- <h1>Favorite</h1> -->
<!-- <v-card
class="mx-auto"
max-width="420"
height="600"
>
<v-list lines="two">
<v-list-item
v-for="item in items"
:key="item.title"
:title="item.title"
:subtitle="item.desc"
:prepend-avatar="pin_svg"
></v-list-item>
</v-list>
</v-card> -->
<v-card fluid
class="mx-auto"
max-width="500px"
width="90vw"
max-height="600px"
height="90vh"
>
<v-list
item-props
lines="three"
>
<v-list-item
v-for="(item, i) in items"
:to="{name: 'destination-info'}"
:key="i"
:value="item"
>
<template v-slot:prepend>
<v-avatar>
<v-img
:height="30"
src= "./icons/Adwaita/pin.svg"
></v-img>
</v-avatar>
<div>
<h1>Favorites</h1>
<ul class="favorite-list">
<li v-for="(favorite, index) in favorite" :key="index" class="favorite-item">
{{ favorite.place_name }} <!-- แสดงขอม favorites ตามความเหมาะสม -->
</li>
</ul>
</div>
</template>
<v-list-item-title v-text="item.title"></v-list-item-title>
<v-list-item-subtitle v-text="item.desc"></v-list-item-subtitle>
<v-divider></v-divider>
</v-list-item>
</v-list>
</v-card>
<script>
import { ref, onMounted } from 'vue';
export default {
setup() {
const favorite = ref([]);
</template>
onMounted(async () => {
try {
const currentUser = JSON.parse(sessionStorage.getItem('current_user'));
<script setup>
import {RouterLink} from 'vue-router';
if (currentUser && currentUser.id) {
const response = await fetch(`https://little-lines-backend.techtransthai.org/api/favorites/${currentUser.id}`);
const pin_svg = "./icons/Adwaita/pin.svg"
const items = [
{
title: 'หอพักนักศึกษา',
desc: 'ลาดกระบัง, กรุงเทพมหานคร',
},
{
title: 'อนุสาวรีย์ชัยสมรภูมิ',
desc: 'ราชเทวี, กรุงเทพมหานคร',
},
]
if (!response.ok) {
throw new Error('Failed to fetch favorites');
}
const data = await response.json();
favorite.value = data;
}
} catch (error) {
console.error(error);
}
});
return {
favorite
};
}
};
</script>
<style>
/* CSS เพื่อแสดงแต่ละข้อมูลเป็น block */
.favorite-list {
list-style-type: none;
padding: 0;
}
.favorite-item {
display: block;
padding: 10px;
border: 1px solid #ccc;
margin-bottom: 5px;
}
</style>

View file

@ -10,7 +10,7 @@
v-if="popupData"
:nearestStructureData="popupData"
:onClose="closePopup"
@updateLocation="handleUserLocation"
/>
</div>
@ -94,6 +94,7 @@ import { ref } from "vue";
import axios from "axios";
import DestinationInfoCard from '@/components/DestinationInfoCard.vue';
const center = ref([100.538611, 13.764722]);
const projection = ref("EPSG:4326");
const zoom = ref(19);
@ -151,6 +152,11 @@ const closePopup = () => {
popupData.value = null; // Hide popup
};
const handleUserLocation = (location) => {
console.log("Received user location:", location);
};
</script>
<style>