thainv: ghép navigation

This commit is contained in:
nguyen van thai
2024-06-17 11:48:00 +07:00
parent c2b9208746
commit 3c75c89a8b
30 changed files with 856 additions and 108 deletions
@@ -141,7 +141,7 @@ const CLASS_FOR_SECTION = computed(() => {
</script>
<template>
<div class="section_layout grid sm:gap-x-5 sm:gap-y-2.5 gap-[10px] lg:grid-cols-2" :class="[CLASS_FOR_SECTION.section_layout]">
<div class="section_layout grid gap-[16px] lg:grid-cols-2" :class="[CLASS_FOR_SECTION.section_layout]">
<div
v-for="(position, index) in props.content || Array(SETTING_OPTIONS.MAX_ELEMENT).fill({})"
:key="index"
@@ -156,15 +156,7 @@ const CLASS_FOR_SECTION = computed(() => {
<style lang="scss">
.section_layout {
&.basic_column {
grid-template-columns: repeat(1, minmax(0, 1fr));
// & > div:first-child {
// .basic-article {
// h3 {
// @apply text-24px;
// }
// }
// }
@apply grid-cols-1;
}
&.two_col_layout {
@@ -172,7 +164,7 @@ const CLASS_FOR_SECTION = computed(() => {
}
&.three_col_layout {
@apply lg:grid-cols-3 grid-cols-1;
@apply md:grid-cols-3 grid-cols-1;
// grid-template-columns: repeat(3, minmax(0, 1fr));
}
&.four_col_layout {
@@ -30,6 +30,7 @@ const definedDynamicSection: Record<string, any> = {
};
const getCurrentSection = computed(() => _props?.layout || "");
const GET_PROPS = computed(() => {
return () => {
let props: any = {};
@@ -1 +1,2 @@
export { default as Article_Section_Default } from './articles/Default.vue'
export { default as None_Section_Default } from './none/Default.vue'
@@ -1,5 +1,5 @@
<script lang="ts" setup>
import { Article_Section_Default } from './index';
import { Article_Section_Default, None_Section_Default } from './index';
import { enumPageSectionLayouts } from "@/definitions/enum";
const _props = defineProps<{
@@ -25,10 +25,27 @@ const definedDynamicSection: Record<string, any> = {
[`Article_${enumPageSectionLayouts.HORIZONTAL_EIGHT}`]: Article_Section_Default,
[`Article_${enumPageSectionLayouts.HORIZONTAL_NINE}`]: Article_Section_Default,
[`Article_${enumPageSectionLayouts.HORIZONTAL_TEN}`]: Article_Section_Default,
'None_Default': None_Section_Default,
[`None_${enumPageSectionLayouts.VERTICAL_TWO}`]: None_Section_Default,
[`None_${enumPageSectionLayouts.VERTICAL_LEFT_TWO}`]: None_Section_Default,
[`None_${enumPageSectionLayouts.VERTICAL_RIGHT_TWO}`]: None_Section_Default,
[`None_${enumPageSectionLayouts.VERTICAL_THREE}`]: None_Section_Default,
[`None_${enumPageSectionLayouts.VERTICAL_FOUR}`]: None_Section_Default,
[`None_${enumPageSectionLayouts.HORIZONTAL_ONE}`]: None_Section_Default,
[`None_${enumPageSectionLayouts.HORIZONTAL_TWO}`]: None_Section_Default,
[`None_${enumPageSectionLayouts.HORIZONTAL_THREE}`]: None_Section_Default,
[`None_${enumPageSectionLayouts.HORIZONTAL_FOUR}`]: None_Section_Default,
[`None_${enumPageSectionLayouts.HORIZONTAL_FIVE}`]: None_Section_Default,
[`None_${enumPageSectionLayouts.HORIZONTAL_SIX}`]: None_Section_Default,
[`None_${enumPageSectionLayouts.HORIZONTAL_SEVEN}`]: None_Section_Default,
[`None_${enumPageSectionLayouts.HORIZONTAL_EIGHT}`]: None_Section_Default,
[`None_${enumPageSectionLayouts.HORIZONTAL_NINE}`]: None_Section_Default,
[`None_${enumPageSectionLayouts.HORIZONTAL_TEN}`]: None_Section_Default,
}
const getCurrentSection = computed(() => `${_props.settings.template}_${_props.settings.layout}`);
const GET_PROPS = computed(() => {
return () => {
let props: any = {};
@@ -0,0 +1,28 @@
<script setup lang="ts">
import DynamicLayout from '~/components/dynamic-page/page-section/layouts/index.vue';
import type { PageSection } from "~/server/models/dynamic-page/index";
const emit = defineEmits(['dropComponent', 'dropData', 'selectComponent']);
const props = defineProps<{
label?: any
layout?: string
settings?: any
content?: any
section: PageSection
}>()
</script>
<template>
<DynamicLayout
:layout="props.layout"
:content="props.content"
:settings="props.settings"
:section= "props.section"
/>
</template>
<style lang="scss" scoped>
</style>