minhnt/NSG_PORTAL_V2
Template
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

minhnt-dev: oonly ssr fix

Browse Source
This commit is contained in:
MoreStrive
2024-06-24 16:46:59 +07:00
parent e151dda2ad
commit ab3419bd5f
7 changed files with 89 additions and 72 deletions
Download Patch File Download Diff File Expand all files Collapse all files
pages/bai-viet/[slug].vue
+28 -24
View File
@@ -10,22 +10,18 @@ import DynamicSection from "~/components/dynamic-page/page-section/templates/ind
const route = useRoute();
import { useDynamicPageStore } from '~/stores/dynamic-page';
import { useArticleStore } from '~/stores/articles';
const { currentPage, sectionPublished, componentPublished } = storeToRefs(useDynamicPageStore());
const { currentArticle } = storeToRefs(useArticleStore());
const store = reactive({
dynamicPage: useDynamicPageStore(),
article: useArticleStore(),
});
const loadPage = async () => {
const promises = [];
promises.push(store.article.getArticleBySlug(route.params.slug));
import { useDynamicPageStore } from '~/stores/dynamic-page';
import { useArticleStore } from '~/stores/articles';
const loadPage = async () => {
const article = await store.article.getArticleBySlug(route.params.slug);
let isContentType = '';
switch (currentArticle.value?.contentType) {
switch (article.value?.contentType) {
case 1:
isContentType = 'trang-chi-tiet-bai-viet-general';
break;
@@ -39,11 +35,11 @@ const loadPage = async () => {
isContentType = 'trang-chi-tiet-bai-viet-video';
break;
case 5:
if (currentArticle.value?.layoutType === 4) {
if (article.value?.layoutType === 4) {
isContentType = 'trang-chi-tiet-bai-viet-emagazine';
break;
}
if (currentArticle.value?.layoutType === 3) {
if (article.value?.layoutType === 3) {
isContentType = 'trang-chi-tiet-bai-viet-infographics';
break;
}
@@ -51,34 +47,42 @@ const loadPage = async () => {
isContentType = 'trang-chi-tiet-bai-viet-general';
break;
}
promises.push(store.dynamicPage.fetchPageByCode(isContentType));
await Promise.all(promises);
const dynamicPage = await store.dynamicPage.fetchPageByCode(isContentType);
return {
article,
dynamicPage
};
};
await useAsyncData('detail-article', () => loadPage());
const { data } = await useAsyncData('detail-article', () => loadPage());
const article = data.value?.article;
const dynamicPage = data.value?.dynamicPage;
const asycnCurrentPage = dynamicPage.currentPage;
const asycnSectionPublished = dynamicPage.sectionPublished;
const asycnComponentPublished = dynamicPage.componentPublished;
useSeoMeta({
title: () => currentArticle.value.title.replace(/<[^>]+>/g, ''),
description: () => currentArticle.value.intro.replace(/<[^>]+>/g, ''),
ogTitle: () => currentArticle.value.title.replace(/<[^>]+>/g, ''),
ogImage: () => currentArticle.value.thumbnail,
ogDescription: () => currentArticle.value.intro.replace(/<[^>]+>/g, ''),
title: () => article.title.replace(/<[^>]+>/g, ''),
description: () => article.intro.replace(/<[^>]+>/g, ''),
ogTitle: () => article.title.replace(/<[^>]+>/g, ''),
ogImage: () => article.thumbnail,
ogDescription: () => article.intro.replace(/<[^>]+>/g, ''),
twitterCard: () => 'summary_large_image',
})
</script>
<template>
<main class="h-screen" v-if="currentPage && currentPage.settings">
<DynamicTemplate :settings="currentPage.settings">
<template v-if="sectionPublished && sectionPublished.length > 0">
<main class="h-screen" v-if="asycnCurrentPage">
<DynamicTemplate :settings="asycnCurrentPage.settings">
<DynamicSection
v-for="(section, index) in sectionPublished"
v-for="(section, index) in asycnSectionPublished"
:key="index"
:settings="section.settings"
:content="section.content ? JSON.parse(section.content) : null"
:section="section"
/>
</template>
</DynamicTemplate>
</main>
</template>