b8906efc80
Some checks failed
ci / ci (22, ubuntu-latest) (push) Has been cancelled
Nuxt 4 + Supabase + Flightics API. Incluye búsqueda de vuelos, inspiraciones, watchlist, tracking de precios y mapa interactivo. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
53 lines
1.2 KiB
Vue
53 lines
1.2 KiB
Vue
<script setup lang="ts">
|
|
const props = defineProps<{
|
|
bookingToken: string
|
|
routeSummary: string
|
|
departureCode: string
|
|
arrivalCode: string
|
|
departureDate: string
|
|
price: number
|
|
passengers: { adult: number; child: number; infant: number }
|
|
}>()
|
|
|
|
const user = useSupabaseUser()
|
|
const { isWatched, getWatchedItem, add, remove } = useWatchlist()
|
|
|
|
const toggling = ref(false)
|
|
const watched = computed(() => isWatched(props.bookingToken))
|
|
|
|
async function toggle() {
|
|
if (!user.value) {
|
|
await navigateTo('/auth')
|
|
return
|
|
}
|
|
|
|
toggling.value = true
|
|
if (watched.value) {
|
|
const item = getWatchedItem(props.bookingToken)
|
|
if (item) await remove(item.id)
|
|
} else {
|
|
await add({
|
|
bookingToken: props.bookingToken,
|
|
routeSummary: props.routeSummary,
|
|
departureCode: props.departureCode,
|
|
arrivalCode: props.arrivalCode,
|
|
departureDate: props.departureDate,
|
|
price: props.price,
|
|
passengers: props.passengers
|
|
})
|
|
}
|
|
toggling.value = false
|
|
}
|
|
</script>
|
|
|
|
<template>
|
|
<UButton
|
|
:icon="watched ? 'i-lucide-heart' : 'i-lucide-heart'"
|
|
:color="watched ? 'error' : 'neutral'"
|
|
:variant="watched ? 'soft' : 'ghost'"
|
|
:loading="toggling"
|
|
size="sm"
|
|
@click.stop="toggle"
|
|
/>
|
|
</template>
|