tiradoe/movie-night-web
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

added loading icon

Browse source
This commit is contained in:
Edward Tirado Jr 2025-04-22 19:32:12 -05:00
parent eef0435197
commit 4a3422889f
5 changed files with 34 additions and 6 deletions
Download patch file Download diff file Expand all files Collapse all files

4
src/pages/lists/[id].vue
View file

@ -1,4 +1,5 @@
<template>
<LoadingIcon v-if="loading" />
<div v-if="list_id !== 0" class="p-5 sm:p-0">
<Modal ref="movie_modal">
<ShowMovie
@ -73,6 +74,7 @@ import { useCookie } from "#app";
const list_id = ref(0);
const list = defineModel<MovieList>("movie_list", { default: [] });
const loading = ref(true);
const modal_movie: Ref<Movie | null> = ref(null);
const movies = defineModel<Movie[] | []>("movies", {
default: [],
@ -83,6 +85,7 @@ const logged_in = ref(false);
const hide_scheduled = ref(false);
const getList = async function (list_id: number) {
loading.value = true;
let config = useRuntimeConfig();
let headers: any = {
"Content-type": "application/json",
@ -100,6 +103,7 @@ const getList = async function (list_id: number) {
list.value = data;
movies.value = data?.movies || [];
filtered_movies.value = movies.value;
loading.value = false;
})
.catch((err) => {
if (err.statusCode === 401) {

8
src/pages/lists/index.vue
View file

@ -1,8 +1,10 @@
<template>
<div class="p-5 sm:p-0">
<div v-if="lists.length < 1">
<div v-if="lists.length < 1 && !loading">
<p>No lists found</p>
</div>
<LoadingIcon v-if="loading" />
<ul class="grid grid-cols-2 gap-3 mt-5">
<li v-for="list in lists" class="movie-card neon-border p-5 rounded">
<div class="grid grid-rows-2 gap-3">
@ -21,7 +23,10 @@ import type { MovieList } from "~/types/movielist";
import { useCookie } from "#app";
const lists = defineModel<MovieList[]>("movie_list", { default: [] });
const loading = ref(true);
const updateLists = async function () {
loading.value = true;
let config = useRuntimeConfig();
let headers: any = {
"Content-type": "application/json",
@ -37,6 +42,7 @@ const updateLists = async function () {
})
.then((data) => {
lists.value = data || [];
loading.value = false;
})
.catch((err) => {
if (err.statusCode === 401) {