kincses/service-finder
1
0
Fork 0
Code Issues 53 Pull Requests Packages Projects 2 Releases Wiki Activity

2026.06.04 frontend építés közben

Browse Source
This commit is contained in:
Roo
2026-06-04 07:26:22 +00:00
parent 7adf6cc3e3
commit 59a30ac428
3302 changed files with 24091 additions and 1771 deletions
Download Patch File Download Diff File Expand all files Collapse all files

197
old_maps/frontend_old/Archive/src/App.vue Executable file
View File

@@ -0,0 +1,197 @@
<script setup>
import { useRouter, useRoute } from 'vue-router'
import { useAuthStore } from '@/stores/authStore'
import { useThemeStore } from '@/stores/themeStore'
import DailyQuizModal from '@/components/DailyQuizModal.vue'
import QuickActionsFAB from '@/components/actions/QuickActionsFAB.vue'
import { ref } from 'vue'
const router = useRouter()
const route = useRoute()
const authStore = useAuthStore()
const themeStore = useThemeStore()
const handleLogout = () => {
authStore.logout()
}
const toggleTheme = () => {
themeStore.toggleTheme()
}
// Legal modal state
const showLegalModal = ref(false)
const legalModalTitle = ref('')
const legalModalContent = ref('')
const openLegalModal = (type) => {
if (type === 'aszf') {
legalModalTitle.value = 'Általános Szerződési Feltételek (ÁSZF)'
legalModalContent.value = 'A jogi dokumentáció feltöltés alatt... A Service Finder szolgáltatás használatával Ön elfogadja az Általános Szerződési Feltételeket, amelyek meghatározzák a szolgáltatás használatának feltételeit, a felelősség korlátozását és a felhasználói jogokat.'
} else if (type === 'adatkezeles') {
legalModalTitle.value = 'Adatkezelési Tájékoztató (GDPR)'
legalModalContent.value = 'A jogi dokumentáció feltöltés alatt... A Service Finder tiszteletben tartja az Ön adatvédelmét. E tájékoztató részletezi, hogyan gyűjtjük, tároljuk és kezeljük személyes adatait az Európai Unió Általános Adatvédelmi Rendelete (GDPR) és a vonatkozó magyar jogszabályok értelmében.'
} else if (type === 'cookies') {
legalModalTitle.value = 'Sütik (Cookies) Használata'
legalModalContent.value = 'A jogi dokumentáció feltöltés alatt... Weboldalunk sütiket (cookies) használ a felhasználói élmény javítása, a funkciók működésének biztosítása és a forgalom elemzése érdekében. A sütik használatával kapcsolatos részletes információkat itt találja.'
}
showLegalModal.value = true
}
const closeLegalModal = () => {
showLegalModal.value = false
}
</script>
<template>
<div :class="['min-h-screen flex flex-col font-sans transition-all duration-500', themeStore.themeClasses.background, themeStore.themeClasses.text]">
<!-- Premium Navigation -->
<nav class="bg-gradient-to-r from-slate-800 to-slate-900 text-white p-4 shadow-xl flex justify-between items-center z-50 border-b border-slate-700/50 backdrop-blur-md">
<div class="flex items-center gap-3 cursor-pointer group" @click="router.push('/')">
<div class="p-2 rounded-xl bg-gradient-to-br from-blue-500 to-cyan-500 group-hover:from-blue-600 group-hover:to-cyan-600 transition-all duration-200">
<span class="text-2xl">🚗</span>
</div>
<div class="flex flex-col">
<span class="font-bold text-xl tracking-tight">Service Finder</span>
<span class="text-xs text-slate-300">Premium Vehicle Management</span>
</div>
</div>
<div class="space-x-6 hidden md:flex items-center">
<template v-if="authStore.isLoggedIn">
<router-link to="/" class="nav-link text-slate-200 hover:text-white font-medium transition-colors duration-200 hover:scale-105">Dashboard</router-link>
<router-link to="/expenses" class="nav-link text-slate-200 hover:text-white font-medium transition-colors duration-200 hover:scale-105">Költségek</router-link>
<router-link v-if="authStore.isAdmin" to="/admin" class="text-amber-300 font-bold hover:text-amber-200 transition-colors duration-200 hover:scale-105">⚙️ Admin</router-link>
<!-- User Role Badge -->
<div v-if="authStore.isTester" class="px-3 py-1.5 bg-gradient-to-r from-purple-600 to-pink-600 rounded-lg text-xs font-bold text-white border border-purple-500/50 shadow-md animate-pulse">
🧪 {{ authStore.displayName }}
</div>
<div v-else-if="authStore.isAdmin" class="px-3 py-1.5 bg-gradient-to-r from-amber-600 to-orange-600 rounded-lg text-xs font-bold text-white border border-amber-500/50 shadow-md">
⚡ {{ authStore.displayName }}
</div>
<button @click="toggleTheme" :class="['px-4 py-2.5 rounded-xl text-sm transition-all duration-200 active:scale-95 border shadow-md hover:shadow-lg', themeStore.isLuxury ? 'bg-gradient-to-r from-amber-700 to-amber-800 border-amber-600/50 text-white hover:from-amber-800 hover:to-amber-900' : 'bg-gradient-to-r from-orange-700 to-orange-800 border-orange-600/50 text-white hover:from-orange-800 hover:to-orange-900']">
{{ themeStore.isLuxury ? '🏛️ Luxury' : '🔧 Workshop' }}
</button>
<button @click="handleLogout" class="bg-gradient-to-r from-slate-700 to-slate-800 px-5 py-2.5 rounded-xl text-sm hover:from-slate-800 hover:to-slate-900 transition-all duration-200 active:scale-95 border border-slate-600/50 shadow-md hover:shadow-lg">
Kijelentkezés
</button>
</template>
<template v-else>
<router-link to="/login" class="text-slate-200 hover:text-white font-medium transition-colors duration-200">Bejelentkezés</router-link>
<router-link to="/register" class="bg-gradient-to-r from-blue-600 to-cyan-600 px-5 py-2.5 rounded-xl text-sm hover:from-blue-700 hover:to-cyan-700 transition-all duration-200 active:scale-95 shadow-md hover:shadow-lg">
Regisztráció
</router-link>
</template>
</div>
<!-- Mobile menu button -->
<button class="md:hidden p-2 rounded-lg bg-slate-700/50 hover:bg-slate-700 transition-colors">
<svg xmlns="http://www.w3.org/2000/svg" class="h-6 w-6" fill="none" viewBox="0 0 24 24" stroke="currentColor">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16" />
</svg>
</button>
</nav>
<!-- Main Content -->
<main class="flex-1 p-4 md:p-6 max-w-7xl mx-auto w-full">
<router-view />
</main>
<!-- Daily Quiz Modal -->
<DailyQuizModal v-if="authStore.isLoggedIn && route.path !== '/login' && route.path !== '/register' && route.path !== '/debug'" />
<!-- Quick Actions FAB -->
<QuickActionsFAB v-if="authStore.isLoggedIn && route.path !== '/login' && route.path !== '/register' && route.path !== '/debug'" />
<!-- Legal Modal -->
<div v-if="showLegalModal" class="fixed inset-0 z-[100] flex items-center justify-center bg-black/70 backdrop-blur-sm transition-all duration-300">
<div class="bg-gradient-to-br from-slate-800 to-slate-900 rounded-2xl shadow-2xl border border-slate-700/50 w-full max-w-2xl mx-4 overflow-hidden transform transition-all duration-300 scale-100">
<div class="p-6 border-b border-slate-700/50">
<div class="flex justify-between items-center">
<h3 class="text-xl font-bold text-white">{{ legalModalTitle }}</h3>
<button @click="closeLegalModal" class="text-slate-400 hover:text-white transition-colors duration-200 p-2 rounded-lg hover:bg-slate-700/50">
<svg xmlns="http://www.w3.org/2000/svg" class="h-6 w-6" fill="none" viewBox="0 0 24 24" stroke="currentColor">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12" />
</svg>
</button>
</div>
</div>
<div class="p-6 max-h-[60vh] overflow-y-auto">
<div class="prose prose-invert max-w-none">
<p class="text-slate-300 mb-4">{{ legalModalContent }}</p>
<div class="bg-slate-800/50 rounded-xl p-4 border border-slate-700/50 mt-6">
<div class="flex items-center space-x-3">
<div class="w-10 h-10 rounded-full bg-gradient-to-r from-blue-500 to-cyan-500 flex items-center justify-center">
<span class="text-white font-bold">ℹ️</span>
</div>
<div>
<p class="text-sm text-slate-400">Ez egy helykitöltő szöveg. A végleges jogi dokumentáció a termék bevezetésével együtt kerül feltöltésre.</p>
</div>
</div>
</div>
</div>
</div>
<div class="p-6 border-t border-slate-700/50 bg-slate-900/50">
<div class="flex justify-end">
<button @click="closeLegalModal" class="px-6 py-3 bg-gradient-to-r from-blue-600 to-cyan-600 hover:from-blue-700 hover:to-cyan-700 text-white font-medium rounded-xl transition-all duration-200 active:scale-95 shadow-md hover:shadow-lg">
Bezárás
</button>
</div>
</div>
</div>
</div>
<!-- Premium Footer -->
<footer class="mt-auto bg-gradient-to-r from-slate-800 to-slate-900 text-slate-300 p-6 border-t border-slate-700/50">
<div class="max-w-7xl mx-auto flex flex-col md:flex-row justify-between items-center">
<div class="mb-4 md:mb-0">
<div class="flex items-center gap-2 mb-2">
<span class="text-2xl">🚗</span>
<span class="font-bold text-white">Service Finder</span>
</div>
<p class="text-sm text-slate-400">Premium vehicle management for individuals and businesses</p>
</div>
<div class="flex gap-6">
<button @click="openLegalModal('aszf')" class="text-slate-400 hover:text-white transition-colors duration-200 text-sm hover:underline">ÁSZF</button>
<button @click="openLegalModal('adatkezeles')" class="text-slate-400 hover:text-white transition-colors duration-200 text-sm hover:underline">Adatkezelési Tájékoztató</button>
<button @click="openLegalModal('cookies')" class="text-slate-400 hover:text-white transition-colors duration-200 text-sm hover:underline">Sütik</button>
<a href="#" class="text-slate-400 hover:text-white transition-colors duration-200 text-sm">Kapcsolat</a>
</div>
</div>
<div class="max-w-7xl mx-auto mt-6 pt-6 border-t border-slate-700/50 text-center text-xs text-slate-500">
© 2026 Service Finder. Minden jog fenntartva. Gépjármű-rajongók számára készült precízióval.
</div>
</footer>
</div>
</template>
<style scoped>
.nav-link {
position: relative;
padding: 0.5rem 0;
}
.nav-link::after {
content: '';
position: absolute;
bottom: 0;
left: 0;
width: 0;
height: 2px;
background: linear-gradient(to right, #3b82f6, #06b6d4);
transition: width 0.3s ease;
}
.nav-link:hover::after {
width: 100%;
}
/* Smooth transitions */
* {
transition-property: color, background-color, border-color, transform, box-shadow;
transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
transition-duration: 150ms;
}
</style>