github/skywalking-booster-ui
2
0
Fork 1
mirror of https://github.com/apache/skywalking-booster-ui.git synced 2025-05-02 16:54:52 +00:00
Code Issues Packages Projects Releases Wiki Activity

fix: operation pop-up window (#242)

Browse Source
This commit is contained in:
Fine0830 2023-02-28 16:26:33 +08:00 committed by GitHub
parent 1be572a95f
commit 4e64b9a4b1
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 8 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
src/views/dashboard/related/topology/components/Graph.vue
View File

@ -162,7 +162,7 @@ limitations under the License. -->
anchor.value = graph.value.append("g").selectAll(".topo-line-anchor"); anchor.value = graph.value.append("g").selectAll(".topo-line-anchor");
arrow.value = graph.value.append("g").selectAll(".topo-line-arrow"); arrow.value = graph.value.append("g").selectAll(".topo-line-arrow");
svg.value.call(zoom(d3, graph.value, [-100, -100])); svg.value.call(zoom(d3, graph.value, [-100, -100]));
svg.value.on("click", (event: any) => { svg.value.on("click", (event: PointerEvent) => {
event.stopPropagation(); event.stopPropagation();
event.preventDefault(); event.preventDefault();
topologyStore.setNode(null); topologyStore.setNode(null);
@ -218,11 +218,11 @@ limitations under the License. -->
simulation.value.alphaTarget(0); 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.setNode(d);
topologyStore.setLink(null); topologyStore.setLink(null);
operationsPos.x = d.x - 100; operationsPos.x = event.offsetX;
operationsPos.y = d.y - 70; operationsPos.y = event.offsetY;
if (d.layer === String(dashboardStore.layerId)) { if (d.layer === String(dashboardStore.layerId)) {
return; return;
} }
@ -231,7 +231,7 @@ limitations under the License. -->
{ id: "alarm", title: "Alarm", func: handleGoAlarm }, { 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) { if (d.source.layer !== dashboardStore.layerId || d.target.layer !== dashboardStore.layerId) {
return; return;
} }

6
src/views/dashboard/related/topology/components/utils/nodeElement.ts
View File

@ -22,16 +22,16 @@ export default (d3: any, graph: any, funcs: any, tip: any, legend?: any) => {
const nodeEnter = graph const nodeEnter = graph
.append("g") .append("g")
.call(d3.drag().on("start", funcs.dragstart).on("drag", funcs.dragged).on("end", funcs.dragended)) .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); tip.html(funcs.tipHtml).show(d, this);
}) })
.on("mouseout", function () { .on("mouseout", function () {
tip.hide(this); tip.hide(this);
}) })
.on("click", (event: any, d: Node | any) => { .on("click", (event: PointerEvent, d: Node | any) => {
event.stopPropagation(); event.stopPropagation();
event.preventDefault(); event.preventDefault();
funcs.handleNodeClick(d); funcs.handleNodeClick(event, d);
}); });
nodeEnter nodeEnter
.append("image") .append("image")