nuxt-start/pages/rent/date-to.vue
2026-01-02 10:29:43 +01:00

82 lines
2.3 KiB
Vue

<template>
<div>
<div class="flex flex-col p-3">
<DatePicker inline :min-date="minDate" v-model="selectedDate" />
</div>
<div class="flex flex-col p-3">
Időpont
<Dropdown :options="timeList" v-model="rent.auto_leadas_idopont" />
</div>
<div class="p-3">
<Button @click="next()" class="max-sm:w-full min-w-20" v-if="rent.auto_leadas_datum && rent.auto_leadas_idopont">Tovább</Button>
</div>
</div>
</template>
<script lang="ts" setup>
const {rent} = storeToRefs(useAuthStore())
definePageMeta({
rentStep: 3,
title: 'Autóbérlés vége'
})
// Helyi Date objektum a DatePicker-hez
const selectedDate = ref<Date | null>(rent.value.auto_leadas_datum ? new Date(rent.value.auto_leadas_datum) : null)
// Min dátum a felvételi dátumból
const minDate = computed(() => {
return rent.value.auto_felvetel_datum ? new Date(rent.value.auto_felvetel_datum) : new Date()
})
// 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_leadas_datum = `${year}-${month}-${day}`
} else {
rent.value.auto_leadas_datum = null
}
})
function next() {
navigateTo('/rent/place-to')
}
const rentDays = computed(() => {
// Dátum stringek összehasonlítása
const kezdoDatumObj = new Date(rent.value.auto_felvetel_datum);
const vegDatumObj = new Date(rent.value.auto_leadas_datum);
// A két dátum közötti különbség millimásodpercben
const kulonbsegMs = vegDatumObj.getTime() - kezdoDatumObj.getTime();
// Átváltás napokba (egy nap 86400000 millimásodperc)
const napok = Math.floor(kulonbsegMs / 86400000);
return napok+1;
})
const timeList = computed(() => {
let a = []
for (let i = 0; i < 24; i++) {
if(rent.value.auto_leadas_datum == rent.value.auto_felvetel_datum){
if(rent.value.auto_felvetel_idopont < i + ':00'){
a.push(i + ':00')
}
if(rent.value.auto_felvetel_idopont < i + ':30'){
a.push(i + ':30')
}
}else{
a.push(i + ':00')
a.push(i + ':30')
}
}
return a
})
</script>
<style></style>