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

Merge remote-tracking branch 'Origin/main' into promotions

Browse Source
This commit is contained in:
ajdj100
2025-12-17 23:45:58 -05:00
parent b8750f1e8e f3e35f3f6a
commit 5e06e38a0d
34 changed files with 385 additions and 128 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
ui/src/components/Navigation/Navbar.vue
View File

@@ -107,13 +107,13 @@ function blurAfter() {
<NavigationMenuContent
class="grid gap-1 p-2 text-left [&_a]:w-full [&_a]:block [&_a]:whitespace-nowrap *:bg-transparent">
<NavigationMenuLink
<!-- <NavigationMenuLink
v-if="auth.hasAnyRole(['17th Administrator', '17th HQ', '17th Command'])"
as-child :class="navigationMenuTriggerStyle()">
<RouterLink to="/administration/rankChange" @click="blurAfter">
Promotions
</RouterLink>
</NavigationMenuLink>
</NavigationMenuLink> -->
<NavigationMenuLink
v-if="auth.hasAnyRole(['17th Administrator', '17th HQ', '17th Command'])"
@@ -147,11 +147,11 @@ function blurAfter() {
</NavigationMenuContent>
</NavigationMenuItem>
<NavigationMenuItem as-child :class="navigationMenuTriggerStyle()">
<!-- <NavigationMenuItem as-child :class="navigationMenuTriggerStyle()">
<RouterLink to="/members" @click="blurAfter">
Members (debug)
</RouterLink>
</NavigationMenuItem>
</NavigationMenuItem> -->
</NavigationMenuList>
</NavigationMenu>

5
ui/src/components/calendar/ViewCalendarEvent.vue
View File

@@ -80,6 +80,7 @@ async function setAttendance(state: CalendarAttendance) {
const canEditEvent = computed(() => {
if (!userStore.isLoggedIn) return false;
if (userStore.state !== 'member') return false;
if (userStore.user.member.member_id == activeEvent.value.creator_id)
return true;
});
@@ -196,7 +197,7 @@ defineExpose({ forceReload })
<DropdownMenuItem v-if="activeEvent.cancelled" @click="setCancel(false)">
Un-Cancel
</DropdownMenuItem>
<DropdownMenuItem v-else @click="setCancel(true)">
<DropdownMenuItem v-else @click="setCancel(true)" class="text-destructive">
Cancel
</DropdownMenuItem>
</DropdownMenuContent>
@@ -215,7 +216,7 @@ defineExpose({ forceReload })
<CircleAlert></CircleAlert> This event has been cancelled
</div>
</section>
<section v-if="isPast && userStore.isLoggedIn" class="w-full">
<section v-if="isPast && userStore.state === 'member'" class="w-full">
<ButtonGroup class="flex w-full">
<Button variant="outline"
:class="myAttendance?.status === CalendarAttendance.Attending ? 'border-2 border-primary text-primary' : ''"

126
ui/src/components/loa/loaForm.vue
View File

@@ -74,7 +74,6 @@ const { handleSubmit, values, resetForm } = useForm({
const formSubmitted = ref(false);
const onSubmit = handleSubmit(async (values) => {
console.log(values);
const out: LOARequest = {
member_id: values.member_id,
start_date: values.start_date,
@@ -122,7 +121,7 @@ const minEndDate = computed(() => {
if (values.start_date) {
return new CalendarDate(values.start_date.getFullYear(), values.start_date.getMonth() + 1, values.start_date.getDate())
} else {
return null;
return today(getLocalTimeZone());
}
})
@@ -134,6 +133,33 @@ const maxEndDate = computed(() => {
return null;
}
})
const minStartDate = computed(() => {
if (values.type && values.end_date) {
let endDateObj = new Date(values.end_date.getTime() - values.type.max_length_days * 24 * 60 * 60 * 1000);
let td = today(getLocalTimeZone());
let start = new CalendarDate(endDateObj.getFullYear(), endDateObj.getMonth() + 1, endDateObj.getDate())
return td.compare(start) > 0 ? td : start;
} else {
return today(getLocalTimeZone());
}
})
const memberFilter = ref('');
const filteredMembers = computed(() => {
const q = memberFilter?.value?.toLowerCase() ?? ""
const results: Member[] = []
for (const m of members.value ?? []) {
if (!q || (m.displayName || m.member_name).toLowerCase().includes(q)) {
results.push(m)
if (results.length >= 50) break
}
}
return results
})
</script>
<template>
@@ -157,22 +183,24 @@ const maxEndDate = computed(() => {
<ComboboxInput placeholder="Search members..." class="w-full pl-3"
:display-value="(id) => {
const m = members.find(mem => mem.member_id === id)
return m ? m.displayName || m.member_name : ''
}" />
return m ? m.displayName || m.member_name : ''
}" @input="memberFilter = $event.target.value" />
</ComboboxAnchor>
<ComboboxList class="*:w-64">
<ComboboxEmpty class="text-muted-foreground w-full">No results</ComboboxEmpty>
<ComboboxGroup>
<template v-for="member in members" :key="member.member_id">
<ComboboxItem :value="member.member_id"
class="data-[highlighted]:bg-accent data-[highlighted]:text-accent-foreground relative cursor-pointer select-none px-2 py-1.5 w-full">
{{ member.displayName || member.member_name }}
<ComboboxItemIndicator
class="absolute left-2 inline-flex items-center">
<Check class="h-4 w-4" />
</ComboboxItemIndicator>
</ComboboxItem>
</template>
<div class="max-h-80 overflow-y-scroll scrollbar-themed min-w-3xs">
<template v-for="member in filteredMembers" :key="member.member_id">
<ComboboxItem :value="member.member_id"
class="data-[highlighted]:bg-accent data-[highlighted]:text-accent-foreground relative cursor-pointer select-none px-2 py-1.5 w-full">
{{ member.displayName || member.member_name }}
<ComboboxItemIndicator
class="absolute left-2 inline-flex items-center">
<Check class="h-4 w-4" />
</ComboboxItemIndicator>
</ComboboxItem>
</template>
</div>
</ComboboxGroup>
</ComboboxList>
</Combobox>
@@ -209,21 +237,31 @@ const maxEndDate = computed(() => {
<FieldContent>
<FieldLabel>Start Date</FieldLabel>
<Popover>
<PopoverTrigger as-child>
<Button variant="outline" :class="cn(
'w-full justify-start text-left font-normal',
!field.value && 'text-muted-foreground',
)">
<CalendarIcon class="mr-2 h-4 w-4" />
{{ field.value ? df.format(field.value) : "Pick a date" }}
</Button>
</PopoverTrigger>
<div class="relative inline-flex items-center group">
<PopoverTrigger as-child>
<Button :disabled="!values.type" variant="outline" :class="cn(
'w-full justify-start text-left font-normal',
!field.value && 'text-muted-foreground',
)">
<CalendarIcon class="mr-2 h-4 w-4" />
{{ field.value ? df.format(field.value) : "Pick a date" }}
</Button>
</PopoverTrigger>
<!-- Tooltip bubble -->
<div v-if="!values?.type" class="pointer-events-none absolute -top-9 left-1/2 -translate-x-1/2
whitespace-nowrap rounded-md bg-popover px-2 py-1 text-xs
text-popover-foreground shadow-md border border-border
opacity-0 translate-y-1
group-hover:opacity-100 group-hover:translate-y-0
transition-opacity transition-transform duration-150">
Select an LOA type first
</div>
</div>
<PopoverContent class="w-auto p-0">
<Calendar
:model-value="field.value
? new CalendarDate(field.value.getFullYear(), field.value.getMonth() + 1, field.value.getDate()) : null"
@update:model-value="(val: CalendarDate) => field.onChange(val.toDate(getLocalTimeZone()))"
layout="month-and-year" :min-value="today(getLocalTimeZone())" />
layout="month-and-year"
:min-value="minStartDate || today(getLocalTimeZone())" />
</PopoverContent>
</Popover>
<div class="h-4">
@@ -237,18 +275,28 @@ const maxEndDate = computed(() => {
<FieldContent>
<FieldLabel>End Date</FieldLabel>
<Popover>
<PopoverTrigger as-child>
<Button variant="outline" :class="cn(
'w-full justify-start text-left font-normal',
!field.value && 'text-muted-foreground',
)">
<CalendarIcon class="mr-2 h-4 w-4" />
{{ field.value ? df.format(field.value) : "Pick a date" }}
</Button>
</PopoverTrigger>
<div class="relative inline-flex items-center group">
<PopoverTrigger as-child>
<Button :disabled="!values.type" variant="outline" :class="cn(
'w-full justify-start text-left font-normal',
!field.value && 'text-muted-foreground',
)">
<CalendarIcon class="mr-2 h-4 w-4" />
{{ field.value ? df.format(field.value) : "Pick a date" }}
</Button>
</PopoverTrigger>
<!-- Tooltip bubble -->
<div v-if="!values?.type" class="pointer-events-none absolute -top-9 left-1/2 -translate-x-1/2
whitespace-nowrap rounded-md bg-popover px-2 py-1 text-xs
text-popover-foreground shadow-md border border-border
opacity-0 translate-y-1
group-hover:opacity-100 group-hover:translate-y-0
transition-opacity transition-transform duration-150">
Select an LOA type first
</div>
</div>
<PopoverContent class="w-auto p-0">
<Calendar
:model-value="field.value ? new CalendarDate(field.value.getFullYear(), field.value.getMonth() + 1, field.value.getDate()) : null"
@update:model-value="(val: CalendarDate) => field.onChange(val.toDate(getLocalTimeZone()))"
:default-placeholder="defaultPlaceholder" :min-value="minEndDate"
:max-value="maxEndDate" layout="month-and-year">
@@ -286,8 +334,10 @@ const maxEndDate = computed(() => {
</h2>
<p class="max-w-md text-muted-foreground">
Your Leave of Absence request has been submitted successfully.
It will take effect on your selected start date.
{{ adminMode ? 'You have successfully submitted a Leave of Absence on behalf of another member.' :
`Your Leave
of Absence request has been submitted successfully.
It will take effect on your selected start date.` }}
</p>

4
ui/src/components/loa/loaList.vue
View File

@@ -59,7 +59,9 @@ async function loadLOAs() {
LOAList.value = result.data;
pageData.value = result.pagination;
} else {
LOAList.value = await getMyLOAs();
let result = await getMyLOAs(pageNum.value, pageSize.value);
LOAList.value = result.data;
pageData.value = result.pagination;
}
}

2
ui/src/components/ui/button/index.js
View File

@@ -8,7 +8,7 @@ export const buttonVariants = cva(
variants: {
variant: {
default:
"bg-primary text-primary-foreground shadow-xs hover:bg-primary/90",
"bg-primary text-primary-foreground shadow-xs hover:bg-primary/70",
destructive:
"bg-destructive text-white shadow-xs hover:bg-destructive/90 focus-visible:ring-destructive/20 dark:focus-visible:ring-destructive/40 dark:bg-destructive/60",
outline: