mirror of
https://github.com/Youzini-afk/ST-Bionic-Memory-Ecology.git
synced 2026-05-15 22:30:38 +08:00
feat: 左右面板可拖拽调整比例
- 在侧边栏与图谱区之间添加拖拽分隔条 - hover 时显示主题色高亮和小手柄 - 拖拽范围 180px~600px - 拖拽时禁用文字选中,确保流畅操作
This commit is contained in:
37
panel.js
37
panel.js
@@ -163,6 +163,7 @@ export async function initPanel({
|
||||
|
||||
_bindTabs();
|
||||
_bindClose();
|
||||
_bindResizeHandle();
|
||||
_bindGraphControls();
|
||||
_bindActions();
|
||||
_bindConfigControls();
|
||||
@@ -528,6 +529,42 @@ function _bindClose() {
|
||||
});
|
||||
}
|
||||
|
||||
function _bindResizeHandle() {
|
||||
const handle = document.getElementById("bme-resize-handle");
|
||||
const sidebar = panelEl?.querySelector(".bme-panel-sidebar");
|
||||
if (!handle || !sidebar) return;
|
||||
|
||||
let dragging = false;
|
||||
let startX = 0;
|
||||
let startWidth = 0;
|
||||
|
||||
handle.addEventListener("mousedown", (e) => {
|
||||
e.preventDefault();
|
||||
dragging = true;
|
||||
startX = e.clientX;
|
||||
startWidth = sidebar.offsetWidth;
|
||||
handle.classList.add("dragging");
|
||||
document.body.style.cursor = "col-resize";
|
||||
document.body.style.userSelect = "none";
|
||||
});
|
||||
|
||||
document.addEventListener("mousemove", (e) => {
|
||||
if (!dragging) return;
|
||||
const delta = e.clientX - startX;
|
||||
const newWidth = Math.max(180, Math.min(600, startWidth + delta));
|
||||
sidebar.style.width = newWidth + "px";
|
||||
sidebar.style.minWidth = newWidth + "px";
|
||||
});
|
||||
|
||||
document.addEventListener("mouseup", () => {
|
||||
if (!dragging) return;
|
||||
dragging = false;
|
||||
handle.classList.remove("dragging");
|
||||
document.body.style.cursor = "";
|
||||
document.body.style.userSelect = "";
|
||||
});
|
||||
}
|
||||
|
||||
// ==================== 操作绑定 ====================
|
||||
|
||||
function _bindActions() {
|
||||
|
||||
Reference in New Issue
Block a user