From aac1d5cb50be5071b9c241a9cc0ebbfaae90a21e Mon Sep 17 00:00:00 2001 From: king <18310653075@163.com> Date: 星期四, 29 六月 2023 01:05:49 +0800 Subject: [PATCH] 2023-06-29 --- src/tabviews/custom/components/chart/antv-X6/index.jsx | 83 ++++++++++++++++++++++++++++++----------- 1 files changed, 61 insertions(+), 22 deletions(-) diff --git a/src/tabviews/custom/components/chart/antv-X6/index.jsx b/src/tabviews/custom/components/chart/antv-X6/index.jsx index 784e4a6..66b6b4c 100644 --- a/src/tabviews/custom/components/chart/antv-X6/index.jsx +++ b/src/tabviews/custom/components/chart/antv-X6/index.jsx @@ -2,7 +2,7 @@ import PropTypes from 'prop-types' import { is, fromJS } from 'immutable' import { Spin, Tooltip, message, Modal, notification } from 'antd' -import { UndoOutlined, RedoOutlined, VerticalAlignTopOutlined, VerticalAlignBottomOutlined, SaveOutlined, ZoomInOutlined, ZoomOutOutlined, OneToOneOutlined } from '@ant-design/icons' +import { UndoOutlined, RedoOutlined, VerticalAlignTopOutlined, VerticalAlignBottomOutlined, SaveOutlined, ZoomInOutlined, ZoomOutOutlined, OneToOneOutlined, QuestionCircleOutlined } from '@ant-design/icons' import { Graph, Shape } from '@antv/x6' import { Stencil } from '@antv/x6-plugin-stencil' import { Transform } from '@antv/x6-plugin-transform' @@ -316,20 +316,35 @@ Graph.registerNode( 'mk-text', { - inherit: 'rect', + inherit: 'text-block', width: 66, height: 36, + text: '鏂囨湰鍩�', attrs: { body: { - strokeWidth: 0, - fill: 'transparent' - }, - text: { - fontSize: 12, - fill: '#262626' + fill: '#ffffff', + stroke: '#000000', + strokeWidth: 1, + rx: 0, + ry: 0 } } }, + // { + // inherit: 'rect', + // width: 66, + // height: 36, + // attrs: { + // body: { + // strokeWidth: 0, + // fill: 'transparent' + // }, + // text: { + // fontSize: 12, + // fill: '#262626' + // } + // } + // }, true ) @@ -342,7 +357,8 @@ config: null, editing: false, node: null, - loading: false + loading: false, + rolelist: [] } selectNode = null @@ -378,6 +394,10 @@ plot: _config.plot }, () => { this.loadData() + + if (_config.plot.function === 'edit') { + this.getrolelist() + } }) } @@ -419,6 +439,21 @@ this.loadData() }) } + } + + getrolelist = () => { + Api.getSystemConfig({func: 's_get_rolelist', OrderCol: 'RoleID desc', PageIndex: 1, PageSize: 1000}).then(res => { + if (!res.status) { + notification.error({ + top: 92, + message: res.message, + duration: 10 + }) + return + } + + this.setState({rolelist: res.data || []}) + }) } async loadData () { @@ -777,7 +812,6 @@ } }) - // #region 浣跨敤鎻掍欢 graph .use(new Transform({ resizing: true, @@ -790,7 +824,6 @@ .use(new History()) .use(new Export()) - // #region 鍒濆鍖� stencil const stencil = new Stencil({ title: '娴佺▼鍥�', target: graph, @@ -819,7 +852,6 @@ document.getElementById(config.uuid + 'stencil').appendChild(stencil.container) - // #region 蹇嵎閿笌浜嬩欢 graph.bindKey(['meta+c', 'ctrl+c'], () => { const cells = graph.getSelectedCells() if (cells.length) { @@ -841,7 +873,6 @@ return false }) - // undo redo graph.bindKey(['meta+z', 'ctrl+z'], () => { if (graph.canUndo()) { graph.undo() @@ -855,7 +886,6 @@ return false }) - // 鍒犻櫎鍏冪礌 graph.bindKey(['backspace', 'delete'], () => { const cells = graph.getSelectedCells() if (cells.length) { @@ -1072,7 +1102,6 @@ .use(new History()) .use(new Export()) - // #region 鍒濆鍖� stencil const stencil = new Stencil({ title: '娴佺▼鍥�', target: graph, @@ -1109,7 +1138,6 @@ document.getElementById(config.uuid + 'stencil').appendChild(stencil.container) - // #region 蹇嵎閿笌浜嬩欢 graph.bindKey(['meta+c', 'ctrl+c'], () => { const cells = graph.getSelectedCells() if (cells.length) { @@ -1144,7 +1172,6 @@ return false }) - // 鍒犻櫎鍏冪礌 graph.bindKey(['backspace', 'delete'], () => { const cells = graph.getSelectedCells() if (cells.length) { @@ -1154,7 +1181,6 @@ } }) - // 鎺у埗杩炴帴妗╂樉绀�/闅愯棌 const showPorts = (ports, show) => { for (let i = 0, len = ports.length; i < len; i += 1) { ports[i].style.visibility = show ? 'visible' : 'hidden' @@ -1309,11 +1335,9 @@ return } - // let cells = this.mkGraph.getCells() this.selectNode.toBack() } - // zoom() 鍙幏鍙栨垨鑰呰缃缉鏀炬瘮渚� setback = () => { if (this.mkGraph.canUndo()) { this.mkGraph.undo() @@ -1511,6 +1535,18 @@ this.mkGraph.stopBatch('width-change') } + } else if (node.shape === 'mk-text') { + if (key === 'title') { + this.selectNode.attr('label/text', value) + } else if (key === 'fill') { + this.selectNode.attr('body/fill', value) + } else if (key === 'stroke') { + this.selectNode.attr('body/stroke', value) + } else if (key === 'fontSize') { + this.selectNode.attr('label/style/fontSize', value) + } else if (key === 'fontFill') { + this.selectNode.attr('label/style/color', value) + } } else { if (key === 'title') { this.selectNode.attr('text/text', value) @@ -1543,7 +1579,7 @@ } render() { - const { loading, config, node } = this.state + const { loading, config, node, rolelist } = this.state let style = {...config.style} @@ -1600,6 +1636,9 @@ <Tooltip title="鍓嶈繘"> <RedoOutlined onClick={this.setprev}/> </Tooltip> + <Tooltip overlayStyle={{maxWidth: 260}} title="蹇嵎閿細澶嶅埗锛坈trl+c锛夈�佸壀鍒囷紙ctrl+x锛夈�佺矘璐达紙ctrl+v锛夈�佸悗閫�锛坈trl+z锛夈�佸墠杩涳紙ctrl+shift+z锛夈�佸垹闄わ紙backspace 鎴� delete锛�"> + <QuestionCircleOutlined /> + </Tooltip> </div> <div className="right-tool"> <Tooltip title="淇濆瓨"> @@ -1612,7 +1651,7 @@ <div id={config.uuid + 'container'} className="mk-container"></div> <div className="mk-node-edit"> <div className="header">璁剧疆</div> - {!node ? <div className="empty">鏈�変腑</div> : <NodeUpdate node={node} onChange={this.changeProps}/>} + {!node ? <div className="empty">鏈�変腑</div> : <NodeUpdate node={node} rolelist={rolelist} onChange={this.changeProps}/>} </div> </div> </div> -- Gitblit v1.8.0