xb/vs-p
0
0
Fork 0
Code Issues Activity

暂时添加了合并功能，但是存在很多BUG

Browse Source
This commit is contained in:
xubing
2025-11-27 20:10:09 +08:00
parent 9f44664b0b
commit 97c897962f
6 changed files with 1151 additions and 199 deletions
Download Patch File Download Diff File Expand all files Collapse all files

279
out/panels/views/ConfigView.js
View File

@@ -12,10 +12,12 @@ class ConfigView extends BaseView_1.BaseView {
const gitLoading = data?.gitLoading || false;
const gitBranches = data?.gitBranches || [];
const gitRepoUrl = data?.gitRepoUrl || '';
const mergedFolders = data?.mergedFolders || [];
// 生成配置列表的 HTML - 包含配置文件和 Git 仓库
const configsHtml = configs.map((config) => `
<tr>
<td>
<input type="checkbox" class="config-checkbox" data-id="${config.id}" data-type="config">
<span class="editable" onclick="editConfigName('${config.id}', '${config.name}')">🔧 ${config.name}</span>
</td>
<td>
@@ -26,7 +28,24 @@ class ConfigView extends BaseView_1.BaseView {
</td>
</tr>
`).join('');
// 生成 Git 仓库列表的 HTML - 修改显示方式
// 生成合并文件夹的 HTML - 显示在配置列表中
const mergedFoldersHtml = mergedFolders.map((folder) => `
<tr>
<td>
<span class="editable">📁 ${folder.displayName}</span>
<div style="font-size: 12px; color: var(--vscode-descriptionForeground); margin-top: 4px;">
包含 ${folder.fileCount} 个文件
</div>
</td>
<td>
<span class="clickable" onclick="loadMergedFolder('${folder.id}')">${folder.folderName}</span>
</td>
<td>
<button class="btn-delete" onclick="deleteMergedFolder('${folder.id}')">删除</button>
</td>
</tr>
`).join('');
// 生成 Git 仓库列表的 HTML - 修改显示方式，Git 仓库不可勾选
const gitReposHtml = gitRepos.map(repo => {
// 提取仓库名称（从URL中获取或使用name）
const repoName = repo.name.split(' (')[0]; // 移除分支名部分
@@ -152,6 +171,69 @@ class ConfigView extends BaseView_1.BaseView {
.branch-tree-title {
font-size: 1.2em;
}
/* 复选框样式 */
.config-checkbox {
margin-right: 8px;
}
/* 操作按钮样式 */
.action-buttons {
display: flex;
gap: 10px;
margin-bottom: 15px;
}
.btn-merge {
background: var(--vscode-button-background);
color: var(--vscode-button-foreground);
border: none;
padding: 8px 16px;
border-radius: 4px;
cursor: pointer;
}
.btn-merge:hover {
background: var(--vscode-button-hoverBackground);
}
.btn-merge:disabled {
background: var(--vscode-button-secondaryBackground);
color: var(--vscode-button-secondaryForeground);
cursor: not-allowed;
}
/* 合并弹窗样式 */
.merge-dialog-content {
display: flex;
gap: 15px;
margin: 15px 0;
}
.merge-input-section {
flex: 1;
}
.merge-input-label {
font-weight: bold;
margin-bottom: 8px;
display: block;
}
.merge-input-field {
width: 100%;
padding: 8px;
background: var(--vscode-input-background);
color: var(--vscode-input-foreground);
border: 1px solid var(--vscode-input-border);
border-radius: 4px;
margin-bottom: 5px;
}
.merge-input-help {
font-size: 12px;
color: var(--vscode-descriptionForeground);
}
</style>
</head>
<body>
@@ -163,6 +245,13 @@ class ConfigView extends BaseView_1.BaseView {
<!-- 配置文件管理部分 -->
<div class="config-section">
<h3 class="section-title">📋 配置文件管理</h3>
<!-- 操作按钮区域 -->
<div class="action-buttons">
<button class="btn-new" onclick="createNewConfig()">+ 新建配置</button>
<button class="btn-merge" id="mergeButton" onclick="mergeSelectedConfigs()" disabled>合并选中配置</button>
</div>
<table class="table">
<thead>
<tr>
@@ -173,12 +262,8 @@ class ConfigView extends BaseView_1.BaseView {
</thead>
<tbody>
${configsHtml}
${mergedFoldersHtml}
${gitReposHtml}
<tr>
<td colspan="3" style="text-align: center; padding: 20px;">
<button class="btn-new" onclick="createNewConfig()">+ 新建配置</button>
</td>
</tr>
</tbody>
</table>
</div>
@@ -210,6 +295,7 @@ class ConfigView extends BaseView_1.BaseView {
let selectedBranches = new Set();
let currentRepoUrl = '';
let branchTreeData = [];
let selectedConfigs = new Set();
// 配置管理功能
function editConfigName(configId, currentName) {
@@ -238,6 +324,24 @@ class ConfigView extends BaseView_1.BaseView {
});
}
// 新功能：加载合并文件夹（与 Git 仓库行为一致）
function loadMergedFolder(folderId) {
console.log('📂 加载合并文件夹:', folderId);
vscode.postMessage({
type: 'loadMergedFolder',
folderId: folderId
});
}
function openGitRepoInVSCode(repoId) {
console.log('📂 在 VSCode 中打开 Git 仓库文件选择器:', repoId);
vscode.postMessage({
type: 'openGitRepoInVSCode',
repoId: repoId
});
}
function createNewConfig() {
showPromptDialog(
'新建配置',
@@ -272,6 +376,27 @@ class ConfigView extends BaseView_1.BaseView {
);
}
// 删除合并文件夹功能
function deleteMergedFolder(folderId) {
console.log('🗑️ 尝试删除合并文件夹:', folderId);
showConfirmDialog(
'确认删除合并文件夹',
'确定删除这个合并文件夹吗？这将删除文件夹及其所有内容。',
function() {
console.log('✅ 用户确认删除合并文件夹:', folderId);
vscode.postMessage({
type: 'deleteMergedFolder',
folderId: folderId
});
},
function() {
// 用户取消删除
console.log('❌ 用户取消删除合并文件夹');
}
);
}
// Git 仓库删除功能
function deleteGitRepo(repoId) {
console.log('🗑️ 尝试删除 Git 仓库:', repoId);
@@ -293,15 +418,6 @@ class ConfigView extends BaseView_1.BaseView {
);
}
// 新功能：在 VSCode 中打开 Git 仓库
function openGitRepoInVSCode(repoId) {
console.log('📂 在 VSCode 中打开 Git 仓库:', repoId);
vscode.postMessage({
type: 'openGitRepoInVSCode',
repoId: repoId
});
}
function goBackToContainers() {
vscode.postMessage({ type: 'goBackToContainers' });
}
@@ -376,14 +492,6 @@ class ConfigView extends BaseView_1.BaseView {
});
}
function loadGitRepo(repoId) {
console.log('📂 加载仓库:', repoId);
vscode.postMessage({
type: 'loadGitRepo',
repoId: repoId
});
}
function syncGitRepo(repoId) {
console.log('🔄 同步仓库:', repoId);
vscode.postMessage({
@@ -392,6 +500,123 @@ class ConfigView extends BaseView_1.BaseView {
});
}
// 配置文件合并功能
function toggleConfigSelection(configId) {
const checkbox = document.querySelector('.config-checkbox[data-id="' + configId + '"]');
if (checkbox.checked) {
selectedConfigs.add(configId);
} else {
selectedConfigs.delete(configId);
}
// 更新合并按钮状态
updateMergeButtonState();
console.log('选中的配置文件:', Array.from(selectedConfigs));
}
function updateMergeButtonState() {
const mergeButton = document.getElementById('mergeButton');
if (mergeButton) {
mergeButton.disabled = selectedConfigs.size < 2;
}
}
function mergeSelectedConfigs() {
if (selectedConfigs.size < 2) {
alert('请至少选择两个配置文件进行合并');
return;
}
console.log('🔄 开始合并选中的配置文件:', Array.from(selectedConfigs));
// 弹出新的合并对话框
showMergeDialog();
}
// 新的合并对话框函数
function showMergeDialog() {
const overlay = document.createElement('div');
overlay.className = 'modal-overlay';
overlay.id = 'mergeModal';
overlay.innerHTML = \`
<div class="modal-dialog" style="width: 500px;">
<div class="modal-title">合并配置文件</div>
<div class="merge-dialog-content">
<div class="merge-input-section">
<label class="merge-input-label">配置显示名称</label>
<input type="text" id="displayNameInput" class="merge-input-field"
placeholder="在配置栏显示的名称" value="合并配置">
<div class="merge-input-help">在左侧配置栏显示的名称</div>
</div>
<div class="merge-input-section">
<label class="merge-input-label">文件夹名称</label>
<input type="text" id="folderNameInput" class="merge-input-field"
placeholder="文件夹的实际名称" value="merged-config">
<div class="merge-input-help">磁盘上的实际文件夹名称</div>
</div>
</div>
<div class="modal-buttons">
<button class="modal-btn modal-btn-secondary" onclick="closeMergeDialog()">取消</button>
<button class="modal-btn modal-btn-primary" onclick="confirmMerge()">确定合并</button>
</div>
</div>
\`;
document.body.appendChild(overlay);
// 自动聚焦到第一个输入框
setTimeout(() => {
const displayNameInput = document.getElementById('displayNameInput');
if (displayNameInput) {
displayNameInput.focus();
displayNameInput.select();
}
}, 100);
}
function confirmMerge() {
const displayNameInput = document.getElementById('displayNameInput');
const folderNameInput = document.getElementById('folderNameInput');
const displayName = displayNameInput.value.trim();
const folderName = folderNameInput.value.trim();
if (!displayName) {
alert('请输入配置显示名称');
return;
}
if (!folderName) {
alert('请输入文件夹名称');
return;
}
if (displayName && folderName) {
vscode.postMessage({
type: 'mergeConfigs',
configIds: Array.from(selectedConfigs),
displayName: displayName,
folderName: folderName
});
// 重置选择
selectedConfigs.clear();
const checkboxes = document.querySelectorAll('.config-checkbox');
checkboxes.forEach(checkbox => checkbox.checked = false);
updateMergeButtonState();
closeMergeDialog();
}
}
function closeMergeDialog() {
const modal = document.getElementById('mergeModal');
if (modal) {
modal.remove();
}
}
// 树状分支功能
function toggleBranchNode(nodeId) {
const node = findNodeById(branchTreeData, nodeId);
@@ -608,6 +833,14 @@ class ConfigView extends BaseView_1.BaseView {
// 初始化
document.addEventListener('DOMContentLoaded', function() {
console.log('📄 ConfigView 页面加载完成');
// 为所有配置复选框添加事件监听
document.addEventListener('change', function(event) {
if (event.target.classList.contains('config-checkbox')) {
const configId = event.target.getAttribute('data-id');
toggleConfigSelection(configId);
}
});
});
</script>
</body>