"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault"), _typeof = require("@babel/runtime/helpers/typeof");

Object.defineProperty(exports, "__esModule", {
  value: !0
}), exports.default = void 0;

var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends")), _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray")), _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck")), _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass")), _assertThisInitialized2 = _interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized")), _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits")), _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn")), _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf")), _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty")), _react = _interopRequireWildcard(require("react")), _propTypes = _interopRequireDefault(require("prop-types")), _amosWebsocket = _interopRequireDefault(require("amos-websocket")), _amosAntd = require("amos-antd"), _amosFramework = require("amos-framework"), _amosJsplumb = require("amos-jsplumb"), _rayEventpool = require("ray-eventpool"), _dt2react = require("dt2react"), _amosIcon = _interopRequireDefault(require("amos-icon")), _urlConsts = require("../../../consts/urlConsts"), _request = require("../../../utils//request"), _processor = require("../../../utils//processor"), _TopoStagePlumb = _interopRequireDefault(require("./TopoStagePlumb")), _ConfigPanel = _interopRequireDefault(require("./ConfigPanel")), _DragableCard = _interopRequireDefault(require("./DragableCard")), _ChooseEquipmentPanel = _interopRequireDefault(require("./equipmentChoose/ChooseEquipmentPanel")), _ChooseBackgroundPanel = _interopRequireDefault(require("./uploadPicture/ChooseBackgroundPanel")), _stageConst = require("./modelConf/stageConst");

require("./topo.scss");

var _deviceService = require("./../../../services/deviceService"), _UploadSinglePicModal = _interopRequireDefault(require("./uploadPicture/UploadSinglePicModal")), _TopoConfigPanel = _interopRequireDefault(require("./topoconfig/TopoConfigPanel"));

function _getRequireWildcardCache(e) {
  if ("function" != typeof WeakMap) return null;
  var t = new WeakMap, n = new WeakMap;
  return (_getRequireWildcardCache = function(e) {
    return e ? n : t;
  })(e);
}

function _interopRequireWildcard(e, t) {
  if (!t && e && e.__esModule) return e;
  if (null === e || "object" !== _typeof(e) && "function" != typeof e) return {
    default: e
  };
  var n = _getRequireWildcardCache(t);
  if (n && n.has(e)) return n.get(e);
  var o = {}, r = Object.defineProperty && Object.getOwnPropertyDescriptor;
  for (var i in e) if ("default" !== i && Object.prototype.hasOwnProperty.call(e, i)) {
    var a = r ? Object.getOwnPropertyDescriptor(e, i) : null;
    a && (a.get || a.set) ? Object.defineProperty(o, i, a) : o[i] = e[i];
  }
  return o.default = e, n && n.set(e, o), o;
}

function ownKeys(e, t) {
  var n = Object.keys(e);
  if (Object.getOwnPropertySymbols) {
    var o = Object.getOwnPropertySymbols(e);
    t && (o = o.filter((function(t) {
      return Object.getOwnPropertyDescriptor(e, t).enumerable;
    }))), n.push.apply(n, o);
  }
  return n;
}

function _objectSpread(e) {
  for (var t = 1; t < arguments.length; t++) {
    var n = null != arguments[t] ? arguments[t] : {};
    t % 2 ? ownKeys(Object(n), !0).forEach((function(t) {
      (0, _defineProperty2.default)(e, t, n[t]);
    })) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(n)) : ownKeys(Object(n)).forEach((function(t) {
      Object.defineProperty(e, t, Object.getOwnPropertyDescriptor(n, t));
    }));
  }
  return e;
}

function _createSuper(e) {
  var t = _isNativeReflectConstruct();
  return function() {
    var n, o = (0, _getPrototypeOf2.default)(e);
    if (t) {
      var r = (0, _getPrototypeOf2.default)(this).constructor;
      n = Reflect.construct(o, arguments, r);
    } else n = o.apply(this, arguments);
    return (0, _possibleConstructorReturn2.default)(this, n);
  };
}

