feat: implement main window layout strategy

frontend/src/App.vue

@@ -18,20 +18,21 @@ onMounted(() => {
 </script>
 
 <template>
-  <ConfigProvider :theme="themeConfig" >
+  <ConfigProvider :theme="themeConfig">
+    <div class="app-root">
       <router-view />
+    </div>
   </ConfigProvider>
 </template>
 
 <style scoped>
-html, body {
-  margin: 0;
-  overflow-x: hidden; /* 禁止横向滚动 */
-}
-/* 可选：全局背景适配 */
-body {
-  @apply bg-white dark:bg-gray-900 text-black dark:text-white;
+.app-root {
+  width: 100%;
+  height: 100vh;
+  min-width: 0;
+  overflow: hidden;
 }
+
 .drag-region {
   -webkit-app-region: drag;
   --wails-draggable: drag;

frontend/src/components/Dashboard/Index.vue

@@ -1,6 +1,6 @@
 <template>
-  <div class="  text-slate-800 font-sans  dark:text-white">
-    <div class="max-w-4xl mx-auto pl-6 pr-6">
+  <div class="min-h-full w-full text-slate-800 font-sans dark:text-white">
+    <div class="mx-auto w-full max-w-7xl px-6">
       <header class="flex items-center justify-between mb-6">
         <div class="relative w-2/3">
           <span class="absolute inset-y-0 left-0 pl-3 flex items-center text-slate-400">

frontend/src/components/General/Index.vue

@@ -9,7 +9,7 @@ const modelValue = ref(false)
 </script>
 
 <template > 
-<div >
+<div class="w-full">
   <section > 
     <!-- 外观设置 -->
         <h2 class="text-lg font-bold text-gray-800 dark:text-white"  >{{ $t('components.general.title.exterior') }}</h2>
@@ -67,4 +67,4 @@ const modelValue = ref(false)
     font-size:13px;
     color:#999;
  }
-</style>
+</style>

frontend/src/components/Main/Index.vue

@@ -1,17 +1,17 @@
 <template>
-  <div class="flex h-screen  font-sans text-slate-900">
+  <div class="flex h-screen w-full min-w-0 overflow-hidden font-sans text-slate-900 dark:text-white">
     <!-- 左侧请求栏 -->
     <aside
-      class="w-44 border-r border-slate-200  bg-white flex flex-col dark:bg-gray-800 dark:text-white dark:border-slate-600"
+      class="w-44 shrink-0 border-r border-slate-200 bg-white flex flex-col dark:bg-gray-800 dark:text-white dark:border-slate-600"
       :class="ismacos ? 'pt-10 ' : 'pt-8'">
-      <nav class="flex-1  px-4 space-y-1 dark:bg-gray-800">
+      <nav class="min-h-0 flex-1 overflow-y-auto px-4 space-y-1 dark:bg-gray-800">
         <div v-for="(item, index) in requests" :key="index" @click="handleMenu(item)"
           :class="[' flex items-center gap-3 px-3 py-2  text-indigo-700 cursor-pointer rounded-xl font-medium dark:text-white', selected === item.id ? 'bg-indigo-50 dark:bg-slate-500' : ' hover:bg-slate-50 text-slate-500 dark:hover:bg-slate-700']">
           <component :is="item.icon" />
           {{ item.label }}
         </div>
       </nav>
-      <div class="pl-4 pr-4 pt-2 pb-2 border-t border-slate-100 flex items-center gap-3 dark:border-slate-600 ">
+      <div class="shrink-0 pl-4 pr-4 pt-2 pb-2 border-t border-slate-100 flex items-center gap-3 dark:border-slate-600 ">
         <img src="https://api.dicebear.com/7.x/avataaars/svg?seed=JinGong8"
           class="w-10 h-10 rounded-full bg-slate-200" />
         <div class="text-sm">
@@ -21,8 +21,8 @@
       </div>
     </aside>
     <!-- 右侧整体 -->
-    <div class="flex-1 flex flex-col bg-gray-50 dark:bg-gray-950">
-      <div v-if="iswindows" class="titlebar drag-region pt-4 px-4 mb-2  text-white flex items-center justify-between">
+    <div class="min-w-0 flex-1 flex flex-col bg-gray-50 dark:bg-gray-950">
+      <div v-if="iswindows" class="titlebar drag-region shrink-0 pt-4 px-4 mb-2 text-white flex items-center justify-between">
         <div class="drag-area">
         </div>
         <div class="window-controls">
@@ -39,8 +39,10 @@
         </div>
       </div>
       <!-- 主内容 -->
-      <main class="flex-1  overflow-y-auto max-h-screen scroll-container  scrollbar-thin" :class="iswindows ? 'px-4 pt-px pb-4' : 'p-4'">
-        <component :is="getComponent" />
+      <main class="min-h-0 w-full flex-1 overflow-y-auto scroll-container scrollbar-thin" :class="iswindows ? 'px-4 pt-px pb-4' : 'p-4'">
+        <div class="min-h-full w-full">
+          <component :is="getComponent" />
+        </div>
       </main>
     </div>
   </div>

frontend/src/components/Tags/Index.vue

@@ -1,7 +1,7 @@
 <template>
-  <div class="flex h-full ">
+  <div class="flex h-full w-full min-w-0 overflow-hidden">
     <!-- Left List -->
-    <div class=" pl-1 pb-2 pr-1 flex flex-col" :class="currentTag === null ? 'w-3/5 ' : 'w-2/5'">
+    <div class="min-w-0 pl-1 pb-2 pr-1 flex flex-col" :class="currentTag === null ? 'w-3/5 ' : 'w-2/5'">
       <div class="mr-2 ml-1">
         <h2 class="text-lg font-bold text-gray-800 dark:text-white float-left">
           {{ $t('components.tags.title.manage_tags') }}
@@ -39,7 +39,7 @@
     </div>
 
     <!-- Right Editor -->
-    <div class="flex w-3/5 pt-2 pb-6   bg-white  rounded-lg dark:bg-gray-800">
+    <div class="flex min-w-0 w-3/5 pt-2 pb-6 bg-white rounded-lg dark:bg-gray-800">
       <div v-if="currentTag" class="w-full">
         <div class="w-full mb-4 px-5  border-b gap-2  items-center  dark:border-gray-700">
           <div class="float-right flex gap-2 pt-1 w-[20%] justify-end">
@@ -381,4 +381,4 @@ function removeSubTag(index: number) {
 .tag.active {
   @apply bg-purple-100 text-purple-600;
 }
-</style>
+</style>

frontend/src/main.ts

@@ -9,9 +9,6 @@ import router from './router/index'
 import { GetLanguage } from '../bindings/cmbone/internal/services/appconfigservice'
 
 initTheme()
-if (window.location.hash === '' || window.location.hash === '#/') {
-  router.replace('/second')
-}
 async function bootstrap(){
     await setupI18n('zh')//默认语言或从后端读取
     createApp(App).use(Antd).use(router).use(i18n).mount('#app')

frontend/src/pages/Home/Index.vue

@@ -69,7 +69,7 @@ async function handleOCR() {
 
 <template>
   <div
-    class="flex  items-start justify-center pt-8 h-screen w-screen h-full w-full  font-sans select-none bg-gray-100 drag-region dark:bg-gray-900">
+    class="flex h-screen w-screen items-start justify-center overflow-hidden pt-8 font-sans select-none bg-gray-100 drag-region dark:bg-gray-900">
     <TransitionGroup name="card" tag="div"> 
       <div
         class="flex-1  w-[300px] rounded-2xl bg-white/80  dark:bg-gray-700 dark:text-white backdrop-blur-md px-4 py-2 shadow-[0_8px_24px_rgba(0,0,0,0.12)] transition">

frontend/src/style.css

@@ -1,3 +1,25 @@
 @tailwind base;
 @tailwind components;
-@tailwind utilities;
+@tailwind utilities;
+
+html,
+body,
+#app {
+  width: 100%;
+  height: 100%;
+  margin: 0;
+  overflow: hidden;
+}
+
+* {
+  box-sizing: border-box;
+}
+
+body {
+  @apply bg-white text-black dark:bg-gray-900 dark:text-white;
+}
+
+.drag-region {
+  -webkit-app-region: drag;
+  --wails-draggable: drag;
+}