mirror of
https://github.com/pure-admin/vue-pure-admin.git
synced 2026-01-26 17:02:00 +08:00
fix: Improve the flowChart component
This commit is contained in:
@@ -1,60 +0,0 @@
|
||||
<template>
|
||||
<div id="container"></div>
|
||||
</template>
|
||||
|
||||
<script lang='ts'>
|
||||
import LogicFlow from "@logicflow/core";
|
||||
import "@logicflow/core/dist/style/index.css";
|
||||
import { onMounted } from "vue";
|
||||
|
||||
const data = {
|
||||
// 节点
|
||||
nodes: [
|
||||
{
|
||||
id: 50,
|
||||
type: "rect",
|
||||
x: 100,
|
||||
y: 150,
|
||||
text: "你好",
|
||||
},
|
||||
{
|
||||
id: 21,
|
||||
type: "circle",
|
||||
x: 300,
|
||||
y: 150,
|
||||
},
|
||||
],
|
||||
// 边
|
||||
edges: [
|
||||
{
|
||||
type: "polyline",
|
||||
sourceNodeId: 50,
|
||||
targetNodeId: 21,
|
||||
},
|
||||
],
|
||||
};
|
||||
export default {
|
||||
setup() {
|
||||
onMounted(() => {
|
||||
const lf = new LogicFlow({
|
||||
container: document.querySelector("#container"),
|
||||
stopScrollGraph: true,
|
||||
stopZoomGraph: true,
|
||||
width: 500,
|
||||
height: 500,
|
||||
grid: {
|
||||
type: "dot",
|
||||
size: 20,
|
||||
},
|
||||
});
|
||||
|
||||
lf.render(data);
|
||||
});
|
||||
|
||||
return {};
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
</style>
|
||||
Reference in New Issue
Block a user