This commit is contained in:
team3 committed 2026-10-09 22:14:01 +02:00
1 parent 5e34cb4406
commit 0ab3d53023
3 files changed
+335 -226

No files matched your search

+96 -72
View File
@@ -236,70 +236,72 @@ async function entfernen(user) {
<p v-else class="leer">Noch niemand in der Runde.</p>
</section>
<section v-if="host" class="einladung">
<h3>Einladung</h3>
<p class="erklaerung">
Eine Karte zum Verschicken: Datum, Ort, der gezogene Film. Als Bild fürs Handy.
</p>
<button type="button" class="klein" @click="einladung = true">Einladung erstellen</button>
</section>
<Einladung v-if="einladung" @zu="einladung = false" />
<div v-if="host" class="rechts">
<section class="einladung">
<h3>Einladung</h3>
<p class="erklaerung">
Eine Karte zum Verschicken: Datum, Genre, Discord, Webseite. Als Bild fürs Handy.
</p>
<button type="button" class="klein" @click="einladung = true">Einladung erstellen</button>
</section>
<Einladung v-if="einladung" @zu="einladung = false" />
<section v-if="host" class="hostfilm">
<h3>Host-Film</h3>
<p class="erklaerung">
Die Tastenkombination fragt ohne Freischaltung nach diesem Film. Wer ihn anklickt, ist Host
— ohne Link.
</p>
<div class="zeile">
<button type="button" class="klein" @click="hostFilmDialog = true">Film setzen</button>
<button type="button" class="klein" title="Anzeigen" @click="hostFilmZeigen">👁</button>
<button type="button" class="klein" @click="hostFilmSetzen(null)">Aufheben</button>
<span v-if="hostFilm" class="film-anzeige">
<template v-if="hostFilm.laden">…</template>
<template v-else-if="hostFilm.fehler">nicht lesbar</template>
<template v-else-if="hostFilm.film"
>{{ hostFilm.film.title }} ({{ hostFilm.film.year }})</template
>
<template v-else>keiner gesetzt</template>
</span>
</div>
</section>
<section class="hostfilm">
<h3>Host-Film</h3>
<p class="erklaerung">
Die Tastenkombination fragt ohne Freischaltung nach diesem Film. Wer ihn anklickt, ist
Host — ohne Link.
</p>
<div class="zeile">
<button type="button" class="klein" @click="hostFilmDialog = true">Film setzen</button>
<button type="button" class="klein" title="Anzeigen" @click="hostFilmZeigen">👁</button>
<button type="button" class="klein" @click="hostFilmSetzen(null)">Aufheben</button>
<span v-if="hostFilm" class="film-anzeige">
<template v-if="hostFilm.laden">…</template>
<template v-else-if="hostFilm.fehler">nicht lesbar</template>
<template v-else-if="hostFilm.film"
>{{ hostFilm.film.title }} ({{ hostFilm.film.year }})</template
>
<template v-else>keiner gesetzt</template>
</span>
</div>
</section>
<section v-if="host" class="aufnahmen">
<h3>Aufnahmen</h3>
<p v-if="aufnahmenFehler" class="fehler">{{ aufnahmenFehler }}</p>
<p v-if="aufnahmen === null" class="leer">Suche Aufnahmen …</p>
<p v-else-if="!aufnahmen.length" class="leer">Keine Aufnahmen.</p>
<ul v-else>
<li v-for="s in aufnahmen" :key="s.start" class="zeile">
<span>
{{ aufnahmeText(s) }} ·
<strong v-if="s.film">{{ s.film.title }}</strong>
<em v-else>kein Film</em>
</span>
<span class="knoepfe">
<button type="button" class="klein" @click="filmDialogFuer = s.start">Film</button>
<button
v-if="s.zugewiesen"
type="button"
class="klein"
@click="filmZuweisen(s.start, null)"
>
Aufheben
</button>
<button
type="button"
class="klein"
:class="{ warnung: loeschFrage === s.start }"
@click="aufnahmeLoeschen(s)"
>
{{ loeschFrage === s.start ? 'Wirklich löschen?' : 'Löschen' }}
</button>
</span>
</li>
</ul>
</section>
<section class="aufnahmen">
<h3>Aufnahmen</h3>
<p v-if="aufnahmenFehler" class="fehler">{{ aufnahmenFehler }}</p>
<p v-if="aufnahmen === null" class="leer">Suche Aufnahmen …</p>
<p v-else-if="!aufnahmen.length" class="leer">Keine Aufnahmen.</p>
<ul v-else>
<li v-for="s in aufnahmen" :key="s.start" class="zeile">
<span>
{{ aufnahmeText(s) }} ·
<strong v-if="s.film">{{ s.film.title }}</strong>
<em v-else>kein Film</em>
</span>
<span class="knoepfe">
<button type="button" class="klein" @click="filmDialogFuer = s.start">Film</button>
<button
v-if="s.zugewiesen"
type="button"
class="klein"
@click="filmZuweisen(s.start, null)"
>
Aufheben
</button>
<button
type="button"
class="klein"
:class="{ warnung: loeschFrage === s.start }"
@click="aufnahmeLoeschen(s)"
>
{{ loeschFrage === s.start ? 'Wirklich löschen?' : 'Löschen' }}
</button>
</span>
</li>
</ul>
</section>
</div>
<Teleport to="body">
<div v-if="filmDialogFuer" class="hintergrund" @click.self="filmDialogFuer = null">
@@ -361,7 +363,28 @@ async function entfernen(user) {
<style scoped>
.verwaltung-tab {
max-width: 34rem;
display: grid;
grid-template-columns: minmax(0, 1fr);
gap: 2.5rem 3.5rem;
align-items: start;
max-width: 72rem;
}
/* Mit Host-Rechten: Benutzer links, der Rest rechts */
.verwaltung-tab:has(.rechts) {
grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
}
.rechts {
display: flex;
flex-direction: column;
gap: 2.5rem;
}
@media (max-width: 900px) {
.verwaltung-tab:has(.rechts) {
grid-template-columns: minmax(0, 1fr);
}
}
h3 {
@@ -399,20 +422,21 @@ h3 {
}
.liste {
display: flex;
flex-direction: column;
gap: 0.3rem;
list-style: none;
background: var(--bg-soft);
border: 1px solid var(--line);
border-radius: 8px;
}
.liste li {
display: flex;
flex-direction: column;
gap: 0.5rem;
padding: 0.55rem 0.85rem;
background: var(--bg-soft);
border: 1px solid var(--line);
border-radius: 8px;
gap: 0.4rem;
padding: 0.4rem 0.7rem;
}
.liste li + li {
border-top: 1px solid var(--line);
}
.zeile {
@@ -491,7 +515,7 @@ h3 {
}
.erklaerung {
margin-bottom: 1rem;
margin-bottom: 0.8rem;
line-height: 1.5;
}