看不到指示器
This commit is contained in:
@@ -7,7 +7,7 @@
|
||||
:target-rect="targetAreaRect"
|
||||
:mouse-position="currentMousePosition"
|
||||
:hide-edge-indicators="hideEdgeIndicators"
|
||||
:target-area-id="targetAreaId" <!-- 新增: 传递最上层的目标Area ID -->
|
||||
:target-area-id="targetAreaId"
|
||||
@zone-active="onDockZoneActive"
|
||||
style="z-index: 9999;"
|
||||
></DockIndicator>
|
||||
@@ -98,8 +98,11 @@ const dockLayoutRef = ref(null)
|
||||
// 主区域引用
|
||||
const mainAreaRef = ref(null)
|
||||
|
||||
// 调试模式开关
|
||||
const debugMode = ref(false)
|
||||
// 调试模式开关 - 设置为true以查看详细日志
|
||||
const debugMode = ref(true)
|
||||
|
||||
// 组件卸载状态跟踪
|
||||
const isUnmounted = ref(false)
|
||||
|
||||
// 停靠指示器相关状态
|
||||
const showDockIndicator = ref(false)
|
||||
@@ -1101,6 +1104,9 @@ const findOrCreateMainAreaTabPage = () => {
|
||||
|
||||
// 处理上升事件(用户触发的原始事件)- 从GlobalEventManager.js迁移
|
||||
const handleRisingEvent = async (data, event) => {
|
||||
// 检查组件是否已卸载
|
||||
if (isUnmounted.value) return;
|
||||
|
||||
// 从事件对象中获取事件类型
|
||||
const eventType = event.type;
|
||||
|
||||
@@ -1289,6 +1295,9 @@ const handlePanelDragCancel = async (data) => {
|
||||
|
||||
// 区域拖拽开始处理
|
||||
const handleAreaDragStart = async (data) => {
|
||||
// 检查组件是否已卸载
|
||||
if (isUnmounted.value) return;
|
||||
|
||||
if (debugMode.value) {
|
||||
console.log('👋 处理区域拖拽开始:', data);
|
||||
}
|
||||
@@ -1297,6 +1306,9 @@ const handleAreaDragStart = async (data) => {
|
||||
targetAreaId.value = null;
|
||||
targetAreaRect.value = { left: 0, top: 0, width: 0, height: 0 };
|
||||
|
||||
// ✅ 修复:显示指示器
|
||||
showDockIndicator.value = true;
|
||||
|
||||
// 发送区域拖拽状态更新事件(下降事件)
|
||||
eventBus.emit('area.drag.state.update', {
|
||||
...data,
|
||||
@@ -1306,6 +1318,12 @@ const handleAreaDragStart = async (data) => {
|
||||
|
||||
// 防抖的区域检测函数,移到外部以便清理
|
||||
const debouncedDetectMouseArea = debounce((position, areaId) => {
|
||||
// 检查组件是否已卸载,避免更新已销毁的组件
|
||||
if (isUnmounted.value) {
|
||||
console.log('⚠️ 组件已卸载,跳过debouncedDetectMouseArea执行');
|
||||
return;
|
||||
}
|
||||
|
||||
const detectedAreaId = _getTopAreaAtPosition(position, areaId);
|
||||
|
||||
// 调试日志
|
||||
@@ -1325,6 +1343,9 @@ const debouncedDetectMouseArea = debounce((position, areaId) => {
|
||||
console.log('📐 更新指示器位置:', detectedAreaRect);
|
||||
}
|
||||
|
||||
// 检查组件是否已卸载(双重保险)
|
||||
if (isUnmounted.value) return;
|
||||
|
||||
// 更新指示器的目标Area和位置
|
||||
targetAreaId.value = detectedAreaId;
|
||||
targetAreaRect.value = detectedAreaRect;
|
||||
@@ -1334,6 +1355,9 @@ const debouncedDetectMouseArea = debounce((position, areaId) => {
|
||||
console.log('❌ 未检测到有效目标Area,隐藏指示器');
|
||||
}
|
||||
|
||||
// 检查组件是否已卸载(双重保险)
|
||||
if (isUnmounted.value) return;
|
||||
|
||||
// 清空指示器状态
|
||||
targetAreaId.value = null;
|
||||
targetAreaRect.value = { left: 0, top: 0, width: 0, height: 0 };
|
||||
@@ -1342,6 +1366,9 @@ const debouncedDetectMouseArea = debounce((position, areaId) => {
|
||||
|
||||
// 区域拖拽移动处理
|
||||
const handleAreaDragMove = async (data) => {
|
||||
// 检查组件是否已卸载
|
||||
if (isUnmounted.value) return;
|
||||
|
||||
if (debugMode.value) {
|
||||
console.log('✋ 处理区域拖拽移动:', data);
|
||||
}
|
||||
@@ -1353,6 +1380,9 @@ const handleAreaDragMove = async (data) => {
|
||||
// 新增:更新当前鼠标位置
|
||||
currentMousePosition.value = data.position;
|
||||
|
||||
// ✅ 修复:确保指示器可见
|
||||
showDockIndicator.value = true;
|
||||
|
||||
// 发送区域拖拽状态更新事件(下降事件)
|
||||
eventBus.emit('area.drag.state.update', {
|
||||
...data,
|
||||
@@ -1374,6 +1404,9 @@ const handleAreaDragMove = async (data) => {
|
||||
|
||||
// 区域拖拽结束处理
|
||||
const handleAreaDragEnd = async (data) => {
|
||||
// 检查组件是否已卸载
|
||||
if (isUnmounted.value) return;
|
||||
|
||||
if (debugMode.value) {
|
||||
console.log('✋ 处理区域拖拽结束:', data);
|
||||
}
|
||||
@@ -1396,6 +1429,9 @@ const handleAreaDragEnd = async (data) => {
|
||||
|
||||
// 区域拖拽取消处理
|
||||
const handleAreaDragCancel = async (data) => {
|
||||
// 检查组件是否已卸载
|
||||
if (isUnmounted.value) return;
|
||||
|
||||
if (debugMode.value) {
|
||||
console.log('✋ 处理区域拖拽取消:', data);
|
||||
}
|
||||
@@ -1418,6 +1454,9 @@ const handleAreaDragCancel = async (data) => {
|
||||
|
||||
// 面板resize处理
|
||||
const handlePanelResizeStart = async (data) => {
|
||||
// 检查组件是否已卸载
|
||||
if (isUnmounted.value) return;
|
||||
|
||||
if (debugMode.value) {
|
||||
console.log('✋ 处理面板resize开始:', data);
|
||||
}
|
||||
@@ -1647,11 +1686,16 @@ onMounted(() => {
|
||||
|
||||
// 组件卸载时清理资源
|
||||
onUnmounted(() => {
|
||||
// 标记组件为已卸载
|
||||
isUnmounted.value = true;
|
||||
|
||||
// 清理事件监听器和其他资源
|
||||
console.log('DockLayout component unmounted');
|
||||
cleanup();
|
||||
|
||||
// 清理防抖函数
|
||||
debouncedDetectMouseArea.cancel();
|
||||
|
||||
// 逐个移除事件监听器
|
||||
unsubscribeFunctions.value.forEach(unsubscribe => unsubscribe());
|
||||
unsubscribeFunctions.value = [];
|
||||
|
||||
Reference in New Issue
Block a user