33 lines
816 B
Vue
33 lines
816 B
Vue
|
<template>
|
||
|
|
<div id="app" class="h-screen bg-gray-50 flex">
|
||
|
|
<!-- 侧边栏 -->
|
||
|
|
<Sidebar />
|
||
|
|
|
||
|
|
<!-- 主内容区域 -->
|
||
|
|
<div class="flex-1 flex flex-col min-w-0">
|
||
|
|
<router-view />
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<!-- 报告抽屉 -->
|
||
|
|
<ReportDrawer />
|
||
|
|
|
||
|
|
<!-- 移动端遮罩层 -->
|
||
|
|
<div
|
||
|
|
v-if="mobileSidebarOpen"
|
||
|
|
class="fixed inset-0 bg-black bg-opacity-50 z-30 lg:hidden"
|
||
|
|
@click="toggleMobileSidebar"
|
||
|
|
/>
|
||
|
|
</div>
|
||
|
|
</template>
|
||
|
|
|
||
|
|
<script setup lang="ts">
|
||
|
|
import { storeToRefs } from 'pinia'
|
||
|
|
import { useAppStore } from '@/stores/app'
|
||
|
|
import Sidebar from '@/components/Sidebar.vue'
|
||
|
|
import ReportDrawer from '@/components/ReportDrawer.vue'
|
||
|
|
|
||
|
|
const appStore = useAppStore()
|
||
|
|
const { mobileSidebarOpen } = storeToRefs(appStore)
|
||
|
|
const { toggleMobileSidebar } = appStore
|
||
|
|
</script>
|