17th-Ranger-Battalion-ORG/milsim-site-v4
8
1
Fork 0
Code Issues 22 Pull Requests 1 Actions 2 Packages Projects Releases Wiki Activity

minor UX refinements

Browse Source
This commit is contained in:
ajdj100
2025-12-03 16:05:47 -05:00
parent 12d538dafc
commit 3449dcec5c
1 changed files with 8 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files

13
ui/src/pages/Join.vue
View File

@@ -11,7 +11,7 @@ import {
StepperTrigger,
} from '@/components/ui/stepper'
import { useUserStore } from '@/stores/user';
import { Check, Circle, Dot, Users } from 'lucide-vue-next'
import { Check, Circle, Dot, Users, X } from 'lucide-vue-next'
import { computed } from 'vue';
import Application from './Application.vue';
@@ -62,10 +62,10 @@ const currentStep = computed<number>(() => {
return 3;
break;
case "member":
return 4;
return 5;
break;
case "denied":
return 4;
return 5;
break;
}
})
@@ -87,7 +87,10 @@ const currentStep = computed<number>(() => {
<Button :variant="state === 'completed' || state === 'active' ? 'default' : 'outline'"
size="icon" class="z-10 rounded-full shrink-0"
:class="[state === 'active' && 'ring-2 ring-ring ring-offset-2 ring-offset-background']">
<Check v-if="state === 'completed'" class="size-5" />
<template v-if="state === 'completed'">
<X v-if="step.step === 4 && userStore.state === 'denied'" class="size-5" />
<Check v-else class="size-5" />
</template>
<Circle v-if="state === 'active'" />
<Dot v-if="state === 'inactive'" />
</Button>
@@ -128,7 +131,7 @@ const currentStep = computed<number>(() => {
</div>
<Application v-else-if="currentStep === 2" @submit="userStore.loadUser()" :mode="'create'"></Application>
<Application v-else-if="currentStep === 3" :mode="'view-self'"></Application>
<div v-if="currentStep === 4" class="w-full max-w-4xl p-8">
<div v-if="currentStep === 5" class="w-full max-w-4xl p-8">
<!-- Accepted message -->
<div v-if="userStore.state === 'member'">
<h1 class="text-3xl sm:text-4xl font-bold mb-4 text-left">