codexmate 0.0.10 → 0.0.13

package/web-ui/app.js

@@ -58,6 +58,7 @@
                     currentProvider: '',
                     currentModel: '',
                     serviceTier: 'fast',
+                    modelReasoningEffort: 'high',
                     providersList: [],
                     models: [],
                     codexModelsLoading: false,
@@ -80,8 +81,10 @@
                     showOpenclawConfigModal: false,
                     showConfigTemplateModal: false,
                     showAgentsModal: false,
+                    showInstallModal: false,
                     configTemplateContent: '',
                     configTemplateApplying: false,
+                    codexApplying: false,
                     agentsContent: '',
                     agentsPath: '',
                     agentsExists: false,
@@ -91,9 +94,9 @@
                     agentsContext: 'codex',
                     agentsModalTitle: 'AGENTS.md 编辑器',
                     agentsModalHint: '保存后会写入目标 AGENTS.md（与 config.toml 同级）。',
-                    sessionsList: [],
-                    sessionsLoading: false,
-                    sessionFilterSource: 'codex',
+                    sessionsList: [],
+                    sessionsLoading: false,
+                    sessionFilterSource: 'all',
                     sessionPathFilter: '',
                     sessionQuery: '',
                     sessionRoleFilter: 'all',
@@ -134,8 +137,35 @@
                     claudeSpeedLoading: {},
                     claudeShareLoading: {},
                     providerShareLoading: {},
+                    installPackageManager: 'npm',
+                    installCommandAction: 'install',
+                    installRegistryPreset: 'default',
+                    installRegistryCustom: '',
+                    installStatusTargets: [
+                        {
+                            id: 'claude',
+                            name: 'Claude Code CLI',
+                            packageName: '@anthropic-ai/claude-code',
+                            installed: false,
+                            bin: 'claude',
+                            version: '',
+                            commandPath: '',
+                            error: ''
+                        },
+                        {
+                            id: 'codex',
+                            name: 'Codex CLI',
+                            packageName: '@openai/codex',
+                            installed: false,
+                            bin: 'codex',
+                            version: '',
+                            commandPath: '',
+                            error: ''
+                        }
+                    ],
                     newProvider: { name: '', url: '', key: '' },
-                    editingProvider: { name: '', url: '', key: '' },
+                    resetConfigLoading: false,
+                    editingProvider: { name: '', url: '', key: '', readOnly: false, nonEditable: false },
                     newModelName: '',
                     currentClaudeConfig: '',
                     currentClaudeModel: '',
@@ -201,7 +231,34 @@
                     openclawMissingProviders: [],
                     healthCheckLoading: false,
                     healthCheckResult: null,
-                    healthCheckRemote: false
+                    healthCheckRemote: false,
+                    claudeDownloadLoading: false,
+                    claudeDownloadProgress: 0,
+                    claudeDownloadTimer: null,
+                    codexDownloadLoading: false,
+                    codexDownloadProgress: 0,
+                    codexDownloadTimer: null,
+                    claudeImportLoading: false,
+                    codexImportLoading: false,
+                    codexAuthProfiles: [],
+                    codexAuthImportLoading: false,
+                    codexAuthSwitching: {},
+                    codexAuthDeleting: {},
+                    proxySettings: {
+                        enabled: false,
+                        host: '127.0.0.1',
+                        port: 8318,
+                        provider: '',
+                        authSource: 'provider',
+                        timeoutMs: 30000
+                    },
+                    proxyRuntime: null,
+                    proxyLoading: false,
+                    proxySaving: false,
+                    proxyStarting: false,
+                    proxyStopping: false,
+                    proxyApplying: false,
+                    showProxyAdvanced: false
                 }
             },
             mounted() {
@@ -248,19 +305,19 @@
                 this.loadAll();
             },
 
-            computed: {
-                isSessionQueryEnabled() {
-                    return isSessionQueryEnabled(this.sessionFilterSource);
-                },
-                sessionQueryPlaceholder() {
-                    if (this.isSessionQueryEnabled) {
-                        return '关键词检索（支持 Codex/Claude，例：claude code）';
-                    }
-                    return '当前来源暂不支持关键词检索';
-                },
-                claudeModelHasList() {
-                    return Array.isArray(this.claudeModels) && this.claudeModels.length > 0;
-                },
+            computed: {
+                isSessionQueryEnabled() {
+                    return isSessionQueryEnabled(this.sessionFilterSource);
+                },
+                sessionQueryPlaceholder() {
+                    if (this.isSessionQueryEnabled) {
+                        return '关键词检索（支持 Codex/Claude，例：claude code）';
+                    }
+                    return '当前来源暂不支持关键词检索';
+                },
+                claudeModelHasList() {
+                    return Array.isArray(this.claudeModels) && this.claudeModels.length > 0;
+                },
                 claudeModelOptions() {
                     const list = Array.isArray(this.claudeModels) ? [...this.claudeModels] : [];
                     const current = (this.currentClaudeModel || '').trim();
@@ -268,6 +325,162 @@
                         list.unshift(current);
                     }
                     return list;
+                },
+                proxyProviderOptions() {
+                    const source = Array.isArray(this.providersList) ? this.providersList : [];
+                    const list = source
+                        .map((item) => (item && typeof item.name === 'string' ? item.name.trim() : ''))
+                        .filter((name) => name && name !== 'codexmate-proxy');
+                    return Array.from(new Set(list));
+                },
+                proxyRuntimeDisplayProvider() {
+                    if (!this.proxyRuntime) return '';
+                    const value = typeof this.proxyRuntime.provider === 'string'
+                        ? this.proxyRuntime.provider.trim()
+                        : '';
+                    return value || 'local';
+                },
+                installTargetCards() {
+                    const targets = Array.isArray(this.installStatusTargets) ? this.installStatusTargets : [];
+                    const action = this.normalizeInstallAction(this.installCommandAction);
+                    return targets.map((target) => {
+                        const id = target && typeof target.id === 'string' ? target.id : '';
+                        return {
+                            ...target,
+                            command: this.getInstallCommand(id, action)
+                        };
+                    });
+                },
+                installRegistryPreview() {
+                    return this.resolveInstallRegistryUrl(this.installRegistryPreset, this.installRegistryCustom);
+                },
+                inspectorMainTabLabel() {
+                    if (this.mainTab === 'config') return '配置中心';
+                    if (this.mainTab === 'sessions') return '会话浏览';
+                    if (this.mainTab === 'settings') return '设置';
+                    return '未知';
+                },
+                inspectorConfigModeLabel() {
+                    if (this.mainTab !== 'config') return '--';
+                    if (this.configMode === 'codex') return 'Codex';
+                    if (this.configMode === 'claude') return 'Claude Code';
+                    if (this.configMode === 'openclaw') return 'OpenClaw';
+                    return '未选择';
+                },
+                inspectorCurrentConfigLabel() {
+                    if (this.mainTab !== 'config') return '--';
+                    if (this.configMode === 'codex') {
+                        const provider = typeof this.currentProvider === 'string' ? this.currentProvider.trim() : '';
+                        return provider || '未选择';
+                    }
+                    if (this.configMode === 'claude') {
+                        const config = typeof this.currentClaudeConfig === 'string' ? this.currentClaudeConfig.trim() : '';
+                        return config || '未选择';
+                    }
+                    const openclaw = typeof this.currentOpenclawConfig === 'string' ? this.currentOpenclawConfig.trim() : '';
+                    return openclaw || '未选择';
+                },
+                inspectorCurrentModelLabel() {
+                    if (this.mainTab !== 'config') return '--';
+                    if (this.configMode === 'codex') {
+                        const model = typeof this.currentModel === 'string' ? this.currentModel.trim() : '';
+                        return model || '未选择';
+                    }
+                    if (this.configMode === 'claude') {
+                        const model = typeof this.currentClaudeModel === 'string' ? this.currentClaudeModel.trim() : '';
+                        return model || '未选择';
+                    }
+                    const model = this.openclawStructured && typeof this.openclawStructured.agentPrimary === 'string'
+                        ? this.openclawStructured.agentPrimary.trim()
+                        : '';
+                    return model || '按配置文件';
+                },
+                inspectorTemplateStatus() {
+                    if (this.mainTab !== 'config') return '--';
+                    if (this.configMode === 'codex') {
+                        if (this.configTemplateApplying || this.codexApplying) {
+                            return '模板应用中';
+                        }
+                        return '模板可编辑（手动确认应用）';
+                    }
+                    if (this.configMode === 'claude') {
+                        return '即时写入 Claude settings';
+                    }
+                    if (this.openclawApplying || this.openclawSaving) {
+                        return 'OpenClaw 保存/应用中';
+                    }
+                    return 'JSON5 可保存并应用';
+                },
+                inspectorBusyStatus() {
+                    const tasks = [];
+                    if (this.loading) tasks.push('初始化');
+                    if (this.sessionsLoading) tasks.push('会话加载');
+                    if (this.codexModelsLoading || this.claudeModelsLoading) tasks.push('模型加载');
+                    if (this.codexApplying || this.configTemplateApplying || this.openclawApplying) tasks.push('配置应用');
+                    if (this.agentsSaving) tasks.push('AGENTS 保存');
+                    if (this.proxySaving || this.proxyApplying || this.proxyStarting || this.proxyStopping) tasks.push('代理更新');
+                    return tasks.length ? tasks.join(' / ') : '空闲';
+                },
+                inspectorMessageSummary() {
+                    const value = typeof this.message === 'string' ? this.message.trim() : '';
+                    return value || '暂无提示';
+                },
+                inspectorSessionSourceLabel() {
+                    if (this.sessionFilterSource === 'codex') return 'Codex';
+                    if (this.sessionFilterSource === 'claude') return 'Claude Code';
+                    return '全部';
+                },
+                inspectorSessionPathLabel() {
+                    const value = typeof this.sessionPathFilter === 'string' ? this.sessionPathFilter.trim() : '';
+                    return value || '全部路径';
+                },
+                inspectorSessionQueryLabel() {
+                    if (!this.isSessionQueryEnabled) return '当前来源不支持';
+                    const value = typeof this.sessionQuery === 'string' ? this.sessionQuery.trim() : '';
+                    return value || '未设置';
+                },
+                inspectorHealthStatus() {
+                    if (this.initError) return '读取失败';
+                    if (this.loading) return '初始化中';
+                    return '正常';
+                },
+                inspectorHealthTone() {
+                    if (this.initError) return 'error';
+                    if (this.loading) return 'warn';
+                    return 'ok';
+                },
+                inspectorModelLoadStatus() {
+                    if (this.codexModelsLoading || this.claudeModelsLoading) {
+                        return '加载中';
+                    }
+                    if (this.modelsSource === 'error' || this.claudeModelsSource === 'error') {
+                        return '加载异常';
+                    }
+                    return '正常';
+                },
+                inspectorProxyStatus() {
+                    if (this.proxySaving || this.proxyApplying || this.proxyStarting || this.proxyStopping) {
+                        return '状态更新中';
+                    }
+                    if (this.proxyRuntime && this.proxyRuntime.running === true) {
+                        return `运行中（${this.proxyRuntimeDisplayProvider}）`;
+                    }
+                    return '未运行';
+                },
+                installTroubleshootingTips() {
+                    const platform = this.resolveInstallPlatform();
+                    if (platform === 'win32') {
+                        return [
+                            'PowerShell 报权限不足（EACCES/EPERM）时，请以管理员身份执行安装命令。',
+                            '安装后若仍提示找不到命令，重开终端并执行：where codex / where claude。',
+                            '公司网络受限时，可先切换镜像源快捷项（npmmirror / 腾讯云 / 自定义）。'
+                        ];
+                    }
+                    return [
+                        '出现 EACCES 权限错误时，优先修复 Node 全局目录权限，不建议直接 sudo npm。',
+                        '安装后若命令未生效，重开终端并执行：which codex / which claude。',
+                        '公司网络受限时，可先切换镜像源快捷项（npmmirror / 腾讯云 / 自定义）。'
+                    ];
                 }
             },
             methods: {
@@ -275,8 +488,7 @@
                     this.loading = true;
                     this.initError = '';
                     try {
-                        const statusRes = await api('status');
-                        const listRes = await api('list');
+                        const [statusRes, listRes] = await Promise.all([api('status'), api('list')]);
 
                         if (statusRes.error) {
                             this.initError = statusRes.error;
@@ -289,13 +501,18 @@
                                     : '';
                                 this.serviceTier = tier === 'fast' ? 'fast' : (tier ? 'standard' : 'fast');
                             }
+                            {
+                                const effort = typeof statusRes.modelReasoningEffort === 'string'
+                                    ? statusRes.modelReasoningEffort.trim().toLowerCase()
+                                    : '';
+                                this.modelReasoningEffort = effort || 'high';
+                            }
                             this.providersList = listRes.providers;
-                            await this.loadModelsForProvider(this.currentProvider);
                             if (statusRes.configReady === false) {
-                                this.showMessage(statusRes.configNotice || '未检测到 config.toml，已加载默认模板。请在模板编辑器确认后创建。', 'info');
+                                this.showMessage('配置已加载', 'info');
                             }
                             if (statusRes.initNotice) {
-                                this.showMessage(statusRes.initNotice, 'info');
+                                this.showMessage('配置就绪', 'info');
                             }
                             this.maybeShowStarPrompt();
                         }
@@ -304,6 +521,22 @@
                     } finally {
                         this.loading = false;
                     }
