fix: '流程中心增加GIS配置'

src/pages/bsmanager/workOrder/workflowEdit/workFlowComponents/FlowChart.jsx

@@ -342,6 +342,7 @@ const FlowChart = props => {
       roleList: [],
       CarbonCopyPeopleList: [],
       ExtendPageList: [],
+      FlowNodeBackfillConfigs: [],
       FlowTimerList: [],
       TurnOnCc: 1,
       NodeAliasName: '',

src/pages/bsmanager/workOrder/workflowEdit/workFlowComponents/FlowChartRt.jsx

@@ -415,6 +415,7 @@ const FlowChart = props => {
       roleList: [],
       CarbonCopyPeopleList: [],
       ExtendPageList: [],
+      FlowNodeBackfillConfigs: [],
       FlowTimerList: [],
       TurnOnCc: 1,
       NodeAliasName: '',
@@ -1037,6 +1038,12 @@ const FlowChart = props => {
           base64Data: base64,
         }).then(response => {
           if (response.code === 0) {
+            console.log(currentNode.current);
+            let list = JSON.parse(JSON.stringify(currentNode.current));
+            list.FlowNodeBackfillConfigs = jsonData(list.FlowNodeBackfillConfigs);
+            currentNode.current = list;
+            console.log(currentNode.current);
+            debugger;
             FlowNodeSave({
               PreviewImage: response.data,
               CreateUser: sessionStorage.getItem('userName'),
@@ -1072,6 +1079,54 @@ const FlowChart = props => {
       },
     );
   };
+
+  const jsonData = val => {
+    let listArr = [];
+    val.map((item, index) => {
+      let arr = [];
+      arr.push({
+        mapServer: item.schemeName,
+        tableName: item[0].nodeName,
+        filed: item[0].nodeValue,
+      });
+      if (item.users) {
+        item.users.map(i => {
+          arr.push({
+            mapServer: item.schemeName,
+            tableName: i.nodeName,
+            filed: i.nodeValue,
+          });
+        });
+      }
+      let obj = {};
+      obj.type = 'GIS';
+      if (item.tableType === 'mapping') {
+        obj.mapping = [
+          {
+            fromData: {
+              tableName: item.TableName,
+              filed: item.Fields,
+            },
+            toData: arr,
+          },
+        ];
+      } else {
+        obj.relationFormMapping = [
+          {
+            fromData: {
+              tableName: item.TableName,
+              filed: item.Fields,
+            },
+            toData: arr,
+          },
+        ];
+      }
+      let json = JSON.stringify(obj);
+      let newObj = { Config: json, BackfillType: 'GIS', RuleName: item.RuleName };
+      listArr.push(newObj);
+    });
+    return listArr;
+  };
   // 关闭时进行数据比对看数据是否改变
   const leaveTip = () => {
     let diagramObj = JSON.parse(diagram.model.toJson());
@@ -1142,7 +1197,9 @@ const FlowChart = props => {
     if (key === 'TableName') {
       setFlag(flag + 1);
     }
-
+    if (key === 'FlowNodeBackfillConfigs') {
+      setFlag(flag + 1);
+    }
     diagram.rebuildParts();
     // leaveCallBack(true);
   };
@@ -1218,6 +1275,12 @@ const FlowChart = props => {
           base64Data: base64,
         }).then(val => {
           if (val.code === 0) {
+            console.log(diagramObj.nodeDataArray);
+            diagramObj.nodeDataArray.map(i => {
+              i.FlowNodeBackfillConfigs = jsonData(i.FlowNodeBackfillConfigs);
+            });
+            console.log(diagramObj.nodeDataArray);
+            debugger;
             SaveNodeChange({
               FlowId: flowID,
               // DeleteNodes,

src/pages/bsmanager/workOrder/workflowEdit/workFlowComponents/flowChartComponents/NodeModal.jsx

@@ -10,6 +10,7 @@ import ConfigCopyPerson from './nodeModalComponents/ConfigCopyPerson';
 import ConfigOperate from './nodeModalComponents/ConfigOperate';
 import ConfigCase from './nodeModalComponents/ConfigCase';
 import ConfigView from './nodeModalComponents/ConfigView';
+import ConfigGIS from './nodeModalComponents/ConfigGIS';
 import ConfigTimeLimit from './nodeModalComponents/ConfigTimeLimit';
 import CongfigHeightMsg from './nodeModalComponents/CongfigHeightMsg';
 
@@ -36,6 +37,7 @@ const NodeModal = props => {
   const refConfigOperate = useRef();
   const refConfigCase = useRef();
   const refConfigView = useRef();
+  const refConfigGIS = useRef();
   const refConfigTimeLimit = useRef();
   const refCongfigHeightMsg = useRef();
 
@@ -56,6 +58,7 @@ const NodeModal = props => {
       ...refConfigCase.current?.getParmar(),
       ...refConfigSubprocess.current?.getParmar(),
       ...refConfigView.current?.getParmar(),
+      ...refConfigGIS.current?.getParmar(),
       ...refConfigTimeLimit.current?.getParmar(),
     };
 
@@ -193,6 +196,19 @@ const NodeModal = props => {
               editMsg={editMsg}
               flowID={flowID}
             />
+            {/* GIS配置 */}
+            <div
+              style={{
+                display: editMsg.NodeType === '2' ? 'block' : 'none',
+              }}
+            >
+              <ConfigGIS
+                ref={refConfigGIS}
+                nodeChage={nodeChage}
+                editMsg={editMsg}
+                flowID={flowID}
+              />
+            </div>
             {/* 工单配置 */}
             <div
               style={{

src/pages/bsmanager/workOrder/workflowEdit/workFlowComponents/flowChartComponents/nodeModalComponents/AddGIS.less

+.AddGIS{
+  :global {
+    .ant-row {
+        width: 520px !important;
+    }
+}
+}
\ No newline at end of file

src/pages/bsmanager/workOrder/workflowEdit/workFlowComponents/flowChartComponents/nodeModalComponents/ConfigGIS.jsx

+/* eslint-disable prettier/prettier */
+/* eslint-disable indent */
+/* eslint-disable no-unused-expressions */
+import React, { useState, useEffect, useRef, forwardRef, useImperativeHandle } from 'react';
+import { Space, Button, Divider, Table, Tooltip, message } from 'antd';
+import { DeleteOutlined, EditTwoTone, PlusOutlined } from '@ant-design/icons';
+import AddGIS from './AddGIS';
+import { GetFlowNodeDataSource } from '@/services/flow/flow';
+
+const ConfigGIS = (props, ref) => {
+  const { editMsg, nodeChage, flowID } = props;
+
+  const [viewModal, setViewModal] = useState(false); // GIS配置新政编辑模态框
+  const [modalType, setModalType] = useState(''); // 模态框是编辑还是修改的状态
+  const [viewMsg, setviewMsg] = useState({}); // 保存编辑的信息
+  const [flag, setFlag] = useState(0);
+  const tableData = useRef([]); // GIS配置对应的回显的表格
+  const [tableField, setTableField] = useState([]);
+  const jsonData = [
+    {
+      BackfillType: 'GIS',
+      RuleName: 'dwe',
+      Config: {
+        type: 'GIS',
+        mapping: [
+          {
+            fromData: {
+              tableName: '事件_隐患整改事件表',
+              filed: '上报站点',
+            },
+            toData: [
+              {
+                filed: '工程名称',
+                mapServer: 'wlgcs',
+                tableName: '阀门',
+              },
+            ],
+          },
+        ],
+      },
+    },
+    {
+      BackfillType: 'GIS',
+      RuleName: 'eeef',
+      Config: {
+        type: 'GIS',
+        mapping: [
+          {
+            fromData: {
+              tableName: '事件_隐患整改事件表',
+              filed: '上报人名称',
+            },
+            toData: [
+              {
+                filed: '分组类型',
+                mapServer: 'wlgcs',
+                tableName: '水质监测点',
+              },
+              {
+                filed: '编号',
+                mapServer: 'wlgcs',
+                tableName: '测压点',
+              },
+            ],
+          },
+        ],
+      },
+    },
+  ];
+  useEffect(() => {
+    tableData.current = [];
+    // tableData.current = editMsg.FlowNodeBackfillConfigs?.map((item, index) => {
+    //   return {
+    //     ...item,
+    //     key: index,
+    //     ID: index,
+    //   };
+    // });
+    tableData.current = editMsg.FlowNodeBackfillConfigs?.map((item, index) => {
+      let obj = {};
+      let newConfig =JSON.parse(item.Config);
+      if (newConfig.mapping) {
+        let users = [];
+        newConfig.mapping[0].toData.map((x, y)=>{
+          obj[y]={nodeName: x.tableName, nodeValue: x.filed}
+        })
+        obj.Fields = newConfig.mapping[0].fromData.filed;
+        obj.ID = index;
+        obj.RuleName = item.RuleName;
+        obj.TableName = newConfig.mapping[0].fromData.tableName;
+        obj.key = index;
+        obj.nodeName1 = newConfig.mapping[0].toData[0].tableName;
+        obj.nodeValue1 = newConfig.mapping[0].toData[0].filed;
+        obj.schemeName = newConfig.mapping[0].toData[0].mapServer;
+        obj.tableType = 'mapping';
+        if (newConfig.mapping[0].toData.length > 1) {
+          newConfig.mapping[0].toData.map((i, j) => {
+            if (j !== 0) {
+              users.push({ nodeName: i.tableName, nodeValue: i.filed });
+            }
+          });
+          obj.users = users;
+        }
+      } else {
+        let users = [];
+        newConfig.relationFormMapping[0].toData.map((x, y)=>{
+          obj[y]={nodeName: x.tableName, nodeValue: x.filed}
+        })
+        obj.Fields = newConfig.relationFormMapping[0].fromData.filed;
+        obj.ID = index;
+        obj.RuleName = item.RuleName;
+        obj.TableName = newConfig.relationFormMapping[0].fromData.tableName;
+        obj.key = index;
+        obj.nodeName1 = newConfig.relationFormMapping[0].toData[0].tableName;
+        obj.nodeValue1 = newConfig.relationFormMapping[0].toData[0].filed;
+        obj.schemeName = newConfig.relationFormMapping[0].toData[0].mapServer;
+        obj.tableType = 'relationFormMapping';
+        if (newConfig.relationFormMapping[0].toData.length > 1) {
+          newConfig.relationFormMapping[0].toData.map((i, j) => {
+            if (j !== 0) {
+              users.push({ nodeName: i.tableName, nodeValue: i.filed });
+            }
+          });
+          obj.users = users;
+        }
+      }
+      return {
+        ...obj,
+      };
+    });
+    setFlag(flag + 1);
+    tableFields();
+  }, [editMsg]);
+  useImperativeHandle(ref, () => ({
+    getParmar,
+  }));
+  const getParmar = () => ({ FlowNodeBackfillConfigs: tableData.current });
+
+  const tableFields = () => {
+    GetFlowNodeDataSource({
+      flowId: flowID,
+    }).then(res => {
+      if (res.code === 0) {
+        res.data.FromData.map(i => {
+          i.type = '工单、事件表';
+          i.TableFields.map(j => {
+            j.table = i.TableName;
+            j.type = 'mapping';
+          });
+        });
+        res.data.RelationFormData.map(i => {
+          i.type = '关联表单';
+          i.TableFields.map(j => {
+            j.table = i.TableName;
+            j.type = 'relationFormMapping';
+          });
+        });
+        let arr = [...res.data.FromData, ...res.data.RelationFormData];
+        setTableField(arr);
+      }
+    });
+  };
+  // 编辑GIS配置
+  const toEdit = val => {
+    setViewModal(true);
+    setModalType('edit');
+    setviewMsg(val);
+  };
+  // GIS配置确定回调
+  const saveView = (val, type, tableType, TableName) => {
+    let list = JSON.parse(JSON.stringify(tableData.current));
+    // eslint-disable-next-line prefer-spread
+    let newKey = list.length > 0 ? Math.max.apply(Math, list.map(item => item.key)) + 1 : 0;
+
+    if (type === 'add') {
+      list.push({ ...val, key: newKey, tableType, TableName });
+    } else {
+      let edtiIndex = list.findIndex(item => item.key === val.key);
+
+      list[edtiIndex] = { ...val, key: newKey, tableType, TableName };
+    }
+    tableData.current = list;
+    console.log(list);
+    debugger;
+    nodeChage('FlowNodeBackfillConfigs', tableData.current);
+    setViewModal(false);
+  };
+  // 删除GIS配置
+  const delRow = record => {
+    let list = JSON.parse(JSON.stringify(tableData.current));
+    list = list.filter(item => item.key !== record.key);
+    list.map((item, index) => {
+      item.ID = index;
+      item.key = index;
+    });
+    tableData.current = list;
+    nodeChage('FlowNodeBackfillConfigs', tableData.current);
+    setFlag(flag + 1);
+  };
+  // 定义表格
+  const columns = [
+    {
+      title: '规则名称',
+      dataIndex: 'RuleName',
+      align: 'center',
+      render: (text, record) => {
+        if (text === '(未配置)' || text === '(无)') {
+          return <span style={{ color: 'grey' }}>{text}</span>;
+        }
+        return <span>{text || record.WebPage}</span>;
+      },
+    },
+    {
+      title: '源字段',
+      dataIndex: 'Fields',
+      align: 'center',
+      render: (text, record) => {
+        if (text === '(未配置)' || text === '(无)') {
+          return <span style={{ color: 'grey' }}>{text}</span>;
+        }
+        return <span>{text || record.WebPage}</span>;
+      },
+    },
+    {
+      title: '操作',
+      align: 'center',
+      ellipsis: true,
+      render: record => (
+        <>
+          <Space>
+            <DeleteOutlined
+              onClick={() => delRow(record)}
+              style={{ fontSize: '16px', color: '#e86060' }}
+            />
+          </Space>
+        </>
+      ),
+    },
+  ];
+  return (
+    <div>
+      <Divider
+        orientation="left"
+        style={{
+          borderTopColor: '#99bbe8',
+          color: '#15428b',
+          fontWeight: 700,
+        }}
+      >
+        GIS配置
+      </Divider>
+      <div
+        style={{
+          widnt: '100%',
+          marginBottom: '10px',
+          display: 'flex',
+          justifyContent: 'right',
+        }}
+      >
+        <Button
+          type="primary"
+          onClick={() => {
+            setViewModal(true);
+            setModalType('add');
+          }}
+          style={{ display: 'flex', alignItems: 'center' }}
+          icon={<PlusOutlined />}
+        >
+          新增GIS配置
+        </Button>
+      </div>
+      <Table
+        dataSource={tableData.current}
+        columns={columns}
+        rowKey={record => record.key}
+        bordered
+        size="small"
+        scroll={{ y: 'calc(100vh - 630px)' }}
+        onRow={(record, index) => ({
+          onDoubleClick: () => {
+            toEdit(record, index);
+          },
+        })}
+        pagination={false}
+      />
+      <AddGIS
+        tableData={tableData.current}
+        visible={viewModal}
+        msg={viewMsg}
+        modalType={modalType}
+        handleCancel={() => setViewModal(false)}
+        onSubumit={saveView}
+        tableField={tableField}
+        addIndex={tableData.current && tableData.current.length}
+      />
+    </div>
+  );
+};
+
+export default forwardRef(ConfigGIS);

src/services/flow/flow.js

@@ -5,7 +5,7 @@
  * @LastEditTime: 2022-08-17 10:10:50
  * @LastEditors: leizhe
  */
-import { get, post, PUBLISH_SERVICE } from '@/services/index';
+import { get, post, PUBLISH_SERVICE, PANDA_GIS } from '@/services/index';
 // 工单流程列表查询
 export const reloadFlows = param =>
   get(`${PUBLISH_SERVICE}/WorkOrderCenter/CM_Flow_ReloadFlows`, param);
@@ -92,3 +92,16 @@ export const removeFlowTimer = query =>
     `${PUBLISH_SERVICE}/WorkOrderCenter/CM_Flow_RemoveFlowTimer?flowTimerID=${query.flowTimerID}`,
     query,
   );
+// 加载反馈类型
+export const GetFlowNodeDataSource = query =>
+  get(`${PUBLISH_SERVICE}/WorkFlow/GetFlowNodeDataSource`, query);
+
+// 获取地图所有方案名称
+export const GetMaplayerByTerminalType = query =>
+  get(`${PANDA_GIS}/Maplayer/GetMaplayerByTerminalType`, query);
+
+// 获取图层
+export const GetLayerList = query => get(`${PANDA_GIS}/MetaData/D_GetLayerList`, query);
+
+// 获取图层可编辑字段
+export const GetLayerFields = query => get(`${PANDA_GIS}/MetaData/GetLayerFields`, query);