CalendarAssistant.day_data

This commit is contained in:
Jörn-Michael Miehe 2023-09-21 00:19:44 +00:00
parent e83f56a932
commit 24e9c93eef

View file

@ -4,14 +4,16 @@
<BulmaDrawer header="Kalender-Assistent" @open="on_open" refreshable> <BulmaDrawer header="Kalender-Assistent" @open="on_open" refreshable>
<div class="card-content"> <div class="card-content">
<div class="content"> <div class="content">
<p>Hervorgehobenen Tagen wurde kein Buchstabe zugewiesen.</p>
<h4>Zuordnung Buchstaben</h4> <h4>Zuordnung Buchstaben</h4>
<div class="tags are-medium"> <div class="tags are-medium">
<template <template v-for="(data, day) in day_data" :key="`part-${day}`">
v-for="(day_part, index) in day_parts" <span v-if="data.part === ''" class="tag is-warning">
:key="`part-${index}`" {{ day }}
> </span>
<span v-if="day_part.value !== ''" class="tag is-info"> <span v-else class="tag is-info">
{{ day_part.day }}: {{ day_part.value.split("").join(", ") }} {{ day }}: {{ data.part.split("").join(", ") }}
</span> </span>
</template> </template>
</div> </div>
@ -19,23 +21,23 @@
<h4>Zuordnung Bilder</h4> <h4>Zuordnung Bilder</h4>
<div class="tags are-medium"> <div class="tags are-medium">
<span <span
v-for="(day_part, index) in day_image_names" v-for="(data, day) in day_data"
:key="`part-${index}`" :key="`image-${day}`"
class="tag is-primary" :class="'tag is-' + (data.part === '' ? 'warning' : 'primary')"
> >
{{ day_part.day }}: {{ day_part.value }} {{ day }}: {{ data.image_name }}
</span> </span>
</div> </div>
<h4>Alle Türchen</h4> <h4>Alle Türchen</h4>
<div class="tags are-medium"> <div class="tags are-medium">
<BulmaButton <BulmaButton
v-for="(day_part, index) in day_parts" v-for="(data, day) in day_data"
:key="`btn-${index}`" :key="`btn-${day}`"
class="tag is-info" :class="'tag is-' + (data.part === '' ? 'warning' : 'info')"
icon="fa-solid fa-door-open" icon="fa-solid fa-door-open"
:text="`${day_part.day}`" :text="day"
@click.left="door_click(day_part.day)" @click.left="door_click(day)"
/> />
</div> </div>
</div> </div>
@ -59,8 +61,13 @@ import BulmaDrawer from "../bulma/Drawer.vue";
}, },
}) })
export default class extends Vue { export default class extends Vue {
public day_parts: DayStrModel[] = []; public day_data: {
public day_image_names: DayStrModel[] = []; [day: number]: {
part: string;
image_name: string;
};
} = {};
private multi_modal?: MultiModal; private multi_modal?: MultiModal;
public modal_handle(modal: MultiModal) { public modal_handle(modal: MultiModal) {
@ -73,8 +80,21 @@ export default class extends Vue {
this.$advent22.api_get<DayStrModel[]>("admin/day_image_names"), this.$advent22.api_get<DayStrModel[]>("admin/day_image_names"),
]) ])
.then(([day_parts, day_image_names]) => { .then(([day_parts, day_image_names]) => {
this.day_parts = day_parts; const _ensure_day = (day: number) => {
this.day_image_names = day_image_names; if (!(day in this.day_data)) {
this.day_data[day] = { part: "", image_name: "" };
}
};
for (const day_part of day_parts) {
_ensure_day(day_part.day);
this.day_data[day_part.day].part = day_part.value;
}
for (const day_part of day_image_names) {
_ensure_day(day_part.day);
this.day_data[day_part.day].image_name = day_part.value;
}
ready(); ready();
}) })