+
+                    // 模型加载单独异步，不阻塞主 loading
+                    try {
+                        await this.loadModelsForProvider(this.currentProvider);
+                    } catch (e) {
+                        // loadModelsForProvider 内部已有 toast，这里吞掉防止抛出
+                    }
+
+                    try {
+                        await Promise.all([
+                            this.loadCodexAuthProfiles(),
+                            this.loadProxyStatus()
+                        ]);
+                    } catch (e) {
+                        // 认证/代理状态加载失败不阻塞主界面
+                    }
                 },
 
                 async loadModelsForProvider(providerName) {
@@ -324,7 +557,7 @@
                             return;
                         }
                         if (res.error) {
-                            this.showMessage('模型列表获取失败: ' + res.error, 'error');
+                            this.showMessage('获取模型列表失败', 'error');
                             this.models = [];
                             this.modelsSource = 'error';
                             this.modelsHasCurrent = true;
@@ -335,7 +568,7 @@
                         this.modelsSource = res.source || 'remote';
                         this.modelsHasCurrent = !!this.currentModel && list.includes(this.currentModel);
                     } catch (e) {
-                        this.showMessage('模型列表获取失败: ' + e.message, 'error');
+                        this.showMessage('获取模型列表失败', 'error');
                         this.models = [];
                         this.modelsSource = 'error';
                         this.modelsHasCurrent = true;
@@ -380,7 +613,7 @@
                         const res = await api('get-claude-settings');
                         if (res && res.error) {
                             if (!silent) {
-                                this.showMessage('读取 Claude 配置失败: ' + res.error, 'error');
+                                this.showMessage('读取配置失败', 'error');
                             }
                             return;
                         }
@@ -403,7 +636,7 @@
                         }
                     } catch (e) {
                         if (!silent) {
-                            this.showMessage('读取 Claude 配置失败: ' + e.message, 'error');
+                            this.showMessage('读取配置失败', 'error');
                         }
                     }
                 },
@@ -454,7 +687,7 @@
                             return;
                         }
                         if (res.error) {
-                            this.showMessage('模型列表获取失败: ' + res.error, 'error');
+                            this.showMessage('获取模型列表失败', 'error');
                             this.claudeModels = [];
                             this.claudeModelsSource = 'error';
                             this.claudeModelsHasCurrent = true;
@@ -465,7 +698,7 @@
                         this.claudeModelsSource = res.source || 'remote';
                         this.updateClaudeModelsCurrent();
                     } catch (e) {
-                        this.showMessage('模型列表获取失败: ' + e.message, 'error');
+                        this.showMessage('获取模型列表失败', 'error');
                         this.claudeModels = [];
                         this.claudeModelsSource = 'error';
                         this.claudeModelsHasCurrent = true;
@@ -483,7 +716,7 @@
                     if (localStorage.getItem(storageKey)) {
                         return;
                     }
-                    this.showMessage('如果 Codex Mate 对你有帮助，欢迎到 GitHub 点个 Star。', 'info');
+                    this.showMessage('欢迎到 GitHub 点 Star', 'info');
                     localStorage.setItem(storageKey, '1');
                 },
 
