From 75f58cde0e7baaa2cfb61d8a509ad61ff7f498fb Mon Sep 17 00:00:00 2001
From: hejianhao <15708179461@qq.com>
Date: 星期一, 19 五月 2025 22:22:39 +0800
Subject: [PATCH] 谱系图增加移动端触摸节点选中事件
---
culture/src/views/pedigree-chart/addProgenitor.vue | 20 +++++++++++---------
1 files changed, 11 insertions(+), 9 deletions(-)
diff --git a/culture/src/views/pedigree-chart/addProgenitor.vue b/culture/src/views/pedigree-chart/addProgenitor.vue
index 885a190..6b1f28f 100644
--- a/culture/src/views/pedigree-chart/addProgenitor.vue
+++ b/culture/src/views/pedigree-chart/addProgenitor.vue
@@ -644,35 +644,37 @@
// 监听窗口大小变化
window.addEventListener('resize', this.handleResize);
- // 节点点击事件
- this.graph.on('node:click', (evt) => {
+ const handleNodeClick = (evt) => {
+ evt.preventDefault(); // 阻止默认触摸行为
const node = evt.item;
const nodeModel = node.getModel();
-
// 如果节点已废弃，不允许任何操作
if (!nodeModel.isDiscarded) {
this.$message.warning('该节点已废弃，不能进行操作');
return;
}
-
// 更新选中节点
this.selectedNode = nodeModel;
-
// 更新节点选中状态
this.graphData.nodes.forEach(n => {
n.selected = n.id === nodeModel.id;
});
this.graph.changeData(this.graphData);
- });
+ };
+ this.graph.on('node:click', handleNodeClick);
+ this.graph.on('node:touchstart', handleNodeClick);
- // 画布点击事件，取消选中节点
- this.graph.on('canvas:click', () => {
+ // 画布点击事件，取消选中节点（添加触摸支持）
+ const handleCanvasClick = (evt) => {
+ evt.preventDefault();
this.selectedNode = null;
this.graphData.nodes.forEach(n => {
n.selected = false;
});
this.graph.changeData(this.graphData);
- });
+ };
+ this.graph.on('canvas:click', handleCanvasClick);
+ this.graph.on('canvas:touchstart', handleCanvasClick);
},
handleResize() {
if (this.graph) {
--
Gitblit v1.7.1