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

updated useFetch requests in onMounted to use

Browse source
This commit is contained in:
Edward Tirado Jr 2025-04-19 14:48:48 -05:00
parent 592bbb1dd3
commit f7af5501da
4 changed files with 62 additions and 75 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

7
src/pages/admin/index.vue
View file

@ -44,7 +44,7 @@
</div>
<div id="lists" class="hidden">
<lists></lists>
<lists />
</div>
</div>
</template>
@ -54,15 +54,14 @@ import AddMovie from "~/components/modal-content/AddMovie.vue";
import Search from "~/components/admin/search.vue";
import Showings from "~/components/admin/showings.vue";
import Lists from "~/components/admin/lists.vue";
import type { MovieList } from "~/types/movielist";
import { useCookie } from "#app";
import type { Movie } from "~/types/movie";
import Modal from "~/components/Modal.vue";
const lists = defineModel<MovieList>("movie-lists", { default: [] });
const modal_movie = defineModel<Movie>("#movie-modal");
const movie_modal = ref<InstanceType<typeof Modal> | null>(null);
const current_view = ref("search");
const closeModal = function () {
movie_modal?.value?.toggleModal();
@ -72,6 +71,7 @@ const showModal = function (movie: Movie) {
movie_modal?.value?.toggleModal();
};
const toggleDisplay = function (element_id: string) {
if (element_id === current_view.value) return;
let tabs = ["search", "showings", "lists"];
tabs.forEach((value) => {
@ -80,6 +80,7 @@ const toggleDisplay = function (element_id: string) {
document
.getElementById(element_id + "-tab")
?.classList.toggle("underline");
current_view.value = element_id;
} else if (!document.getElementById(value)?.classList.contains("hidden")) {
document.getElementById(value)?.classList.toggle("hidden");
document.getElementById(value + "-tab")?.classList.toggle("underline");

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

@ -53,7 +53,7 @@
<span
v-if="logged_in"
class="text-center hover-pointer"
@click="removeMovie(movie.id)"
@click="removeMovie(movie.imdb_id)"
>
X
</span>
@ -83,35 +83,27 @@ const hide_scheduled = ref(false);
const getList = async function (list_id: number) {
let config = useRuntimeConfig();
const { data, error } = await useFetch<MovieList>(
`${config.public.apiURL}/lists/${list_id}`,
{
method: "GET",
headers: {
"Content-type": "application/json",
Authorization: `Token ${useCookie("token").value}`,
},
$fetch<MovieList>(`${config.public.apiURL}/lists/${list_id}`, {
method: "GET",
headers: {
"Content-type": "application/json",
Authorization: `Token ${useCookie("token").value}`,
},
);
if (error.value) {
if (error.value.statusCode === 401) {
navigateTo("/");
}
if (error.value.statusCode === 404) {
alert("List not found");
navigateTo("/lists");
}
} else {
if (!data.value) {
alert("List not found");
navigateTo("/lists");
} else {
list.value = data.value;
movies.value = data.value?.movies || [];
})
.then((data) => {
list.value = data;
movies.value = data?.movies || [];
filtered_movies.value = movies.value;
}
}
})
.catch((err) => {
if (err.statusCode === 401) {
navigateTo("/");
}
if (err.statusCode === 404) {
alert("List not found");
navigateTo("/lists");
}
});
};
const hideScheduled = function () {
@ -127,7 +119,7 @@ const hideScheduled = function () {
}
};
const removeMovie = async function (movie_id: number) {
const removeMovie = async function (movie_id: string) {
let config = useRuntimeConfig();
let confirmed = confirm("Remove movie from list?");

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

@ -31,21 +31,19 @@ const updateLists = async function () {
headers["Authorization"] = `Token ${useCookie("token").value}`;
}
const { data, error } = await useFetch<MovieList[]>(
`${config.public.apiURL}/lists`,
{
method: "GET",
headers: headers,
},
);
if (error.value) {
if (error.value.statusCode === 401) {
navigateTo("/");
}
} else {
lists.value = data.value || [];
}
await $fetch<MovieList[]>(`${config.public.apiURL}/lists`, {
method: "GET",
headers: headers,
})
.then((data) => {
lists.value = data || [];
})
.catch((err) => {
if (err.statusCode === 401) {
useCookie("token").value = null;
navigateTo("/");
}
});
};
onMounted(() => {

52
src/pages/schedule/index.vue
View file

@ -61,6 +61,8 @@
<script lang="ts" setup>
import type { Showing } from "~/types/showing";
import type { Schedule } from "~/types/schedule";
import { $fetch } from "ofetch";
import { useCookie } from "#app";
const schedule = defineModel<Schedule>("schedule");
const past_showings = defineModel<Showing[]>("past_showings", {
@ -100,39 +102,33 @@ const getSchedule = async function (previous = false) {
let params = "";
if (previous) params = "?past_showings=true";
const { data, error } = await useFetch<Schedule>(
`${config.public.apiURL}/schedules/1${params}`,
{
method: "GET",
headers: {
Accept: "application/json",
"Content-type": "application/json",
Authorization: `Token ${useCookie("token").value}`,
},
await $fetch(`${config.public.apiURL}/schedules/1${params}`, {
method: "GET",
headers: {
Accept: "application/json",
"Content-type": "application/json",
Authorization: `Token ${useCookie("token").value}`,
},
);
if (error.value) {
if (error.value.statusCode === 401) {
navigateTo("/");
}
if (error.value.statusCode === 404) {
alert("Schedule not found");
navigateTo("/");
}
} else {
if (!data.value) {
alert("Schedule not found");
navigateTo("/");
} else {
})
.then((data) => {
if (previous) {
past_showings.value = data.value.past_showings;
past_showings.value = data.past_showings;
} else {
schedule.value = data.value;
schedule.value = data;
}
document.getElementById("loader")?.classList.toggle("hidden");
}
}
})
.catch((err) => {
switch (err.statusCode) {
case 401:
useCookie("token").value = null;
navigateTo("/");
break;
case 404:
alert("Unable to find schedule");
break;
}
});
return schedule;
};