From 0cb8696b2c2f9885e5bad9bf4b91ab03423a055f Mon Sep 17 00:00:00 2001 From: luxiaotao1123 <t1341870251@163.com> Date: 星期三, 13 三月 2024 15:05:12 +0800 Subject: [PATCH] Merge branch 'master' of http://47.97.1.152:5880/r/zy-asrs-master --- zy-asrs-flow/src/components/Flow/GraphDrawer.jsx | 140 +++------------------------------------------- 1 files changed, 11 insertions(+), 129 deletions(-) diff --git a/zy-asrs-flow/src/components/Flow/GraphDrawer.jsx b/zy-asrs-flow/src/components/Flow/GraphDrawer.jsx index df442c5..858b6eb 100644 --- a/zy-asrs-flow/src/components/Flow/GraphDrawer.jsx +++ b/zy-asrs-flow/src/components/Flow/GraphDrawer.jsx @@ -1,134 +1,16 @@ import React, { useRef, useEffect, useState } from "react"; -import { Button, Drawer, Input, Switch } from 'antd'; -import { initNodeData } from "./GraphConfig"; -import './GrapDrawer.less'; - -const { TextArea } = Input; +import { GraphDrawerNode } from "./Drawer/GraphDrawerNode"; +import { GraphDrawerEdge } from "./Drawer/GraphDrawerEdge"; +import { GraphDrawerCrn } from "./Drawer/GraphDrawerCrn"; +import './css/GrapDrawer.less'; export const GraphDrawer = ({ graphRef, isReady }) => { - const [open, setOpen] = useState(false); - const [init, setInit] = useState(false); - const [nodeData, setNodeData] = useState(null); - const [edgeData, setEdgeData] = useState(null); - const [codeContent, setCodeContent] = useState(null); - - const showNodeDrawer = (graph, node) => { - setOpen(true); - setNodeData(node); - if (node.data == null) { - node.data = initNodeData; - } - - if (node.data.codeContent != null) { - setCodeContent(node.data.codeContent); - } - }; - - const showEdgeDrawer = (graph, edge) => { - setOpen(true); - setEdgeData(edge); - if (edge.data == null) { - edge.data = initNodeData; - } - - if (edge.data.codeContent != null) { - setCodeContent(edge.data.codeContent); - } - - if (edge.labels.length == 0) { - edge.appendLabel({ - attrs: { - label: { - text: "" - } - } - }) - } - - } - - const onNodeClose = (e) => { - setOpen(false); - setNodeData(null); - setCodeContent(null); - }; - - const onEdgeClose = (e) => { - setOpen(false); - setEdgeData(null); - setCodeContent(null); - }; - - const nodeTextAreaChange = (e) => { - setCodeContent(e.target.value); - nodeData.data.codeContent = e.target.value; - } - - const edgeTextAreaChange = (e) => { - setCodeContent(e.target.value); - edgeData.data.codeContent = e.target.value; - } - - const nodeDataInputChange = (e) => { - nodeData.label = e.target.value; - } - - const edgeDataInputChange = (e) => { - edgeData.removeLabelAt(0); - edgeData.appendLabel({ - attrs: { - label: { - text: e.target.value - } - } - }) - edgeData.data.logicBool = e.target.value == 'true' ? true : false; - } - - useEffect(() => { - if (isReady) { - const graph = graphRef.current; - - if (!init) { - graph.on("node:dblclick", ({ node }) => { - showNodeDrawer(graph, node); - }) - graph.on("edge:dblclick", ({ edge }) => { - showEdgeDrawer(graph, edge); - }) - setInit(true); - } - } - }) - - if (nodeData) { - return ( - <> - <Drawer title={nodeData.label} onClose={onNodeClose} open={open} size="large"> - <div className="graphDrawerContainer"> - <div>ID锛歿nodeData.id}</div> - <div>缁勪欢鍚嶏細<Input defaultValue={nodeData.label} onChange={nodeDataInputChange} /></div> - <div>鏍硅妭鐐癸細<Switch checkedChildren="鏄�" unCheckedChildren="鍚�" checked={nodeData.data.root} /></div> - <div>鍙墽琛屼唬鐮侊細</div> - <TextArea value={codeContent} onChange={nodeTextAreaChange} rows={10} /> - </div> - </Drawer> - </> - ); - } else if (edgeData) { - return ( - <> - <Drawer title={edgeData.label} onClose={onEdgeClose} open={open} size="large"> - <div className="graphDrawerContainer"> - <div>ID锛歿edgeData.id}</div> - <div>灞炴�ц鎯咃細<Input defaultValue={edgeData.labels[0].attrs.label.text} onChange={edgeDataInputChange} /></div> - <div>鏍硅妭鐐癸細<Switch checkedChildren="鏄�" unCheckedChildren="鍚�" checked={edgeData.data.root} /></div> - <div>鍙墽琛屼唬鐮侊細</div> - <TextArea value={codeContent} onChange={edgeTextAreaChange} rows={10} /> - </div> - </Drawer> - </> - ); - } + return ( + <> + <GraphDrawerNode graphRef={graphRef} isReady={isReady} /> + <GraphDrawerEdge graphRef={graphRef} isReady={isReady} /> + <GraphDrawerCrn graphRef={graphRef} isReady={isReady} /> + </> + ); } \ No newline at end of file -- Gitblit v1.9.1