fix [front]: admin one-node page

This commit is contained in:
Alice 2022-08-27 16:53:52 +02:00
parent c12d6543c7
commit 95df86ef60
4 changed files with 86 additions and 77 deletions

View file

@ -1,6 +1,8 @@
<template>
<h1 class="title">Modifier la séance du {{ film.projectionDate }}</h1>
<AdminForm v-model="film" @save="saveDraft" @publish="publish" />
<main>
<h1 class="title">Modifier la séance du {{ film.projectionDate }}</h1>
<AdminForm v-model="film" @save="saveDraft" @publish="publish" />
</main>
</template>
<script setup lang="ts">
@ -15,6 +17,7 @@ const id = route.params.id
const film = reactive<Film>({})
Object.assign(film, (await apiGet(`admin/films/${id}/`)).data.value)
// TODO manage errors
async function save(publish: boolean) {

View file

@ -1,69 +1,71 @@
<template>
<div class="title is-2">
<div class="tag is-large">
{{ film.isConfirmed ? "Publié" : "Brouillon" }}
<main>
<div class="title is-2">
<div class="tag is-large">
{{ film.isConfirmed ? "Publié" : "Brouillon" }}
</div>
<h1 class="mx-5">
{{ film.projectionDate || "À planifier" }} - {{ film.title }}
<span class="has-text-grey-lighter">#{{ film.id }}</span>
</h1>
<nuxt-link :to="`/admin/${id}/edition`" class="button">
<span>Éditer</span>
</nuxt-link>
</div>
<h1 class="mx-5">
{{ film.projectionDate || "À planifier" }} - {{ film.title }}
<span class="has-text-grey-lighter">#{{ film.id }}</span>
</h1>
<nuxt-link :to="`/admin/${id}/edition`" class="button">
<span>Éditer</span>
</nuxt-link>
</div>
<div class="field is-grouped is-grouped-multiline">
<div v-for="(tag, index) of tags" :key="index" class="control">
<div class="tags has-addons are-medium">
<span v-if="tag.label" class="tag">{{ tag.label }}</span>
<span class="tag is-info">{{ tag.value }}</span>
<div class="field is-grouped is-grouped-multiline">
<div v-for="(tag, index) of tags" :key="index" class="control">
<div class="tags has-addons are-medium">
<span v-if="tag.label" class="tag">{{ tag.label }}</span>
<span class="tag is-info">{{ tag.value }}</span>
</div>
</div>
</div>
</div>
<div class="columns">
<div class="column">
<h2 class="title is-3">Synopsis</h2>
{{ film.synopsis }}
<div class="columns">
<div class="column">
<h2 class="title is-3">Synopsis</h2>
{{ film.synopsis }}
</div>
<div class="column">
<h2 class="title is-3">Acteurs</h2>
<ul>
<li v-for="(actor, index) of film.actors" :key="index">
{{ actor }}
</li>
</ul>
</div>
</div>
<div class="column">
<h2 class="title is-3">Acteurs</h2>
<ul>
<li v-for="(actor, index) of film.actors" :key="index">
{{ actor }}
</li>
</ul>
<div class="columns">
<div class="column">
<iframe
v-if="film.trailerLink"
:src="film.trailerLink"
width="560"
height="315"
frameborder="0"
allowfullscreen="allowfullscreen"
/>
<template v-else>Bande annonce non renseignée</template>
</div>
<div class="column">
<img
class="alignnone wp-image-1873 size-medium"
:src="film.posterLink"
alt="affiche du film"
width="300"
height="300"
/>
</div>
<div class="column">
<img
class="alignnone wp-image-1873 size-medium"
:src="film.bannerLink"
alt="bannière du film"
width="300"
height="300"
/>
</div>
</div>
</div>
<div class="columns">
<div class="column">
<iframe
v-if="film.trailerLink"
:src="film.trailerLink"
width="560"
height="315"
frameborder="0"
allowfullscreen="allowfullscreen"
/>
<template v-else>Bande annonce non renseignée</template>
</div>
<div class="column">
<img
class="alignnone wp-image-1873 size-medium"
:src="film.posterLink"
alt="affiche du film"
width="300"
height="300"
/>
</div>
<div class="column">
<img
class="alignnone wp-image-1873 size-medium"
:src="film.bannerLink"
alt="bannière du film"
width="300"
height="300"
/>
</div>
</div>
</main>
</template>
<script setup lang="ts">

View file

@ -1,18 +1,20 @@
<template>
<h1 class="title">Liste des séances</h1>
<ul class="list has-visible-pointer-controls">
<li v-for="film of films" :key="film.id" class="list-item">
<nuxt-link :to="`/admin/${film.id}`" class="list-item-content">
{{ film.projectionDate || "À planifier" }} - {{ film.title }}
<template v-if="film.director"> de {{ film.director }}</template>
</nuxt-link>
<div class="list-item-controls">
<nuxt-link :to="`/admin/${film.id}/edition`" class="button">
<span>Éditer</span>
<main>
<h1 class="title">Liste des séances</h1>
<ul class="list has-visible-pointer-controls">
<li v-for="film of films" :key="film.id" class="list-item">
<nuxt-link :to="`/admin/${film.id}`" class="list-item-content">
{{ film.projectionDate || "À planifier" }} - {{ film.title }}
<template v-if="film.director"> de {{ film.director }}</template>
</nuxt-link>
</div>
</li>
</ul>
<div class="list-item-controls">
<nuxt-link :to="`/admin/${film.id}/edition`" class="button">
<span>Éditer</span>
</nuxt-link>
</div>
</li>
</ul>
</main>
</template>
<script setup lang="ts">

View file

@ -1,6 +1,8 @@
<template>
<h1 class="title">Nouvelle séance</h1>
<AdminForm v-model="film" @save="post" @publish="publish" />
<main>
<h1 class="title">Nouvelle séance</h1>
<AdminForm v-model="film" @save="post" @publish="publish" />
</main>
</template>
<script setup lang="ts">