MoreStrive
51 lines
1.2 KiB
Vue
51 lines
1.2 KiB
Vue
<script lang="ts" setup>
|
|
import { layouts } from "@/definitions/enum";
|
|
|
|
import {
|
|
BASE_LAYOUT,
|
|
ARTICLE_SHORT_LAYOUT,
|
|
ARTICLE_PAGE_LAYOUT,
|
|
ARTICLE_NORMAL_LAYOUT,
|
|
ARTICLE_NONE_LAYOUT,
|
|
ARTICLE_LONG_LAYOUT,
|
|
} from './index';
|
|
|
|
const _props = defineProps<{
|
|
settings?: any,
|
|
}>()
|
|
|
|
const definedDynamicPageLayout: Record<string, any> = {
|
|
'Default': BASE_LAYOUT,
|
|
[layouts.FULL_PAGE]: BASE_LAYOUT,
|
|
[layouts.CENTER_PAGE]: BASE_LAYOUT,
|
|
[layouts.BACKGROUND_PAGE]: BASE_LAYOUT,
|
|
|
|
'ARTICLE_SHORT': ARTICLE_SHORT_LAYOUT,
|
|
'ARTICLE_PAGE': ARTICLE_PAGE_LAYOUT,
|
|
'ARTICLE_NORMAL': ARTICLE_NORMAL_LAYOUT,
|
|
'ARTICLE_NONE': ARTICLE_NONE_LAYOUT,
|
|
'ARTICLE_LONG': ARTICLE_LONG_LAYOUT,
|
|
}
|
|
|
|
const getCurrentLayout = computed(() => _props.settings.layout);
|
|
|
|
const GET_PROPS = computed(() => {
|
|
return () => {
|
|
let props: any = {};
|
|
for (const [key, value] of Object.entries(_props.settings)) {
|
|
props = {
|
|
...props,
|
|
[key]: value
|
|
}
|
|
}
|
|
return props;
|
|
};
|
|
})
|
|
</script>
|
|
|
|
<template>
|
|
<component :is="definedDynamicPageLayout[getCurrentLayout]" v-bind="GET_PROPS()">
|
|
<slot />
|
|
</component>
|
|
</template>
|