mirror of
https://gitlab.dit.htwk-leipzig.de/htwk-software/htwkalender.git
synced 2025-07-24 21:39:14 +02:00
[#10] Add page to check for room availability
This commit is contained in:
Tom Wahl
@@ -38,30 +38,15 @@ func GetRooms(app *pocketbase.PocketBase) []string {
|
|||||||
return roomArray
|
return roomArray
|
||||||
}
|
}
|
||||||
|
|
||||||
func GetRoomScheduleForDay(app *pocketbase.PocketBase, room string, date string) []model.Event {
|
|
||||||
var events []model.Event
|
|
||||||
|
|
||||||
// get all events from event records in the events collection
|
|
||||||
err := app.Dao().DB().Select("*").From("events").
|
|
||||||
Where(dbx.Like("Rooms", room)).
|
|
||||||
AndWhere(dbx.Like("Start", date)).
|
|
||||||
GroupBy("Start", "End", "Rooms").All(&events)
|
|
||||||
if err != nil {
|
|
||||||
print("Error while getting events from database: ", err)
|
|
||||||
return nil
|
|
||||||
}
|
|
||||||
return events
|
|
||||||
}
|
|
||||||
|
|
||||||
func GetRoomSchedule(app *pocketbase.PocketBase, room string, from string, to string) []model.Event {
|
func GetRoomSchedule(app *pocketbase.PocketBase, room string, from string, to string) []model.Event {
|
||||||
var events []model.Event
|
var events []model.Event
|
||||||
|
|
||||||
fromDate, err := time.Parse("2000-01-02", from)
|
fromDate, err := time.Parse("2006-01-02", from)
|
||||||
if err != nil {
|
if err != nil {
|
||||||
fmt.Println("Error parsing date 'from':", err)
|
fmt.Println("Error parsing date 'from':", err)
|
||||||
return nil
|
return nil
|
||||||
}
|
}
|
||||||
toDate, err := time.Parse("2000-01-02", to)
|
toDate, err := time.Parse("2006-01-02", to)
|
||||||
if err != nil {
|
if err != nil {
|
||||||
fmt.Println("Error parsing date 'to':", err)
|
fmt.Println("Error parsing date 'to':", err)
|
||||||
return nil
|
return nil
|
||||||
|
|||||||
@@ -17,40 +17,20 @@ export async function fetchEventsByRoomAndDuration(
|
|||||||
from_date: string,
|
from_date: string,
|
||||||
to_date: string,
|
to_date: string,
|
||||||
): Promise<Event[]> {
|
): Promise<Event[]> {
|
||||||
const occupations: 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);
|
||||||
eventsResponse.forEach((event: Event) =>
|
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)),
|
events.push(event));
|
||||||
);
|
|
||||||
}).catch((error) => {
|
}).catch((error) => {
|
||||||
console.log("Error fetching events: ", error);
|
console.log("Error fetching events: ", error);
|
||||||
return null;
|
return null;
|
||||||
})
|
})
|
||||||
return occupations;
|
console.log("occupations: ", events);
|
||||||
}
|
return events;
|
||||||
|
|
||||||
export async function fetchEventsByRoomAndDay(
|
|
||||||
room: string,
|
|
||||||
date: string,
|
|
||||||
): Promise<Event[]> {
|
|
||||||
const occupations: Event[] = [];
|
|
||||||
await fetch("/api/schedule/day?room=" + room + "&sdate=" + date)
|
|
||||||
.then((response) => {
|
|
||||||
console.log(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)),
|
|
||||||
);
|
|
||||||
}).catch((error) => {
|
|
||||||
console.log("Error fetching events: ", error);
|
|
||||||
return null;
|
|
||||||
})
|
|
||||||
return occupations;
|
|
||||||
}
|
}
|
||||||
@@ -12,6 +12,11 @@ const items = ref([
|
|||||||
icon: "pi pi-fw pi-pencil",
|
icon: "pi pi-fw pi-pencil",
|
||||||
url: "/edit",
|
url: "/edit",
|
||||||
},
|
},
|
||||||
|
{
|
||||||
|
label: "Check Room Availability",
|
||||||
|
icon: "pi pi-fw pi-calendar",
|
||||||
|
url: "/rooms",
|
||||||
|
},
|
||||||
{
|
{
|
||||||
label: "FAQ",
|
label: "FAQ",
|
||||||
icon: "pi pi-fw pi-book",
|
icon: "pi pi-fw pi-book",
|
||||||
|
|||||||
@@ -41,6 +41,10 @@ rooms().then(
|
|||||||
placeholder="Select a Room"
|
placeholder="Select a Room"
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
|
<div
|
||||||
|
class="m-6"
|
||||||
|
>
|
||||||
<RoomOccupation :room="selectedRoom.name"/>
|
<RoomOccupation :room="selectedRoom.name"/>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|||||||
@@ -5,6 +5,7 @@ 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";
|
||||||
|
|
||||||
const props = defineProps({
|
const props = defineProps({
|
||||||
room: {
|
room: {
|
||||||
@@ -25,9 +26,8 @@ const occupations: Ref<CalenderEvent[]> = ref([]);
|
|||||||
|
|
||||||
const selectedRoom = computed(() => props.room);
|
const selectedRoom = computed(() => props.room);
|
||||||
|
|
||||||
watch(selectedRoom, (newValue: string) => {
|
watch(selectedRoom, (_newValue: string) => {
|
||||||
getOccupation();
|
getOccupation();
|
||||||
console.log("change room: " + newValue);
|
|
||||||
});
|
});
|
||||||
|
|
||||||
const fullCalendar = ref<InstanceType<typeof FullCalendar>>()
|
const fullCalendar = ref<InstanceType<typeof FullCalendar>>()
|
||||||
@@ -36,87 +36,34 @@ async function getOccupation() {
|
|||||||
if (selectedRoom.value === "") {
|
if (selectedRoom.value === "") {
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
console.log("fetching events", selectedRoom.value, currentDateFrom.value, currentDateTo.value);
|
const events = await fetchEventsByRoomAndDuration(
|
||||||
/*occupations.value = await fetchEventsByRoomAndDuration(
|
|
||||||
selectedRoom.value,
|
selectedRoom.value,
|
||||||
currentDateFrom.value,
|
currentDateFrom.value,
|
||||||
currentDateTo.value
|
currentDateTo.value
|
||||||
);*/
|
);
|
||||||
|
occupations.value = events.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 events: Ref<{ id: number; 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')
|
|
||||||
};
|
|
||||||
}),
|
|
||||||
);*/
|
|
||||||
let calendar = fullCalendar.value?.getApi()
|
let calendar = fullCalendar.value?.getApi()
|
||||||
calendar?.refetchEvents()
|
calendar?.refetchEvents()
|
||||||
console.log("events: ", calendar?.getEvents())
|
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
function getEvents(){
|
|
||||||
const mock = [
|
|
||||||
{
|
|
||||||
"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-16T07:30:00",
|
|
||||||
"end": "2023-10-16T9:00:00"
|
|
||||||
},
|
|
||||||
{
|
|
||||||
"id": 4,
|
|
||||||
"start": "2023-10-20T15:30:00",
|
|
||||||
"end": "2023-10-20T17:00:00"
|
|
||||||
},
|
|
||||||
{
|
|
||||||
"id": 5,
|
|
||||||
"start": "2023-10-16T17:15:00",
|
|
||||||
"end": "2023-10-16T18:45:00"
|
|
||||||
}]
|
|
||||||
console.log(currentDateFrom.value, currentDateTo.value)
|
|
||||||
const events = mock.map((event) => {
|
|
||||||
const randomInt = Math.floor(Math.random() * 2);
|
|
||||||
if (randomInt)
|
|
||||||
return {
|
|
||||||
id: event.id,
|
|
||||||
start: currentDateFrom.value + event.start.substring(10, event.start.length),
|
|
||||||
end: currentDateFrom.value + event.end.substring(10, event.end.length),
|
|
||||||
};
|
|
||||||
else
|
|
||||||
return {
|
|
||||||
id: event.id,
|
|
||||||
start: currentDateTo.value + event.start.substring(10, event.start.length),
|
|
||||||
end: currentDateTo.value + event.end.substring(10, event.end.length),
|
|
||||||
};
|
|
||||||
});
|
|
||||||
console.log("generated events: ", events)
|
|
||||||
return events;
|
|
||||||
}
|
|
||||||
|
|
||||||
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: {
|
||||||
|
hour: "2-digit",
|
||||||
|
minute: "2-digit",
|
||||||
|
hour12: false
|
||||||
|
},
|
||||||
views: {
|
views: {
|
||||||
week: {
|
week: {
|
||||||
type: 'timeGrid',
|
type: 'timeGrid',
|
||||||
@@ -124,7 +71,8 @@ function getEvents(){
|
|||||||
hour: 'numeric',
|
hour: 'numeric',
|
||||||
minute: '2-digit',
|
minute: '2-digit',
|
||||||
omitZeroMinute: false,
|
omitZeroMinute: false,
|
||||||
meridiem: false
|
meridiem: false,
|
||||||
|
hour12: false
|
||||||
},
|
},
|
||||||
dateAlignment: "week",
|
dateAlignment: "week",
|
||||||
titleFormat: {month: 'short', day: 'numeric'},
|
titleFormat: {month: 'short', day: 'numeric'},
|
||||||
@@ -142,7 +90,8 @@ function getEvents(){
|
|||||||
hour: 'numeric',
|
hour: 'numeric',
|
||||||
minute: '2-digit',
|
minute: '2-digit',
|
||||||
omitZeroMinute: false,
|
omitZeroMinute: false,
|
||||||
meridiem: false
|
meridiem: false,
|
||||||
|
hour12: false
|
||||||
},
|
},
|
||||||
titleFormat: {month: 'short', day: 'numeric'},
|
titleFormat: {month: 'short', day: 'numeric'},
|
||||||
slotMinTime: "06:00:00",
|
slotMinTime: "06:00:00",
|
||||||
@@ -157,28 +106,30 @@ function getEvents(){
|
|||||||
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 startDate = view.activeStart;
|
const offset = (new Date()).getTimezoneOffset();
|
||||||
const endDate = view.activeEnd;
|
const startDate = new Date(view.activeStart.getTime() - (offset*60*1000));
|
||||||
endDate.setDate(endDate.getDate() - 1);
|
const endDate = new Date(view.activeEnd.getTime() - (offset*60*1000));
|
||||||
currentDateFrom.value = startDate.getFullYear() + "-" + (startDate.getMonth() + 1) + "-" + startDate.getDate();
|
currentDateFrom.value = startDate.toISOString().split('T')[0]
|
||||||
currentDateTo.value = endDate.getFullYear() + "-" + (endDate.getMonth() + 1) + "-" + endDate.getDate();
|
currentDateTo.value = endDate.toISOString().split('T')[0]
|
||||||
getOccupation();
|
getOccupation();
|
||||||
},
|
},
|
||||||
events: function(_info, successCallback, failureCallback) {
|
events: function(_info, successCallback, failureCallback) {
|
||||||
if (!getEvents()){
|
if (occupations.value.length === 0){
|
||||||
failureCallback(new Error("no events"))
|
failureCallback(new Error("no events"))
|
||||||
|
}else{
|
||||||
|
successCallback(
|
||||||
|
occupations.value.map((event) => {
|
||||||
|
return {
|
||||||
|
id: event.id.toString(),
|
||||||
|
start: event.start,
|
||||||
|
end: event.end,
|
||||||
|
} as EventInput;
|
||||||
|
})
|
||||||
|
)
|
||||||
}
|
}
|
||||||
successCallback(
|
|
||||||
getEvents().map((event) => {
|
|
||||||
return {
|
|
||||||
id: event.id.toString(),
|
|
||||||
start: event.start,
|
|
||||||
end: event.end,
|
|
||||||
} as EventInput;
|
|
||||||
})
|
|
||||||
)
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
@@ -1,404 +0,0 @@
|
|||||||
<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>
|
|
||||||
Reference in New Issue
Block a user