import { BaseView } from './BaseView'; import { ContainerConfigData, ConfigViewData } from '../types/ViewTypes'; // Git 分支接口 interface GitBranch { name: string; isCurrent: boolean; isRemote: boolean; selected?: boolean; } // Git 文件树接口 interface GitFileTree { name: string; type: 'file' | 'folder'; path: string; children?: GitFileTree[]; } // Git 仓库接口 interface GitRepo { id: string; name: string; url: string; localPath: string; branch: string; lastSync: string; containerId: string; } export class ConfigView extends BaseView { render(data?: ContainerConfigData & { gitRepos?: GitRepo[]; currentGitRepo?: GitRepo; gitFileTree?: GitFileTree[]; gitLoading?: boolean; gitBranches?: GitBranch[]; gitRepoUrl?: string; }): string { const container = data?.container; const configs = data?.configs || []; const gitRepos = data?.gitRepos || []; const currentGitRepo = data?.currentGitRepo; const gitFileTree = data?.gitFileTree || []; const gitLoading = data?.gitLoading || false; const gitBranches = data?.gitBranches || []; const gitRepoUrl = data?.gitRepoUrl || ''; // 生成配置列表的 HTML - 包含配置文件和 Git 仓库 const configsHtml = configs.map((config: ConfigViewData) => ` 🔧 ${config.name} 📄 ${config.fileName} `).join(''); // 生成 Git 仓库列表的 HTML - 修改显示方式 const gitReposHtml = gitRepos.map(repo => { // 提取仓库名称（从URL中获取或使用name） const repoName = repo.name.split(' (')[0]; // 移除分支名部分 // 提取分支名 const branchMatch = repo.name.match(/\(([^)]+)\)/); const branchName = branchMatch ? branchMatch[1] : repo.branch; return ` 📁 ${repoName}
${branchName} `; }).join(''); // 生成分支选择的 HTML const branchesHtml = gitBranches.length > 0 ? this.generateBranchesHtml(gitBranches) : ''; return ` 配置管理 ${this.getStyles()}

⚙️ 配置管理 - ${container?.name || '未知容器'}

📋 配置文件管理

${configsHtml} ${gitReposHtml}
配置 文件 操作

📚 Git 仓库管理

🔗 添加 Git 仓库

${branchesHtml}
${currentGitRepo ? `
当前仓库: ${currentGitRepo.name} (${currentGitRepo.url})
` : ''}
`; } private generateBranchesHtml(branches: GitBranch[]): string { if (branches.length === 0) return ''; let html = '
'; html += '

🌿 选择要克隆的分支 (共 ' + branches.length + ' 个)

'; html += '
'; branches.forEach(branch => { const branchId = 'branch-' + branch.name.replace(/[^a-zA-Z0-9]/g, '-'); html += '
'; html += ''; html += '
'; }); html += '
'; html += '
'; html += ''; html += ''; html += '
'; return html; } }