♻️ Refactor frontend code

This commit is contained in:
2022-08-21 23:10:21 +02:00
parent 9e9cf8618d
commit 1439bfb056
8 changed files with 37 additions and 21 deletions

View File

@ -12,11 +12,14 @@ import { getSubstitutionColor } from "../util";
import { computed } from "vue";
import TimetableSetup from "../components/initial-setup.vue";
// Link the timetable with the substitutions
const linkedTimetable = computed(() => {
const currentDay = parsedTimetable.value[selectedDay.value];
if (!currentDay) return [];
const newDay = currentDay.map((e, index) => {
const newElement = { ...e };
// Find a substitution mathing this lesson
newElement.substitution = substitutions.value.find((entry) => {
const entryDay = new Date(entry.date).getTime();
return (
@ -32,16 +35,14 @@ const linkedTimetable = computed(() => {
function isChanged(lesson, key) {
const substitution = lesson.substitution;
if (!substitution) return false;
if (!substitution.change) return false;
if (!(substitution && substitution.change)) return false;
const changedKeys = Object.keys(substitution.change);
if (!changedKeys.includes(key)) return false;
return lesson[key] != substitution.change[key];
}
function getNotes(substitution) {
if (!substitution) return;
if (!substitution.notes) return;
if (!(substitution && substitution.notes)) return;
return substitution.notes;
}
@ -52,7 +53,7 @@ function isCancelled(substitution) {
</script>
<template>
<TimetableSetup
v-show="!classFilter || classFilter == 'none'"
v-show="classFilter == 'none'"
:options="classList"
v-model="classFilter"
/>
@ -113,8 +114,8 @@ function isCancelled(substitution) {
justify-content: center;
}
.trust-warning {
border: 1px solid #b71c1c;
background-color: #412727;
border: 1px solid var(--timetable-trust-warning-border);
background-color: var(--timetable-trust-warning-background);
border-radius: 4px;
padding: 3px 10px;
margin-top: 10px;
@ -127,7 +128,7 @@ function isCancelled(substitution) {
min-height: 50px;
border-radius: 11px;
margin: 10px 0px;
padding: 15px 15px;
padding: 15px;
grid-template-columns: max-content auto;
gap: 15px;
}