新增：应用配置管理模块，优化文件系统功能

- 新增 ConfigAPI 和 ConfigService 实现配置管理
- 新增 SettingsPanel 和 UpdateNotification 组件
- 文件系统模块化重构，提升代码质量
- 提取公共函数，优化代码结构
- 版本号更新至 0.2.0

web/src/components/UpdatePanel.vue

@@ -1,20 +1,35 @@
 <template>
   <div class="update-panel">
-    <a-card title="版本更新">
-      <a-space direction="vertical" style="width: 100%" :size="16">
+    <a-space direction="vertical" style="width: 100%" :size="20">
 
-        <!-- 当前版本信息 -->
-        <a-descriptions :column="3" bordered>
-          <a-descriptions-item label="当前版本">{{ currentVersion }}</a-descriptions-item>
-          <a-descriptions-item label="最后检查">{{ lastCheckTime }}</a-descriptions-item>
-          <a-descriptions-item label="自动检查">
-            <a-tag :color="config.auto_check_enabled ? 'green' : 'gray'">
-              {{ config.auto_check_enabled ? '已开启' : '已关闭' }}
-            </a-tag>
-          </a-descriptions-item>
-        </a-descriptions>
+      <!-- 当前版本信息 -->
+      <a-card title="版本信息" :bordered="false">
+        <a-row :gutter="16">
+          <a-col :span="12">
+            <div class="info-item">
+              <div class="info-label">当前版本</div>
+              <div class="info-value">{{ currentVersion }}</div>
+            </div>
+          </a-col>
+          <a-col :span="12">
+            <div class="info-item">
+              <div class="info-label">最后检查</div>
+              <div class="info-value">{{ lastCheckTime }}</div>
+            </div>
+          </a-col>
+        </a-row>
 
-        <!-- 检查更新 -->
+        <!-- 更新说明 -->
+        <div v-if="updateInfo && updateInfo.changelog" class="changelog-section">
+          <div class="changelog-title">
+            {{ updateInfo.has_update ? '最新版本更新内容' : '当前版本更新内容' }}
+          </div>
+          <div class="changelog">{{ updateInfo.changelog }}</div>
+        </div>
+      </a-card>
+
+      <!-- 检查更新 -->
+      <a-card title="检查更新" :bordered="false">
         <a-space>
           <a-button type="primary" @click="handleCheckUpdate" :loading="checking">
             <template #icon>
@@ -22,12 +37,6 @@
             </template>
             检查更新
           </a-button>
-          <a-button @click="showConfig = true">
-            <template #icon>
-              <icon-settings />
-            </template>
-            更新设置
-          </a-button>
         </a-space>
 
         <!-- 更新信息 -->
@@ -41,9 +50,6 @@
           </template>
           <div v-if="updateInfo.has_update">
             <p><strong>最新版本：</strong>{{ updateInfo.latest_version }}</p>
-            <p><strong>当前版本：</strong>{{ updateInfo.current_version }}</p>
-            <p v-if="updateInfo.changelog"><strong>更新日志：</strong></p>
-            <div v-if="updateInfo.changelog" class="changelog">{{ updateInfo.changelog }}</div>
             <p><strong>发布日期：</strong>{{ updateInfo.release_date }}</p>
             <a-space style="margin-top: 12px">
               <a-button
@@ -76,7 +82,7 @@
         <!-- 下载进度 -->
         <div v-if="downloadProgress > 0 || downloading" class="download-progress">
           <a-progress
-            :percent="downloadProgress"
+            :percent="downloadProgress / 100"
             :status="downloadStatus"
           />
           <div class="progress-info">
@@ -94,45 +100,16 @@
           <template #title>{{ installResult.success ? '安装成功' : '安装失败' }}</template>
           <p>{{ installResult.message }}</p>
         </a-alert>
+      </a-card>
 
-      </a-space>
-    </a-card>
-
-    <!-- 更新设置对话框 -->
-    <a-modal
-      v-model:visible="showConfig"
-      title="更新设置"
-      @ok="handleSaveConfig"
-      @cancel="handleCancelConfig"
-      :confirm-loading="saving"
-    >
-      <a-form :model="config" layout="vertical">
-        <a-form-item label="自动检查更新" field="auto_check_enabled">
-          <a-switch v-model="config.auto_check_enabled" />
-          <span style="margin-left: 8px">{{ config.auto_check_enabled ? '开启' : '关闭' }}</span>
-        </a-form-item>
-        <a-form-item label="检查间隔（分钟）" field="check_interval_minutes">
-          <a-input-number
-            v-model="config.check_interval_minutes"
-            :min="1"
-            :max="1440"
-            style="width: 200px"
-          />
-        </a-form-item>
-        <a-form-item label="更新检查地址" field="check_url">
-          <a-input
-            v-model="config.check_url"
-            placeholder="https://example.com/version.json"
-          />
-        </a-form-item>
-      </a-form>
-    </a-modal>
+    </a-space>
   </div>
 </template>
 
 <script setup>
 import { ref, onMounted, onUnmounted } from 'vue'
 import { Message, Modal } from '@arco-design/web-vue'
