thainv: ghép navigation

2024-06-17 11:48:00 +07:00
parent c2b9208746
commit 3c75c89a8b
30 changed files with 856 additions and 108 deletions
@@ -0,0 +1,36 @@
+<script lang="ts" setup>
+import { enumPageComponentTemplates, enumPageComponentLayouts } from "@/definitions/enum";
+import { Direction_Navigation, Bottom_Navigation, Top_Navigation } from "./index";
+
+const _props = defineProps<{
+  settings: any;
+  component?: any;
+  content?: any
+}>();
+
+const definedDynamicComponent: Record<string, any> = {
+  [enumPageComponentLayouts[enumPageComponentTemplates.NAVIGATION]['NAVIGATION-DIRECTION']]: Direction_Navigation,
+  [enumPageComponentLayouts[enumPageComponentTemplates.NAVIGATION]['NAVIGATION-BOTTOM']]: Bottom_Navigation,
+  [enumPageComponentLayouts[enumPageComponentTemplates.NAVIGATION]['NAVIGATION-TOP']]: Top_Navigation,
+};
+const getCurrentComponent = computed(() => `${_props.settings.layout}`);
+
+const GET_PROPS = computed(() => {
+  return () => {
+    let props: any = {};
+    if (_props.settings) {
+      for (const [key, value] of Object.entries(_props.settings)) {
+        props = {
+          ...props,
+          [key]: value,
+        };
+      }
+      return props;
+    }
+  };
+});
+</script>
+
+<template>
+  <component :is="definedDynamicComponent[getCurrentComponent]" v-bind="{ ...GET_PROPS(), component: _props.component, settings: _props.settings, content: _props.content }" />
+</template>