iframe 嵌套

web-network/client/src/sections/network/containers/device-monitor.js

@@ -11,20 +11,31 @@ import { ApartmentOutlined, TableOutlined } from '@ant-design/icons';
 import { PinyinHelper, Func as PeaceFunc } from '@peace/utils';
 import DeviceTree from '../components/device-tree';
 import { DeviceTypes } from '../constant';
+import qs from "qs";
+
 import '../style.less';
 
-function DeviceMonitor({ ...props }) {
+function DeviceMonitor ({ ...props }) {
    const {
       dispatch, actions, user, clientWidth, clientHeight, loading,
       myStructList, deviceMetasWithFollow, devices, dimensions, deviceListAlarms, factorStations,
    } = props;
 
+
    const [params, setParams] = useState({});
    const [selectStructure, setSelectStructure] = useState(null);
    const [extraType, setExtraType] = useState('tree');
    //  const pageStyle = Func.getPaginationStyle();
 
+
+   let strucParam = JSON.parse((qs.parse(props.location?.search.slice(1)) || {})?.strucData)
+   console.log(1111, strucParam)
+
+
+
    useEffect(() => {
+
+
       //   dispatch(actions.dataMonitor.getDeviceMeta());
       //   dispatch(actions.dataMonitor.getMyStructList(user?.orgId)).then((res) => {
       //       if (res.success) {
@@ -223,7 +234,7 @@ function DeviceMonitor({ ...props }) {
                               success: true,
                            };
                         }}
-                                    pagination={{  }}
+                        pagination={{}}
                         options={{
                            search: false,
                            reload: false,
@@ -249,7 +260,7 @@ function DeviceMonitor({ ...props }) {
    );
 }
 
-function mapStateToProps(state) {
+function mapStateToProps (state) {
    const {
       auth, global, myStructList, deviceMeta, deviceList, dimensionsList, deviceListAlarms, factorStations,
    } = state;

web-network/package.json

@@ -87,6 +87,7 @@
     "lodash": "^4.17.21",
     "mini-dynamic-antd-theme": "^0.5.3",
     "moment": "^2.29.4",
+    "qs": "^6.11.2",
     "react-color": "^2.19.3",
     "react-router-breadcrumbs-hoc": "^4.0.1",
     "react-sortable-hoc": "^2.0.0",

web/client/src/layout/components/header/index.jsx

@@ -104,7 +104,7 @@ const Header = (props) => {
                      if (socket) {
                         socket.disconnect();
                      }
-                     history.push(`/network`);
+                     history.push(`/signin`);
                   }
                }}
                style={{
@@ -378,7 +378,7 @@ const Header = (props) => {
                               if (socket) {
                                  socket.disconnect();
                               }
-                              history.push(`/network`);
+                              history.push(`/signin`);
                            }}>
                            退出
                            {/* <Nav.Item itemKey={"logout"} text={"退出"} style={{ textAlign: "center" }} /> */}

web/client/src/layout/containers/layout/index.jsx

@@ -172,7 +172,7 @@ const LayoutContainer = props => {
       NProgress.done();
       if ((!user || !user.authorized)) {
          if (!location.pathname.includes('projectGroup')) {
-            history.push('/network');
+            history.push('/signin');
          }
       }
       if (msg) {

web/client/src/sections/analysis/containers/network.jsx

@@ -109,8 +109,22 @@ const Network = ({
             </div>
 
 
-
             <div id='show' style={{ width: "100%", height: "calc(100% - 106px)" }}>
+               <iframe
+                  style={{
+                     width: '100%',
+                     height: '100%',
+                     zIndex: 7, border: 0
+                  }}
+                  src={`http://localhost:5000/network?strucData=${JSON.stringify(organizationsStruc?.find(v => v.thingId == thingId) || {})}`}
+                  allowFullScreen
+               >
+                  <p>你的浏览器不支持 iframe 。</p>
+               </iframe>
+            </div>
+
+
+            {/* <div id='show' style={{ width: "100%", height: "calc(100% - 106px)" }}>
                <div style={{
                   display: "flex", alignItems: 'center', justifyContent: "space-between",
                   borderBottom: '1px solid rgb(184 176 176 / 60%)', padding: 10
@@ -124,7 +138,7 @@ const Network = ({
                      <Radio value={"tree"}>树状展示</Radio>
                      <Radio value={"table"}>表格展示</Radio>
                   </RadioGroup>
-                  {/* <div>
+                  <div>
                      <Button
                         theme="solid"
                         type="primary"
@@ -158,13 +172,13 @@ const Network = ({
                      >
                         表格展示
                      </Button>
-                  </div> */}
+                  </div>
                </div>
                {show == 'tree' && <TreeShow thingId={thingId} />}
                {show == 'table' && <TableShow thingId={thingId} project={projectValue} />
                }
-            </div>
+            </div > */}
-         </div>
+         </div >
 
 
 

web/client/src/sections/analysis/nav-item.jsx

@@ -25,9 +25,9 @@ export function getNavItem (user, dispatch) {
                   items: [{
                      itemKey: 'operationData', to: '/analysis/operationAnalysis/operationData', text: '运维数据'
                   },
-                  // {
+                  {
-                  //    itemKey: 'network', to: '/analysis/operationAnalysis/network', text: '一图统揽'
+                     itemKey: 'network', to: '/analysis/operationAnalysis/network', text: '一图统揽'
-                  // }
+                  }
                ]
                },
                // {