Fixed roles page console warnings
This commit is contained in:
@@ -15,7 +15,7 @@ export async function getRoles(): Promise<Role[]> {
|
|||||||
if (res.ok) {
|
if (res.ok) {
|
||||||
return res.json() as Promise<Role[]>;
|
return res.json() as Promise<Role[]>;
|
||||||
} else {
|
} else {
|
||||||
console.error("Something went wrong approving the application")
|
console.error("Something went wrong")
|
||||||
return [];
|
return [];
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -138,6 +138,7 @@ onMounted(async () => {
|
|||||||
})
|
})
|
||||||
</script>
|
</script>
|
||||||
<template>
|
<template>
|
||||||
|
<div>
|
||||||
<Dialog v-model:open="showDialog"
|
<Dialog v-model:open="showDialog"
|
||||||
v-on:update:open="() => { showDialog = false; addingMember = false; memberToAdd = null; }">
|
v-on:update:open="() => { showDialog = false; addingMember = false; memberToAdd = null; }">
|
||||||
<DialogContent>
|
<DialogContent>
|
||||||
@@ -169,11 +170,9 @@ onMounted(async () => {
|
|||||||
<Combobox v-model="memberToAdd" by="value">
|
<Combobox v-model="memberToAdd" by="value">
|
||||||
<ComboboxAnchor>
|
<ComboboxAnchor>
|
||||||
<div class="relative w-full max-w-sm items-center">
|
<div class="relative w-full max-w-sm items-center">
|
||||||
<ComboboxInput class="pl-9" :display-value="(member: Member) => member?.member_name"
|
<ComboboxInput class="pl-9"
|
||||||
|
:display-value="(member: Member) => member?.member_name"
|
||||||
placeholder="Search Members" />
|
placeholder="Search Members" />
|
||||||
<span class="absolute start-0 inset-y-0 flex items-center justify-center px-3">
|
|
||||||
<Search class="size-4 text-muted-foreground" />
|
|
||||||
</span>
|
|
||||||
</div>
|
</div>
|
||||||
</ComboboxAnchor>
|
</ComboboxAnchor>
|
||||||
<ComboboxList>
|
<ComboboxList>
|
||||||
@@ -184,9 +183,6 @@ onMounted(async () => {
|
|||||||
<ComboboxItem v-for="member in availableMembers" :key="member.member_id"
|
<ComboboxItem v-for="member in availableMembers" :key="member.member_id"
|
||||||
:value="member">
|
:value="member">
|
||||||
{{ member.member_name }}
|
{{ member.member_name }}
|
||||||
<ComboboxItemIndicator>
|
|
||||||
<Check class="ml-auto size-4" />
|
|
||||||
</ComboboxItemIndicator>
|
|
||||||
</ComboboxItem>
|
</ComboboxItem>
|
||||||
</ComboboxGroup>
|
</ComboboxGroup>
|
||||||
</ComboboxList>
|
</ComboboxList>
|
||||||
@@ -197,41 +193,30 @@ onMounted(async () => {
|
|||||||
</ul>
|
</ul>
|
||||||
</div>
|
</div>
|
||||||
<DialogFooter>
|
<DialogFooter>
|
||||||
<!-- <Button variant="secondary" @click="showDialog = false">Cancel</Button> -->
|
|
||||||
<Button @click="handleDeleteRole">Delete Group</Button>
|
<Button @click="handleDeleteRole">Delete Group</Button>
|
||||||
</DialogFooter>
|
</DialogFooter>
|
||||||
</DialogContent>
|
</DialogContent>
|
||||||
</Dialog>
|
</Dialog>
|
||||||
|
|
||||||
<Dialog v-model:open="showCreateGroupDialog" v-on:update:open="() => { showCreateGroupDialog = false; }">
|
<Dialog v-model:open="showCreateGroupDialog" v-on:update:open="() => { showCreateGroupDialog = false; }">
|
||||||
<DialogContent>
|
<DialogContent>
|
||||||
<DialogHeader>
|
<DialogHeader>
|
||||||
<DialogTitle class="flex justify-between items-center">Create Group</DialogTitle>
|
<DialogTitle class="flex justify-between items-center">Create Group</DialogTitle>
|
||||||
<DialogDescription>Create a new group of members</DialogDescription>
|
<DialogDescription>Create a new group of members</DialogDescription>
|
||||||
</DialogHeader>
|
</DialogHeader>
|
||||||
|
|
||||||
<form class="mt-5 space-y-5" @submit.prevent="handleCreateGroup">
|
<form class="mt-5 space-y-5" @submit.prevent="handleCreateGroup">
|
||||||
<div>
|
<div>
|
||||||
<Label class="mb-2 block" for="group-name">Group Name</Label>
|
<Label class="mb-2 block" for="group-name">Group Name</Label>
|
||||||
<Input id="group-name" v-model="roleDraft.name" :aria-invalid="!!draftErrors.name" />
|
<Input id="group-name" v-model="roleDraft.name" :aria-invalid="!!draftErrors.name" />
|
||||||
<p v-if="draftErrors.name" class="text-destructive text-sm mt-1">{{ draftErrors.name }}</p>
|
<p v-if="draftErrors.name" class="text-destructive text-sm mt-1">{{ draftErrors.name }}</p>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div>
|
<div>
|
||||||
<Label class="mb-2 block" for="group-desc">Description</Label>
|
<Label class="mb-2 block" for="group-desc">Description</Label>
|
||||||
<Input id="group-desc" v-model="roleDraft.description" />
|
<Input id="group-desc" v-model="roleDraft.description" />
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div>
|
<div>
|
||||||
<Label class="mb-2 block" for="group-color">Color</Label>
|
<Label class="mb-2 block" for="group-color">Color</Label>
|
||||||
<!-- If you like a native color picker: -->
|
|
||||||
<Input id="group-color" type="color" v-model="roleDraft.color" />
|
<Input id="group-color" type="color" v-model="roleDraft.color" />
|
||||||
<!-- Or stick to hex text input: -->
|
|
||||||
<!-- <Input id="group-color" placeholder="#FF8A00" v-model="roleDraft.color"
|
|
||||||
:aria-invalid="!!draftErrors.color" />
|
|
||||||
<p v-if="draftErrors.color" class="text-destructive text-sm mt-1">{{ draftErrors.color }}</p> -->
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<DialogFooter>
|
<DialogFooter>
|
||||||
<Button type="button" variant="secondary" @click="showCreateGroupDialog = false"
|
<Button type="button" variant="secondary" @click="showCreateGroupDialog = false"
|
||||||
:disabled="creating">
|
:disabled="creating">
|
||||||
@@ -244,7 +229,6 @@ onMounted(async () => {
|
|||||||
</form>
|
</form>
|
||||||
</DialogContent>
|
</DialogContent>
|
||||||
</Dialog>
|
</Dialog>
|
||||||
|
|
||||||
<div class="max-w-5xl mx-auto">
|
<div class="max-w-5xl mx-auto">
|
||||||
<div class="flex items-center justify-between my-4">
|
<div class="flex items-center justify-between my-4">
|
||||||
<p>Groups</p>
|
<p>Groups</p>
|
||||||
@@ -261,13 +245,11 @@ onMounted(async () => {
|
|||||||
</CardTitle>
|
</CardTitle>
|
||||||
<CardDescription>{{ value.description }}</CardDescription>
|
<CardDescription>{{ value.description }}</CardDescription>
|
||||||
</CardHeader>
|
</CardHeader>
|
||||||
<!-- <CardContent>
|
|
||||||
Card Content
|
|
||||||
</CardContent> -->
|
|
||||||
<CardFooter>
|
<CardFooter>
|
||||||
<p class="text-muted-foreground">{{ value.members.length }} members</p>
|
<p class="text-muted-foreground">{{ value.members.length }} members</p>
|
||||||
</CardFooter>
|
</CardFooter>
|
||||||
</Card>
|
</Card>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
</div>
|
||||||
</template>
|
</template>
|
||||||
Reference in New Issue
Block a user