ervin/nuxt-start
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

update

Browse Source
This commit is contained in:
Juhász Ervin 2025-01-02 20:56:21 +01:00
parent 2658719822
commit ec735c7a4e
22 changed files with 4686 additions and 3467 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

17
app.vue
View File

@ -13,13 +13,13 @@ const categoriesStore = useCategoriesStore()
const placeStore = useMyPlacesStore() const placeStore = useMyPlacesStore()
const authStore = useAuthStore() const authStore = useAuthStore()
const configStore = useMyConfigStore() const configStore = useMyConfigStore()
const userToken = ref('') const token = useCookie('_auth')
async function loadData() { async function loadData() {
const { data } = await useFetch('https://olcsoberauto.hu/rest/init', const { data } = await useFetch('https://olcsoberauto.hu/rest/init',
{ {
headers: { headers: {
'auth-key': userToken.value 'auth-key': token.value
} }
} }
) )
@ -43,15 +43,8 @@ async function loadData() {
} }
} }
nuxtApp.hooks.hook('app:created', async () => {
console.log('created')
// userToken.value = window.localStorage.getItem('userToken')
// await loadData()
})
nuxtApp.hooks.hook('app:mounted', async () => { nuxtApp.hooks.hook('app:mounted', async () => {
console.log('mounted...') console.log('mounted...')
userToken.value = window.localStorage.getItem('userToken')
await loadData() await loadData()
}) })
@ -96,4 +89,10 @@ html {
border-left: 4px; border-left: 4px;
border-style: solid; border-style: solid;
} }
.p-disabled, .p-component:disabled{
opacity: 0.2;
}
pre{
font-size: 13px;
}
</style> </style>

27
components/RentStep.vue Normal file
View File

@ -0,0 +1,27 @@
<template>
<div class="flex gap-2 px-3 w-full justify-between">
<div v-for="i in 8" :class="inidactorClass(i)" style="padding: 2px;">
</div>
</div>
</template>
<script lang="ts" setup>
const router = useRouter()
const route = useRoute()
const rentList = computed(() => {
let r = router.getRoutes()
return r.filter(x => { if (x.path = '/rent' && x.children.length > 0 && x.children[0].name?.toString().match(/^rent-/gi)) { return true } }).map(x => { return x.children })[0].sort((a, b) => a.meta.rentStep - b.meta.rentStep)
})
const inidactorClass = (n)=>{
let a = ['w-full']
if(n <= route.meta?.rentStep){
a.push('bg-primary dark:bg-primary')
}else{
a.push('bg-gray-300 dark:bg-stone-800')
}
return a
}
</script>
<style></style>

10
composables/localeDateString.ts Normal file
View File

@ -0,0 +1,10 @@
export const useLocaleDateString = (d:any) => {
let _d = d
if(typeof d === "string"){
let _d = new Date(d)
}
if(typeof _d === 'object'){
console.log(typeof _d)
return _d.toLocaleDateString()
}
}

2
nuxt.config.ts
View File

