updated showings to use typescript and composition api

This commit is contained in:
Edward Tirado Jr 2025-04-13 22:23:09 -05:00
parent e00ce22016
commit c3247883f5
4 changed files with 92 additions and 72 deletions

View file

@ -1,7 +1,11 @@
<template>
<div v-if="list_id !== 0" class="p-5 sm:p-0">
<Modal ref="movie_modal">
<ShowMovie v-if="modal_movie" :movie="modal_movie"></ShowMovie>
<ShowMovie
v-if="modal_movie"
:movie="modal_movie"
@close-modal="closeModal"
></ShowMovie>
</Modal>
<h2 class="text-xl font-bold pb-5">{{ list.name }}</h2>
<div class="grid grid-cols-2 rounded movie-card neon-border p-5">
@ -66,8 +70,6 @@ import type { MovieList } from "~/types/movielist";
import type { Movie } from "~/types/movie";
import Modal from "~/components/Modal.vue";
const movie_modal = ref<InstanceType<typeof Modal> | null>(null);
const list_id = ref(0);
const list = defineModel<MovieList>("movie_list", { default: [] });
const modal_movie: Ref<Movie | null> = ref(null);
@ -182,6 +184,11 @@ const showModal = function (movie: Movie) {
movie_modal.value?.toggleModal();
};
const movie_modal = ref<InstanceType<typeof Modal> | null>(null);
const closeModal = function (movie: Movie) {
movie_modal.value?.toggleModal();
};
onMounted(() => {
const route = useRoute();
if (typeof route.params.id === "string") {