<template>
  <div>
    <div class="flex flex-col p-3">

      <DatePicker inline :min-date="rent.auto_felvetel_datum" v-model="rent.auto_leadas_datum" />
    </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'
})
function next() {
  navigateTo('/rent/place-to')
}
const rentDays = computed(() => {
  // Dátum objektumok létrehozása
  const kezdoDatumObj = rent.auto_felvetel_datum;
  const vegDatumObj = rent.auto_leadas_datum;

  // A két dátum közötti különbség millimásodpercben
  const kulonbsegMs = vegDatumObj - kezdoDatumObj;

  // Á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>