qt-public-ui/lib/Retention/index.js

新设计规范下业务组件库

"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
var _typeof = require("@babel/runtime/helpers/typeof");
Object.defineProperty(exports, "__esModule", {
  value: true
});
exports["default"] = void 0;
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
var _react = _interopRequireWildcard(require("react"));
var _ = require("..");
var _classnames = _interopRequireDefault(require("classnames"));
var _utils = require("../utils");
require("./style.less");
var _excluded = ["extraCols", "dataSource", "data", "timeUnit", "type", "onCellClick", "className", "isGroup"];
/* eslint-disable no-param-reassign */
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { "default": e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n["default"] = e, t && t.set(e, n), n; }
var unitDisplayText = {
  day: '天',
  week: '周',
  month: '月'
};
var getColorClassName = function getColorClassName(value) {
  if (isNaN(value)) {
    return 'td-color-empty';
  }
  var cls;
  if (value > 80) {
    cls = 'td-color-1';
  } else if (value > 60) {
    cls = 'td-color-2';
  } else if (value > 40) {
    cls = 'td-color-3';
  } else if (value > 20) {
    cls = 'td-color-4';
  } else if (value >= 0) {
    cls = 'td-color-5';
  }
  return cls;
};
var VALUES = {
  day: [1, 2, 3, 4, 5, 6, 7, 14, 30],
  week: [1, 2, 3, 4, 5, 6, 7, 8, 9],
  month: [1, 2, 3, 4, 5, 6, 7, 8, 9]
};
var Retention = function Retention(props) {
  var _props$extraCols = props.extraCols,
    extraCols = _props$extraCols === void 0 ? [] : _props$extraCols,
    dataSource = props.dataSource,
    data = props.data,
    _props$timeUnit = props.timeUnit,
    timeUnit = _props$timeUnit === void 0 ? 'day' : _props$timeUnit,
    _props$type = props.type,
    type = _props$type === void 0 ? 'value' : _props$type,
    onCellClick = props.onCellClick,
    className = props.className,
    _props$isGroup = props.isGroup,
    isGroup = _props$isGroup === void 0 ? false : _props$isGroup,
    tableProps = (0, _objectWithoutProperties2["default"])(props, _excluded);
  var _useState = (0, _react.useState)([]),
    _useState2 = (0, _slicedToArray2["default"])(_useState, 2),
    columns = _useState2[0],
    setColumns = _useState2[1];
  var renderRate = function renderRate(index, value, record) {
    var rate = record["rate_".concat(index)];
    return /*#__PURE__*/_react["default"].createElement("div", {
      className: "numbe ".concat(isGroup && type === 'value' && value > 0 ? 'group' : '', " ").concat(getColorClassName(rate))
    }, (0, _utils.formatValue)(type === 'rate' ? 'decimal_percent' : 'number', '')(value));
  };
  (0, _react.useEffect)(function () {
    setColumns([].concat((0, _toConsumableArray2["default"])(extraCols), (0, _toConsumableArray2["default"])(VALUES[timeUnit].map(function (v) {
      return {
        title: "".concat(v).concat(unitDisplayText[timeUnit], "\u540E"),
        dataIndex: "".concat(type, "_").concat(v),
        align: 'right',
        render: renderRate.bind(null, v)
      };
    }))).map(function (col) {
      col.onCell = function (record, index) {
        return {
          onClick: function onClick(e) {
            onCellClick && onCellClick(record, col, index, e);
          }
        };
      };
      return col;
    }));
  }, [extraCols, onCellClick, timeUnit, type]);
  return /*#__PURE__*/_react["default"].createElement(_.Table, (0, _extends2["default"])({
    className: (0, _classnames["default"])('umui-retention-table', className),
    collapsed: true,
    dataSource: dataSource || data || [],
    columns: columns
  }, tableProps));
};
Retention.displayName = 'Retention';
var _default = exports["default"] = Retention;