@@ -593,7 +826,7 @@
                 openSessionStandalone(session) {
                     const url = this.buildSessionStandaloneUrl(session);
                     if (!url) {
-                        this.showMessage('当前会话无法生成新页链接', 'error');
+                        this.showMessage('无法生成链接', 'error');
                         return;
                     }
                     window.open(url, '_blank', 'noopener');
@@ -674,38 +907,79 @@
                 copyAgentsContent() {
                     const text = typeof this.agentsContent === 'string' ? this.agentsContent : '';
                     if (!text) {
-                        this.showMessage('没有可复制的内容', 'info');
+                        this.showMessage('没有可复制内容', 'info');
+                        return;
+                    }
+                    const ok = this.fallbackCopyText(text);
+                    if (ok) {
+                        this.showMessage('已复制', 'success');
+                        return;
+                    }
+                    this.showMessage('复制失败', 'error');
+                },
+
+                exportAgentsContent() {
+                    const text = typeof this.agentsContent === 'string' ? this.agentsContent : '';
+                    if (!text) {
+                        this.showMessage('没有可导出内容', 'info');
+                        return;
+                    }
+                    const now = new Date();
+                    const year = String(now.getFullYear());
+                    const month = String(now.getMonth() + 1).padStart(2, '0');
+                    const day = String(now.getDate()).padStart(2, '0');
+                    const hour = String(now.getHours()).padStart(2, '0');
+                    const minute = String(now.getMinutes()).padStart(2, '0');
+                    const second = String(now.getSeconds()).padStart(2, '0');
+                    const fileName = `agent-${year}${month}${day}-${hour}${minute}${second}.txt`;
+                    this.downloadTextFile(fileName, text, 'text/plain;charset=utf-8');
+                    this.showMessage(`已导出 ${fileName}`, 'success');
+                },
+
+                async copyInstallCommand(cmd) {
+                    const text = typeof cmd === 'string' ? cmd.trim() : '';
+                    if (!text) {
+                        this.showMessage('没有可复制内容', 'info');
                         return;
                     }
+                    try {
+                        if (navigator.clipboard && window.isSecureContext) {
+                            await navigator.clipboard.writeText(text);
+                            this.showMessage('已复制命令', 'success');
+                            return;
+                        }
+                    } catch (e) {
+                        // fallback to legacy copy path
+                    }
                     const ok = this.fallbackCopyText(text);
                     if (ok) {
-                        this.showMessage('已复制 AGENTS.md 内容', 'success');
+                        this.showMessage('已复制命令', 'success');
                         return;
                     }
-                    this.showMessage('复制失败，请手动复制内容', 'error');
+                    this.showMessage('复制失败', 'error');
                 },
 
                 async copyResumeCommand(session) {
                     if (!this.isResumeCommandAvailable(session)) {
-                        this.showMessage('当前会话不支持生成恢复命令', 'error');
+                        this.showMessage('不支持此操作', 'error');
                         return;
                     }
                     const command = this.buildResumeCommand(session);
                     const ok = this.fallbackCopyText(command);
                     if (ok) {
-                        this.showMessage('已复制恢复命令', 'success');
+                        this.showMessage('已复制', 'success');
                         return;
                     }
                     try {
                         if (navigator.clipboard && window.isSecureContext) {
                             await navigator.clipboard.writeText(command);
-                            this.showMessage('已复制恢复命令', 'success');
+                            this.showMessage('已复制', 'success');
                             return;
                         }
                     } catch (e) {
                         // keep fallback failure message
                     }
-                    this.showMessage('复制失败，请手动复制命令', 'error');
+                    this.showMessage('复制失败', 'error');
                 },
 
                 buildProviderShareCommand(payload) {
@@ -742,7 +1016,11 @@
                 async copyProviderShareCommand(provider) {
                     const name = provider && typeof provider.name === 'string' ? provider.name.trim() : '';
                     if (!name) {
-                        this.showMessage('提供商名称无效', 'error');
+                        this.showMessage('参数无效', 'error');
+                        return;
+                    }
+                    if (!this.shouldAllowProviderShare(provider)) {
+                        this.showMessage('本地入口不可分享', 'info');
                         return;
                     }
                     if (this.providerShareLoading[name]) {
@@ -757,26 +1035,26 @@
                         }
                         const command = this.buildProviderShareCommand(res && res.payload ? res.payload : null);
                         if (!command) {
-                            this.showMessage('分享命令生成失败', 'error');
+                            this.showMessage('生成命令失败', 'error');
                             return;
                         }
                         const ok = this.fallbackCopyText(command);
                         if (ok) {
-                            this.showMessage('已复制分享命令', 'success');
+                            this.showMessage('已复制', 'success');
                             return;
                         }
                         try {
                             if (navigator.clipboard && window.isSecureContext) {
                                 await navigator.clipboard.writeText(command);
-                                this.showMessage('已复制分享命令', 'success');
+                                this.showMessage('已复制', 'success');
                                 return;
                             }
                         } catch (e) {
                             // keep fallback failure message
                         }
-                        this.showMessage('复制失败，请手动复制命令', 'error');
+                        this.showMessage('复制失败', 'error');
                     } catch (e) {
-                        this.showMessage('生成分享命令失败: ' + e.message, 'error');
+                        this.showMessage('生成命令失败', 'error');
                     } finally {
                         this.providerShareLoading[name] = false;
                     }
@@ -798,26 +1076,26 @@
                         }
                         const command = this.buildClaudeShareCommand(res && res.payload ? res.payload : null);
                         if (!command) {
-                            this.showMessage('分享命令生成失败', 'error');
+                            this.showMessage('生成命令失败', 'error');
                             return;
                         }
                         const ok = this.fallbackCopyText(command);
                         if (ok) {
-                            this.showMessage('已复制分享命令', 'success');
+                            this.showMessage('已复制', 'success');
                             return;
                         }
                         try {
                             if (navigator.clipboard && window.isSecureContext) {
                                 await navigator.clipboard.writeText(command);
-                                this.showMessage('已复制分享命令', 'success');
+                                this.showMessage('已复制', 'success');
                                 return;
                             }
                         } catch (e) {
                             // fall through
                         }
-                        this.showMessage('复制失败，请手动复制命令', 'error');
+                        this.showMessage('复制失败', 'error');
                     } catch (e) {
-                        this.showMessage('生成分享命令失败: ' + e.message, 'error');
+                        this.showMessage('生成命令失败', 'error');
                     } finally {
                         this.claudeShareLoading[name] = false;
                     }
@@ -825,7 +1103,7 @@
 
                 async cloneSession(session) {
                     if (!this.isCloneAvailable(session)) {
-                        this.showMessage('当前会话不支持克隆', 'error');
+                        this.showMessage('不支持此操作', 'error');
                         return;
                     }
                     const key = this.getSessionExportKey(session);
@@ -844,7 +1122,7 @@
                             return;
                         }
 
-                        this.showMessage('会话已克隆', 'success');
+                        this.showMessage('操作成功', 'success');
                         await this.loadSessions();
                         if (res.sessionId) {
                             const matched = this.sessionsList.find(item => item.source === 'codex' && item.sessionId === res.sessionId);
@@ -853,7 +1131,7 @@
                             }
                         }
                     } catch (e) {
-                        this.showMessage('克隆失败: ' + e.message, 'error');
+                        this.showMessage('克隆失败', 'error');
                     } finally {
                         this.sessionCloning[key] = false;
                     }
@@ -861,7 +1139,7 @@
 
                 async deleteSession(session) {
                     if (!this.isDeleteAvailable(session)) {
-                        this.showMessage('当前会话不支持删除', 'error');
+                        this.showMessage('不支持此操作', 'error');
                         return;
                     }
                     const key = this.getSessionExportKey(session);
@@ -879,10 +1157,10 @@
                             this.showMessage(res.error, 'error');
                             return;
                         }
-                        this.showMessage('会话已删除', 'success');
+                        this.showMessage('操作成功', 'success');
                         await this.loadSessions();
                     } catch (e) {
-                        this.showMessage('删除失败: ' + e.message, 'error');
+                        this.showMessage('删除失败', 'error');
                     } finally {
                         this.sessionDeleting[key] = false;
                     }
@@ -893,7 +1171,7 @@
                     return value.trim();
                 },
 
