zhongyou
/
scm-harmonic-cmts-admin
0
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

enha: debug tool in god-mode

This commit is contained in:
swpa 2026-05-15 17:25:09 +08:00
parent bee63b78ec
commit f86a449642
3 changed files with 105 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
static/app.js
View File

@ -25,7 +25,7 @@ import { buildTree, buildRealFilterTree, expandAll, collapseAll } from './tree-u
import {
releaseAllLocks, startEditFolder, startEditLeaf,
cancelEditFolder, cancelEditLeaf, previewFolderCLI, previewLeafCLI,
hideSideCLI, executeSideCLI
hideSideCLI, executeSideCLI, previewNodeCLI
} from './edit-mode.js';
// 6. MAC Domain 配置模組 (MAC Domain)
@ -595,6 +595,11 @@ document.addEventListener('DOMContentLoaded', () => {
const btn = document.getElementById(id);
if (btn) btn.style.display = 'inline-block';
});
// 🌟 新增：解鎖樹狀圖裡的所有 🔍 預覽按鈕
document.querySelectorAll('.debug-preview-btn').forEach(btn => {
btn.style.display = 'inline-block';
});
}
const urlParams = new URLSearchParams(window.location.search);
@ -701,6 +706,7 @@ window.scanVisibleMissingOptions = scanVisibleMissingOptions;
window.scanGlobalMissingOptions = scanGlobalMissingOptions;
window.clearVisibleCache = clearVisibleCache;
window.clearGlobalCache = clearGlobalCache;
window.previewNodeCLI = previewNodeCLI;
// --- 樹狀圖展開與編輯操作 ---
window.expandAll = expandAll;

82
static/edit-mode.js
View File

@ -589,3 +589,85 @@ function transformNoToActive(elementId, newCommand) {
if (actionBtns) actionBtns.style.display = 'none';
if (editBtn) editBtn.style.display = 'none';
}
// ============================================================================
// 💻 開發者工具：預覽節點完整指令 (唯讀 Debug 模式)
// ============================================================================
export function previewNodeCLI(btnElement, rootPath) {
// 1. 定位當前點擊的容器
let container = btnElement.closest('details');
if (!container) {
const leafNode = btnElement.closest('.tree-leaf-node');
if (leafNode) container = leafNode.querySelector('.leaf-container');
}
if (!container) return;
let cliOutput = `! =========================================\n`;
cliOutput += `! 🔍 [Debug] 節點預覽: ${rootPath}\n`;
cliOutput += `! =========================================\n`;
cliOutput += `${rootPath.replace(/::/g, ' ')}\n`;
// 2. 找出該節點下所有的葉節點 (包含自己)
const allLeaves = container.classList.contains('leaf-container')
? [container]
: Array.from(container.querySelectorAll('.leaf-container'));
if (allLeaves.length === 1 && allLeaves[0] === container) {
// 情況 A：它自己就是最底層的葉節點
const val = container.getAttribute('data-original');
if (val) cliOutput += ` ${val}\n`;
} else {
// 情況 B：它是一個資料夾，遞迴列出所有子項目的相對路徑與值
allLeaves.forEach(leaf => {
const leafPath = leaf.getAttribute('data-path');
const leafVal = leaf.getAttribute('data-original');
if (leafPath && leafVal !== null) {
const relativePath = leafPath.replace(rootPath, '').replace(/^::/, '').replace(/::/g, ' ');
cliOutput += ` ${relativePath} ${leafVal}\n`;
}
});
}
cliOutput += `exit\n`;
// 3. 呼叫現有的樹狀圖側邊欄 (Side Pane) 顯示
const leftPane = document.getElementById('tree-container');
const resizer = document.getElementById('drag-resizer');
const rightPane = document.getElementById('side-cli-preview');
if (!rightPane) {
console.error("找不到側邊欄元素 'side-cli-preview'");
return;
}
// 設定標題與樣式
document.getElementById('side-pane-title').innerHTML = '🔍 節點指令預覽 (唯讀)';
document.getElementById('side-pane-title').style.color = '#3498db';
// 隱藏「確認寫入」按鈕，只顯示「取消/關閉」按鈕
document.getElementById('btn-side-confirm').style.display = 'none';
document.getElementById('btn-side-cancel').style.display = 'inline-block';
document.getElementById('btn-side-close').style.display = 'none';
// 顯示 Textarea 並填入內容
const textarea = document.getElementById('side-cli-textarea');
textarea.style.display = 'block';
textarea.value = cliOutput;
textarea.style.backgroundColor = '#1e1e1e'; // 終端機深色背景
textarea.style.color = '#d4d4d4';
document.getElementById('side-execution-result').style.display = 'none';
// 展開側邊欄
leftPane.style.width = 'calc(50% - 11px)';
rightPane.style.width = 'calc(50% - 11px)';
if (resizer) resizer.style.display = 'flex';
rightPane.style.display = 'block';
// 初始化拖拉分隔線 (如果尚未初始化)
if (!window.isResizerInitialized && typeof initResizer === 'function') {
initResizer();
window.isResizerInitialized = true;
}
}

16
static/tree-ui.js
View File

@ -81,6 +81,14 @@ export function buildTree(node, path = '', isParentCommandGroup = false) {
${expandCollapseBtns}
<div style="margin-left: auto; display: flex; align-items: center;">
<span class="debug-preview-btn admin-only"
onclick="event.stopPropagation(); event.preventDefault(); previewNodeCLI(this, '${currentPath}')"
style="display: none; cursor: pointer; margin-right: 8px; font-size: 14px; transition: transform 0.2s;"
title="[開發者] 預覽此節點下所有指令"
onmouseover="this.style.transform='scale(1.2)'"
onmouseout="this.style.transform='scale(1)'">
🔍
</span>
<span id="edit-btn-${elementId}" onclick="event.stopPropagation(); event.preventDefault(); startEditFolder('${currentPath}', '${elementId}')"
style="cursor: pointer; font-size: 14px; opacity: 0.3; transition: opacity 0.2s;"
onmouseover="this.style.opacity=1" onmouseout="this.style.opacity=0.3" title="鎖定並編輯此群組">
@ -151,6 +159,14 @@ export function buildTree(node, path = '', isParentCommandGroup = false) {
${displayContent}
<div style="margin-left: auto; display: flex; align-items: center;">
<span class="debug-preview-btn admin-only"
onclick="event.stopPropagation(); event.preventDefault(); previewNodeCLI(this, '${currentPath}')"
style="display: none; cursor: pointer; margin-right: 8px; font-size: 14px; transition: transform 0.2s;"
title="[開發者] 預覽此節點下所有指令"
onmouseover="this.style.transform='scale(1.2)'"
onmouseout="this.style.transform='scale(1)'">
🔍
</span>
<span id="edit-btn-${elementId}" onclick="event.stopPropagation(); event.preventDefault(); startEditLeaf('${currentPath}', '${elementId}')"
style="cursor: pointer; font-size: 14px; opacity: 0.3; transition: opacity 0.2s;"
onmouseover="this.style.opacity=1" onmouseout="this.style.opacity=0.3" title="鎖定並編輯此項目">