feat: 添加主窗口自适应大小功能，页面缩放功能，支持缩放因子的调整和重置，并在搜索栏中提供缩放控制

src/renderer/hooks/useZoom.ts

@@ -0,0 +1,95 @@
+import { ref } from 'vue';
+
+/**
+ * 页面缩放功能的组合式API
+ * 提供页面缩放相关的状态和方法
+ */
+export function useZoom() {
+  // 缩放相关常量
+  const MIN_ZOOM = 0.5;
+  const MAX_ZOOM = 1.5;
+  const ZOOM_STEP = 0.05; // 5%的步长
+  
+  // 当前缩放因子
+  const zoomFactor = ref(1);
+  
+  // 初始化获取当前缩放比例
+  const initZoomFactor = async () => {
+    try {
+      const currentZoom = await window.ipcRenderer.invoke('get-content-zoom');
+      zoomFactor.value = currentZoom;
+    } catch (error) {
+      console.error('获取缩放比例失败:', error);
+    }
+  };
+  
+  // 增加缩放比例，保证100%为节点
+  const increaseZoom = () => {
+    let newZoom;
+    
+    // 如果当前缩放低于100%并且增加后会超过100%，则直接设为100%
+    if (zoomFactor.value < 1.0 && zoomFactor.value + ZOOM_STEP > 1.0) {
+      newZoom = 1.0; // 精确设置为100%
+    } else {
+      newZoom = Math.min(MAX_ZOOM, Math.round((zoomFactor.value + ZOOM_STEP) * 20) / 20);
+    }
+    
+    setZoomFactor(newZoom);
+  };
+  
+  // 减少缩放比例，保证100%为节点
+  const decreaseZoom = () => {
+    let newZoom;
+    
+    // 如果当前缩放大于100%并且减少后会低于100%，则直接设为100%
+    if (zoomFactor.value > 1.0 && zoomFactor.value - ZOOM_STEP < 1.0) {
+      newZoom = 1.0; // 精确设置为100%
+    } else {
+      newZoom = Math.max(MIN_ZOOM, Math.round((zoomFactor.value - ZOOM_STEP) * 20) / 20);
+    }
+    
+    setZoomFactor(newZoom);
+  };
+  
+  // 重置缩放比例到系统建议值
+  const resetZoom = async () => {
+    try {
+      window.ipcRenderer.send('reset-content-zoom');
+      // 重置后重新获取系统计算的缩放比例
+      const newZoom = await window.ipcRenderer.invoke('get-content-zoom');
+      zoomFactor.value = newZoom;
+    } catch (error) {
+      console.error('重置缩放比例失败:', error);
+    }
+  };
+  
+  // 设置为100%标准缩放
+  const setZoom100 = () => {
+    setZoomFactor(1.0);
+  };
+  
+  // 设置缩放比例
+  const setZoomFactor = (zoom: number) => {
+    window.ipcRenderer.send('set-content-zoom', zoom);
+    zoomFactor.value = zoom;
+  };
+  
+  // 检查是否为100%缩放
+  const isZoom100 = () => {
+    return Math.abs(zoomFactor.value - 1.0) < 0.001;
+  };
+
+  return {
+    zoomFactor,
+    initZoomFactor,
+    increaseZoom,
+    decreaseZoom,
+    resetZoom,
+    setZoom100,
+    setZoomFactor,
+    isZoom100,
+    MIN_ZOOM,
+    MAX_ZOOM,
+    ZOOM_STEP
+  };
+} 

src/renderer/layout/components/SearchBar.vue

@@ -62,6 +62,24 @@
             <i class="iconfont ri-settings-3-line"></i>
             <span>{{ t('comp.searchBar.set') }}</span>
           </div>
+          <div class="menu-item" v-if="isElectron">
+            <i class="iconfont ri-zoom-in-line"></i>
+            <span>{{ t('comp.searchBar.zoom')}}</span>
+            <div class="zoom-controls ml-auto">
+              <n-button quaternary circle size="tiny" @click="decreaseZoom">
+                <i class="ri-subtract-line"></i>
+              </n-button>
+              <n-tooltip trigger="hover">
+                <template #trigger>
+                  <span class="zoom-value" :class="{'zoom-100': isZoom100()}" @click="resetZoom">{{ Math.round(zoomFactor * 100) }}%</span>
+                </template>
+                {{ isZoom100() ? t('comp.searchBar.zoom100'): t('comp.searchBar.resetZoom')}}
+              </n-tooltip>
+              <n-button quaternary circle size="tiny" @click="increaseZoom">
+                <i class="ri-add-line"></i>
+              </n-button>
+            </div>
+          </div>
           <div class="menu-item">
             <i class="iconfont" :class="isDark ? 'ri-moon-line' : 'ri-sun-line'"></i>
             <span>{{ t('comp.searchBar.theme') }}</span>
@@ -114,11 +132,12 @@ import { getUserDetail } from '@/api/login';
 import alipay from '@/assets/alipay.png';
 import wechat from '@/assets/wechat.png';
 import Coffee from '@/components/Coffee.vue';
+import { useZoom } from '@/hooks/useZoom';
 import { SEARCH_TYPES, USER_SET_OPTIONS } from '@/const/bar-const';
 import { useSearchStore } from '@/store/modules/search';
 import { useSettingsStore } from '@/store/modules/settings';
 import { useUserStore } from '@/store/modules/user';
-import { getImgUrl } from '@/utils';
+import { getImgUrl, isElectron } from '@/utils';
 import { checkUpdate, UpdateResult } from '@/utils/update';
 
 import config from '../../../../package.json';
@@ -130,6 +149,16 @@ const userStore = useUserStore();
 const userSetOptions = ref(USER_SET_OPTIONS);
 const { t } = useI18n();
 
+// 使用缩放hook
+const { 
+  zoomFactor, 
+  initZoomFactor, 
+  increaseZoom, 
+  decreaseZoom, 
+  resetZoom, 
+  isZoom100 
+} = useZoom();
+
 // 显示返回按钮
 const showBackButton = computed(() => {
   return router.currentRoute.value.meta.back === true;
@@ -182,6 +211,7 @@ onMounted(() => {
   loadHotSearchKeyword();
   loadPage();
   checkForUpdates();
+  isElectron && initZoomFactor();
 });
 
 const isDark = computed({
@@ -381,6 +411,23 @@ const toGithubRelease = () => {
           @apply bg-gray-100 dark:bg-gray-700 text-gray-600 dark:text-gray-300;
         }
       }
+      
+      // 缩放控制样式
+      .zoom-controls {
+        @apply flex items-center gap-1;
+        
+        .zoom-value {
+          @apply text-xs px-2 py-0.5 rounded cursor-pointer;
+          @apply bg-gray-100 dark:bg-gray-700 text-gray-600 dark:text-gray-300;
+          @apply hover:bg-gray-200 dark:hover:bg-gray-600;
+          transition: all 0.2s ease;
+          
+          &.zoom-100 {
+            @apply bg-green-100 dark:bg-green-900 text-green-700 dark:text-green-300 font-bold;
+            @apply hover:bg-green-200 dark:hover:bg-green-800;
+          }
+        }
+      }
     }
   }
 }