From 153ce2c62bed20d3875bbadfc98bf0ad4aeeff46 Mon Sep 17 00:00:00 2001
From: 田源 <lastanimals@163.com>
Date: 星期三, 02 八月 2023 17:17:45 +0800
Subject: [PATCH] 主数据启动流程设置动态流程名称
---
Source/UBCS-WEB/src/components/flow-cycle/flowchartEditor.vue | 58 +++++++++++++++++++++++++++++++++++++---------------------
1 files changed, 37 insertions(+), 21 deletions(-)
diff --git a/Source/UBCS-WEB/src/components/flow-cycle/flowchartEditor.vue b/Source/UBCS-WEB/src/components/flow-cycle/flowchartEditor.vue
index 9b6c62e..4ffe6fe 100644
--- a/Source/UBCS-WEB/src/components/flow-cycle/flowchartEditor.vue
+++ b/Source/UBCS-WEB/src/components/flow-cycle/flowchartEditor.vue
@@ -1,3 +1,5 @@
+<!-- eslint-disable vue/valid-v-for -->
+<!-- eslint-disable vue/require-v-for-key -->
<template>
<vue-flowchart-editor class="vue-flowchart-editor" ref="flowChart">
<div class="vfe-chart">
@@ -12,16 +14,27 @@
</div>
<!-- Main Chart -->
<div class="vfe-chart-main">
- <flow :data="flowChartData" :onAfterChange="onAfterChange" />
+ <flow
+ :data="flowChartData"
+ :onAfterChange="onAfterChange"
+ :onAfterItemSelected="onAfterItemSelected"
+ />
<div class="tooltip">
<template v-for="item in tooltipData">
- <p :key="item.name">{{ item.name }}: {{ item.value }}</p>
+ <p>{{ item.name }}: {{ item.value }}</p>
</template>
</div>
</div>
<div class="vfe-chart-panel" v-if="type !== 'detail'">
<div class="vfe-chart-panel-detail">
- <editor-detail-panel :rowData="rowData" ref="EditorDetailPanel" />
+ <editor-detail-panel
+ :rowData="rowData"
+ ref="EditorDetailPanel"
+ :existNodes="existNodes"
+ :existEdges="existEdges"
+ :currentSelectedLine="currentSelectedLine"
+ :type="type"
+ />
</div>
</div>
</div>
@@ -81,6 +94,9 @@
},
tooltipShow: true,
tooltipData: [],
+ existNodes: this.chartData.nodes || [],
+ existEdges: this.chartData.edges || [],
+ currentSelectedLine: {}
};
},
@@ -93,25 +109,7 @@
},
methods: {
- // onAfterChange(e) {
- // const model = e.model
- // console.log(JSON.parse(JSON.stringify(e)));
- // if (!model.change) {
- // model.id = model.label
- // model.change = true
- // } else {
- // return
- // }
- // const { nodes } = this.$refs.flowChart.propsAPI.save()
- // if (Array.isArray(nodes) && nodes.length > 0) {
-
- // } else {
- // this.$refs.flowChart.propsAPI.add("node", model);
- // }
- // throw '绂佹鍘熺敓鏂板鏂规硶'
- // },
onAfterChange(e) {
- console.log(e);
try {
if (e.action === "add" && e.model.type === "node") {
if (!e.model.change) {
@@ -129,7 +127,21 @@
this.$message.error("涓嶈兘娣诲姞宸插瓨鍦ㄧ殑鑺傜偣锛�");
}
}
+ const { nodes, edges } = this.$refs.flowChart.propsAPI.save();
+ this.existNodes = nodes || [];
+ this.existEdges = edges || [];
},
+ onAfterItemSelected({item}) {
+ if (item.target) {
+ const currentEdge = this.existEdges.filter(itm => itm.id === item.id)[0] || {}
+ console.log(currentEdge, 'currentEdgecurrentEdge');
+ if (!Array.isArray(currentEdge.events)) {
+ currentEdge.events = []
+ }
+ this.currentSelectedLine = currentEdge
+ }
+ },
+
_downloadImage(data, filename = "flowchart.png") {
const a = document.createElement("a");
a.href = data;
@@ -148,6 +160,9 @@
getFlowData() {
return this.$refs.flowChart.propsAPI.save();
},
+ getEdgesEvents() {
+ return this.$refs.EditorDetailPanel.edgeEventList;
+ }
},
};
</script>
@@ -219,6 +234,7 @@
width: 300px;
background-color: #fafafa;
border-left: 1px solid #e6e9ed;
+ overflow-y: scroll;
.vfe-chart-panel-detail {
box-sizing: border-box;
--
Gitblit v1.9.3