"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
var _typeof = require("@babel/runtime/helpers/typeof");
Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.selectTableProps = exports.default = void 0;
var _vue = require("vue");
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
var _select = _interopRequireWildcard(require("../select"));
var _type = require("../_util/type");
var _useConfigInject2 = _interopRequireDefault(require("../_util/hooks/useConfigInject"));
var _propsUtil = require("../_util/props-util");
var _InfoTwoTone = _interopRequireDefault(require("@pf-ui/pf-icons-vue/InfoTwoTone"));
var _classNames2 = _interopRequireDefault(require("../_util/classNames"));
function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
function toggleArrayItem(arr, row, key) {
  var index = arr.findIndex(function (item) {
    return item[key] === row[key];
  });
  if (index !== -1) {
    return [].concat((0, _toConsumableArray2.default)(arr.slice(0, index)), (0, _toConsumableArray2.default)(arr.slice(index + 1)));
  }
  return [].concat((0, _toConsumableArray2.default)(arr), [row]);
}
var selectTableProps = function selectTableProps() {
  return (0, _objectSpread2.default)((0, _objectSpread2.default)({
    value: Object
  }, _select.selectProps), {}, {
    mode: String,
    tableDrop: Array,
    valueKey: String,
    labelKey: String,
    showSearch: Boolean,
    options: Array
  });
};
exports.selectTableProps = selectTableProps;
var SelectTable = (0, _vue.defineComponent)({
  name: 'PfSelectTable',
  inheritAttrs: false,
  props: (0, _propsUtil.initDefaultProps)(selectTableProps(), {
    valueKey: 'id',
    labelKey: 'name',
    showSearch: false
  }),
  emits: ['change', 'search', 'update:value'],
  setup: function setup(props, _ref) {
    var attrs = _ref.attrs,
      emit = _ref.emit;
    var _useConfigInject = (0, _useConfigInject2.default)('select-table', props),
      prefixCls = _useConfigInject.prefixCls;
    var isMultiple = (0, _vue.computed)(function () {
      return (props === null || props === void 0 ? void 0 : props.mode) === 'multiple' || (props === null || props === void 0 ? void 0 : props.mode) === 'tags';
    });
    var value = (0, _vue.ref)(isMultiple.value ? (0, _toConsumableArray2.default)(props.options.filter(function (x) {
      var _props$value;
      return props === null || props === void 0 ? void 0 : (_props$value = props.value) === null || _props$value === void 0 ? void 0 : _props$value.includes(x[props.valueKey]);
    })) : props.options.find(function (x) {
      return x[props.valueKey] === (props === null || props === void 0 ? void 0 : props.value);
    }));
    var searchValue = (0, _vue.ref)('');
    (0, _vue.watch)(function () {
      return props.value;
    }, function (v) {
      if (v === null || v === undefined) {
        value.value = isMultiple.value ? [] : undefined;
        return;
      }
      if (isMultiple.value) {
        var valueArr = (0, _toConsumableArray2.default)(value.value).map(function (x) {
          return x[props.valueKey];
        });
        if (valueArr.join() !== v.join()) {
          var _ref2;
          var newArr = (_ref2 = (0, _toConsumableArray2.default)(v)) === null || _ref2 === void 0 ? void 0 : _ref2.filter(function (x) {
            return !valueArr.includes(x);
          });
          var arr = props.options.filter(function (x) {
            return newArr === null || newArr === void 0 ? void 0 : newArr.includes(x[props.valueKey]);
          });
          var delArr = valueArr.filter(function (x) {
            return !v.includes(x);
          });
          value.value = [(0, _toConsumableArray2.default)(value.value).filter(function (x) {
            return !delArr.includes(x[props.valueKey]);
          })].concat((0, _toConsumableArray2.default)(arr));
        }
      } else {
        var _value$value;
        if (v !== ((_value$value = value.value) === null || _value$value === void 0 ? void 0 : _value$value[props === null || props === void 0 ? void 0 : props.valueKey])) {
          var obj = props.options.find(function (x) {
            return x[props.valueKey] === v;
          });
          value.value = (0, _objectSpread2.default)({}, obj);
        }
      }
    });
    var open = (0, _vue.ref)(false);
    var handleSelectRowClick = function handleSelectRowClick(e, row) {
      if (isMultiple.value) {
        var toggleArr = toggleArrayItem((0, _toConsumableArray2.default)(value.value || []), row, props.valueKey);
        open.value = true;
        value.value = (0, _toConsumableArray2.default)(toggleArr);
        var valueArr = (0, _toConsumableArray2.default)(toggleArr).map(function (x) {
          return x[props.valueKey];
        });
        emit === null || emit === void 0 ? void 0 : emit("update:value", valueArr);
        emit('change', (0, _toConsumableArray2.default)(toggleArr));
      } else {
        open.value = false;
        value.value = (0, _objectSpread2.default)({}, row);
        emit('update:value', row[props.valueKey]);
        emit('change', (0, _objectSpread2.default)({}, row));
      }
      (0, _vue.nextTick)(function () {
        searchValue.value = '';
      });
      e.preventDefault();
    };
    var handleMouseDouwn = function handleMouseDouwn(e) {
      return e.preventDefault();
    };
    var elSelectSlots = {
      $stable: true,
      dropdownRender: function dropdownRender() {
        var _props$tableDrop, _props$options;
        return props !== null && props !== void 0 && (_props$tableDrop = props.tableDrop) !== null && _props$tableDrop !== void 0 && _props$tableDrop.length ? (0, _vue.createVNode)("div", null, [props.options.length > 0 ? (0, _vue.createVNode)("div", null, [(0, _vue.createVNode)("div", {
          "class": "".concat(prefixCls.value, "-drop-header")
        }, [props === null || props === void 0 ? void 0 : props.tableDrop.map(function (item) {
          return (0, _vue.createVNode)("div", {
            "style": {
              minWidth: "".concat(item.width || 120, "px")
            },
            "class": "".concat(prefixCls.value, "-drop-header-item")
          }, [item.title]);
        })]), (0, _vue.createVNode)("div", {
          "class": "".concat(prefixCls.value, "-drop")
        }, [(_props$options = props.options) === null || _props$options === void 0 ? void 0 : _props$options.map(function (item, index) {
          var _value$value2, _value$value3, _classNames;
          return (0, _vue.createVNode)("div", {
            "class": (0, _classNames2.default)("".concat(prefixCls.value, "-drop-item"), (_classNames = {}, (0, _defineProperty2.default)(_classNames, "".concat(prefixCls.value, "-drop-item-striped"), index % 2 === 0), (0, _defineProperty2.default)(_classNames, "".concat(prefixCls.value, "-drop-item-selected"), isMultiple.value ? (_value$value2 = value.value) === null || _value$value2 === void 0 ? void 0 : _value$value2.find(function (x) {
              return x[props.valueKey] === item[props.valueKey];
            }) : ((_value$value3 = value.value) === null || _value$value3 === void 0 ? void 0 : _value$value3[props.valueKey]) === item[props.valueKey]), _classNames)),
            "onClick": function onClick(e) {
              return handleSelectRowClick(e, item);
            },
            "onMousedown": handleMouseDouwn
          }, [props.tableDrop.map(function (drop) {
            return (0, _vue.createVNode)("div", {
              "class": (0, _classNames2.default)("".concat(prefixCls.value, "-drop-label"), {}),
              "style": {
                minWidth: "".concat(drop.width || 120, "px")
              },
              "title": item[drop.label]
            }, [item[drop.label]]);
          })]);
        })])]) : null, (props === null || props === void 0 ? void 0 : props.options.length) === 0 ? (0, _vue.createVNode)("div", {
          "class": (0, _classNames2.default)("".concat(prefixCls.value, "-drop-empty"))
        }, [(0, _vue.createVNode)(_InfoTwoTone.default, {
          "class": (0, _classNames2.default)("".concat(prefixCls.value, "-drop-empty-icon"))
        }, null), (0, _vue.createTextVNode)("\u6682\u65E0\u6570\u636E")]) : null]) : '';
      }
    };
    var handleChange = function handleChange(_value) {
      if (!_value) {
        value.value = undefined;
        emit('change', undefined);
      }
    };
    var handleDeselect = function handleDeselect(v) {
      if (v) {
        var toggleArr = (0, _toConsumableArray2.default)(value.value).filter(function (x) {
          return x[props.valueKey] !== v;
        });
        value.value = (0, _toConsumableArray2.default)(toggleArr);
        var valueArr = (0, _toConsumableArray2.default)(value.value).map(function (x) {
          return x[props.valueKey];
        });
        emit('change', (0, _toConsumableArray2.default)(toggleArr));
        emit === null || emit === void 0 ? void 0 : emit("update:value", valueArr.filter(function (x) {
          return x !== v;
        }));
      }
    };
    var _handleDropdownVisibleChange = function _handleDropdownVisibleChange(_open) {
      open.value = _open;
      if (!_open) {
        searchValue.value = '';
        emit('search', undefined);
      }
    };
    return function () {
      var _value$value4, _value$value5;
      return (0, _vue.createVNode)(_vue.Fragment, null, [(0, _vue.createVNode)(_select.default, (0, _objectSpread2.default)((0, _objectSpread2.default)({
        "placeholder": "请选择"
      }, attrs), {}, {
        "mode": props.mode,
        "open": open.value,
        "searchValue": searchValue.value,
        "showSearch": props.showSearch || false,
        "onSearch": function onSearch(value) {
          searchValue.value = value;
          emit('search', value);
        },
        "onDropdownVisibleChange": _handleDropdownVisibleChange,
        "defaultActiveFirstOption": false,
        "onChange": handleChange,
        "onDeselect": handleDeselect,
        "value": isMultiple.value ? (_value$value4 = value.value) === null || _value$value4 === void 0 ? void 0 : _value$value4.map(function (x) {
          return x[props.labelKey];
        }) : (_value$value5 = value.value) === null || _value$value5 === void 0 ? void 0 : _value$value5[props.labelKey]
      }), elSelectSlots)]);
    };
  }
});
var _default = (0, _type.withInstall)(SelectTable);
exports.default = _default;