Bruno Predot

Correctif typage + ajout section supplémentaire si le film n'est pas retrouvé.

<script lang="ts" setup>
//#region --import--.
import { ArrowLeftIcon } from "lucide-vue-next";
import { AlertTriangleIcon, ArrowLeftIcon } from "lucide-vue-next";
import { useTMDB } from "~/composables/tMDB";
import { computed, onMounted, ref } from "vue";
import { Movie } from "~/models/movie";
... ... @@ -12,6 +12,7 @@ import { MovieComment } from "~/models/movieComment";
// Infos sur le composable date de Vuetify : https://vuetifyjs.com/en/features/dates/
// Et l'api date : https://vuetifyjs.com/en/api/use-date/#exposed
import { useDate } from "vuetify";
import { WhereSecondaryClosure } from "pinia-orm";
//#endregion
//#region --Declaration--.
... ... @@ -47,8 +48,11 @@ const movieId = computed(() => {
const movie = computed(() => {
if (unref(movieId)) {
// Todo : revoir ici.
return useRepo(Movie).query().where("id", movieId.value).withAll().first() as unknown as MovieInterface;
return useRepo(Movie)
.query()
.where("id", movieId.value as WhereSecondaryClosure<never> | null | undefined)
.withAll()
.first() as unknown as MovieInterface;
} else {
return null;
}
... ... @@ -69,10 +73,14 @@ const director = computed(() => {
* Retourne les commentaires liés au film, du plus récent au plus ancien.
*/
const comments = computed(() => {
return useRepo(MovieComment).query().where(comment => {
return useRepo(MovieComment)
.query()
.where((comment) => {
const searched = comment as unknown as MovieCommentInterface;
return searched.movie_id === unref(movieId)
}).orderBy('createdAt', 'desc').get();
return searched.movie_id === unref(movieId);
})
.orderBy("createdAt", "desc")
.get();
});
//#endregion
... ... @@ -123,7 +131,7 @@ async function fetchCredits(id: number | string) {
function handleSubmitEvent(event: MovieCommentInterface) {
isSubmitting.value = true;
event.movie_id = unref(movieId);
event.createdAt = `${new Date(Date.now())}`
event.createdAt = `${new Date(Date.now())}`;
useRepo(MovieComment).save(event);
isSubmitting.value = false;
}
... ... @@ -212,6 +220,19 @@ onMounted(() => {
</div>
</div>
</div>
<!-- Erreur -->
<section v-else class="container mx-auto px-4 py-16 text-center">
<AlertTriangleIcon :size="64" class="mx-auto mb-4 text-red-500" />
<h2 class="text-2xl font-bold mb-2">Film non trouvé</h2>
<p class="text-gray-400 mb-6">Nous n'avons pas pu trouver le film que vous cherchez.</p>
<button
class="px-6 py-2 bg-primary text-white font-bold rounded-md hover:bg-primary-dark transition-colors"
@click="navigateTo('/')"
>
Retour à l'accueil
</button>
</section>
</section>
</template>
... ...