mirror of
https://gitlab.dit.htwk-leipzig.de/htwk-software/htwkalender.git
synced 2025-08-04 02:39:14 +02:00
[#10] WIP
This commit is contained in:
Tom Wahl
30
frontend/src/api/fetchRoom.ts
Normal file
30
frontend/src/api/fetchRoom.ts
Normal file
@@ -0,0 +1,30 @@
|
||||
import {Module, Event} from "../model/event.ts";
|
||||
|
||||
export async function fetchRoom(): Promise<string[]> {
|
||||
const rooms: string[] = [];
|
||||
await fetch("/api/rooms")
|
||||
.then((response) => {
|
||||
return response.json();
|
||||
})
|
||||
.then((roomsResponse) => {
|
||||
roomsResponse.forEach((room: string) => rooms.push(room));
|
||||
});
|
||||
return rooms;
|
||||
}
|
||||
|
||||
export async function fetchEventsByRoomAndWeek(
|
||||
room: string,
|
||||
week: string,
|
||||
): Promise<Event[]> {
|
||||
const occupations: Event[] = [];
|
||||
await fetch("/api/schedule/week?room=" + room + "&week=" + week)
|
||||
.then((response) => {
|
||||
return response.json();
|
||||
})
|
||||
.then((eventsResponse) => {
|
||||
eventsResponse.forEach((event: Event) =>
|
||||
occupations.push(new Event(event.Days, event.Week, event.Start, event.End, event.Name, event.EventType, event.Prof, event.Rooms, event.Notes, event.BookedAt, event.Course, event.Semester)),
|
||||
);
|
||||
});
|
||||
return occupations;
|
||||
}
|
||||
84
frontend/src/components/RoomFinder.vue
Normal file
84
frontend/src/components/RoomFinder.vue
Normal file
@@ -0,0 +1,84 @@
|
||||
<script lang="ts" setup>
|
||||
import {Ref, ref} from "vue";
|
||||
import {fetchEventsByRoomAndWeek, fetchRoom} from "../api/fetchRoom.ts";
|
||||
import InputNumber from 'primevue/inputnumber';
|
||||
import RoomOccupation from "./RoomOccupation.vue";
|
||||
import {Event} from "../model/event.ts";
|
||||
|
||||
const rooms = async () => {
|
||||
return await fetchRoom();
|
||||
};
|
||||
|
||||
const roomsList: Ref<{ name: string }[]> = ref([]);
|
||||
|
||||
const days: Ref<{ name: string; value: string }[]> = ref([
|
||||
{name: "Montag", value: "mo"},
|
||||
{name: "Dienstag", value: "di"},
|
||||
{name: "Mittwoch", value: "mi"},
|
||||
{name: "Donnerstag", value: "do"},
|
||||
{name: "Donnerstag", value: "fr"},
|
||||
{name: "Donnerstag", value: "sa"},
|
||||
]);
|
||||
|
||||
const selectedDay: Ref<{ name: string; value: string }> = ref(
|
||||
days.value[0],
|
||||
);
|
||||
|
||||
const selectedWeekNumber: Ref<number> = ref(
|
||||
1
|
||||
);
|
||||
const selectedRoom: Ref<{ name: string }> = ref({name: ""});
|
||||
|
||||
rooms().then(
|
||||
(data) =>
|
||||
(roomsList.value = data.map((room) => {
|
||||
return {name: room};
|
||||
})),
|
||||
);
|
||||
|
||||
|
||||
const occupations: Ref<Event[]> = ref([]);
|
||||
|
||||
async function getOccupation() {
|
||||
occupations.value = await fetchEventsByRoomAndWeek(
|
||||
selectedRoom.value.name,
|
||||
selectedWeekNumber.value,
|
||||
);
|
||||
}
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div class="flex flex-column">
|
||||
<div class="flex align-items-center justify-content-center h-4rem m-2">
|
||||
<h3 class="text-4xl">Raumfinder</h3>
|
||||
</div>
|
||||
<div
|
||||
class="flex align-items-center justify-content-center h-4rem border-round m-2"
|
||||
>
|
||||
<h5 class="text-2xl">Please select a room</h5>
|
||||
</div>
|
||||
<div
|
||||
class="flex align-items-center justify-content-center border-round m-2"
|
||||
>
|
||||
<Dropdown
|
||||
v-model="selectedRoom"
|
||||
:options="roomsList"
|
||||
class="w-full md:w-25rem mx-2"
|
||||
filter
|
||||
option-label="name"
|
||||
placeholder="Select a Room"
|
||||
@change="getOccupation()"
|
||||
/>
|
||||
</div>
|
||||
<div
|
||||
class="flex align-items-center justify-content-center border-round m-2"
|
||||
>
|
||||
<div class="flex flex-column gap-2">
|
||||
<InputNumber id="week-number-input" v-model="selectedWeekNumber" inputId="minmax" :min="0" :max="100"
|
||||
showButtons/>
|
||||
<small id="username-help">Planning Week</small>
|
||||
</div>
|
||||
</div>
|
||||
<RoomOccupation :occupations="occupations"/>
|
||||
</div>
|
||||
</template>
|
||||
232
frontend/src/components/RoomOccupation.vue
Normal file
232
frontend/src/components/RoomOccupation.vue
Normal file
@@ -0,0 +1,232 @@
|
||||
<script lang="ts" setup>
|
||||
import FullCalendar from '@fullcalendar/vue3'
|
||||
import dayGridPlugin from '@fullcalendar/daygrid'
|
||||
import interactionPlugin from '@fullcalendar/interaction'
|
||||
import timeGridPlugin from '@fullcalendar/timegrid'
|
||||
import {computed, PropType, ref, Ref, watch} from "vue";
|
||||
import {Event} from "../model/event.ts";
|
||||
import {Module} from "../model/module.ts";
|
||||
|
||||
const props = defineProps({
|
||||
occupations: {
|
||||
type: Array as PropType<Event[]>,
|
||||
required: true,
|
||||
},
|
||||
});
|
||||
|
||||
|
||||
|
||||
// array of modules with boolean if selected with getter and setter
|
||||
const events: Ref<{ id: string; start: string, end: string }[]> = ref(
|
||||
props.occupations?.map((event, index) => {
|
||||
return {
|
||||
id: index,
|
||||
start: event.start.replace(/\s\+\d{4}\s\w+$/, '').replace(' ', 'T'),
|
||||
end: event.End.replace(/\s\+\d{4}\s\w+$/, '').replace(' ', 'T')
|
||||
};
|
||||
}),
|
||||
);
|
||||
|
||||
|
||||
const currentOccupations = computed(() => props.occupations);
|
||||
|
||||
watch(currentOccupations, (newValue: Event[]) => {
|
||||
events.value = newValue.map((event, index) => {
|
||||
return {
|
||||
id: index,
|
||||
start: event.Start.replace(/\s\+\d{4}\s\w+$/, '').replace(' ', 'T'),
|
||||
end: event.End.replace(/\s\+\d{4}\s\w+$/, '').replace(' ', 'T'),
|
||||
};
|
||||
});
|
||||
console.log(events.value);
|
||||
});
|
||||
|
||||
|
||||
|
||||
const calendarOptions = {
|
||||
plugins: [dayGridPlugin, interactionPlugin, timeGridPlugin],
|
||||
initialView: 'timeGridFourDay',
|
||||
dayHeaderFormat: { weekday: 'short', omitCommas: true},
|
||||
slotDuration: "00:15:00",
|
||||
views: {
|
||||
timeGridFourDay: {
|
||||
type: 'timeGrid',
|
||||
slotLabelFormat: {
|
||||
hour: 'numeric',
|
||||
minute: '2-digit',
|
||||
omitZeroMinute: false,
|
||||
meridiem: false
|
||||
},
|
||||
dateAlignment: "week",
|
||||
titleFormat: { month: 'short', day: 'numeric' },
|
||||
slotMinTime: "06:00:00",
|
||||
slotMaxTime: "22:00:00",
|
||||
|
||||
duration: {days: 7},
|
||||
firstDay: 1,
|
||||
allDaySlot: false,
|
||||
hiddenDays:[0]
|
||||
}
|
||||
},
|
||||
events: [
|
||||
{
|
||||
"id": 0,
|
||||
"start": "2023-10-16T09:30:00",
|
||||
"end": "2023-10-16T11:00:00"
|
||||
},
|
||||
{
|
||||
"id": 1,
|
||||
"start": "2023-10-16T11:15:00",
|
||||
"end": "2023-10-16T12:45:00"
|
||||
},
|
||||
{
|
||||
"id": 2,
|
||||
"start": "2023-10-17T13:45:00",
|
||||
"end": "2023-10-17T15:15:00"
|
||||
},
|
||||
{
|
||||
"id": 3,
|
||||
"start": "2023-10-16T09:30:00",
|
||||
"end": "2023-10-16T11:00:00"
|
||||
},
|
||||
{
|
||||
"id": 4,
|
||||
"start": "2023-10-20T09:30:00",
|
||||
"end": "2023-10-20T11:00:00"
|
||||
},
|
||||
{
|
||||
"id": 5,
|
||||
"start": "2023-10-16T09:30:00",
|
||||
"end": "2023-10-16T11:00:00"
|
||||
},
|
||||
{
|
||||
"id": 6,
|
||||
"start": "2023-10-20T09:30:00",
|
||||
"end": "2023-10-20T11:00:00"
|
||||
},
|
||||
{
|
||||
"id": 7,
|
||||
"start": "2023-10-18T13:45:00",
|
||||
"end": "2023-10-18T17:00:00"
|
||||
},
|
||||
{
|
||||
"id": 8,
|
||||
"start": "2023-10-18T13:45:00",
|
||||
"end": "2023-10-18T17:00:00"
|
||||
},
|
||||
{
|
||||
"id": 9,
|
||||
"start": "2023-10-16T13:45:00",
|
||||
"end": "2023-10-16T15:15:00"
|
||||
},
|
||||
{
|
||||
"id": 10,
|
||||
"start": "2023-10-17T11:15:00",
|
||||
"end": "2023-10-17T12:45:00"
|
||||
},
|
||||
{
|
||||
"id": 11,
|
||||
"start": "2023-10-16T13:45:00",
|
||||
"end": "2023-10-16T15:15:00"
|
||||
},
|
||||
{
|
||||
"id": 12,
|
||||
"start": "2023-10-17T11:15:00",
|
||||
"end": "2023-10-17T12:45:00"
|
||||
},
|
||||
{
|
||||
"id": 13,
|
||||
"start": "2023-10-18T09:30:00",
|
||||
"end": "2023-10-18T12:45:00"
|
||||
},
|
||||
{
|
||||
"id": 14,
|
||||
"start": "2023-10-16T13:45:00",
|
||||
"end": "2023-10-16T15:15:00"
|
||||
},
|
||||
{
|
||||
"id": 15,
|
||||
"start": "2023-10-17T11:15:00",
|
||||
"end": "2023-10-17T12:45:00"
|
||||
},
|
||||
{
|
||||
"id": 16,
|
||||
"start": "2023-10-18T09:30:00",
|
||||
"end": "2023-10-18T12:45:00"
|
||||
},
|
||||
{
|
||||
"id": 17,
|
||||
"start": "2023-10-16T13:45:00",
|
||||
"end": "2023-10-16T15:15:00"
|
||||
},
|
||||
{
|
||||
"id": 18,
|
||||
"start": "2023-10-17T11:15:00",
|
||||
"end": "2023-10-17T12:45:00"
|
||||
},
|
||||
{
|
||||
"id": 19,
|
||||
"start": "2023-10-18T09:30:00",
|
||||
"end": "2023-10-18T12:45:00"
|
||||
},
|
||||
{
|
||||
"id": 20,
|
||||
"start": "2023-10-16T13:45:00",
|
||||
"end": "2023-10-16T15:15:00"
|
||||
},
|
||||
{
|
||||
"id": 21,
|
||||
"start": "2023-10-17T11:15:00",
|
||||
"end": "2023-10-17T12:45:00"
|
||||
},
|
||||
{
|
||||
"id": 22,
|
||||
"start": "2023-10-18T09:30:00",
|
||||
"end": "2023-10-18T12:45:00"
|
||||
},
|
||||
{
|
||||
"id": 23,
|
||||
"start": "2023-10-17T09:30:00",
|
||||
"end": "2023-10-17T11:00:00"
|
||||
},
|
||||
{
|
||||
"id": 24,
|
||||
"start": "2023-10-20T11:15:00",
|
||||
"end": "2023-10-20T12:45:00"
|
||||
},
|
||||
{
|
||||
"id": 25,
|
||||
"start": "2023-10-20T11:15:00",
|
||||
"end": "2023-10-20T12:45:00"
|
||||
},
|
||||
{
|
||||
"id": 26,
|
||||
"start": "2023-10-16T11:15:00",
|
||||
"end": "2023-10-16T12:45:00"
|
||||
},
|
||||
{
|
||||
"id": 27,
|
||||
"start": "2023-10-17T13:45:00",
|
||||
"end": "2023-10-17T15:15:00"
|
||||
},
|
||||
{
|
||||
"id": 28,
|
||||
"start": "2023-10-17T15:30:00",
|
||||
"end": "2023-10-17T17:00:00"
|
||||
},
|
||||
{
|
||||
"id": 29,
|
||||
"start": "2023-10-19T11:15:00",
|
||||
"end": "2023-10-19T12:45:00"
|
||||
},
|
||||
{
|
||||
"id": 30,
|
||||
"start": "2023-10-19T13:45:00",
|
||||
"end": "2023-10-19T15:15:00"
|
||||
}
|
||||
]
|
||||
}
|
||||
</script>
|
||||
<template>
|
||||
<FullCalendar :options="calendarOptions"/>
|
||||
</template>
|
||||
404
frontend/src/components/RoomOccupation2.vue
Normal file
404
frontend/src/components/RoomOccupation2.vue
Normal file
@@ -0,0 +1,404 @@
|
||||
<script lang="ts" setup>
|
||||
|
||||
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<table class="table">
|
||||
<thead>
|
||||
<tr id="calenderTableHead">
|
||||
<th scope="col">Time</th>
|
||||
<th scope="col">Monday</th>
|
||||
<th scope="col">Tuesday</th>
|
||||
<th scope="col">Wednesday</th>
|
||||
<th scope="col">Thursday</th>
|
||||
<th scope="col">Friday</th>
|
||||
<th scope="col">Saturday</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody id="calenderTableBody">
|
||||
<tr>
|
||||
<td class="cal-hour" rowspan="4">07:00</td>
|
||||
<td class="cal-hour"></td>
|
||||
<td class="cal-hour"></td>
|
||||
<td class="cal-hour"></td>
|
||||
<td class="cal-hour"></td>
|
||||
<td class="cal-hour"></td>
|
||||
<td class="cal-hour"></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td></td>
|
||||
<td></td>
|
||||
<td></td>
|
||||
<td></td>
|
||||
<td></td>
|
||||
<td></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td></td>
|
||||
<td></td>
|
||||
<td class="table-primary occupancy" rowspan="20">07:30 - 12:30</td>
|
||||
<td class="table-primary occupancy" rowspan="6">07:30 - 09:00</td>
|
||||
<td></td>
|
||||
<td></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td></td>
|
||||
<td></td>
|
||||
<td></td>
|
||||
<td></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="cal-hour" rowspan="4">08:00</td>
|
||||
<td class="cal-hour"></td>
|
||||
<td class="cal-hour"></td>
|
||||
<td class="cal-hour"></td>
|
||||
<td class="cal-hour"></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td></td>
|
||||
<td></td>
|
||||
<td></td>
|
||||
<td></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td></td>
|
||||
<td></td>
|
||||
<td></td>
|
||||
<td></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td></td>
|
||||
<td></td>
|
||||
<td></td>
|
||||
<td></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="cal-hour" rowspan="4">09:00</td>
|
||||
<td class="cal-hour"></td>
|
||||
<td class="cal-hour"></td>
|
||||
<td class="cal-hour"></td>
|
||||
<td class="cal-hour"></td>
|
||||
<td class="cal-hour"></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td></td>
|
||||
<td></td>
|
||||
<td></td>
|
||||
<td></td>
|
||||
<td></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="table-primary occupancy" rowspan="6">09:30 - 11:00</td>
|
||||
<td class="table-primary occupancy" rowspan="6">09:30 - 11:00</td>
|
||||
<td class="table-primary occupancy" rowspan="6">09:30 - 11:00</td>
|
||||
<td class="table-primary occupancy" rowspan="6">09:30 - 11:00</td>
|
||||
<td></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="cal-hour" rowspan="4">10:00</td>
|
||||
<td class="cal-hour"></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="cal-hour" rowspan="4">11:00</td>
|
||||
<td class="cal-hour"></td>
|
||||
<td class="cal-hour"></td>
|
||||
<td class="cal-hour"></td>
|
||||
<td class="cal-hour"></td>
|
||||
<td class="cal-hour"></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="table-primary occupancy" rowspan="6">11:15 - 12:45</td>
|
||||
<td class="table-primary occupancy" rowspan="6">11:15 - 12:45</td>
|
||||
<td></td>
|
||||
<td></td>
|
||||
<td></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td></td>
|
||||
<td></td>
|
||||
<td></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td></td>
|
||||
<td></td>
|
||||
<td></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="cal-hour" rowspan="4">12:00</td>
|
||||
<td class="cal-hour table-primary occupancy" rowspan="13">12:00 - 15:15</td>
|
||||
<td class="cal-hour"></td>
|
||||
<td class="cal-hour"></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td></td>
|
||||
<td></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td></td>
|
||||
<td></td>
|
||||
<td></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td></td>
|
||||
<td></td>
|
||||
<td></td>
|
||||
<td></td>
|
||||
<td></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="cal-hour" rowspan="4">13:00</td>
|
||||
<td class="cal-hour"></td>
|
||||
<td class="cal-hour"></td>
|
||||
<td class="cal-hour"></td>
|
||||
<td class="cal-hour"></td>
|
||||
<td class="cal-hour"></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td></td>
|
||||
<td></td>
|
||||
<td></td>
|
||||
<td></td>
|
||||
<td></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td></td>
|
||||
<td></td>
|
||||
<td></td>
|
||||
<td></td>
|
||||
<td></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td></td>
|
||||
<td class="table-primary occupancy" rowspan="6">13:45 - 15:15</td>
|
||||
<td></td>
|
||||
<td></td>
|
||||
<td></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="cal-hour" rowspan="4">14:00</td>
|
||||
<td class="cal-hour"></td>
|
||||
<td class="cal-hour"></td>
|
||||
<td class="cal-hour"></td>
|
||||
<td class="cal-hour"></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td></td>
|
||||
<td></td>
|
||||
<td></td>
|
||||
<td></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td></td>
|
||||
<td></td>
|
||||
<td></td>
|
||||
<td></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td></td>
|
||||
<td></td>
|
||||
<td></td>
|
||||
<td></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="cal-hour" rowspan="4">15:00</td>
|
||||
<td class="cal-hour"></td>
|
||||
<td class="cal-hour"></td>
|
||||
<td class="cal-hour"></td>
|
||||
<td class="cal-hour"></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td></td>
|
||||
<td></td>
|
||||
<td></td>
|
||||
<td></td>
|
||||
<td></td>
|
||||
<td></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td></td>
|
||||
<td class="table-primary occupancy" rowspan="6">15:30 - 17:00</td>
|
||||
<td></td>
|
||||
<td class="table-primary occupancy" rowspan="6">15:30 - 17:00</td>
|
||||
<td class="table-primary occupancy" rowspan="6">15:30 - 17:00</td>
|
||||
<td></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td></td>
|
||||
<td></td>
|
||||
<td></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="cal-hour" rowspan="4">16:00</td>
|
||||
<td class="cal-hour"></td>
|
||||
<td class="cal-hour"></td>
|
||||
<td class="cal-hour"></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td></td>
|
||||
<td></td>
|
||||
<td></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td></td>
|
||||
<td></td>
|
||||
<td></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td></td>
|
||||
<td></td>
|
||||
<td></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="cal-hour" rowspan="4">17:00</td>
|
||||
<td class="cal-hour"></td>
|
||||
<td class="cal-hour"></td>
|
||||
<td class="cal-hour"></td>
|
||||
<td class="cal-hour"></td>
|
||||
<td class="cal-hour"></td>
|
||||
<td class="cal-hour"></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="table-primary occupancy" rowspan="6">17:15 - 18:45</td>
|
||||
<td></td>
|
||||
<td></td>
|
||||
<td></td>
|
||||
<td></td>
|
||||
<td></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td></td>
|
||||
<td></td>
|
||||
<td></td>
|
||||
<td></td>
|
||||
<td></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td></td>
|
||||
<td></td>
|
||||
<td></td>
|
||||
<td></td>
|
||||
<td></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="cal-hour" rowspan="4">18:00</td>
|
||||
<td class="cal-hour"></td>
|
||||
<td class="cal-hour"></td>
|
||||
<td class="cal-hour"></td>
|
||||
<td class="cal-hour"></td>
|
||||
<td class="cal-hour"></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td></td>
|
||||
<td></td>
|
||||
<td></td>
|
||||
<td></td>
|
||||
<td></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td></td>
|
||||
<td></td>
|
||||
<td></td>
|
||||
<td></td>
|
||||
<td></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td></td>
|
||||
<td></td>
|
||||
<td></td>
|
||||
<td></td>
|
||||
<td></td>
|
||||
<td></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="cal-hour" rowspan="4">19:00</td>
|
||||
<td class="cal-hour"></td>
|
||||
<td class="cal-hour"></td>
|
||||
<td class="cal-hour"></td>
|
||||
<td class="cal-hour"></td>
|
||||
<td class="cal-hour"></td>
|
||||
<td class="cal-hour"></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td></td>
|
||||
<td></td>
|
||||
<td></td>
|
||||
<td></td>
|
||||
<td></td>
|
||||
<td></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td></td>
|
||||
<td></td>
|
||||
<td></td>
|
||||
<td></td>
|
||||
<td></td>
|
||||
<td></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td></td>
|
||||
<td></td>
|
||||
<td></td>
|
||||
<td></td>
|
||||
<td></td>
|
||||
<td></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="cal-hour" rowspan="4">20:00</td>
|
||||
<td class="cal-hour"></td>
|
||||
<td class="cal-hour"></td>
|
||||
<td class="cal-hour"></td>
|
||||
<td class="cal-hour"></td>
|
||||
<td class="cal-hour"></td>
|
||||
<td class="cal-hour"></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td></td>
|
||||
<td></td>
|
||||
<td></td>
|
||||
<td></td>
|
||||
<td></td>
|
||||
<td></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td></td>
|
||||
<td></td>
|
||||
<td></td>
|
||||
<td></td>
|
||||
<td></td>
|
||||
<td></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td></td>
|
||||
<td></td>
|
||||
<td></td>
|
||||
<td></td>
|
||||
<td></td>
|
||||
<td></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
|
||||
</template>
|
||||
|
||||
<style scoped>
|
||||
.cal-hour {
|
||||
border-top: 1px solid #dee2e6;
|
||||
}
|
||||
|
||||
.occupancy{
|
||||
background-color: #8fa0e2 !important;
|
||||
}
|
||||
</style>
|
||||
16
frontend/src/model/event.ts
Normal file
16
frontend/src/model/event.ts
Normal file
@@ -0,0 +1,16 @@
|
||||
export class Event {
|
||||
constructor(
|
||||
public Days: string,
|
||||
public Week: string,
|
||||
public Start: string,
|
||||
public End: string,
|
||||
public Name: string,
|
||||
public EventType: string,
|
||||
public Prof: string,
|
||||
public Rooms: string,
|
||||
public Notes: string,
|
||||
public BookedAt: string,
|
||||
public Course: string,
|
||||
public Semester: string,
|
||||
) {}
|
||||
}
|
||||
@@ -6,6 +6,7 @@ import CalendarLink from "../components/CalendarLink.vue";
|
||||
import Impress from "../components/Imprint.vue";
|
||||
import PrivacyPolicy from "../components/PrivacyPolicy.vue";
|
||||
import RenameModules from "../components/RenameModules.vue";
|
||||
import RoomFinder from "../components/RoomFinder.vue";
|
||||
|
||||
const router = createRouter({
|
||||
history: createWebHistory(import.meta.env.BASE_URL),
|
||||
@@ -15,6 +16,11 @@ const router = createRouter({
|
||||
name: "course-selection",
|
||||
component: CourseSelection,
|
||||
},
|
||||
{
|
||||
path: "/rooms",
|
||||
name: "room-finder",
|
||||
component: RoomFinder,
|
||||
},
|
||||
{
|
||||
path: "/faq",
|
||||
name: "faq",
|
||||
|
||||
Reference in New Issue
Block a user