ming-demo3/lib/components/portal/ImportProgressBall.js

mdf metaui web

"use strict";

var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");

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

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

var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));

var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));

var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));

var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));

var _assertThisInitialized2 = _interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));

var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));

var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));

var _isEmpty2 = _interopRequireDefault(require("lodash/isEmpty"));

var _react = _interopRequireWildcard(require("react"));

var _antd = require("antd");

var _redux = require("redux");

var _reactRedux = require("react-redux");

var portalactions = _interopRequireWildcard(require("../../redux/portal"));

var ImportProgressBall = function (_Component) {
  (0, _inherits2["default"])(ImportProgressBall, _Component);

  function ImportProgressBall(props) {
    var _this;

    (0, _classCallCheck2["default"])(this, ImportProgressBall);
    _this = (0, _possibleConstructorReturn2["default"])(this, (0, _getPrototypeOf2["default"])(ImportProgressBall).call(this, props));
    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "formatter", function (percent, successPercent) {
      return _react["default"].createElement("div", {
        className: "ImportProgressBall_Percent"
      }, _react["default"].createElement("span", {
        className: "ImportProgressBall_PercentNum"
      }, percent), _react["default"].createElement("span", {
        className: "ImportProgressBall_Percent100"
      }, "%"));
    });
    return _this;
  }

  (0, _createClass2["default"])(ImportProgressBall, [{
    key: "getContent",
    value: function getContent(asyncImportArr) {
      var totalCount = 0.01;
      var count = 0;
      var content = [];
      Object.values(asyncImportArr).forEach(function (ele) {
        var asyncData = JSON.parse(ele.asyncData);
        totalCount = totalCount + (asyncData.totalCount || 0);
        count = count + (asyncData.count || 0);
        var percentage = ele.percentage || 0;
        content.push(_react["default"].createElement("div", {
          className: "ImportProgressBall_Item"
        }, _react["default"].createElement("div", {
          className: "ImportProgressBall_Progress"
        }, _react["default"].createElement(_antd.Progress, {
          type: "line",
          strokeColor: {
            '100%': '#108ee9',
            '0%': '#87d068'
          },
          percent: percentage,
          showInfo: false,
          status: percentage >= 100 ? "success" : "active"
        })), _react["default"].createElement("div", {
          className: "ImportProgressBall_Info"
        }, "[", _react["default"].createElement("span", {
          className: "ImportProgressBall_Info_busName"
        }, ele.busName), "] ", _react["default"].createElement("span", {
          className: "ImportProgressBall_Info_Finish"
        }, "\u5B8C\u6210"), _react["default"].createElement("span", {
          className: "ImportProgressBall_Info_Rate"
        }, percentage.toFixed(0), "%"))));
      });
      content = _react["default"].createElement("div", {
        className: "ImportProgressBall_Content"
      }, _react["default"].createElement("div", {
        className: "ImportProgressBall_Title"
      }, "\u6B63\u5728\u5BFC\u5165(", Object.keys(asyncImportArr).length, ")"), _react["default"].createElement("div", {
        className: "ImportProgressBall_Items"
      }, content));
      var rate = (count * 100 / totalCount).toFixed(0);
      var obj = {
        content: content,
        rateInfo: {
          rate: rate,
          totalCount: totalCount,
          count: count
        }
      };
      return obj;
    }
  }, {
    key: "render",
    value: function render() {
      var self = this;
      var portal = this.props.portal;
      var asyncImportArr = portal.asyncImportArr;

      if ((0, _isEmpty2["default"])(asyncImportArr)) {
        return null;
      } else {
        var obj = this.getContent(asyncImportArr);
        return _react["default"].createElement("div", {
          className: "ImportProgressBall_Outer",
          id: "ImportProgressBall_OuterID"
        }, _react["default"].createElement("div", {
          className: "ImportProgressBall_Inner"
        }, _react["default"].createElement(_antd.Popover, {
          content: obj.content,
          trigger: "click",
          placement: "left",
          overlayClassName: "ImportProgressBall_Popover",
          getPopupContainer: function getPopupContainer(triggerNode) {
            return document.getElementById('ImportProgressBall_OuterID') || document.body || triggerNode.parentNode;
          }
        }, _react["default"].createElement("div", {
          className: "ImportProgressBall_Rate"
        }, _react["default"].createElement(_antd.Progress, {
          type: "circle",
          strokeColor: {
            '100%': '#108ee9',
            '0%': '#87d068'
          },
          percent: obj.rateInfo.rate,
          format: self.formatter
        })))));
      }
    }
  }]);
  return ImportProgressBall;
}(_react.Component);

function mapStateToProps(state) {
  return {
    portal: state.portal.toJS()
  };
}

function mapDispatchToProps(dispatch) {
  return {
    portalactions: (0, _redux.bindActionCreators)(portalactions, dispatch)
  };
}

var _default = (0, _reactRedux.connect)(mapStateToProps, mapDispatchToProps)(ImportProgressBall);

exports["default"] = _default;
//# sourceMappingURL=ImportProgressBall.js.map