function _isNativeReflectConstruct() {
  if ("undefined" == typeof Reflect || !Reflect.construct) return !1;
  if (Reflect.construct.sham) return !1;
  if ("function" == typeof Proxy) return !0;
  try {
    return Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], (function() {}))), 
    !0;
  } catch (e) {
    return !1;
  }
}

var eventListeners = {
  connection: _amosJsplumb.handlers.onConnectionEventHandler,
  endpointClick: _amosJsplumb.handlers.onEndPointClick
}, keyDelete = 46, TopoContent = function(e) {
  (0, _inherits2.default)(n, e);
  var t = _createSuper(n);
  function n(e) {
    var o;
    (0, _classCallCheck2.default)(this, n), o = t.call(this, e), (0, _defineProperty2.default)((0, 
    _assertThisInitialized2.default)(o), "onWindowResize", (function(e) {
      o.getOffset();
    })), (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(o), "onSceneCreated", (function(e) {
      o.jsPlumbInstance = e, o.jsPlumbInstance.bind("connection", (function(e) {
        o.addConnections.push(e.connection), e.connection.bind("click", (function(e) {
          o.selectedConnection = e, e.toggleType("selected");
        }));
      }));
    })), (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(o), "onAddConnection", (function(e, t, n) {
      var r = o.state.connections, i = {
        id: e,
        sourceId: parseInt(t),
        targetId: parseInt(n)
      }, a = !1;
      r.map((function(e) {
        e.sourceId === parseInt(t) && e.targetId === parseInt(n) && (a = !0);
      })), a || o.setState({
        connections: [].concat((0, _toConsumableArray2.default)(o.state.connections), [ i ])
      });
    })), (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(o), "onRemoveConnection", (function(e, t) {
      if (window.confirm("Remove connection '".concat(e, "'?")) && "number" == typeof e) {
        var n = "".concat(_urlConsts.OltSerUrl.deleteLinkById, "/").concat(e);
        _processor.AmosFetch.del(n).then((function(e) {
          if (e.ok) return e.text();
          throw new Error("从服务端获取数据失败！");
        })).then((function(t) {
          o.setState({
            connections: o.state.connections.filter((function(t) {
              return t.id !== e;
            }))
          });
        }));
      }
    })), (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(o), "onRemoveNode", (function(e) {
      var t = o.state.nodes.filter((function(t) {
        return t.id !== e;
      }));
      o.setState({
        nodes: t
      });
    })), (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(o), "deleteLink", (function(e) {
      if (e && e.keyCode === keyDelete) {
        var t = o.selectedConnection;
        if (void 0 === t) return;
        var n, r = o.state.connections, i = [];
        r && r.map((function(e) {
          t.targetId === e.targetId && t.sourceId === e.sourceId ? n = e.id : i.push(e);
        }));
        var a = "".concat(_urlConsts.OltSerUrl.deleteLinkById, "/").concat(n);
        o.jsPlumbInstance.deleteConnection(t), void 0 !== n && _processor.AmosFetch.del(a).then((function(e) {
          if (e.ok) return e.text();
          throw new Error("从服务端获取数据失败！");
        })).then((function(e) {
          o.setState({
            connections: i
          });
        })), o.selectedConnection = void 0;
      }
    })), (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(o), "onPlumbClick", (function(e) {})), 
    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(o), "getSubgraphData", (function(e, t) {
      var n = "".concat(_urlConsts.OltSerUrl.fetchSubgraphInfoById, "/").concat(e);
      _processor.AmosFetch.get(n).then((function(e) {
        if (e.ok) return e.json();
        throw new Error("从服务端获取数据失败！");
      })).then((function(e) {
        if ("SUCCESS" === e.result) {
          var t = e.dataList;
          if (null === t) o.setState({
            connections: [],
            nodes: []
          }); else {
            var n = t.connections, r = t.nodes;
            r.map((function(e) {
              if (e.config = JSON.parse(e.config), void 0 !== e.equipmentId && (e.config.equipmentId = e.equipmentId), 
              void 0 !== e.config.id) {
                var t = [ e.nodeId, e.config.id ];
                e.config.id = t[0], e.nodeId = t[1];
              } else e.config.id = e.nodeId;
              e.config.data && "VFE" === e.config.data.model && (e.config.nodeType = "ninghua");
            })), n.map((function(e) {
              var t = r.filter((function(t) {
                return t.nodeId === e.sourceId;
              }))[0], n = r.filter((function(t) {
                return t.nodeId === e.targetId;
              }))[0];
              e.sourceId = void 0 === t ? e.sourceId : t.id, e.targetId = void 0 === n ? e.targetId : n.id;
            })), o.setState({
              connections: n,
              nodes: r,
              destroy: !1
            }), o.chooseBackground({});
          }
        }
      }));
    })), (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(o), "getOffset", (function() {
      var e = o.topoView, t = (0, _dt2react.getOffset)(e) || {};
      o.setState({
        viewLocation: t
      });
    })), (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(o), "getNeeddata", (function(e) {
      var t = o.state.nodes;
      console.log("nodes:"), console.log(t);
      var n = !1;
      0 !== t.length && (t.map((function(t) {
        t.config.equipmentId === e.eqpId && (t.config.realTimeData = e, n = !0);
      })), n && o.setState({
        nodes: t
      })), console.log(t);
    })), (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(o), "handleData", (function(e) {
      console.log("我应该是实时数据："), console.log(e), o.getNeeddata(e);
    })), (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(o), "questdeleteNode", (function(e) {
      if (void 0 !== e) {
        var t = o.confirmDeleteAction;
        _amosAntd.Modal.confirm({
          title: "确认删除",
          content: "是否删除所选信息？",
          okText: "确定",
          cancelText: "取消",
          onOk: function() {
            t(e);
          },
          onCancel: function() {}
        });
      }
    })), (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(o), "confirmDeleteAction", (function(e) {
      o.setState({
        hiddenProperty: !0
      });
      var t = o.state, n = t.connections, r = t.nodes, i = [];
      r.map((function(t) {
        t.nodeId === e ? o.deleteNodeById(t.id, t.equipmentId) : i.push(t);
      }));
      var a = [], s = [];
      n.map((function(t) {
        t.sourceId !== e && t.targetId !== e ? a.push(t) : void 0 !== t.id && s.push(t.id);
      })), o.deleteConnectionById(s), o.setState({
        connections: a,
        nodes: i
      });
    })), (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(o), "deleteNodeById", (function(e, t) {
      o.setState({
        destroy: !0
      });
      var n = "".concat(_urlConsts.OltSerUrl.deleteNodeById, "/").concat(e);
      _processor.AmosFetch.del(n).then((function(e) {
        if (e.ok) return e.text();
        throw new Error("从服务端获取数据失败！");
      })).then((function(n) {
        var r = o.state, i = r.daviceList, a = r.useList, s = [];
        a.map((function(e) {
          e.id === t ? i.push(e) : s.push(e);
        })), o.setState({
          destroy: !1,
          daviceList: i,
          useList: s
        });
        var d = o.jsPlumbInstance;
        o.state.nodes.map((function(t) {
          t.id === e && d.deleteEndpoint(d.getEndpoint("".concat(t.id)));
        }));
      }));
    })), (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(o), "deleteConnectionById", (function(e) {
      if (0 !== e.length) {
        var t = "".concat(_urlConsts.OltSerUrl.deleteConnectionById, "/").concat(e);
        _processor.AmosFetch.del(t).then((function(e) {
          if (e.ok) return e.text();
          throw new Error("从服务端获取数据失败！");
        })).then((function(e) {}));
      }
    })), (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(o), "handleCriterias", (function() {
      var e = arguments.length > 0 && void 0 !== arguments[0] ? arguments[0] : {};
      e.orgCode = o.props.orgCode, (0, _deviceService.fetchTopoEquipmentAction)(e).then((function(e) {
        null !== e ? o.setState({
          daviceList: e.noUseList,
          useList: e.useList
        }) : o.setState({
          daviceList: [],
          useList: []
        });
      }));
    })), (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(o), "startDrag", (function(e, t, n) {
      o.setState({
        dragType: t,
        dragData: n
      });
    })), (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(o), "enableDrag", (function(e) {
      e.preventDefault();
    })), (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(o), "stopDrag", (function(e) {
      var t = o.state, n = (t.viewLocation, t.dragType), r = t.dragData;
      if (0 !== Object.keys(r).length) {
        var i, a = _amosJsplumb.tools.uuid(), s = _amosJsplumb.domTools.getNodeOffset(e), d = (i = n, 
        {
          config: {
            id: a,
            label: r.name,
            type: "giot" === i ? "source" : "both",
            nodeType: i,
            data: r,
            style: s
          }
        });
        o.nodeId = a, d.nodeId = a;
        var u = o.state, c = u.daviceList, l = u.useList, f = d.config.data.id, p = [];
        c.map((function(e) {
          e.id === f ? l.push(e) : p.push(e);
        })), o.setState({
          nodes: [].concat((0, _toConsumableArray2.default)(o.state.nodes), [ d ]),
          dragData: {},
          destroy: !0,
          daviceList: p,
          useList: l
        }), o.saveSubgraphData([].concat((0, _toConsumableArray2.default)(o.state.nodes), [ d ]));
      }
    })), (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(o), "showProperty", (function(e) {
      var t = o.state.nodes;
      o.nodeId = e, t.map((function(t) {
        if (t.nodeId === e) {
          var n = t.equipmentId;
          (0, _deviceService.fetchTopoDeviceAction)(n).then((function(e) {
            o.changePanelWidth(!0), o.setState({
              currentDeviceConfig: e,
              isNodeSelected: !0,
              expandIconRight: "300px"
            });
          }));
        }
      }));
    })), (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(o), "generatePanelByDevice", (function(e) {
      if (void 0 !== e) {
        var t = (0, _dt2react.getOffset)(e), n = (0, _dt2react.getOffset)(o.topoView);
        if (void 0 !== t && void 0 !== n) {
          var r = n.height - 155;
          (0, _dt2react.addStyle)(e, "height", "".concat(r, "px"));
        }
      }
      var i = o.state.daviceList, a = [];
      return void 0 !== i && i.map((function(e) {
        a.push(_react.default.createElement(_DragableCard.default, {
          cardData: e,
          key: e.id,
          startDrag: o.startDrag
        }));
      })), a;
    })), (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(o), "saveSubgraphData", (function(e) {
      o.jsPlumbInstance.getManagedElements();
      var t = o.state, n = t.nodes, r = t.connections;
      n = void 0 === e || void 0 === e.length ? n : e;
      var i = o.props, a = i.subviewId, s = i.currentNode;
      n.map((function(e) {
        if (void 0 !== e.config.id) {
          var t = [ e.nodeId, e.config.id ];
          e.config.id = t[0], e.nodeId = t[1], e.config.realTimeData = void 0;
        }
        e.config = JSON.stringify(e.config);
      })), r.map((function(e) {
        var t = n.filter((function(t) {
          return t.id === parseInt(e.sourceId);
        }))[0], o = n.filter((function(t) {
          return t.id === parseInt(e.targetId);
        }))[0];
        e.sourceId = void 0 === t ? e.sourceId : t.nodeId, e.targetId = void 0 === o ? e.targetId : o.nodeId, 
        e.id = 0;
      }));
      var d = {
        id: a,
        nodes: n,
        connections: r,
        orgCode: s.orgId
      };
      _processor.AmosFetch.post(_urlConsts.OltSerUrl.addSubgraphData, {
        data: d
      }).then((function(e) {
        if (e.ok) return e.text();
        throw new Error("从服务端获取数据失败！");
      })).then((function(t) {
        "SUCCESS" === JSON.parse(t).result ? (void 0 !== e && void 0 !== e.length || _amosFramework.message.success("保存成功！"), 
        o.getSubgraphData(a)) : _amosFramework.message.danger("保存失败！");
      }));
    })), (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(o), "updateNodeConfig", (function(e, t) {
      o.state.nodes.map((function(n) {
        n.nodeId === e && (n.equipmentParam = JSON.stringify(t));
      })), o.saveSubgraphData();
    })), (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(o), "send", (function() {
      var e = {
        subviewId: o.props.subviewId
      };
      o.aws.getWebSocket().send(JSON.stringify(e));
    })), (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(o), "doHiddenProperty", (function(e) {
      o.setState({
        hiddenProperty: !0
      });
    })), (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(o), "exit", (function() {
      o.props.updateView("1", o.props.currentNode);
    })), (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(o), "chooseBackground", (function(e) {
      var t = e.imgName, n = e.percent, r = e.layout, i = o.topoView;
      null == t || null == i || (o.currentImgUrl = t);
      var a = o.currentImgUrl;
      if (a.includes(".")) {
        void 0 !== r && (o.currentImgLayout = r);
        var s = o.currentImgLayout;
        if (1 === s) {
          var d = 'url("'.concat(_urlConsts.OltSerUrl.fetchDeviceImg, "/graph/").concat(a, '") no-repeat');
          (0, _dt2react.addStyle)(i, "background", d), (0, _dt2react.addStyle)(i, "background-size", "100% 100%");
        } else if (2 === s) {
          var u = 'url("'.concat(_urlConsts.OltSerUrl.fetchDeviceImg, "/graph/").concat(a, '")');
          (0, _dt2react.addStyle)(i, "background", u);
        }
      } else (0, _dt2react.addStyle)(i, "background", a);
      void 0 !== n ? ((0, _dt2react.addStyle)(i, "opacity", n), o.currentPercent = n) : (0, 
      _dt2react.addStyle)(i, "opacity", o.currentPercent);
    })), (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(o), "oneOpenOrClose", (function(e) {
      var t = o.props.subviewId, n = "".concat(_urlConsts.OltSerUrl.oneOpenOrClose, "/").concat(t, "/").concat(e);
      _processor.AmosFetch.get(n).then((function(e) {
        if (e.ok) return e.json();
        throw new Error("从服务端获取数据失败！");
      })).then((function(t) {
        "SUCCESS" === t.result && o.setState({
          checked: e
        });
      }));
    })), (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(o), "changePanelWidth", (function(e) {
      e ? o.setState({
        configPanelWith: "calc(100% - 300px)",
        expandIconRight: "300px"
      }) : o.setState({
        configPanelWith: "100%",
        expandIconRight: "0"
      });
    })), (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(o), "changeLeftPanelWidth", (function(e) {
      e ? o.setState({
        devicePanelStyle: "topo-content-stage"
      }) : o.setState({
        devicePanelStyle: "topo-no-left-content-stage"
      });
    })), (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(o), "mapFocus", (function() {
      window.topoNodefocus ? window.topoNodefocus = !1 : o.setState({
        isNodeSelected: !1
      });
    })), (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(o), "onZoom", (function(e) {
      o.setState({
        zoom: e
      });
    })), (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(o), "onDropHandler", (function(e, t, n) {
      var r = o.state.nodes;
      r.forEach((function(o) {
        if (o.id === e) {
          var r = {
            left: t,
            top: n
          };
          o.config.style = r;
        }
      })), o.setState({
        nodes: r
      });
    })), (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(o), "beforeDrop", (function(e) {
      var t = o.jsPlumbInstance;
      e.targetId = e.dropEndpoint.elementId;
      var n = t.getConnections({
        source: e.sourceId,
        target: e.targetId
      });
      if (e.targetId === e.sourceId) _amosFramework.message.danger("不可以自己连接自己"); else {
        if (0 === n.length) return o.setState({
          info: e
        }), !0;
        _amosFramework.message.danger("两个节点之间只能有一条连接");
      }
    })), o.addConnections = [], o.currentImgUrl = o.props.imgName, o.currentPercent = o.props.currentNode.imgOpacity, 
    o.currentImgLayout = o.props.currentNode.imgLayout, o.state = {
      communityOptions: [],
      equiptemplateIndustryOptions: [],
      daviceList: [],
      useList: [],
      dragType: "custom",
      connections: [],
      nodes: [],
      zoom: 1,
      viewLocation: {},
      finalCriterias: [],
      dragData: {},
      checked: o.props.currentNode.enableMonitor,
      hiddenProperty: !0,
      visibility: "0",
      destroy: !1,
      isNodeSelected: !1,
      currentDeviceConfig: {},
      configPanelWith: "calc(100% - 300px)",
      devicePanelStyle: "topo-content-stage",
      expandIconRight: "0"
    };
    var r = (0, _request.getToken)();
    return o.websocketUrl = "".concat(_urlConsts.realTimeMetricWsURL, "equipment-metric.ws?token=").concat(r), 
    o;
  }
  return (0, _createClass2.default)(n, [ {
    key: "componentWillMount",
    value: function() {
      var e = this;
      _processor.AmosFetch.get(_urlConsts.OltSerUrl.communityProtocol).then((function(e) {
        if (e.ok) return e.json();
        throw new Error("从服务端获取数据失败！");
      })).then((function(t) {
        if ("SUCCESS" === t.result) {
          var n = [];
          !t || t.dataList.map((function(e) {
            n.push({
              value: e.id,
              label: e.name,
              selected: !1,
              style: "all-filter-btn"
            });
          })), e.setState({
            communityOptions: n
          });
        }
      })), _processor.AmosFetch.get(_urlConsts.OltSerUrl.equiptemplateIndustry).then((function(e) {
        if (e.ok) return e.json();
        throw new Error("从服务端获取数据失败！");
      })).then((function(t) {
        if ("SUCCESS" === t.result) {
          var n = [];
          !t || t.dataList.map((function(e) {
            n.push({
              value: e.id,
              label: e.name,
              selected: !1,
              style: "all-filter-btn"
            });
          })), e.setState({
            equiptemplateIndustryOptions: n
          });
        }
      }));
    }
  }, {
    key: "componentDidMount",
    value: function() {
      var e = this, t = this.props.subviewId;
      this.handleCriterias(), this.getOffset(), window.addEventListener("resize", this.onWindowResize), 
      this.getSubgraphData(t), this.chooseBackground({}), this.pubsub_eledel = _rayEventpool.PubSub.subscribe(_stageConst.TOPO_ELE_DEL_TOPIC.eleDel, (function(t, n) {
        var o = n.id;
        e.nodeId === o && e.questdeleteNode(o);
      })), this.pubsub_eleshow = _rayEventpool.PubSub.subscribe(_stageConst.TOPO_SHOW_PROPERTY_TOPIC.eleShow, (function(t, n) {
        var o = n.id;
        e.showProperty(o);
      })), this.pubsub_eleSelect = _rayEventpool.PubSub.subscribe(_stageConst.TOPO_ENABLE_CLICK_TOPIC.eleShow, (function(t, n) {
        var o = n.id;
        e.nodeId = o, e.showProperty(o);
      }));
    }
  }, {
    key: "componentWillReceiveProps",
    value: function(e) {
      var t = e.subviewId, n = e.imgName;
      this.jsPlumbInstance.reset(), this.setState({
        destroy: !0,
        hiddenProperty: !0
      }), this.getSubgraphData(t), n !== this.props.imgName && this.chooseBackground({
        imgName: n
      });
    }
  }, {
    key: "componentWillUnmount",
    value: function() {
      window.removeEventListener("resize", this.onWindowResize), _rayEventpool.PubSub.unsubscribe(this.pubsub_eleshow), 
      _rayEventpool.PubSub.unsubscribe(this.pubsub_eledel), _rayEventpool.PubSub.unsubscribe(this.pubsub_eleSelect);
    }
  }, {
    key: "render",
    value: function() {
      var e, t = this, n = this.state, o = n.configPanelWith, r = n.communityOptions, i = n.zoom, a = n.nodes, s = n.connections, d = n.expandIconRight, u = n.equiptemplateIndustryOptions, c = n.destroy, l = n.isNodeSelected, f = n.currentDeviceConfig, p = n.devicePanelStyle, h = this.props, _ = (h.subviewId, 
      h.subviewName), g = h.currentNode, m = (h.imgName, {
        nodes: a,
        connections: s
      }), v = {
        onDrop: this.onDropHandler
      }, y = _objectSpread(_objectSpread({}, eventListeners), {}, {
        beforeDrop: this.beforeDrop
      }), b = this.nodeId, I = g;
      I.title = _, I.num = a.length - 1, void 0 !== a && a.map((function(t) {
        t.nodeId === b && (e = t.equipmentId, t.equipmentParam);
      }));
      var P = b && a.filter((function(e) {
        return e.config.id === b;
      }));
      return P && 1 === P.length && (P = P[0].config), _react.default.createElement("div", {
        className: "topo-content"
      }, _react.default.createElement("div", {
        className: "dispatch-mask",
        ref: function(e) {
          return t.dispatchMask = e;
        }
      }, _react.default.createElement(_amosWebsocket.default, {
        ref: function(e) {
          return t.aws = e;
        },
        url: this.websocketUrl,
        onMessage: this.handleData,
        onOpen: this.send,
        reconnect: !0,
        debug: !0
      })), _react.default.createElement("div", {
        className: "topo-content-view",
        style: {
          width: o
        }
      }, _react.default.createElement(_ChooseEquipmentPanel.default, {
        communityOptions: r,
        handleCriterias: this.handleCriterias,
        generatePanelByDevice: this.generatePanelByDevice,
        equiptemplateIndustryOptions: u,
        changeLeftPanelWidth: this.changeLeftPanelWidth
      }), _react.default.createElement("div", {
        className: "topo-content-header"
      }, _react.default.createElement("label", {
        style: {
          "font-size": "15px"
        }
      }, "●", _), _react.default.createElement("div", {
        className: "edit-view-root"
      }, _react.default.createElement("div", {
        className: "tree-header-extra-item-edit",
        onClick: this.exit,
        title: "退出"
      }, _react.default.createElement("img", {
        src: require("./../../../assets/iot/topo/exit.png"),
        alt: ""
      }))), _react.default.createElement("div", {
        className: "save-view",
        onClick: this.saveSubgraphData,
        title: "保存"
      }, _react.default.createElement("img", {
        src: require("./../../../assets/iot/topo/save.png"),
        alt: ""
      })), _react.default.createElement("div", {
        className: "start-stop-view"
      }, _react.default.createElement(_amosFramework.Switch, {
        onLabel: "启",
        offLabel: "停",
        onOff: this.state.checked,
        onChange: function(e) {
          return t.oneOpenOrClose(e);
        }
      }))), _react.default.createElement("div", {
        style: {
          height: "100%"
        }
      }, _react.default.createElement("div", {
        onDragOver: function(e) {
          return t.enableDrag(e);
        },
        onDrop: function(e) {
          return t.stopDrag(e);
        },
        ref: function(e) {
          return t.topoView = e;
        },
        onKeyDown: this.deleteLink,
        className: p,
        onFocus: this.mapFocus,
        tabIndex: "-1"
      }, _react.default.createElement(_TopoStagePlumb.default, {
        eventListeners: y,
        onPlumbClick: this.onPlumbClick,
        onSceneCreated: this.onSceneCreated,
        zoom: i,
        dataSource: m,
        destroy: c,
        onAddConnection: this.onAddConnection,
        onRemoveConnection: this.onRemoveConnection,
        onRemoveNode: this.onRemoveNode,
        onZoom: this.onZoom,
        nodeProps: v
      })))), _react.default.createElement(_TopoConfigPanel.default, (0, _extends2.default)({
        isNodeSelected: l,
        subviewInfo: I,
        currentDeviceConfig: f,
        config: P,
        equipmentId: e,
        nodeId: b,
        getSubgraphData: this.getSubgraphData,
        showProperty: this.showProperty,
        chooseBackground: this.chooseBackground,
        changePanelWidth: this.changePanelWidth,
        expandIconRight: d
      }, this.props)));
    }
  } ]), n;
}(_react.Component);

TopoContent.displayName = "TopoContent", TopoContent.propTypes = {
  subviewId: _propTypes.default.string,
  subviewName: _propTypes.default.string,
  currentNode: _propTypes.default.object,
  selectedKeys: _propTypes.default.array,
  editTreeData: _propTypes.default.func,
  updateView: _propTypes.default.func,
  imgName: _propTypes.default.string,
  orgCode: _propTypes.default.any
};

var _default = TopoContent;

exports.default = _default;