reimplemented member page
This commit is contained in:
@@ -25,7 +25,8 @@ import {
|
||||
} from "@/components/ui/dialog"
|
||||
import Badge from "@/components/ui/badge/Badge.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 { Ellipsis } from "lucide-vue-next";
|
||||
import Input from "@/components/ui/input/Input.vue";
|
||||
@@ -55,8 +56,13 @@ const searchedMembers = computed(() => {
|
||||
|
||||
<!-- table menu -->
|
||||
<div class="w-4xl mx-auto">
|
||||
<div class="flex justify-between mb-4">
|
||||
<Input v-model="searchVal" placeholder="search..."></Input>
|
||||
<div class="flex flex-row items-center justify-between">
|
||||
<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>
|
||||
<Table>
|
||||
<TableHeader>
|
||||
@@ -70,24 +76,25 @@ const searchedMembers = computed(() => {
|
||||
</TableRow>
|
||||
</TableHeader>
|
||||
<TableBody>
|
||||
<TableRow v-for="member in searchedMembers" :key="member.member_id"
|
||||
:onClick="() => { viewMember(member.member_id) }" class="cursor-pointer">
|
||||
<TableRow v-for="member in searchedMembers" :key="member.member_id">
|
||||
<TableCell class="font-medium">
|
||||
{{ member.member_name }}
|
||||
</TableCell>
|
||||
<TableCell>{{ member.rank }}</TableCell>
|
||||
<TableCell>{{ member.unit }}</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">
|
||||
<DropdownMenu>
|
||||
<DropdownMenuTrigger class="cursor-pointer">
|
||||
<Ellipsis></Ellipsis>
|
||||
</DropdownMenuTrigger>
|
||||
<DropdownMenuContent>
|
||||
<DropdownMenuItem>Change Rank</DropdownMenuItem>
|
||||
<DropdownMenuItem>Transfer</DropdownMenuItem>
|
||||
<DropdownMenuItem :variant="'destructive'">Retire</DropdownMenuItem>
|
||||
<!-- <DropdownMenuItem>Change Rank</DropdownMenuItem>
|
||||
<DropdownMenuItem>Transfer</DropdownMenuItem> -->
|
||||
<DropdownMenuItem :variant="'destructive'">Discharge</DropdownMenuItem>
|
||||
</DropdownMenuContent>
|
||||
</DropdownMenu>
|
||||
</TableCell>
|
||||
|
||||
Reference in New Issue
Block a user