-                mergeSessionPathOptions(baseList = [], incomingList = []) {
+                mergeSessionPathOptions(baseList = [], incomingList = []) {
                     const merged = [];
                     const seen = new Set();
                     const append = (items) => {
@@ -931,8 +1209,8 @@
                     return paths;
                 },
 
-                syncSessionPathOptionsForSource(source, nextOptions, mergeWithExisting = false) {
-                    const targetSource = source === 'claude' ? 'claude' : 'codex';
+                syncSessionPathOptionsForSource(source, nextOptions, mergeWithExisting = false) {
+                    const targetSource = source === 'claude' ? 'claude' : (source === 'all' ? 'all' : 'codex');
                     const current = Array.isArray(this.sessionPathOptionsMap[targetSource])
                         ? this.sessionPathOptionsMap[targetSource]
                         : [];
@@ -944,10 +1222,10 @@
                         [targetSource]: merged
                     };
                     this.refreshSessionPathOptions(targetSource);
-                },
-
-                refreshSessionPathOptions(source) {
-                    const targetSource = source === 'claude' ? 'claude' : 'codex';
+                },
+
+                refreshSessionPathOptions(source) {
+                    const targetSource = source === 'claude' ? 'claude' : (source === 'all' ? 'all' : 'codex');
                     const base = Array.isArray(this.sessionPathOptionsMap[targetSource])
                         ? [...this.sessionPathOptionsMap[targetSource]]
                         : [];
@@ -960,8 +1238,8 @@
                     }
                 },
 
-                async loadSessionPathOptions(options = {}) {
-                    const source = options.source === 'claude' ? 'claude' : 'codex';
+                async loadSessionPathOptions(options = {}) {
+                    const source = options.source === 'claude' ? 'claude' : (options.source === 'all' ? 'all' : 'codex');
                     const forceRefresh = !!options.forceRefresh;
                     const loaded = !!this.sessionPathOptionsLoadedMap[source];
                     if (!forceRefresh && loaded) {
@@ -1013,12 +1291,12 @@
                     await this.loadSessions();
                 },
 
-                async clearSessionFilters() {
-                    this.sessionFilterSource = 'codex';
-                    this.sessionPathFilter = '';
-                    this.sessionQuery = '';
-                    this.sessionRoleFilter = 'all';
-                    this.sessionTimePreset = 'all';
+                async clearSessionFilters() {
+                    this.sessionFilterSource = 'all';
+                    this.sessionPathFilter = '';
+                    this.sessionQuery = '';
+                    this.sessionRoleFilter = 'all';
+                    this.sessionTimePreset = 'all';
                     await this.onSessionSourceChange();
                 },
 
@@ -1093,7 +1371,7 @@
                         this.activeSession = null;
                         this.activeSessionMessages = [];
                         this.activeSessionDetailClipped = false;
-                        this.showMessage('加载会话失败: ' + e.message, 'error');
+                        this.showMessage('加载会话失败', 'error');
                     } finally {
                         this.sessionsLoading = false;
                     }
@@ -1223,8 +1501,10 @@
                     }
                 },
 
-                downloadTextFile(fileName, content) {
-                    const blob = new Blob([content], { type: 'text/markdown;charset=utf-8' });
+                downloadTextFile(fileName, content, mimeType = 'text/markdown;charset=utf-8') {
+                    // 使用 UTF-8 BOM 确保文本编辑器正确识别编码
+                    const BOM = '\uFEFF';
+                    const blob = new Blob([BOM + content], { type: mimeType });
                     const url = URL.createObjectURL(blob);
                     const link = document.createElement('a');
                     link.href = url;
@@ -1255,10 +1535,10 @@
                             const maxLabel = res.maxMessages === 'all' ? 'all' : res.maxMessages;
                             this.showMessage(`会话导出完成（已截断：最多 ${maxLabel} 条消息）`, 'info');
                         } else {
-                            this.showMessage('会话导出完成', 'success');
+                            this.showMessage('操作成功', 'success');
                         }
                     } catch (e) {
-                        this.showMessage('导出失败: ' + e.message, 'error');
+                        this.showMessage('导出失败', 'error');
                     } finally {
                         this.sessionExporting[key] = false;
                     }
@@ -1267,15 +1547,22 @@
                 async switchProvider(name) {
                     this.currentProvider = name;
                     await this.loadModelsForProvider(name);
-                    await this.openConfigTemplateEditor();
+                    if (this.modelsSource === 'remote' && this.models.length > 0 && !this.models.includes(this.currentModel)) {
+                        this.currentModel = this.models[0];
+                    }
+                    await this.applyCodexConfigDirect({ silent: true });
                 },
 
                 async onModelChange() {
-                    await this.openConfigTemplateEditor();
+                    await this.applyCodexConfigDirect();
                 },
 
                 async onServiceTierChange() {
-                    await this.openConfigTemplateEditor();
+                    await this.applyCodexConfigDirect({ silent: true });
+                },
+
+                async onReasoningEffortChange() {
+                    await this.applyCodexConfigDirect({ silent: true });
                 },
 
                 async runHealthCheck() {
@@ -1320,15 +1607,15 @@
                                 remote
                             };
                             if (ok) {
-                                this.showMessage('健康检查通过', 'success');
+                                this.showMessage('检查通过', 'success');
                             }
                         } else {
                             this.healthCheckResult = null;
-                            this.showMessage('健康检查失败：返回数据异常', 'error');
+                            this.showMessage('检查失败', 'error');
                         }
                     } catch (e) {
                         this.healthCheckResult = null;
-                        this.showMessage('健康检查失败: ' + e.message, 'error');
+                        this.showMessage('检查失败', 'error');
                     } finally {
                         if (this.configMode === 'claude') {
                             try {
@@ -1369,7 +1656,50 @@
                         this.configTemplateContent = template;
                         this.showConfigTemplateModal = true;
                     } catch (e) {
-                        this.showMessage('加载模板失败: ' + e.message, 'error');
+                        this.showMessage('加载模板失败', 'error');
+                    }
+                },
+
+                async applyCodexConfigDirect(options = {}) {
+                    if (this.codexApplying) return;
+
+                    const provider = (this.currentProvider || '').trim();
+                    const model = (this.currentModel || '').trim();
+                    if (!provider || !model) {
+                        this.showMessage('请选择提供商和模型', 'error');
+                        return;
+                    }
+
+                    this.codexApplying = true;
+                    try {
+                        const tplRes = await api('get-config-template', {
+                            provider,
+                            model,
+                            serviceTier: this.serviceTier,
+                            reasoningEffort: this.modelReasoningEffort
+                        });
+                        if (tplRes.error) {
+                            this.showMessage('获取模板失败', 'error');
+                            return;
+                        }
+
+                        const applyRes = await api('apply-config-template', {
+                            template: tplRes.template
+                        });
+                        if (applyRes.error) {
+                            this.showMessage('应用模板失败', 'error');
+                            return;
+                        }
+
+                        if (options.silent !== true) {
+                            this.showMessage('配置已应用', 'success');
+                        }
+
+                        await this.loadAll();
+                    } catch (e) {
+                        this.showMessage('应用失败', 'error');
+                    } finally {
+                        this.codexApplying = false;
                     }
                 },
 
@@ -1380,7 +1710,7 @@
 
                 async applyConfigTemplate() {
                     if (!this.configTemplateContent || !this.configTemplateContent.trim()) {
-                        this.showMessage('模板内容不能为空', 'error');
+                        this.showMessage('模板不能为空', 'error');
                         return;
                     }
 
@@ -1393,11 +1723,11 @@
                             this.showMessage(res.error, 'error');
                             return;
                         }
-                        this.showMessage('模板已应用到 config.toml', 'success');
+                        this.showMessage('模板已应用', 'success');
                         this.closeConfigTemplateModal();
                         await this.loadAll();
                     } catch (e) {
-                        this.showMessage('应用模板失败: ' + e.message, 'error');
+                        this.showMessage('应用模板失败', 'error');
                     } finally {
                         this.configTemplateApplying = false;
                     }
@@ -1418,7 +1748,7 @@
                         this.agentsLineEnding = res.lineEnding === '\r\n' ? '\r\n' : '\n';
                         this.showAgentsModal = true;
                     } catch (e) {
-                        this.showMessage('加载 AGENTS.md 失败: ' + e.message, 'error');
+                        this.showMessage('加载文件失败', 'error');
                     } finally {
                         this.agentsLoading = false;
                     }
@@ -1442,7 +1772,7 @@
                         this.agentsLineEnding = res.lineEnding === '\r\n' ? '\r\n' : '\n';
                         this.showAgentsModal = true;
                     } catch (e) {
-                        this.showMessage('加载 OpenClaw AGENTS.md 失败: ' + e.message, 'error');
+                        this.showMessage('加载文件失败', 'error');
                     } finally {
                         this.agentsLoading = false;
                     }
@@ -1451,7 +1781,7 @@
                 async openOpenclawWorkspaceEditor() {
                     const fileName = (this.openclawWorkspaceFileName || '').trim();
                     if (!fileName) {
-                        this.showMessage('请输入工作区文件名', 'error');
+                        this.showMessage('请输入文件名', 'error');
                         return;
                     }
                     this.setAgentsModalContext('openclaw-workspace', { fileName });
@@ -1471,7 +1801,7 @@
                         this.agentsLineEnding = res.lineEnding === '\r\n' ? '\r\n' : '\n';
                         this.showAgentsModal = true;
                     } catch (e) {
-                        this.showMessage('加载 OpenClaw 工作区文件失败: ' + e.message, 'error');
+                        this.showMessage('加载文件失败', 'error');
                     } finally {
                         this.agentsLoading = false;
                     }
@@ -1533,7 +1863,7 @@
                         this.showMessage(successLabel, 'success');
                         this.closeAgentsModal();
                     } catch (e) {
-                        this.showMessage('保存文件失败: ' + e.message, 'error');
+                        this.showMessage('保存失败', 'error');
                     } finally {
                         this.agentsSaving = false;
                     }
@@ -1547,82 +1877,214 @@
                     if (!name) {
                         return this.showMessage('名称不能为空', 'error');
                     }
+                    if (name.toLowerCase() === 'local') {
+                        return this.showMessage('local provider 为系统保留名称，不可新增', 'error');
+                    }
                     if (this.providersList.some(item => item.name === name)) {
-                        return this.showMessage('提供商已存在', 'error');
+                        return this.showMessage('名称已存在', 'error');
+                    }
+
+                    try {
+                        const res = await api('add-provider', {
+                            name,
+                            url: this.newProvider.url.trim(),
+                            key: this.newProvider.key || ''
+                        });
+                        if (res.error) {
+                            this.showMessage(res.error, 'error');
+                            return;
+                        }
+
+                        this.showMessage('操作成功', 'success');
+                        this.closeAddModal();
+                        await this.loadAll();
+                    } catch (e) {
+                        this.showMessage('添加失败', 'error');
                     }
+                },
 
-                    const safeName = this.escapeTomlString(name);
-                    const safeUrl = this.escapeTomlString(this.newProvider.url.trim());
-                    const safeKey = this.escapeTomlString(this.newProvider.key || '');
-                    const newProviderBlock = `[model_providers.${safeName}]\nname = "${safeName}"\nbase_url = "${safeUrl}"\nwire_api = "responses"\nrequires_openai_auth = false\npreferred_auth_method = "${safeKey}"\nrequest_max_retries = 4\nstream_max_retries = 10\nstream_idle_timeout_ms = 300000`;
+                getCurrentCodexAuthProfile() {
+                    const list = Array.isArray(this.codexAuthProfiles) ? this.codexAuthProfiles : [];
+                    return list.find((item) => !!(item && item.current)) || null;
+                },
 
