51 lines
1.4 KiB
Vue
51 lines
1.4 KiB
Vue
<!-- 主布局 -->
|
|
<script setup lang="ts">
|
|
import type { LayoutType } from '@/config/design';
|
|
import LayoutBlankPage from '@/layouts/LayoutBlankPage/index.vue';
|
|
// import { useScreenStore } from '@/hooks/useScreen';
|
|
import LayoutVertical from '@/layouts/LayoutVertical/index.vue';
|
|
import { useDesignStore } from '@/stores';
|
|
|
|
// 这里添加布局类型
|
|
const LayoutComponent: Record<LayoutType, Component> = {
|
|
vertical: LayoutVertical,
|
|
blankPage: LayoutBlankPage,
|
|
};
|
|
|
|
const designStore = useDesignStore();
|
|
// const { isMobile } = useScreenStore();
|
|
/** 获取布局格式 */
|
|
const layout = computed((): LayoutType => designStore.layout);
|
|
onMounted(() => {
|
|
// 更好的做法是等待所有资源加载
|
|
window.addEventListener('load', () => {
|
|
const loader = document.getElementById('yixinai-loader');
|
|
if (loader) {
|
|
loader.style.opacity = '0';
|
|
setTimeout(() => {
|
|
loader.style.display = 'none';
|
|
}, 500); // 匹配过渡时间
|
|
}
|
|
});
|
|
|
|
// 设置超时作为兜底
|
|
setTimeout(() => {
|
|
const loader = document.getElementById('yixinai-loader');
|
|
if (loader) {
|
|
loader.style.opacity = '0';
|
|
setTimeout(() => {
|
|
loader.style.display = 'none';
|
|
}, 500);
|
|
}
|
|
}, 500); // 最多显示0.5秒
|
|
});
|
|
</script>
|
|
|
|
<template>
|
|
<div>
|
|
<component :is="LayoutComponent[layout]" />
|
|
</div>
|
|
</template>
|
|
|
|
<style scoped lang="scss"></style>
|