fix: 组态修改

packages/extend-components/EC_ConfigurationView/src/EC_ConfigurationView.md

@@ -27,6 +27,7 @@ group:
 | ----------------------- | ------------------------------- | ------- | ------ |
 | name `必需`             | 画板名称                        | string  | ''     |
 | devices `必需`          | 画板设备                        | array   | []     |
+| deviceName              | 画板设备名称                    | array   | []     |
 | dictionaryParams `必需` | 图标颜色数据字典参数            | object  | {}     |
 | config `必需`           | 全局 globalConfig               | object  | {}     |
 | isZoom                  | 是否可缩放(手持上建议设置 true) | boolean | false  |

packages/extend-components/EC_ConfigurationView/src/demos/Basic.tsx

 import React from 'react';
 import PandaConfigurationView from '../index';
+// import PandaConfigurationView from '../../es/index';
 const Demo = () => {
   return (
     <div style={{ width: '100%', height: '600px', background: '#242835' }}>
       <PandaConfigurationView
-        name={'水厂工艺流程段'}
-        devices={'EQZT00000008,EQZT00000007,CPDA00000001,JYBZ00000003,JYBZ00000005,JYBZ00000004,SC00000003'.split(
+        // name={'水厂工艺流程段'}
+        // devices={'EQZT00000008,EQZT00000007,CPDA00000001,JYBZ00000003,JYBZ00000005,JYBZ00000004,SC00000003'.split(
+        //   ',',
+        // )}
+        name={'崇左丽江水厂原水泵房'}
+        devices={'EQZT00000007,CPBA00000001,CPAA00000001,EQZT00000008,CPDA00000001,CPAD00000001,LJSC00000002,EQZT00000005,EQZT00000004,EQZT00000002,EQZT00000003'.split(
           ',',
         )}
-        // name={'崇左丽江水厂原水泵房'}
-        // devices={'EQZT00000007,CPBA00000001,CPAA00000001,EQZT00000008,CPDA00000001,CPAD00000001,LJSC00000002,EQZT00000005,EQZT00000004,EQZT00000002,EQZT00000003'.split(",")}
         // name={'丽江水厂原水提升泵D单元'}
         // devices={'CPAA00000001, CPAD00000001, LJSC00000002'.split(',')}
         dictionaryParams={{ nodeID: 149 }}
         config={globalConfig}
+        deviceName={['工艺流程1', '工艺流程2', '工艺流程3']}
         // isZoom={true}
       />
     </div>

packages/extend-components/EC_ConfigurationView/src/index.js

@@ -107,8 +107,16 @@ const ConfigurationView = (props) => {
   twoID = `TDG${Date.now().toString(36)}`;
   const AdjustControlInput = useRef();
   const AuthorFrom = useRef();
+  const ConfigurationRef = useRef();
   const customBack = props.customBack ? props.customBack : () => {};
-  const { devices = [], dictionaryParams, config, isZoom = false, flowShow = true } = props;
+  const {
+    devices = [],
+    dictionaryParams,
+    config,
+    isZoom = false,
+    flowShow = true,
+    deviceName = [],
+  } = props;
   const globalConfig = window.globalConfig || config;
   let poolWater = null;
   let tubeWater = null;
@@ -1320,7 +1328,7 @@ const ConfigurationView = (props) => {
         'Auto',
         nodeStyle(),
         'Spot',
-        { locationSpot: go.Spot.Center, zOrder: 2 },
+        { locationSpot: go.Spot.Center, zOrder: 3 },
         new go.Binding('zOrder', 'zOrder').makeTwoWay(),
         new go.Binding('location', 'loc', go.Point.parse).makeTwoWay(go.Point.stringify),
         new go.Binding('angle').makeTwoWay(),
@@ -1352,6 +1360,26 @@ const ConfigurationView = (props) => {
           new go.Binding('stroke', 'fontStroke').makeTwoWay(),
           new go.Binding('textAlign', 'fontAlign'),
         ),
+        {
+          click(e, node) {
+            const { data } = node;
+            nodeData = data;
+            const list = bindData.find((item) => {
+              return item.name === data.stationName;
+            });
+            if (!list) return false;
+            switch (data.opType) {
+              case '画板跳转': // 图片模型
+                drawBoardMethod(data);
+                break;
+              case '自定义交互': // 自定义交互
+                customBack(data);
+                break;
+              default:
+                break;
+            }
+          },
+        },
       ),
     );
 
@@ -2087,12 +2115,18 @@ const ConfigurationView = (props) => {
       if (item.category === 'modelCase' || item.category === 'ellipseCase') {
         item.dtzOrder = item.zOrder;
       }
+      if (item.category == 'deviceCase' && deviceName && deviceName.length) {
+        var device = deviceName.find(function (arr, index) {
+          return '设备' + stationList[index] == item.stationName;
+        });
+        if (device) item.text = device;
+      }
     });
     myDiagram.model = go.Model.fromJson(json);
   };
 
   return (
-    <div className={classNames(prefixCls)}>
+    <div className={classNames(prefixCls)} ref={ConfigurationRef}>
       <div id={twoID} className={classNames('configurationView')}>
         <LoadBox spinning={spinning} />
         {isEmpty && <Empty theme={'dark'} description={description} />}
@@ -2108,6 +2142,7 @@ const ConfigurationView = (props) => {
           onOk={handleOk}
           onCancel={handleCancel}
           wrapClassName={classNames(`${prefixCls}-modal`)}
+          getContainer={ConfigurationRef.current}
           {...modalProps}
         >
           {renderModalContent()}
@@ -2123,6 +2158,7 @@ const ConfigurationView = (props) => {
           visible={isAuModalVisible}
           onOk={handleAuOk}
           onCancel={() => setIsAuModalVisible(false)}
+          getContainer={ConfigurationRef.current}
           wrapClassName={classNames(`${prefixCls}-modal`)}
         >
           <Form className={classNames('authorizeControlContent')} ref={AuthorFrom} name="loginForm">
@@ -2144,6 +2180,7 @@ const ConfigurationView = (props) => {
           visible={isHIModalVisible}
           onOk={() => setIsHIModalVisible(false)}
           onCancel={() => setIsHIModalVisible(false)}
+          getContainer={ConfigurationRef.current}
           wrapClassName={classNames(`${prefixCls}-historyInfoModal`)}
         >
           <HistoryInfo
@@ -2167,6 +2204,7 @@ const ConfigurationView = (props) => {
           limit={true}
           onCancel={() => setIsJumpModalVisible(false)}
           wrapClassName={classNames(`${prefixCls}-jumpModal`)}
+          getContainer={ConfigurationRef.current}
           componentPrefix={componentPrefix}
           style={{
             height: jumpModalProps.height ? `${Number(jumpModalProps.height) + 103}px` : '100%',
@@ -2190,6 +2228,7 @@ const ConfigurationView = (props) => {
 ConfigurationView.defaultProps = {
   name: '',
   devices: [],
+  deviceName: [],
   dictionaryParams: {},
   config: {},
   isZoom: false,
@@ -2199,6 +2238,7 @@ ConfigurationView.defaultProps = {
 ConfigurationView.propTypes = {
   name: PropTypes.string,
   devices: PropTypes.array,
+  deviceName: PropTypes.array,
   dictionaryParams: PropTypes.object,
   config: PropTypes.object,
   isZoom: PropTypes.bool,