@ -6,7 +6,7 @@ export default defineNuxtConfig({
host:'0.0.0.0' host:'0.0.0.0'
}, },
ssr:false, ssr:false,
modules: ["@primevue/nuxt-module", "@pinia/nuxt"], modules: ["@primevue/nuxt-module", "@pinia/nuxt", "@nuxt/icon"],
css: ['@/assets/styles/tailwind.css', '@/assets/styles/base.css', '@/assets/styles/fonts.css'], css: ['@/assets/styles/tailwind.css', '@/assets/styles/base.css', '@/assets/styles/fonts.css'],
primevue: { primevue: {
options: { theme: 'none' ,pt:{ options: { theme: 'none' ,pt:{

1
package.json
View File

@ -10,6 +10,7 @@
}, },
"devDependencies": { "devDependencies": {
"@iconify-json/ph": "^1.2.2", "@iconify-json/ph": "^1.2.2",
"@nuxt/icon": "1.10.3",
"@pinia/nuxt": "0.9.0", "@pinia/nuxt": "0.9.0",
"@primevue/nuxt-module": "^4.2.5", "@primevue/nuxt-module": "^4.2.5",
"autoprefixer": "^10.4.20", "autoprefixer": "^10.4.20",

66
pages/index.vue
View File

@ -1,7 +1,9 @@
<script setup> <script setup>
const auth = useAuthStore() const auth = useAuthStore()
const config = useMyConfigStore() const config = useMyConfigStore()
const menuShow=ref() const token = useCookie('_auth')
const menuShow = ref()
const router = useRouter()
const user = computed(() => { const user = computed(() => {
return auth.user return auth.user
}) })
@ -15,7 +17,7 @@ const states = computed(() => {
}) })
function getStateName(id) { function getStateName(id) {
if(id=='0'){ if (id == '0') {
return 'Visszaigazolásra vár' return 'Visszaigazolásra vár'
} }
let match = states.value?.filter(x => { if (x.id == id) { return true } }) let match = states.value?.filter(x => { if (x.id == id) { return true } })
@ -31,36 +33,63 @@ function getYear(date) {
function getMont(date) { function getMont(date) {
} }
function logOut(){
token.value = null
auth.user = null
router.push({path:'/login'})
}
</script> </script>
<template> <template>
<div class="min-h-12 bg-neutral-800 flex justify-between"> <div class="min-h-12 bg-neutral-800 flex justify-between items-center pe-2">
<div @click="$router.push({path:'/'})" <div @click="$router.push({ path: '/' })"
class="bg-neutral-800 h-12 flex items-center shadow-lg bg-gradient-to-r from-neutral-800 dark:from-neutral-900 to-transparent"> class="bg-neutral-800 h-12 flex items-center shadow-lg bg-gradient-to-r from-neutral-800 dark:from-neutral-900 to-transparent">
<img src="/euro_cars_rent_a_car_logo.png" class="h-8 mx-3" /> <img src="/euro_cars_rent_a_car_logo.png" class="h-8 mx-3" />
</div> </div>
<div> <div>
<Drawer v-model:visible="menuShow" header=" " position="right" :pt="{root:'border-0'}"> <Drawer v-model:visible="menuShow" header=" " position="right" :pt="{ root: 'border-0' }">
<div>{{ auth.user.nev }}</div> <template #header>
<div>{{ auth.user.email }}</div> <div class="flex flex-col">
<div>Profilom</div> <div>{{ auth.user.nev }}</div>
<div>Foglalásaim</div> <div class="text-xs">{{ auth.user.email }}</div>
</Drawer> </div>
<Button variant="link" icon="pi pi-user" @click="$router.push({path:'/profile'})"></Button>
<Button variant="link" icon="pi pi-bars" @click="menuShow=true"></Button> </template>
<div class="flex flex-col space-y-3 text-sm">
<NuxtLink to="/profile">Adataim</NuxtLink>
<Divider />
<NuxtLink :to="'/page/'+p.id" v-for="p in config?.config.menu">{{ p.label }}</NuxtLink>
<!-- <NuxtLink to="/page/72">GYIK</NuxtLink>
<NuxtLink to="/page/66">Autóbérlés feltételei</NuxtLink>
<NuxtLink to="/page/69">Általános Szerződési Feltételek</NuxtLink>
<NuxtLink to="/page/68">Adatvédelmi nyilatkozat</NuxtLink>
<NuxtLink to="/page/70">Lemondási és távolmaradási feltételek</NuxtLink>
<NuxtLink to="/page/65">Elérhetőség</NuxtLink> -->
<Divider />
<NuxtLink @click="logOut()">Kijelentketés</NuxtLink>
</div>
</Drawer>
<Button variant="link" icon="pi pi-user" @click="$router.push({ path: '/profile' })"></Button>
<Button variant="link" icon="pi pi-bars" @click="menuShow = true"></Button>
</div> </div>
</div> </div>
<div v-if="!rentals"> <div v-if="!rentals">
<div> <div class="p-3 text-center">
<div class="py-5">
<Icon name="ph:calendar-slash-thin" size="68" class="opacity-30" />
</div>
Jelenleg nincs foglalásod Jelenleg nincs foglalásod
</div> </div>
<Button @click="$router.push({ path: '/rent' })">Foglalás</Button>
</div> </div>
<div v-for="rent in rentals" class="p-2"> <div v-for="rent in rentals" class="p-2">
<div class="p-card border-t border-t-4 border-primary"> <div class="p-card border-t border-t-4 border-primary">
<div class="ps-3">{{ getStateName(rent.status) }}</div> <div class="ps-3">{{ getStateName(rent.status) }}</div>
<div v-if="rent.jaratszam" class="text-end text-xs pe-3"><span class="">járatszám:</span><b>{{ rent.jaratszam }}</b></div> <div v-if="rent.jaratszam" class="text-end text-xs pe-3"><span class="">járatszám:</span><b>{{
rent.jaratszam
}}</b></div>
<div class="flex items-baseline flex-row"> <div class="flex items-baseline flex-row">
<div class="text-center p-2 w-full items-top"> <div class="text-center p-2 w-full items-top">
<div class="text-xs">{{ rent.auto_felvetel_datum }}</div> <div class="text-xs">{{ rent.auto_felvetel_datum }}</div>
@ -78,7 +107,8 @@ function getMont(date) {
</div> </div>
<div class="py-5 px-3 "> <div class="py-5 px-3 ">
<Button class="w-full" variant="success" icon="pi pi-plus" @click="$router.push({path:'/rent'})">Új foglalás</Button> <Button class="w-full" variant="success" icon="pi pi-plus" @click="$router.push({ path: '/rent' })">Új
foglalás</Button>
</div> </div>

4
pages/page/[id].vue
View File

@ -1,11 +1,11 @@
<template> <template>
<div> <div>
<div class="flex items-center border-b mb-3 border-color"> <div class="flex items-center border-b mb-3 border-primary">
<Button icon="pi pi-arrow-left" variant="link" @click="$router.go(-1)"></Button> <Button icon="pi pi-arrow-left" variant="link" @click="$router.go(-1)"></Button>
<h1>{{ Title }}</h1> <h1>{{ Title }}</h1>
<Skeleton width="85%" v-if="isLoading"></Skeleton> <Skeleton width="85%" v-if="isLoading"></Skeleton>
</div> </div>
<div class="m-3"> <div class="p-3">
<div v-if="isLoading"> <div v-if="isLoading">
<Skeleton></Skeleton> <Skeleton></Skeleton>
<Skeleton width="85%" class="my-2"></Skeleton> <Skeleton width="85%" class="my-2"></Skeleton>

37
pages/profile/index.vue
View File

@ -6,62 +6,63 @@
<div class="px-3">Adataim</div> <div class="px-3">Adataim</div>
</div> </div>
<div class="p-3 space-y-3"> <div class="p-3 space-y-3">
<CardLoading v-if="isLoading" />
<FloatLabel variant="on"> <FloatLabel variant="on">
<InputText id="name" v-model="user.nev" class="w-full"/> <InputText id="name" v-model="user.nev" class="w-full" />
<label for="name">Név</label> <label for="name">Név</label>
</FloatLabel> </FloatLabel>
<FloatLabel variant="on"> <FloatLabel variant="on">
<InputText id="email" v-model="user.email" class="w-full"/> <InputText id="email" v-model="user.email" class="w-full" />
<label for="email">E-mail</label> <label for="email">E-mail</label>
</FloatLabel> </FloatLabel>
<FloatLabel variant="on"> <FloatLabel variant="on">
<InputText id="telefon" v-model="user.telefon" class="w-full"/> <InputText id="telefon" v-model="user.telefon" class="w-full" />
<label for="telefon">Telefon</label> <label for="telefon">Telefon</label>
</FloatLabel> </FloatLabel>
<FloatLabel variant="on"> <FloatLabel variant="on">
<InputText id="anyja_neve" v-model="user.anyja_neve" class="w-full"/> <InputText id="anyja_neve" v-model="user.anyja_neve" class="w-full" />
<label for="anyja_neve">Anyja neve</label> <label for="anyja_neve">Anyja neve</label>
</FloatLabel> </FloatLabel>
<FloatLabel variant="on"> <FloatLabel variant="on">
<InputText id="szuletesi_hely" v-model="user.szuletesi_hely" class="w-full"/> <InputText id="szuletesi_hely" v-model="user.szuletesi_hely" class="w-full" />
<label for="szuletesi_hely">Születési hely</label> <label for="szuletesi_hely">Születési hely</label>
</FloatLabel> </FloatLabel>
<FloatLabel variant="on"> <FloatLabel variant="on">
<DatePicker show-icon date-format="yy-mm-dd" id="szuletesi_ido" v-model="user.szuletesi_ido" class="w-full"/> <DatePicker show-icon date-format="yy-mm-dd" id="szuletesi_ido" v-model="user.szuletesi_ido" class="w-full" />
<label for="szuletesi_ido">Születési idő</label> <label for="szuletesi_ido">Születési idő</label>
</FloatLabel> </FloatLabel>
<FloatLabel variant="on"> <FloatLabel variant="on">
<InputText id="nemzetiseg" v-model="user.nemzetiseg" class="w-full"/> <InputText id="nemzetiseg" v-model="user.nemzetiseg" class="w-full" />
<label for="nemzetiseg">Állampolgárság</label> <label for="nemzetiseg">Állampolgárság</label>
</FloatLabel> </FloatLabel>
<FloatLabel variant="on"> <FloatLabel variant="on">
<InputText id="szigszam" v-model="user.szigszam" class="w-full"/> <InputText id="szigszam" v-model="user.szigszam" class="w-full" />
<label for="szigszam">Személyi igazolvány / Útlevél száma</label> <label for="szigszam">Személyi igazolvány / Útlevél száma</label>
</FloatLabel> </FloatLabel>
<FloatLabel variant="on"> <FloatLabel variant="on">
<InputText id="jogositvany_szama" v-model="user.jogositvany_szama" class="w-full"/> <InputText id="jogositvany_szama" v-model="user.jogositvany_szama" class="w-full" />
<label for="jogositvany_szama">Jogosítvány száma</label> <label for="jogositvany_szama">Jogosítvány száma</label>
</FloatLabel> </FloatLabel>
<FloatLabel variant="on"> <FloatLabel variant="on">
<InputText id="lakcim" v-model="user.lakcim" class="w-full"/> <InputText id="lakcim" v-model="user.lakcim" class="w-full" />
<label for="lakcim">Lakcím</label> <label for="lakcim">Lakcím</label>
</FloatLabel> </FloatLabel>
<FloatLabel variant="on"> <FloatLabel variant="on">
<InputText id="tartozkodasicim" v-model="user.tartozkodasicim" class="w-full"/> <InputText id="tartozkodasicim" v-model="user.tartozkodasicim" class="w-full" />
<label for="tartozkodasicim">Tartózkodási cím</label> <label for="tartozkodasicim">Tartózkodási cím</label>
</FloatLabel> </FloatLabel>
<div class=""> <div class="">
<Button @click="save()" class="max-sm:w-full min-w-20" icon="pi pi-save">Adatok mentése</Button> <Button @click="save()" class="max-sm:w-full min-w-20" icon="pi pi-save">Adatok mentése</Button>
</div>
</div> </div>
</div>
{{ user }}
</div> </div>
</template> </template>
<script lang="ts" setup> <script lang="ts" setup>
const { user } = useAuthStore() const isLoading = ref()
async function save(){ const { user } = storeToRefs(useAuthStore())
async function save() {
} }
</script> </script>

5
pages/rent.vue
View File

@ -1,9 +1,10 @@
<template> <template>
<div> <div>
<div class="flex justify-between items-center"> <div class="flex justify-between items-center h-16">
<Button @click="$router.back()" link icon="pi pi-arrow-left"></Button> <Button @click="$router.back()" link icon="pi pi-arrow-left" v-if="$route.meta?.rentStep < 8"></Button>
<div class="px-3">{{ $route?.meta?.title }}</div> <div class="px-3">{{ $route?.meta?.title }}</div>
</div> </div>
<RentStep v-if="$route.meta?.rentStep < 8"/>
<!-- <Stepper value="1" linear> <!-- <Stepper value="1" linear>
<StepList> <StepList>
<Step value="1">Autófelvétel</Step> <Step value="1">Autófelvétel</Step>

31
pages/rent/category.vue
View File

@ -1,11 +1,12 @@
<template> <template>
<div> <div>
<div class="flex flex-col gap-3 p-3"> <div class="flex flex-col gap-3 p-3">
<Card v-for="categori in categories" :pt="{ root: 'mb-3' }"> <Card v-for="categori in categories" :pt="{ root: '' }" @click="next(categori)">
<template #content> <template #content>
<div class="flex"> <div class="flex">
<div class="flex justify-center items-center text-3xl font-bold" style="width: 56px; font-size: 32px;">{{ categori.shortname }}</div> <div class="flex justify-center items-center text-3xl font-bold" style="width: 56px; font-size: 32px;">{{
categori.shortname }}</div>
<div> <div>
<div class="text-sm">{{ categori.name }}</div> <div class="text-sm">{{ categori.name }}</div>
<div class="text-primary-500">{{ HUFormat.format(categori.price) }} / nap</div> <div class="text-primary-500">{{ HUFormat.format(categori.price) }} / nap</div>
@ -18,23 +19,29 @@
</template> </template>
<script lang="ts" setup> <script lang="ts" setup>
const { rent } = storeToRefs(useAuthStore())
definePageMeta({ definePageMeta({
rentStep: 2, rentStep: 6,
title:'Válassz egy kategóriát' title: 'Válassz egy kategóriát'
}) })
const categoriestStore = useCategoriesStore() const categoriestStore = useCategoriesStore()
const categories: CategoryType[] = computed(() => { const categories: CategoryType[] = computed(() => {
return categoriestStore.categories return categoriestStore.categories
}) })
let HUFormat = new Intl.NumberFormat('hu-HU', { let HUFormat = new Intl.NumberFormat('hu-HU', {
style: 'currency', style: 'currency',
currency: 'HUF', currency: 'HUF',
maximumFractionDigits:0 maximumFractionDigits: 0
}); });
function next(category) {
rent.value.category_id = category.category_id
rent.value.valasztott_auto = category.shortname + ' ' + category.name
navigateTo('/rent/preview')
}
</script> </script>
<style> <style></style>
</style>

61
pages/rent/date-to.vue Normal file
View File

@ -0,0 +1,61 @@
<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>

83
pages/rent/extra.vue
View File

@ -1,13 +1,86 @@
<template> <template>
<div> <div class="p-3">
<div>
<div><span class="text-red-500">*</span> Autó használata:</div>
<div class="flex flex-col gap-4 p-3">
<div class="flex items-center gap-2">
<RadioButton v-model="rent.hasznalat" inputId="hasznalat-belfold" name="hasznalat" value="belfold" />
<label for="hasznalat-belfold" class="text-sm">Belföld</label>
</div>
<div class="flex items-center gap-2">
<RadioButton v-model="rent.hasznalat" inputId="hasznalat-kulfold" name="hasznalat" value="kulfold" />
<label for="hasznalat-kulfold" class="text-sm">Belföld és külföld</label>
</div>
</div>
</div>
<Divider />
<div class="flex items-center gap-2 text-small">
<ToggleSwitch name="matrica" v-model="rent.palyamatrica" input-id="palyamatrica" />
<label for="palyamatrica">Magyar autópálya matrica</label>
</div>
<Divider />
<div>
<div>Opcionálisan bérelhető tartozékok:</div>
<div class="flex flex-col gap-4 p-3">
<div class="flex items-center gap-2">
<Checkbox v-model="rent.tartozekok" inputId="tartozekok-snowchain" name="tartozekok[]" value="snowchain" />
<label for="tartozekok-snowchain" class="text-sm">Hólánc</label>
</div>
<div class="flex items-center gap-2">
<Checkbox v-model="rent.tartozekok" inputId="tartozekok-childsheat" name="tartozekok[]" value="childsheat" />
<label for="tartozekok-childsheat" class="text-sm">Gyerekülés</label>
</div>
</div>
</div>
<Divider />
<div>
<div><span class="text-red-500">*</span> Fizetési mód:</div>
<div class="flex flex-col gap-4 p-3">
<div class="flex items-center gap-2">
<RadioButton v-model="rent.fizetesi_mod" inputId="fizetesi_mod-1" name="payment" value="1" />
<label for="fizetesi_mod-1" class="text-sm">Készpénzzel a helyszínen</label>
</div>
<div class="flex items-center gap-2">
<RadioButton v-model="rent.fizetesi_mod" inputId="fizetesi_mod-2" name="payment" value="2" />
<label for="fizetesi_mod-2" class="text-sm">Banki előre utalás</label>
</div>
<div class="flex items-center gap-2">
<RadioButton v-model="rent.fizetesi_mod" inputId="fizetesi_mod-3" name="payment" value="3" />
<label for="fizetesi_mod-3" class="text-sm">Bankkártyával a helyszínen</label>
</div>
</div>
</div>
<Divider />
<div>
<div>Üzenet:</div>
<Textarea rows="4" class="w-full text-sm" placeholder="Ha szeretnél nekünk üzenni az autóbérléssel kapcsolatosan, akkor itt megteheted."></Textarea>
</div>
<div class="py-3">
<Button @click="next()" class="w-full" :disabled="isValid">Tovább</Button>
</div>
</div> </div>
</template> </template>
<script lang="ts" setup> <script lang="ts" setup>
const { rent } = storeToRefs(useAuthStore())
definePageMeta({
rentStep:5,
title: ''
})
const hasznalatOptions = ref([{ value: 'belfold', label: 'Belföld' }, { value: 'kulfold', label: 'Belföld és külföld' }])
function next() {
navigateTo('/rent/category')
}
const isValid = computed(()=>{
if(!rent.value?.hasznalat) return true
if(!rent.value?.fizetesi_mod) return true
return false
})
</script> </script>
<style> <style></style>
</style>

25
pages/rent/index copy.vue
View File

@ -1,25 +0,0 @@
<template>
<div>
<div class="flex flex-col p-3">
Autóbérlés kezdete
<InputText type="date" />
</div>
<div class="flex flex-col p-3">
Időpont
<InputText type="time" />
</div>
<div class="p-3">
<Button @click="next()" class="max-sm:w-full min-w-20">Tovább</Button>
</div>
</div>
</template>
<script lang="ts" setup>
function next(){
navigateTo('/rent/place-from')
}
</script>
<style></style>

8
pages/rent/index.vue
View File

@ -1,7 +1,6 @@
<template> <template>
<div> <div>
<div class="flex flex-col p-3"> <div class="flex flex-col p-3">
<DatePicker inline :min-date="(new Date())" v-model="rent.auto_felvetel_datum"/> <DatePicker inline :min-date="(new Date())" v-model="rent.auto_felvetel_datum"/>
</div> </div>
@ -10,16 +9,15 @@
<Dropdown :options="timeList" v-model="rent.auto_felvetel_idopont" /> <Dropdown :options="timeList" v-model="rent.auto_felvetel_idopont" />
</div> </div>
<div class="p-3"> <div class="p-3">
<Button @click="next()" class="max-sm:w-full min-w-20">Tovább</Button> <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>
</div> </div>
</template> </template>
<script lang="ts" setup> <script lang="ts" setup>
const {rent} = useAuthStore() const {rent} = storeToRefs(useAuthStore())
definePageMeta({ definePageMeta({
rentStep: 2, rentStep: 1,
title:'Autóbérlés kezdete' title:'Autóbérlés kezdete'
}) })
function next() { function next() {

21
pages/rent/jaratszam.vue
View File

@ -1,14 +1,29 @@
<template> <template>
<div> <div class="flex flex-col p-3 gap-3">
Járatszám Járatszám
<InputText></InputText> <InputText v-model="rent.jaratszam" :style="{'text-transform': 'uppercase'}" />
<div class="text-center">
<Button class="w-full mb-5" @click="next()">Tovább</Button>
<NuxtLink @click="next(1)">Nem adok meg járatszámot</NuxtLink>
<NuxtLink>Nem adok meg járatszámot</NuxtLink> </div>
</div> </div>
</template> </template>
<script lang="ts" setup> <script lang="ts" setup>
const {rent} = useAuthStore()
const router = useRouter()
definePageMeta({
rentStep: 2.5,
title:'Járatszám'
})
function next(clear: any = false){
if(clear){
rent.jaratszam = null
}
router.push({path:'/rent/date-to'})
}
</script> </script>
<style> <style>

17
pages/rent/place-from.vue
View File

@ -3,7 +3,7 @@
<div class="flex flex-col gap-3 p-3"> <div class="flex flex-col gap-3 p-3">
<Card v-for="place in places" :pt="{ root: (rent.auto_felvetel_hely == place) ? 'bg-primary-500 text-white mb-3' : 'mb-3' }"> <Card v-for="place in places" :pt="{ root: (rent.auto_felvetel_hely == place) ? 'bg-primary-500 text-white mb-3' : 'mb-3' }">
<template #content> <template #content>
<div class="flex gap-3"> <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;"> <div class="flex justify-center items-center text-3xl font-bold" style="width: 56px; font-size: 32px;">
<template v-if="place.icon == 'airplane'"> <template v-if="place.icon == 'airplane'">
<svg xmlns="http://www.w3.org/2000/svg" width="48" height="48" viewBox="0 0 256 256"> <svg xmlns="http://www.w3.org/2000/svg" width="48" height="48" viewBox="0 0 256 256">
@ -15,10 +15,9 @@
<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> <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> </template>
</div> </div>
<div class="w-full" @click="next(place)" > <div class="w-full">
<div class="text-sm"><b>{{ place.name }}</b></div> <div class="text-sm"><b>{{ place.name }}</b></div>
<div class="text-sm">{{ place.address }}</div> <div class="text-sm">{{ place.address }}</div>
<div class="text-sm text-end" v-if="place.price > 0">+{{ HUFormat.format(place.price) }}</div>
</div> </div>
</div> </div>
</template> </template>
@ -28,10 +27,10 @@
</template> </template>
<script lang="ts" setup> <script lang="ts" setup>
const {rent} = useAuthStore() const {rent} = storeToRefs(useAuthStore())
definePageMeta({ definePageMeta({
rentStep: 1, rentStep: 2,
title:'Autófelvétel helye' title:'Autófelvétel helye'
}) })
const placeStore = useMyPlacesStore() const placeStore = useMyPlacesStore()
@ -47,8 +46,12 @@ let HUFormat = new Intl.NumberFormat('hu-HU', {
}); });
function next(val) { function next(val) {
rent.auto_felvetel_hely=val rent.value.auto_felvetel_hely=val
navigateTo('/rent/category') if(val.id == '3'){
navigateTo('/rent/jaratszam')
}else{
navigateTo('/rent/date-to')
}
} }
function prev() { function prev() {

55
pages/rent/place-to.vue Normal file
View File

@ -0,0 +1,55 @@
<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>

71
pages/rent/preview.vue Normal file
View File

@ -0,0 +1,71 @@
<template>
<div class="p-3">
<div class="p-card border-t border-t-4 border-primary p-4">
<div><b>Név: </b>{{ user.nev }}</div>
<div><b>E-mail: </b>{{ user.email }}</div>
<div><b>Telefon: </b>{{ user.telefon }}</div>
<div><b>Anyja neve: </b>{{ user.anyja_neve }}</div>
<div><b>Születési hely: </b>{{ user.szuletesi_hely }}</div>
<div><b>Születési idő: </b>{{ user.szuletesi_ido }}</div>
<div><b>Állampolgárság: </b>{{ user.nemzetiseg }}</div>
<div class="text-sm"><b>Személyi igazolvány / Útlevél száma: </b><br>{{ user.szigszam }}</div>
<div class="text-sm"><b>Jogosítvány száma: </b><br>{{ user.jogositvany_szama }}</div>
<div class="text-sm"><b>Lakcím: </b><br>{{ user.lakcim }}</div>
<div class="text-sm"><b>Tartózkodási cím: </b><br>{{ user.tartozkodasicim }}</div>
<Message class="mt-2" severity="warn">Amennyiben adataidban változás történt, módosítsd a <i
class="pi pi-user mx-2"></i> profilodban.</Message>
<div class="text-center">
<Button variant="link" @click="$router.push({ path: '/profile' })">Adatok módosítása</Button>
</div>
</div>
<div class="space-y-4 mt-4">
<div class="p-card border-t border-t-4 border-primary">
<div v-if="rent.jaratszam" class="text-end text-xs pe-3"><span class="">járatszám:</span><b>{{
rent.jaratszam
}}</b></div>
<div class="flex items-baseline flex-row">
<div class="text-center p-2 w-full items-top">
<div class="text-xs">{{ useLocaleDateString(rent.auto_felvetel_datum) }}</div>
<div class="text-2xl">{{ rent.auto_felvetel_idopont }}</div>
<div class="text-xs">{{ rent.auto_felvetel_hely?.name }}</div>
</div>
<div class="w-4"></div>
<div class="text-center p-2 w-full">
<div class="text-xs">{{ useLocaleDateString(rent.auto_leadas_datum) }}</div>
<div class="text-2xl">{{ rent.auto_leadas_idopont }}</div>
<div class="text-xs">{{ rent.auto_leadas_hely?.name }}</div>
</div>
</div>
</div>
<div class="flex items-start gap-1" v-for="t in config?.rent.confirms">
<Checkbox v-model="confirms" :inputId="`confirm${t.id}`" name="confirms[]" :value="t.id" />
<label :for="`confirm${t.id}`" class="text-sm">{{ t.label }}</label>
</div>
</div>
<div class="py-5">
<Button @click="$router.push({ path: '/rent/thanks' })" class="w-full" :disabled="isValid">Foglalás
elküldése</Button>
</div>
</div>
</template>
<script lang="ts" setup>
const { rent, user } = storeToRefs(useAuthStore())
const { config } = storeToRefs(useMyConfigStore())
const confirms = ref([])
definePageMeta({
rentStep: 7,
title: 'Foglalás áttekintése'
})
const isValid = computed(() => {
if (config.value?.rent.confirms.length > confirms.value?.length) return true
return false
})
</script>
<style></style>

17
pages/rent/profile.vue Normal file
View File

@ -0,0 +1,17 @@
<template>
<div>
</div>
</template>
<script lang="ts" setup>
definePageMeta({
rentStep: 6,
title:''
})
</script>
<style>
</style>

23
pages/rent/thanks.vue Normal file
View File

@ -0,0 +1,23 @@
<template>
<div class="p-3">
<div class="bg-gray-500 bg-opacity-20 rounded-full w-24 h-24 flex items-center justify-center mx-auto">
<Icon name="ph:calendar-check" size="72" class="text-green-600 dark:text-green-400" />
</div>
<div class="text-center font-bold text-green-600 dark:text-green-400 my-3" v-html="config?.rent.thanks_message.title"></div>
<div class="text-center text-sm" v-html="config?.rent.thanks_message.content"></div>
<Button icon="i-ph-check-circle" class="my-3 w-full" @click="$router.push({path:'/'})">Rendben</Button>
</div>
</template>
<script lang="ts" setup>
const {rent} = storeToRefs(useAuthStore())
const {config} = storeToRefs(useMyConfigStore())
definePageMeta({
rentStep: 8,
title:''
})
</script>
<style>
</style>

7568
pnpm-lock.yaml
View File

File diff suppressed because it is too large Load Diff

4
stores/auth.ts
View File

@ -2,7 +2,7 @@ import { defineStore } from 'pinia'
export const useAuthStore = defineStore({ export const useAuthStore = defineStore({
id: 'AuthStore', id: 'AuthStore',
state: () => ({ user: null,rentals:null,rent:{} }), state: () => ({ user: null, rentals: null, rent: {} }),
actions: { actions: {
async getData() { async getData() {
const token = useCookie('_auth') const token = useCookie('_auth')
@ -15,7 +15,7 @@ export const useAuthStore = defineStore({
} }
) )
if(data.value?.user){ if (data.value?.user) {
this.user = data.value.user this.user = data.value.user
this.rentals = data.value.rentals this.rentals = data.value.rentals
} }