RyderTech/nlcc-itinerary
1
0
Fork 0
Code Issues Pull Requests Packages Activity

Fix modal interactivity and login persistence issues

Browse Source
This commit is contained in:
Ryderjj89
2025-10-01 17:42:13 -04:00
parent cb51c048c9
commit 4dbb6e040f
3 changed files with 89 additions and 66 deletions
Download Patch File Download Diff File Expand all files Collapse all files

115
components/LoginModal.vue
View File

@@ -1,73 +1,58 @@
<template>
<UModal
v-model="isOpen"
:ui="{ width: 'sm:max-w-md' }"
class="login-modal"
:style="{
position: 'fixed',
top: '0',
left: '0',
right: '0',
bottom: '0',
zIndex: 9999,
display: 'flex',
alignItems: 'center',
justifyContent: 'center',
backgroundColor: 'rgba(0, 0, 0, 0.5)',
backdropFilter: 'blur(4px)'
}"
>
<UCard>
<template #header>
<h3 class="text-lg font-semibold text-gray-900">Admin Login</h3>
</template>
<Teleport to="body">
<UModal v-model="isOpen" :ui="{ width: 'sm:max-w-md' }" class="login-modal">
<UCard>
<template #header>
<h3 class="text-lg font-semibold text-gray-900">Admin Login</h3>
</template>
<form @submit.prevent="handleSubmit" class="space-y-4">
<UFormGroup label="Username" name="username">
<UInput
v-model="form.username"
placeholder="Enter username"
:disabled="loading"
class="w-full"
/>
</UFormGroup>
<form @submit.prevent="handleSubmit" class="space-y-4">
<UFormGroup label="Username" name="username">
<UInput
v-model="form.username"
placeholder="Enter username"
:disabled="loading"
class="w-full"
/>
</UFormGroup>
<UFormGroup label="Password" name="password">
<UInput
v-model="form.password"
type="password"
placeholder="Enter password"
:disabled="loading"
class="w-full"
/>
</UFormGroup>
<UFormGroup label="Password" name="password">
<UInput
v-model="form.password"
type="password"
placeholder="Enter password"
:disabled="loading"
class="w-full"
/>
</UFormGroup>
<div v-if="error" class="text-red-600 text-sm p-3 bg-red-50 border border-red-200 rounded-md">
{{ error }}
</div>
<div v-if="error" class="text-red-600 text-sm p-3 bg-red-50 border border-red-200 rounded-md">
{{ error }}
</div>
<div class="flex justify-end space-x-3 pt-4">
<UButton
type="button"
variant="outline"
color="gray"
:disabled="loading"
@click="close"
>
Cancel
</UButton>
<UButton
type="submit"
variant="solid"
color="primary"
:loading="loading"
>
Login
</UButton>
</div>
</form>
</UCard>
</UModal>
<div class="flex justify-end space-x-3 pt-4">
<UButton
type="button"
variant="outline"
color="gray"
:disabled="loading"
@click="close"
>
Cancel
</UButton>
<UButton
type="submit"
variant="solid"
color="primary"
:loading="loading"
>
Login
</UButton>
</div>
</form>
</UCard>
</UModal>
</Teleport>
</template>
<script setup lang="ts">