codexmate 0.0.37 → 0.0.38

package/cli/analytics-export-args.js

@@ -0,0 +1,68 @@
+function parseAnalyticsExportArgs(args = []) {
+    const options = {
+        format: 'csv',
+        source: 'all',
+        output: ''
+    };
+    const errors = [];
+    for (let index = 0; index < args.length; index += 1) {
+        const token = String(args[index] || '');
+        const readValue = (flag) => {
+            if (token.startsWith(`${flag}=`)) {
+                return token.slice(flag.length + 1);
+            }
+            const value = args[index + 1];
+            index += 1;
+            return value;
+        };
+        if (token === '--format' || token.startsWith('--format=')) {
+            options.format = String(readValue('--format') || '').trim().toLowerCase();
+            continue;
+        }
+        if (token === '--from' || token.startsWith('--from=')) {
+            options.from = String(readValue('--from') || '').trim();
+            continue;
+        }
+        if (token === '--to' || token.startsWith('--to=')) {
+            options.to = String(readValue('--to') || '').trim();
+            continue;
+        }
+        if (token === '--model' || token.startsWith('--model=')) {
+            options.model = String(readValue('--model') || '').trim();
+            continue;
+        }
+        if (token === '--source' || token.startsWith('--source=')) {
+            options.source = String(readValue('--source') || '').trim().toLowerCase();
+            continue;
+        }
+        if (token === '--output' || token === '-o' || token.startsWith('--output=')) {
+            options.output = String(readValue(token === '-o' ? '-o' : '--output') || '').trim();
+            continue;
+        }
+        if (token === '--force-refresh') {
+            options.forceRefresh = true;
+            continue;
+        }
+        if (token === '--help' || token === '-h') {
+            options.help = true;
+            continue;
+        }
+        if (token) {
+            errors.push(`未知参数 ${token}`);
+        }
+    }
+    if (options.format !== 'csv' && options.format !== 'json') {
+        errors.push('--format 必须是 csv 或 json');
+    }
+    if (options.source && !['codex', 'claude', 'gemini', 'codebuddy', 'all'].includes(options.source)) {
+        errors.push('--source 必须是 codex、claude、gemini、codebuddy 或 all');
+    }
+    return {
+        options,
+        error: errors.join('；')
+    };
+}
+
+module.exports = {
+    parseAnalyticsExportArgs
+};

package/cli/session-usage.js

@@ -113,6 +113,192 @@ async function listSessionUsageCore(params = {}, deps = {}) {
     return normalizedSessions.filter(Boolean);
 }
 
