"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports["default"] = void 0;
require("./index.less");
// import React, { useEffect, useRef, forwardRef, useState } from 'react';
// import * from './resources/lib/zfender.js';

// const runStatusTopology = { "nodeType": "THROW_POINT", "id": "1546760327695233026", "name": "万科中粮本案1号投放点", "deviceType": null, "deviceTypeDesc": null, "status": null, "lastDataTime": null, "lastHeartTime": null, "cumulativeWorkingTime": null, "cumulativeWorkingTimeStr": null, "availability": null, "nodes": [{ "nodeType": "DEVICE", "id": "1579017657812045825", "name": "VTT3W888888888888", "deviceType": "AI_BOX", "deviceTypeDesc": "AI_BOX", "status": "online", "lastDataTime": "2022-12-08 14:03:43", "lastHeartTime": "2022-12-08 14:03:43", "cumulativeWorkingTime": 3402972, "cumulativeWorkingTimeStr": "39天9小时16分12秒", "availability": 0.6577, "nodes": [] }, { "nodeType": "DEVICE", "id": "1579018179214364673", "name": "SDYDP888888888888", "deviceType": "ANDROID_SCREEN", "deviceTypeDesc": "安卓屏", "status": "online", "lastDataTime": "2022-12-08 14:04:02", "lastHeartTime": "2022-12-08 14:04:02", "cumulativeWorkingTime": 3811186, "cumulativeWorkingTimeStr": "44天2小时39分46秒", "availability": 0.7368, "nodes": [] }, { "nodeType": "DEVICE", "id": "1587656311627116545", "name": "VTT3Wzhoushan004", "deviceType": "AI_BOX", "deviceTypeDesc": "AI_BOX", "status": "online", "lastDataTime": "2022-12-08 14:03:54", "lastHeartTime": "2022-12-08 14:03:54", "cumulativeWorkingTime": 2778013, "cumulativeWorkingTimeStr": "32天3小时40分13秒", "availability": 0.8926, "nodes": [] }, { "nodeType": "DEVICE", "id": "1593089407239385090", "name": "VTT3Wlx023", "deviceType": "AI_BOX", "deviceTypeDesc": "AI_BOX", "status": "online", "lastDataTime": "2022-12-08 14:03:53", "lastHeartTime": "2022-12-08 14:03:53", "cumulativeWorkingTime": 1822162, "cumulativeWorkingTimeStr": "21天2小时9分22秒", "availability": 0.9999, "nodes": [] }, { "nodeType": "DEVICE", "id": "1597515894074314754", "name": "VTT3Wmianyang031", "deviceType": "AI_BOX", "deviceTypeDesc": "AI_BOX", "status": "offline", "lastDataTime": "2022-12-05 20:17:04", "lastHeartTime": "2022-12-05 20:17:04", "cumulativeWorkingTime": 15842, "cumulativeWorkingTimeStr": "4小时24分2秒", "availability": 0.0207, "nodes": [] }, { "nodeType": "DEVICE", "id": "1597802990089474049", "name": "VTT3Wmianyang001", "deviceType": "AI_BOX", "deviceTypeDesc": "AI_BOX", "status": "offline", "lastDataTime": null, "lastHeartTime": null, "cumulativeWorkingTime": null, "cumulativeWorkingTimeStr": null, "availability": null, "nodes": [] }, { "nodeType": "DEVICE", "id": "1597802990089474050", "name": "VTT3Wmianyang002", "deviceType": "AI_BOX", "deviceTypeDesc": "AI_BOX", "status": "offline", "lastDataTime": null, "lastHeartTime": null, "cumulativeWorkingTime": null, "cumulativeWorkingTimeStr": null, "availability": null, "nodes": [] }, { "nodeType": "DEVICE", "id": "1597804249475387394", "name": "VTT3Wmianyang003", "deviceType": "AI_BOX", "deviceTypeDesc": "AI_BOX", "status": "offline", "lastDataTime": "2022-12-07 15:57:21", "lastHeartTime": "2022-12-07 15:57:21", "cumulativeWorkingTime": 3491, "cumulativeWorkingTimeStr": "58分11秒", "availability": 0.0421, "nodes": [] }, { "nodeType": "DEVICE", "id": "1597804249475387395", "name": "VTT3Wmianyang004", "deviceType": "AI_BOX", "deviceTypeDesc": "AI_BOX", "status": "offline", "lastDataTime": "2022-12-08 11:59:56", "lastHeartTime": "2022-12-08 11:59:56", "cumulativeWorkingTime": 3322, "cumulativeWorkingTimeStr": "55分22秒", "availability": 0.3120, "nodes": [] }, { "nodeType": "DEVICE", "id": "1597804249475387396", "name": "VTT3Wmianyang005", "deviceType": "AI_BOX", "deviceTypeDesc": "AI_BOX", "status": "offline", "lastDataTime": "2022-12-05 20:31:02", "lastHeartTime": "2022-12-05 20:31:02", "cumulativeWorkingTime": 17797, "cumulativeWorkingTimeStr": "4小时56分37秒", "availability": 0.0702, "nodes": [] }, { "nodeType": "DEVICE", "id": "1597804249475387397", "name": "VTT3Wmianyang006", "deviceType": "AI_BOX", "deviceTypeDesc": "AI_BOX", "status": "offline", "lastDataTime": null, "lastHeartTime": null, "cumulativeWorkingTime": null, "cumulativeWorkingTimeStr": null, "availability": null, "nodes": [] }, { "nodeType": "DEVICE", "id": "1597804249475387398", "name": "VTT3Wmianyang007", "deviceType": "AI_BOX", "deviceTypeDesc": "AI_BOX", "status": "offline", "lastDataTime": null, "lastHeartTime": null, "cumulativeWorkingTime": null, "cumulativeWorkingTimeStr": null, "availability": null, "nodes": [] }, { "nodeType": "DEVICE", "id": "1597804249475387399", "name": "VTT3Wmianyang008", "deviceType": "AI_BOX", "deviceTypeDesc": "AI_BOX", "status": "offline", "lastDataTime": null, "lastHeartTime": null, "cumulativeWorkingTime": null, "cumulativeWorkingTimeStr": null, "availability": null, "nodes": [] }, { "nodeType": "DEVICE", "id": "1597804249475387400", "name": "VTT3Wmianyang009", "deviceType": "AI_BOX", "deviceTypeDesc": "AI_BOX", "status": "offline", "lastDataTime": null, "lastHeartTime": null, "cumulativeWorkingTime": null, "cumulativeWorkingTimeStr": null, "availability": null, "nodes": [] }, { "nodeType": "DEVICE", "id": "1597804249475387401", "name": "VTT3Wmianyang010", "deviceType": "AI_BOX", "deviceTypeDesc": "AI_BOX", "status": "offline", "lastDataTime": "2022-12-08 10:51:18", "lastHeartTime": "2022-12-08 10:51:18", "cumulativeWorkingTime": 3079, "cumulativeWorkingTimeStr": "51分19秒", "availability": 0.2118, "nodes": [] }, { "nodeType": "DEVICE", "id": "1597804249475387402", "name": "VTT3Wmianyang011", "deviceType": "AI_BOX", "deviceTypeDesc": "AI_BOX", "status": "offline", "lastDataTime": "2022-12-07 17:24:35", "lastHeartTime": "2022-12-07 17:24:35", "cumulativeWorkingTime": 2142, "cumulativeWorkingTimeStr": "35分42秒", "availability": 0.0280, "nodes": [] }, { "nodeType": "DEVICE", "id": "1597804249475387403", "name": "VTT3Wmianyang012", "deviceType": "AI_BOX", "deviceTypeDesc": "AI_BOX", "status": "offline", "lastDataTime": null, "lastHeartTime": null, "cumulativeWorkingTime": null, "cumulativeWorkingTimeStr": null, "availability": null, "nodes": [] }, { "nodeType": "DEVICE", "id": "1597804249475387404", "name": "VTT3Wmianyang013", "deviceType": "AI_BOX", "deviceTypeDesc": "AI_BOX", "status": "offline", "lastDataTime": null, "lastHeartTime": null, "cumulativeWorkingTime": null, "cumulativeWorkingTimeStr": null, "availability": null, "nodes": [] }, { "nodeType": "DEVICE", "id": "1597804249475387405", "name": "VTT3Wmianyang014", "deviceType": "AI_BOX", "deviceTypeDesc": "AI_BOX", "status": "offline", "lastDataTime": null, "lastHeartTime": null, "cumulativeWorkingTime": null, "cumulativeWorkingTimeStr": null, "availability": null, "nodes": [] }, { "nodeType": "DEVICE", "id": "1597804249475387406", "name": "VTT3Wmianyang015", "deviceType": "AI_BOX", "deviceTypeDesc": "AI_BOX", "status": "offline", "lastDataTime": null, "lastHeartTime": null, "cumulativeWorkingTime": null, "cumulativeWorkingTimeStr": null, "availability": null, "nodes": [] }, { "nodeType": "DEVICE", "id": "1597804249475387407", "name": "VTT3Wmianyang016", "deviceType": "AI_BOX", "deviceTypeDesc": "AI_BOX", "status": "offline", "lastDataTime": null, "lastHeartTime": null, "cumulativeWorkingTime": null, "cumulativeWorkingTimeStr": null, "availability": null, "nodes": [] }, { "nodeType": "DEVICE", "id": "1597804249475387408", "name": "VTT3Wmianyang017", "deviceType": "AI_BOX", "deviceTypeDesc": "AI_BOX", "status": "offline", "lastDataTime": null, "lastHeartTime": null, "cumulativeWorkingTime": null, "cumulativeWorkingTimeStr": null, "availability": null, "nodes": [] }, { "nodeType": "DEVICE", "id": "1597804249475387409", "name": "VTT3Wmianyang018", "deviceType": "AI_BOX", "deviceTypeDesc": "AI_BOX", "status": "offline", "lastDataTime": null, "lastHeartTime": null, "cumulativeWorkingTime": null, "cumulativeWorkingTimeStr": null, "availability": null, "nodes": [] }, { "nodeType": "DEVICE", "id": "1597804249475387410", "name": "VTT3Wmianyang019", "deviceType": "AI_BOX", "deviceTypeDesc": "AI_BOX", "status": "offline", "lastDataTime": null, "lastHeartTime": null, "cumulativeWorkingTime": null, "cumulativeWorkingTimeStr": null, "availability": null, "nodes": [] }, { "nodeType": "DEVICE", "id": "1597804249475387411", "name": "VTT3Wmianyang020", "deviceType": "AI_BOX", "deviceTypeDesc": "AI_BOX", "status": "offline", "lastDataTime": null, "lastHeartTime": null, "cumulativeWorkingTime": null, "cumulativeWorkingTimeStr": null, "availability": null, "nodes": [] }, { "nodeType": "DEVICE", "id": "1597804249475387412", "name": "VTT3Wmianyang021", "deviceType": "AI_BOX", "deviceTypeDesc": "AI_BOX", "status": "offline", "lastDataTime": null, "lastHeartTime": null, "cumulativeWorkingTime": null, "cumulativeWorkingTimeStr": null, "availability": null, "nodes": [] }, { "nodeType": "DEVICE", "id": "1597804249475387413", "name": "VTT3Wmianyang022", "deviceType": "AI_BOX", "deviceTypeDesc": "AI_BOX", "status": "offline", "lastDataTime": null, "lastHeartTime": null, "cumulativeWorkingTime": null, "cumulativeWorkingTimeStr": null, "availability": null, "nodes": [] }, { "nodeType": "DEVICE", "id": "1597804249475387414", "name": "VTT3Wmianyang023", "deviceType": "AI_BOX", "deviceTypeDesc": "AI_BOX", "status": "offline", "lastDataTime": null, "lastHeartTime": null, "cumulativeWorkingTime": null, "cumulativeWorkingTimeStr": null, "availability": null, "nodes": [] }, { "nodeType": "DEVICE", "id": "1597804249475387415", "name": "VTT3Wmianyang024", "deviceType": "AI_BOX", "deviceTypeDesc": "AI_BOX", "status": "offline", "lastDataTime": null, "lastHeartTime": null, "cumulativeWorkingTime": null, "cumulativeWorkingTimeStr": null, "availability": null, "nodes": [] }, { "nodeType": "DEVICE", "id": "1597804249475387416", "name": "VTT3Wmianyang025", "deviceType": "AI_BOX", "deviceTypeDesc": "AI_BOX", "status": "offline", "lastDataTime": null, "lastHeartTime": null, "cumulativeWorkingTime": null, "cumulativeWorkingTimeStr": null, "availability": null, "nodes": [] }, { "nodeType": "DEVICE", "id": "1597804249475387417", "name": "VTT3Wmianyang026", "deviceType": "AI_BOX", "deviceTypeDesc": "AI_BOX", "status": "offline", "lastDataTime": null, "lastHeartTime": null, "cumulativeWorkingTime": null, "cumulativeWorkingTimeStr": null, "availability": null, "nodes": [] }, { "nodeType": "DEVICE", "id": "1597804249475387418", "name": "VTT3Wmianyang027", "deviceType": "AI_BOX", "deviceTypeDesc": "AI_BOX", "status": "offline", "lastDataTime": null, "lastHeartTime": null, "cumulativeWorkingTime": null, "cumulativeWorkingTimeStr": null, "availability": null, "nodes": [] }, { "nodeType": "DEVICE", "id": "1597804249475387419", "name": "VTT3Wmianyang028", "deviceType": "AI_BOX", "deviceTypeDesc": "AI_BOX", "status": "offline", "lastDataTime": null, "lastHeartTime": null, "cumulativeWorkingTime": null, "cumulativeWorkingTimeStr": null, "availability": null, "nodes": [] }, { "nodeType": "DEVICE", "id": "1597804249475387420", "name": "VTT3Wmianyang029", "deviceType": "AI_BOX", "deviceTypeDesc": "AI_BOX", "status": "offline", "lastDataTime": null, "lastHeartTime": null, "cumulativeWorkingTime": null, "cumulativeWorkingTimeStr": null, "availability": null, "nodes": [] }, { "nodeType": "DEVICE", "id": "1597804249475387421", "name": "VTT3Wmianyang030", "deviceType": "AI_BOX", "deviceTypeDesc": "AI_BOX", "status": "offline", "lastDataTime": null, "lastHeartTime": null, "cumulativeWorkingTime": null, "cumulativeWorkingTimeStr": null, "availability": null, "nodes": [] }, { "nodeType": "DEVICE", "id": "1597804249475387422", "name": "VTT3Wmianyang032", "deviceType": "AI_BOX", "deviceTypeDesc": "AI_BOX", "status": "offline", "lastDataTime": null, "lastHeartTime": null, "cumulativeWorkingTime": null, "cumulativeWorkingTimeStr": null, "availability": null, "nodes": [] }, { "nodeType": "DEVICE", "id": "1597804249475387423", "name": "VTT3Wmianyang033", "deviceType": "AI_BOX", "deviceTypeDesc": "AI_BOX", "status": "offline", "lastDataTime": null, "lastHeartTime": null, "cumulativeWorkingTime": null, "cumulativeWorkingTimeStr": null, "availability": null, "nodes": [] }, { "nodeType": "DEVICE", "id": "1597804249475387424", "name": "VTT3Wmianyang034", "deviceType": "AI_BOX", "deviceTypeDesc": "AI_BOX", "status": "offline", "lastDataTime": null, "lastHeartTime": null, "cumulativeWorkingTime": null, "cumulativeWorkingTimeStr": null, "availability": null, "nodes": [] }, { "nodeType": "DEVICE", "id": "1597804249479581697", "name": "VTT3Wmianyang035", "deviceType": "AI_BOX", "deviceTypeDesc": "AI_BOX", "status": "offline", "lastDataTime": null, "lastHeartTime": null, "cumulativeWorkingTime": null, "cumulativeWorkingTimeStr": null, "availability": null, "nodes": [] }, { "nodeType": "DEVICE", "id": "1597804249479581698", "name": "VTT3Wmianyang036", "deviceType": "AI_BOX", "deviceTypeDesc": "AI_BOX", "status": "offline", "lastDataTime": null, "lastHeartTime": null, "cumulativeWorkingTime": null, "cumulativeWorkingTimeStr": null, "availability": null, "nodes": [] }, { "nodeType": "DEVICE", "id": "1597804249479581699", "name": "VTT3Wmianyang038", "deviceType": "AI_BOX", "deviceTypeDesc": "AI_BOX", "status": "offline", "lastDataTime": null, "lastHeartTime": null, "cumulativeWorkingTime": null, "cumulativeWorkingTimeStr": null, "availability": null, "nodes": [] }, { "nodeType": "DEVICE", "id": "1597804249479581700", "name": "VTT3Wmianyang039", "deviceType": "AI_BOX", "deviceTypeDesc": "AI_BOX", "status": "offline", "lastDataTime": null, "lastHeartTime": null, "cumulativeWorkingTime": null, "cumulativeWorkingTimeStr": null, "availability": null, "nodes": [] }, { "nodeType": "DEVICE", "id": "1597804249479581701", "name": "VTT3Wmianyang040", "deviceType": "AI_BOX", "deviceTypeDesc": "AI_BOX", "status": "offline", "lastDataTime": null, "lastHeartTime": null, "cumulativeWorkingTime": null, "cumulativeWorkingTimeStr": null, "availability": null, "nodes": [] }, { "nodeType": "DEVICE", "id": "1597804249479581702", "name": "VTT3Wmianyang041", "deviceType": "AI_BOX", "deviceTypeDesc": "AI_BOX", "status": "offline", "lastDataTime": null, "lastHeartTime": null, "cumulativeWorkingTime": null, "cumulativeWorkingTimeStr": null, "availability": null, "nodes": [] }, { "nodeType": "DEVICE", "id": "1597804249479581703", "name": "VTT3Wmianyang042", "deviceType": "AI_BOX", "deviceTypeDesc": "AI_BOX", "status": "offline", "lastDataTime": null, "lastHeartTime": null, "cumulativeWorkingTime": null, "cumulativeWorkingTimeStr": null, "availability": null, "nodes": [] }, { "nodeType": "DEVICE", "id": "1597804249479581704", "name": "VTT3Wmianyang043", "deviceType": "AI_BOX", "deviceTypeDesc": "AI_BOX", "status": "offline", "lastDataTime": null, "lastHeartTime": null, "cumulativeWorkingTime": null, "cumulativeWorkingTimeStr": null, "availability": null, "nodes": [] }, { "nodeType": "DEVICE", "id": "1597804249479581705", "name": "VTT3Wmianyang044", "deviceType": "AI_BOX", "deviceTypeDesc": "AI_BOX", "status": "offline", "lastDataTime": null, "lastHeartTime": null, "cumulativeWorkingTime": null, "cumulativeWorkingTimeStr": null, "availability": null, "nodes": [] }, { "nodeType": "DEVICE", "id": "1597804249479581706", "name": "VTT3Wmianyang0045", "deviceType": "AI_BOX", "deviceTypeDesc": "AI_BOX", "status": "offline", "lastDataTime": null, "lastHeartTime": null, "cumulativeWorkingTime": null, "cumulativeWorkingTimeStr": null, "availability": null, "nodes": [] }, { "nodeType": "DEVICE", "id": "1597804249479581707", "name": "VTT3Wmianyang046", "deviceType": "AI_BOX", "deviceTypeDesc": "AI_BOX", "status": "offline", "lastDataTime": null, "lastHeartTime": null, "cumulativeWorkingTime": null, "cumulativeWorkingTimeStr": null, "availability": null, "nodes": [] }, { "nodeType": "DEVICE", "id": "1597804249479581708", "name": "VTT3Wmianyang047", "deviceType": "AI_BOX", "deviceTypeDesc": "AI_BOX", "status": "offline", "lastDataTime": null, "lastHeartTime": null, "cumulativeWorkingTime": null, "cumulativeWorkingTimeStr": null, "availability": null, "nodes": [] }, { "nodeType": "DEVICE", "id": "1597804249479581709", "name": "VTT3Wmianyang048", "deviceType": "AI_BOX", "deviceTypeDesc": "AI_BOX", "status": "offline", "lastDataTime": null, "lastHeartTime": null, "cumulativeWorkingTime": null, "cumulativeWorkingTimeStr": null, "availability": null, "nodes": [] }, { "nodeType": "DEVICE", "id": "1597804249479581710", "name": "VTT3Wmianyang049", "deviceType": "AI_BOX", "deviceTypeDesc": "AI_BOX", "status": "offline", "lastDataTime": null, "lastHeartTime": null, "cumulativeWorkingTime": null, "cumulativeWorkingTimeStr": null, "availability": null, "nodes": [] }, { "nodeType": "DEVICE", "id": "1597804249479581711", "name": "VTT3Wmianyang050", "deviceType": "AI_BOX", "deviceTypeDesc": "AI_BOX", "status": "offline", "lastDataTime": null, "lastHeartTime": null, "cumulativeWorkingTime": null, "cumulativeWorkingTimeStr": null, "availability": null, "nodes": [] }, { "nodeType": "DEVICE", "id": "1597804249479581712", "name": "VTT3Wmianyang051", "deviceType": "AI_BOX", "deviceTypeDesc": "AI_BOX", "status": "offline", "lastDataTime": null, "lastHeartTime": null, "cumulativeWorkingTime": null, "cumulativeWorkingTimeStr": null, "availability": null, "nodes": [] }, { "nodeType": "CAMERA", "id": "49605d6f388944808c4fb3101147f424", "name": "万科中粮本案1号点屋外摄像头", "deviceType": null, "deviceTypeDesc": null, "status": "online", "lastDataTime": null, "lastHeartTime": null, "cumulativeWorkingTime": null, "cumulativeWorkingTimeStr": null, "availability": null, "nodes": [] }, { "nodeType": "CAMERA", "id": "1", "name": "万科中粮本案1号点屋后摄像头", "deviceType": null, "deviceTypeDesc": null, "status": "online", "lastDataTime": null, "lastHeartTime": null, "cumulativeWorkingTime": null, "cumulativeWorkingTimeStr": null, "availability": null, "nodes": [] }, { "nodeType": "CAMERA", "id": "2", "name": "万科中粮本案1号点屋顶摄像头", "deviceType": null, "deviceTypeDesc": null, "status": "online", "lastDataTime": null, "lastHeartTime": null, "cumulativeWorkingTime": null, "cumulativeWorkingTimeStr": null, "availability": null, "nodes": [] }, { "nodeType": "CAMERA", "id": "", "name": "万科中粮本案1号点屋外对讲", "deviceType": null, "deviceTypeDesc": null, "status": "online", "lastDataTime": null, "lastHeartTime": null, "cumulativeWorkingTime": null, "cumulativeWorkingTimeStr": null, "availability": null, "nodes": [] }] }
var SBZJ = function SBZJ(_ref) {
  var _ref$classPrefix = _ref.classPrefix,
    classPrefix = _ref$classPrefix === void 0 ? '' : _ref$classPrefix;
  window.console.log(classPrefix);
  // const prefix = `${classPrefix}-sbzj`;
  // const myRef = useRef();
  // const [height, setHeight] = useState(200);
  // const [width, setWidth] = useState(800);
  // const Topology = forwardRef((props, ref:any) => {
  //     if (runStatusTopology?.nodes?.length) {
  //         return (
  //             <div className={`${prefix}-canvas`}>
  //                 <div
  //                     id="zrender"
  //                     style={{ height: `${height}px`, width: `${width}px` }}
  //                     ref={ref}
  //                     className={`${prefix}-device`}
  //                 ></div>
  //             </div>
  //         );
  //     } else {
  //         return (
  //             <div ref={ref} className={`${prefix}-disconnect`}>
  //                 <img
  //                     src={require('../../imgs/disconnect.png')}
  //                     style={{ width: '400px', height: '212px' }}
  //                 />
  //                 <div>主机连接已断开，现场情况未知</div>
  //             </div>
  //         );
  //     }
  // });
  // const line = ([x1 = 0, y1 = 0, x2 = 0, y2 = 0, color = '#52c41a']) => {
  //     let textX = Math.abs((x2 - x1) / 2) + Math.min(x2, x1);
  //     let textY = Math.abs((y2 - y1) / 2) + Math.min(y2, y1);
  //     let t = new zrender.Image({
  //         style: {
  //             image: require('../../imgs/error.png'),
  //             width: 16,
  //             height: 16,
  //             x: textX - 8,
  //             y: textY - 8,
  //         },
  //     });
  //     let line = new zrender.Line({
  //         shape: {
  //             x1: x1,
  //             y1: y1,
  //             x2: x1,
  //             y2: y1,
  //         },
  //         style: {
  //             opacity: 0,
  //             stroke: '#fff',
  //             lineDash: 'dashed',
  //             lineWidth: 2,
  //         },
  //     });
  //     let triangle = new zrender.Polygon({
  //         shape: {
  //             points: [
  //                 [x1, y2],
  //                 [x1, y2],
  //                 [x1, y2],
  //             ],
  //         },
  //         style: {
  //             fill: '#fff',
  //             opacity: 0,
  //         },
  //     });
  //     triangle.animateTo(
  //         // 为箭头添加动画
  //         {
  //             shape: {
  //                 points: [
  //                     [x1 - 8, y2],
  //                     [x1 + 8, y2],
  //                     [x1, y2 + 14],
  //                 ],
  //             },
  //             style: {
  //                 fill: color,
  //                 opacity: 1,
  //             },
  //         },
  //         1200,
  //         800,
  //         'case',
  //     );
  //     line.animateTo(
  //         // 为线段添加动画
  //         {
  //             shape: {
  //                 x1,
  //                 y1,
  //                 x2,
  //                 y2,
  //             },
  //             style: {
  //                 stroke: color,
  //                 opacity: 1,
  //             },
  //         },
  //         1200,
  //         100,
  //         'cubicOut',
  //     );
  //     return [line, triangle, t];
  // };
  // const group = ([x = 0, y = 0, url = '', text = '', type = 'asc']) => {
  //     // 文字排列顺序
  //     const g = new zrender.Group();
  //     g.position[0] = x;
  //     g.position[1] = y;
  //     let length = text.length;
  //     let a = length > 8 && length < 16 ? `${text.substring(0, 8)}\n${text.substring(8, length)}` : length > 15 ? `${text.substring(0, 8)}\n${text.substring(8, 16)}\n${text.substring(16, length)}` : text;
  //     let t = new zrender.Text({
  //         style: {
  //             text: a,
  //             fill: '#fff',
  //             fontWidth: 300,
  //             fontSize: 12,
  //             y: type === 'asc' ? 105 : 0,
  //             textAlign: 'center',
  //             textRotation: 90,
  //         },
  //     });
  //     let img = new zrender.Image({
  //         style: {
  //             image: url,
  //             width: 100,
  //             height: 100,
  //             y: type === 'asc' ? 0 : 30,
  //         },
  //     });
  //     t.animateTo(
  //         {
  //             style: {
  //                 fontSize: 18,
  //                 textShadowColor: '#fff',
  //                 textShadowBlur: 1,
  //             },
  //         },
  //         800,
  //         100,
  //         'cubicOut',
  //     );
  //     g.add(img);
  //     g.add(t);
  //     return g;
  // };
  // const imgType = (item = { nodeType: '', deviceType: '' }) => {
  //     if (item.nodeType === 'DEVICE') {
  //         switch (item.deviceType) {
  //             case 'SHUTTER_DOOR':
  //                 return require('../../imgs/window.png');
  //             case 'AI_BOX':
  //                 return require('../../imgs/getwayBox.png');
  //             case 'LIGHT':
  //                 return require('../../imgs/lamp.png');
  //             case 'ANDROID_SCREEN':
  //                 return require('../../imgs/screen.png');
  //             case 'CAMERA':
  //                 return require('../../imgs/camera.png');
  //             case 'DDP':
  //                 return require('../../imgs/screen.png');
  //             default:
  //                 break;
  //         }
  //     } else {
  //         switch (item.nodeType) {
  //             case 'CAMERA':
  //                 return require('../../imgs/camera.png');
  //             case 'GATEWAY':
  //                 return require('../../imgs/getway.png');
  //             case 'MAIN_GATEWAY_AI_BOX':
  //                 return require('../../imgs/getwayBox.png');
  //             case 'ANDROID_SCREEN':
  //                 return require('../../imgs/screen.png');
  //             default:
  //                 break;
  //         }
  //     }
  // };
  // const drawTopology = (startX = 0, y = 0, arr:any, zr:any, count = 0, w = 0) => {
  //     arr?.map((v:any, i) => {
  //         let averageX = arr.length % 2 ? arr.length - 1 || 1 : arr.length;
  //         let color = v.status === 'online' ? '#52c41a' : '#ff4d4f';
  //         let x = (w - 100) / averageX; // 算出x轴的平均坐标 ( width - 两边图片一半的宽度)
  //         let beforeNodesLength = 0;
  //         let lineI = i;
  //         for (let j = 0; j < i; j++) {
  //             beforeNodesLength += arr[j]?.nodes.length || 1;
  //         }
  //         if (v.level < 2) {
  //             //需要算出底层子节点的个数
  //             lineI = i && (beforeNodesLength || i);
  //         } else {
  //             //下一层直接用父级传过来的参数沿用即可
  //             lineI = count ? count + i : i;
  //         }
  //         let lineX = x * lineI + 50; // +50是是因为图片宽度为100 线段要指在图片中间
  //         zr.add(line([startX, y, lineX, y, color])[0]); // 添加每个元素x轴的线段
  //         let yLine = line([lineX, y, lineX, y + 30, color]); // +30 y轴线段的长度
  //         zr.add(yLine[0]); // 添加每个元素y轴的线段
  //         zr.add(yLine[1]); // 添加每个元素y轴的箭头
  //         if (v.status !== 'online') {
  //             zr.add(yLine[2]);
  //         }
  //         zr.add(
  //             group([
  //                 x * lineI,
  //                 y + 50,
  //                 imgType(v),
  //                 `${v.nodeType === 'DEVICE' ? `${v.deviceTypeDesc}` : ''}${v.name}`,
  //             ]),
  //         ); //  + 50： 稍微与线段箭头隔开一点
  //         if (v.nodes?.length) {
  //             let c = v.nodes.some((e:any) => e.status === 'online') ? '#52c41a' : '#ff4d4f';
  //             zr.add(line([lineX, y + 180, lineX, y + 210, c])[0]); //  为每个有子节点的画上y轴坐标  +180 ：50为起始的y坐标 再+图片和文字的高度130
  //             drawTopology(lineX, y + 210, v.nodes, zr, beforeNodesLength, w);
  //         }
  //     });
  // };
  // const getMaxlevel = (treeData:any) => {
  //     let maxLevel = 1;
  //     let count:any = {}; //记录每个层级及下一层总共的个数
  //     const loop = (data:any, level:any) => {
  //         if (!count[`maxCount${level}`]) {
  //             count[`maxCount${level}`] = 0;
  //         }
  //         data.forEach((item:any) => {
  //             count[`maxCount${level}`] += item.nodes.length || 1;
  //             item.level = level;
  //             if (level > maxLevel) {
  //                 maxLevel = level;
  //             }
  //             if ('nodes' in item) {
  //                 if (item.nodes.length > 0) {
  //                     loop(item.nodes, level + 1);
  //                 }
  //             }
  //         });
  //     };
  //     loop(treeData, 1);
  //     return Promise.resolve({ maxLevel, count });
  // };
  // useEffect(() => {
  //     if (runStatusTopology?.nodes?.length) {
  //         getMaxlevel(runStatusTopology?.nodes).then((res:any) => {
  //             let maxCount = 0;
  //             for (let i in res.count) {
  //                 maxCount = Math.max(res.count[i], maxCount);
  //             }
  //             let w = 800;
  //             setHeight(200 + res.maxLevel * 200);
  //             if (maxCount > 4) {
  //                 w = maxCount * 150;
  //                 setWidth(maxCount * 150);
  //             }
  //             const zr = zrender.init(myRef.current);
  //             zr.add(
  //                 group([
  //                     w / 2 - 50, // 宽度/2减去图片的一边 居中
  //                     0,
  //                     require('../../imgs/throwPoint.png'),
  //                     runStatusTopology.name,
  //                     'desc',
  //                 ]),
  //             );
  //             let color = runStatusTopology?.nodes.some(e => e.status === 'online')
  //                 ? '#52c41a'
  //                 : '#ff4d4f';
  //             zr.add(line([w / 2, 110, w / 2, 140, color])[0]);
  //             drawTopology(w / 2, 140, runStatusTopology?.nodes, zr, 0, w);
  //         });
  //     }
  // }, []);
  // return (
  //     <div className={prefix}>
  //         <Topology ref={myRef}></Topology>
  //     </div>
  // );
};
var _default = SBZJ;
exports["default"] = _default;
//# sourceMappingURL=index.js.map