+import { IconCheck, IconClose } from '@arco-design/web-vue/es/icon'
 
 // 工具函数：解析事件数据
 const parseEventData = (event) => {
@@ -153,7 +130,6 @@ const saving = ref(false)
 const updateInfo = ref(null)
 const downloadedFile = ref(null)
 const installResult = ref(null)
-const showConfig = ref(false)
 const downloadProgress = ref(0)
 const downloadStatus = ref('active')
 
@@ -215,6 +191,45 @@ const loadConfig = async () => {
   }
 }
 
+// 配置变化时自动保存（防抖）
+let saveTimer = null
+const handleConfigChange = () => {
+  // 清除之前的定时器
+  if (saveTimer) {
+    clearTimeout(saveTimer)
+  }
+
+  // 设置新的定时器，1秒后保存
+  saveTimer = setTimeout(async () => {
+    await saveConfig()
+  }, 1000)
+}
+
+// 保存配置
+const saveConfig = async () => {
+  saving.value = true
+
+  try {
+    const result = await window.go.main.App.SetUpdateConfig(
+      config.value.auto_check_enabled,
+      config.value.check_interval_minutes,
+      config.value.check_url
+    )
+
+    if (result.success) {
+      Message.success('配置已自动保存')
+      await loadConfig()
+    } else {
+      Message.error(result.message || '保存配置失败')
+    }
+  } catch (error) {
+    console.error('保存配置失败:', error)
+    Message.error('保存配置失败：' + (error.message || error))
+  } finally {
+    saving.value = false
+  }
+}
+
 // 检查更新
 const handleCheckUpdate = async () => {
   checking.value = true
@@ -317,39 +332,6 @@ const handleInstall = async () => {
   })
 }
 
-// 保存配置
-const handleSaveConfig = async () => {
-  saving.value = true
-
-  try {
-    const result = await window.go.main.App.SetUpdateConfig(
-      config.value.auto_check_enabled,
-      config.value.check_interval_minutes,
-      config.value.check_url
-    )
-
-    if (result.success) {
-      Message.success('配置保存成功')
-      showConfig.value = false
-      await loadConfig()
-    } else {
-      Message.error(result.message || '保存配置失败')
-    }
-  } catch (error) {
-    console.error('保存配置失败:', error)
-    Message.error('保存配置失败：' + (error.message || error))
-  } finally {
-    saving.value = false
-  }
-}
-
-// 取消配置
-const handleCancelConfig = () => {
-  showConfig.value = false
-  // 恢复原始配置
-  loadConfig()
-}
-
 // 监听下载进度事件
 const onDownloadProgress = (event) => {
   const data = parseEventData(event)
@@ -359,7 +341,10 @@ const onDownloadProgress = (event) => {
     downloaded: data.downloaded || 0,
     total: data.total || 0
   }
-  downloadProgress.value = Math.round(data.progress || 0)
+  // 确保进度值在 0-100 之间
+  const rawProgress = data.progress || 0
+  downloadProgress.value = Math.min(100, Math.max(0, Math.round(rawProgress)))
+  console.log('[下载进度] 原始值:', rawProgress, '处理后:', downloadProgress.value)
 }
 
 // 监听下载完成事件
@@ -395,6 +380,11 @@ onUnmounted(() => {
     window.runtime.EventsOff('download-progress')
     window.runtime.EventsOff('download-complete')
   }
+
+  // 清除定时器
+  if (saveTimer) {
+    clearTimeout(saveTimer)
+  }
 })
 </script>
 
@@ -404,6 +394,36 @@ onUnmounted(() => {
   margin: 0 auto;
 }
 
+.info-item {
+  padding: 12px;
+  background: var(--color-fill-1);
+  border-radius: 6px;
+  text-align: center;
+}
+
+.info-label {
+  font-size: 12px;
+  color: var(--color-text-3);
+  margin-bottom: 8px;
+}
+
+.info-value {
+  font-size: 16px;
+  font-weight: 500;
+  color: var(--color-text-1);
+}
+
+.changelog-section {
+  margin-top: 16px;
+}
+
+.changelog-title {
+  font-size: 14px;
+  font-weight: 500;
+  color: var(--color-text-1);
+  margin-bottom: 8px;
+}
+
 .changelog {
   background: var(--color-fill-2);
   padding: 12px;
@@ -412,6 +432,9 @@ onUnmounted(() => {
   margin: 8px 0;
   max-height: 200px;
   overflow-y: auto;
+  font-size: 13px;
+  line-height: 1.6;
+  color: var(--color-text-2);
 }
 
 .download-progress {