+function readNonNegativeInteger(value) {
+    const numeric = Number(value);
+    if (!Number.isFinite(numeric) || numeric < 0) {
+        return 0;
+    }
+    return Math.floor(numeric);
+}
+
+function parseUsageExportDate(value, boundary) {
+    if (value === undefined || value === null || value === '') {
+        return null;
+    }
+    if (value instanceof Date) {
+        const time = value.getTime();
+        return Number.isFinite(time) ? time : NaN;
+    }
+    const raw = String(value).trim();
+    if (!raw) {
+        return null;
+    }
+    const dateOnly = raw.match(/^(\d{4})-(\d{2})-(\d{2})$/);
+    if (dateOnly) {
+        const year = Number(dateOnly[1]);
+        const month = Number(dateOnly[2]) - 1;
+        const day = Number(dateOnly[3]);
+        const start = Date.UTC(year, month, day);
+        const normalized = new Date(start);
+        if (!Number.isFinite(start)
+            || normalized.getUTCFullYear() !== year
+            || normalized.getUTCMonth() !== month
+            || normalized.getUTCDate() !== day) {
+            return NaN;
+        }
+        return boundary === 'end' ? start + 24 * 60 * 60 * 1000 : start;
+    }
+    const parsed = Date.parse(raw);
+    return Number.isFinite(parsed) ? parsed : NaN;
+}
+
+function formatUsageExportDay(timestamp) {
+    return new Date(timestamp).toISOString().slice(0, 10);
+}
+
+function normalizeUsageExportFormat(value) {
+    const normalized = typeof value === 'string' ? value.trim().toLowerCase() : '';
+    return normalized === 'json' ? 'json' : 'csv';
+}
+
+function normalizeUsageExportModelFilters(params = {}) {
+    const raw = [];
+    const push = (value) => {
+        if (Array.isArray(value)) {
+            value.forEach(push);
+            return;
+        }
+        if (typeof value !== 'string') {
+            return;
+        }
+        value.split(',').forEach((item) => {
+            const normalized = item.trim().toLowerCase();
+            if (normalized) raw.push(normalized);
+        });
+    };
+    push(params.model);
+    push(params.models);
+    // API-facing alias: callers may pass modelType when they reuse usage filters
+    // outside the CLI flag surface.
+    push(params.modelType);
+    return [...new Set(raw)];
+}
+
+function sessionMatchesUsageExportModelFilters(session, filters) {
+    if (!filters.length) {
+        return true;
+    }
+    const models = [];
+    if (typeof session.model === 'string') models.push(session.model);
+    if (Array.isArray(session.models)) models.push(...session.models.filter(item => typeof item === 'string'));
+    const normalizedModels = models.map(item => item.trim().toLowerCase()).filter(Boolean);
+    return filters.some(filter => normalizedModels.some(model => model === filter || model.includes(filter)));
+}
+
+function escapeUsageCsvCell(value) {
+    const raw = value === undefined || value === null ? '' : String(value);
+    if (!/[",\n\r]/.test(raw)) {
+        return raw;
+    }
+    return `"${raw.replace(/"/g, '""')}"`;
+}
+
+function serializeUsageExportRowsToCsv(rows) {
+    const columns = ['date', 'model', 'tokens', 'sessions'];
+    const lines = [columns.join(',')];
+    for (const row of rows) {
+        lines.push(columns.map(column => escapeUsageCsvCell(row[column])).join(','));
+    }
+    return lines.join('\r\n') + '\r\n';
+}
+
+function buildUsageExportRows(sessions = [], params = {}) {
+    const fromTime = parseUsageExportDate(params.from ?? params.startDate, 'start');
+    const toTime = parseUsageExportDate(params.to ?? params.endDate, 'end');
+    if (Number.isNaN(fromTime)) {
+        return { error: 'Invalid from date' };
+    }
+    if (Number.isNaN(toTime)) {
+        return { error: 'Invalid to date' };
+    }
+    if (fromTime !== null && toTime !== null && fromTime >= toTime) {
+        return { error: 'from date must be before to date' };
+    }
+
+    const modelFilters = normalizeUsageExportModelFilters(params);
+    const groups = new Map();
+    for (const session of Array.isArray(sessions) ? sessions : []) {
+        if (!session || typeof session !== 'object' || Array.isArray(session)) {
+            continue;
+        }
+        if (!sessionMatchesUsageExportModelFilters(session, modelFilters)) {
+            continue;
+        }
+        const timestamp = Date.parse(session.updatedAt || session.createdAt || '');
+        if (!Number.isFinite(timestamp)) {
+            continue;
+        }
+        if (fromTime !== null && timestamp < fromTime) {
+            continue;
+        }
+        if (toTime !== null && timestamp >= toTime) {
+            continue;
+        }
+        const model = typeof session.model === 'string' && session.model.trim()
+            ? session.model.trim()
+            : (Array.isArray(session.models) && typeof session.models[0] === 'string' ? session.models[0].trim() : 'unknown');
+        if (!model) {
+            continue;
+        }
+        const date = formatUsageExportDay(timestamp);
+        const key = `${date}\u0000${model}`;
+        const current = groups.get(key) || { date, model, tokens: 0, sessions: 0 };
+        current.tokens += readNonNegativeInteger(session.totalTokens ?? session.tokens);
+        current.sessions += 1;
+        groups.set(key, current);
+    }
+
+    const rows = [...groups.values()].sort((a, b) => {
+        const dateCompare = a.date.localeCompare(b.date);
+        if (dateCompare !== 0) return dateCompare;
+        return a.model.localeCompare(b.model);
+    });
+    return { rows };
+}
+
+async function exportSessionUsageCore(params = {}, deps = {}) {
+    const listSessionUsage = typeof deps.listSessionUsage === 'function'
+        ? deps.listSessionUsage
+        : (options) => listSessionUsageCore(options, deps);
+    const sessions = Array.isArray(params.sessions)
+        ? params.sessions
+        : await listSessionUsage({
+            source: params.source,
+            limit: params.limit,
+            forceRefresh: !!params.forceRefresh
+        });
+    const built = buildUsageExportRows(sessions, params);
+    if (built.error) {
+        return { error: built.error };
+    }
+    const format = normalizeUsageExportFormat(params.format);
+    const rows = built.rows;
+    const content = format === 'json'
+        ? JSON.stringify({ rows }, null, 2) + '\n'
+        : serializeUsageExportRowsToCsv(rows);
+    const extension = format === 'json' ? 'json' : 'csv';
+    return {
+        format,
+        mimeType: format === 'json' ? 'application/json' : 'text/csv',
+        fileName: `usage-export.${extension}`,
+        rows,
+        content
+    };
+}
+
 module.exports = {
-    listSessionUsageCore
+    listSessionUsageCore,
+    buildUsageExportRows,
+    exportSessionUsageCore,
+    serializeUsageExportRowsToCsv
 };

package/cli.js

@@ -162,7 +162,8 @@ const {
     extractSessionDetailPreviewFromTailText,
     extractSessionDetailPreviewFromFileFast
 } = require('./lib/cli-sessions');
-const { listSessionUsageCore } = require('./cli/session-usage');
+const { listSessionUsageCore, exportSessionUsageCore } = require('./cli/session-usage');
+const { parseAnalyticsExportArgs } = require('./cli/analytics-export-args');
 const {
     readBundledWebUiCss,
     readBundledWebUiHtml,
@@ -5204,6 +5205,12 @@ async function listSessionUsage(params = {}) {
     });
 }
 
