"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 _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));

var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));

var _react = _interopRequireWildcard(require("react"));

var _reactDnd = require("react-dnd");

var _reactDndHtml5Backend = _interopRequireDefault(require("react-dnd-html5-backend"));

var _immutabilityHelper = _interopRequireDefault(require("immutability-helper"));

var _ColumnSetPanelItem = _interopRequireDefault(require("./components/ColumnSetPanelItem"));

var _utils = _interopRequireDefault(require("../../utils/utils"));

var _i18next = _interopRequireDefault(require("i18next"));

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; }

var prefix = _utils.default.prefixCls;

function ColumnSetPanel(props) {
  var dataSource = props.dataSource,
      onChange = props.onChange,
      closePanel = props.closePanel,
      keepLastItem = props.keepLastItem;

  var _useState = (0, _react.useState)(dataSource),
      _useState2 = (0, _slicedToArray2.default)(_useState, 2),
      panels = _useState2[0],
      setPanels = _useState2[1];

  var _useState3 = (0, _react.useState)(true),
      _useState4 = (0, _slicedToArray2.default)(_useState3, 2),
      canCancel = _useState4[0],
      setCanCancel = _useState4[1];

  var movePanel = function movePanel(dragIndex, hoverIndex) {
    var dragPanel = panels[dragIndex];
    setPanels((0, _immutabilityHelper.default)(panels, {
      $splice: [[dragIndex, 1], [hoverIndex, 0, dragPanel]]
    }));
  };

  var formatPanels = (0, _react.useCallback)(function (newPanels) {
    var _newPanels = newPanels.filter(function (panel) {
      return !panel.ignore;
    });

    var len = 0;

    _newPanels.forEach(function (panel) {
      if (!('checked' in panel) || panel.checked === true) {
        len++;
      }
    });

    if (len <= 1 && keepLastItem) {
      setCanCancel(false);
    } else {
      setCanCancel(true);
    }
  }, [keepLastItem]);

  var onCheck = function onCheck(index, checked) {
    var newPanels = (0, _toConsumableArray2.default)(panels);
    formatPanels(newPanels);
    newPanels[index].checked = checked;
    setPanels(newPanels);
    onChange(newPanels);
  };

  var endDrag = function endDrag() {
    onChange(panels);
  };

  (0, _react.useEffect)(function () {
    formatPanels(dataSource);
    setPanels(dataSource);
  }, [dataSource]); // eslint-disable-line

  return /*#__PURE__*/_react.default.createElement("div", {
    className: "".concat(prefix, "-column-set-panel-box")
  }, /*#__PURE__*/_react.default.createElement("div", {
    className: "panel-title-wrapper"
  }, /*#__PURE__*/_react.default.createElement("span", {
    className: "panel-title"
  }, _i18next.default.t('MK_Global:headersetting')), /*#__PURE__*/_react.default.createElement("span", {
    className: "fm fm-cross",
    onClick: closePanel
  })), /*#__PURE__*/_react.default.createElement("div", {
    className: "column-set-panel-wrapper"
  }, /*#__PURE__*/_react.default.createElement(_reactDnd.DndProvider, {
    backend: _reactDndHtml5Backend.default
  }, Array.isArray(panels) && panels.length > 0 ? panels.map(function (item, index) {
    return !item.ignore ? /*#__PURE__*/_react.default.createElement(_ColumnSetPanelItem.default, {
      index: index,
      id: item.key,
      key: item.key,
      checked: 'checked' in item ? item.checked : true,
      onCheck: onCheck,
      panel: item,
      canDrag: true,
      movePanel: movePanel,
      endDrag: endDrag,
      canCancel: canCancel
    }) : null;
  }) : null)));
}

var _default = ColumnSetPanel;
exports.default = _default;