/**
 * tdesign v0.32.0
 * (c) 2021 tdesign
 * @license MIT
 */

import { h as helper } from '../../../_chunks/dep-42d5c87e.js';
import _defineProperty from '@babel/runtime/helpers/defineProperty';
import _typeof from '@babel/runtime/helpers/typeof';
import Vue from 'vue';
import isFunction from 'lodash/isFunction';
import { FilterIcon } from 'tdesign-icons-vue';
import primaryTableProps from '../../primary-table-props.js';
import baseTableProps from '../../base-table-props.js';
import { prefix } from '../../../config.js';
import { CheckboxGroup } from '../../../checkbox/index.js';
import { RadioGroup } from '../../../radio/index.js';
import { Input } from '../../../input/index.js';
import { Popup } from '../../../popup/index.js';
import { Button } from '../../../button/index.js';
import { getTitle } from '../../util/common.js';
import { emitEvent } from '../../../utils/event.js';
import { renderTNodeJSXDefault } from '../../../utils/render-tnode.js';
import '../../../checkbox/group.js';
import '@babel/runtime/helpers/toConsumableArray';
import 'lodash/intersection';
import '../../../checkbox/checkbox.js';
import '../../../utils/classnames.js';
import '../../../checkbox/props.js';
import '../../../utils/helper.js';
import '@babel/runtime/helpers/objectWithoutProperties';
import '@babel/runtime/helpers/slicedToArray';
import 'lodash/camelCase';
import '../../../checkbox/checkbox-group-props.js';
import '../../../utils/map-props.js';
import '../../../utils/withInstall.js';
import 'lodash/capitalize';
import './style/index.js';
import '../../../checkbox/type.js';
import '../../../radio/radio.js';
import '../../../radio/props.js';
import '../../../radio/group.js';
import 'lodash/isString';
import 'lodash/isNumber';
import '../../../radio/radio-group-props.js';
import '../../../radio/radio-button.js';
import '../../../radio/type.js';
import '../../../input/addon.js';
import '../../../input/input.js';
import '../../../config-provider/config-receiver.js';
import '../../../config-provider/zh_CN_config.js';
import '../../../config-provider/type.js';
import '../../../utils/mixins.js';
import '../../../input/props.js';
import '../../../input/input-group.js';
import '../../../input/type.js';
import '../../../popup/popup.js';
import '@popperjs/core';
import '../../../_chunks/dep-1db5c91c.js';
import '../../../utils/dom.js';
import 'raf';
import '../../../utils/easing.js';
import '../../../popup/props.js';
import '../../../utils/set-style.js';
import '../../../popup/type.js';
import '../../../button/button.js';
import '../../../loading/index.js';
import '../../../loading/loading.js';
import '../../../loading/icon/gradient.js';
import '../../../utils/transfer-dom.js';
import '../../../loading/props.js';
import '../../../loading/type.js';
import '../../../loading/plugin.js';
import '../../../button/props.js';
import '../../../utils/ripple.js';
import '../../../button/type.js';

function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }

function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }

function filterEmptyData(data) {
  var newFilterValue = {};
  Object.keys(data).forEach(function (key) {
    var item = data[key];
    var isArrayTrue = item instanceof Array && item.length;
    var isObject = _typeof(item) === "object" && !(item instanceof Array);
    var isObjectTrue = isObject && Object.keys(item).length;

    if (isArrayTrue || isObjectTrue || !["null", "", "undefined"].includes(String(item))) {
      newFilterValue[key] = item;
    }
  });
  return newFilterValue;
}

