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

reimplemented member page

Browse Source
This commit is contained in:
ajdj100
2026-01-21 16:34:35 -05:00
parent f087461e09
commit 1d6f17b725
3 changed files with 24 additions and 18 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@@ -138,6 +138,12 @@ function blurAfter() {
</RouterLink> </RouterLink>
</NavigationMenuLink> </NavigationMenuLink>
<NavigationMenuItem as-child :class="navigationMenuTriggerStyle()">
<RouterLink to="/administration/members" @click="blurAfter">
Member Management
</RouterLink>
</NavigationMenuItem>
<NavigationMenuLink v-if="auth.hasRole('17th Administrator')" as-child <NavigationMenuLink v-if="auth.hasRole('17th Administrator')" as-child
:class="navigationMenuTriggerStyle()"> :class="navigationMenuTriggerStyle()">
<RouterLink to="/administration/roles" @click="blurAfter"> <RouterLink to="/administration/roles" @click="blurAfter">
@@ -146,13 +152,6 @@ function blurAfter() {
</NavigationMenuLink> </NavigationMenuLink>
</NavigationMenuContent> </NavigationMenuContent>
</NavigationMenuItem> </NavigationMenuItem>
<!-- <NavigationMenuItem as-child :class="navigationMenuTriggerStyle()">
<RouterLink to="/members" @click="blurAfter">
Members (debug)
</RouterLink>
</NavigationMenuItem> -->
</NavigationMenuList> </NavigationMenuList>
</NavigationMenu> </NavigationMenu>
</div> </div>

25
ui/src/pages/memberList.vue
View File

@@ -25,7 +25,8 @@ import {
} from "@/components/ui/dialog" } from "@/components/ui/dialog"
import Badge from "@/components/ui/badge/Badge.vue"; import Badge from "@/components/ui/badge/Badge.vue";
import { computed, ref } from "vue"; import { computed, ref } from "vue";
import { Member, getMembers } from "@/api/member"; import { getMembers } from "@/api/member";
import { Member } from "@shared/types/member";
import { useRouter } from 'vue-router'; import { useRouter } from 'vue-router';
import { Ellipsis } from "lucide-vue-next"; import { Ellipsis } from "lucide-vue-next";
import Input from "@/components/ui/input/Input.vue"; import Input from "@/components/ui/input/Input.vue";
@@ -55,8 +56,13 @@ const searchedMembers = computed(() => {
<!-- table menu --> <!-- table menu -->
<div class="w-4xl mx-auto"> <div class="w-4xl mx-auto">
<div class="flex justify-between mb-4"> <div class="flex flex-row items-center justify-between">
<Input v-model="searchVal" placeholder="search..."></Input> <div class="flex items-center justify-between">
<p class="scroll-m-20 text-2xl font-semibold tracking-tight my-5">Member Management</p>
</div>
<div class="flex justify-between items-center gap-3 mb-4">
<Input v-model="searchVal" placeholder="Search Members..."></Input>
</div>
</div> </div>
<Table> <Table>
<TableHeader> <TableHeader>
@@ -70,24 +76,25 @@ const searchedMembers = computed(() => {
</TableRow> </TableRow>
</TableHeader> </TableHeader>
<TableBody> <TableBody>
<TableRow v-for="member in searchedMembers" :key="member.member_id" <TableRow v-for="member in searchedMembers" :key="member.member_id">
:onClick="() => { viewMember(member.member_id) }" class="cursor-pointer">
<TableCell class="font-medium"> <TableCell class="font-medium">
{{ member.member_name }} {{ member.member_name }}
</TableCell> </TableCell>
<TableCell>{{ member.rank }}</TableCell> <TableCell>{{ member.rank }}</TableCell>
<TableCell>{{ member.unit }}</TableCell> <TableCell>{{ member.unit }}</TableCell>
<TableCell>{{ member.status }}</TableCell> <TableCell>{{ member.status }}</TableCell>
<TableCell><Badge v-if="member.on_loa">On LOA</Badge></TableCell> <TableCell>
<Badge v-if="member.loa_until">On LOA</Badge>
</TableCell>
<TableCell @click.stop="" class="text-right"> <TableCell @click.stop="" class="text-right">
<DropdownMenu> <DropdownMenu>
<DropdownMenuTrigger class="cursor-pointer"> <DropdownMenuTrigger class="cursor-pointer">
<Ellipsis></Ellipsis> <Ellipsis></Ellipsis>
</DropdownMenuTrigger> </DropdownMenuTrigger>
<DropdownMenuContent> <DropdownMenuContent>
<DropdownMenuItem>Change Rank</DropdownMenuItem> <!-- <DropdownMenuItem>Change Rank</DropdownMenuItem>
<DropdownMenuItem>Transfer</DropdownMenuItem> <DropdownMenuItem>Transfer</DropdownMenuItem> -->
<DropdownMenuItem :variant="'destructive'">Retire</DropdownMenuItem> <DropdownMenuItem :variant="'destructive'">Discharge</DropdownMenuItem>
</DropdownMenuContent> </DropdownMenuContent>
</DropdownMenu> </DropdownMenu>
</TableCell> </TableCell>

4
ui/src/router/index.js
View File

@@ -13,7 +13,6 @@ const router = createRouter({
{ path: '/', component: () => import('@/pages/Homepage.vue') }, { path: '/', component: () => import('@/pages/Homepage.vue') },
// MEMBER ROUTES // MEMBER ROUTES
{ path: '/members', component: () => import('@/pages/memberList.vue'), meta: { requiresAuth: true, memberOnly: true } },
{ path: '/loa', component: () => import('@/pages/SubmitLOA.vue'), meta: { requiresAuth: true, memberOnly: true } }, { path: '/loa', component: () => import('@/pages/SubmitLOA.vue'), meta: { requiresAuth: true, memberOnly: true } },
{ path: '/profile', component: () => import('@/pages/MyProfile.vue'), meta: { requiresAuth: true } }, { path: '/profile', component: () => import('@/pages/MyProfile.vue'), meta: { requiresAuth: true } },
@@ -39,7 +38,8 @@ const router = createRouter({
{ path: 'applications/:id', component: () => import('@/pages/Application.vue') }, { path: 'applications/:id', component: () => import('@/pages/Application.vue') },
{ path: 'loa', component: () => import('@/pages/ManageLOA.vue') }, { path: 'loa', component: () => import('@/pages/ManageLOA.vue') },
{ path: 'roles', component: () => import('@/pages/ManageRoles.vue') }, { path: 'roles', component: () => import('@/pages/ManageRoles.vue') },
{ path: 'roles/:id', component: () => import('@/pages/ManageRoles.vue') } { path: 'roles/:id', component: () => import('@/pages/ManageRoles.vue') },
{ path: 'members', component: () => import('@/pages/memberList.vue') },
] ]
}, },