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 pull request '#134-Calendar-Upgrades' (#150) from #134-Calendar-Upgrades into main
All checks were successful
Continuous Integration / Update Development (push) Successful in 2m33s
Details

Browse Source 
Reviewed-on: #150
This commit was merged in pull request #150.
This commit is contained in:
Ajdj100
2026-01-16 18:37:02 -06:00
parent a4f762e793 dd21d12dd5
commit c14475258d
4 changed files with 29 additions and 21 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
ui/src/App.vue
View File

@@ -29,12 +29,12 @@ const version = import.meta.env.VITE_APPLICATION_VERSION;
background-position: center;">
<div class="sticky top-0 bg-background z-50">
<Navbar class="flex"></Navbar>
<Alert v-if="environment == 'dev'" class="m-2 mx-auto w-5xl" variant="info">
<AlertDescription class="flex flex-row items-center text-nowrap gap-5 mx-auto">
<Alert v-if="environment == 'dev'" class="m-2 mx-auto max-w-5xl" variant="info">
<AlertDescription class="flex flex-row items-center text-wrap gap-5 mx-auto">
<p>Development environment (v{{ version }}). Features may be incomplete or unavailable.</p>
</AlertDescription>
</Alert>
<Alert v-if="userStore.user?.LOAs?.[0]" class="m-2 mx-auto w-5xl" variant="info">
<Alert v-if="userStore.user?.LOAs?.[0]" class="m-2 mx-auto max-w-5xl" variant="info">
<AlertDescription class="flex flex-row items-center text-nowrap gap-5 mx-auto">
<p>You are on LOA until <strong>{{ formatDate(userStore.user?.LOAs?.[0].extended_till ||
userStore.user?.LOAs?.[0].end_date) }}</strong></p>

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

@@ -31,9 +31,14 @@ watch(
{ immediate: true }
);
watch(loaded, (value) => {
if (value) emit('load');
});
const emit = defineEmits<{
(e: 'close'): void
(e: 'reload'): void
(e: 'load'): void
(e: 'edit', event: CalendarEvent): void
}>()
@@ -179,7 +184,7 @@ defineExpose({ forceReload })
<template>
<div v-if="loaded">
<!-- Header -->
<div class="flex items-center justify-between gap-3 border-b px-4 py-3 ">
<div class="flex items-center justify-between gap-3 border-b border-border px-4 py-3 ">
<h2 class="text-lg font-semibold break-after-all">
{{ activeEvent?.name || 'Event' }}
</h2>
@@ -227,14 +232,14 @@ defineExpose({ forceReload })
</div>
</section>
<section v-if="isPast && userStore.state === 'member'" class="w-full">
<ButtonGroup class="flex w-full">
<Button variant="outline"
<ButtonGroup class="flex w-full justify-center">
<Button variant="outline" class="flex-1"
:class="myAttendance?.status === CalendarAttendance.Attending ? 'border-2 border-primary text-primary' : ''"
@click="setAttendance(CalendarAttendance.Attending)">Going</Button>
<Button variant="outline"
<Button variant="outline" class="flex-1"
:class="myAttendance?.status === CalendarAttendance.Maybe ? 'border-2 !border-l-2 border-primary text-primary' : ''"
@click="setAttendance(CalendarAttendance.Maybe)">Maybe</Button>
<Button variant="outline"
<Button variant="outline" class="flex-1"
:class="myAttendance?.status === CalendarAttendance.NotAttending ? 'border-2 !border-l-2 border-primary text-primary' : ''"
@click="setAttendance(CalendarAttendance.NotAttending)">Declined</Button>
</ButtonGroup>
@@ -259,7 +264,7 @@ defineExpose({ forceReload })
<!-- Description -->
<section class="space-y-2 w-full">
<p class="text-lg font-semibold">Description</p>
<p class="border bg-muted/50 px-3 py-2 rounded-lg min-h-24 my-2 whitespace-pre-line">
<p class="border border-border bg-muted/50 px-3 py-2 rounded-lg min-h-24 my-2 whitespace-pre-line">
{{ activeEvent.description }}
</p>
</section>
@@ -273,8 +278,8 @@ defineExpose({ forceReload })
<p>Declined <span class="ml-1">{{ attendanceStatusSummary.notAttending }}</span></p>
</div> -->
</div>
<div class="flex flex-col border bg-muted/50 rounded-lg min-h-24 my-2">
<div class="flex w-full pt-2 border-b *:w-full *:text-center *:pb-1 *:cursor-pointer">
<div class="flex flex-col border border-border bg-muted/50 rounded-lg min-h-24 my-2">
<div class="flex w-full pt-2 border-b border-border *:w-full *:text-center *:pb-1 *:cursor-pointer">
<label :class="attendanceTab === 'Alpha' ? 'border-b-3 border-foreground' : 'mb-[2px]'"
@click="attendanceTab = 'Alpha'">Alpha {{ attendanceCountsByGroup.Alpha }}</label>
<label :class="attendanceTab === 'Echo' ? 'border-b-3 border-foreground' : 'mb-[2px]'"
@@ -283,14 +288,14 @@ defineExpose({ forceReload })
@click="attendanceTab = 'Other'">Other {{ attendanceCountsByGroup.Other }}</label>
</div>
<div class="pb-1 min-h-48">
<div class="grid grid-cols-2 font-semibold text-muted-foreground border-b py-1 px-3 mb-2">
<div class="grid grid-cols-2 font-semibold text-muted-foreground border-b border-border py-1 px-3 mb-2">
<p>Name</p>
<p class="text-right">Status</p>
</div>
<div v-for="person in attendanceList" :key="person.member_id"
class="grid grid-cols-2 py-1 *:px-3 hover:bg-muted">
<div>
class="grid grid-cols-3 py-1 *:px-3 hover:bg-muted">
<div class="col-span-2">
<MemberCard :member-id="person.member_id"></MemberCard>
</div>
<p :class="statusColor(person.status)" class="text-right">
@@ -302,11 +307,14 @@ defineExpose({ forceReload })
</section>
</div>
</div>
<div v-else class="flex justify-center h-full items-center">
<Button variant="ghost" size="icon" @click="emit('close')">
<div v-else class="relative flex justify-center items-center h-full">
<!-- Close button (top-right) -->
<Button variant="ghost" size="icon" class="absolute top-2 right-2" @click="emit('close')">
<X class="size-5" />
</Button>
<Spinner class="size-8"></Spinner>
<!-- Spinner (centered) -->
<Spinner class="size-8" />
</div>
</template>

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

@@ -16,7 +16,7 @@ export const buttonVariants = cva(
secondary:
"bg-secondary text-secondary-foreground shadow-xs hover:bg-secondary/80",
ghost:
"hover:bg-accent hover:text-accent-foreground dark:hover:bg-accent/50",
"hover:bg-accent active:bg-accent hover:text-accent-foreground dark:hover:bg-accent/50",
success:
"bg-success text-success-foreground shadow-xs hover:bg-success/90",
link: "text-primary underline-offset-4 hover:underline",

6
ui/src/pages/Calendar.vue
View File

@@ -155,7 +155,7 @@ onMounted(() => {
<div>
<CreateCalendarEvent ref="dialogRef" @reload="loadEvents(); eventViewRef.forceReload();"></CreateCalendarEvent>
<div class="flex">
<div class="flex-1 min-h-0 mt-5">
<div class="flex-1 min-h-0 mt-5" :class="{ 'hidden md:block': panelOpen }">
<div class="h-[80vh] min-h-0">
<!-- calendar header -->
<div class="flex items-center justify-between mx-5">
@@ -208,10 +208,10 @@ onMounted(() => {
</div>
</div>
<aside v-if="panelOpen"
class="3xl:w-lg 2xl:w-md border-l bg-card text-foreground flex flex-col overflow-auto scrollbar-themed"
class="w-screen 3xl:w-lg 2xl:w-md lg:border-l bg-card text-foreground flex flex-col overflow-auto scrollbar-themed"
:style="{ height: 'calc(100vh - 61px)', position: 'sticky', top: '64px' }">
<ViewCalendarEvent ref="eventViewRef" :key="currentEventID" @close="() => { router.push('/calendar'); }"
@reload="loadEvents()" @edit="(val) => { dialogRef.openDialog(null, 'edit', val) }">
@reload="loadEvents()" @load="calendarRef.getApi().updateSize()" @edit="(val) => { dialogRef.openDialog(null, 'edit', val) }">
</ViewCalendarEvent>
</aside>
</div>