linkmore-design/es/complex-filter/components/Complex/index.js

🌈 🚀lm组件库。🚀

import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
import cn from 'classnames';
import React, { useMemo, useState } from 'react';
import IconFont from "../../../icon-font";
import PopDropdown from "../../controls/PopDropDown";
import ComplexRender from "./ComplexRender";
var LmFilterComplex = function LmFilterComplex(_ref) {
  var _state$complexFilter4;
  var instance = _ref.instance;
  var state = instance.state,
    size = instance.size,
    locale = instance.locale;
  var _useState = useState(false),
    _useState2 = _slicedToArray(_useState, 2),
    visible = _useState2[0],
    setVisible = _useState2[1];
  var active = useMemo(function () {
    var _state$complexFilter, _state$complexFilter$;
    return (_state$complexFilter = state.complexFilter) === null || _state$complexFilter === void 0 ? void 0 : (_state$complexFilter$ = _state$complexFilter.data) === null || _state$complexFilter$ === void 0 ? void 0 : _state$complexFilter$.some(function (v) {
      var _Object$values;
      return !!((_Object$values = Object.values(v)) !== null && _Object$values !== void 0 && _Object$values.filter(Boolean).length);
    });
  }, [state.complexFilter]);

  // 查询的数量
  var queryCount = useMemo(function () {
    var _state$complexFilter2, _state$complexFilter3;
    return (_state$complexFilter2 = state.complexFilter) === null || _state$complexFilter2 === void 0 ? void 0 : (_state$complexFilter3 = _state$complexFilter2.data) === null || _state$complexFilter3 === void 0 ? void 0 : _state$complexFilter3.filter(function (v) {
      var _Object$values2;
      return !!((_Object$values2 = Object.values(v)) !== null && _Object$values2 !== void 0 && _Object$values2.filter(Boolean).length);
    }).length;
  }, [(_state$complexFilter4 = state.complexFilter) === null || _state$complexFilter4 === void 0 ? void 0 : _state$complexFilter4.data]);
  var cancel = function cancel() {
    setVisible(false);
  };
  var dropdownRender = function dropdownRender() {
    return /*#__PURE__*/React.createElement(ComplexRender, {
      instance: instance,
      title: locale.complex,
      onCancel: cancel
    });
  };
  return /*#__PURE__*/React.createElement(PopDropdown, {
    open: visible,
    onOpenChange: setVisible,
    dropdownRender: dropdownRender
  }, /*#__PURE__*/React.createElement("div", {
    className: cn('lm_filter_basic_item lm_filter_complex_item', size, {
      expand: visible,
      active: active
    })
  }, /*#__PURE__*/React.createElement("div", {
    className: "filter_item_icon addon_before"
  }, /*#__PURE__*/React.createElement(IconFont, {
    type: "icon-a-tongyonga5shaixuan"
  })), /*#__PURE__*/React.createElement("div", {
    className: "filter_item_label"
  }, locale.complex, !!queryCount && "(".concat(queryCount, ")"))));
};
export default LmFilterComplex;