55 lines
2.0 KiB
Vue
55 lines
2.0 KiB
Vue
<template>
|
|
<div>
|
|
<div class="flex flex-col gap-3 p-3">
|
|
<Card v-for="place in places"
|
|
:pt="{ root: (rent.auto_leadas_hely == place) ? 'bg-primary-500 text-white mb-3' : 'mb-3' }">
|
|
<template #content>
|
|
<div class="flex gap-3" @click="next(place)">
|
|
<div class="flex justify-center items-center text-3xl font-bold" style="width: 56px; font-size: 32px;">
|
|
<template v-if="place.icon == 'airplane'">
|
|
<Icon name="ph:airplane-takeoff" size="48" />
|
|
</template>
|
|
<template v-if="place.icon == 'office'">
|
|
<svg xmlns="http://www.w3.org/2000/svg" width="48" height="48" viewBox="0 0 256 256">
|
|
<path fill="currentColor"
|
|
d="M248 208h-16V96a8 8 0 0 0 0-16h-48V48a8 8 0 0 0 0-16H40a8 8 0 0 0 0 16v160H24a8 8 0 0 0 0 16h224a8 8 0 0 0 0-16M216 96v112h-32V96ZM56 48h112v160h-24v-48a8 8 0 0 0-8-8H88a8 8 0 0 0-8 8v48H56Zm72 160H96v-40h32ZM72 80a8 8 0 0 1 8-8h16a8 8 0 0 1 0 16H80a8 8 0 0 1-8-8m48 0a8 8 0 0 1 8-8h16a8 8 0 0 1 0 16h-16a8 8 0 0 1-8-8m-48 40a8 8 0 0 1 8-8h16a8 8 0 0 1 0 16H80a8 8 0 0 1-8-8m48 0a8 8 0 0 1 8-8h16a8 8 0 0 1 0 16h-16a8 8 0 0 1-8-8" />
|
|
</svg>
|
|
</template>
|
|
</div>
|
|
<div class="w-full">
|
|
<div class="text-sm"><b>{{ place.name }}</b></div>
|
|
<div class="text-sm">{{ place.address }}</div>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
</Card>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<script lang="ts" setup>
|
|
const { rent } = storeToRefs(useAuthStore())
|
|
|
|
definePageMeta({
|
|
rentStep: 4,
|
|
title: 'Autóleadás helye'
|
|
})
|
|
const placeStore = useMyPlacesStore()
|
|
|
|
const places: PlaceType[] = computed(() => {
|
|
return placeStore.places
|
|
})
|
|
|
|
let HUFormat = new Intl.NumberFormat('hu-HU', {
|
|
style: 'currency',
|
|
currency: 'HUF',
|
|
maximumFractionDigits: 0
|
|
});
|
|
|
|
function next(val) {
|
|
rent.value.auto_leadas_hely = val
|
|
navigateTo('/rent/extra')
|
|
}
|
|
</script>
|
|
|
|
<style></style> |