-                    this.currentProvider = name;
-                    this.showMessage('已生成新增模板，请确认后应用', 'info');
-                    this.closeAddModal();
-                    await this.openConfigTemplateEditor({
-                        appendHint: `新增 provider: ${name}（请检查字段后应用）`,
-                        appendBlock: newProviderBlock
-                    });
+                isLocalLikeProvider(providerOrName) {
+                    if (!providerOrName) return false;
+                    const rawName = typeof providerOrName === 'object'
+                        ? String(providerOrName.name || '')
+                        : String(providerOrName);
+                    const normalized = rawName.trim().toLowerCase();
+                    return normalized === 'local' || normalized === 'codexmate-proxy';
+                },
+
+                providerPillState(provider) {
+                    if (this.isLocalLikeProvider(provider)) {
+                        const currentProfile = this.getCurrentCodexAuthProfile();
+                        return currentProfile
+                            ? { configured: true, text: '已登录' }
+                            : { configured: false, text: '未登录' };
+                    }
+                    const configured = !!(provider && provider.hasKey);
+                    return {
+                        configured,
+                        text: configured ? '已配置' : '未配置'
+                    };
+                },
+
+                providerPillConfigured(provider) {
+                    return this.providerPillState(provider).configured;
+                },
+
+                providerPillText(provider) {
+                    return this.providerPillState(provider).text;
+                },
+
+                isReadOnlyProvider(providerOrName) {
+                    if (!providerOrName) return false;
+                    if (typeof providerOrName === 'object') {
+                        return !!providerOrName.readOnly;
+                    }
+                    const name = String(providerOrName).trim();
+                    if (!name) return false;
+                    const target = (this.providersList || []).find((item) => item && item.name === name);
+                    return !!(target && target.readOnly);
+                },
+
+                isNonDeletableProvider(providerOrName) {
+                    if (!providerOrName) return false;
+                    if (typeof providerOrName === 'object') {
+                        const directName = String(providerOrName.name || '').trim().toLowerCase();
+                        if (directName === 'local' || directName === 'codexmate-proxy') {
+                            return true;
+                        }
+                        return !!providerOrName.nonDeletable;
+                    }
+                    const name = String(providerOrName).trim();
+                    if (!name) return false;
+                    const normalized = name.toLowerCase();
+                    if (normalized === 'local' || normalized === 'codexmate-proxy') {
+                        return true;
+                    }
+                    const target = (this.providersList || []).find((item) => item && item.name === name);
+                    return !!(target && target.nonDeletable);
+                },
+
+                shouldShowProviderDelete(provider) {
+                    return !this.isReadOnlyProvider(provider) && !this.isNonDeletableProvider(provider);
+                },
+
+                shouldShowProviderEdit(provider) {
+                    return !this.isReadOnlyProvider(provider) && !this.isNonDeletableProvider(provider);
+                },
+
+                shouldAllowProviderShare(provider) {
+                    return !this.isReadOnlyProvider(provider) && !this.isLocalLikeProvider(provider);
                 },
 
                 async deleteProvider(name) {
-                    if (!confirm(`确定删除提供商 "${name}"?`)) return;
-                    this.showMessage('请在模板中手动删除该 provider 配置块后应用', 'info');
-                    await this.openConfigTemplateEditor({
-                        appendHint: `请手动删除 [model_providers.${name}] 配置块，并确认 model_provider 指向有效 provider`
-                    });
+                    if (this.isNonDeletableProvider(name)) {
+                        this.showMessage('该 provider 为保留项，不可删除', 'info');
+                        return;
+                    }
+                    const res = await api('delete-provider', { name });
+                    if (res.error) {
+                        this.showMessage(res.error, 'error');
+                        return;
+                    }
+                    if (res.switched && res.provider) {
+                        this.showMessage(`已删除提供商，自动切换到 ${res.provider}${res.model ? ` / ${res.model}` : ''}`, 'success');
+                    } else {
+                        this.showMessage('操作成功', 'success');
+                    }
+                    await this.loadAll();
                 },
 
                 openEditModal(provider) {
+                    if (!this.shouldShowProviderEdit(provider)) {
+                        this.showMessage('该 provider 为保留项，不可编辑', 'info');
+                        return;
+                    }
                     this.editingProvider = {
                         name: provider.name,
                         url: provider.url || '',
-                        key: ''
+                        key: '',
+                        readOnly: !!provider.readOnly,
+                        nonEditable: this.isNonDeletableProvider(provider)
                     };
                     this.showEditModal = true;
                 },
 
                 async updateProvider() {
+                    if (this.editingProvider.readOnly || this.editingProvider.nonEditable) {
+                        this.showMessage('该 provider 为保留项，不可编辑', 'error');
+                        this.closeEditModal();
+                        return;
+                    }
                     if (!this.editingProvider.url) {
                         return this.showMessage('URL 必填', 'error');
                     }
 
                     const name = this.editingProvider.name;
-                    const safeUrl = this.escapeTomlString(this.editingProvider.url.trim());
-                    const safeKey = this.escapeTomlString(this.editingProvider.key || '');
+                    const url = this.editingProvider.url.trim();
+                    const key = this.editingProvider.key || '';
                     this.closeEditModal();
-                    this.showMessage('已生成更新模板，请确认后应用', 'info');
-                    await this.openConfigTemplateEditor({
-                        appendHint: `请将 [model_providers.${name}] 中 base_url 更新为 ${safeUrl}${safeKey ? '，并更新 preferred_auth_method' : ''}`
-                    });
+                    try {
+                        const res = await api('update-provider', { name, url, key });
+                        if (res.error) {
+                            this.showMessage(res.error, 'error');
+                            return;
+                        }
+                        this.showMessage('操作成功', 'success');
+                        await this.loadAll();
+                    } catch (e) {
+                        this.showMessage('更新失败', 'error');
+                    }
                 },
 
                 closeEditModal() {
                     this.showEditModal = false;
-                    this.editingProvider = { name: '', url: '', key: '' };
+                    this.editingProvider = { name: '', url: '', key: '', readOnly: false, nonEditable: false };
+                },
+
+                async resetConfig() {
+                    if (this.resetConfigLoading) return;
+                    this.resetConfigLoading = true;
+                    try {
+                        const res = await api('reset-config');
+                        if (res.error) {
+                            this.showMessage(res.error, 'error');
+                            return;
+                        }
+                        const backup = res.backupFile ? `（已备份: ${res.backupFile}）` : '';
+                        this.showMessage(`配置已重装${backup}`, 'success');
+                        await this.loadAll();
+                    } catch (e) {
+                        this.showMessage('重装失败', 'error');
+                    } finally {
+                        this.resetConfigLoading = false;
+                    }
                 },
 
                 async addModel() {
                     if (!this.newModelName || !this.newModelName.trim()) {
-                        return this.showMessage('请输入模型名称', 'error');
+                        return this.showMessage('请输入模型', 'error');
                     }
                     const res = await api('add-model', { model: this.newModelName.trim() });
                     if (res.error) {
                         this.showMessage(res.error, 'error');
                     } else {
-                        this.showMessage('已添加', 'success');
+                        this.showMessage('操作成功', 'success');
                         this.closeModelModal();
                         await this.loadAll();
                     }
                 },
 
                 async removeModel(model) {
-                    if (!confirm(`确定删除模型 "${model}"?`)) return;
                     const res = await api('delete-model', { model });
                     if (res.error) {
                         this.showMessage(res.error, 'error');
                     } else {
-                        this.showMessage('已删除', 'success');
+                        this.showMessage('操作成功', 'success');
                         await this.loadAll();
                     }
                 },
@@ -1677,7 +2139,7 @@
                     this.saveClaudeConfigs();
                     this.updateClaudeModelsCurrent();
                     if (!this.claudeConfigs[name].apiKey) {
-                        this.showMessage('该配置未设置 API Key，请先编辑', 'error');
+                        this.showMessage('请先配置 API Key', 'error');
                         return;
                     }
                     this.applyClaudeConfig(name);
@@ -1707,7 +2169,7 @@
                         hasKey: !!this.editingConfig.apiKey
                     };
                     this.saveClaudeConfigs();
