aandres/cineclub-site
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

fix [front]: admin one-node page

Browse source
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
Show stats Download patch file Download diff file Expand all files Collapse all files

7
front/pages/admin/[id]/edition.vue
View file

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

122
front/pages/admin/[id]/index.vue
View file

@ -1,69 +1,71 @@
<template> <template>
<div class="title is-2"> <main>
<div class="tag is-large"> <div class="title is-2">
{{ film.isConfirmed ? "Publié" : "Brouillon" }} <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> </div>
<h1 class="mx-5"> <div class="field is-grouped is-grouped-multiline">
{{ film.projectionDate || "À planifier" }} - {{ film.title }} <div v-for="(tag, index) of tags" :key="index" class="control">
<span class="has-text-grey-lighter">#{{ film.id }}</span> <div class="tags has-addons are-medium">
</h1> <span v-if="tag.label" class="tag">{{ tag.label }}</span>
<nuxt-link :to="`/admin/${id}/edition`" class="button"> <span class="tag is-info">{{ tag.value }}</span>
<span>Éditer</span> </div>
</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> </div>
</div> </div>
</div> <div class="columns">
<div class="columns"> <div class="column">
<div class="column"> <h2 class="title is-3">Synopsis</h2>
<h2 class="title is-3">Synopsis</h2> {{ film.synopsis }}
{{ 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>
<div class="column"> <div class="columns">
<h2 class="title is-3">Acteurs</h2> <div class="column">
<ul> <iframe
<li v-for="(actor, index) of film.actors" :key="index"> v-if="film.trailerLink"
{{ actor }} :src="film.trailerLink"
</li> width="560"
</ul> 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> </main>
<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>
</template> </template>
<script setup lang="ts"> <script setup lang="ts">

28
front/pages/admin/index.vue
View file

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

6
front/pages/admin/nouveau.vue
View file

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