shineout/es/Table/Sorter.js

Shein 前端组件库

import _inheritsLoose from "@babel/runtime/helpers/inheritsLoose";
import _assertThisInitialized from "@babel/runtime/helpers/assertThisInitialized";
import React, { PureComponent } from 'react';
import { tableClass } from './styles';

var Sorter =
/*#__PURE__*/
function (_PureComponent) {
  _inheritsLoose(Sorter, _PureComponent);

  function Sorter(props) {
    var _this;

    _this = _PureComponent.call(this, props) || this;
    _this.handleAsc = _this.handleAsc.bind(_assertThisInitialized(_assertThisInitialized(_this)));
    _this.handleDesc = _this.handleDesc.bind(_assertThisInitialized(_assertThisInitialized(_this)));
    return _this;
  }

  var _proto = Sorter.prototype;

  _proto.componentDidMount = function componentDidMount() {
    this.defaultSorterOrder();
  };

  _proto.componentDidUpdate = function componentDidUpdate() {
    this.defaultSorterOrder();
  };

  _proto.defaultSorterOrder = function defaultSorterOrder() {
    var _this$props = this.props,
        defaultOrder = _this$props.defaultOrder,
        _this$props$current = _this$props.current,
        current = _this$props$current === void 0 ? [] : _this$props$current,
        keyStr = _this$props.keyStr;
    if (current.length > 1) return;
    var item = current[0] || {};
    var changed = keyStr === item.key && defaultOrder === item.order;
    if (defaultOrder && !changed && !item.manual) this.handleChange(defaultOrder, false);
  };

  _proto.handleChange = function handleChange(order, manual) {
    if (manual === void 0) {
      manual = true;
    }

    var _this$props2 = this.props,
        sorter = _this$props2.sorter,
        keyStr = _this$props2.keyStr,
        onChange = _this$props2.onChange,
        _this$props2$current = _this$props2.current,
        current = _this$props2$current === void 0 ? [] : _this$props2$current;
    var item = current.find(function (v) {
      return v.key === keyStr;
    });
    var isCancel = !!item && order === item.order;
    var finalOrder = isCancel ? undefined : order;
    onChange(finalOrder, sorter, keyStr, order, manual);
  };

  _proto.handleAsc = function handleAsc() {
    this.handleChange('asc');
  };

  _proto.handleDesc = function handleDesc() {
    this.handleChange('desc');
  };

  _proto.render = function render() {
    var _this$props3 = this.props,
        _this$props3$current = _this$props3.current,
        current = _this$props3$current === void 0 ? [] : _this$props3$current,
        keyStr = _this$props3.keyStr,
        renderSorter = _this$props3.renderSorter;
    var item = current.find(function (v) {
      return v.key === keyStr;
    });
    var active = !!item;
    var isCustomRender = renderSorter && typeof renderSorter === 'function';
    return React.createElement("div", {
      className: tableClass('sorter-container')
    }, isCustomRender ? renderSorter({
      status: active ? item.order : undefined,
      triggerAsc: this.handleAsc,
      triggerDesc: this.handleDesc
    }) : React.createElement(React.Fragment, null, React.createElement("a", {
      key: "asc",
      className: tableClass(active && item.order === 'asc' && 'sorter-active', 'sorter-asc'),
      onClick: this.handleAsc
    }, "\xA0"), React.createElement("a", {
      key: "desc",
      className: tableClass(active && item.order === 'desc' && 'sorter-active', 'sorter-desc'),
      onClick: this.handleDesc
    }, "\xA0")));
  };

  return Sorter;
}(PureComponent);

export default Sorter;