-                    this.showMessage('配置已更新', 'success');
+                    this.showMessage('操作成功', 'success');
                     this.closeEditConfigModal();
                     if (name === this.currentClaudeConfig) {
                         this.refreshClaudeModelContext();
@@ -1731,7 +2193,7 @@
 
                     const config = this.claudeConfigs[name];
                     if (!config.apiKey) {
-                        this.showMessage('已保存，未应用：请先输入 API Key', 'info');
+                        this.showMessage('已保存，未应用', 'info');
                         this.closeEditConfigModal();
                         if (name === this.currentClaudeConfig) {
                             this.refreshClaudeModelContext();
@@ -1741,7 +2203,7 @@
 
                     const res = await api('apply-claude-config', { config });
                     if (res.error || res.success === false) {
-                        this.showMessage(res.error || '应用 Claude 配置失败', 'error');
+                        this.showMessage(res.error || '应用配置失败', 'error');
                     } else {
                         const targetTip = res.targetPath ? `（${res.targetPath}）` : '';
                         this.showMessage(`已保存并应用到 Claude 配置${targetTip}`, 'success');
@@ -1754,15 +2216,15 @@
 
                 addClaudeConfig() {
                     if (!this.newClaudeConfig.name || !this.newClaudeConfig.name.trim()) {
-                        return this.showMessage('请输入配置名称', 'error');
+                        return this.showMessage('请输入名称', 'error');
                     }
                     const name = this.newClaudeConfig.name.trim();
                     if (this.claudeConfigs[name]) {
-                        return this.showMessage('配置名称已存在', 'error');
+                        return this.showMessage('名称已存在', 'error');
                     }
                     const duplicateName = this.findDuplicateClaudeConfigName(this.newClaudeConfig);
                     if (duplicateName) {
-                        return this.showMessage('已存在相同配置，已忽略添加', 'info');
+                        return this.showMessage('配置已存在', 'info');
                     }
 
                     this.claudeConfigs[name] = {
@@ -1774,14 +2236,14 @@
 
                     this.currentClaudeConfig = name;
                     this.saveClaudeConfigs();
-                    this.showMessage('配置已添加', 'success');
+                    this.showMessage('操作成功', 'success');
                     this.closeClaudeConfigModal();
                     this.refreshClaudeModelContext();
                 },
 
                 deleteClaudeConfig(name) {
                     if (Object.keys(this.claudeConfigs).length <= 1) {
-                        return this.showMessage('至少保留一个配置', 'error');
+                        return this.showMessage('至少保留一项', 'error');
                     }
 
                     if (!confirm(`确定删除配置 "${name}"?`)) return;
@@ -1791,7 +2253,7 @@
                         this.currentClaudeConfig = Object.keys(this.claudeConfigs)[0];
                     }
                     this.saveClaudeConfigs();
-                    this.showMessage('配置已删除', 'success');
+                    this.showMessage('操作成功', 'success');
                     this.refreshClaudeModelContext();
                 },
 
@@ -1801,12 +2263,12 @@
                     const config = this.claudeConfigs[name];
 
                     if (!config.apiKey) {
-                        return this.showMessage('该配置未设置 API Key，请先编辑', 'error');
+                        return this.showMessage('请先配置 API Key', 'error');
                     }
 
                     const res = await api('apply-claude-config', { config });
                     if (res.error || res.success === false) {
-                        this.showMessage(res.error || '应用 Claude 配置失败', 'error');
+                        this.showMessage(res.error || '应用配置失败', 'error');
                     } else {
                         const targetTip = res.targetPath ? `（${res.targetPath}）` : '';
                         this.showMessage(`已应用配置到 Claude 设置: ${name}${targetTip}`, 'success');
@@ -2014,7 +2476,7 @@
                     }
                     this.fillOpenclawQuickFromConfig(parsed.data);
                     if (!silent) {
-                        this.showMessage('已从编辑器读取快速配置', 'success');
+                        this.showMessage('已读取配置', 'success');
                     }
                     return true;
                 },
@@ -2110,7 +2572,7 @@
                     this.refreshOpenclawProviders(parsed.data);
                     this.refreshOpenclawAgentsList(parsed.data);
                     if (!silent) {
-                        this.showMessage('已从文本刷新结构化配置', 'success');
+                        this.showMessage('已刷新配置', 'success');
                     }
                     return true;
                 },
@@ -2408,7 +2870,7 @@
                     this.refreshOpenclawProviders(config);
                     this.refreshOpenclawAgentsList(config);
                     this.fillOpenclawQuickFromConfig(config);
-                    this.showMessage('已写入编辑器', 'success');
+                    this.showMessage('已写入', 'success');
                 },
 
                 applyOpenclawQuickToText() {
@@ -2421,7 +2883,7 @@
                     const providerName = (this.openclawQuick.providerName || '').trim();
                     const modelId = (this.openclawQuick.modelId || '').trim();
                     if (!providerName) {
-                        this.showMessage('请填写 Provider 名称', 'error');
+                        this.showMessage('请填写名称', 'error');
                         return;
                     }
                     if (providerName.includes('/')) {
@@ -2429,7 +2891,7 @@
                         return;
                     }
                     if (!modelId) {
-                        this.showMessage('请填写模型 ID', 'error');
+                        this.showMessage('请填写模型', 'error');
                         return;
                     }
 
@@ -2440,7 +2902,7 @@
                     const provider = ensureObject(providers[providerName]);
                     const baseUrl = (this.openclawQuick.baseUrl || '').trim();
                     if (!baseUrl && !provider.baseUrl) {
-                        this.showMessage('请填写 Base URL', 'error');
+                        this.showMessage('请填写 URL', 'error');
                         return;
                     }
 
@@ -2526,7 +2988,7 @@
                     this.fillOpenclawStructured(config);
                     this.refreshOpenclawProviders(config);
                     this.refreshOpenclawAgentsList(config);
-                    this.showMessage('快速配置已写入编辑器', 'success');
+                    this.showMessage('配置已写入', 'success');
                 },
 
                 addOpenclawFallback() {
@@ -2630,6 +3092,144 @@
                     this.resetOpenclawQuick();
                 },
 
+                normalizeInstallPackageManager(value) {
+                    const normalized = typeof value === 'string' ? value.trim().toLowerCase() : '';
+                    if (normalized === 'pnpm' || normalized === 'bun' || normalized === 'npm') {
+                        return normalized;
+                    }
+                    return 'npm';
+                },
+
+                normalizeInstallAction(value) {
+                    const normalized = typeof value === 'string' ? value.trim().toLowerCase() : '';
+                    if (normalized === 'update' || normalized === 'uninstall' || normalized === 'install') {
+                        return normalized;
+                    }
+                    return 'install';
+                },
+
+                normalizeInstallRegistryPreset(value) {
+                    const normalized = typeof value === 'string' ? value.trim().toLowerCase() : '';
+                    if (normalized === 'default' || normalized === 'npmmirror' || normalized === 'tencent' || normalized === 'custom') {
+                        return normalized;
+                    }
+                    return 'default';
+                },
+
+                normalizeInstallRegistryUrl(value) {
+                    const normalized = typeof value === 'string' ? value.trim() : '';
+                    if (!normalized) return '';
+                    if (!/^https?:\/\//i.test(normalized)) {
+                        return '';
+                    }
+                    return normalized.replace(/\/+$/, '');
+                },
+
+                resolveInstallRegistryUrl(presetValue, customValue) {
+                    const preset = this.normalizeInstallRegistryPreset(presetValue);
+                    if (preset === 'npmmirror') {
+                        return 'https://registry.npmmirror.com';
+                    }
+                    if (preset === 'tencent') {
+                        return 'https://mirrors.cloud.tencent.com/npm';
+                    }
+                    if (preset === 'custom') {
+                        return this.normalizeInstallRegistryUrl(customValue);
+                    }
+                    return '';
+                },
+
+                appendInstallRegistryOption(command, actionName) {
+                    const base = typeof command === 'string' ? command.trim() : '';
+                    if (!base) return '';
+                    const action = this.normalizeInstallAction(actionName);
+                    if (action === 'uninstall') {
+                        return base;
+                    }
+                    const registry = this.resolveInstallRegistryUrl(this.installRegistryPreset, this.installRegistryCustom);
+                    if (!registry) {
+                        return base;
+                    }
+                    return `${base} --registry=${registry}`;
+                },
+
+                resolveInstallPlatform() {
+                    const navPlatform = typeof navigator !== 'undefined' && typeof navigator.platform === 'string'
+                        ? navigator.platform.trim().toLowerCase()
+                        : '';
+                    if (navPlatform.includes('win')) return 'win32';
+                    if (navPlatform.includes('mac')) return 'darwin';
+                    return 'linux';
+                },
+
+                buildInstallCommandMatrix(packageManager) {
+                    const manager = this.normalizeInstallPackageManager(packageManager);
+                    const matrix = {
+                        claude: {
+                            install: '',
+                            update: '',
+                            uninstall: ''
+                        },
+                        codex: {
+                            install: '',
+                            update: '',
+                            uninstall: ''
+                        }
+                    };
+                    if (manager === 'pnpm') {
+                        matrix.claude.install = 'pnpm add -g @anthropic-ai/claude-code';
+                        matrix.claude.update = 'pnpm up -g @anthropic-ai/claude-code';
+                        matrix.claude.uninstall = 'pnpm remove -g @anthropic-ai/claude-code';
+                        matrix.codex.install = 'pnpm add -g @openai/codex';
+                        matrix.codex.update = 'pnpm up -g @openai/codex';
+                        matrix.codex.uninstall = 'pnpm remove -g @openai/codex';
+                        return matrix;
+                    }
+                    if (manager === 'bun') {
+                        matrix.claude.install = 'bun add -g @anthropic-ai/claude-code';
+                        matrix.claude.update = 'bun update -g @anthropic-ai/claude-code';
+                        matrix.claude.uninstall = 'bun remove -g @anthropic-ai/claude-code';
+                        matrix.codex.install = 'bun add -g @openai/codex';
+                        matrix.codex.update = 'bun update -g @openai/codex';
+                        matrix.codex.uninstall = 'bun remove -g @openai/codex';
+                        return matrix;
+                    }
+                    matrix.claude.install = 'npm install -g @anthropic-ai/claude-code';
+                    matrix.claude.update = 'npm update -g @anthropic-ai/claude-code';
+                    matrix.claude.uninstall = 'npm uninstall -g @anthropic-ai/claude-code';
+                    matrix.codex.install = 'npm install -g @openai/codex';
+                    matrix.codex.update = 'npm update -g @openai/codex';
+                    matrix.codex.uninstall = 'npm uninstall -g @openai/codex';
+                    return matrix;
+                },
+
+                getInstallCommand(targetId, actionName) {
+                    const targetKey = typeof targetId === 'string' ? targetId.trim() : '';
+                    if (!targetKey) return '';
+                    const action = this.normalizeInstallAction(actionName);
+                    const currentMap = this.buildInstallCommandMatrix(this.installPackageManager);
+                    const current = currentMap[targetKey] && typeof currentMap[targetKey][action] === 'string'
+                        ? currentMap[targetKey][action]
+                        : '';
+                    return this.appendInstallRegistryOption(current, action);
+                },
+
+                setInstallCommandAction(actionName) {
+                    this.installCommandAction = this.normalizeInstallAction(actionName);
+                },
+
+                setInstallRegistryPreset(presetName) {
+                    this.installRegistryPreset = this.normalizeInstallRegistryPreset(presetName);
+                },
+
+                openInstallModal() {
+                    this.showInstallModal = true;
+                },
+
+                closeInstallModal() {
+                    this.showInstallModal = false;
+                },
+
                 async loadOpenclawConfigFromFile(options = {}) {
                     const silent = !!options.silent;
                     const force = !!options.force;
@@ -2655,11 +3255,11 @@
                         }
                         this.syncOpenclawStructuredFromText({ silent: true });
                         if (!silent) {
-                            this.showMessage('已加载当前 OpenClaw 配置', 'success');
+                            this.showMessage('加载完成', 'success');
                         }
                     } catch (e) {
                         if (!silent) {
-                            this.showMessage('加载 OpenClaw 配置失败: ' + e.message, 'error');
+                            this.showMessage('加载配置失败', 'error');
                         }
                     } finally {
                         this.openclawFileLoading = false;
@@ -2668,12 +3268,12 @@
 
                 persistOpenclawConfig({ closeModal = true } = {}) {
                     if (!this.openclawEditing.name || !this.openclawEditing.name.trim()) {
-                        this.showMessage('请输入配置名称', 'error');
+                        this.showMessage('请输入名称', 'error');
                         return '';
                     }
                     const name = this.openclawEditing.name.trim();
                     if (!this.openclawEditing.lockName && this.openclawConfigs[name]) {
-                        this.showMessage('配置名称已存在', 'error');
+                        this.showMessage('名称已存在', 'error');
                         return '';
                     }
                     if (!this.openclawEditing.content || !this.openclawEditing.content.trim()) {
@@ -2697,7 +3297,7 @@
                     try {
                         const name = this.persistOpenclawConfig();
                         if (!name) return;
-                        this.showMessage('OpenClaw 配置已保存', 'success');
+                        this.showMessage('操作成功', 'success');
                     } finally {
                         this.openclawSaving = false;
                     }
@@ -2714,7 +3314,7 @@
                             lineEnding: this.openclawLineEnding
                         });
                         if (res.error || res.success === false) {
-                            this.showMessage(res.error || '应用 OpenClaw 配置失败', 'error');
+                            this.showMessage(res.error || '应用配置失败', 'error');
                             return;
                         }
                         this.openclawConfigPath = res.targetPath || this.openclawConfigPath;
@@ -2723,7 +3323,7 @@
                         this.showMessage(`已保存并应用 OpenClaw 配置${targetTip}`, 'success');
                         this.closeOpenclawConfigModal();
                     } catch (e) {
-                        this.showMessage('应用 OpenClaw 配置失败: ' + e.message, 'error');
+                        this.showMessage('应用配置失败', 'error');
                     } finally {
                         this.openclawApplying = false;
                     }
