test: flow 测试

src/views/approve/pendingApproval/index_flowTest.vue

@@ -0,0 +1,74 @@
+<template>
+	<div class="test">
+		...
+		<div id="draw-container"></div>
+	</div>
+</template>
+
+<script setup lang="tsx">
+import ApprovalIndex from '../components/approvalIndex.vue'
+import { ref, onMounted } from 'vue'
+/**
+ * pendingApproval 待审批
+ * myApplication 我的申请
+ * myReceived 我收到的
+ * pendingClaim 认领任务
+ * approved 已审批
+ */
+const taskType = ref('pendingApproval')
+import LogicFlow from '@logicflow/core'
+import '@logicflow/core/dist/style/index.css'
+const lf = ref(null)
+onMounted(() => {
+	const graphData = {
+		nodes: [
+			{
+				id: 'node_id_1',
+				type: 'rect',
+				x: 100,
+				y: 100,
+				text: { x: 100, y: 100, value: '节点1' },
+				properties: {}
+			},
+			{
+				id: 'node_id_2',
+				type: 'circle',
+				x: 200,
+				y: 300,
+				text: { x: 300, y: 300, value: '节点2' },
+				properties: {}
+			}
+		],
+		edges: [
+			{
+				id: 'edge_id',
+				type: 'polyline',
+				sourceNodeId: 'node_id_1',
+				targetNodeId: 'node_id_2',
+				text: { x: 139, y: 200, value: '连线' },
+				startPoint: { x: 100, y: 140 },
+				endPoint: { x: 200, y: 250 },
+				pointsList: [
+					{ x: 100, y: 140 },
+					{ x: 100, y: 200 },
+					{ x: 200, y: 200 },
+					{ x: 200, y: 250 }
+				],
+				properties: {}
+			}
+		]
+	}
+	lf.value = new LogicFlow({
+		container: document.querySelector('#draw-container')
+	})
+	lf.value.render(graphData)
+})
+</script>
+<style lang="scss" scoped>
+.test {
+}
+#draw-container {
+	width: 1000px;
+	height: 500px;
+}
+</style>