From 24268d7d2b12d1e024c854de22afe2e18823faa5 Mon Sep 17 00:00:00 2001 From: huangjinysf Date: Sun, 4 Jan 2026 15:08:32 +0800 Subject: [PATCH] =?UTF-8?q?fix(RealTimeInventory):=20=E6=B7=BB=E5=8A=A0?= =?UTF-8?q?=E5=8D=95=E5=85=83=E6=A0=BC=E7=82=B9=E5=87=BB=E4=BA=8B=E4=BB=B6?= =?UTF-8?q?=E9=98=B2=E6=8A=96=E5=A4=84=E7=90=86?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit 防止快速双击时同时触发单击和双击事件，通过设置延时器和清除机制来区分单击和双击操作 --- src/views/plan/RealTimeInventory.vue | 242 +++++++++++++++------------ 1 file changed, 131 insertions(+), 111 deletions(-) diff --git a/src/views/plan/RealTimeInventory.vue b/src/views/plan/RealTimeInventory.vue index 654e77f..8272e87 100644 --- a/src/views/plan/RealTimeInventory.vue +++ b/src/views/plan/RealTimeInventory.vue @@ -195,6 +195,10 @@ const transitionProbabilitiesMap = ref(new Map()) // 存储转移概率数据 const transitionColorsMap = ref(new Map()) // 存储概率颜色映射 const activeCells = ref(new Set()) // 存储当前激活的单元格键值 +// 事件防抖相关 +let clickTimeoutId = null; // 单击事件延时器 +const DBL_CLICK_DELAY = 250; // 双击延时（毫秒） + // WMS对话框相关状态 const wmsDialogVisible = ref(false) const currentWmsModel = ref('') @@ -892,129 +896,145 @@ const getDifferenceClass = (difference) => { }; // 方法：处理单元格单击事件 - 获取转移概率数据 +// 处理单元格单击事件 - 获取转移概率数据（带防抖） const handleCellClick = async (row, column, cell, event) => { - const cellValue = row[column.property]; - - // 检查单元格是否有值 - if (!cellValue || cellValue === '-' || cellValue === null || cellValue === undefined) { - return; + // 清除之前的延时器 + if (clickTimeoutId) { + clearTimeout(clickTimeoutId); + clickTimeoutId = null; } - // 检查是否是规格列或总计列，这些列不需要获取转移概率 - if (column.property === 'specification' || column.property === 'total') { - return; - } - - // 从列属性中提取model和wire_disc - const columnKey = column.property; - const hasWireDisc = columnKey.includes('::'); - let model, wire_disc; - - if (hasWireDisc) { - [model, wire_disc] = columnKey.split('::'); - } else { - model = columnKey; - wire_disc = null; - } - - // 构建单元格键值 - const keyWithSpec = `${columnKey}::${row.specification}`; - - console.log('单击事件参数:', { - columnKey, - model, - wire_disc, - specification: row.specification, - keyWithSpec - }); - - // 检查该单元格是否已经激活 - if (activeCells.value.has(keyWithSpec)) { - // 如果已经激活，则取消激活状态 - activeCells.value.delete(keyWithSpec); - console.log(`单元格 ${keyWithSpec} 已取消激活，恢复原始颜色`); - ElMessage.info('已取消概率颜色显示'); - return; - } - - // 如果激活了其他单元格，先取消所有之前的激活状态（单选模式） - if (activeCells.value.size > 0) { - console.log('取消所有之前激活的单元格:', Array.from(activeCells.value)); - activeCells.value.clear(); - } - - // 获取对应的机台信息和轴数 - let equipmentCode = 'QB002'; // 默认值 - let axleNumber = '左边'; // 默认值 - - if (uidProductionStatusMap.value.has(keyWithSpec)) { - const status = uidProductionStatusMap.value.get(keyWithSpec); - equipmentCode = status.equipment_code || 'QB002'; - axleNumber = status.axle_number || '左边'; - } - - console.log('获取转移概率参数:', { - equipmentCode, - axleNumber, - model, - specification: row.specification, - wireDisc: formatWireDisc(wire_disc || '') - }); - - // 检查是否已经获取过该单元格的转移概率数据 - if (transitionProbabilitiesMap.value.has(keyWithSpec)) { - console.log('该单元格的转移概率数据已存在，直接激活显示'); - activeCells.value.add(keyWithSpec); - ElMessage.success('转移概率数据已显示'); - return; - } - - // 获取转移概率数据 - const transitionData = await fetchTransitionProbabilities( - equipmentCode, - axleNumber, - model, - row.specification, - formatWireDisc(wire_disc || '') - ); - - if (transitionData && transitionData.current_specification_transitions) { - // 存储转移概率数据 - const transitionsKey = `${columnKey}::${row.specification}`; - transitionProbabilitiesMap.value.set(transitionsKey, transitionData); + // 设置延时器，延迟执行单击逻辑 + clickTimeoutId = setTimeout(async () => { + const cellValue = row[column.property]; - // 计算概率颜色 - const probabilities = transitionData.current_specification_transitions; - const maxProbability = Math.max(...Object.values(probabilities).map(p => p.probability)); + // 检查单元格是否有值 + if (!cellValue || cellValue === '-' || cellValue === null || cellValue === undefined) { + return; + } - Object.entries(probabilities).forEach(([targetSpec, data]) => { - const colorKey = `${transitionsKey}::${targetSpec}`; - const intensity = data.probability / maxProbability; // 0-1之间的强度值 - - // 获取机台的基础颜色 - const keyWithSpec = `${columnKey}::${row.specification}`; - let baseColor = null; - - if (uidProductionStatusMap.value.has(keyWithSpec)) { - const status = uidProductionStatusMap.value.get(keyWithSpec); - baseColor = status.equipment_color; - } - - const color = getProbabilityColor(intensity, baseColor); - transitionColorsMap.value.set(colorKey, color); + // 检查是否是规格列或总计列，这些列不需要获取转移概率 + if (column.property === 'specification' || column.property === 'total') { + return; + } + + // 从列属性中提取model和wire_disc + const columnKey = column.property; + const hasWireDisc = columnKey.includes('::'); + let model, wire_disc; + + if (hasWireDisc) { + [model, wire_disc] = columnKey.split('::'); + } else { + model = columnKey; + wire_disc = null; + } + + // 构建单元格键值 + const keyWithSpec = `${columnKey}::${row.specification}`; + + console.log('单击事件参数:', { + columnKey, + model, + wire_disc, + specification: row.specification, + keyWithSpec }); - console.log('转移概率数据已存储:', transitionProbabilitiesMap.value); - console.log('概率颜色映射:', transitionColorsMap.value); + // 检查该单元格是否已经激活 + if (activeCells.value.has(keyWithSpec)) { + // 如果已经激活，则取消激活状态 + activeCells.value.delete(keyWithSpec); + console.log(`单元格 ${keyWithSpec} 已取消激活，恢复原始颜色`); + ElMessage.info('已取消概率颜色显示'); + return; + } - // 激活该单元格 - activeCells.value.add(keyWithSpec); - ElMessage.success('转移概率数据已加载并显示'); - } + // 如果激活了其他单元格，先取消所有之前的激活状态（单选模式） + if (activeCells.value.size > 0) { + console.log('取消所有之前激活的单元格:', Array.from(activeCells.value)); + activeCells.value.clear(); + } + + // 获取对应的机台信息和轴数 + let equipmentCode = 'QB002'; // 默认值 + let axleNumber = '左边'; // 默认值 + + if (uidProductionStatusMap.value.has(keyWithSpec)) { + const status = uidProductionStatusMap.value.get(keyWithSpec); + equipmentCode = status.equipment_code || 'QB002'; + axleNumber = status.axle_number || '左边'; + } + + console.log('获取转移概率参数:', { + equipmentCode, + axleNumber, + model, + specification: row.specification, + wireDisc: formatWireDisc(wire_disc || '') + }); + + // 检查是否已经获取过该单元格的转移概率数据 + if (transitionProbabilitiesMap.value.has(keyWithSpec)) { + console.log('该单元格的转移概率数据已存在，直接激活显示'); + activeCells.value.add(keyWithSpec); + ElMessage.success('转移概率数据已显示'); + return; + } + + // 获取转移概率数据 + const transitionData = await fetchTransitionProbabilities( + equipmentCode, + axleNumber, + model, + row.specification, + formatWireDisc(wire_disc || '') + ); + + if (transitionData && transitionData.current_specification_transitions) { + // 存储转移概率数据 + const transitionsKey = `${columnKey}::${row.specification}`; + transitionProbabilitiesMap.value.set(transitionsKey, transitionData); + + // 计算概率颜色 + const probabilities = transitionData.current_specification_transitions; + const maxProbability = Math.max(...Object.values(probabilities).map(p => p.probability)); + + Object.entries(probabilities).forEach(([targetSpec, data]) => { + const colorKey = `${transitionsKey}::${targetSpec}`; + const intensity = data.probability / maxProbability; // 0-1之间的强度值 + + // 获取机台的基础颜色 + const keyWithSpec = `${columnKey}::${row.specification}`; + let baseColor = null; + + if (uidProductionStatusMap.value.has(keyWithSpec)) { + const status = uidProductionStatusMap.value.get(keyWithSpec); + baseColor = status.equipment_color; + } + + const color = getProbabilityColor(intensity, baseColor); + transitionColorsMap.value.set(colorKey, color); + }); + + console.log('转移概率数据已存储:', transitionProbabilitiesMap.value); + console.log('概率颜色映射:', transitionColorsMap.value); + + // 激活该单元格 + activeCells.value.add(keyWithSpec); + ElMessage.success('转移概率数据已加载并显示'); + } + }, DBL_CLICK_DELAY); }; // 方法：处理单元格双击事件 - 显示WMS详情 const handleCellDblClick = (row, column, cell, event) => { + // 清除单击事件的延时器，防止双击时触发单击逻辑 + if (clickTimeoutId) { + clearTimeout(clickTimeoutId); + clickTimeoutId = null; + console.log('双击事件已清除单击延时器'); + } const cellValue = row[column.property]; // 检查单元格是否有值