@@ -2731,7 +3331,7 @@
 
                 deleteOpenclawConfig(name) {
                     if (Object.keys(this.openclawConfigs).length <= 1) {
-                        return this.showMessage('至少保留一个配置', 'error');
+                        return this.showMessage('至少保留一项', 'error');
                     }
                     if (!confirm(`确定删除配置 "${name}"?`)) return;
                     delete this.openclawConfigs[name];
@@ -2739,21 +3339,21 @@
                         this.currentOpenclawConfig = Object.keys(this.openclawConfigs)[0];
                     }
                     this.saveOpenclawConfigs();
-                    this.showMessage('OpenClaw 配置已删除', 'success');
+                    this.showMessage('操作成功', 'success');
                 },
 
                 async applyOpenclawConfig(name) {
                     this.currentOpenclawConfig = name;
                     const config = this.openclawConfigs[name];
                     if (!this.openclawHasContent(config)) {
-                        return this.showMessage('该配置为空，请先编辑', 'error');
+                        return this.showMessage('配置为空', 'error');
                     }
                     const res = await api('apply-openclaw-config', {
                         content: config.content,
                         lineEnding: this.openclawLineEnding
                     });
                     if (res.error || res.success === false) {
-                        this.showMessage(res.error || '应用 OpenClaw 配置失败', 'error');
+                        this.showMessage(res.error || '应用配置失败', 'error');
                     } else {
                         this.openclawConfigPath = res.targetPath || this.openclawConfigPath;
                         this.openclawConfigExists = true;
@@ -2826,6 +3426,427 @@
                     }
                 },
 
