"use strict";
Object.defineProperty(exports, "__esModule", {
  value: !0
}), exports.default = void 0;
var _react = _interopRequireWildcard(require("react")),
  _propTypes = _interopRequireDefault(require("prop-types")),
  _amosFramework = require("amos-framework"),
  _amosAntd = require("amos-antd"),
  _urlConsts = require("../../../../consts/urlConsts"),
  _amosIcon = _interopRequireDefault(require("amos-icon")),
  _topoService = require("./../../../../services/topoService");

function _interopRequireDefault(e) {
  return e && e.__esModule ? e : {
    default: e
  }
}

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

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

function _typeof(e) {
  return (_typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function(e) {
    return typeof e
  } : function(e) {
    return e && "function" == typeof Symbol && e.constructor === Symbol && e !== Symbol.prototype ? "symbol" : typeof e
  })(e)
}

function _extends() {
  return (_extends = Object.assign || function(e) {
    for (var t = 1; t < arguments.length; t++) {
      var a, r = arguments[t];
      for (a in r) Object.prototype.hasOwnProperty.call(r, a) && (e[a] = r[a])
    }
    return e
  }).apply(this, arguments)
}

function _classCallCheck(e, t) {
  if (!(e instanceof t)) throw new TypeError("Cannot call a class as a function")
}

function _defineProperties(e, t) {
  for (var a = 0; a < t.length; a++) {
    var r = t[a];
    r.enumerable = r.enumerable || !1, r.configurable = !0, "value" in r && (r.writable = !0), Object.defineProperty(e, r.key, r)
  }
}

function _createClass(e, t, a) {
  return t && _defineProperties(e.prototype, t), a && _defineProperties(e, a), e
}

function _inherits(e, t) {
  if ("function" != typeof t && null !== t) throw new TypeError("Super expression must either be null or a function");
  e.prototype = Object.create(t && t.prototype, {
    constructor: {
      value: e,
      writable: !0,
      configurable: !0
    }
  }), t && _setPrototypeOf(e, t)
}

function _setPrototypeOf(e, t) {
  return (_setPrototypeOf = Object.setPrototypeOf || function(e, t) {
    return e.__proto__ = t, e
  })(e, t)
}

function _createSuper(a) {
  var r = _isNativeReflectConstruct();
  return function() {
    var e, t = _getPrototypeOf(a);
    return _possibleConstructorReturn(this, r ? (e = _getPrototypeOf(this).constructor, Reflect.construct(t, arguments, e)) : t.apply(this, arguments))
  }
}

function _possibleConstructorReturn(e, t) {
  return !t || "object" !== _typeof(t) && "function" != typeof t ? _assertThisInitialized(e) : t
}

function _assertThisInitialized(e) {
  if (void 0 === e) throw new ReferenceError("this hasn't been initialised - super() hasn't been called");
  return e
}

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

function _getPrototypeOf(e) {
  return (_getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function(e) {
    return e.__proto__ || Object.getPrototypeOf(e)
  })(e)
}

