91 lines
2.3 KiB
Vue
91 lines
2.3 KiB
Vue
<script setup lang="ts">
|
|
import { computed, onMounted } from 'vue'
|
|
import { useRoute } from 'vue-router'
|
|
import { ConfigProvider } from 'ant-design-vue'
|
|
import { useTheme } from './composables/useTheme.ts'
|
|
import { useUpdateModal } from './composables/useUpdateChecker.ts'
|
|
import AppLayout from './components/AppLayout.vue'
|
|
import TitleBar from './components/TitleBar.vue'
|
|
import UpdateModal from './components/UpdateModal.vue'
|
|
import DevDebugPanel from './components/DevDebugPanel.vue'
|
|
import GlobalPowerCountdown from './components/GlobalPowerCountdown.vue'
|
|
import zhCN from 'ant-design-vue/es/locale/zh_CN'
|
|
import { logger } from '@/utils/logger'
|
|
|
|
const route = useRoute()
|
|
const { antdTheme, initTheme } = useTheme()
|
|
const { updateVisible, updateData, onUpdateConfirmed } = useUpdateModal()
|
|
|
|
// 判断是否为初始化页面
|
|
const isInitializationPage = computed(() => route.name === 'Initialization')
|
|
|
|
onMounted(() => {
|
|
logger.info('App组件已挂载')
|
|
initTheme()
|
|
logger.info('主题初始化完成')
|
|
})
|
|
</script>
|
|
|
|
<template>
|
|
<ConfigProvider :theme="antdTheme" :locale="zhCN">
|
|
<!-- 初始化页面使用带标题栏的全屏布局 -->
|
|
<div v-if="isInitializationPage" class="initialization-container">
|
|
<TitleBar />
|
|
<div class="initialization-content">
|
|
<router-view />
|
|
</div>
|
|
</div>
|
|
<!-- 其他页面使用带标题栏的应用布局 -->
|
|
<div v-else class="app-container">
|
|
<TitleBar />
|
|
<AppLayout />
|
|
</div>
|
|
|
|
<!-- 全局更新模态框 -->
|
|
<UpdateModal
|
|
v-model:visible="updateVisible"
|
|
:update-data="updateData"
|
|
@confirmed="onUpdateConfirmed"
|
|
/>
|
|
|
|
<!-- 开发环境调试面板 -->
|
|
<DevDebugPanel />
|
|
|
|
<!-- 全局电源倒计时弹窗 -->
|
|
<GlobalPowerCountdown />
|
|
</ConfigProvider>
|
|
</template>
|
|
|
|
<style>
|
|
* {
|
|
box-sizing: border-box;
|
|
}
|
|
|
|
.app-container {
|
|
height: 100vh;
|
|
display: flex;
|
|
flex-direction: column;
|
|
}
|
|
|
|
.initialization-container {
|
|
height: 100vh;
|
|
display: flex;
|
|
flex-direction: column;
|
|
}
|
|
|
|
.initialization-content {
|
|
flex: 1;
|
|
overflow-y: auto;
|
|
overflow-x: hidden;
|
|
width: 100%;
|
|
/* 隐藏滚动条但保留滚动功能 */
|
|
scrollbar-width: none; /* Firefox */
|
|
-ms-overflow-style: none; /* IE/Edge */
|
|
}
|
|
|
|
/* 隐藏 Webkit 浏览器的滚动条 */
|
|
.initialization-content::-webkit-scrollbar {
|
|
display: none;
|
|
}
|
|
</style>
|