fix: 组态修改，解决dom不存在问题

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

 /* eslint-disable */
-import React, { useState, useEffect, useRef, useContext } from 'react';
+import React, { useState, useEffect, useRef, useContext, useMemo, useCallback } from 'react';
 import classNames from 'classnames';
 import moment from 'moment';
 import axios from 'axios';
@@ -64,11 +64,10 @@ let historyInfoParams = [];
 let statisticalInfoParams = {};
 let nodeData = null; // 选中节点的数据
 let twoID = '';
-let myDiagram = null;
 const waterFlow = new WaterFlowControlView();
 
 const ConfigurationView = (props) => {
-  // let myDiagram = null;
+  let myDiagram = null;
   let mqttView = null;
   let editionArr = [];
   let globalControl = false;
@@ -92,12 +91,18 @@ const ConfigurationView = (props) => {
   const [videoTitle, setVideoTitle] = useState('');
   const [viewType, setViewType] = useState(false);
   const [currentUser, setCurrentUser] = useState(false);
+  const [noInitial, setNoInitial] = useState(false);
+  const [domFlag, setDomFlag] = useState(true);
+  const [numerals, setNumerals] = useState(1);
 
-  twoID = `TDG${Date.now().toString(36)}`;
+  // twoID = `TDG${Date.now().toString(36)}`;
   const navigatorAgent = /(iPhone|iOS|Android|Windows Phone)/i.test(navigator.userAgent);
   const AdjustControlInput = useRef();
   const AuthorFrom = useRef();
   const ConfigurationRef = useRef();
+  const ConfigurationViewRef = useCallback((dom) => {
+    setDomFlag(!!dom);
+  });
   const customBack = props.customBack ? props.customBack : () => {};
   const { devices = [], config, isZoom = false, flowShow = true, deviceName = [] } = props;
   let devicesCode = [];
@@ -454,6 +459,7 @@ const ConfigurationView = (props) => {
 
   /** *********************************MQTT请求数据回调****************************** */
   const refreshData = (mqttDatas, code) => {
+    if (isClose || !myDiagram) return false;
     const bindList = bindData.find((item) => {
       return item.code === code;
     });
@@ -837,16 +843,13 @@ const ConfigurationView = (props) => {
   };
 
   useEffect(() => {
-    diagramInit();
-    return () => {
-      if (myDiagram) {
-        myDiagram.div = null;
-        myDiagram = null;
+    if (noInitial && domFlag) {
+      setNumerals(numerals + 1);
     }
-    };
-  }, []);
+  }, [noInitial, domFlag]);
 
   useEffect(() => {
+    twoID = `TDG${Date.now().toString(36)}`;
     if (!props.name) {
       setDescription('咦~工艺图配置信息不全哦~');
       setIsEmpty(true);
@@ -860,12 +863,12 @@ const ConfigurationView = (props) => {
       isClose = true;
       mqttView && mqttView.disSaveWaconnect();
       mqttView = null;
-      // if (myDiagram) {
-      //   myDiagram.div = null;
-      //   myDiagram = null;
-      // }
+      if (myDiagram) {
+        myDiagram.div = null;
+        myDiagram = null;
+      }
     };
-  }, [props.name]);
+  }, [props.name, numerals]);
 
   useEffect(() => {
     if (!isModalVisible) {
@@ -903,6 +906,7 @@ const ConfigurationView = (props) => {
             nodeDataArray: [],
             linkDataArray: [],
           };
+      if (!ConfigurationRef.current) return setNoInitial(true);
       mqttView = devicesCode.length
         ? new MqttView({
             mqttIP: globalConfig.mqtt_iotIP,
@@ -915,6 +919,7 @@ const ConfigurationView = (props) => {
           })
         : null;
       diagramRender(typeof fromJson === 'string' ? fromJson : JSON.stringify(fromJson), list);
+      setNoInitial(false);
       try {
         mqttView && mqttView.saveWaterMqtt();
       } catch (e) {
@@ -1536,7 +1541,7 @@ const ConfigurationView = (props) => {
   };
 
   /** **********************************画布渲染************************************ */
-  const diagramInit = (jsonStr, chartInfo) => {
+  const diagramRender = (jsonStr, chartInfo) => {
     myDiagram = goJS(
       go.Diagram,
       twoID, // must name or refer to the DIV HTML element
@@ -2978,8 +2983,7 @@ const ConfigurationView = (props) => {
     //     }),
     //   ),
     // );
-  };
-  const diagramRender = (jsonStr, chartInfo) => {
+
     const fromJson = JSON.parse(jsonStr);
     myTimeout(() => {
       loop();
@@ -3027,6 +3031,10 @@ const ConfigurationView = (props) => {
       if (item.category == 'timeCase') {
         item.timeStr = item.text;
       }
+      if (item.category === 'bgCase') {
+        myDiagram.defaultScale = item.scale || item.scale === 0 ? item.scale : 1;
+      }
+
       // 兼容V1之前版本（部分展示可支持）
       if (chartInfo.version === 'V1') return false;
       item.shName = item.showName || '';
@@ -3040,7 +3048,7 @@ const ConfigurationView = (props) => {
 
   return (
     <div className={classNames(prefixCls)} ref={ConfigurationRef}>
-      <div id={twoID} className={classNames('configurationView')}>
+      <div id={twoID} ref={ConfigurationViewRef} className={classNames('configurationView')}>
         {/* <LoadBox spinning={spinning} /> */}
         {isEmpty && <Empty theme={'dark'} description={description} />}
       </div>