From 0f34c7dfb9e7fc9e520f4b4579ab292843b28d98 Mon Sep 17 00:00:00 2001 From: James Collins Date: Mon, 28 Aug 2023 23:16:12 +1000 Subject: [PATCH] use new caching --- resources/js/views/Article.vue | 67 ++++++------ resources/js/views/Home.vue | 187 ++++++++++++++++++++++----------- 2 files changed, 157 insertions(+), 97 deletions(-) diff --git a/resources/js/views/Article.vue b/resources/js/views/Article.vue index 9b27a4d..2aadbb4 100644 --- a/resources/js/views/Article.vue +++ b/resources/js/views/Article.vue @@ -108,44 +108,43 @@ const handleLoad = async () => { let slug = useRoute().params.slug || ""; pageLoading.value = true; - try { - if (slug.length > 0) { - let result = await api.get({ - url: "/articles", - params: { - slug: `=${slug}`, - limit: 1, - }, - }); + if (slug.length > 0) { + let result = await api.get({ + url: "/articles", + params: { + slug: `=${slug}`, + limit: 1, + }, + callback: (result) => { + if (result.status < 300) { + const data = result.data as ArticleCollection; - const data = result.data as ArticleCollection; + if (data && data.articles && data.total && data.total > 0) { + article.value = data.articles[0]; - if (data && data.articles && data.total && data.total > 0) { - article.value = data.articles[0]; + article.value.publish_at = new SMDate( + article.value.publish_at, + { + format: "ymd", + utc: true, + }, + ).format("yyyy/MM/dd HH:mm:ss"); - article.value.publish_at = new SMDate( - article.value.publish_at, - { - format: "ymd", - utc: true, - }, - ).format("yyyy/MM/dd HH:mm:ss"); + backgroundImageUrl.value = mediaGetVariantUrl( + article.value.hero, + "large", + ); + applicationStore.setDynamicTitle(article.value.title); + } else { + pageStatus.value = 404; + } + } - backgroundImageUrl.value = mediaGetVariantUrl( - article.value.hero, - "large", - ); - applicationStore.setDynamicTitle(article.value.title); - } else { - pageStatus.value = 404; - } - } else { - pageStatus.value = 404; - } - } catch (error) { - /* empty */ - } finally { - pageLoading.value = false; + pageLoading.value = false; + }, + }); + } else { + pageStatus.value = 404; } }; diff --git a/resources/js/views/Home.vue b/resources/js/views/Home.vue index a27f787..eb25a8c 100644 --- a/resources/js/views/Home.vue +++ b/resources/js/views/Home.vue @@ -221,74 +221,135 @@ const viewLoad = async () => { articlesLoading.value = true; articlesError.value = ""; - try { - await Promise.all([ - api - .get({ - url: "/events", - params: { - limit: 10, - sort: "start_at", - start_at: `>${new SMDate("now").format( - "yyyy-MM-dd hh:mm:ss", - )}`, - }, - }) - .then((eventsResult) => { - const eventsData = - getApiResultData(eventsResult); + api.get({ + url: "/events", + params: { + limit: 10, + sort: "start_at", + start_at: `>${new SMDate("now").format("yyyy-MM-dd hh:mm:ss")}`, + }, + callback: (eventsResult) => { + if (eventsResult.status < 300) { + const eventsData = + getApiResultData(eventsResult); - if (eventsData && eventsData.events) { - events.value = []; + if (eventsData && eventsData.events) { + events.value = []; - for (const event of eventsData.events) { - if ( - event.status === "open" || - event.status === "soon" - ) { - events.value.push(event); - if (events.value.length === 4) break; - } + for (const event of eventsData.events) { + if ( + event.status === "open" || + event.status === "soon" + ) { + events.value.push(event); + if (events.value.length === 4) break; } } - }) - .catch((error) => { - if (error.status != 404) { - eventsError.value = - "An error occured retrieving the events"; - } - }) - .finally(() => { - eventsLoading.value = false; - }), - api - .get({ - url: "/articles", - params: { - limit: 4, - }, - }) - .then((articlesResult) => { - const articlesData = - getApiResultData(articlesResult); + } + } else { + if (eventsResult.status != 404) { + eventsError.value = + "An error occured retrieving the events"; + } + } - if (articlesData && articlesData.articles) { - articles.value = articlesData.articles; - } - }) - .catch((error) => { - if (error.status != 404) { - articlesError.value = - "An error occured retrieving the posts"; - } - }) - .finally(() => { - articlesLoading.value = false; - }), - ]); - } catch { - /* empty */ - } + eventsLoading.value = false; + }, + }); + + api.get({ + url: "/articles", + params: { + limit: 4, + }, + + callback: (articlesResult) => { + if (articlesResult.status < 300) { + const articlesData = + getApiResultData(articlesResult); + + if (articlesData && articlesData.articles) { + articles.value = articlesData.articles; + } + } else { + if (articlesResult.status != 404) { + articlesError.value = + "An error occured retrieving the posts"; + } + } + + articlesLoading.value = false; + }, + }); + + // try { + // await Promise.all([ + // api + // .get({ + // url: "/events", + // params: { + // limit: 10, + // sort: "start_at", + // start_at: `>${new SMDate("now").format( + // "yyyy-MM-dd hh:mm:ss", + // )}`, + // }, + // }) + // .then((eventsResult) => { + // const eventsData = + // getApiResultData(eventsResult); + + // if (eventsData && eventsData.events) { + // events.value = []; + + // for (const event of eventsData.events) { + // if ( + // event.status === "open" || + // event.status === "soon" + // ) { + // events.value.push(event); + // if (events.value.length === 4) break; + // } + // } + // } + // }) + // .catch((error) => { + // if (error.status != 404) { + // eventsError.value = + // "An error occured retrieving the events"; + // } + // }) + // .finally(() => { + // eventsLoading.value = false; + // }), + // api + // .get({ + // url: "/articles", + // params: { + // limit: 4, + // }, + // }) + // .then((articlesResult) => { + // const articlesData = + // getApiResultData(articlesResult); + + // if (articlesData && articlesData.articles) { + // articles.value = articlesData.articles; + // } + // }) + // .catch((error) => { + // if (error.status != 404) { + // articlesError.value = + // "An error occured retrieving the posts"; + // } + // }) + // .finally(() => { + // articlesLoading.value = false; + // }), + // ]); + // } catch { + // /* empty */ + // } }; viewLoad();