Showing
6 changed files
with
20 additions
and
4 deletions
| 1 | /* | 1 | /* |
| 2 | * @Date: 2023-10-27 09:29:48 | 2 | * @Date: 2023-10-27 09:29:48 |
| 3 | * @LastEditors: hookehuyr hookehuyr@gmail.com | 3 | * @LastEditors: hookehuyr hookehuyr@gmail.com |
| 4 | - * @LastEditTime: 2023-11-23 17:55:22 | 4 | + * @LastEditTime: 2023-12-01 16:47:11 |
| 5 | * @FilePath: /vue-flow-editor/doc/data.js | 5 | * @FilePath: /vue-flow-editor/doc/data.js |
| 6 | * @Description: 初始化结构,数据都是固定的 | 6 | * @Description: 初始化结构,数据都是固定的 |
| 7 | */ | 7 | */ | ... | ... |
| ... | @@ -131,11 +131,16 @@ export function dragEdge(G6, option: OptionType) { | ... | @@ -131,11 +131,16 @@ export function dragEdge(G6, option: OptionType) { |
| 131 | if (this.origin.targetNode) { | 131 | if (this.origin.targetNode) { |
| 132 | const addModel = { | 132 | const addModel = { |
| 133 | class: 'flow', | 133 | class: 'flow', |
| 134 | + shape: "flow-polyline-round1", | ||
| 134 | source: this.origin.sourceNode.get('id'), | 135 | source: this.origin.sourceNode.get('id'), |
| 135 | target: this.origin.targetNode.get('id'), | 136 | target: this.origin.targetNode.get('id'), |
| 136 | sourceAnchor: this.origin.sourceAnchor, | 137 | sourceAnchor: this.origin.sourceAnchor, |
| 137 | targetAnchor: this.origin.targetAnchor, | 138 | targetAnchor: this.origin.targetAnchor, |
| 138 | } | 139 | } |
| 140 | + // TAG: 修改连接线颜色 开始出去的线和连接到抄送节点的颜色是灰色 | ||
| 141 | + if (this.origin.sourceNode.get('id') === 'start-node' || this.origin.targetNode.get('model').control ==='cc') { | ||
| 142 | + addModel.shape = 'flow-polyline-round' | ||
| 143 | + } | ||
| 139 | if (this.graph.executeCommand) { | 144 | if (this.graph.executeCommand) { |
| 140 | this.graph.executeCommand('add', { | 145 | this.graph.executeCommand('add', { |
| 141 | type: 'edge', | 146 | type: 'edge', | ... | ... |
| ... | @@ -327,4 +327,4 @@ export function registerEdge(G6) { | ... | @@ -327,4 +327,4 @@ export function registerEdge(G6) { |
| 327 | return polylinePoints; | 327 | return polylinePoints; |
| 328 | }, | 328 | }, |
| 329 | }, 'polyline'); | 329 | }, 'polyline'); |
| 330 | -} | ||
| ... | \ No newline at end of file | ... | \ No newline at end of file |
| 330 | +} | ... | ... |
src/shape/edge1.ts
0 → 100644
This diff is collapsed. Click to expand it.
| 1 | /* | 1 | /* |
| 2 | * @Date: 2023-10-27 09:29:59 | 2 | * @Date: 2023-10-27 09:29:59 |
| 3 | * @LastEditors: hookehuyr hookehuyr@gmail.com | 3 | * @LastEditors: hookehuyr hookehuyr@gmail.com |
| 4 | - * @LastEditTime: 2023-11-14 11:17:20 | 4 | + * @LastEditTime: 2023-12-01 17:11:30 |
| 5 | * @FilePath: /vue-flow-editor/src/shape/index.ts | 5 | * @FilePath: /vue-flow-editor/src/shape/index.ts |
| 6 | * @Description: 文件描述 | 6 | * @Description: 文件描述 |
| 7 | */ | 7 | */ |
| 8 | import {registerAnchor} from "@/shape/anchor"; | 8 | import {registerAnchor} from "@/shape/anchor"; |
| 9 | import {registerEdge} from "@/shape/edge"; | 9 | import {registerEdge} from "@/shape/edge"; |
| 10 | +import {registerEdge1} from "@/shape/edge1"; // TAG:新增一条彩色的连接线 | ||
| 10 | // TAG: 自定义节点 - 引入节点 | 11 | // TAG: 自定义节点 - 引入节点 |
| 11 | import {registerActivity} from "@/shape/activity"; | 12 | import {registerActivity} from "@/shape/activity"; |
| 12 | import {registerControl} from "@/shape/control"; | 13 | import {registerControl} from "@/shape/control"; |
| ... | @@ -14,6 +15,7 @@ import {registerControl} from "@/shape/control"; | ... | @@ -14,6 +15,7 @@ import {registerControl} from "@/shape/control"; |
| 14 | export function registerShape(G6) { | 15 | export function registerShape(G6) { |
| 15 | registerAnchor(G6) | 16 | registerAnchor(G6) |
| 16 | registerEdge(G6) | 17 | registerEdge(G6) |
| 18 | + registerEdge1(G6) | ||
| 17 | registerActivity(G6) | 19 | registerActivity(G6) |
| 18 | registerControl(G6) | 20 | registerControl(G6) |
| 19 | } | 21 | } | ... | ... |
| ... | @@ -83,6 +83,15 @@ export const GraphStyle = { | ... | @@ -83,6 +83,15 @@ export const GraphStyle = { |
| 83 | cursor: 'pointer', | 83 | cursor: 'pointer', |
| 84 | }, | 84 | }, |
| 85 | }, | 85 | }, |
| 86 | + defaultEdge1: { // TAG:新增彩色连接线 | ||
| 87 | + shape: 'flow-polyline-round1', | ||
| 88 | + style: { | ||
| 89 | + stroke: '#CB7FE3', | ||
| 90 | + lineWidth: 1, | ||
| 91 | + lineAppendWidth: 10, | ||
| 92 | + cursor: 'pointer', | ||
| 93 | + }, | ||
| 94 | + }, | ||
| 86 | defaultNode: { | 95 | defaultNode: { |
| 87 | shape: 'rect', | 96 | shape: 'rect', |
| 88 | size: [120, 40], | 97 | size: [120, 40], |
| ... | @@ -133,4 +142,4 @@ export const GraphStyle = { | ... | @@ -133,4 +142,4 @@ export const GraphStyle = { |
| 133 | anchorPointHoverStyle: {radius: 4, fill: BASE_COLOR, fillOpacity: 1, stroke: BASE_COLOR_DEEP}, | 142 | anchorPointHoverStyle: {radius: 4, fill: BASE_COLOR, fillOpacity: 1, stroke: BASE_COLOR_DEEP}, |
| 134 | 143 | ||
| 135 | edgeDelegationStyle: {stroke: BASE_COLOR, lineDash: [4, 4], lineWidth: 1}, | 144 | edgeDelegationStyle: {stroke: BASE_COLOR, lineDash: [4, 4], lineWidth: 1}, |
| 136 | -} | ||
| ... | \ No newline at end of file | ... | \ No newline at end of file |
| 145 | +} | ... | ... |
-
Please register or login to post a comment