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