HTWK/htwkalender-pwa
1
0
Fork 0
mirror of https://gitlab.dit.htwk-leipzig.de/htwk-software/htwkalender-pwa.git synced 2025-08-04 02:39:16 +02:00
Code Issues Packages Projects Releases Wiki Activity

fixed frontend (format, lint, build)

Browse Source
This commit is contained in:
masterElmar
2023-11-01 22:31:12 +01:00
parent a8dce8207b
commit 0fc6e249d2
10 changed files with 277 additions and 208 deletions
Download Patch File Download Diff File Expand all files Collapse all files

60
.idea/workspace.xml generated
View File

@@ -6,6 +6,46 @@
<component name="ChangeListManager"> <component name="ChangeListManager">
<list default="true" id="81c34cb9-5538-45c5-b693-4f8a6bed15c4" name="Changes" comment="added missing idea files"> <list default="true" id="81c34cb9-5538-45c5-b693-4f8a6bed15c4" name="Changes" comment="added missing idea files">
<change beforePath="$PROJECT_DIR$/.idea/workspace.xml" beforeDir="false" afterPath="$PROJECT_DIR$/.idea/workspace.xml" afterDir="false" /> <change beforePath="$PROJECT_DIR$/.idea/workspace.xml" beforeDir="false" afterPath="$PROJECT_DIR$/.idea/workspace.xml" afterDir="false" />
<change beforePath="$PROJECT_DIR$/frontend/.eslintrc.cjs" beforeDir="false" afterPath="$PROJECT_DIR$/frontend/.eslintrc.cjs" afterDir="false" />
<change beforePath="$PROJECT_DIR$/frontend/.prettierrc.json" beforeDir="false" afterPath="$PROJECT_DIR$/frontend/.prettierrc.json" afterDir="false" />
<change beforePath="$PROJECT_DIR$/frontend/README.md" beforeDir="false" afterPath="$PROJECT_DIR$/frontend/README.md" afterDir="false" />
<change beforePath="$PROJECT_DIR$/frontend/index.html" beforeDir="false" afterPath="$PROJECT_DIR$/frontend/index.html" afterDir="false" />
<change beforePath="$PROJECT_DIR$/frontend/package-lock.json" beforeDir="false" afterPath="$PROJECT_DIR$/frontend/package-lock.json" afterDir="false" />
<change beforePath="$PROJECT_DIR$/frontend/package.json" beforeDir="false" afterPath="$PROJECT_DIR$/frontend/package.json" afterDir="false" />
<change beforePath="$PROJECT_DIR$/frontend/src/App.vue" beforeDir="false" afterPath="$PROJECT_DIR$/frontend/src/App.vue" afterDir="false" />
<change beforePath="$PROJECT_DIR$/frontend/src/api/createFeed.ts" beforeDir="false" afterPath="$PROJECT_DIR$/frontend/src/api/createFeed.ts" afterDir="false" />
<change beforePath="$PROJECT_DIR$/frontend/src/api/fetchCourse.ts" beforeDir="false" afterPath="$PROJECT_DIR$/frontend/src/api/fetchCourse.ts" afterDir="false" />
<change beforePath="$PROJECT_DIR$/frontend/src/api/fetchModule.ts" beforeDir="false" afterPath="$PROJECT_DIR$/frontend/src/api/fetchModule.ts" afterDir="false" />
<change beforePath="$PROJECT_DIR$/frontend/src/api/fetchRoom.ts" beforeDir="false" afterPath="$PROJECT_DIR$/frontend/src/api/fetchRoom.ts" afterDir="false" />
<change beforePath="$PROJECT_DIR$/frontend/src/api/loadCalendar.ts" beforeDir="false" afterPath="$PROJECT_DIR$/frontend/src/api/loadCalendar.ts" afterDir="false" />
<change beforePath="$PROJECT_DIR$/frontend/src/components/AdditionalModules.vue" beforeDir="false" afterPath="$PROJECT_DIR$/frontend/src/components/AdditionalModules.vue" afterDir="false" />
<change beforePath="$PROJECT_DIR$/frontend/src/components/CalendarLink.vue" beforeDir="false" afterPath="$PROJECT_DIR$/frontend/src/components/CalendarLink.vue" afterDir="false" />
<change beforePath="$PROJECT_DIR$/frontend/src/components/CourseSelection.vue" beforeDir="false" afterPath="$PROJECT_DIR$/frontend/src/components/CourseSelection.vue" afterDir="false" />
<change beforePath="$PROJECT_DIR$/frontend/src/components/FaqPage.vue" beforeDir="false" afterPath="$PROJECT_DIR$/frontend/src/components/FaqPage.vue" afterDir="false" />
<change beforePath="$PROJECT_DIR$/frontend/src/components/ImprintPage.vue" beforeDir="false" afterPath="$PROJECT_DIR$/frontend/src/components/ImprintPage.vue" afterDir="false" />
<change beforePath="$PROJECT_DIR$/frontend/src/components/MenuBar.vue" beforeDir="false" afterPath="$PROJECT_DIR$/frontend/src/components/MenuBar.vue" afterDir="false" />
<change beforePath="$PROJECT_DIR$/frontend/src/components/ModuleInformation.vue" beforeDir="false" afterPath="$PROJECT_DIR$/frontend/src/components/ModuleInformation.vue" afterDir="false" />
<change beforePath="$PROJECT_DIR$/frontend/src/components/ModuleSelection.vue" beforeDir="false" afterPath="$PROJECT_DIR$/frontend/src/components/ModuleSelection.vue" afterDir="false" />
<change beforePath="$PROJECT_DIR$/frontend/src/components/ModuleTemplateDialog.vue" beforeDir="false" afterPath="$PROJECT_DIR$/frontend/src/components/ModuleTemplateDialog.vue" afterDir="false" />
<change beforePath="$PROJECT_DIR$/frontend/src/components/PrivacyPolicy.vue" beforeDir="false" afterPath="$PROJECT_DIR$/frontend/src/components/PrivacyPolicy.vue" afterDir="false" />
<change beforePath="$PROJECT_DIR$/frontend/src/components/RenameModules.vue" beforeDir="false" afterPath="$PROJECT_DIR$/frontend/src/components/RenameModules.vue" afterDir="false" />
<change beforePath="$PROJECT_DIR$/frontend/src/components/RoomFinder.vue" beforeDir="false" afterPath="$PROJECT_DIR$/frontend/src/components/RoomFinder.vue" afterDir="false" />
<change beforePath="$PROJECT_DIR$/frontend/src/components/RoomOccupation.vue" beforeDir="false" afterPath="$PROJECT_DIR$/frontend/src/components/RoomOccupation.vue" afterDir="false" />
<change beforePath="$PROJECT_DIR$/frontend/src/components/editCalendar/EditAdditionalModules.vue" beforeDir="false" afterPath="$PROJECT_DIR$/frontend/src/components/editCalendar/EditAdditionalModules.vue" afterDir="false" />
<change beforePath="$PROJECT_DIR$/frontend/src/components/editCalendar/EditModules.vue" beforeDir="false" afterPath="$PROJECT_DIR$/frontend/src/components/editCalendar/EditModules.vue" afterDir="false" />
<change beforePath="$PROJECT_DIR$/frontend/src/main.ts" beforeDir="false" afterPath="$PROJECT_DIR$/frontend/src/main.ts" afterDir="false" />
<change beforePath="$PROJECT_DIR$/frontend/src/model/calendar.ts" beforeDir="false" afterPath="$PROJECT_DIR$/frontend/src/model/calendar.ts" afterDir="false" />
<change beforePath="$PROJECT_DIR$/frontend/src/model/event.ts" beforeDir="false" afterPath="$PROJECT_DIR$/frontend/src/model/event.ts" afterDir="false" />
<change beforePath="$PROJECT_DIR$/frontend/src/model/module.ts" beforeDir="false" afterPath="$PROJECT_DIR$/frontend/src/model/module.ts" afterDir="false" />
<change beforePath="$PROJECT_DIR$/frontend/src/router/index.ts" beforeDir="false" afterPath="$PROJECT_DIR$/frontend/src/router/index.ts" afterDir="false" />
<change beforePath="$PROJECT_DIR$/frontend/src/store/moduleStore.ts" beforeDir="false" afterPath="$PROJECT_DIR$/frontend/src/store/moduleStore.ts" afterDir="false" />
<change beforePath="$PROJECT_DIR$/frontend/src/store/tokenStore.ts" beforeDir="false" afterPath="$PROJECT_DIR$/frontend/src/store/tokenStore.ts" afterDir="false" />
<change beforePath="$PROJECT_DIR$/frontend/src/style.css" beforeDir="false" afterPath="$PROJECT_DIR$/frontend/src/style.css" afterDir="false" />
<change beforePath="$PROJECT_DIR$/frontend/src/view/editCalendarView.vue" beforeDir="false" afterPath="$PROJECT_DIR$/frontend/src/view/editCalendarView.vue" afterDir="false" />
<change beforePath="$PROJECT_DIR$/frontend/src/vite-env.d.ts" beforeDir="false" afterPath="$PROJECT_DIR$/frontend/src/vite-env.d.ts" afterDir="false" />
<change beforePath="$PROJECT_DIR$/frontend/tsconfig.json" beforeDir="false" afterPath="$PROJECT_DIR$/frontend/tsconfig.json" afterDir="false" />
<change beforePath="$PROJECT_DIR$/frontend/tsconfig.node.json" beforeDir="false" afterPath="$PROJECT_DIR$/frontend/tsconfig.node.json" afterDir="false" />
<change beforePath="$PROJECT_DIR$/frontend/vite.config.ts" beforeDir="false" afterPath="$PROJECT_DIR$/frontend/vite.config.ts" afterDir="false" />
</list> </list>
<option name="SHOW_DIALOG" value="false" /> <option name="SHOW_DIALOG" value="false" />
<option name="HIGHLIGHT_CONFLICTS" value="true" /> <option name="HIGHLIGHT_CONFLICTS" value="true" />
@@ -69,7 +109,7 @@
"RunOnceActivity.go.migrated.go.modules.settings": "true", "RunOnceActivity.go.migrated.go.modules.settings": "true",
"RunOnceActivity.go.modules.automatic.dependencies.download": "true", "RunOnceActivity.go.modules.automatic.dependencies.download": "true",
"WebServerToolWindowFactoryState": "false", "WebServerToolWindowFactoryState": "false",
"git-widget-placeholder": "10-roomfinder", "git-widget-placeholder": "main",
"go.import.settings.migrated": "true", "go.import.settings.migrated": "true",
"ignore.virus.scanning.warn.message": "true", "ignore.virus.scanning.warn.message": "true",
"jdk.selected.JAVA_MODULE": "20", "jdk.selected.JAVA_MODULE": "20",
@@ -79,7 +119,7 @@
"node.js.selected.package.eslint": "(autodetect)", "node.js.selected.package.eslint": "(autodetect)",
"node.js.selected.package.tslint": "(autodetect)", "node.js.selected.package.tslint": "(autodetect)",
"nodejs_package_manager_path": "npm", "nodejs_package_manager_path": "npm",
"prettierjs.PrettierConfiguration.Package": "C:\\Users\\masterelmar\\GolandProjects\\htwk-planner\\frontend\\node_modules\\prettier", "prettierjs.PrettierConfiguration.Package": "C:\\Users\\masterelmar\\project\\htwkalender\\frontend\\node_modules\\prettier",
"project.structure.last.edited": "Modules", "project.structure.last.edited": "Modules",
"project.structure.proportion": "0.0", "project.structure.proportion": "0.0",
"project.structure.side.proportion": "0.42068964", "project.structure.side.proportion": "0.42068964",
@@ -138,6 +178,8 @@
<workItem from="1697823365338" duration="611000" /> <workItem from="1697823365338" duration="611000" />
<workItem from="1697823990507" duration="315000" /> <workItem from="1697823990507" duration="315000" />
<workItem from="1698862050509" duration="64000" /> <workItem from="1698862050509" duration="64000" />
<workItem from="1698873056958" duration="5000" />
<workItem from="1698873376316" duration="726000" />
</task> </task>
<servers /> <servers />
</component> </component>
@@ -149,7 +191,19 @@
<map> <map>
<entry key="MAIN"> <entry key="MAIN">
<value> <value>
<State /> <State>
<option name="FILTERS">
<map>
<entry key="branch">
<value>
<list>
<option value="main" />
</list>
</value>
</entry>
</map>
</option>
</State>
</value> </value>
</entry> </entry>
</map> </map>

