修复运行异常

This commit is contained in:
zqm
2025-12-29 09:05:37 +08:00
parent 09e4076635
commit 9aad6ebc21
10 changed files with 448 additions and 281 deletions

View File

@@ -79,7 +79,11 @@ const mainAreaConfig = ref({
id: 'MainArea',
title: '主区域',
windowState: windowState.value,
showTitleBar: false
showTitleBar: false,
children: {
type: 'TabPage',
children: []
}
})
// 浮动区域列表 - 每个area包含panels数组
@@ -102,7 +106,27 @@ const mainAreaResizeBars = ref([])
// 检查主区域内是否有其他Area简化版
const hasAreasInMainContent = ref(false)
// Area相关事件处理
const shouldOperateAreaInsteadOfPanel = (areaId) => {
const area = floatingAreas.value.find(a => a.id === areaId);
if (!area) return false;
const childrenArray = Array.isArray(area.children) ? area.children : [area.children];
if (childrenArray.length !== 1) return false;
const tabPage = childrenArray[0];
if (tabPage.type !== 'TabPage') return false;
const tabPageChildren = tabPage.children;
const tabPageChildrenArray = Array.isArray(tabPageChildren) ? tabPageChildren : [tabPageChildren];
if (tabPageChildrenArray.length !== 1) return false;
// 检查TabPage的children是否是Panel组件
const childItem = tabPageChildrenArray[0];
if (childItem.type !== 'Panel') return false;
return true;
};
const onCloseFloatingArea = (event) => {
const id = event.areaId;
areaActions.closeFloatingArea(id);
@@ -124,27 +148,55 @@ const onUpdatePosition = (event) => {
const onMaximize = (event) => {
const panelId = event.panelId;
areaActions.toggleMaximize(panelId);
const areaId = event.areaId;
if (shouldOperateAreaInsteadOfPanel(areaId)) {
areaActions.toggleMaximize(areaId);
} else {
panelActions.maximize(panelId);
}
};
const onClosePanel = (event) => {
const onPanelClose = (event) => {
const areaId = event.areaId;
const panelId = event.panelId;
areaActions.closePanel(areaId, panelId);
const area = floatingAreas.value.find(a => a.id === areaId);
if (area && area.children) {
// 移除对应面板
for (const child of area.children) {
if (child.type === 'TabPage' && child.children && child.children.type === 'Panel') {
const panels = child.children.items || [];
const panelIndex = panels.findIndex(p => p.id === panelId);
if (panelIndex !== -1) {
panels.splice(panelIndex, 1);
// 如果没有面板了移除整个TabPage
if (panels.length === 0) {
const tabPageIndex = area.children.indexOf(child);
if (tabPageIndex !== -1) {
area.children.splice(tabPageIndex, 1);
if (shouldOperateAreaInsteadOfPanel(areaId)) {
onCloseFloatingArea({ areaId });
} else {
areaActions.closePanel(areaId, panelId);
const area = floatingAreas.value.find(a => a.id === areaId);
if (area && area.children) {
for (const child of area.children) {
if (child.type === 'TabPage' && child.children) {
// 处理TabPage的children可能是单个Panel或Panel数组
const isArray = Array.isArray(child.children);
const childrenArray = isArray ? child.children : [child.children];
// 检查每个子项是否为Panel组件
for (let i = 0; i < childrenArray.length; i++) {
const item = childrenArray[i];
if (item.type === 'Panel' && item.id === panelId) {
// 从数组中移除Panel
if (isArray) {
child.children.splice(i, 1);
} else {
// 如果是单个Panel移除整个TabPage
const tabPageIndex = area.children.indexOf(child);
if (tabPageIndex !== -1) {
area.children.splice(tabPageIndex, 1);
}
break;
}
// 如果Panel数组为空移除TabPage
if (child.children.length === 0) {
const tabPageIndex = area.children.indexOf(child);
if (tabPageIndex !== -1) {
area.children.splice(tabPageIndex, 1);
}
}
break;
}
}
break;
@@ -170,7 +222,70 @@ const handleAreaDragOver = (event) => {
};
const handleAreaDragLeave = (event) => {
globalEventActions.handleDragLeave('floating-area', event);
globalEventActions.handleDragLeave('floating-area');
};
const onPanelDragStart = (event) => {
const areaId = event.areaId;
if (shouldOperateAreaInsteadOfPanel(areaId)) {
const area = floatingAreas.value.find(a => a.id === areaId);
const startLeft = area ? (area.x || 0) : 0;
const startTop = area ? (area.y || 0) : 0;
eventBus.emit(EVENT_TYPES.AREA_DRAG_START, {
dragId: event.dragId,
areaId: areaId,
event: {
clientX: event.position.x,
clientY: event.position.y
},
element: null,
position: event.position,
clientX: event.position.x,
clientY: event.position.y,
startLeft: startLeft,
startTop: startTop,
timestamp: event.timestamp
});
}
};
const onPanelDragMove = (event) => {
const areaId = event.areaId;
if (shouldOperateAreaInsteadOfPanel(areaId)) {
eventBus.emit(EVENT_TYPES.AREA_DRAG_MOVE, {
dragId: event.dragId,
areaId: areaId,
event: {
clientX: event.position.x,
clientY: event.position.y
},
position: event.position,
clientX: event.position.x,
clientY: event.position.y,
timestamp: event.timestamp
});
}
};
const onPanelDragEnd = (event) => {
const areaId = event.areaId;
if (shouldOperateAreaInsteadOfPanel(areaId)) {
const area = floatingAreas.value.find(a => a.id === areaId);
const left = area ? (area.x || 0) : 0;
const top = area ? (area.y || 0) : 0;
eventBus.emit(EVENT_TYPES.AREA_DRAG_END, {
dragId: event.dragId,
areaId: areaId,
finalPosition: {
x: left,
y: top
},
left: left,
top: top
});
}
};
// 其他事件处理方法
@@ -285,9 +400,12 @@ const setupEventListeners = () => {
unsubscribeFunctions.push(eventBus.on(EVENT_TYPES.PANEL_TOGGLE_COLLAPSE, () => emit('toggleCollapse'), { componentId: 'dock-layout' }));
unsubscribeFunctions.push(eventBus.on(EVENT_TYPES.PANEL_MAXIMIZE, onMaximize, { componentId: 'dock-layout' }));
unsubscribeFunctions.push(eventBus.on(EVENT_TYPES.PANEL_CLOSE_REQUEST, onCloseFloatingArea, { componentId: 'dock-layout' }));
unsubscribeFunctions.push(eventBus.on(EVENT_TYPES.PANEL_CLOSE, onClosePanel, { componentId: 'dock-layout' }));
unsubscribeFunctions.push(eventBus.on(EVENT_TYPES.PANEL_CLOSE, onPanelClose, { componentId: 'dock-layout' }));
unsubscribeFunctions.push(eventBus.on(EVENT_TYPES.PANEL_TOGGLE_TOOLBAR, () => emit('toggleToolbar'), { componentId: 'dock-layout' }));
unsubscribeFunctions.push(eventBus.on(EVENT_TYPES.PANEL_MAXIMIZE_SYNC, onPanelMaximizeSync, { componentId: 'dock-layout' }));
unsubscribeFunctions.push(eventBus.on(EVENT_TYPES.PANEL_DRAG_START, onPanelDragStart, { componentId: 'dock-layout' }));
unsubscribeFunctions.push(eventBus.on(EVENT_TYPES.PANEL_DRAG_MOVE, onPanelDragMove, { componentId: 'dock-layout' }));
unsubscribeFunctions.push(eventBus.on(EVENT_TYPES.PANEL_DRAG_END, onPanelDragEnd, { componentId: 'dock-layout' }));
// Resize相关事件
unsubscribeFunctions.push(eventBus.on(EVENT_TYPES.RESIZE_START, () => emit('dragStart'), { componentId: 'dock-layout' }));
@@ -300,8 +418,8 @@ const setupEventListeners = () => {
}, { componentId: 'dock-layout' }));
// 自定义事件
unsubscribeFunctions.push(eventBus.on('area-merged', onAreaMerged, { componentId: 'dock-layout' }));
unsubscribeFunctions.push(eventBus.on('dock-zone-active', (event) => onDockZoneActive(event.zoneId), { componentId: 'dock-layout' }));
unsubscribeFunctions.push(eventBus.on(EVENT_TYPES.AREA_MERGED, onAreaMerged, { componentId: 'dock-layout' }));
unsubscribeFunctions.push(eventBus.on(EVENT_TYPES.DOCK_ZONE_ACTIVE, (event) => onDockZoneActive(event.zoneId), { componentId: 'dock-layout' }));
return unsubscribeFunctions;
};
@@ -314,6 +432,11 @@ const cleanup = () => {
// 清理事件监听器和其他资源
console.log('🧹 开始清理DockLayout资源');
// 清理事件监听器
console.log('🔇 开始清理事件监听器');
unsubscribeFunctions.value.forEach(unsubscribe => unsubscribe());
unsubscribeFunctions.value = [];
// 清理浮动区域
floatingAreas.value = [];