55 lines
1.4 KiB
Vue
55 lines
1.4 KiB
Vue
<template>
|
|
<div>
|
|
<div class="text-center">Autóbérlés kezdete</div>
|
|
<div class="flex flex-col p-3">
|
|
<DatePicker inline :min-date="(new Date())" v-model="selectedDate"/>
|
|
</div>
|
|
|
|
<div class="flex flex-col p-3">
|
|
Időpont
|
|
<Dropdown :options="timeList" v-model="rent.auto_felvetel_idopont" />
|
|
</div>
|
|
<div class="p-3">
|
|
<Button @click="next()" class="max-sm:w-full min-w-20" v-if="rent.auto_felvetel_datum && rent.auto_felvetel_idopont">Tovább</Button>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<script lang="ts" setup>
|
|
const {rent} = storeToRefs(useAuthStore())
|
|
definePageMeta({
|
|
rentStep: 1,
|
|
title:'Autóbérlés kezdete'
|
|
})
|
|
|
|
// Helyi Date objektum a DatePicker-hez
|
|
const selectedDate = ref<Date | null>(rent.value.auto_felvetel_datum ? new Date(rent.value.auto_felvetel_datum) : null)
|
|
|
|
// Ha változik a kiválasztott dátum, szöveggé alakítjuk (YYYY-MM-DD)
|
|
watch(selectedDate, (newDate) => {
|
|
if (newDate) {
|
|
const year = newDate.getFullYear()
|
|
const month = String(newDate.getMonth() + 1).padStart(2, '0')
|
|
const day = String(newDate.getDate()).padStart(2, '0')
|
|
rent.value.auto_felvetel_datum = `${year}-${month}-${day}`
|
|
} else {
|
|
rent.value.auto_felvetel_datum = null
|
|
}
|
|
})
|
|
|
|
function next() {
|
|
navigateTo('/rent/place-from')
|
|
}
|
|
|
|
const timeList = computed(()=>{
|
|
let a = []
|
|
for(let i=0; i<24; i++){
|
|
a.push(i+':00')
|
|
a.push(i+':30')
|
|
}
|
|
return a
|
|
})
|
|
|
|
</script>
|
|
|
|
<style></style> |