+                async downloadClaudeDirectory() {
+                    if (this.claudeDownloadLoading) return;
+                    this.claudeDownloadLoading = true;
+                    this.claudeDownloadProgress = 5;
+                    this.claudeDownloadTimer = setInterval(() => {
+                        if (this.claudeDownloadProgress < 90) {
+                            this.claudeDownloadProgress += 5;
+                        }
+                    }, 400);
+                    try {
+                        const res = await api('download-claude-dir');
+                        if (res && res.error) {
+                            this.showMessage(res.error, 'error');
+                            return;
+                        }
+                        if (!res || res.success !== true || !res.fileName) {
+                            this.showMessage('备份失败', 'error');
+                            return;
+                        }
+                        this.claudeDownloadProgress = 100;
+                        const downloadUrl = `/download/${encodeURIComponent(res.fileName)}`;
+                        const link = document.createElement('a');
+                        link.href = downloadUrl;
+                        link.download = res.fileName;
+                        document.body.appendChild(link);
+                        link.click();
+                        document.body.removeChild(link);
+                        this.showMessage('备份成功，开始下载', 'success');
+                    } catch (e) {
+                        this.showMessage('备份失败：' + (e && e.message ? e.message : '未知错误'), 'error');
+                    } finally {
+                        if (this.claudeDownloadTimer) {
+                            clearInterval(this.claudeDownloadTimer);
+                            this.claudeDownloadTimer = null;
+                        }
+                        this.claudeDownloadLoading = false;
+                        setTimeout(() => {
+                            this.claudeDownloadProgress = 0;
+                        }, 800);
+                    }
+                },
+
+                async downloadCodexDirectory() {
+                    if (this.codexDownloadLoading) return;
+                    this.codexDownloadLoading = true;
+                    this.codexDownloadProgress = 5;
+                    this.codexDownloadTimer = setInterval(() => {
+                        if (this.codexDownloadProgress < 90) {
+                            this.codexDownloadProgress += 5;
+                        }
+                    }, 400);
+                    try {
+                        const res = await api('download-codex-dir');
+                        if (res && res.error) {
+                            this.showMessage(res.error, 'error');
+                            return;
+                        }
+                        if (!res || res.success !== true || !res.fileName) {
+                            this.showMessage('备份失败', 'error');
+                            return;
+                        }
+                        this.codexDownloadProgress = 100;
+                        const downloadUrl = `/download/${encodeURIComponent(res.fileName)}`;
+                        const link = document.createElement('a');
+                        link.href = downloadUrl;
+                        link.download = res.fileName;
+                        document.body.appendChild(link);
+                        link.click();
+                        document.body.removeChild(link);
+                        this.showMessage('备份成功，开始下载', 'success');
+                    } catch (e) {
+                        this.showMessage('备份失败：' + (e && e.message ? e.message : '未知错误'), 'error');
+                    } finally {
+                        if (this.codexDownloadTimer) {
+                            clearInterval(this.codexDownloadTimer);
+                            this.codexDownloadTimer = null;
+                        }
+                        this.codexDownloadLoading = false;
+                        setTimeout(() => {
+                            this.codexDownloadProgress = 0;
+                        }, 800);
+                    }
+                },
+
+                triggerClaudeImport() {
+                    const input = this.$refs.claudeImportInput;
+                    if (input) {
+                        input.value = '';
+                        input.click();
+                    }
+                },
+
+                triggerCodexImport() {
+                    const input = this.$refs.codexImportInput;
+                    if (input) {
+                        input.value = '';
+                        input.click();
+                    }
+                },
+
+                handleClaudeImportChange(event) {
+                    const file = event && event.target && event.target.files ? event.target.files[0] : null;
+                    if (file) {
+                        void this.importBackupFile('claude', file);
+                    }
+                },
+
+                handleCodexImportChange(event) {
+                    const file = event && event.target && event.target.files ? event.target.files[0] : null;
+                    if (file) {
+                        void this.importBackupFile('codex', file);
+                    }
+                },
+
+                async importBackupFile(type, file) {
+                    const maxSize = 200 * 1024 * 1024;
+                    const loadingKey = type === 'claude' ? 'claudeImportLoading' : 'codexImportLoading';
+                    if (file.size > maxSize) {
+                        this.showMessage('备份文件过大，限制 200MB', 'error');
+                        this.resetImportInput(type);
+                        return;
+                    }
+                    this[loadingKey] = true;
+                    try {
+                        const base64 = await this.readFileAsBase64(file);
+                        const action = type === 'claude' ? 'restore-claude-dir' : 'restore-codex-dir';
+                        const res = await api(action, {
+                            fileName: file.name || `${type}-backup.zip`,
+                            fileBase64: base64
+                        });
+                        if (res && res.error) {
+                            this.showMessage(res.error, 'error');
+                            return;
+                        }
+                        const backupTip = res && res.backupPath ? `，原配置已备份到临时文件：${res.backupPath}` : '';
+                        this.showMessage(`导入成功${backupTip}`, 'success');
+                        if (type === 'claude') {
+                            await this.refreshClaudeSelectionFromSettings({ silent: true });
+                        } else {
+                            await this.loadAll();
+                        }
+                    } catch (e) {
+                        this.showMessage('导入失败：' + (e && e.message ? e.message : '未知错误'), 'error');
+                    } finally {
+                        this[loadingKey] = false;
+                        this.resetImportInput(type);
+                    }
+                },
+
+                readFileAsBase64(file) {
+                    return new Promise((resolve, reject) => {
+                        const reader = new FileReader();
+                        reader.onload = () => {
+                            const result = reader.result;
+                            if (result instanceof ArrayBuffer) {
+                                resolve(this.arrayBufferToBase64(result));
+                                return;
+                            }
+                            if (typeof result === 'string') {
+                                const idx = result.indexOf('base64,');
+                                resolve(idx >= 0 ? result.slice(idx + 7) : result);
+                                return;
+                            }
+                            reject(new Error('不支持的文件读取结果'));
+                        };
+                        reader.onerror = () => reject(new Error('读取文件失败'));
+                        reader.readAsArrayBuffer(file);
+                    });
+                },
+
+                arrayBufferToBase64(buffer) {
+                    const bytes = new Uint8Array(buffer);
+                    const chunkSize = 0x8000;
+                    let binary = '';
+                    for (let i = 0; i < bytes.byteLength; i += chunkSize) {
+                        binary += String.fromCharCode(...bytes.subarray(i, i + chunkSize));
+                    }
+                    return btoa(binary);
+                },
+
+                resetImportInput(type) {
+                    const refName = type === 'claude' ? 'claudeImportInput' : 'codexImportInput';
+                    const el = this.$refs[refName];
+                    if (el) {
+                        el.value = '';
+                    }
+                },
+
+                async loadCodexAuthProfiles(options = {}) {
+                    const silent = !!options.silent;
+                    try {
+                        const res = await api('list-auth-profiles');
+                        if (res && res.error) {
+                            if (!silent) {
+                                this.showMessage(res.error, 'error');
+                            }
+                            return;
+                        }
+                        const list = Array.isArray(res && res.profiles) ? res.profiles : [];
+                        this.codexAuthProfiles = list.sort((a, b) => {
+                            if (!!a.current !== !!b.current) {
+                                return a.current ? -1 : 1;
+                            }
+                            return String(a.name || '').localeCompare(String(b.name || ''));
+                        });
+                    } catch (e) {
+                        if (!silent) {
+                            this.showMessage('读取认证列表失败', 'error');
+                        }
+                    }
+                },
+
+                triggerCodexAuthUpload() {
+                    const input = this.$refs.codexAuthImportInput;
+                    if (input) {
+                        input.value = '';
+                        input.click();
+                    }
+                },
+
+                handleCodexAuthImportChange(event) {
+                    const file = event && event.target && event.target.files ? event.target.files[0] : null;
+                    if (file) {
+                        void this.importCodexAuthFile(file);
+                    }
+                },
+
+                resetCodexAuthImportInput() {
+                    const el = this.$refs.codexAuthImportInput;
+                    if (el) {
+                        el.value = '';
+                    }
+                },
+
+                async importCodexAuthFile(file) {
+                    this.codexAuthImportLoading = true;
+                    try {
+                        const base64 = await this.readFileAsBase64(file);
+                        const res = await api('import-auth-profile', {
+                            fileName: file.name || 'codex-auth.json',
+                            fileBase64: base64,
+                            activate: true
+                        });
+                        if (res && res.error) {
+                            this.showMessage(res.error, 'error');
+                            return;
+                        }
+                        await this.loadCodexAuthProfiles({ silent: true });
+                        this.showMessage('认证文件已导入并切换', 'success');
+                    } catch (e) {
+                        this.showMessage('导入认证文件失败', 'error');
+                    } finally {
+                        this.codexAuthImportLoading = false;
+                        this.resetCodexAuthImportInput();
+                    }
+                },
+
+                async switchCodexAuthProfile(name) {
+                    const key = String(name || '').trim();
+                    if (!key || this.codexAuthSwitching[key]) return;
+                    this.codexAuthSwitching[key] = true;
+                    try {
+                        const res = await api('switch-auth-profile', { name: key });
+                        if (res && res.error) {
+                            this.showMessage(res.error, 'error');
+                            return;
+                        }
+                        await this.loadCodexAuthProfiles({ silent: true });
+                        this.showMessage(`已切换认证: ${key}`, 'success');
+                    } catch (e) {
+                        this.showMessage('切换认证失败', 'error');
+                    } finally {
+                        this.codexAuthSwitching[key] = false;
+                    }
+                },
+
+                async deleteCodexAuthProfile(name) {
+                    const key = String(name || '').trim();
+                    if (!key || this.codexAuthDeleting[key]) return;
+                    this.codexAuthDeleting[key] = true;
+                    try {
+                        const res = await api('delete-auth-profile', { name: key });
+                        if (res && res.error) {
+                            this.showMessage(res.error, 'error');
+                            return;
+                        }
+                        await this.loadCodexAuthProfiles({ silent: true });
+                        const switchedTip = res && res.switchedTo ? `，已切换到 ${res.switchedTo}` : '';
+                        this.showMessage(`已删除认证${switchedTip}`, 'success');
+                    } catch (e) {
+                        this.showMessage('删除认证失败', 'error');
+                    } finally {
+                        this.codexAuthDeleting[key] = false;
+                    }
+                },
+
+                mergeProxySettings(nextSettings) {
+                    const safe = nextSettings && typeof nextSettings === 'object' ? nextSettings : {};
+                    const port = parseInt(String(safe.port), 10);
+                    const timeoutMs = parseInt(String(safe.timeoutMs), 10);
+                    this.proxySettings = {
+                        enabled: safe.enabled !== false,
+                        host: typeof safe.host === 'string' && safe.host.trim() ? safe.host.trim() : '127.0.0.1',
+                        port: Number.isFinite(port) ? port : 8318,
+                        provider: typeof safe.provider === 'string' ? safe.provider.trim() : '',
+                        authSource: safe.authSource === 'profile' || safe.authSource === 'none' ? safe.authSource : 'provider',
+                        timeoutMs: Number.isFinite(timeoutMs) ? timeoutMs : 30000
+                    };
+                },
+
+                async loadProxyStatus(options = {}) {
+                    const silent = !!options.silent;
+                    this.proxyLoading = true;
+                    try {
+                        const res = await api('proxy-status');
+                        if (res && res.error) {
+                            if (!silent) {
+                                this.showMessage(res.error, 'error');
+                            }
+                            return;
+                        }
+                        this.mergeProxySettings(res && res.settings ? res.settings : {});
+                        this.proxyRuntime = res && res.runtime ? { running: true, ...res.runtime } : null;
+                    } catch (e) {
+                        if (!silent) {
+                            this.showMessage('读取代理状态失败', 'error');
+                        }
+                    } finally {
+                        this.proxyLoading = false;
+                    }
+                },
+
+                async saveProxySettings(options = {}) {
+                    const silent = !!options.silent;
+                    this.proxySaving = true;
+                    try {
+                        const res = await api('proxy-save-config', this.proxySettings);
+                        if (res && res.error) {
+                            if (!silent) {
+                                this.showMessage(res.error, 'error');
+                            }
+                            return;
+                        }
+                        if (res && res.settings) {
+                            this.mergeProxySettings(res.settings);
+                        }
+                        if (!silent) {
+                            this.showMessage('代理配置已保存', 'success');
+                        }
+                    } catch (e) {
+                        if (!silent) {
+                            this.showMessage('保存代理配置失败', 'error');
+                        }
+                    } finally {
+                        this.proxySaving = false;
+                    }
+                },
+
+                async startBuiltinProxy() {
+                    this.proxyStarting = true;
+                    try {
+                        const res = await api('proxy-start', {
+                            ...this.proxySettings,
+                            enabled: true
+                        });
+                        if (res && res.error) {
+                            this.showMessage(res.error, 'error');
+                            return;
+                        }
+                        if (res && res.settings) {
+                            this.mergeProxySettings(res.settings);
+                        }
+                        await this.loadProxyStatus({ silent: true });
+                        const listenTip = res && res.listenUrl ? `：${res.listenUrl}` : '';
+                        this.showMessage(`代理已启动${listenTip}`, 'success');
+                    } catch (e) {
+                        this.showMessage('启动代理失败', 'error');
+                    } finally {
+                        this.proxyStarting = false;
+                    }
+                },
+
+                async stopBuiltinProxy() {
+                    this.proxyStopping = true;
+                    try {
+                        const res = await api('proxy-stop');
+                        if (res && res.error) {
+                            this.showMessage(res.error, 'error');
+                            return;
+                        }
+                        await this.loadProxyStatus({ silent: true });
+                        this.showMessage('代理已停止', 'success');
+                    } catch (e) {
+                        this.showMessage('停止代理失败', 'error');
+                    } finally {
+                        this.proxyStopping = false;
+                    }
+                },
+
+                async applyBuiltinProxyProvider() {
+                    this.proxyApplying = true;
+                    try {
+                        const saveRes = await api('proxy-save-config', this.proxySettings);
+                        if (saveRes && saveRes.error) {
+                            this.showMessage(saveRes.error, 'error');
+                            return;
+                        }
+                        const res = await api('proxy-apply-provider', { switchToProxy: true });
+                        if (res && res.error) {
+                            this.showMessage(res.error, 'error');
+                            return;
+                        }
+                        await this.loadAll();
+                        this.showMessage('本地代理 provider 已写入并切换', 'success');
+                    } catch (e) {
+                        this.showMessage('应用代理 provider 失败', 'error');
+                    } finally {
+                        this.proxyApplying = false;
+                    }
+                },
+
                 showMessage(text, type) {
                     this.message = text;
                     this.messageType = type || 'info';
@@ -2839,3 +3860,4 @@
         app.mount('#app');
     });
     
+