From 4b013affeb7afe534bf70204c743c5764db45484 Mon Sep 17 00:00:00 2001
From: king <18310653075@163.com>
Date: 星期四, 03 八月 2023 09:39:54 +0800
Subject: [PATCH] 2023-08-03
---
src/tabviews/custom/components/chart/antv-X6/index.jsx | 168 +++++++++++++++++++++++++++++++++++++++++++++++--------
1 files changed, 142 insertions(+), 26 deletions(-)
diff --git a/src/tabviews/custom/components/chart/antv-X6/index.jsx b/src/tabviews/custom/components/chart/antv-X6/index.jsx
index 71aed16..dad76ed 100644
--- a/src/tabviews/custom/components/chart/antv-X6/index.jsx
+++ b/src/tabviews/custom/components/chart/antv-X6/index.jsx
@@ -1,7 +1,7 @@
import React, {Component} from 'react'
import PropTypes from 'prop-types'
import { is, fromJS } from 'immutable'
-import { Spin, Tooltip, message, Modal, notification } from 'antd'
+import { Spin, Tooltip, message, Modal, notification, Switch } from 'antd'
import { UndoOutlined, RedoOutlined, VerticalAlignTopOutlined, VerticalAlignBottomOutlined, SaveOutlined, ZoomInOutlined, ZoomOutOutlined, OneToOneOutlined, QuestionCircleOutlined, ClearOutlined } from '@ant-design/icons'
import { Graph, Shape } from '@antv/x6'
import { Stencil } from '@antv/x6-plugin-stencil'
@@ -385,6 +385,7 @@
editing: false,
node: null,
loading: false,
+ status: 0,
rolelist: []
}
@@ -518,6 +519,7 @@
this.handleData()
this.setState({
+ status: item.status || 0,
loading: false
})
@@ -795,7 +797,8 @@
groups: [
{
title: '閫氱敤鑺傜偣',
- name: 'group1'
+ name: 'group1',
+ graphHeight: 240
},
{
title: '鑷畾涔�',
@@ -895,52 +898,105 @@
const r1 = graph.createNode({
shape: 'mk-rect',
- label: '寮�濮�',
+ mknode: 'start',
attrs: {
body: {
rx: 20,
- ry: 26
+ ry: 26,
+ fill: '#52c41a',
+ stroke: '#52c41a'
+ },
+ text: {
+ fill: '#ffffff',
+ text: '寮�濮�'
}
}
})
const r2 = graph.createNode({
shape: 'mk-rect',
- label: '杩囩▼'
+ attrs: {
+ body: {
+ rx: 20,
+ ry: 26,
+ fill: '#e6f4ff',
+ stroke: '#1890ff'
+ },
+ text: {
+ text: '杩囩▼'
+ }
+ }
})
const r3 = graph.createNode({
shape: 'mk-rect',
attrs: {
body: {
rx: 6,
- ry: 6
+ ry: 6,
+ fill: '#fff7e6',
+ stroke: '#fa8c16'
+ },
+ text: {
+ text: '鍙�夎繃绋�'
}
- },
- label: '鍙�夎繃绋�'
+ }
})
const r4 = graph.createNode({
shape: 'mk-polygon',
attrs: {
body: {
- refPoints: '0,10 10,0 20,10 10,20'
+ refPoints: '0,10 10,0 20,10 10,20',
+ fill: '#f9f0ff',
+ stroke: '#722ed1'
+ },
+ text: {
+ text: '鍐崇瓥'
}
- },
- label: '鍐崇瓥'
+ }
})
const r5 = graph.createNode({
shape: 'mk-paral',
attrs: {
body: {
- refPoints: '10,0 40,0 30,20 0,20'
+ refPoints: '10,0 40,0 30,20 0,20',
+ fill: '#e6fffb',
+ stroke: '#13c2c2'
+ },
+ text: {
+ text: '鏁版嵁'
}
- },
- label: '鏁版嵁'
+ }
})
const r6 = graph.createNode({
shape: 'mk-circle',
- label: '杩炴帴'
+ attrs: {
+ body: {
+ fill: '#e6f4ff',
+ stroke: '#1890ff'
+ },
+ text: {
+ text: '杩炴帴'
+ }
+ }
+ })
+
+ const r7 = graph.createNode({
+ shape: 'mk-rect',
+ mknode: 'end',
+ attrs: {
+ body: {
+ rx: 20,
+ ry: 26,
+ fill: '#fa8c16',
+ stroke: '#fa8c16'
+ },
+ text: {
+ fill: '#ffffff',
+ text: '缁撴潫'
+ }
+ }
})
- stencil.load([r1, r2, r3, r4, r5, r6], 'group1')
+ stencil.load([r1, r2, r3, r4, r5, r6, r7], 'group1')
const p1 = graph.createNode({
shape: 'mk-ellipse',
@@ -1351,7 +1407,7 @@
}
save = () => {
- const { BID } = this.state
+ const { BID, plot, status } = this.state
if (!BID) {
Modal.error({
@@ -1360,16 +1416,28 @@
return
}
+ let nodes = this.mkGraph.toJSON()
+ let _status = status
+
+ if (plot.subtype === 'xflow' && status === 10) {
+ let start_num = nodes.cells.filter(cell => cell.mknode === 'start').length
+ let end_num = nodes.cells.filter(cell => cell.mknode === 'end').length
+
+ if (start_num !== 1 || end_num !== 1) {
+ _status = 0
+ }
+ }
+
this.setState({
loading: true
})
- let nodes = this.mkGraph.toJSON()
this.mkGraph.toPNG((dataUri) => {
let param = {
func: 's_works_flow_param_upt_v6',
long_param: window.btoa(window.encodeURIComponent(JSON.stringify(nodes))),
flow_image: dataUri,
+ status: status,
ID: BID,
BID: ''
}
@@ -1381,17 +1449,20 @@
message: '淇濆瓨鎴愬姛锛�',
duration: 2
})
+ this.setState({
+ loading: false,
+ status: _status
+ })
} else {
notification.error({
top: 92,
message: res.message,
duration: 10
})
+ this.setState({
+ loading: false
+ })
}
-
- this.setState({
- loading: false
- })
})
}, {padding: 20})
}
@@ -1638,8 +1709,8 @@
this.selectNode.attr('text/fontSize', value)
} else if (key === 'fontFill') {
this.selectNode.attr('text/fill', value)
- } else if (key === 'mksign') {
- this.selectNode.prop('mksign', value)
+ } else if (key === 'mkdata') {
+ this.selectNode.prop('mkdata', value)
}
}
}
@@ -1721,6 +1792,48 @@
}
}
+ changeStatus = () => {
+ const { plot, status } = this.state
+
+ let _status = status === 10 ? 0 : 10
+ let nodes = this.mkGraph.toJSON()
+
+ if (plot.subtype === 'xflow' && _status === 10) {
+ let start_num = nodes.cells.filter(cell => cell.mknode === 'start').length
+ let end_num = nodes.cells.filter(cell => cell.mknode === 'end').length
+
+ if (start_num === 0) {
+ notification.warning({
+ top: 92,
+ message: '璇锋坊鍔犲紑濮嬭妭鐐癸紒',
+ duration: 2
+ })
+ } else if (start_num > 1) {
+ notification.warning({
+ top: 92,
+ message: '寮�濮嬭妭鐐逛笉鍙坊鍔犲涓紒',
+ duration: 2
+ })
+ } else if (end_num === 0) {
+ notification.warning({
+ top: 92,
+ message: '璇锋坊鍔犵粨鏉熻妭鐐癸紒',
+ duration: 2
+ })
+ } else if (end_num > 1) {
+ notification.warning({
+ top: 92,
+ message: '缁撴潫鑺傜偣涓嶅彲娣诲姞澶氫釜锛�',
+ duration: 2
+ })
+ } else {
+ this.setState({status: _status})
+ }
+ } else {
+ this.setState({status: _status})
+ }
+ }
+
resetlane = (id, x, offset) => {
let nodes = this.mkGraph.getNodes()
@@ -1736,7 +1849,7 @@
}
render() {
- const { loading, config, node, rolelist } = this.state
+ const { loading, config, node, rolelist, status } = this.state
let style = {...config.style}
@@ -1803,8 +1916,11 @@
</Tooltip>
</div>
<div className="right-tool">
+ <Tooltip title="鍚敤/鍋滅敤">
+ <Switch size="small" style={{marginRight: '10px'}} checked={status === 10} onChange={this.changeStatus} />
+ </Tooltip>
<Tooltip title="淇濆瓨">
- <SaveOutlined onClick={this.save}/>
+ <SaveOutlined style={{marginRight: '10px'}} onClick={this.save}/>
</Tooltip>
</div>
</div>
--
Gitblit v1.8.0