✨ 优化 SFTP 配置流程和界面

前端优化：
- 重新设计 SFTP 配置引导弹窗，采用渐变色头部
- 新增独立的 SFTP 配置弹窗，支持导入 .inf 配置文件
- 移除 forceSftpConfigVisible 标志，改用弹窗方式
- 简化存储切换逻辑，提升用户体验
- 优化配置表单布局和提示文字

交互改进：
- 支持拖拽导入配置文件
- 优化配置流程，更加直观
- 改进错误提示和操作引导

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>

frontend/app.js

@@ -209,15 +209,13 @@ createApp({
       checkingUploadTool: false, // 是否正在检测上传工具
       uploadingTool: false, // 是否正在上传工具
 
-      // 强制显示SFTP配置（用于本地存储模式下临时显示SFTP配置）
-      forceSftpConfigVisible: false,
-
       // 存储切换状态
       storageSwitching: false,
       storageSwitchTarget: null,
 
       // SFTP配置引导弹窗
-      showSftpGuideModal: false
+      showSftpGuideModal: false,
+      showSftpConfigModal: false
     };
   },
 
@@ -399,6 +397,7 @@ handleDragLeave(e) {
               } else {
                 this.currentView = 'settings';
                 alert('欢迎！请先配置您的SFTP服务器');
+                this.openSftpConfigModal();
               }
             } else {
               // 默认行为：跳转到文件页面
@@ -530,8 +529,8 @@ handleDragLeave(e) {
             }
           }
 
-          // 重置强制显示标志
-          this.forceSftpConfigVisible = false;
+          // 关闭配置弹窗
+          this.showSftpConfigModal = false;
 
           // 刷新到文件页面
           this.currentView = 'files';
@@ -1819,29 +1818,6 @@ handleDragLeave(e) {
 
     // 用户切换存储方式
     async switchStorage(type) {
-      // 检查是否尝试切换到SFTP但未配置
-      if (type === 'sftp' && !this.user.has_ftp_config) {
-        const goToSettings = confirm('您还未配置SFTP服务器。\n\n是否现在前往设置页面进行配置？配置完成后将自动切换到SFTP存储。');
-        if (goToSettings) {
-          // 直接设置视图并加载配置，避免switchView的重复检查
-          this.currentView = 'settings';
-          // 强制显示SFTP配置区域
-          this.forceSftpConfigVisible = true;
-          // 如果是普通用户，手动加载SFTP配置
-          if (this.user && !this.user.is_admin) {
-            this.loadFtpConfig();
-          }
-          // 等待DOM更新后滚动到SFTP配置区域
-          this.$nextTick(() => {
-            const sftpSection = document.getElementById('sftp-config-section');
-            if (sftpSection) {
-              sftpSection.scrollIntoView({ behavior: 'smooth', block: 'start' });
-            }
-          });
-        }
-        return;
-      }
-
       if (this.storageSwitching || type === this.storageType) {
         return;
       }
@@ -1881,17 +1857,7 @@ handleDragLeave(e) {
     },
 
     ensureSftpConfigSection() {
-      this.currentView = 'settings';
-      this.forceSftpConfigVisible = true;
-      if (this.user && !this.user.is_admin) {
-        this.loadFtpConfig();
-      }
-      this.$nextTick(() => {
-        const sftpSection = document.getElementById('sftp-config-section');
-        if (sftpSection) {
-          sftpSection.scrollIntoView({ behavior: 'smooth', block: 'start' });
-        }
-      });
+      this.openSftpConfigModal();
     },
 
     openSftpGuideModal() {
@@ -1907,6 +1873,18 @@ handleDragLeave(e) {
       this.ensureSftpConfigSection();
     },
 
+    openSftpConfigModal() {
+      this.showSftpGuideModal = false;
+      this.showSftpConfigModal = true;
+      if (this.user && !this.user.is_admin) {
+        this.loadFtpConfig();
+      }
+    },
+
+    closeSftpConfigModal() {
+      this.showSftpConfigModal = false;
+    },
+
     // 切换视图并自动刷新数据
     switchView(view) {
       // 如果已经在当前视图，不重复刷新
@@ -1916,11 +1894,6 @@ handleDragLeave(e) {
 
       this.currentView = view;
 
-      // 离开settings页面时，重置强制显示SFTP配置的标志
-      if (this.currentView !== 'settings') {
-        this.forceSftpConfigVisible = false;
-      }
-
       // 根据视图类型自动加载对应数据
       switch (view) {
         case 'files':