mirror of
https://gitlab.dit.htwk-leipzig.de/htwk-software/htwkalender.git
synced 2025-08-02 17:59:14 +02:00
21 add reminder booleans, map uuid to module
This commit is contained in:
@@ -17,6 +17,7 @@ const tableData = ref(
|
||||
const columns = ref([
|
||||
{ field: "Course", header: "Course" },
|
||||
{ field: "Module", header: "Module" },
|
||||
{ field: "Reminder", header: "Reminder"}
|
||||
]);
|
||||
|
||||
const helpVisible: Ref<boolean> = ref(false);
|
||||
@@ -36,7 +37,7 @@ async function finalStep() {
|
||||
<template>
|
||||
<div class="flex flex-column">
|
||||
<div class="flex align-items-center justify-content-center h-4rem m-2">
|
||||
<h3>Rename your selected Modules to your liking.</h3>
|
||||
<h3>Configure your selected Modules to your liking.</h3>
|
||||
<i class="shadow-3 hover:shadow-8 pi pi-info-circle m-2" style="font-size: 1.5rem; color: orange" @click="helpVisible = true"></i>
|
||||
<Dialog
|
||||
v-model:visible="helpVisible"
|
||||
@@ -65,30 +66,68 @@ async function finalStep() {
|
||||
table-class="editable-cells-table"
|
||||
responsive-layout="scroll"
|
||||
>
|
||||
<template #header>
|
||||
<div class="flex align-items-center justify-content-end">
|
||||
Enable all notifications:
|
||||
<InputSwitch
|
||||
class="mx-4"
|
||||
:model-value="tableData.reduce((acc, curr) => acc && curr.Module.reminder, true)"
|
||||
@update:model-value="tableData.forEach((module) => module.Module.reminder = $event)"
|
||||
/>
|
||||
</div>
|
||||
</template>
|
||||
<Column
|
||||
v-for="col of columns"
|
||||
:key="col.field"
|
||||
:field="col.field"
|
||||
:header="col.header"
|
||||
:class="col.field === 'Reminder' ? 'text-center' : ''"
|
||||
>
|
||||
<!-- Text Body -->
|
||||
<template #body="{ data, field }">
|
||||
<div>
|
||||
{{
|
||||
field === "Module" ? data[field].userDefinedName : data[field]
|
||||
}}
|
||||
</div>
|
||||
</template>
|
||||
<template #editor="{ data, field }">
|
||||
<template v-if="field !== 'Module'">
|
||||
<div>{{ data[field] }}</div>
|
||||
<template v-if="field === 'Module'">
|
||||
{{ data[field].userDefinedName }}
|
||||
</template>
|
||||
<template v-else-if="field === 'Reminder'" class="align-content-center">
|
||||
<Button
|
||||
:icon="data.Module.reminder ? 'pi pi-bell' : 'pi pi-times'"
|
||||
:severity="data.Module.reminder ? 'warning' : 'secondary'"
|
||||
rounded
|
||||
outlined
|
||||
class="small-button"
|
||||
@click = "data.Module.reminder = !data.Module.reminder"
|
||||
></Button>
|
||||
</template>
|
||||
<template v-else>
|
||||
{{ data[field] }}
|
||||
</template>
|
||||
</template>
|
||||
<!-- Editor Body -->
|
||||
<template #editor="{ data, field }">
|
||||
<template v-if="field === 'Module'">
|
||||
<InputText
|
||||
v-model="data[field].userDefinedName"
|
||||
class="w-full"
|
||||
autofocus
|
||||
/>
|
||||
</template>
|
||||
<template v-else-if="field === 'Reminder'">
|
||||
<!--<InputSwitch
|
||||
v-model="data.Module.reminder"
|
||||
class="align-self-center"
|
||||
/>-->
|
||||
<Button
|
||||
:icon="data.Module.reminder ? 'pi pi-bell' : 'pi pi-times'"
|
||||
:severity="data.Module.reminder ? 'warning' : 'secondary'"
|
||||
rounded
|
||||
outlined
|
||||
class="small-button"
|
||||
@click = "data.Module.reminder = !data.Module.reminder"
|
||||
></Button>
|
||||
</template>
|
||||
<template v-else>
|
||||
<div>{{ data[field] }}</div>
|
||||
</template>
|
||||
</template>
|
||||
</Column>
|
||||
</DataTable>
|
||||
@@ -100,4 +139,10 @@ async function finalStep() {
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<style scoped></style>
|
||||
<style scoped>
|
||||
.small-button.p-button {
|
||||
width: 2rem;
|
||||
height: 2rem;
|
||||
padding: 0;
|
||||
}
|
||||
</style>
|
||||
|
Reference in New Issue
Block a user