mirror of
https://gitlab.com/little-lines/frontend.git
synced 2024-11-10 07:34:24 +00:00
front_get
This commit is contained in:
parent
82e1e4e86a
commit
b570367142
1 changed files with 62 additions and 78 deletions
|
@ -1,79 +1,63 @@
|
|||
<template>
|
||||
<!-- <h1>Favorite</h1> -->
|
||||
<div>
|
||||
<h1>My Favorites</h1>
|
||||
<ul>
|
||||
<li v-for="(favorite, index) in favorites" :key="index">
|
||||
<p>Favorite {{ index + 1 }}:</p>
|
||||
<p>Favorite ID: {{ favorite.place_name }}</p>
|
||||
<p>Favorite Name: {{ favorite.place_name }}</p>
|
||||
<!-- แสดงข้อมูลเพิ่มเติมหรือ field อื่นๆ ตามต้องการ -->
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<!-- <v-card
|
||||
class="mx-auto"
|
||||
max-width="420"
|
||||
height="600"
|
||||
>
|
||||
<script>
|
||||
import { ref, onMounted } from 'vue';
|
||||
|
||||
<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>
|
||||
export default {
|
||||
setup() {
|
||||
const favorites = ref([]);
|
||||
|
||||
</v-card> -->
|
||||
onMounted(async () => {
|
||||
try {
|
||||
const currentUser = JSON.parse(sessionStorage.getItem('current_user'));
|
||||
|
||||
<v-card fluid
|
||||
class="mx-auto"
|
||||
max-width="500px"
|
||||
width="90vw"
|
||||
if (currentUser && currentUser.id) {
|
||||
const response = await fetch(`https://little-lines-backend.techtransthai.org/api/favorites/${currentUser.id}`);
|
||||
|
||||
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"
|
||||
if (!response.ok) {
|
||||
throw new Error('Failed to fetch favorites');
|
||||
}
|
||||
|
||||
>
|
||||
<template v-slot:prepend>
|
||||
<v-avatar>
|
||||
<v-img
|
||||
:height="30"
|
||||
src= "./icons/Adwaita/pin.svg"
|
||||
></v-img>
|
||||
</v-avatar>
|
||||
const data = await response.json();
|
||||
favorites.value = data.favorites;
|
||||
console.log(data);
|
||||
}
|
||||
} catch (error) {
|
||||
console.error(error);
|
||||
}
|
||||
});
|
||||
|
||||
</template>
|
||||
return {
|
||||
favorites
|
||||
};
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<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>
|
||||
<style scoped>
|
||||
/* สามารถใส่ style ได้ตามต้องการ */
|
||||
/* ตัวอย่าง */
|
||||
ul {
|
||||
list-style-type: none;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
li {
|
||||
margin-bottom: 20px;
|
||||
border: 1px solid #ccc;
|
||||
padding: 10px;
|
||||
}
|
||||
</style>
|
||||
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import {RouterLink} from 'vue-router';
|
||||
|
||||
const pin_svg = "./icons/Adwaita/pin.svg"
|
||||
const items = [
|
||||
{
|
||||
title: 'หอพักนักศึกษา',
|
||||
desc: 'ลาดกระบัง, กรุงเทพมหานคร',
|
||||
},
|
||||
{
|
||||
title: 'อนุสาวรีย์ชัยสมรภูมิ',
|
||||
desc: 'ราชเทวี, กรุงเทพมหานคร',
|
||||
},
|
||||
]
|
||||
</script>
|
||||
|
||||
<style >
|
||||
|
||||
</style>
|
Loading…
Reference in a new issue