+async function exportSessionUsage(params = {}) {
+    return exportSessionUsageCore(params, {
+        listSessionUsage
+    });
+}
+
 function listSessionPaths(params = {}) {
     const source = typeof params.source === 'string' ? params.source.trim().toLowerCase() : '';
     if (source && source !== 'codex' && source !== 'claude' && source !== 'gemini' && source !== 'codebuddy' && source !== 'all') {
@@ -9796,6 +9803,47 @@ async function cmdExportSession(args = []) {
     console.log();
 }
 
+function printAnalyticsUsage() {
+    console.log('\n用法:');
+    console.log('  codexmate analytics export [--format csv|json] [--from YYYY-MM-DD] [--to YYYY-MM-DD] [--model <MODEL>] [--source <codex|claude|gemini|codebuddy|all>] [--output <PATH|->] [-o <PATH|->]');
+    console.log('');
+}
+
+async function cmdAnalytics(args = []) {
+    const subcommand = args[0];
+    if (subcommand !== 'export') {
+        printAnalyticsUsage();
+        process.exit(subcommand ? 1 : 0);
+    }
+    const parsed = parseAnalyticsExportArgs(args.slice(1));
+    if (parsed.options.help) {
+        printAnalyticsUsage();
+        process.exit(0);
+    }
+    if (parsed.error) {
+        console.error('错误:', parsed.error);
+        printAnalyticsUsage();
+        process.exit(1);
+    }
+
+    const result = await exportSessionUsage(parsed.options);
+    if (result && result.error) {
+        console.error('导出失败:', result.error);
+        process.exit(1);
+    }
+    const output = parsed.options.output || (result && result.fileName) || `usage-export.${parsed.options.format}`;
+    if (output === '-') {
+        process.stdout.write(result && result.content ? result.content : '');
+        return;
+    }
+    const outputPath = path.resolve(process.cwd(), output);
+    ensureDir(path.dirname(outputPath));
+    fs.writeFileSync(outputPath, result && result.content ? result.content : '', 'utf-8');
+    console.log(`\n✓ Usage 已导出: ${outputPath}`);
+    console.log(`  格式: ${result.format}; rows: ${Array.isArray(result.rows) ? result.rows.length : 0}`);
+    console.log();
+}
+
 function parseStartOptions(args = []) {
     const options = { host: '', noBrowser: false };
     if (!Array.isArray(args)) {
@@ -11077,6 +11125,20 @@ function createWebServer({ htmlPath, assetsDir, webDir, host, port, openBrowser
                                 }
                             }
                             break;
+                        case 'export-sessions-usage':
+                            {
+                                const usageParams = isPlainObject(params) ? params : {};
+                                const source = typeof usageParams.source === 'string' ? usageParams.source.trim().toLowerCase() : '';
+                                if (source && source !== 'codex' && source !== 'claude' && source !== 'gemini' && source !== 'codebuddy' && source !== 'all') {
+                                    result = { error: 'Invalid source. Must be codex, claude, gemini, codebuddy, or all' };
+                                } else {
+                                    result = await exportSessionUsage({
+                                        ...usageParams,
+                                        source: source || 'all'
+                                    });
+                                }
+                            }
+                            break;
                         case 'list-session-paths':
                             {
                                 const source = typeof params.source === 'string' ? params.source.trim().toLowerCase() : '';
@@ -15960,6 +16022,7 @@ function printMainHelp() {
     console.log('  codexmate delete-model <模型> 删除模型');
     console.log('  codexmate workflow <list|get|validate|run|runs>  MCP 工作流中心');
     console.log('  codexmate task <plan|run|runs|queue|retry|cancel|logs>  本地任务编排');
+    console.log('  codexmate analytics export [--format csv|json] [--from YYYY-MM-DD] [--to YYYY-MM-DD] [--model <MODEL>] [--output <PATH|->] [-o <PATH|->]  导出 Usage 数据');
     console.log('  codexmate run [--host <HOST>] [--no-browser]    启动 Web 界面');
     console.log('  codexmate update [--check] 检查并快速更新工具');
     console.log('  codexmate codex [参数...] [--follow-up <文本>|--queued-follow-up <文本> 可重复]  等同于 codex --yolo');
@@ -16052,6 +16115,7 @@ async function main() {
         case 'proxy': await cmdProxy(args.slice(1)); break;
         case 'workflow': await cmdWorkflow(args.slice(1)); break;
         case 'task': await cmdTask(args.slice(1)); break;
+        case 'analytics': await cmdAnalytics(args.slice(1)); break;
         case 'run': cmdStart(parseStartOptions(args.slice(1))); break;
         case 'update': await cmdToolUpdate(args.slice(1)); break;
         case 'start':

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "codexmate",
-  "version": "0.0.37",
+  "version": "0.0.38",
   "description": "Codex/Claude Code/OpenClaw 配置、会话与任务编排 CLI + Web 工具",
   "main": "cli.js",
   "bin": {

package/web-ui/modules/skills.methods.mjs

@@ -491,7 +491,7 @@ export function createSkillsMethods({ api }) {
             try {
                 const res = await api('import-skills', {
                     targetApp: this.skillsTargetApp,
-                    imports: [skill]
+                    items: [skill]
                 });
                 if (res && res.error) {
                     this.showMessage(res.error, 'error');

package/web-ui/partials/index/panel-config-codex.html.bak

@@ -1,337 +0,0 @@
-                    <!-- Provider 配置模式（Codex） -->
-                    <div
-                        v-show="mainTab === 'config' && isProviderConfigMode"
-                        class="mode-content mode-cards"
-                        id="panel-config-provider"
-                        role="tabpanel"
-                        :aria-labelledby="forceCompactLayout ? 'tab-config' : ('side-tab-config-' + configMode)">
-                <div v-if="forceCompactLayout && !sessionStandalone" class="segmented-control">
-                    <button type="button" :class="['segment', { active: configMode === 'codex' }]" @click="switchConfigMode('codex')">{{ t('tab.config.codex') }}</button>
-                    <button type="button" :class="['segment', { active: configMode === 'claude' }]" @click="switchConfigMode('claude')">{{ t('tab.config.claude') }}</button>
-                    <button type="button" :class="['segment', { active: configMode === 'openclaw' }]" @click="switchConfigMode('openclaw')">{{ t('tab.config.openclaw') }}</button>
-                </div>
-                <template v-if="isCodexConfigMode && shouldShowCliInstallPlaceholder('codex')">
-                    <div class="selector-section">
-                        <div class="empty-state">
-                            <div class="empty-state-title">{{ t('cli.missing.title', { name: 'Codex' }) }}</div>
-                            <div class="empty-state-subtitle">{{ t('cli.missing.subtitle', { name: 'Codex' }) }}</div>
-                            <div class="docs-command-row">
-                                <div class="docs-command-box" role="group" :aria-label="t('cli.missing.commandAria', { name: 'Codex' })">
-                                    <code class="install-command">{{ getInstallCommand('codex', 'install') }}</code>
-                                    <button
-                                        type="button"
-                                        class="btn-mini docs-copy-btn"
-                                        :disabled="!getInstallCommand('codex', 'install')"
-                                        @click="copyInstallCommand(getInstallCommand('codex', 'install'))">{{ t('common.copy') }}</button>
-                                </div>
-                            </div>
-                            <button type="button" class="btn-tool btn-tool-compact" @click="mainTab = 'docs'; setInstallCommandAction('install')">{{ t('cli.missing.openDocs') }}</button>
-                        </div>
-                    </div>
-                </template>
-                <template v-else>
-                <!-- 添加提供商按钮 -->
-                <button class="btn-add" @click="showAddModal = true" v-if="!loading && !initError">
-                    <svg class="icon" viewBox="0 0 20 20" fill="none" stroke="currentColor" stroke-width="2">
-                        <path d="M10 4v12M4 10h12"/>
-                    </svg>
-                    {{ t('config.addProvider') }}
-                </button>
-
-                <!-- 服务预设 -->
-                <div class="selector-section" v-if="isCodexConfigMode && codexProviderTemplates.length">
-                    <div class="selector-header">
-                        <span class="selector-title">{{ t('config.providerTemplate.title') }}</span>
-                    </div>
-                    <div class="btn-group" style="flex-wrap: wrap; gap: 8px; margin-top: 0;">
-                        <button
-                            v-for="tpl in codexProviderTemplates"
-                            :key="tpl.name"
-                            type="button"
-                            class="btn-mini"
-                            @click="newProvider.name = tpl.name;
-                                    newProvider.url = tpl.url;
-                                    newProvider._suggestedModel = tpl.model || '';
-                                    newProvider.useTransform = !!tpl.useTransform;
-                                    showAddModal = true">
-                            {{ tpl.label }}
-                        </button>
-                    </div>
-                </div>
-
-                <!-- 模型选择器 -->
-                <div class="selector-section">
-                    <div class="selector-header">
-                        <span class="selector-title">{{ t('config.models') }}</span>
-                        <div class="selector-actions">
-                            <button class="btn-icon" @click="showModelModal = true" :aria-label="t('modal.modelAdd.title')" :title="t('modal.modelAdd.title')" v-if="modelsSource === 'legacy'">+</button>
-                            <button class="btn-icon" @click="showModelListModal = true" :aria-label="t('modal.modelManage.title')" :title="t('modal.modelManage.title')" v-if="modelsSource === 'legacy'">≡</button>
-                        </div>
-                    </div>
-                    <select
-                        v-if="codexModelsLoading || modelsSource === 'remote'"
-                        class="model-select"
-                        v-model="currentModel"
-                        @change="onModelChange"
-                        :disabled="codexModelsLoading"
-                    >
-                        <option v-if="codexModelsLoading" value="">{{ t('config.modelLoading') }}</option>
-                        <option v-else v-for="model in codexModelOptions" :key="model" :value="model">{{ model }}</option>
-                    </select>
-                    <input
-                        v-if="!codexModelsLoading && (modelsSource !== 'remote' || !modelsHasCurrent)"
-                        class="model-input"
-                        v-model="currentModel"
-                        @blur="onModelChange"
-                        @keyup.enter="onModelChange"
-                        :placeholder="activeProviderModelPlaceholder"
-                        :list="codexModelHasList ? 'codex-model-options' : null"
-                    >
-                    <datalist v-if="codexModelHasList" id="codex-model-options">
-                        <option v-for="model in codexModelOptions" :key="model" :value="model"></option>
-                    </datalist>
-                    <div class="config-template-hint" v-if="modelsSource === 'unlimited'">
-                        {{ t('config.models.unlimited') }}
-                    </div>
-                    <div class="config-template-hint" v-if="modelsSource === 'error'">
-                        {{ t('config.models.error') }}
-                    </div>
-                    <div class="config-template-hint" v-if="modelsSource === 'remote' && !modelsHasCurrent">
-                        {{ isCodexConfigMode ? t('config.models.notInList.codex') : t('config.models.notInList.other') }}
-                    </div>
-                    <div class="config-template-hint" v-if="isCodexConfigMode">
-                        {{ t('config.template.editFirst') }}
-                    </div>
-                    <div class="config-template-hint" v-else-if="activeProviderBridgeHint">
-                        {{ t('config.template.bridgeCodexOnly', { hint: activeProviderBridgeHint }) }}
-                    </div>
-                    <button class="btn-tool btn-template-editor" v-if="isCodexConfigMode" @click="openConfigTemplateEditor" :disabled="loading || !!initError">
-                        {{ t('config.template.openEditor') }}
-                    </button>
-                </div>
-
-                <template v-if="isCodexConfigMode">
-                <div class="selector-section">
-                    <div class="selector-header">
-                        <span class="selector-title">{{ t('config.serviceTier') }}</span>
-                    </div>
-                    <select class="model-select" v-model="serviceTier" @change="onServiceTierChange">
-                        <option value="fast">{{ t('config.serviceTier.fast') }}</option>
-                        <option value="standard">{{ t('config.serviceTier.standard') }}</option>
-                    </select>
-                    <div class="config-template-hint">
-                        {{ t('config.serviceTier.hint', { field: 'service_tier' }) }}
-                    </div>
-                </div>
-
-                <div class="selector-section">
-                    <div class="selector-header">
-                        <span class="selector-title">{{ t('config.reasoningEffort') }}</span>
-                    </div>
-                    <select class="model-select" v-model="modelReasoningEffort" @change="onReasoningEffortChange">
-                        <option value="high">high</option>
-                        <option value="medium">{{ t('config.reasoningEffort.medium') }}</option>
-                        <option value="low">low</option>
-                        <option value="xhigh">xhigh</option>
-                    </select>
-                    <div class="config-template-hint">
-                        {{ t('config.reasoningEffort.hint') }}
-                    </div>
-                </div>
-
-                <div class="selector-section">
-                    <div class="selector-header">
-                        <span class="selector-title">{{ t('config.contextBudget') }}</span>
-                        <div class="selector-actions">
-                            <button
-                                class="btn-tool btn-tool-compact"
-                                @click="resetCodexContextBudgetDefaults"
-                                :disabled="loading || !!initError || codexApplying">
-                                {{ t('config.reset') }}
-                            </button>
-                        </div>
-                    </div>
-                    <div class="codex-config-grid">
-                        <div class="form-group codex-config-field">
-                            <label class="form-label" for="codex-model-context-window">model_context_window</label>
-                            <input
-                                id="codex-model-context-window"
-                                v-model="modelContextWindowInput"
-                                class="form-input"
-                                inputmode="numeric"
-                                autocomplete="off"
-                                :placeholder="t('config.example', { value: 190000 })"
-                                @focus="editingCodexBudgetField = 'modelContextWindowInput'"
-                                @input="sanitizePositiveIntegerDraft('modelContextWindowInput')"
-                                @blur="onModelContextWindowBlur"
-                                @keydown.enter.prevent="onModelContextWindowBlur">
-                            <div class="form-hint">{{ t('config.contextWindow.hint') }}</div>
-                        </div>
-                        <div class="form-group codex-config-field">
-                            <label class="form-label" for="codex-model-auto-compact-token-limit">model_auto_compact_token_limit</label>
-                            <input
-                                id="codex-model-auto-compact-token-limit"
-                                v-model="modelAutoCompactTokenLimitInput"
-                                class="form-input"
-                                inputmode="numeric"
-                                autocomplete="off"
-                                :placeholder="t('config.example', { value: 185000 })"
-                                @focus="editingCodexBudgetField = 'modelAutoCompactTokenLimitInput'"
-                                @input="sanitizePositiveIntegerDraft('modelAutoCompactTokenLimitInput')"
-                                @blur="onModelAutoCompactTokenLimitBlur"
-                                @keydown.enter.prevent="onModelAutoCompactTokenLimitBlur">
-                            <div class="form-hint">{{ t('config.autoCompact.hint') }}</div>
-                        </div>
-                    </div>
-                </div>
-
-                <div class="selector-section">
-                    <div class="selector-header">
-                        <span class="selector-title">AGENTS.md</span>
-                    </div>
-                    <button class="btn-tool" @click="openAgentsEditor" :disabled="loading || !!initError || agentsLoading">
-                        {{ agentsLoading ? t('config.modelLoading') : t('config.agents.open') }}
-                    </button>
-                </div>
-
-                <div class="selector-section">
-                    <div class="selector-header">
-                        <span class="selector-title">{{ t('config.health.title') }}</span>
-                    </div>
-                    <button class="btn-tool" @click="runHealthCheck" :disabled="healthCheckLoading || loading || !!initError">
-                        {{ healthCheckLoading ? t('config.health.running') : t('config.health.run') }}
-                    </button>
-                    <div class="config-template-hint">{{ t('config.health.hint') }}</div>
-                    <div v-if="healthCheckLoading && healthCheckBatchTotal" class="config-template-hint">
-                        {{ t('config.health.progress', { done: healthCheckBatchDone, total: healthCheckBatchTotal, failed: healthCheckBatchFailed }) }}
-                    </div>
-                    <div v-if="healthCheckResult && !healthCheckLoading" class="config-template-hint">
-                        {{ healthCheckResult.ok ? t('config.health.ok') : t('config.health.fail') }} · {{ t('config.health.issues', { count: (healthCheckResult.issues || []).length }) }}
-                    </div>
-                    <button v-if="healthCheckResult && !healthCheckLoading" type="button" class="btn-mini" @click="showHealthCheckModal = true">
-                        {{ t('common.detail') }}
-                    </button>
-                    <div v-if="healthCheckResult && !healthCheckLoading && (healthCheckResult.issues || []).length">
-                        <div v-for="(issue, index) in healthCheckResult.issues" :key="issue.code || ('issue-' + index)" class="config-template-hint">
-                            {{ issue.message || issue.code || '' }}<span v-if="issue.suggestion"> · {{ issue.suggestion }}</span>
-                        </div>
-                    </div>
-                </div>
-
-                </template>
-
-                <div v-if="!loading && !initError" class="card-list">
-                    <div v-for="provider in displayProvidersList" :key="provider.name"
-                         :class="['card', { active: displayCurrentProvider === provider.name }]"
-                         @click="switchProvider(provider.name)"
-                         @keydown.enter.self.prevent="switchProvider(provider.name)"
-                         @keydown.space.self.prevent="switchProvider(provider.name)"
-                         tabindex="0"
-                         role="button"
-                         :aria-current="displayCurrentProvider === provider.name ? 'true' : null">
-                        <div class="card-leading">
-                            <div class="card-icon">{{ provider.name.charAt(0).toUpperCase() }}<span v-if="isTransformProvider(provider)" class="card-icon-dot" title="通过内建转换适配"></span></div>
-                            <div class="card-content">
-                                <div class="card-title">
-                                    <span>{{ provider.name }}</span>
-                                    <span v-if="provider.readOnly" class="provider-readonly-badge">{{ t('config.badge.system') }}</span>
-                                </div>
-                                <div v-if="provider.name !== 'local'" class="card-subtitle card-subtitle-model">
-                                    {{ activeProviderModel(provider.name) || t('config.model.unset') }}
-                                </div>
-                                <div v-if="provider.name !== 'local'" class="card-subtitle card-subtitle-url">
-                                    {{ displayProviderUrl(provider) || t('config.url.unset') }}
-                                </div>
-                            </div>
-                        </div>
-                        <div class="card-trailing">
-                            <span v-if="speedResults[provider.name]" :class="['latency', speedResults[provider.name].ok ? 'ok' : 'error']">
-                                {{ formatLatency(speedResults[provider.name]) }}
-                            </span>
-                            <span :class="['pill', providerPillConfigured(provider) ? 'configured' : 'empty']">
-                                {{ providerPillText(provider) }}
-                            </span>
-                            <div class="card-actions" @click.stop>
-                                <button
-                                    class="card-action-btn"
-                                    :class="{ loading: speedLoading[provider.name] }"
-                                    :disabled="!!speedLoading[provider.name]"
-                                    @click="runSpeedTest(provider.name, { silent: true })"
-                                    :aria-label="t('config.availabilityTestAria', { name: provider.name })"
-                                    :title="t('config.availabilityTest')"
-                                >
-                                    <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
-                                        <path d="M13 2L3 14h7l-1 8 12-14h-7l1-6z"/>
-                                    </svg>
-                                </button>
-                                <button
-                                    v-if="!provider.readOnly"
-                                    class="card-action-btn"
-                                    :class="{ loading: providerShareLoading[provider.name], disabled: !shouldAllowProviderShare(provider) }"
-                                    :disabled="providerShareLoading[provider.name] || !shouldAllowProviderShare(provider)"
-                                    @click="copyProviderShareCommand(provider)"
-                                    :title="shouldAllowProviderShare(provider) ? t('config.shareCommand') : t('config.shareDisabled')"
-                                    :aria-label="t('config.shareCommand.aria')">
-                                    <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
-                                        <path d="M4 12v7a1 1 0 0 0 1 1h14a1 1 0 0 0 1-1v-7"/>
-                                        <path d="M16 6l-4-4-4 4"/>
-                                        <path d="M12 2v14"/>
-                                    </svg>
-                                </button>
-                                <button
-                                    v-if="!provider.readOnly"
-                                    class="card-action-btn"
-                                    :class="{ disabled: !shouldShowProviderEdit(provider) }"
-                                    :disabled="!shouldShowProviderEdit(provider)"
-                                    @click="openEditModal(provider)"
-                                    :aria-label="t('config.provider.edit.aria', { name: provider.name })"
-                                    :title="shouldShowProviderEdit(provider) ? t('common.edit') : t('common.notEditable')">
-                                    <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
-                                        <path d="M11 4H4a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-7"/>
-                                        <path d="M18.5 2.5a2.121 2.121 0 0 1 3 3L12 15l-4 1 1-4 9.5-9.5z"/>
-                                    </svg>
-                                </button>
-                                <button
-                                    v-if="!provider.readOnly"
-                                    class="card-action-btn"
-                                    @click="openCloneProviderModal(provider)"
-                                    :aria-label="t('config.provider.clone.aria', { name: provider.name })"
-                                    :title="t('config.provider.clone')">
-                                    <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
-                                        <rect x="9" y="9" width="13" height="13" rx="2"/>
-                                        <path d="M5 15H4a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h9a2 2 0 0 1 2 2v1"/>
-                                    </svg>
-                                </button>
-                                <button
-                                    v-if="!provider.readOnly"
-                                    class="card-action-btn delete"
-                                    :class="{ disabled: !shouldShowProviderDelete(provider) }"
-                                    :disabled="!shouldShowProviderDelete(provider)"
-                                    @click="deleteProvider(provider.name)"
-                                    :aria-label="t('config.provider.delete.aria', { name: provider.name })"
-                                    :title="shouldShowProviderDelete(provider) ? t('common.delete') : t('common.notDeletable')">
-                                    <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
-                                        <path d="M3 6h18"/>
-                                        <path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6m3 0V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"/>
-                                    </svg>
-                                </button>
-                            </div>
-                        </div>
-                    </div>
-                </div>
-
-                <div v-if="displayCurrentProvider === 'local'" class="local-bridge-panel" style="margin-top:12px;padding:12px;background:var(--card-bg);border-radius:8px;border:1px solid var(--border-color)">
-                    <div style="font-size:13px;font-weight:600;margin-bottom:8px;color:var(--text-secondary)">轮询池 — 勾选参与负载均衡的提供商</div>
-                    <div v-if="localBridgeCandidateProviders().length === 0" style="font-size:12px;color:var(--text-muted)">暂无可用上游 provider，请先添加直连 provider</div>
-                    <label v-for="cp in localBridgeCandidateProviders()" :key="cp.name"
-                        style="display:flex;align-items:center;gap:8px;padding:6px 0;cursor:pointer;font-size:13px">
-                        <input type="checkbox"
-                            :checked="!isLocalBridgeExcluded(cp.name)"
-                            @change="toggleLocalBridgeExcluded(cp.name)"
-                            style="accent-color:var(--accent-color)" />
-                        <span>{{ cp.name }}</span>
-                    </label>
-                </div>
-
-                </template>
-            </div>