From eca8b5481ab1c8bad8d031416a9d106585fa429c Mon Sep 17 00:00:00 2001
From: Junjie <xjj@123>
Date: 星期二, 19 三月 2024 14:02:19 +0800
Subject: [PATCH] #
---
zy-asrs-flow/src/pages/asrs/flowGraph/components/edit.jsx | 109 ++
zy-asrs-flow/src/pages/asrs/flowGraph/index.jsx | 373 +++++++++
zy-asrs-flow/src/components/Flow/Drawer/GraphDrawerCrn.jsx | 4
zy-asrs-flow/src/components/Flow/css/GraphTools.less | 12
zy-asrs-flow/src/components/Flow/GraphDrawer.jsx | 2
zy-asrs-flow/src/services/flow/api.js | 33
zy-asrs-flow/src/components/Flow/GraphComponent.jsx | 1376 ---------------------------------
zy-asrs-flow/src/components/Flow/Drawer/GraphDrawerDevp.jsx | 285 ++++++
zy-asrs-flow/src/components/Flow/GraphTools.jsx | 237 ++++
zy-asrs-flow/src/services/route.js | 1
10 files changed, 1,033 insertions(+), 1,399 deletions(-)
diff --git a/zy-asrs-flow/src/components/Flow/Drawer/GraphDrawerCrn.jsx b/zy-asrs-flow/src/components/Flow/Drawer/GraphDrawerCrn.jsx
index 1bafa98..eee088c 100644
--- a/zy-asrs-flow/src/components/Flow/Drawer/GraphDrawerCrn.jsx
+++ b/zy-asrs-flow/src/components/Flow/Drawer/GraphDrawerCrn.jsx
@@ -14,13 +14,13 @@
const [execApi, setExecApi] = useState(null);
const classList = [
- { value: 'crnClass', label: '鍫嗗灈鏈虹被' },
+ { value: 'CrnThread', label: '鍫嗗灈鏈虹被' },
];
const apiList = [
{ value: 'load', label: '鍙栬揣' },
{ value: 'unload', label: '鏀捐揣' },
- { value: 'load_unload', label: '鍙栨斁璐�' },
+ { value: 'loadAndUnload', label: '鍙栨斁璐�' },
];
const showNodeDrawer = (graph, node) => {
diff --git a/zy-asrs-flow/src/components/Flow/Drawer/GraphDrawerDevp.jsx b/zy-asrs-flow/src/components/Flow/Drawer/GraphDrawerDevp.jsx
new file mode 100644
index 0000000..89eb722
--- /dev/null
+++ b/zy-asrs-flow/src/components/Flow/Drawer/GraphDrawerDevp.jsx
@@ -0,0 +1,285 @@
+import React, { useRef, useEffect, useState } from "react";
+import { Button, Drawer, Input, Switch, Select, Checkbox } from 'antd';
+import { initNodeData } from "../GraphConfig";
+
+const { TextArea } = Input;
+const CheckboxGroup = Checkbox.Group;
+
+export const GraphDrawerDevp = ({ graphRef, isReady }) => {
+
+ const [open, setOpen] = useState(false);
+ const [init, setInit] = useState(false);
+ const [nodeData, setNodeData] = useState(null);
+ const [codeContent, setCodeContent] = useState(null);
+ const [staStatus, setStaStatus] = useState([]);
+ const [enableStaStatus, setEnableStaStatus] = useState(false);
+ const [staHasWorkNo, setStaHasWorkNo] = useState(false);
+ const [devpWorkNo, setDevpWorkNo] = useState(null);
+ const [workNoJudgement, setWorkNoJudgement] = useState(null);
+ const [staJudgementFailExecute, setStaJudgementFailExecute] = useState(false);
+ const [writeStaNoStatus, setWriteStaNoStatus] = useState(false);
+ const [writeWorkNoStatus, setWriteWorkNoStatus] = useState(false);
+ const [writeStaNo, setWriteStaNo] = useState("");
+ const [writeWorkNo, setWriteWorkNo] = useState("");
+ const [staNo, setStaNo] = useState("");
+ const [devpNo, setDevpNo] = useState("");
+
+ const devpOptions = [
+ {
+ label: '鑷姩',
+ value: 'auto'
+ },
+ {
+ label: '鏈夌墿',
+ value: 'loading'
+ },
+ {
+ label: '鍙叆',
+ value: 'in'
+ },
+ {
+ label: '鍙嚭',
+ value: 'out'
+ },
+ {
+ label: '宸ヤ綔鍙�',
+ value: 'workNo'
+ }
+ ];
+
+ const staStatusChange = (list) => {
+ setStaStatus(list);
+ nodeData.data.devpType.staStatus = list;
+
+ let hasWorkNo = false;
+ list.forEach((item) => {
+ if (item == "workNo") {
+ //瀛樺湪宸ヤ綔鍙�
+ hasWorkNo = true;
+ }
+ })
+
+ setStaHasWorkNo(hasWorkNo);
+ nodeData.data.devpType.hasWorkNo = hasWorkNo;
+ };
+
+ const devpWorkNoChange = (e) => {
+ setDevpWorkNo(e.target.value);
+ nodeData.data.devpType.devpWorkNo = e.target.value;
+ }
+
+ const staJudgementFailExecuteChange = (status) => {
+ setStaJudgementFailExecute(status);
+ nodeData.data.devpType.staJudgementFailExecute = status ? 'execute' : 'stop';
+ }
+
+ const writeStaNoStatusChange = (status) => {
+ setWriteStaNoStatus(status);
+ nodeData.data.devpType.writeStaNoStatus = status;
+ }
+
+ const writeWorkNoStatusChange = (status) => {
+ setWriteWorkNoStatus(status);
+ nodeData.data.devpType.writeWorkNoStatus = status;
+ }
+
+ const enableStaStatusChange = (status) => {
+ setEnableStaStatus(status);
+ nodeData.data.devpType.enableStaStatus = status;
+ }
+
+ const workNoJudgementChange = (data) => {
+ setWorkNoJudgement(data)
+ nodeData.data.devpType.workNoJudgement = data;
+ }
+
+ const staNoChange = (e) => {
+ setStaNo(e.target.value);
+ nodeData.data.devpType.staNo = e.target.value;
+ }
+
+ const showNodeDrawer = (graph, node) => {
+ if (node.data.type == "devp") {
+ setOpen(true);
+ setNodeData(node);
+ if (node.data == null) {
+ node.data = initNodeData;
+ }
+
+ if (node.data.codeContent != null) {
+ setCodeContent(node.data.codeContent);
+ }
+
+ if (node.data.devpType == null) {
+ node.data.devpType = {
+ devpNo: "",//杈撻�佺嚎PLC
+ staNo: "",//绔欏彿
+ enableStaStatus: false,//榛樿鍏抽棴鍒ゆ柇绔欑偣鐘舵��
+ staStatus: [],//鍒ゆ柇绔欑偣鐘舵�佸垪琛�
+ hasWorkNo: false,//鏄惁瀛樺湪宸ヤ綔鍙峰垽鏂�
+ workNoJudgement: '>',//榛樿鍒ゆ柇宸ヤ綔鍙� 澶т簬鍙�
+ devpWorkNo: 0,//榛樿宸ヤ綔鍙�
+ staJudgementFailExecute: false,//鍒ゆ柇澶辫触鍚庢槸鍚︾户缁墽琛屾祦绋�
+ writeStaNoStatus: false,//鏄惁鍐欏叆鐩爣绔�
+ writeWorkNoStatus: false,//鏄惁鍐欏叆宸ヤ綔鍙�
+ writeStaNo: "",//鍐欏叆鐩爣绔欐暟鎹�
+ writeWorkNo: "",//鍐欏叆宸ヤ綔鍙锋暟鎹�
+ }
+ } else {
+ const devpType = node.data.devpType;
+ setDevpNo(devpType.devpNo);
+ setStaNo(devpType.staNo);
+ setEnableStaStatus(devpType.enableStaStatus);
+ setStaStatus(devpType.staStatus);
+ setStaHasWorkNo(devpType.hasWorkNo);
+ setDevpWorkNo(devpType.devpWorkNo);
+ setWorkNoJudgement(devpType.workNoJudgement);
+ setStaJudgementFailExecute(devpType.staJudgementFailExecute);
+ setWriteWorkNoStatus(devpType.writeWorkNoStatus);
+ setWriteStaNoStatus(devpType.writeStaNoStatus);
+ setWriteWorkNo(devpType.writeWorkNo);
+ setWriteStaNo(devpType.writeStaNo);
+ }
+ }
+ };
+
+ const onNodeClose = (e) => {
+ setOpen(false);
+ setNodeData(null);
+ setCodeContent(null);
+ };
+
+ const nodeTextAreaChange = (e) => {
+ setCodeContent(e.target.value);
+ nodeData.data.codeContent = e.target.value;
+ }
+
+ const nodeDataInputChange = (e) => {
+ nodeData.label = e.target.value;
+ }
+
+ const writeWorkNoChange = (e) => {
+ setWriteWorkNo(e.target.value);
+ nodeData.data.devpType.writeWorkNo = e.target.value;
+ }
+
+ const writeStaNoChange = (e) => {
+ setWriteStaNo(e.target.value);
+ nodeData.data.devpType.writeStaNo = e.target.value;
+ }
+
+ const devpNoChange = (e) => {
+ setDevpNo(e.target.value);
+ nodeData.data.devpType.devpNo = e.target.value;
+ }
+
+ useEffect(() => {
+ if (isReady) {
+ const graph = graphRef.current;
+
+ if (!init) {
+ graph.on("node:dblclick", ({ node }) => {
+ showNodeDrawer(graph, node);
+ })
+ setInit(true);
+ }
+ }
+ })
+
+ if (nodeData) {
+ return (
+ <>
+ <Drawer title={nodeData.label} onClose={onNodeClose} open={open} size="large">
+ <div className="graphDrawerContainer">
+ <div>杈撻�佺嚎缁勪欢</div>
+ <div>ID锛歿nodeData.id}</div>
+ <div>缁勪欢鍚嶏細<Input defaultValue={nodeData.label} onChange={nodeDataInputChange} /></div>
+ <div>鏍硅妭鐐癸細<Switch checkedChildren="鏄�" unCheckedChildren="鍚�" checked={nodeData.data.root} /></div>
+ <div>
+ 杈撻�佺嚎PLC锛�
+ <Input value={devpNo} onChange={devpNoChange} placeholder="杈撻�佺嚎PLC" />
+ </div>
+ <div>
+ 绔欏彿锛�
+ <Input value={staNo} onChange={staNoChange} placeholder="绔欏彿" />
+ </div>
+ <div>
+ 鍒ゆ柇绔欑偣鐘舵�侊細
+ <Switch value={enableStaStatus} checkedChildren="寮�鍚�" unCheckedChildren="鍏抽棴" onChange={enableStaStatusChange} />
+ </div>
+ {
+ enableStaStatus ?
+ <div>
+ 绔欑偣鐘舵�侊細
+ <CheckboxGroup options={devpOptions} value={staStatus} onChange={staStatusChange} />
+ </div>
+
+ : ''
+ }
+
+ {
+ enableStaStatus && staHasWorkNo ?
+ <div>
+ 宸ヤ綔鍙峰垽鏂細
+
+ <Input
+ value={devpWorkNo}
+ onChange={devpWorkNoChange}
+ addonBefore={<Select
+ onChange={workNoJudgementChange}
+ value={workNoJudgement}
+ defaultValue=">"
+ options={[
+ { value: '>', label: '>' },
+ { value: '>=', label: '>=' },
+ { value: '=', label: '=' },
+ { value: '!=', label: '!=' },
+ { value: '<', label: '<' },
+ { value: '<=', label: '<=' },
+ ]}
+ />} placeholder="宸ヤ綔鍙�" />
+ </div>
+ : ''
+ }
+
+ {
+ enableStaStatus ?
+ <div>
+ 绔欑偣鍒ゆ柇澶辫触锛�<Switch value={staJudgementFailExecute} checkedChildren="缁х画鎵ц" unCheckedChildren="闃绘鎵ц" onChange={staJudgementFailExecuteChange} />
+ </div>
+
+ : ''
+ }
+
+ <div>
+ 鍐欏叆宸ヤ綔鍙凤細<Switch value={writeWorkNoStatus} checkedChildren="鍐欏叆" unCheckedChildren="涓嶅啓鍏�" onChange={writeWorkNoStatusChange} />
+ {
+ writeWorkNoStatus ?
+ <Input
+ value={writeWorkNo}
+ onChange={writeWorkNoChange}
+ placeholder="宸ヤ綔鍙�" />
+ : ''
+ }
+ </div>
+
+ <div>
+ 鍐欏叆鐩爣绔欙細<Switch value={writeStaNoStatus} checkedChildren="鍐欏叆" unCheckedChildren="涓嶅啓鍏�" onChange={writeStaNoStatusChange} />
+ {
+ writeStaNoStatus ?
+ <Input
+ value={writeStaNo}
+ onChange={writeStaNoChange}
+ placeholder="鐩爣绔�" />
+ : ''
+ }
+ </div>
+
+ {/* <div>鍙墽琛屼唬鐮侊細</div>
+ <TextArea value={codeContent} onChange={nodeTextAreaChange} rows={10} /> */}
+ </div>
+ </Drawer>
+ </>
+ );
+ }
+}
\ No newline at end of file
diff --git a/zy-asrs-flow/src/components/Flow/GraphComponent.jsx b/zy-asrs-flow/src/components/Flow/GraphComponent.jsx
index 995e51b..55d909d 100644
--- a/zy-asrs-flow/src/components/Flow/GraphComponent.jsx
+++ b/zy-asrs-flow/src/components/Flow/GraphComponent.jsx
@@ -33,27 +33,27 @@
const graph = ref.current;
- const rect = graph.addNode({
- x: 60,
- y: 60,
- width: 120,
- height: 40,
- label: '璁㈠崟绠＄悊',
- ports: commonGraphPorts,
- attrs: commonGraphAttrs,
- data: initNodeData,
- });
+ // const rect = graph.addNode({
+ // x: 60,
+ // y: 60,
+ // width: 120,
+ // height: 40,
+ // label: '璁㈠崟绠＄悊',
+ // ports: commonGraphPorts,
+ // attrs: commonGraphAttrs,
+ // data: initNodeData,
+ // });
- const rect2 = graph.addNode({
- x: 240,
- y: 240,
- width: 120,
- height: 40,
- label: '搴撳瓨绠＄悊',
- ports: commonGraphPorts,
- attrs: commonGraphAttrs,
- data: initNodeData,
- });
+ // const rect2 = graph.addNode({
+ // x: 240,
+ // y: 240,
+ // width: 120,
+ // height: 40,
+ // label: '搴撳瓨绠＄悊',
+ // ports: commonGraphPorts,
+ // attrs: commonGraphAttrs,
+ // data: initNodeData,
+ // });
graph.use(
new Snapline({
@@ -84,1342 +84,6 @@
},
}),
)
-
-
- graph.fromJSON({
- "cells": [
- {
- "shape": "edge",
- "attrs": {
- "line": {
- "stroke": "#A2B1C3",
- "targetMarker": {
- "name": "block",
- "width": 12,
- "height": 8
- }
- }
- },
- "id": "2475ea4f-f0e3-4b44-add4-7d4950ddea45",
- "zIndex": 0,
- "source": {
- "cell": "71d8bc90-558f-489f-b432-a03d7af27cdc",
- "port": "port2"
- },
- "target": {
- "cell": "c5798537-a8a0-4d79-bd76-a4f663492126",
- "port": "port1"
- },
- "data": {
- "codeContent": null,
- "root": false,
- "isLogic": false,
- "logicBool": false,
- "searchLogicId": 1,
- "searchLogicBool": true,
- "searchIndex": 0
- },
- "labels": [
- {
- "attrs": {
- "label": {
- "text": ""
- }
- }
- }
- ]
- },
- {
- "shape": "edge",
- "attrs": {
- "line": {
- "stroke": "#A2B1C3",
- "targetMarker": {
- "name": "block",
- "width": 12,
- "height": 8
- }
- }
- },
- "id": "2c3744b4-45ce-44a6-b169-402eaec24174",
- "zIndex": 0,
- "source": {
- "cell": "c5798537-a8a0-4d79-bd76-a4f663492126",
- "port": "port2"
- },
- "target": {
- "cell": "3ca188b2-9ffe-4528-ba6e-c1568b6d7fe6",
- "port": "port1"
- },
- "data": {
- "codeContent": null,
- "root": false,
- "isLogic": false,
- "logicBool": false,
- "searchLogicId": 1,
- "searchLogicBool": true,
- "searchIndex": 0
- },
- "labels": [
- {
- "attrs": {
- "label": {
- "text": ""
- }
- }
- }
- ]
- },
- {
- "shape": "edge",
- "attrs": {
- "line": {
- "stroke": "#A2B1C3",
- "targetMarker": {
- "name": "block",
- "width": 12,
- "height": 8
- }
- }
- },
- "id": "56181ccf-a41c-4cd8-82d6-e2a4bde31ba9",
- "zIndex": 0,
- "source": {
- "cell": "3ca188b2-9ffe-4528-ba6e-c1568b6d7fe6",
- "port": "port2"
- },
- "target": {
- "cell": "63db5ce0-b916-44e4-a924-a79b35afe1d1",
- "port": "port1"
- },
- "data": {
- "codeContent": null,
- "root": false,
- "isLogic": false,
- "logicBool": true,
- "searchLogicId": 1,
- "searchLogicBool": true,
- "searchIndex": 0
- },
- "labels": [
- {
- "attrs": {
- "label": {
- "text": "true"
- }
- }
- }
- ]
- },
- {
- "shape": "edge",
- "attrs": {
- "line": {
- "stroke": "#A2B1C3",
- "targetMarker": {
- "name": "block",
- "width": 12,
- "height": 8
- }
- }
- },
- "id": "73ca24ef-e9d4-4f18-9f06-ca49ac65962a",
- "zIndex": 0,
- "source": {
- "cell": "cc993d9b-ce11-409d-92c6-7208682dcc8b",
- "port": "port4"
- },
- "target": {
- "cell": "06d450fc-474e-4b23-b40d-c89fde446b28",
- "port": "port3"
- },
- "data": {
- "codeContent": null,
- "root": false,
- "isLogic": false,
- "logicBool": false,
- "searchLogicId": 1,
- "searchLogicBool": true,
- "searchIndex": 0
- },
- "labels": [
- {
- "attrs": {
- "label": {
- "text": "false"
- }
- }
- }
- ]
- },
- {
- "shape": "edge",
- "attrs": {
- "line": {
- "stroke": "#A2B1C3",
- "targetMarker": {
- "name": "block",
- "width": 12,
- "height": 8
- }
- }
- },
- "id": "84a3a77c-79e8-4cf8-9bab-a72bbfc77f1d",
- "zIndex": 0,
- "source": {
- "cell": "cc993d9b-ce11-409d-92c6-7208682dcc8b",
- "port": "port2"
- },
- "target": {
- "cell": "cd9da0a4-5c2d-4f1b-9c51-403b32f1ad51",
- "port": "port1"
- },
- "data": {
- "codeContent": null,
- "root": false,
- "isLogic": false,
- "logicBool": true,
- "searchLogicId": 1,
- "searchLogicBool": true,
- "searchIndex": 0
- },
- "labels": [
- {
- "attrs": {
- "label": {
- "text": "true"
- }
- }
- }
- ]
- },
- {
- "shape": "edge",
- "attrs": {
- "line": {
- "stroke": "#A2B1C3",
- "targetMarker": {
- "name": "block",
- "width": 12,
- "height": 8
- }
- }
- },
- "id": "93d65ae7-f170-466a-92ea-f69614002800",
- "zIndex": 0,
- "source": {
- "cell": "c844f3d1-02a3-47d3-bcb9-51027c1deb1c",
- "port": "port2"
- },
- "target": {
- "cell": "cc993d9b-ce11-409d-92c6-7208682dcc8b",
- "port": "port1"
- },
- "data": {
- "codeContent": null,
- "root": false,
- "isLogic": false,
- "logicBool": false,
- "searchLogicId": 1,
- "searchLogicBool": true,
- "searchIndex": 0
- },
- "labels": [
- {
- "attrs": {
- "label": {
- "text": ""
- }
- }
- }
- ]
- },
- {
- "shape": "edge",
- "attrs": {
- "line": {
- "stroke": "#A2B1C3",
- "targetMarker": {
- "name": "block",
- "width": 12,
- "height": 8
- }
- }
- },
- "id": "de85103e-80ac-4c88-92de-5bb1a131788c",
- "zIndex": 0,
- "source": {
- "cell": "63db5ce0-b916-44e4-a924-a79b35afe1d1",
- "port": "port2"
- },
- "target": {
- "cell": "c844f3d1-02a3-47d3-bcb9-51027c1deb1c",
- "port": "port1"
- },
- "data": {
- "codeContent": null,
- "root": false,
- "isLogic": false,
- "logicBool": false,
- "searchLogicId": 1,
- "searchLogicBool": true,
- "searchIndex": 0
- },
- "labels": [
- {
- "attrs": {
- "label": {
- "text": ""
- }
- }
- }
- ]
- },
- {
- "position": {
- "x": 60,
- "y": 60
- },
- "size": {
- "width": 120,
- "height": 40
- },
- "attrs": {
- "text": {
- "text": "璁㈠崟绠＄悊"
- },
- "body": {
- "fill": "#efefef",
- "stroke": "#4d4d4d",
- "strokeWidth": 2,
- "refD": "M 50 0 L 100 50 L 50 100 L 0 50 Z"
- }
- },
- "visible": true,
- "shape": "rect",
- "id": "a4962b5d-6ef0-4217-bbf8-742652ffc0ee",
- "data": {
- "codeContent": null,
- "root": false,
- "isLogic": false,
- "logicBool": false,
- "searchLogicId": 1,
- "searchLogicBool": true,
- "searchIndex": 0
- },
- "zIndex": 1,
- "ports": {
- "groups": {
- "top": {
- "position": "top",
- "attrs": {
- "circle": {
- "r": 5,
- "magnet": true,
- "stroke": "#5F95FF",
- "strokeWidth": 1,
- "fill": "#fff",
- "style": {
- "visibility": "hidden"
- }
- }
- }
- },
- "bottom": {
- "position": "bottom",
- "attrs": {
- "circle": {
- "r": 5,
- "magnet": true,
- "stroke": "#5F95FF",
- "strokeWidth": 1,
- "fill": "#fff",
- "style": {
- "visibility": "hidden"
- }
- }
- }
- },
- "left": {
- "position": "left",
- "attrs": {
- "circle": {
- "r": 5,
- "magnet": true,
- "stroke": "#5F95FF",
- "strokeWidth": 1,
- "fill": "#fff",
- "style": {
- "visibility": "hidden"
- }
- }
- }
- },
- "right": {
- "position": "right",
- "attrs": {
- "circle": {
- "r": 5,
- "magnet": true,
- "stroke": "#5F95FF",
- "strokeWidth": 1,
- "fill": "#fff",
- "style": {
- "visibility": "hidden"
- }
- }
- }
- }
- },
- "items": [
- {
- "id": "port1",
- "group": "top"
- },
- {
- "id": "port2",
- "group": "bottom"
- },
- {
- "id": "port3",
- "group": "left"
- },
- {
- "id": "port4",
- "group": "right"
- }
- ]
- }
- },
- {
- "position": {
- "x": 260,
- "y": 390
- },
- "size": {
- "width": 120,
- "height": 40
- },
- "attrs": {
- "text": {
- "text": "搴撳瓨绠＄悊"
- },
- "body": {
- "fill": "#efefef",
- "stroke": "#4d4d4d",
- "strokeWidth": 2,
- "refD": "M 50 0 L 100 50 L 50 100 L 0 50 Z"
- }
- },
- "visible": true,
- "shape": "rect",
- "id": "63db5ce0-b916-44e4-a924-a79b35afe1d1",
- "data": {
- "codeContent": "2222",
- "root": false,
- "isLogic": false,
- "logicBool": false,
- "searchLogicId": 1,
- "searchLogicBool": true,
- "searchIndex": 0
- },
- "zIndex": 2,
- "ports": {
- "groups": {
- "top": {
- "position": "top",
- "attrs": {
- "circle": {
- "r": 5,
- "magnet": true,
- "stroke": "#5F95FF",
- "strokeWidth": 1,
- "fill": "#fff",
- "style": {
- "visibility": "hidden"
- }
- }
- }
- },
- "bottom": {
- "position": "bottom",
- "attrs": {
- "circle": {
- "r": 5,
- "magnet": true,
- "stroke": "#5F95FF",
- "strokeWidth": 1,
- "fill": "#fff",
- "style": {
- "visibility": "hidden"
- }
- }
- }
- },
- "left": {
- "position": "left",
- "attrs": {
- "circle": {
- "r": 5,
- "magnet": true,
- "stroke": "#5F95FF",
- "strokeWidth": 1,
- "fill": "#fff",
- "style": {
- "visibility": "hidden"
- }
- }
- }
- },
- "right": {
- "position": "right",
- "attrs": {
- "circle": {
- "r": 5,
- "magnet": true,
- "stroke": "#5F95FF",
- "strokeWidth": 1,
- "fill": "#fff",
- "style": {
- "visibility": "hidden"
- }
- }
- }
- }
- },
- "items": [
- {
- "id": "port1",
- "group": "top"
- },
- {
- "id": "port2",
- "group": "bottom"
- },
- {
- "id": "port3",
- "group": "left"
- },
- {
- "id": "port4",
- "group": "right"
- }
- ]
- }
- },
- {
- "position": {
- "x": 270,
- "y": 265
- },
- "size": {
- "width": 100,
- "height": 60
- },
- "attrs": {
- "text": {
- "text": "閫昏緫鍒ゆ柇1"
- },
- "body": {
- "fill": "#efefef",
- "stroke": "#4d4d4d",
- "refD": "M 50 0 L 100 50 L 50 100 L 0 50 Z"
- }
- },
- "visible": true,
- "shape": "path",
- "id": "3ca188b2-9ffe-4528-ba6e-c1568b6d7fe6",
- "data": {
- "codeContent": "閫昏緫鍒ゆ柇1",
- "root": false,
- "isLogic": true,
- "logicBool": false,
- "searchLogicId": 1,
- "searchLogicBool": true,
- "searchIndex": 0
- },
- "zIndex": 3,
- "ports": {
- "groups": {
- "top": {
- "position": "top",
- "attrs": {
- "circle": {
- "r": 5,
- "magnet": true,
- "stroke": "#5F95FF",
- "strokeWidth": 1,
- "fill": "#fff",
- "style": {
- "visibility": "hidden"
- }
- }
- }
- },
- "bottom": {
- "position": "bottom",
- "attrs": {
- "circle": {
- "r": 5,
- "magnet": true,
- "stroke": "#5F95FF",
- "strokeWidth": 1,
- "fill": "#fff",
- "style": {
- "visibility": "hidden"
- }
- }
- }
- },
- "left": {
- "position": "left",
- "attrs": {
- "circle": {
- "r": 5,
- "magnet": true,
- "stroke": "#5F95FF",
- "strokeWidth": 1,
- "fill": "#fff",
- "style": {
- "visibility": "hidden"
- }
- }
- }
- },
- "right": {
- "position": "right",
- "attrs": {
- "circle": {
- "r": 5,
- "magnet": true,
- "stroke": "#5F95FF",
- "strokeWidth": 1,
- "fill": "#fff",
- "style": {
- "visibility": "hidden"
- }
- }
- }
- }
- },
- "items": [
- {
- "id": "port1",
- "group": "top"
- },
- {
- "id": "port2",
- "group": "bottom"
- },
- {
- "id": "port3",
- "group": "left"
- },
- {
- "id": "port4",
- "group": "right"
- }
- ]
- }
- },
- {
- "position": {
- "x": 300,
- "y": 30
- },
- "size": {
- "width": 80,
- "height": 40
- },
- "attrs": {
- "text": {
- "text": "绋嬪簭鍏ュ彛"
- },
- "body": {
- "fill": "#efefef",
- "stroke": "#4d4d4d",
- "strokeWidth": 2,
- "refD": "M 50 0 L 100 50 L 50 100 L 0 50 Z"
- }
- },
- "visible": true,
- "shape": "rect",
- "id": "71d8bc90-558f-489f-b432-a03d7af27cdc",
- "data": {
- "codeContent": null,
- "root": true,
- "isLogic": false,
- "logicBool": false,
- "searchLogicId": 1,
- "searchLogicBool": true,
- "searchIndex": 0
- },
- "zIndex": 4,
- "ports": {
- "groups": {
- "top": {
- "position": "top",
- "attrs": {
- "circle": {
- "r": 5,
- "magnet": true,
- "stroke": "#5F95FF",
- "strokeWidth": 1,
- "fill": "#fff",
- "style": {
- "visibility": "hidden"
- }
- }
- }
- },
- "bottom": {
- "position": "bottom",
- "attrs": {
- "circle": {
- "r": 5,
- "magnet": true,
- "stroke": "#5F95FF",
- "strokeWidth": 1,
- "fill": "#fff",
- "style": {
- "visibility": "hidden"
- }
- }
- }
- },
- "left": {
- "position": "left",
- "attrs": {
- "circle": {
- "r": 5,
- "magnet": true,
- "stroke": "#5F95FF",
- "strokeWidth": 1,
- "fill": "#fff",
- "style": {
- "visibility": "hidden"
- }
- }
- }
- },
- "right": {
- "position": "right",
- "attrs": {
- "circle": {
- "r": 5,
- "magnet": true,
- "stroke": "#5F95FF",
- "strokeWidth": 1,
- "fill": "#fff",
- "style": {
- "visibility": "hidden"
- }
- }
- }
- }
- },
- "items": [
- {
- "id": "port1",
- "group": "top"
- },
- {
- "id": "port2",
- "group": "bottom"
- },
- {
- "id": "port3",
- "group": "left"
- },
- {
- "id": "port4",
- "group": "right"
- }
- ]
- }
- },
- {
- "position": {
- "x": 300,
- "y": 110
- },
- "size": {
- "width": 80,
- "height": 40
- },
- "attrs": {
- "text": {
- "text": "甯哥敤缁勪欢"
- },
- "body": {
- "fill": "#efefef",
- "stroke": "#4d4d4d",
- "strokeWidth": 2,
- "refD": "M 50 0 L 100 50 L 50 100 L 0 50 Z"
- }
- },
- "visible": true,
- "shape": "rect",
- "id": "c5798537-a8a0-4d79-bd76-a4f663492126",
- "data": {
- "codeContent": "1111",
- "root": false,
- "isLogic": false,
- "logicBool": false,
- "searchLogicId": 1,
- "searchLogicBool": true,
- "searchIndex": 0
- },
- "zIndex": 5,
- "ports": {
- "groups": {
- "top": {
- "position": "top",
- "attrs": {
- "circle": {
- "r": 5,
- "magnet": true,
- "stroke": "#5F95FF",
- "strokeWidth": 1,
- "fill": "#fff",
- "style": {
- "visibility": "hidden"
- }
- }
- }
- },
- "bottom": {
- "position": "bottom",
- "attrs": {
- "circle": {
- "r": 5,
- "magnet": true,
- "stroke": "#5F95FF",
- "strokeWidth": 1,
- "fill": "#fff",
- "style": {
- "visibility": "hidden"
- }
- }
- }
- },
- "left": {
- "position": "left",
- "attrs": {
- "circle": {
- "r": 5,
- "magnet": true,
- "stroke": "#5F95FF",
- "strokeWidth": 1,
- "fill": "#fff",
- "style": {
- "visibility": "hidden"
- }
- }
- }
- },
- "right": {
- "position": "right",
- "attrs": {
- "circle": {
- "r": 5,
- "magnet": true,
- "stroke": "#5F95FF",
- "strokeWidth": 1,
- "fill": "#fff",
- "style": {
- "visibility": "hidden"
- }
- }
- }
- }
- },
- "items": [
- {
- "id": "port1",
- "group": "top"
- },
- {
- "id": "port2",
- "group": "bottom"
- },
- {
- "id": "port3",
- "group": "left"
- },
- {
- "id": "port4",
- "group": "right"
- }
- ]
- }
- },
- {
- "position": {
- "x": 280,
- "y": 511
- },
- "size": {
- "width": 80,
- "height": 40
- },
- "attrs": {
- "text": {
- "text": "甯哥敤缁勪欢2"
- },
- "body": {
- "fill": "#efefef",
- "stroke": "#4d4d4d",
- "strokeWidth": 2,
- "refD": "M 50 0 L 100 50 L 50 100 L 0 50 Z"
- }
- },
- "visible": true,
- "shape": "rect",
- "id": "c844f3d1-02a3-47d3-bcb9-51027c1deb1c",
- "data": {
- "codeContent": "甯哥敤缁勪欢2",
- "root": false,
- "isLogic": false,
- "logicBool": false,
- "searchLogicId": 1,
- "searchLogicBool": true,
- "searchIndex": 0
- },
- "zIndex": 6,
- "ports": {
- "groups": {
- "top": {
- "position": "top",
- "attrs": {
- "circle": {
- "r": 5,
- "magnet": true,
- "stroke": "#5F95FF",
- "strokeWidth": 1,
- "fill": "#fff",
- "style": {
- "visibility": "hidden"
- }
- }
- }
- },
- "bottom": {
- "position": "bottom",
- "attrs": {
- "circle": {
- "r": 5,
- "magnet": true,
- "stroke": "#5F95FF",
- "strokeWidth": 1,
- "fill": "#fff",
- "style": {
- "visibility": "hidden"
- }
- }
- }
- },
- "left": {
- "position": "left",
- "attrs": {
- "circle": {
- "r": 5,
- "magnet": true,
- "stroke": "#5F95FF",
- "strokeWidth": 1,
- "fill": "#fff",
- "style": {
- "visibility": "hidden"
- }
- }
- }
- },
- "right": {
- "position": "right",
- "attrs": {
- "circle": {
- "r": 5,
- "magnet": true,
- "stroke": "#5F95FF",
- "strokeWidth": 1,
- "fill": "#fff",
- "style": {
- "visibility": "hidden"
- }
- }
- }
- }
- },
- "items": [
- {
- "id": "port1",
- "group": "top"
- },
- {
- "id": "port2",
- "group": "bottom"
- },
- {
- "id": "port3",
- "group": "left"
- },
- {
- "id": "port4",
- "group": "right"
- }
- ]
- }
- },
- {
- "position": {
- "x": 270,
- "y": 620
- },
- "size": {
- "width": 100,
- "height": 60
- },
- "attrs": {
- "text": {
- "text": "閫昏緫鍒ゆ柇2"
- },
- "body": {
- "fill": "#efefef",
- "stroke": "#4d4d4d",
- "refD": "M 50 0 L 100 50 L 50 100 L 0 50 Z"
- }
- },
- "visible": true,
- "shape": "path",
- "id": "cc993d9b-ce11-409d-92c6-7208682dcc8b",
- "data": {
- "codeContent": "閫昏緫鍒ゆ柇2",
- "root": false,
- "isLogic": true,
- "logicBool": false,
- "searchLogicId": 1,
- "searchLogicBool": true,
- "searchIndex": 0
- },
- "zIndex": 7,
- "ports": {
- "groups": {
- "top": {
- "position": "top",
- "attrs": {
- "circle": {
- "r": 5,
- "magnet": true,
- "stroke": "#5F95FF",
- "strokeWidth": 1,
- "fill": "#fff",
- "style": {
- "visibility": "hidden"
- }
- }
- }
- },
- "bottom": {
- "position": "bottom",
- "attrs": {
- "circle": {
- "r": 5,
- "magnet": true,
- "stroke": "#5F95FF",
- "strokeWidth": 1,
- "fill": "#fff",
- "style": {
- "visibility": "hidden"
- }
- }
- }
- },
- "left": {
- "position": "left",
- "attrs": {
- "circle": {
- "r": 5,
- "magnet": true,
- "stroke": "#5F95FF",
- "strokeWidth": 1,
- "fill": "#fff",
- "style": {
- "visibility": "hidden"
- }
- }
- }
- },
- "right": {
- "position": "right",
- "attrs": {
- "circle": {
- "r": 5,
- "magnet": true,
- "stroke": "#5F95FF",
- "strokeWidth": 1,
- "fill": "#fff",
- "style": {
- "visibility": "hidden"
- }
- }
- }
- }
- },
- "items": [
- {
- "id": "port1",
- "group": "top"
- },
- {
- "id": "port2",
- "group": "bottom"
- },
- {
- "id": "port3",
- "group": "left"
- },
- {
- "id": "port4",
- "group": "right"
- }
- ]
- }
- },
- {
- "position": {
- "x": 280,
- "y": 781
- },
- "size": {
- "width": 80,
- "height": 40
- },
- "attrs": {
- "text": {
- "text": "甯哥敤缁勪欢3"
- },
- "body": {
- "fill": "#efefef",
- "stroke": "#4d4d4d",
- "strokeWidth": 2,
- "refD": "M 50 0 L 100 50 L 50 100 L 0 50 Z"
- }
- },
- "visible": true,
- "shape": "rect",
- "id": "cd9da0a4-5c2d-4f1b-9c51-403b32f1ad51",
- "data": {
- "codeContent": "甯哥敤缁勪欢3",
- "root": false,
- "isLogic": false,
- "logicBool": false,
- "searchLogicId": 1,
- "searchLogicBool": true,
- "searchIndex": 0
- },
- "zIndex": 8,
- "ports": {
- "groups": {
- "top": {
- "position": "top",
- "attrs": {
- "circle": {
- "r": 5,
- "magnet": true,
- "stroke": "#5F95FF",
- "strokeWidth": 1,
- "fill": "#fff",
- "style": {
- "visibility": "hidden"
- }
- }
- }
- },
- "bottom": {
- "position": "bottom",
- "attrs": {
- "circle": {
- "r": 5,
- "magnet": true,
- "stroke": "#5F95FF",
- "strokeWidth": 1,
- "fill": "#fff",
- "style": {
- "visibility": "hidden"
- }
- }
- }
- },
- "left": {
- "position": "left",
- "attrs": {
- "circle": {
- "r": 5,
- "magnet": true,
- "stroke": "#5F95FF",
- "strokeWidth": 1,
- "fill": "#fff",
- "style": {
- "visibility": "hidden"
- }
- }
- }
- },
- "right": {
- "position": "right",
- "attrs": {
- "circle": {
- "r": 5,
- "magnet": true,
- "stroke": "#5F95FF",
- "strokeWidth": 1,
- "fill": "#fff",
- "style": {
- "visibility": "hidden"
- }
- }
- }
- }
- },
- "items": [
- {
- "id": "port1",
- "group": "top"
- },
- {
- "id": "port2",
- "group": "bottom"
- },
- {
- "id": "port3",
- "group": "left"
- },
- {
- "id": "port4",
- "group": "right"
- }
- ]
- }
- },
- {
- "position": {
- "x": 472,
- "y": 640
- },
- "size": {
- "width": 80,
- "height": 40
- },
- "attrs": {
- "text": {
- "text": "甯哥敤缁勪欢4"
- },
- "body": {
- "fill": "#efefef",
- "stroke": "#4d4d4d",
- "strokeWidth": 2,
- "refD": "M 50 0 L 100 50 L 50 100 L 0 50 Z"
- }
- },
- "visible": true,
- "shape": "rect",
- "id": "06d450fc-474e-4b23-b40d-c89fde446b28",
- "data": {
- "codeContent": "甯哥敤缁勪欢4",
- "root": false,
- "isLogic": false,
- "logicBool": false,
- "searchLogicId": 1,
- "searchLogicBool": true,
- "searchIndex": 0
- },
- "zIndex": 9,
- "ports": {
- "groups": {
- "top": {
- "position": "top",
- "attrs": {
- "circle": {
- "r": 5,
- "magnet": true,
- "stroke": "#5F95FF",
- "strokeWidth": 1,
- "fill": "#fff",
- "style": {
- "visibility": "hidden"
- }
- }
- }
- },
- "bottom": {
- "position": "bottom",
- "attrs": {
- "circle": {
- "r": 5,
- "magnet": true,
- "stroke": "#5F95FF",
- "strokeWidth": 1,
- "fill": "#fff",
- "style": {
- "visibility": "hidden"
- }
- }
- }
- },
- "left": {
- "position": "left",
- "attrs": {
- "circle": {
- "r": 5,
- "magnet": true,
- "stroke": "#5F95FF",
- "strokeWidth": 1,
- "fill": "#fff",
- "style": {
- "visibility": "hidden"
- }
- }
- }
- },
- "right": {
- "position": "right",
- "attrs": {
- "circle": {
- "r": 5,
- "magnet": true,
- "stroke": "#5F95FF",
- "strokeWidth": 1,
- "fill": "#fff",
- "style": {
- "visibility": "hidden"
- }
- }
- }
- }
- },
- "items": [
- {
- "id": "port1",
- "group": "top"
- },
- {
- "id": "port2",
- "group": "bottom"
- },
- {
- "id": "port3",
- "group": "left"
- },
- {
- "id": "port4",
- "group": "right"
- }
- ]
- }
- }
- ]
- })
-
props.initHandle();//閫氱煡鐖剁粍浠跺垵濮嬪寲瀹屾垚
return graph;
diff --git a/zy-asrs-flow/src/components/Flow/GraphDrawer.jsx b/zy-asrs-flow/src/components/Flow/GraphDrawer.jsx
index 858b6eb..b07de64 100644
--- a/zy-asrs-flow/src/components/Flow/GraphDrawer.jsx
+++ b/zy-asrs-flow/src/components/Flow/GraphDrawer.jsx
@@ -2,6 +2,7 @@
import { GraphDrawerNode } from "./Drawer/GraphDrawerNode";
import { GraphDrawerEdge } from "./Drawer/GraphDrawerEdge";
import { GraphDrawerCrn } from "./Drawer/GraphDrawerCrn";
+import { GraphDrawerDevp } from "./Drawer/GraphDrawerDevp";
import './css/GrapDrawer.less';
export const GraphDrawer = ({ graphRef, isReady }) => {
@@ -11,6 +12,7 @@
<GraphDrawerNode graphRef={graphRef} isReady={isReady} />
<GraphDrawerEdge graphRef={graphRef} isReady={isReady} />
<GraphDrawerCrn graphRef={graphRef} isReady={isReady} />
+ <GraphDrawerDevp graphRef={graphRef} isReady={isReady} />
</>
);
}
\ No newline at end of file
diff --git a/zy-asrs-flow/src/components/Flow/GraphTools.jsx b/zy-asrs-flow/src/components/Flow/GraphTools.jsx
index e93b74b..701fdec 100644
--- a/zy-asrs-flow/src/components/Flow/GraphTools.jsx
+++ b/zy-asrs-flow/src/components/Flow/GraphTools.jsx
@@ -1,14 +1,23 @@
import React, { useRef, useEffect, useState } from "react";
-import { Button, message, Modal } from 'antd';
+import { Button, message, Modal, Divider, List, Typography, Input, Popconfirm } from 'antd';
+import { DeleteFilled, ApiOutlined } from '@ant-design/icons';
import { Prism as SyntaxHighlighter } from 'react-syntax-highlighter';
import { solarizedlight } from 'react-syntax-highlighter/dist/esm/styles/prism';
-import { exportDataToServer } from "../../services/flow/api";
+import { exportDataToServer, getFlowList, deleteFlowById, updateFlowStatus, mockRun } from "../../services/flow/api";
import './css/GraphTools.less'
+import { flow, remove } from "lodash";
export const GraphTools = ({ graphRef, isReady }) => {
const [isModalOpen, setIsModalOpen] = useState(false);
+ const [saveIsModalOpen, setSaveIsModalOpen] = useState(false);
const [preCode, setPreCode] = useState(null);
+ const [flowListData, setFlowListData] = useState([]);
+ const [currentFlow, setCurrentFlow] = useState(null);
+ const [flowName, setFlowName] = useState(null);
+ const [flowMemo, setFlowMemo] = useState(null);
+
+ let flowId = -1;
const handleOk = () => {
setIsModalOpen(false);
@@ -16,7 +25,24 @@
const handleCancel = () => {
setIsModalOpen(false);
+ setSaveIsModalOpen(false);
};
+
+ const flowNameInputChange = (e) => {
+ setFlowName(e.target.value)
+ }
+
+ const memoInputChange = (e) => {
+ setFlowMemo(e.target.value)
+ }
+
+ const saveData = () => {
+ if (currentFlow == null) {
+ flowId = -1;
+ }
+
+ setSaveIsModalOpen(true);
+ }
//棰勮浠ｇ爜
const prewCode = () => {
@@ -77,11 +103,26 @@
return;
}
+ let id = null;
+ if (currentFlow != null) {
+ id = currentFlow.id;
+ }
+
let result = sortNodes(rootNode, nodes, graph);
exportDataToServer({
- data: result
+ originData: JSON.stringify(data),
+ data: result,
+ name: flowName,
+ memo: flowMemo,
+ id: id
}).then((res) => {
- console.log(res);
+ if (res.code == 200) {
+ message.success('淇濆瓨鎴愬姛');
+ updateFlowList();
+ } else {
+ message.warning(res.msg);
+ }
+ setSaveIsModalOpen(false);
})
}
}
@@ -369,47 +410,158 @@
return values;
}
- const getChildren = (node, nodes, graph) => {
- const connectedEdges = graph.getConnectedEdges(node);
- const children = [];
-
- connectedEdges.forEach((edge) => {
- nodes.forEach((item) => {
- if (item.id === edge.target.cell && item.id != node.id) {
- children.push(item);
- }
- })
- });
-
- return children;
- }
-
- const getDescendants = (node, nodes, graph) => {
- const descendants = [];
- const stack = [node];
-
- let count = 0;
- while (stack.length > 0) {
- const current = stack.pop();
- descendants.push(current);
-
- const children = getChildren(current, nodes, graph);
- stack.push(...children);
+ const setFlowActive = () => {
+ if (currentFlow == null) {
+ message.warning("璇烽�夋嫨瑕佹縺娲讳娇鐢ㄧ殑娴佺▼鍥撅紒");
+ return;
}
- return descendants;
+ const status = currentFlow.status == 1 ? 0 : 1;
+ updateFlowStatus(currentFlow.id, status).then((res) => {
+ if (res.code == 200) {
+ message.success(status == 1 ? "婵�娲绘垚鍔�" : "宸插彇娑堟縺娲�");
+ currentFlow.status = status;
+ } else {
+ message.warning(res.msg);
+ }
+ updateFlowList();
+ })
}
+
+ const removeFlow = () => {
+ if (currentFlow == null) {
+ message.warning("璇烽�夋嫨瑕佸垹闄ょ殑娴佺▼鍥撅紒");
+ return;
+ }
+
+ deleteFlowById(currentFlow.id).then((res) => {
+ if (res.code == 200) {
+ message.success("鍒犻櫎鎴愬姛");
+ } else {
+ message.warning(res.msg);
+ }
+ updateFlowList();
+ })
+ }
+
+ const updateFlowList = () => {
+ getFlowList().then((res) => {
+ setFlowListData(res.data);
+ })
+ }
+
+ const createNewBlank = () => {
+ const graph = graphRef.current;
+ if (graph) {
+ graph.clearCells();
+ setCurrentFlow(null);
+ setFlowName(null);
+ setFlowMemo(null);
+ }
+ }
+
+ const switchFlowBlank = (flow) => {
+ const graph = graphRef.current;
+ if (graph) {
+ graph.fromJSON(JSON.parse(flow.originData));
+ setCurrentFlow(flow)
+ setFlowName(flow.name);
+ setFlowMemo(flow.memo);
+ }
+ }
+
+ const testRun = () => {//妯℃嫙杩愯
+ if (currentFlow == null) {
+ message.warning("璇烽�夋嫨娴佺▼鍥�");
+ return;
+ }
+
+ mockRun(currentFlow.id).then((res) => {
+ if (res.code == 200) {
+ message.success("杩愯鎴愬姛");
+ } else {
+ message.warning(res.msg);
+ }
+ })
+ }
+
+ useEffect(() => {
+ updateFlowList();
+ }, [])
return (
<>
- <div className="container">
- <Button type="primary" onClick={exportData}>
- 瀵煎嚭鏁版嵁
- </Button>
+ <div>
+ <div className="container">
+ <div className="containerButton">
+ <Button type="primary" onClick={createNewBlank}>
+ 鏂板缓
+ </Button>
+ </div>
- <Button type="primary" onClick={prewCode}>
- 棰勮浠ｇ爜
- </Button>
+ <div className="containerButton">
+ <Button type="primary" onClick={saveData}>
+ 淇濆瓨
+ </Button>
+ </div>
+
+ <div className="containerButton">
+ <Button type="primary" onClick={setFlowActive}>
+ 婵�娲讳娇鐢�
+ </Button>
+ </div>
+
+ <div className="containerButton">
+ <Button type="primary" onClick={prewCode}>
+ 棰勮浠ｇ爜
+ </Button>
+ </div>
+
+ <div className="containerButton">
+ <Button type="primary" onClick={testRun}>
+ 妯℃嫙杩愯
+ </Button>
+ </div>
+ </div>
+
+ <div className="flowList">
+ <List
+ header={
+ <div style={{ display: 'flex', justifyContent: 'space-between', alignItems: 'center' }}>
+ <div><Typography.Text mark>[鏁版嵁]</Typography.Text> 娴佺▼鍥惧垪琛�</div>
+ <div>
+ <Button type="primary" size="small" onClick={updateFlowList}>
+ 鍒锋柊
+ </Button>
+
+ <Popconfirm
+ title="鍒犻櫎娴佺▼鍥�"
+ description="纭鍒犻櫎锛�"
+ okText="鍒犻櫎"
+ cancelText="鍙栨秷"
+ onConfirm={removeFlow}
+ >
+ <Button style={{ marginLeft: '5px' }} type="primary" danger size="small">
+ <DeleteFilled />
+ </Button>
+ </Popconfirm>
+
+ </div>
+ </div>
+ }
+ dataSource={flowListData}
+ renderItem={(item) => (
+ <List.Item>
+ <Button type={currentFlow != null && item.id == currentFlow.id ? 'primary' : 'dashed'} style={{ width: '100%' }} onClick={() => switchFlowBlank(item)}>
+ <div style={{ display: 'flex', justifyContent: 'space-between' }}>
+ <div>{item.name}</div>
+ {item.status == 1 ? <div><ApiOutlined /></div> : ''}
+ </div>
+ </Button>
+ </List.Item>
+ )}
+ />
+ </div>
</div>
<Modal title="棰勮浠ｇ爜" open={isModalOpen} onOk={handleOk} onCancel={handleCancel}>
@@ -417,6 +569,15 @@
{preCode}
</SyntaxHighlighter>
</Modal>
+
+ <Modal title="淇濆瓨娴佺▼鍥�" open={saveIsModalOpen} onOk={exportData} onCancel={handleCancel}>
+ <div style={{ marginTop: '10px' }}>
+ <Input placeholder="娴佺▼鍥惧悕绉�" value={flowName} onChange={flowNameInputChange} />
+ </div>
+ <div style={{ marginTop: '10px' }}>
+ <Input placeholder="澶囨敞" value={flowMemo} onChange={memoInputChange} />
+ </div>
+ </Modal>
</>
);
}
\ No newline at end of file
diff --git a/zy-asrs-flow/src/components/Flow/css/GraphTools.less b/zy-asrs-flow/src/components/Flow/css/GraphTools.less
index 7502c89..6df5aa7 100644
--- a/zy-asrs-flow/src/components/Flow/css/GraphTools.less
+++ b/zy-asrs-flow/src/components/Flow/css/GraphTools.less
@@ -1,6 +1,16 @@
.container {
- width: 200px;
+ width: 240px;
display: flex;
justify-content: space-around;
margin-top: 10px;
+ flex-wrap: wrap;
+}
+
+.container .containerButton {
+ width: 100px;
+ margin-top: 10px;
+}
+
+.flowList {
+ padding: 10px;
}
\ No newline at end of file
diff --git a/zy-asrs-flow/src/pages/asrs/flowGraph/components/edit.jsx b/zy-asrs-flow/src/pages/asrs/flowGraph/components/edit.jsx
new file mode 100644
index 0000000..16d2b15
--- /dev/null
+++ b/zy-asrs-flow/src/pages/asrs/flowGraph/components/edit.jsx
@@ -0,0 +1,109 @@
+import React, { useState, useRef, useEffect } from 'react';
+import {
+ ProForm,
+ ProFormDigit,
+ ProFormText,
+ ProFormSelect,
+ ProFormDateTimePicker
+} from '@ant-design/pro-components';
+import { Form, Modal } from 'antd';
+import { FormattedMessage, useIntl } from '@umijs/max';
+import moment from 'moment';
+import Http from '@/utils/http';
+
+const Edit = (props) => {
+ const intl = useIntl();
+ const [form] = Form.useForm();
+ const { } = props;
+
+ useEffect(() => {
+ form.resetFields();
+ form.setFieldsValue({
+ ...props.values
+ })
+ }, [form, props])
+
+ const handleCancel = () => {
+ props.onCancel();
+ };
+
+ const handleOk = () => {
+ form.submit();
+ }
+
+ const handleFinish = async (values) => {
+ props.onSubmit({ ...values });
+ }
+
+ return (
+ <>
+ <Modal
+ title={
+ Object.keys(props.values).length > 0
+ ? intl.formatMessage({ id: 'page.edit', defaultMessage: '缂栬緫' })
+ : intl.formatMessage({ id: 'page.add', defaultMessage: '娣诲姞' })
+ }
+ width={640}
+ forceRender
+ destroyOnClose
+ open={props.open}
+ onCancel={handleCancel}
+ onOk={handleOk}
+ >
+ <ProForm
+ form={form}
+ submitter={false}
+ onFinish={handleFinish}
+ layout="horizontal"
+ grid={true}
+ >
+ <ProFormDigit
+ name="id"
+ disabled
+ hidden={true}
+ />
+ <ProForm.Group>
+ <ProFormText
+ name="originData"
+ label="鍘熷鏁版嵁"
+ colProps={{ md: 12, xl: 12 }}
+ />
+ <ProFormText
+ name="processData"
+ label="澶勭悊鍚庣殑鏁版嵁"
+ colProps={{ md: 12, xl: 12 }}
+ />
+ </ProForm.Group>
+ <ProForm.Group>
+ <ProFormDateTimePicker
+ name="createTime"
+ label=""
+ colProps={{ md: 12, xl: 12 }}
+ transform={(value) => moment(value).toISOString()}
+ />
+ <ProFormDateTimePicker
+ name="updateTime"
+ label=""
+ colProps={{ md: 12, xl: 12 }}
+ transform={(value) => moment(value).toISOString()}
+ />
+ </ProForm.Group>
+ <ProForm.Group>
+ <ProFormSelect
+ name="status"
+ label="鏄惁鍚敤"
+ colProps={{ md: 12, xl: 12 }}
+ options={[
+ { label: '鍚�', value: 0 },
+ { label: '鏄�', value: 1 },
+ ]}
+ />
+ </ProForm.Group>
+
+ </ProForm>
+ </Modal>
+ </>
+ )
+}
+
+export default Edit;
diff --git a/zy-asrs-flow/src/pages/asrs/flowGraph/index.jsx b/zy-asrs-flow/src/pages/asrs/flowGraph/index.jsx
new file mode 100644
index 0000000..1fd2f1d
--- /dev/null
+++ b/zy-asrs-flow/src/pages/asrs/flowGraph/index.jsx
@@ -0,0 +1,373 @@
+
+import React, { useState, useRef, useEffect } from 'react';
+import { Button, message, Modal, Tag } from 'antd';
+import {
+ FooterToolbar,
+ PageContainer,
+ ProTable,
+ LightFilter,
+} from '@ant-design/pro-components';
+import { FormattedMessage, useIntl } from '@umijs/max';
+import { PlusOutlined, ExportOutlined } from '@ant-design/icons';
+import Http from '@/utils/http';
+import Edit from './components/edit'
+import { TextFilter, SelectFilter, DatetimeRangeFilter, LinkFilter } from '@/components/TableSearch'
+import { statusMap } from '@/utils/enum-util'
+import { repairBug } from '@/utils/common-util';
+
+const TABLE_KEY = 'pro-table-flowGraph';
+
+const handleSave = async (val, intl) => {
+ const hide = message.loading(intl.formatMessage({ id: 'page.adding', defaultMessage: '姝ｅ湪娣诲姞' }));
+ try {
+ const resp = await Http.doPost('api/flowGraph/save', val);
+ if (resp.code === 200) {
+ message.success(intl.formatMessage({ id: 'page.add.success', defaultMessage: '娣诲姞鎴愬姛' }));
+ return true;
+ } else {
+ message.error(resp.msg);
+ return false;
+ }
+ } catch (error) {
+ message.error(intl.formatMessage({ id: 'page.add.fail', defaultMessage: '娣诲姞澶辫触璇烽噸璇曪紒' }));
+ return false;
+ } finally {
+ hide();
+ }
+};
+
+const handleUpdate = async (val, intl) => {
+ const hide = message.loading(intl.formatMessage({ id: 'page.updating', defaultMessage: '姝ｅ湪鏇存柊' }));
+ try {
+ const resp = await Http.doPost('api/flowGraph/update', val);
+ if (resp.code === 200) {
+ message.success(intl.formatMessage({ id: 'page.update.success', defaultMessage: '鏇存柊鎴愬姛' }));
+ return true;
+ } else {
+ message.error(resp.msg);
+ return false;
+ }
+ } catch (error) {
+ message.error(intl.formatMessage({ id: 'page.update.fail', defaultMessage: '鏇存柊澶辫触璇烽噸璇曪紒' }));
+ return false;
+ } finally {
+ hide();
+ }
+};
+
+const handleRemove = async (rows, intl) => {
+ if (!rows) return true;
+ const hide = message.loading(intl.formatMessage({ id: 'page.deleting', defaultMessage: '姝ｅ湪鍒犻櫎' }));
+ try {
+ const resp = await Http.doPost('api/flowGraph/remove/' + rows.map((row) => row.id).join(','));
+ if (resp.code === 200) {
+ message.success(intl.formatMessage({ id: 'page.delete.success', defaultMessage: '鍒犻櫎鎴愬姛' }));
+ return true;
+ } else {
+ message.error(resp.msg);
+ return false;
+ }
+ } catch (error) {
+ message.error(intl.formatMessage({ id: 'page.delete.fail', defaultMessage: '鍒犻櫎澶辫触锛岃閲嶈瘯锛�' }));
+ return false;
+ } finally {
+ hide();
+ }
+};
+
+const handleExport = async (intl) => {
+ const hide = message.loading(intl.formatMessage({ id: 'page.exporting', defaultMessage: '姝ｅ湪瀵煎嚭' }));
+ try {
+ const resp = await Http.doPostBlob('api/flowGraph/export');
+ const blob = new Blob([resp], { type: 'application/vnd.ms-excel' });
+ window.location.href = window.URL.createObjectURL(blob);
+ message.success(intl.formatMessage({ id: 'page.export.success', defaultMessage: '瀵煎嚭鎴愬姛' }));
+ return true;
+ } catch (error) {
+ message.error(intl.formatMessage({ id: 'page.export.fail', defaultMessage: '瀵煎嚭澶辫触锛岃閲嶈瘯' }));
+ return false;
+ } finally {
+ hide();
+ }
+};
+
+
+const Main = () => {
+ const intl = useIntl();
+ const formTableRef = useRef();
+ const actionRef = useRef();
+ const [selectedRows, setSelectedRows] = useState([]);
+ const [modalVisible, setModalVisible] = useState(false);
+ const [currentRow, setCurrentRow] = useState();
+ const [searchParam, setSearchParam] = useState({});
+
+ useEffect(() => {
+
+ }, []);
+
+ const columns = [
+ {
+ title: intl.formatMessage({
+ id: 'page.table.no',
+ defaultMessage: 'No'
+ }),
+ dataIndex: 'index',
+ valueType: 'indexBorder',
+ width: 48,
+ },
+ {
+ title: '鍘熷鏁版嵁',
+ dataIndex: 'originData',
+ valueType: 'text',
+ hidden: false,
+ width: 140,
+ filterDropdown: (props) => <TextFilter
+ name='originData'
+ {...props}
+ actionRef={actionRef}
+ setSearchParam={setSearchParam}
+ />,
+ },
+ {
+ title: '澶勭悊鍚庣殑鏁版嵁',
+ dataIndex: 'processData',
+ valueType: 'text',
+ hidden: false,
+ width: 140,
+ filterDropdown: (props) => <TextFilter
+ name='processData'
+ {...props}
+ actionRef={actionRef}
+ setSearchParam={setSearchParam}
+ />,
+ },
+ {
+ title: '',
+ dataIndex: 'createTime$',
+ valueType: 'text',
+ hidden: false,
+ width: 140,
+ filterDropdown: (props) => <DatetimeRangeFilter
+ name='createTime'
+ {...props}
+ actionRef={actionRef}
+ setSearchParam={setSearchParam}
+ />,
+ },
+ {
+ title: '',
+ dataIndex: 'updateTime$',
+ valueType: 'text',
+ hidden: false,
+ width: 140,
+ filterDropdown: (props) => <DatetimeRangeFilter
+ name='updateTime'
+ {...props}
+ actionRef={actionRef}
+ setSearchParam={setSearchParam}
+ />,
+ },
+ {
+ title: '鏄惁鍚敤',
+ dataIndex: 'status$',
+ valueType: 'text',
+ hidden: false,
+ width: 140,
+ filterDropdown: (props) => <SelectFilter
+ name='status'
+ {...props}
+ actionRef={actionRef}
+ setSearchParam={setSearchParam}
+ data={[
+ { label: '鍚�', value: 0 },
+ { label: '鏄�', value: 1 },
+ ]}
+ />,
+ },
+
+ {
+ title: '鎿嶄綔',
+ dataIndex: 'option',
+ width: 140,
+ valueType: 'option',
+ render: (_, record) => [
+ <Button
+ type="link"
+ key="edit"
+ onClick={() => {
+ setModalVisible(true);
+ setCurrentRow(record);
+ }}
+ >
+ <FormattedMessage id='page.edit' defaultMessage='缂栬緫' />
+ </Button>,
+ <Button
+ type="link"
+ danger
+ key="batchRemove"
+ onClick={async () => {
+ Modal.confirm({
+ title: intl.formatMessage({ id: 'page.delete', defaultMessage: '鍒犻櫎' }),
+ content: intl.formatMessage({ id: 'page.delete.confirm', defaultMessage: '纭畾鍒犻櫎璇ラ」鍚楋紵' }),
+ onOk: async () => {
+ const success = await handleRemove([record], intl);
+ if (success) {
+ if (actionRef.current) {
+ actionRef.current.reload();
+ }
+ }
+ },
+ });
+ }}
+ >
+ <FormattedMessage id='page.delete' defaultMessage='鍒犻櫎' />
+ </Button>,
+ ],
+ },
+ ];
+
+ return (
+ <PageContainer
+ header={{
+ breadcrumb: {},
+ }}
+ >
+ <div style={{ width: '100%', float: 'right' }}>
+ <ProTable
+ key="flowGraph"
+ rowKey="id"
+ actionRef={actionRef}
+ formRef={formTableRef}
+ columns={columns}
+ cardBordered
+ scroll={{ x: 1300 }}
+ dateFormatter="string"
+ pagination={{ pageSize: 16 }}
+ search={false}
+ toolbar={{
+ search: {
+ onSearch: (value) => {
+ setSearchParam(prevState => ({
+ ...prevState,
+ condition: value
+ }));
+ actionRef.current?.reload();
+ },
+ },
+ filter: (
+ <LightFilter
+ onValuesChange={(val) => {
+ }}
+ >
+ </LightFilter>
+ ),
+ actions: [
+ <Button
+ type="primary"
+ key="save"
+ onClick={async () => {
+ setModalVisible(true)
+ }}
+ >
+ <PlusOutlined />
+ <FormattedMessage id='page.add' defaultMessage='娣诲姞' />
+ </Button>,
+ <Button
+ key="export"
+ onClick={async () => {
+ handleExport(intl);
+ }}
+ >
+ <ExportOutlined />
+ <FormattedMessage id='page.export' defaultMessage='瀵煎嚭' />
+ </Button>,
+ ],
+ }}
+ request={(params, sorter, filter) =>
+ Http.doPostPromise('/api/flowGraph/page', { ...params, ...searchParam }, (res) => {
+ return {
+ data: res.data.records,
+ total: res.data.total,
+ success: true,
+ }
+ })
+ }
+ rowSelection={{
+ onChange: (ids, rows) => {
+ setSelectedRows(rows);
+ }
+ }}
+ columnsState={{
+ persistenceKey: TABLE_KEY,
+ persistenceType: 'localStorage',
+ defaultValue: {
+ // memo: { show: repairBug(TABLE_KEY, 'memo', false) },
+ option: { fixed: 'right', disable: true },
+ },
+ onChange(value) {
+ },
+ }}
+ />
+ </div>
+
+ {selectedRows?.length > 0 && (
+ <FooterToolbar
+ extra={
+ <div>
+ <a style={{ fontWeight: 600 }}>{selectedRows.length}</a>
+ <FormattedMessage id='page.selected' defaultMessage=' 椤瑰凡閫夋嫨' />
+ </div>
+ }
+ >
+ <Button
+ key="remove"
+ danger
+ onClick={async () => {
+ Modal.confirm({
+ title: intl.formatMessage({ id: 'page.delete', defaultMessage: '鍒犻櫎' }),
+ content: intl.formatMessage({ id: 'page.delete.confirm', defaultMessage: '纭畾鍒犻櫎璇ラ」鍚楋紵' }),
+ onOk: async () => {
+ const success = await handleRemove(selectedRows, intl);
+ if (success) {
+ setSelectedRows([]);
+ actionRef.current?.reloadAndRest?.();
+ }
+ },
+ });
+ }}
+ >
+ <FormattedMessage id='page.delete.batch' defaultMessage='鎵归噺鍒犻櫎' />
+ </Button>
+ </FooterToolbar>
+ )}
+
+ <Edit
+ open={modalVisible}
+ values={currentRow || {}}
+ onCancel={
+ () => {
+ setModalVisible(false);
+ setCurrentRow(undefined);
+ }
+ }
+ onSubmit={async (values) => {
+ let ok = false;
+ if (values.id) {
+ ok = await handleUpdate({ ...values }, intl)
+ } else {
+ ok = await handleSave({ ...values }, intl)
+ }
+ if (ok) {
+ setModalVisible(false);
+ setCurrentRow(undefined);
+ if (actionRef.current) {
+ actionRef.current.reload();
+ }
+ }
+ }}
+ />
+ </PageContainer>
+ );
+};
+
+export default Main;
diff --git a/zy-asrs-flow/src/services/flow/api.js b/zy-asrs-flow/src/services/flow/api.js
index cf227e5..6690955 100644
--- a/zy-asrs-flow/src/services/flow/api.js
+++ b/zy-asrs-flow/src/services/flow/api.js
@@ -2,8 +2,39 @@
import React from 'react';
export function exportDataToServer(data) {
- return request('/flow/analysisExportData', {
+ return request('/api/flow/analysisExportData', {
data: data,
method: 'POST'
});
+}
+
+export function getFlowList() {
+ return request('/api/flowGraph/list', {
+ method: 'POST'
+ })
+}
+
+export function deleteFlowById(id) {
+ return request('/api/flowGraph/remove/' + [id], {
+ method: 'POST'
+ })
+}
+
+export function updateFlowStatus(id, status) {
+ return request('/api/flowGraph/updateFlowStatus', {
+ method: 'POST',
+ data: {
+ id: id,
+ status: status
+ }
+ })
+}
+
+export function mockRun(id) {//妯℃嫙杩愯
+ return request('/api/flow/mockRun', {
+ method: 'POST',
+ data: {
+ id: id
+ }
+ })
}
\ No newline at end of file
diff --git a/zy-asrs-flow/src/services/route.js b/zy-asrs-flow/src/services/route.js
index 979bb36..0b5a631 100644
--- a/zy-asrs-flow/src/services/route.js
+++ b/zy-asrs-flow/src/services/route.js
@@ -26,7 +26,6 @@
export async function getRoutersInfo() {
return getRouters().then((res) => {
- console.log(res);
if (res.code === 200) {
// return res.data;
const routersInfo = convertCompatRouters(res.data);
--
Gitblit v1.9.1