fix: operation pop-up window (#242)
diff --git a/src/views/dashboard/related/topology/components/Graph.vue b/src/views/dashboard/related/topology/components/Graph.vue
index 2932026..6137a51 100644
--- a/src/views/dashboard/related/topology/components/Graph.vue
+++ b/src/views/dashboard/related/topology/components/Graph.vue
@@ -162,7 +162,7 @@
anchor.value = graph.value.append("g").selectAll(".topo-line-anchor");
arrow.value = graph.value.append("g").selectAll(".topo-line-arrow");
svg.value.call(zoom(d3, graph.value, [-100, -100]));
- svg.value.on("click", (event: any) => {
+ svg.value.on("click", (event: PointerEvent) => {
event.stopPropagation();
event.preventDefault();
topologyStore.setNode(null);
@@ -218,11 +218,11 @@
simulation.value.alphaTarget(0);
}
}
- function handleNodeClick(d: Node & { x: number; y: number }) {
+ function handleNodeClick(event: PointerEvent, d: Node & { x: number; y: number }) {
topologyStore.setNode(d);
topologyStore.setLink(null);
- operationsPos.x = d.x - 100;
- operationsPos.y = d.y - 70;
+ operationsPos.x = event.offsetX;
+ operationsPos.y = event.offsetY;
if (d.layer === String(dashboardStore.layerId)) {
return;
}
@@ -231,7 +231,7 @@
{ id: "alarm", title: "Alarm", func: handleGoAlarm },
];
}
- function handleLinkClick(event: any, d: Call) {
+ function handleLinkClick(event: PointerEvent, d: Call) {
if (d.source.layer !== dashboardStore.layerId || d.target.layer !== dashboardStore.layerId) {
return;
}
diff --git a/src/views/dashboard/related/topology/components/utils/nodeElement.ts b/src/views/dashboard/related/topology/components/utils/nodeElement.ts
index e75d585..6aefc1e 100644
--- a/src/views/dashboard/related/topology/components/utils/nodeElement.ts
+++ b/src/views/dashboard/related/topology/components/utils/nodeElement.ts
@@ -22,16 +22,16 @@
const nodeEnter = graph
.append("g")
.call(d3.drag().on("start", funcs.dragstart).on("drag", funcs.dragged).on("end", funcs.dragended))
- .on("mouseover", function (event: any, d: Node) {
+ .on("mouseover", function (event: PointerEvent, d: Node) {
tip.html(funcs.tipHtml).show(d, this);
})
.on("mouseout", function () {
tip.hide(this);
})
- .on("click", (event: any, d: Node | any) => {
+ .on("click", (event: PointerEvent, d: Node | any) => {
event.stopPropagation();
event.preventDefault();
- funcs.handleNodeClick(d);
+ funcs.handleNodeClick(event, d);
});
nodeEnter
.append("image")