2
frontend/src/api/fetchCourse.ts
View File

@@ -33,6 +33,7 @@ export async function fetchModulesByCourseAndSemester(
module.name, module.name,
module.prof, module.prof,
semester, semester,
false,
module.events, module.events,
), ),
), ),
@@ -57,6 +58,7 @@ export async function fetchAllModules(): Promise<Module[]> {
module.name, module.name,
module.prof, module.prof,
module.semester, module.semester,
false,
module.events, module.events,
), ),
); );

1
frontend/src/api/fetchModule.ts
View File

@@ -22,6 +22,7 @@ export async function fetchModule(module: Module): Promise<Module> {
module.name, module.name,
module.prof, module.prof,
module.semester, module.semester,
false,
module.events, module.events,
), ),
); );

14
frontend/src/api/fetchRoom.ts
View File

@@ -1,4 +1,4 @@
import {Event} from "../model/event.ts"; import { Event } from "../model/event.ts";
export async function fetchRoom(): Promise<string[]> { export async function fetchRoom(): Promise<string[]> {
const rooms: string[] = []; const rooms: string[] = [];
@@ -18,19 +18,21 @@ export async function fetchEventsByRoomAndDuration(
to_date: string, to_date: string,
): Promise<Event[]> { ): Promise<Event[]> {
const events: Event[] = []; const events: Event[] = [];
await fetch("/api/schedule?room=" + room + "&from=" + from_date + "&to=" + to_date) await fetch(
"/api/schedule?room=" + room + "&from=" + from_date + "&to=" + to_date,
)
.then((response) => { .then((response) => {
console.log(response); console.log(response);
return response.json(); return response.json();
}) })
.then((eventsResponse) => { .then((eventsResponse) => {
console.log("Response:", eventsResponse); console.log("Response:", eventsResponse);
eventsResponse.forEach((event: Event) => eventsResponse.forEach((event: Event) => events.push(event));
events.push(event)); })
}).catch((error) => { .catch((error) => {
console.log("Error fetching events: ", error); console.log("Error fetching events: ", error);
return null; return null;
}) });
console.log("occupations: ", events); console.log("occupations: ", events);
return events; return events;
} }

40
frontend/src/components/ModuleTemplateDialog.vue
View File

@@ -4,8 +4,16 @@ import { Ref, ref } from "vue";
const helpVisible: Ref<boolean> = ref(false); const helpVisible: Ref<boolean> = ref(false);
const placeholders = ref([ const placeholders = ref([
{ placeholder: "%t", description: "Event Type", examples: "V = Vorlesung, S = Seminar, P = Praktikum/Prüfung" }, {
{ placeholder: "%p", description: "Mandatory", examples: "w = optional, p = mandatory" }, placeholder: "%t",
description: "Event Type",
examples: "V = Vorlesung, S = Seminar, P = Praktikum/Prüfung",
},
{
placeholder: "%p",
description: "Mandatory",
examples: "w = optional, p = mandatory",
},
]); ]);
</script> </script>
@@ -18,36 +26,30 @@ const placeholders = ref([
outlined outlined
size="large" size="large"
aria-label="Help" aria-label="Help"
@click="helpVisible = true" /> @click="helpVisible = true"
<Dialog />
v-model:visible="helpVisible" <Dialog v-model:visible="helpVisible" header="Module configuration">
header="Module configuration"
>
<p> <p>
Here you can rename your modules to your liking. This will be the name Here you can rename your modules to your liking. This will be the name of
of the event in your calendar. the event in your calendar.
</p> </p>
<p> <p>You can use the following placeholders in your module names:</p>
You can use the following placeholders in your module names: <DataTable :value="placeholders">
</p>
<DataTable
:value="placeholders"
>
<Column field="placeholder" header="Placeholder"></Column> <Column field="placeholder" header="Placeholder"></Column>
<Column field="description" header="Description"></Column> <Column field="description" header="Description"></Column>
<Column field="examples" header="Examples"></Column> <Column field="examples" header="Examples"></Column>
</DataTable> </DataTable>
<p> <p>
Additionally, you can toggle notifications for each module. Additionally, you can toggle notifications for each module. If you do so,
If you do so, you will be notified 15 minutes before the event starts. you will be notified 15 minutes before the event starts.
</p> </p>
</Dialog> </Dialog>
</template> </template>
<style scoped> <style scoped>
.small-button.p-button { .small-button.p-button {
width: 2rem; width: 2rem;
height: 2rem; height: 2rem;
padding: 0; padding: 0;
} }
</style> </style>

23
frontend/src/components/RenameModules.vue
View File

@@ -18,7 +18,7 @@ const tableData = ref(
const columns = ref([ const columns = ref([
{ field: "Course", header: "Course" }, { field: "Course", header: "Course" },
{ field: "Module", header: "Module" }, { field: "Module", header: "Module" },
{ field: "Reminder", header: "Reminder"} { field: "Reminder", header: "Reminder" },
]); ]);
async function finalStep() { async function finalStep() {
@@ -46,8 +46,15 @@ async function finalStep() {
Enable all notifications: Enable all notifications:
<InputSwitch <InputSwitch
class="mx-4" class="mx-4"
:model-value="tableData.reduce((acc, curr) => acc && curr.Module.reminder, true)" :model-value="
@update:model-value="tableData.forEach((module) => module.Module.reminder = $event)" tableData.reduce(
(acc, curr) => acc && curr.Module.reminder,
true,
)
"
@update:model-value="
tableData.forEach((module) => (module.Module.reminder = $event))
"
/> />
</div> </div>
</template> </template>
@@ -63,14 +70,14 @@ async function finalStep() {
<template v-if="field === 'Module'"> <template v-if="field === 'Module'">
{{ data[field].userDefinedName }} {{ data[field].userDefinedName }}
</template> </template>
<template v-else-if="field === 'Reminder'" class="align-content-center"> <template v-else-if="field === 'Reminder'">
<Button <Button
:icon="data.Module.reminder ? 'pi pi-bell' : 'pi pi-times'" :icon="data.Module.reminder ? 'pi pi-bell' : 'pi pi-times'"
:severity="data.Module.reminder ? 'warning' : 'secondary'" :severity="data.Module.reminder ? 'warning' : 'secondary'"
rounded rounded
outlined outlined
class="small-button" class="small-button"
@click = "data.Module.reminder = !data.Module.reminder" @click="data.Module.reminder = !data.Module.reminder"
></Button> ></Button>
</template> </template>
<template v-else> <template v-else>
@@ -97,7 +104,7 @@ async function finalStep() {
rounded rounded
outlined outlined
class="small-button" class="small-button"
@click = "data.Module.reminder = !data.Module.reminder" @click="data.Module.reminder = !data.Module.reminder"
></Button> ></Button>
</template> </template>
<template v-else> <template v-else>
@@ -115,9 +122,9 @@ async function finalStep() {
</template> </template>
<style scoped> <style scoped>
.small-button.p-button { .small-button.p-button {
width: 2rem; width: 2rem;
height: 2rem; height: 2rem;
padding: 0; padding: 0;
} }
</style> </style>

15
frontend/src/components/RoomFinder.vue
View File

@@ -1,7 +1,6 @@
<script lang="ts" setup> <script lang="ts" setup>
import { Ref, ref } from "vue";
import {Ref, ref} from "vue"; import { fetchRoom } from "../api/fetchRoom.ts";
import {fetchRoom} from "../api/fetchRoom.ts";
import RoomOccupation from "./RoomOccupation.vue"; import RoomOccupation from "./RoomOccupation.vue";
const rooms = async () => { const rooms = async () => {
@@ -9,12 +8,12 @@ const rooms = async () => {
}; };
const roomsList: Ref<{ name: string }[]> = ref([]); const roomsList: Ref<{ name: string }[]> = ref([]);
const selectedRoom: Ref<{ name: string }> = ref({name: ""}); const selectedRoom: Ref<{ name: string }> = ref({ name: "" });
rooms().then( rooms().then(
(data) => (data) =>
(roomsList.value = data.map((room) => { (roomsList.value = data.map((room) => {
return {name: room}; return { name: room };
})), })),
); );
</script> </script>
@@ -41,10 +40,8 @@ rooms().then(
placeholder="Select a Room" placeholder="Select a Room"
/> />
</div> </div>
<div <div class="m-6">
class="m-6" <RoomOccupation :room="selectedRoom.name" />
>
<RoomOccupation :room="selectedRoom.name"/>
</div> </div>
</div> </div>
</template> </template>

100
frontend/src/components/RoomOccupation.vue
View File

@@ -1,11 +1,11 @@
<script lang="ts" setup> <script lang="ts" setup>
import FullCalendar from '@fullcalendar/vue3' import FullCalendar from "@fullcalendar/vue3";
import dayGridPlugin from '@fullcalendar/daygrid' import dayGridPlugin from "@fullcalendar/daygrid";
import interactionPlugin from '@fullcalendar/interaction' import interactionPlugin from "@fullcalendar/interaction";
import timeGridPlugin from '@fullcalendar/timegrid' import timeGridPlugin from "@fullcalendar/timegrid";
import {computed, ref, Ref, watch} from "vue"; import { computed, ref, Ref, watch } from "vue";
import {CalendarOptions, EventInput} from "@fullcalendar/core"; import { CalendarOptions, EventInput } from "@fullcalendar/core";
import {fetchEventsByRoomAndDuration} from "../api/fetchRoom.ts"; import { fetchEventsByRoomAndDuration } from "../api/fetchRoom.ts";
const props = defineProps({ const props = defineProps({
room: { room: {
@@ -26,11 +26,11 @@ const occupations: Ref<CalenderEvent[]> = ref([]);
const selectedRoom = computed(() => props.room); const selectedRoom = computed(() => props.room);
watch(selectedRoom, (_newValue: string) => { watch(selectedRoom, () => {
getOccupation(); getOccupation();
}); });
const fullCalendar = ref<InstanceType<typeof FullCalendar>>() const fullCalendar = ref<InstanceType<typeof FullCalendar>>();
async function getOccupation() { async function getOccupation() {
if (selectedRoom.value === "") { if (selectedRoom.value === "") {
@@ -39,87 +39,86 @@ async function getOccupation() {
const events = await fetchEventsByRoomAndDuration( const events = await fetchEventsByRoomAndDuration(
selectedRoom.value, selectedRoom.value,
currentDateFrom.value, currentDateFrom.value,
currentDateTo.value currentDateTo.value,
); );
occupations.value = events.map((event, index) => { occupations.value = events.map((event, index) => {
return { return {
id: index, id: index,
start: event.start.replace(/\s\+\d{4}\s\w+$/, '').replace(' ', 'T'), start: event.start.replace(/\s\+\d{4}\s\w+$/, "").replace(" ", "T"),
end: event.end.replace(/\s\+\d{4}\s\w+$/, '').replace(' ', 'T') end: event.end.replace(/\s\+\d{4}\s\w+$/, "").replace(" ", "T"),
}; };
}); });
let calendar = fullCalendar.value?.getApi() const calendar = fullCalendar.value?.getApi();
calendar?.refetchEvents() calendar?.refetchEvents();
} }
const calendarOptions: CalendarOptions = {
const calendarOptions: CalendarOptions = {
plugins: [dayGridPlugin, interactionPlugin, timeGridPlugin], plugins: [dayGridPlugin, interactionPlugin, timeGridPlugin],
initialView: 'week', initialView: "week",
dayHeaderFormat: {weekday: 'short', omitCommas: true}, dayHeaderFormat: { weekday: "short", omitCommas: true },
slotDuration: "00:15:00", slotDuration: "00:15:00",
eventTimeFormat: { eventTimeFormat: {
hour: "2-digit", hour: "2-digit",
minute: "2-digit", minute: "2-digit",
hour12: false hour12: false,
}, },
views: { views: {
week: { week: {
type: 'timeGrid', type: "timeGrid",
slotLabelFormat: { slotLabelFormat: {
hour: 'numeric', hour: "numeric",
minute: '2-digit', minute: "2-digit",
omitZeroMinute: false, omitZeroMinute: false,
meridiem: false, meridiem: false,
hour12: false hour12: false,
}, },
dateAlignment: "week", dateAlignment: "week",
titleFormat: {month: 'short', day: 'numeric'}, titleFormat: { month: "short", day: "numeric" },
slotMinTime: "06:00:00", slotMinTime: "06:00:00",
slotMaxTime: "22:00:00", slotMaxTime: "22:00:00",
duration: {days: 7}, duration: { days: 7 },
firstDay: 1, firstDay: 1,
allDaySlot: false, allDaySlot: false,
hiddenDays: [0] hiddenDays: [0],
}, },
Day: { Day: {
type: 'timeGrid', type: "timeGrid",
slotLabelFormat: { slotLabelFormat: {
hour: 'numeric', hour: "numeric",
minute: '2-digit', minute: "2-digit",
omitZeroMinute: false, omitZeroMinute: false,
meridiem: false, meridiem: false,
hour12: false hour12: false,
}, },
titleFormat: {month: 'short', day: 'numeric'}, titleFormat: { month: "short", day: "numeric" },
slotMinTime: "06:00:00", slotMinTime: "06:00:00",
slotMaxTime: "22:00:00", slotMaxTime: "22:00:00",
duration: {days: 1}, duration: { days: 1 },
allDaySlot: false, allDaySlot: false,
hiddenDays: [0] hiddenDays: [0],
}, },
}, },
headerToolbar: { headerToolbar: {
end: 'prev,next today', end: "prev,next today",
center: 'title', center: "title",
start: 'week,Day' start: "week,Day",
}, },
datesSet: function (dateInfo) { datesSet: function (dateInfo) {
const view = dateInfo.view; const view = dateInfo.view;
const offset = (new Date()).getTimezoneOffset(); const offset = new Date().getTimezoneOffset();
const startDate = new Date(view.activeStart.getTime() - (offset*60*1000)); const startDate = new Date(view.activeStart.getTime() - offset * 60 * 1000);
const endDate = new Date(view.activeEnd.getTime() - (offset*60*1000)); const endDate = new Date(view.activeEnd.getTime() - offset * 60 * 1000);
currentDateFrom.value = startDate.toISOString().split('T')[0] currentDateFrom.value = startDate.toISOString().split("T")[0];
currentDateTo.value = endDate.toISOString().split('T')[0] currentDateTo.value = endDate.toISOString().split("T")[0];
getOccupation(); getOccupation();
}, },
events: function(_info, successCallback, failureCallback) { events: function (_info, successCallback, failureCallback) {
if (occupations.value.length === 0){ if (occupations.value.length === 0) {
failureCallback(new Error("no events")) failureCallback(new Error("no events"));
}else{ } else {
successCallback( successCallback(
occupations.value.map((event) => { occupations.value.map((event) => {
return { return {
@@ -127,13 +126,12 @@ async function getOccupation() {
start: event.start, start: event.start,
end: event.end, end: event.end,
} as EventInput; } as EventInput;
}) }),
) );
} }
} },
} };
</script> </script>
<template> <template>
<FullCalendar ref="fullCalendar" :options="calendarOptions"/> <FullCalendar ref="fullCalendar" :options="calendarOptions" />
</template> </template>

7
frontend/src/components/editCalendar/EditAdditionalModules.vue
View File

@@ -37,9 +37,7 @@ const ModuleInformation = defineAsyncComponent(
); );
async function showInfo(module: Module) { async function showInfo(module: Module) {
await fetchModule(module).then((data) => { await fetchModule(module).then((data: Module) => {
module.value = data;
});
dialog.open(ModuleInformation, { dialog.open(ModuleInformation, {
props: { props: {
style: { style: {
@@ -52,9 +50,10 @@ async function showInfo(module: Module) {
modal: true, modal: true,
}, },
data: { data: {
module: module, module: data,
}, },
}); });
});
} }
const display = (module: Module) => module.name + " (" + module.course + ")"; const display = (module: Module) => module.name + " (" + module.course + ")";

23
frontend/src/components/editCalendar/EditModules.vue
View File

@@ -20,7 +20,7 @@ const tableData = computed(() =>
const columns = ref([ const columns = ref([
{ field: "Course", header: "Course" }, { field: "Course", header: "Course" },
{ field: "Module", header: "Module" }, { field: "Module", header: "Module" },
{ field: "Reminder", header: "Reminder"} { field: "Reminder", header: "Reminder" },
]); ]);
const fetchedModules = async () => { const fetchedModules = async () => {
@@ -67,8 +67,15 @@ async function finalStep() {
Enable all notifications: Enable all notifications:
<InputSwitch <InputSwitch
class="mx-4" class="mx-4"
:model-value="tableData.reduce((acc, curr) => acc && curr.Module.reminder, true)" :model-value="
@update:model-value="tableData.forEach((module) => module.Module.reminder = $event)" tableData.reduce(
(acc, curr) => acc && curr.Module.reminder,
true,
)
"
@update:model-value="
tableData.forEach((module) => (module.Module.reminder = $event))
"
/> />
</div> </div>
</template> </template>
@@ -84,14 +91,14 @@ async function finalStep() {
<template v-if="field === 'Module'"> <template v-if="field === 'Module'">
{{ data[field].userDefinedName }} {{ data[field].userDefinedName }}
</template> </template>
<template v-else-if="field === 'Reminder'" class="align-content-center"> <template v-else-if="field === 'Reminder'">
<Button <Button
:icon="data.Module.reminder ? 'pi pi-bell' : 'pi pi-times'" :icon="data.Module.reminder ? 'pi pi-bell' : 'pi pi-times'"
:severity="data.Module.reminder ? 'warning' : 'secondary'" :severity="data.Module.reminder ? 'warning' : 'secondary'"
rounded rounded
outlined outlined
class="small-button" class="small-button"
@click = "data.Module.reminder = !data.Module.reminder" @click="data.Module.reminder = !data.Module.reminder"
></Button> ></Button>
</template> </template>
<template v-else> <template v-else>
@@ -114,7 +121,7 @@ async function finalStep() {
rounded rounded
outlined outlined
class="small-button" class="small-button"
@click = "data.Module.reminder = !data.Module.reminder" @click="data.Module.reminder = !data.Module.reminder"
></Button> ></Button>
</template> </template>
</template> </template>
@@ -143,9 +150,9 @@ async function finalStep() {
</template> </template>
<style scoped> <style scoped>
.small-button.p-button { .small-button.p-button {
width: 2rem; width: 2rem;
height: 2rem; height: 2rem;
padding: 0; padding: 0;
} }
</style> </style>