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

minhnt-dev: only ssr

Browse Source
This commit is contained in:
MoreStrive
2024-06-21 09:56:34 +07:00
parent 229155b24a
commit 6a275c354e
18 changed files with 84 additions and 1003 deletions
Download Patch File Download Diff File Expand all files Collapse all files
pages/[categories]/index.vue
+1 -19
View File
@@ -1,9 +1,6 @@
<script setup lang="ts">
import _cloneDeep from 'lodash/cloneDeep';
import DynamicTemplate from "~/components/dynamic-page/page/templates/index.vue";
import DynamicSection from "~/components/dynamic-page/page-section/templates/index.vue";
import { useDynamicPageStore } from '~/stores/dynamic-page';
const { currentPage, sectionPublished, componentPublished } = storeToRefs(useDynamicPageStore());
@@ -12,29 +9,15 @@ const store = reactive({
dynamicPage: useDynamicPageStore(),
});
(async () => {
try {
store.dynamicPage.fetchPageByCode(route.path.replace('/', ''));
} catch (error) {
console.error("Error fetching data:", error);
}
})();
watch(currentPage, () => {
store.dynamicPage.setSectionPublished();
store.dynamicPage.setComponentPublished();
}, { deep: true })
await useAsyncData('index', () => store.dynamicPage.fetchPageByCode(route.path.replace('/', '')))
useHead({
title: () => currentPage.value.title || ''
})
</script>
<template>
<main class="h-screen" v-if="currentPage">
<DynamicTemplate :settings="currentPage.settings">
<template v-if="sectionPublished && sectionPublished.length > 0">
<DynamicSection
v-for="(section, index) in sectionPublished"
:key="index"
@@ -42,7 +25,6 @@ useHead({
:content="section.content ? JSON.parse(section.content) : null"
:section="section"
/>
</template>
</DynamicTemplate>
</main>
</template>
pages/bai-viet/[slug].vue
+29 -54
View File
@@ -5,8 +5,6 @@
*/
<script setup lang="ts">
import _cloneDeep from 'lodash/cloneDeep';
import DynamicTemplate from "~/components/dynamic-page/page/templates/index.vue";
import DynamicSection from "~/components/dynamic-page/page-section/templates/index.vue";
@@ -22,64 +20,42 @@ const store = reactive({
article: useArticleStore(),
});
(async () => {
try {
await store.article.getArticleBySlug(route.params.slug);
const loadPage = async () => {
const promises = [];
promises.push(store.article.getArticleBySlug(route.params.slug));
// useHead({
// title: currentArticle.value?.title.replace(/<\/?[^>]+(>|$)/g, ""),
// })
useSeoMeta({
title: currentArticle.value?.title.replace(/<\/?[^>]+(>|$)/g, ""),
ogTitle: currentArticle.value?.title.replace(/<\/?[^>]+(>|$)/g, ""),
description: currentArticle.value?.intro.replace(/<\/?[^>]+(>|$)/g, ""),
ogDescription: currentArticle.value?.intro.replace(/<\/?[^>]+(>|$)/g, ""),
ogImage: currentArticle.value?.thumbnail,
})
} catch (error) {
console.error("Error fetching data:", error);
}
})();
const loadPage = async (contentType: string | number) => {
await store.dynamicPage.fetchPageByCode(contentType);
store.dynamicPage.setSectionPublished();
store.dynamicPage.setComponentPublished();
}
watch(currentArticle, async () => {
let isContentType : string = '';
let isContentType = '';
switch (currentArticle.value?.contentType) {
case 1:
isContentType = 'trang-chi-tiet-bai-viet-general'
break;
isContentType = 'trang-chi-tiet-bai-viet-general';
break;
case 2:
isContentType = 'trang-chi-tiet-bai-viet-image'
break;
isContentType = 'trang-chi-tiet-bai-viet-image';
break;
case 3:
isContentType = 'trang-chi-tiet-podcast'
break;
isContentType = 'trang-chi-tiet-podcast';
break;
case 4:
isContentType = 'trang-chi-tiet-bai-viet-video'
break;
isContentType = 'trang-chi-tiet-bai-viet-video';
break;
case 5:
if (currentArticle.value?.layoutType === 4) {
isContentType = 'trang-chi-tiet-bai-viet-emagazine'
break;
}
if (currentArticle.value?.layoutType === 3) {
isContentType = 'trang-chi-tiet-bai-viet-infographics'
break;
}
default:
isContentType = 'trang-chi-tiet-bai-viet-general'
if (currentArticle.value?.layoutType === 4) {
isContentType = 'trang-chi-tiet-bai-viet-emagazine';
break;
}
if (currentArticle.value?.layoutType === 3) {
isContentType = 'trang-chi-tiet-bai-viet-infographics';
break;
}
default:
isContentType = 'trang-chi-tiet-bai-viet-general';
break;
}
await loadPage(isContentType);
}, { deep: true })
promises.push(store.dynamicPage.fetchPageByCode(isContentType));
await Promise.all(promises);
};
await useAsyncData('detail-article', () => loadPage());
useSeoMeta({
title: () => currentArticle.value?.title?.replace(/<[^>]+>/g, ''),
@@ -87,9 +63,8 @@ useSeoMeta({
ogTitle: () => currentArticle.value?.title,
ogImage: () => currentArticle.value?.thumbnail,
ogDescription: () => currentArticle.value?.intro,
twitterCard: 'summary_large_image',
twitterCard: () => 'summary_large_image',
})
</script>
<template>
@@ -106,4 +81,4 @@ useSeoMeta({
</template>
</DynamicTemplate>
</main>
</template>
</template>
pages/index.vue
+1 -17
View File
@@ -1,6 +1,4 @@
<script setup lang="ts">
import _cloneDeep from 'lodash/cloneDeep';
import DynamicTemplate from "~/components/dynamic-page/page/templates/index.vue";
import DynamicSection from "~/components/dynamic-page/page-section/templates/index.vue";
import { useDynamicPageStore } from '~/stores/dynamic-page';
@@ -11,19 +9,7 @@ const store = reactive({
dynamicPage: useDynamicPageStore(),
});
(async () => {
try {
store.dynamicPage.fetchPageByCode(route.path === '/' ? 'trang-chu' : route.path.replace('/', ''));
} catch (error) {
console.error("Error fetching data:", error);
}
})();
watch(currentPage, () => {
store.dynamicPage.setSectionPublished();
store.dynamicPage.setComponentPublished()
}, { deep: true })
await useAsyncData('index', () => store.dynamicPage.fetchPageByCode(route.path === '/' ? 'trang-chu' : route.path.replace('/', '')))
useHead({
title: 'Trang chủ'
})
@@ -32,7 +18,6 @@ useHead({
<template>
<main class="h-screen" v-if="currentPage">
<DynamicTemplate :settings="currentPage.settings">
<template v-if="sectionPublished && sectionPublished.length > 0">
<DynamicSection
v-for="(section, index) in sectionPublished"
:key="index"
@@ -40,7 +25,6 @@ useHead({
:content="section.content ? JSON.parse(section.content) : null"
:section="section"
/>
</template>
</DynamicTemplate>
</main>
</template>