LF2/Alisa
6
0
Fork 0
Code Issues 10 Pull requests Projects 1 Releases Packages Wiki Activity Actions

web: added group add dialog

Browse source
This commit is contained in:
Mika 2024-07-11 10:38:55 +02:00
parent 04be7b0704
commit 4ba85e7c08
1 changed files with 64 additions and 9 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

73
web/src/components/HeaderBar.vue
View file

@ -5,7 +5,54 @@
<v-spacer></v-spacer>
<!-- Create, Edit -->
<div>
<!-- -->
<!-- GROUP SECTION -->
<!-- -->
<v-btn icon class="mr-3" @click="group = true">
<FolderPlus />
</v-btn>
<v-dialog v-model="group" width="600" persistent>
<v-card max-width="600">
<v-form @submit.prevent="submit">
<v-card-title>
<span class="headline">Add Group</span>
</v-card-title>
<v-card-subtitle>
<span> Add a Group to the Database</span>
</v-card-subtitle>
<v-card-text>
<div>
<v-text-field
label="Group Name *"
v-model="groupLicenseName"
variant="outlined"
required
clearable
:rules="licenseGroupRules"
class="mb-3"
></v-text-field>
</div>
</v-card-text>
<v-card-actions>
<v-row>
<v-col cols="10" align="right" no-gutters>
<v-btn
class="ms-auto"
text="Cancel"
@click="group = false"
></v-btn>
</v-col>
<v-col>
<v-btn class="ms-auto" text="Add" type="submit"></v-btn>
</v-col>
</v-row>
</v-card-actions>
</v-form>
</v-card>
</v-dialog>
<!-- -->
<!-- ADD SECTION -->
<!-- -->
<v-btn icon class="mr-3" @click="add = true">
<Plus />
</v-btn>
@ -87,8 +134,9 @@
</v-form>
</v-card>
</v-dialog>
<!-- -->
<!-- EDIT SECTION -->
<!-- -->
<v-btn icon class="mr-3" @click="edit = true">
<Pencil />
</v-btn>
@ -147,14 +195,8 @@
<script setup lang="ts">
import { store } from "@/store";
import { SubmitEventPromise } from "vuetify";
import { computed, ref } from "vue";
import {
Plus,
LogOut,
Pencil,
CalendarCheck,
CalendarX,
} from "lucide-vue-next";
import { ref } from "vue";
import { Plus, LogOut, Pencil, FolderPlus } from "lucide-vue-next";
function handlelogout() {
console.log("logout");
@ -165,7 +207,20 @@ async function submit(event: SubmitEventPromise) {
const result = await event;
console.log(result);
}
//
// GROUP SECTION
//
const group = ref(false); // Dialog for Group
const groupLicenseName = ref<string>("");
const licenseGroupRules = [
(value: string) => {
if (value) return true;
return "YOU MUST ENTER (A GROUP NAME)";
},
];
//
// ADD SECTION
//