minhnt-dev: design

components/dynamic-page/page-component/templates/articles/individuals/Card.vue

@@ -55,7 +55,7 @@ const drop = (e: any) => {
         <div class="basic-article_content" :class="[!parseData && 'no-data']">
             <div>
                 <template v-if="parseData">
-                    <nuxt-link :to="`/bai-viet/${parseData.slug}`">
+                    <nuxt-link :to="`/bai-viet/${parseData.id}`">
                         <h3 v-if="!LAYOUT_PARSE['HIDE'] || !LAYOUT_PARSE['HIDE'].includes('title')" class="mb-1 line-clamp-2 text-base font-700 hover:text-primary-100 transition-all duration-300">
                             {{ parseData.title?.replace(/<[^>]+>/g, '') }}
                         </h3>

pages/bai-viet/[slug].vue

@@ -23,7 +23,7 @@ const store = reactive({
 
 (async () => {
   try {
-    store.article.getArticleById(Number(route.params.slug));
+    store.article.getArticleById(route.params.slug);
   } catch (error) {
     console.error("Error fetching data:", error);
   }
@@ -48,16 +48,16 @@ watch(currentArticle, async () => {
     case 4:
         isContentType = 'ArticleLayoutVideo'
     case 5:
-        if (currentArticle.value?.layoutType === 3) isContentType = 'ArticleLayoutInfographics'
-        else isContentType = 'ArticleLayoutFullPage'
+        if (currentArticle.value?.layoutType === 3) isContentType = 'trang-chi-tiet-emagazine'
+        else isContentType = 'trang-chi-tiet-emagazine'
     default:
-        isContentType = 'ArticleLayoutDefault'
+        isContentType = 'trang-chi-tiet-emagazine'
   }
   await loadPage(isContentType)
 }, { deep: true })
 
 useSeoMeta({
-    title: currentArticle.value?.title,
+    title: currentArticle.value?.title?.replace(/<[^>]+>/g, ''),
     ogTitle: currentArticle.value?.title,
     description: currentArticle.value?.intro,
     ogDescription: currentArticle.value?.intro,

server/models/articles/index.ts

@@ -83,6 +83,7 @@ export const getArticleBySlug = async (event : any) => {
                 site: '1' || 1,
             }),
         })
+        console.log(item)
         return item
     } catch (error) {
         handleError(error);

stores/articles.ts

@@ -10,9 +10,18 @@ export const useArticleStore = defineStore("article", () => {
         } catch (error: any) {}
     }
 
+    const getArticleByCode = async (slug: string) => {
+        try {
+            const { data} = await useFetch(`/api/articles/get-by-slug/${slug}`)
+            currentArticle.value = {}
+            currentArticle.value = data.value.item
+        } catch (error: any) {}
+    }
+
     return {
         currentArticle,
-        getArticleById
+        getArticleById,
+        getArticleByCode
     }
 });