Wrap application in UApp and apply base UI styles Build responsive default layout with navigation and footer Implement staff login form with validation and toast notifications Restructure index page routing
38 lines
1.1 KiB
Vue
38 lines
1.1 KiB
Vue
<template>
|
|
<div class="min-h-dvh bg-default text-default">
|
|
<header class="border-b border-default bg-default">
|
|
<UContainer class="flex items-center justify-between gap-4 py-6">
|
|
<UBadge
|
|
label="Event Ticket System"
|
|
color="neutral"
|
|
variant="soft"
|
|
class="rounded-full px-3 py-1 font-semibold"
|
|
/>
|
|
|
|
<UButton
|
|
id="loginBtn"
|
|
:to="route.path.startsWith('/login') ? '/' : '/login'"
|
|
:label="route.path.startsWith('/login') ? 'Back' : 'Login'"
|
|
color="neutral"
|
|
:variant="route.path.startsWith('/login') ? 'outline' : 'solid'"
|
|
:icon="route.path.startsWith('/login') ? 'i-lucide-arrow-left' : 'i-lucide-lock-keyhole'"
|
|
/>
|
|
</UContainer>
|
|
</header>
|
|
|
|
<UMain>
|
|
<slot />
|
|
</UMain>
|
|
|
|
<footer class="border-t border-default bg-default">
|
|
<UContainer class="py-5 text-center text-sm text-muted">
|
|
© 2026 DAP 60th Anniversary Committee. All rights reserved.
|
|
</UContainer>
|
|
</footer>
|
|
</div>
|
|
</template>
|
|
|
|
<script lang="ts" setup>
|
|
const route = useRoute()
|
|
</script>
|