minie4/Timetable-V2
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

✨ Implement timetable editing

Browse Source
This commit is contained in:
minie4
2023-06-18 23:43:08 +02:00
parent 46b235ba91
commit 4d4a92bff3
10 changed files with 532 additions and 49 deletions
Download Patch File Download Diff File Expand all files Collapse all files

83
src/views/settings/TimetableSettings.vue
View File

@ -1,6 +1,7 @@
<script setup>
import TimetableCard from "@/components/settings/timetable-card.vue";
import { timetables, localTimetables, timetableId } from "@/store";
import { PlusIcon } from "lucide-vue-next";
import { toRaw } from "vue";
function copyTimetable(timetable) {
@ -9,39 +10,54 @@ function copyTimetable(timetable) {
newTimetable.id = new Date().getTime();
localTimetables.value.push(newTimetable);
}
function createTimetable() {
localTimetables.value.push({
id: new Date().getTime(),
title: "New timetable",
data: [],
});
}
</script>
<template>
<h2>{{ $t("settings.heading.localTimetables") }}</h2>
<div class="list">
<TimetableCard
v-for="timetable in localTimetables"
:key="timetable.id"
:timetable="timetable"
:selected="timetableId == timetable.id"
:editable="true"
@click="timetableId = timetable.id"
@copy="copyTimetable(timetable)"
@delete="
localTimetables.splice(
localTimetables.findIndex((e) => e.id == timetable.id),
1
)
"
/>
</div>
<h2>{{ $t("settings.heading.remoteTimetables") }}</h2>
<div class="list">
<TimetableCard
v-for="timetable in timetables"
:key="timetable.id"
:timetable="timetable"
:selected="timetableId == timetable.id"
:editable="false"
@click="timetableId = timetable.id"
@copy="copyTimetable(timetable)"
/>
<div class="content" v-if="$route.name == 'title.settings.timetable'">
<h2>{{ $t("settings.heading.localTimetables") }}</h2>
<div class="list">
<TimetableCard
v-for="timetable in localTimetables"
:key="timetable.id"
:timetable="timetable"
:selected="timetableId == timetable.id"
:editable="true"
@click="timetableId = timetable.id"
@edit="$router.push('timetable/edit/' + timetable.id)"
@copy="copyTimetable(timetable)"
@delete="
localTimetables.splice(
localTimetables.findIndex((e) => e.id == timetable.id),
1
)
"
/>
</div>
<div class="create" @click="createTimetable">
<PlusIcon /> {{ $t("settings.text.createTimetable") }}
</div>
<h2>{{ $t("settings.heading.remoteTimetables") }}</h2>
<div class="list">
<TimetableCard
v-for="timetable in timetables"
:key="timetable.id"
:timetable="timetable"
:selected="timetableId == timetable.id"
:editable="false"
@click="timetableId = timetable.id"
@copy="copyTimetable(timetable)"
/>
</div>
</div>
<RouterView v-else />
</template>
<style scoped>
@ -57,4 +73,13 @@ p {
display: grid;
gap: 8px;
}
.create {
display: flex;
justify-content: center;
align-items: center;
margin-top: 5px;
padding: 10px;
cursor: pointer;
}
</style>