var filter = Vue.extend({
  name: "".concat(prefix, "-primary-table-filter"),
  data: function data() {
    return {
      tableWidth: 0,
      innerFilterValue: this.filterValue,
      filterPopupVisible: {}
    };
  },
  props: {
    columns: primaryTableProps.columns,
    pagination: baseTableProps.pagination,
    filterValue: primaryTableProps.filterValue,
    filterIcon: primaryTableProps.filterIcon,
    data: baseTableProps.data,
    filterRow: Function
  },
  computed: {
    fixedLeftColumn: function fixedLeftColumn() {
      var _this$columns;

      return !!((_this$columns = this.columns) !== null && _this$columns !== void 0 && _this$columns.filter(function (col) {
        return col.fixed === "left";
      }).length);
    },
    hasFilterCondition: function hasFilterCondition() {
      var _this$columns2;

      return !!((_this$columns2 = this.columns) !== null && _this$columns2 !== void 0 && _this$columns2.filter(function (col) {
        return col.filter;
      }).length);
    }
  },
  watch: {
    filterValue: function filterValue(val) {
      this.innerFilterValue = _objectSpread({}, val);
    }
  },
  mounted: function mounted() {
    var _this = this;

    var timer = setTimeout(function () {
      _this.updateTableWidth();

      clearTimeout(timer);
      timer = null;
    }, 0);
  },
  methods: {
    updateTableWidth: function updateTableWidth() {
      var tbody = this.$el.querySelector(".".concat(prefix, "-table__body"));

      if (tbody) {
        this.tableWidth = tbody.clientWidth;
      } else {
        var el = this.$el.querySelector(".".concat(prefix, "-table-content"));
        el && (this.tableWidth = el.clientWidth);
      }
    },
    onFilterPopupVisibleChange: function onFilterPopupVisibleChange(visible, colKey) {
      this.$set(this.filterPopupVisible, colKey, visible);
    },
    renderFirstFilterRow: function renderFirstFilterRow() {
      var _this$pagination, _this$data;

      var h = this.$createElement;
      var filterEmpty = filterEmptyData(this.filterValue);
      if (!this.filterValue || !Object.keys(filterEmpty).length) return null;
      var defaultNode = h("div", {
        "class": "".concat(prefix, "-table__filter-result")
      }, [h("span", ["\u641C\u7D22 \u201C", this.getFilterResultContent(), "\u201D\uFF0C"]), h("span", ["\u627E\u5230 ", ((_this$pagination = this.pagination) === null || _this$pagination === void 0 ? void 0 : _this$pagination.total) || ((_this$data = this.data) === null || _this$data === void 0 ? void 0 : _this$data.length), " \u6761\u7ED3\u679C"]), h(Button, {
        "attrs": {
          "theme": "primary",
          "variant": "text"
        },
        "on": {
          "click": this.onResetAll
        }
      }, ["\u6E05\u7A7A\u7B5B\u9009"])]);
      var filterContent = renderTNodeJSXDefault(this, "filterRow", {
        defaultNode: defaultNode
      });
      return h("div", {
        "style": {
          width: this.fixedLeftColumn ? "".concat(this.tableWidth, "px") : void 0
        },
        "class": "".concat(prefix, "-table__row-filter-inner")
      }, [filterContent]);
    },
    getFilterResultContent: function getFilterResultContent() {
      var _this2 = this;

      var arr = [];
      this.columns.filter(function (col) {
        return col.filter;
      }).forEach(function (col) {
        var value = _this2.filterValue[col.colKey];

        if (col.filter.list && !["null", "", "undefined"].includes(String(value))) {
          var formattedValue = value instanceof Array ? value : [value];
          var label = [];
          col.filter.list.forEach(function (option) {
            if (formattedValue.includes(option.value)) {
              label.push(option.label);
            }
          });
          value = label.join();
        }

        if (value) {
          arr.push("".concat(col.title, "\uFF1A").concat(value));
        }
      });
      return arr.join("\uFF1B");
    },
    onInnerFilterChange: function onInnerFilterChange(val, column) {
      var filterValue = _objectSpread(_objectSpread({}, this.innerFilterValue), {}, _defineProperty({}, column.colKey, val));

      this.innerFilterValue = filterValue;

      if (!column.filter.showConfirmAndReset) {
        this.emitFilterChange(filterValue, column);
      }
    },
    emitFilterChange: function emitFilterChange(filterValue, column) {
      emitEvent(this, "filter-change", filterValue, {
        col: column
      });
      emitEvent(this, "change", {
        filter: filterValue
      }, {
        trigger: "filter"
      });
    },
    onReset: function onReset(column) {
      var filterValue = _objectSpread(_objectSpread({}, this.innerFilterValue), {}, _defineProperty({}, column.colKey, {
        single: "",
        multiple: [],
        input: ""
      }[column.filter.type] || column.filter.resetValue || ""));

      this.innerFilterValue = filterValue;
      this.emitFilterChange(filterValue, column);
      this.$set(this.filterPopupVisible, column.colKey, false);
    },
    onResetAll: function onResetAll() {
      this.innerFilterValue = {};
      this.emitFilterChange({});
      this.filterPopupVisible = {};
    },
    onConfirm: function onConfirm(column) {
      this.emitFilterChange(this.innerFilterValue, column);
      this.$set(this.filterPopupVisible, column.colKey, false);
    },
    getBottomButtons: function getBottomButtons(column) {
      var _this3 = this;

      var h = this.$createElement;
      if (!column.filter.showConfirmAndReset) return;
      return h("div", {
        "class": "".concat(prefix, "-table__filter--bottom-buttons")
      }, [h(Button, {
        "attrs": {
          "theme": "default",
          "size": "small"
        },
        "on": {
          "click": function click() {
            return _this3.onReset(column);
          }
        }
      }, ["\u91CD\u7F6E"]), h(Button, {
        "attrs": {
          "theme": "primary",
          "size": "small"
        },
        "on": {
          "click": function click() {
            return _this3.onConfirm(column);
          }
        }
      }, ["\u786E\u8BA4"])]);
    },
    getFilterContent: function getFilterContent(column) {
      var _column$filter,
          _column$filter2,
          _column$filter3,
          _column$filter4,
          _column$filter5,
          _this4 = this,
          _column$filter6,
          _column$filter7;

      var h = this.$createElement;
      var types = ["single", "multiple", "input"];

      if (column.type && !types.includes(column.filter.type)) {
        console.error("TDesign Table Error: column.filter.type must be the following: ".concat(JSON.stringify(types)));
        return;
      }

      if (column !== null && column !== void 0 && (_column$filter = column.filter) !== null && _column$filter !== void 0 && _column$filter.component && typeof (column === null || column === void 0 ? void 0 : (_column$filter2 = column.filter) === null || _column$filter2 === void 0 ? void 0 : _column$filter2.component) !== "function") {
        console.error("TDesign Table Error: column.filter.component must be a function");
        return;
      }

      var component = {
        single: RadioGroup,
        multiple: CheckboxGroup,
        input: Input
      }[column.filter.type];
      if (!component && !(column !== null && column !== void 0 && (_column$filter3 = column.filter) !== null && _column$filter3 !== void 0 && _column$filter3.component)) return;

      var props = _objectSpread(_objectSpread({
        options: ["single", "multiple"].includes(column.filter.type) ? (_column$filter4 = column.filter) === null || _column$filter4 === void 0 ? void 0 : _column$filter4.list : void 0
      }, ((_column$filter5 = column.filter) === null || _column$filter5 === void 0 ? void 0 : _column$filter5.props) || {}), {}, {
        value: this.innerFilterValue[column.colKey]
      });

      var on = {
        change: function change(val) {
          return _this4.onInnerFilterChange(val, column);
        }
      };
      return h("div", {
        "class": "".concat(prefix, "-table__filter-pop-content-inner")
      }, [column !== null && column !== void 0 && (_column$filter6 = column.filter) !== null && _column$filter6 !== void 0 && _column$filter6.component ? column === null || column === void 0 ? void 0 : (_column$filter7 = column.filter) === null || _column$filter7 === void 0 ? void 0 : _column$filter7.component(function (v, b) {
        var tProps = _typeof(b) === "object" && "attrs" in b ? b.attrs : {};
        return _this4.$createElement(v, {
          props: _objectSpread(_objectSpread({}, props), tProps),
          on: on
        });
      }) : h(component, helper([{
        "attrs": {
          "value": this.innerFilterValue[column.colKey]
        }
      }, {
        "props": _objectSpread({}, props)
      }, {}, {
        "on": _objectSpread({}, on)
      }]))]);
    },
    getFilterColumns: function getFilterColumns(columns) {
      var _this5 = this;

      var h = this.$createElement;
      return columns.map(function (item, index) {
        var column = _objectSpread({}, item);

        if (column.filter) {
          var title = getTitle(_this5, column, index);

          column.title = function () {
            return h("div", {
              "class": "".concat(prefix, "-table__cell--title")
            }, [h("div", [title]), h("div", {
              "class": "".concat(prefix, "-table__cell--filter")
            }, [h(Popup, helper([{
              "attrs": {
                "visible": _this5.filterPopupVisible[column.colKey],
                "trigger": "click",
                "placement": "bottom",
                "showArrow": true,
                "overlayClassName": "".concat(prefix, "-table__filter-pop")
              }
            }, {
              "on": {
                "visible-change": function visibleChange(val) {
                  return _this5.onFilterPopupVisibleChange(val, column.colKey);
                }
              }
            }]), [isFunction(_this5.filterIcon) ? _this5.filterIcon(_this5.$createElement) : h(FilterIcon, {
              "attrs": {
                "name": "filter"
              },
              "class": "".concat(prefix, "-table__filter-icon")
            }), h("template", {
              "slot": "content"
            }, [h("div", {
              "class": "".concat(prefix, "-table__filter-pop-content")
            }, [_this5.getFilterContent(column), _this5.getBottomButtons(column)])])])])]);
          };
        }

        return column;
      });
    }
  }
});

export { filter as default };
//# sourceMappingURL=filter.js.map
