thainv: ghép navigation
This commit is contained in:
@@ -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>
|
||||
Reference in New Issue
Block a user