first commit

src/layouts/MainLayout.vue

@@ -0,0 +1,28 @@
+<script setup>
+import { useUiStore } from '@/stores/ui'
+import LeftArea from '@/components/left-area/LeftArea.vue'
+import ResizeHandle from '@/components/common/ResizeHandle.vue'
+
+const uiStore = useUiStore()
+</script>
+
+<template>
+  <div class="flex h-full w-full overflow-hidden">
+    <!-- 左侧栏 -->
+    <aside
+      v-show="!uiStore.leftCollapsed"
+      class="flex-shrink-0 h-full overflow-hidden border-r"
+      :style="{ width: uiStore.leftWidth + 'px', borderColor: 'var(--p-surface-200)', backgroundColor: 'var(--p-surface-50)' }"
+    >
+      <LeftArea />
+    </aside>
+
+    <!-- 拖拽手柄 -->
+    <ResizeHandle v-show="!uiStore.leftCollapsed" />
+
+    <!-- 右侧区域 -->
+    <main class="flex-1 h-full overflow-hidden" :style="{ backgroundColor: 'var(--p-surface-0)' }">
+      <router-view />
+    </main>
+  </div>
+</template>