base structure and display

pages/[...slug].vue

@@ -0,0 +1,44 @@
+<template>
+  <NuxtLayout name="default">
+    <NotFound v-if="data.length == 0" />
+    <ContentBuilder v-else class="min-h-[calc(100vh-9rem)] w-full" />
+  </NuxtLayout>
+</template>
+
+<script setup lang="ts">
+import type Page from "../types/collection/page";
+import type Global from "../types/single/global";
+
+const {
+  params: { slug: params },
+} = useRoute();
+const baseUrl = useStrapiUrl().replace("/api", "");
+const { findOne } = useStrapi();
+
+const { data: global } = await useAsyncData("global", () => findOne<Global>("global"));
+const {
+  navbar: { navbar_items },
+} = global.value?.data as unknown as Global;
+
+const navbar_sub_items = computed(() => {
+  return navbar_items.find((ni) => ni.URL == params[0])?.navbar_sub_items ?? [];
+});
+
+const active_item = computed(() => {
+  return navbar_items.find((ni) => ni.URL == params[0])?.page;
+});
+const active_sub_item = computed(() => {
+  return navbar_sub_items.value.find((si) => si.URL == params[1])?.page;
+});
+const active_page_id = computed<string>(() => {
+  return active_sub_item.value?.slug ?? active_item.value?.slug ?? "";
+});
+
+const { data: pages } = await useAsyncData("pages", () =>
+  findOne<Array<Page>>("pages", {
+    populate: "*",
+    filters: { slug: active_page_id.value },
+  })
+);
+const data = pages.value?.data as unknown as Array<Page>;
+</script>

pages/index.vue

@@ -1,3 +1,14 @@
 <template>
-  <NuxtLayout name="landing"> index </NuxtLayout>
+  <NuxtLayout name="landing">
+    <ContentBuilder class="min-h-[calc(100vh-9rem)] w-full" />
+  </NuxtLayout>
 </template>
+
+<script setup lang="ts">
+import type Homepage from "../types/single/homepage";
+
+const { findOne } = useStrapi();
+
+const { data: homepage } = await useAsyncData("homepage", () => findOne<Homepage>("homepage"));
+const { content } = homepage.value?.data as unknown as Homepage;
+</script>