Yuhang Wu
30ddf583e5
优化说明： 1. 调整多个页面布局，将内容区拆分为独立的磨砂卡片，统一样式规范 2. 修改全局磨砂玻璃面板的透明度，避免阴影叠加导致的灰色遮罩 3. 新增扁平磨砂卡片样式，移除不必要的阴影 4. 将数据库文件名从 reader.db 改为 frpilot.db 5. 更新相关文档说明，同步 UI 修改内容
29 lines
734 B
Vue
29 lines
734 B
Vue
<template>
|
||
<!-- 应用整体：背景由 <html> 统一绘制，此处只负责布局 -->
|
||
<div class="app-shell flex h-full w-full flex-col overflow-hidden">
|
||
<!-- 顶部自定义 TitleBar -->
|
||
<Header @settings="goToSetting" />
|
||
|
||
<!-- 主体：侧边栏 + 内容区 -->
|
||
<div class="flex min-h-0 flex-1 gap-3 px-3 pb-3">
|
||
<Aside />
|
||
|
||
<main class="min-w-0 flex-1 overflow-hidden">
|
||
<router-view />
|
||
</main>
|
||
</div>
|
||
</div>
|
||
</template>
|
||
|
||
<script setup lang="ts">
|
||
import Header from "./header/Header.vue"
|
||
import Aside from "./aside/Aside.vue"
|
||
|
||
const router = useRouter()
|
||
|
||
/** 点击标题栏“设置”按钮 → 跳转设置页 */
|
||
function goToSetting() {
|
||
router.push("/setting")
|
||
}
|
||
</script>
|