From 14abd6c7c0c7fd4c39e7b117adfcfe293a16d9ed Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E6=B2=A1=E5=A4=8D=E4=B9=A0?= <2353956224@qq.com>
Date: Mon, 19 Jan 2026 20:20:55 +0800
Subject: [PATCH] =?UTF-8?q?=E5=B7=A5=E4=BD=9C=E5=8F=B0=E8=87=AA=E9=80=82?=
 =?UTF-8?q?=E5=BA=94?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/views/HomeView.vue |  2 +-
 src/views/nav.vue      | 44 ++++++++++++++++++++++++++++++++++++++++--
 2 files changed, 43 insertions(+), 3 deletions(-)

diff --git a/src/views/HomeView.vue b/src/views/HomeView.vue
index 150fb1e..e5d398f 100644
--- a/src/views/HomeView.vue
+++ b/src/views/HomeView.vue
@@ -92,7 +92,7 @@ function switchLanguage(lang) {
 }
 
 const { getVersion, stopScript } = usePythonBridge();
-let version = ref('5.9.0');
+let version = ref('5.9.2');
 onMounted(() => {
 
 	stopScript();
diff --git a/src/views/nav.vue b/src/views/nav.vue
index 028d95b..27815c3 100644
--- a/src/views/nav.vue
+++ b/src/views/nav.vue
@@ -1,5 +1,5 @@
 <template>
-  <div class="bg-background-light dark:bg-background-dark text-slate-800 dark:text-slate-200 subtle-grid shadow-2xl overflow-hidden mx-auto" style="width: 1600px; height: 900px;">
+  <div class="nav-container bg-background-light dark:bg-background-dark text-slate-800 dark:text-slate-200 subtle-grid shadow-2xl overflow-hidden" :style="containerStyle">
     <div class="flex h-full overflow-hidden">
       <Sidebar class="flex-none h-full" @activeIndex="activeIndexFn" />
       <main class="flex-1 overflow-y-auto p-4 relative flex flex-col h-full bg-[#f3f5f9]">
@@ -23,15 +23,50 @@
 import Sidebar from '../components/Sidebar.vue';
 import hostsList from '@/views/hosts/hostsList.vue'
 import workbenches from '@/views/hosts/workbenches.vue'
-import { ref } from 'vue'
+import { ref, computed, onMounted, onUnmounted } from 'vue'
+
+// 设计稿尺寸
+const DESIGN_WIDTH = 1600
+const DESIGN_HEIGHT = 900
 
 let activeIndexA = ref(1)
 const version = ref('v0.1.0')
 
+// 缩放比例
+const zoomRatio = ref(1)
+
+// 计算缩放比例
+const calcZoom = () => {
+  const windowWidth = window.innerWidth
+  const windowHeight = window.innerHeight
+  
+  // 根据宽高比例计算缩放值，取较小值保证完整显示
+  const widthRatio = windowWidth / DESIGN_WIDTH
+  const heightRatio = windowHeight / DESIGN_HEIGHT
+  
+  zoomRatio.value = Math.min(widthRatio, heightRatio)
+}
+
+// 容器样式
+const containerStyle = computed(() => ({
+  width: `${DESIGN_WIDTH}px`,
+  height: `${DESIGN_HEIGHT}px`,
+  zoom: zoomRatio.value
+}))
+
 function activeIndexFn(data) {
   activeIndexA.value = data
   console.log(data)
 }
+
+onMounted(() => {
+  calcZoom()
+  window.addEventListener('resize', calcZoom)
+})
+
+onUnmounted(() => {
+  window.removeEventListener('resize', calcZoom)
+})
 </script>
 
 <style>
@@ -44,5 +79,10 @@ body {
   justify-content: center;
   align-items: center;
   min-height: 100vh;
+  overflow: hidden;
+}
+
+.nav-container {
+  transform-origin: center center;
 }
 </style>
\ No newline at end of file