0
0
Files
vs-p/out/panels/views/BaseView.js
2025-12-03 16:08:14 +08:00

372 lines
14 KiB
JavaScript
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.BaseView = void 0;
class BaseView {
constructor(extensionUri) {
this.extensionUri = extensionUri;
}
/**
* 获取通用的样式和脚本
*/
getBaseStylesAndScripts() {
return `
<style>
body {
font-family: var(--vscode-font-family);
padding: 20px;
background: var(--vscode-editor-background);
color: var(--vscode-editor-foreground);
margin: 0;
}
.table {
width: 100%;
border-collapse: collapse;
margin-top: 20px;
}
.table th, .table td {
padding: 12px;
text-align: left;
border-bottom: 1px solid var(--vscode-panel-border);
}
.table th {
background: var(--vscode-panel-background);
font-weight: bold;
}
.clickable {
cursor: pointer;
color: var(--vscode-textLink-foreground);
}
.clickable:hover {
text-decoration: underline;
}
.editable {
border: 1px dashed transparent;
padding: 2px 4px;
border-radius: 2px;
cursor: pointer;
}
.editable:hover {
border-color: var(--vscode-input-border);
background: var(--vscode-input-background);
}
.btn-new {
background: var(--vscode-button-background);
color: var(--vscode-button-foreground);
padding: 8px 16px;
border: none;
border-radius: 4px;
cursor: pointer;
}
.btn-new:hover {
background: var(--vscode-button-hoverBackground);
}
.btn-delete {
background: var(--vscode-inputValidation-errorBackground);
color: white;
padding: 4px 8px;
border: none;
border-radius: 2px;
cursor: pointer;
}
.back-btn {
background: var(--vscode-button-secondaryBackground);
color: var(--vscode-button-secondaryForeground);
padding: 6px 12px;
border: none;
border-radius: 4px;
cursor: pointer;
}
.back-btn:hover {
background: var(--vscode-button-secondaryHoverBackground);
}
.header {
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 20px;
border-bottom: 1px solid var(--vscode-panel-border);
padding-bottom: 15px;
}
h2 {
color: var(--vscode-titleBar-activeForeground);
margin-bottom: 10px;
}
.config-editor {
margin-top: 30px;
border: 1px solid var(--vscode-panel-border);
border-radius: 4px;
padding: 20px;
background: var(--vscode-panel-background);
}
textarea {
width: 100%;
height: 300px;
font-family: 'Courier New', monospace;
background: var(--vscode-input-background);
color: var(--vscode-input-foreground);
border: 1px solid var(--vscode-input-border);
padding: 10px;
border-radius: 4px;
resize: vertical;
}
.btn-primary {
background: var(--vscode-button-background);
color: var(--vscode-button-foreground);
padding: 8px 16px;
border: none;
border-radius: 4px;
cursor: pointer;
margin-right: 10px;
}
.modal-overlay {
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
background: rgba(0, 0, 0, 0.5);
display: flex;
justify-content: center;
align-items: center;
z-index: 1000;
}
.modal-dialog {
background: var(--vscode-editor-background);
border: 1px solid var(--vscode-panel-border);
border-radius: 4px;
padding: 20px;
min-width: 300px;
max-width: 500px;
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.3);
}
.modal-title {
margin-bottom: 15px;
font-weight: bold;
color: var(--vscode-editor-foreground);
}
.modal-buttons {
display: flex;
justify-content: flex-end;
gap: 10px;
margin-top: 20px;
}
.modal-btn {
padding: 6px 12px;
border: none;
border-radius: 4px;
cursor: pointer;
}
.modal-btn-primary {
background: var(--vscode-button-background);
color: var(--vscode-button-foreground);
}
.modal-btn-secondary {
background: var(--vscode-button-secondaryBackground);
color: var(--vscode-button-secondaryForeground);
}
</style>
<script>
// 对话框工具函数
function showConfirmDialog(title, message, onConfirm, onCancel) {
const overlay = document.createElement('div');
overlay.className = 'modal-overlay';
overlay.id = 'confirmModal';
overlay.innerHTML = \`
<div class="modal-dialog">
<div class="modal-title">\${title}</div>
<div>\${message}</div>
<div class="modal-buttons">
<button class="modal-btn modal-btn-secondary" onclick="closeConfirmDialog(false)">取消</button>
<button class="modal-btn modal-btn-primary" onclick="closeConfirmDialog(true)">确定</button>
</div>
</div>
\`;
document.body.appendChild(overlay);
window.confirmCallback = function(result) {
if (result && onConfirm) {
onConfirm();
} else if (!result && onCancel) {
onCancel();
}
delete window.confirmCallback;
};
}
function closeConfirmDialog(result) {
const modal = document.getElementById('confirmModal');
if (modal) {
modal.remove();
}
if (window.confirmCallback) {
window.confirmCallback(result);
}
}
function showPromptDialog(title, message, defaultValue, onConfirm) {
const overlay = document.createElement('div');
overlay.className = 'modal-overlay';
overlay.id = 'promptModal';
overlay.innerHTML = \`
<div class="modal-dialog">
<div class="modal-title">\${title}</div>
<div>\${message}</div>
<input type="text" id="promptInput" value="\${defaultValue}" style="width: 100%; margin: 10px 0; padding: 6px; background: var(--vscode-input-background); color: var(--vscode-input-foreground); border: 1px solid var(--vscode-input-border);">
<div class="modal-buttons">
<button class="modal-btn modal-btn-secondary" onclick="closePromptDialog(null)">取消</button>
<button class="modal-btn modal-btn-primary" onclick="closePromptDialog(document.getElementById('promptInput').value)">确定</button>
</div>
</div>
\`;
document.body.appendChild(overlay);
setTimeout(() => {
const input = document.getElementById('promptInput');
if (input) {
input.focus();
input.select();
}
}, 100);
window.promptCallback = onConfirm;
}
function closePromptDialog(result) {
const modal = document.getElementById('promptModal');
if (modal) {
modal.remove();
}
if (window.promptCallback) {
window.promptCallback(result);
}
delete window.promptCallback;
}
</script>
`;
}
/**
* 获取仓库选择对话框的脚本仅ConfigView需要
*/
getRepoSelectScript() {
return `
<script>
(function () {
// 避免在同一个 Webview 中重复注册
if (window.__dcspRepoDialogInitialized) {
return;
}
window.__dcspRepoDialogInitialized = true;
function showRepoSelectDialog(repos) {
// 移除已有弹窗
var existing = document.getElementById('repoSelectModal');
if (existing) {
existing.remove();
}
var overlay = document.createElement('div');
overlay.className = 'modal-overlay';
overlay.id = 'repoSelectModal';
var hasRepos = Array.isArray(repos) && repos.length > 0;
var optionsHtml = '';
if (hasRepos) {
for (var i = 0; i < repos.length; i++) {
var r = repos[i];
if (!r || !r.name) continue;
optionsHtml += '<option value="' + r.name + '">' + r.name + '</option>';
}
}
var disabledAttr = hasRepos ? '' : 'disabled';
var noRepoTip = '';
if (!hasRepos) {
noRepoTip = '<div style="margin-top:8px; font-size:12px; color: var(--vscode-descriptionForeground);">当前配置中没有仓库,请先在"仓库配置"中添加。</div>';
}
overlay.innerHTML =
'<div class="modal-dialog">' +
'<div class="modal-title">获取仓库</div>' +
'<div style="margin-bottom: 10px;">' +
'<label style="display:block; margin-bottom:6px;">请选择仓库:</label>' +
'<select id="repoSelect" style="width:100%; padding:6px; background: var(--vscode-input-background); color: var(--vscode-input-foreground); border:1px solid var(--vscode-input-border); border-radius:4px;">' +
optionsHtml +
'</select>' +
noRepoTip +
'</div>' +
'<div class="modal-buttons">' +
'<button class="modal-btn modal-btn-secondary" id="repoSelectCancelBtn">取消</button>' +
'<button class="modal-btn modal-btn-primary" id="repoSelectOkBtn" ' + disabledAttr + '>确定</button>' +
'</div>' +
'</div>';
document.body.appendChild(overlay);
var cancelBtn = document.getElementById('repoSelectCancelBtn');
var okBtn = document.getElementById('repoSelectOkBtn');
var select = document.getElementById('repoSelect');
if (cancelBtn) {
cancelBtn.addEventListener('click', function () {
if (typeof vscode !== 'undefined') {
vscode.postMessage({
type: 'repoSelectCanceled'
});
}
overlay.remove();
});
}
if (okBtn) {
okBtn.addEventListener('click', function () {
if (!select || !(select instanceof HTMLSelectElement)) {
overlay.remove();
return;
}
var repoName = select.value;
if (!repoName) {
alert('请选择一个仓库');
return;
}
if (typeof vscode !== 'undefined') {
vscode.postMessage({
type: 'repoSelectedForBranches',
repoName: repoName
});
}
overlay.remove();
});
}
}
window.addEventListener('message', function (event) {
var message = event.data;
if (!message || !message.type) return;
if (message.type === 'showRepoSelect') {
showRepoSelectDialog(message.repos || []);
}
});
})();
</script>
`;
}
/**
* 获取样式(被子类覆盖)
*/
getStyles() {
return this.getBaseStylesAndScripts();
}
}
exports.BaseView = BaseView;
//# sourceMappingURL=BaseView.js.map