function _defineProperty(e, t, a) {
  return t in e ? Object.defineProperty(e, t, {
    value: a,
    enumerable: !0,
    configurable: !0,
    writable: !0
  }) : e[t] = a, e
}
var Panel = _amosFramework.Collapse.Panel,
  HEXSIZE = 1024,
  imgStyle = {
    width: "76px",
    height: "76px"
  },
  ButtonGroup = _amosAntd.Button.Group,
  Option = _amosAntd.Select.Option,
  layoutAttr = [{
    title: "拉伸",
    value: 1
  }, {
    title: "平铺",
    value: 2
  }],
  TopoConfigDefaultPanel = function() {
    _inherits(r, _react.Component);
    var a = _createSuper(r);

    function r(e) {
      var o;
      _classCallCheck(this, r), _defineProperty(_assertThisInitialized(o = a.call(this, e)), "onChangeCollapseSize", function(e) {
        void 0 !== e && void 0 !== e.length && o.setState({
          collapseKey: e
        })
      }), _defineProperty(_assertThisInitialized(o), "onSelectChange", function(e, t) {
        var a = o.props,
          r = a.chooseBackground,
          a = a.subviewInfo,
          n = 1 - (n = o.state.percent) / 100;
        a.imgOpacity = n, a.imgName = t, (0, _topoService.editSubviewAction)(a).then(function(e) {
          r({
            imgName: t,
            percent: n
          })
        })
      }), _defineProperty(_assertThisInitialized(o), "onLayoutChange", function(t) {
        var e = o.props,
          a = e.chooseBackground,
          e = e.subviewInfo;
        e.imgLayout = t, (0, _topoService.editSubviewAction)(e).then(function(e) {
          o.setState({
            imgLayout: t
          }), a({
            layout: t
          })
        })
      }), _defineProperty(_assertThisInitialized(o), "getCollapseHead", function(e, t) {
        var a = o.props.getImgPath(t, o.state.collapseKey),
          t = [];
        return t.push(_react.default.createElement("div", {
          className: "config-collapse-head"
        }, _react.default.createElement("label", {
          className: "config-collapse-text"
        }, e), a)), t
      }), _defineProperty(_assertThisInitialized(o), "getDefaultImg", function() {
        for (var a = [], e = 1; e < 7; e++) ! function(t) {
          var e = "".concat(_urlConsts.OltSerUrl.fetchDeviceImg, "/graph/default_").concat(t, ".png");
          a.push(_react.default.createElement("div", {
            key: t,
            className: "default-img-panel",
            onClick: function(e) {
              return o.onSelectChange(e, "default_".concat(t, ".png"))
            }
          }, _react.default.createElement("img", {
            src: e,
            alt: ""
          })))
        }(e);
        return a
      }), _defineProperty(_assertThisInitialized(o), "getBase64", function(e, t) {
        var a = new FileReader;
        a.addEventListener("load", function() {
          return t(a.result)
        }), a.readAsDataURL(e)
      }), _defineProperty(_assertThisInitialized(o), "updateSubviewName", function(e, t) {
        var a = o.props,
          r = a.updateSubviewName,
          a = a.subviewInfo;
        a.name = t, a.flag = "2", (0, _topoService.editSubviewAction)(a).then(function(e) {
          _amosFramework.message.success("操作成功"), r(t)
        })
      }), _defineProperty(_assertThisInitialized(o), "handleChange", function(e) {
        o.setState({
          file: e.file
        }), "uploading" !== e.file.status ? "done" === e.file.status && (o.getBase64(e.file.originFileObj, function(e) {
          return o.setState({
            imageUrl: e,
            loading: !1
          })
        }), o.imgFile = e.file.originFileObj, o.saveSubGraphImgAction()) : o.setState({
          loading: !0
        })
      }), _defineProperty(_assertThisInitialized(o), "beforeUpload", function(e) {
        var t = /image\/(gif|jpeg|png|jpg|bmp)$/.test(e.type);
        t || _amosFramework.message.danger("请选择符合格式的图片！（gif|jpeg|png|jpg|bmp）");
        e = e.size / HEXSIZE < 500;
        return e || _amosFramework.message.danger("图片最大为 500Kb!"), t && e
      }), _defineProperty(_assertThisInitialized(o), "saveSubGraphImgAction", function() {
        var e = new FileReader;
        e.addEventListener("load", function() {
          return o.upLoadImgToSave(e.result)
        });
        var t = o.imgFile;
        "{}" === JSON.stringify(t) ? o.saveSubGraphImg({
          binaryImg: null,
          imgName: "default.png"
        }) : void 0 !== t ? e.readAsBinaryString(o.imgFile) : _amosFramework.message.danger("请选择要替换的背景图片！")
      }), _defineProperty(_assertThisInitialized(o), "upLoadImgToSave", function(e) {
        e = {
          binaryImg: e,
          imgName: "".concat(o.imgFile.uid, "-").concat(o.imgFile.name)
        };
        o.saveSubGraphImg(e)
      }), _defineProperty(_assertThisInitialized(o), "saveSubGraphImg", function(t) {
        var e = o.props,
          a = e.subviewInfo,
          r = e.updateBkImg;
        _extends(t, {
          id: a.id
        }), (0, _topoService.editSubviewImgAction)(t).then(function(e) {
          _amosFramework.message.success("操作成功"), r(t.imgName), o.handCancel()
        })
      }), _defineProperty(_assertThisInitialized(o), "handCancel", function() {
        o.setState({
          loading: !1,
          file: void 0,
          imageUrl: void 0
        }), o.imgFile = void 0
      }), _defineProperty(_assertThisInitialized(o), "increase", function() {
        var t = o.state.percent + 10;
        100 < t && (t = 100);
        var a = o.props.chooseBackground,
          r = 1 - t / 100,
          e = o.props.subviewInfo;
        e.imgOpacity = r, (0, _topoService.editSubviewAction)(e).then(function(e) {
          a({
            percent: r
          }), o.setState({
            percent: t
          })
        })
      }), _defineProperty(_assertThisInitialized(o), "decline", function() {
        var t = o.state.percent - 10;
        t < 0 && (t = 0);
        var a = o.props.chooseBackground,
          r = 1 - t / 100,
          e = o.props.subviewInfo;
        e.imgOpacity = r, (0, _topoService.editSubviewAction)(e).then(function(e) {
          a({
            percent: r
          }), o.setState({
            percent: t
          })
        })
      });
      var t = e.subviewInfo.imgOpacity,
        e = e.subviewInfo.imgLayout;
      return o.state = {
        collapseKey: ["1", "2"],
        loading: !1,
        file: void 0,
        imageUrl: void 0,
        percent: t ? 100 - 100 * t : 0,
        imgLayout: e || 1
      }, o
    }
    return _createClass(r, [{
      key: "componentWillMount",
      value: function() {}
    }, {
      key: "componentDidMount",
      value: function() {}
    }, {
      key: "componentWillReceiveProps",
      value: function() {}
    }, {
      key: "componentWillUnmount",
      value: function() {}
    }, {
      key: "render",
      value: function() {
        var t = this,
          e = this.state,
          a = e.collapseKey,
          r = e.percent,
          n = e.imgLayout,
          o = this.props.subviewInfo,
          i = o.imgName,
          l = _react.default.createElement("div", {
            className: "upload-icon-panel"
          }, this.state.loading ? _react.default.createElement(_amosIcon.default, {
            type: "loading"
          }) : null !== i && i.includes(".") ? _react.default.createElement("img", {
            src: "".concat(_urlConsts.OltSerUrl.fetchDeviceImg, "/graph/").concat(i),
            alt: "",
            style: imgStyle
          }) : _react.default.createElement("img", {
            src: require("./../../../../assets/iot/topo/background/upload.png"),
            alt: "",
            style: {
              paddingTop: "0px"
            }
          })),
          e = this.state.imageUrl,
          i = _urlConsts.OltSerUrl.addDevice;
        return _react.default.createElement("div", {
          className: "topo-config-default-content-root"
        }, _react.default.createElement(_amosFramework.Collapse, {
          activeKey: a,
          onChange: function(e) {
            return t.onChangeCollapseSize(e)
          }
        }, _react.default.createElement(Panel, {
          showArrow: !1,
          header: this.getCollapseHead("视图信息", "1"),
          key: "1"
        }, _react.default.createElement("div", {
          className: "default-base-info"
        }, _react.default.createElement("div", {
          className: "subview-name"
        }, _react.default.createElement("div", {
          className: "subview-name-title"
        }, "视图名称："), _react.default.createElement("div", {
          className: "subview-name-value",
          title: o.name
        }, _react.default.createElement(_amosFramework.Editable, {
          value: o.name,
          onChange: function(e) {
            return t.updateSubviewName("name", e)
          },
          showOkCancel: !1,
          style: {
            width: "150px",
            marginLeft: "10px"
          },
          innerValueStyle: {
            width: "150px"
          },
          placeholder: "请输入"
        }))), _react.default.createElement("div", {
          className: "subview-num"
        }, _react.default.createElement("div", {
          className: "subview-num-title"
        }, "设备数量："), _react.default.createElement("div", {
          className: "subview-num-value",
          title: o.num
        }, o.num)), _react.default.createElement("div", {
          className: "subview-descr"
        }, _react.default.createElement("div", {
          className: "subview-descr-title"
        }, "说明："), _react.default.createElement("div", {
          className: "subview-descr-value",
          title: ""
        }, "")))), _react.default.createElement(Panel, {
          showArrow: !1,
          header: this.getCollapseHead("画布背景", "2"),
          key: "2"
        }, _react.default.createElement("div", {
          className: "default-background-info"
        }, _react.default.createElement("div", {
          className: "background-color"
        }, _react.default.createElement("div", {
          className: "background-color-title"
        }, "背景颜色："), _react.default.createElement("div", {
          className: "background-color-value"
        }, _react.default.createElement(_amosFramework.ColorPicker, {
          direction: "left",
          align: "left",
          onColorChange: function(e) {
            return t.onSelectChange(e, e.hex)
          }
        }))), _react.default.createElement("div", {
          className: "background-img"
        }, _react.default.createElement("div", {
          className: "background-img-title"
        }, "默认背景："), _react.default.createElement("div", {
          className: "background-img-value"
        }, this.getDefaultImg())), _react.default.createElement("div", {
          className: "background-user-img"
        }, _react.default.createElement("div", {
          className: "background-user-img-title"
        }, _react.default.createElement("div", null, "自定义背景："), _react.default.createElement("div", {
          className: "background-user-img-tip"
        }, "*图片小于500kb")), _react.default.createElement("div", {
          className: "background-user-img-value"
        }, _react.default.createElement(_amosAntd.Upload, {
          name: "avatar",
          listType: "picture-card",
          showUploadList: !1,
          action: i,
          beforeUpload: this.beforeUpload,
          onChange: this.handleChange
        }, e ? _react.default.createElement("img", {
          src: e,
          alt: "",
          style: imgStyle
        }) : l))), _react.default.createElement("div", {
          className: "background-transparency"
        }, _react.default.createElement("div", {
          className: "background-transparency-title"
        }, "透明度："), _react.default.createElement("div", {
          className: "background-transparency-value"
        }, _react.default.createElement(_amosAntd.Progress, {
          percent: r
        }), _react.default.createElement(ButtonGroup, null, _react.default.createElement(_amosAntd.Button, {
          onClick: this.decline,
          icon: "minus"
        }), _react.default.createElement(_amosAntd.Button, {
          onClick: this.increase,
          icon: "plus"
        })))), _react.default.createElement("div", {
          className: "background-layout"
        }, _react.default.createElement("div", {
          className: "background-layout-title"
        }, "背景排布："), _react.default.createElement("div", {
          className: "background-layout-value"
        }, _react.default.createElement(_amosAntd.Select, {
          value: n,
          style: {
            width: 91
          },
          placeholder: "请选择",
          onSelect: function(e) {
            return t.onLayoutChange(e)
          }
        }, layoutAttr.map(function(e) {
          return _react.default.createElement(Option, {
            key: e.value,
            value: e.value
          }, e.title)
        }))))))))
      }
    }]), r
  }();
TopoConfigDefaultPanel.displayName = "TopoConfigDefaultPanel", TopoConfigDefaultPanel.propTypes = {
  getImgPath: _propTypes.default.func,
  subviewInfo: _propTypes.default.object,
  updateSubviewName: _propTypes.default.func,
  updateBkImg: _propTypes.default.func,
  chooseBackground: _propTypes.default.func
};
var _default = TopoConfigDefaultPanel;
exports.default = TopoConfigDefaultPanel, module.exports = exports.default;
