phongdt:page video

components/article/Topic.vue

@@ -0,0 +1,15 @@
+<script setup lang="ts">
+const props = defineProps<{topics?: any[]}>()
+</script>
+<template>
+    <div v-if="topics?.length" class="flex flex-col items-center justify-between gap-6 sm:flex-row mt-6">
+        <div class="flex order-2 gap-4 xl:order-1">
+            <h3 class="text-xl font-semibold after:content-[':'] whitespace-nowrap">Chủ đề</h3>
+            <div class="flex items-center gap-4 flex-wrap">
+                <NuxtLink v-for="(item, index) in topics" :key="index" :to="{ name:'topic-topicSlug', params:{ topicSlug: item.code } }" class="text-blue-500 hover:text-blue-600">
+                    {{ item?.title }},
+                </NuxtLink>
+            </div>
+        </div>
+    </div>
+</template>