function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
function _iterableToArrayLimit(arr, i) { var _i = null == arr ? null : "undefined" != typeof Symbol && arr[Symbol.iterator] || arr["@@iterator"]; if (null != _i) { var _s, _e, _x, _r, _arr = [], _n = !0, _d = !1; try { if (_x = (_i = _i.call(arr)).next, 0 === i) { if (Object(_i) !== _i) return; _n = !1; } else for (; !(_n = (_s = _x.call(_i)).done) && (_arr.push(_s.value), _arr.length !== i); _n = !0); } catch (err) { _d = !0, _e = err; } finally { try { if (!_n && null != _i.return && (_r = _i.return(), Object(_r) !== _r)) return; } finally { if (_d) throw _e; } } return _arr; } }
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
import { IconFont, util } from '@zgfe/business-lib';
import { Spin, Dropdown, Menu } from 'antd';
import _ from 'lodash';
import React, { useEffect, useState } from 'react';
import JoinConditionRow from './joinConditionRow';
var classPrefix = 'flow-join-config';
var _ref = [/*#__PURE__*/React.createElement("svg", {
    width: "24",
    height: "24",
    viewBox: "0 0 24 24",
    fill: "none",
    xmlns: "http://www.w3.org/2000/svg"
  }, /*#__PURE__*/React.createElement("g", {
    clipPath: "url(#clip0_337_3389)"
  }, /*#__PURE__*/React.createElement("path", {
    d: "M10.02 10.02H19V19H10.02V10.02ZM8.52002 8.01999C8.24388 8.01999 8.02002 8.24385 8.02002 8.51999V20.5C8.02002 20.7761 8.24388 21 8.52002 21H20.5C20.7762 21 21 20.7761 21 20.5V8.51999C21 8.24385 20.7762 8.01999 20.5 8.01999H8.52002Z",
    fill: "#165DFF"
  }), /*#__PURE__*/React.createElement("path", {
    d: "M5 5H13.98V13.98H5V5ZM3.5 3C3.22386 3 3 3.22386 3 3.5V15.48C3 15.7561 3.22386 15.98 3.5 15.98H15.48C15.7561 15.98 15.98 15.7561 15.98 15.48V3.5C15.98 3.22386 15.7561 3 15.48 3H3.5Z",
    fill: "#165DFF"
  }), /*#__PURE__*/React.createElement("path", {
    d: "M10.02 10.02H13.98V13.98H10.02V10.02ZM8.52002 8.01999C8.24388 8.01999 8.02002 8.24385 8.02002 8.51999V15.48C8.02002 15.7561 8.24388 15.98 8.52002 15.98H15.48C15.7561 15.98 15.98 15.7561 15.98 15.48V8.51999C15.98 8.24385 15.7561 8.01999 15.48 8.01999H8.52002Z",
    fill: "#021429"
  })), /*#__PURE__*/React.createElement("defs", null, /*#__PURE__*/React.createElement("clipPath", {
    id: "clip0_337_3389"
  }, /*#__PURE__*/React.createElement("rect", {
    width: "24",
    height: "24",
    fill: "white"
  })))), /*#__PURE__*/React.createElement("svg", {
    width: "24",
    height: "24",
    viewBox: "0 0 24 24",
    fill: "none",
    xmlns: "http://www.w3.org/2000/svg"
  }, /*#__PURE__*/React.createElement("g", {
    clipPath: "url(#clip0_337_3359)"
  }, /*#__PURE__*/React.createElement("path", {
    d: "M10.52 10.02H19.5V19H10.52V10.02ZM9.02002 8.02002C8.74388 8.02002 8.52002 8.24388 8.52002 8.52002V20.5C8.52002 20.7762 8.74388 21 9.02002 21H21C21.2762 21 21.5 20.7762 21.5 20.5V8.52002C21.5 8.24388 21.2762 8.02002 21 8.02002H9.02002Z",
    fill: "#021429"
  }), /*#__PURE__*/React.createElement("path", {
    d: "M5.5 5H14.48V13.98H5.5V5ZM4 3C3.72386 3 3.5 3.22386 3.5 3.5V15.48C3.5 15.7561 3.72386 15.98 4 15.98H15.98C16.2561 15.98 16.48 15.7561 16.48 15.48V3.5C16.48 3.22386 16.2561 3 15.98 3H4Z",
    fill: "#021429"
  }), /*#__PURE__*/React.createElement("path", {
    d: "M10.52 10.02H14.48V13.98H10.52V10.02ZM9.02002 8.02002C8.74388 8.02002 8.52002 8.24388 8.52002 8.52002V15.98H15.98C16.2561 15.98 16.48 15.7562 16.48 15.48V8.02002H9.02002Z",
    fill: "#165DFF"
  })), /*#__PURE__*/React.createElement("defs", null, /*#__PURE__*/React.createElement("clipPath", {
    id: "clip0_337_3359"
  }, /*#__PURE__*/React.createElement("rect", {
    width: "24",
    height: "24",
    fill: "white"
  })))), /*#__PURE__*/React.createElement("svg", {
    width: "24",
    height: "24",
    viewBox: "0 0 24 24",
    fill: "none",
    xmlns: "http://www.w3.org/2000/svg"
  }, /*#__PURE__*/React.createElement("g", {
    clipPath: "url(#clip0_337_3358)"
  }, /*#__PURE__*/React.createElement("path", {
    d: "M10.02 10.02H19V19H10.02V10.02ZM8.52002 8.01999C8.24388 8.01999 8.02002 8.24385 8.02002 8.51999V20.5C8.02002 20.7761 8.24388 21 8.52002 21H20.5C20.7762 21 21 20.7761 21 20.5V8.51999C21 8.24385 20.7762 8.01999 20.5 8.01999H8.52002Z",
    fill: "#021429"
  }), /*#__PURE__*/React.createElement("path", {
    d: "M5 5H13.98V13.98H5V5ZM3.5 3C3.22386 3 3 3.22386 3 3.5V15.48C3 15.7561 3.22386 15.98 3.5 15.98H15.48C15.7561 15.98 15.98 15.7561 15.98 15.48V3.5C15.98 3.22386 15.7561 3 15.48 3H3.5Z",
    fill: "#165DFF"
  })), /*#__PURE__*/React.createElement("defs", null, /*#__PURE__*/React.createElement("clipPath", {
    id: "clip0_337_3358"
  }, /*#__PURE__*/React.createElement("rect", {
    width: "24",
    height: "24",
    fill: "white"
  })))), /*#__PURE__*/React.createElement("svg", {
    width: "24",
    height: "24",
    viewBox: "0 0 24 24",
    fill: "none",
    xmlns: "http://www.w3.org/2000/svg"
  }, /*#__PURE__*/React.createElement("g", {
    clipPath: "url(#clip0_337_3374)"
  }, /*#__PURE__*/React.createElement("path", {
    d: "M4.5 5H13.48V13.98H4.5V5ZM3 3C2.72386 3 2.5 3.22386 2.5 3.5V15.48C2.5 15.7561 2.72386 15.98 3 15.98H14.98C15.2561 15.98 15.48 15.7561 15.48 15.48V3.5C15.48 3.22386 15.2561 3 14.98 3H3Z",
    fill: "#021429"
  }), /*#__PURE__*/React.createElement("path", {
    d: "M9.52002 10.02H18.5V19H9.52002V10.02ZM8.02002 8.01999C7.74388 8.01999 7.52002 8.24385 7.52002 8.51999V20.5C7.52002 20.7761 7.74388 21 8.02002 21H20C20.2762 21 20.5 20.7761 20.5 20.5V8.51999C20.5 8.24385 20.2762 8.01999 20 8.01999H8.02002Z",
    fill: "#165DFF"
  })), /*#__PURE__*/React.createElement("defs", null, /*#__PURE__*/React.createElement("clipPath", {
    id: "clip0_337_3374"
  }, /*#__PURE__*/React.createElement("rect", {
    width: "24",
    height: "24",
    fill: "white"
  }))))],
  all = _ref[0],
  inner = _ref[1],
  left = _ref[2],
  right = _ref[3];
export var joinTypeIcon = {
  all: all,
  inner: inner,
  left: left,
  right: right
};
var JoinConditionPanel = function JoinConditionPanel(_ref2) {
  var tableA = _ref2.tableA,
    tableB = _ref2.tableB,
    defaultValue = _ref2.defaultValue,
    loading = _ref2.loading,
    onChange = _ref2.onChange;
  var _useState = useState((defaultValue === null || defaultValue === void 0 ? void 0 : defaultValue.type) || 'left'),
    _useState2 = _slicedToArray(_useState, 2),
    joinType = _useState2[0],
    setJoinType = _useState2[1];
  var _useState3 = useState(false),
    _useState4 = _slicedToArray(_useState3, 2),
    inited = _useState4[0],
    setInited = _useState4[1];
  var _useState5 = useState([]),
    _useState6 = _slicedToArray(_useState5, 2),
    conditionList = _useState6[0],
    setConditionList = _useState6[1];
  useEffect(function () {
    var _defaultValue$joinOn;
    if (!defaultValue || !((_defaultValue$joinOn = defaultValue.joinOn) === null || _defaultValue$joinOn === void 0 ? void 0 : _defaultValue$joinOn.length)) {
      setConditionList([{
        id: util.guid(),
        condition: []
      }]);
    } else {
      setConditionList(defaultValue.joinOn.map(function (condition) {
        return {
          id: util.guid(),
          condition: condition
        };
      }));
    }
    setInited(true);
  }, []);
  useEffect(function () {
    if (onChange && !loading && inited) {
      var joinOn = conditionList === null || conditionList === void 0 ? void 0 : conditionList.filter(function (row) {
        return row.condition && row.condition[0] && row.condition[1];
      }).map(function (item) {
        return item.condition;
      });
      onChange({
        type: joinType,
        joinOn: joinOn
      });
    }
  }, [joinType, conditionList, inited, loading]);
  if (loading || !inited) {
    return /*#__PURE__*/React.createElement("div", {
      className: "".concat(classPrefix, "-conditions")
    }, /*#__PURE__*/React.createElement(Spin, null));
  }
  return /*#__PURE__*/React.createElement("div", {
    className: "".concat(classPrefix, "-conditions")
  }, /*#__PURE__*/React.createElement("div", {
    className: "".concat(classPrefix, "-row")
  }, /*#__PURE__*/React.createElement("span", {
    className: "".concat(classPrefix, "-row-column table")
  }, tableA ? /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(IconFont, {
    type: "shujujiyewu"
  }), tableA === null || tableA === void 0 ? void 0 : tableA.name) : '-'), /*#__PURE__*/React.createElement("span", {
    className: "".concat(classPrefix, "-row-operator")
  }, /*#__PURE__*/React.createElement(Dropdown, {
    overlay: /*#__PURE__*/React.createElement(Menu, {
      onClick: function onClick(_ref3) {
        var key = _ref3.key;
        setJoinType(key);
      },
      selectedKeys: [joinType],
      items: [{
        key: 'inner',
        label: /*#__PURE__*/React.createElement("span", {
          className: "".concat(classPrefix, "-ope")
        }, inner, "inner")
      }, {
        key: 'left',
        label: /*#__PURE__*/React.createElement("span", {
          className: "".concat(classPrefix, "-ope")
        }, left, "left")
      }, {
        key: 'right',
        label: /*#__PURE__*/React.createElement("span", {
          className: "".concat(classPrefix, "-ope")
        }, right, "right")
      }, {
        key: 'all',
        label: /*#__PURE__*/React.createElement("span", {
          className: "".concat(classPrefix, "-ope")
        }, all, "all")
      }]
    }),
    trigger: ['click', 'hover']
  }, /*#__PURE__*/React.createElement("span", {
    className: "".concat(classPrefix, "-row-operator")
  }, joinTypeIcon[joinType]))), /*#__PURE__*/React.createElement("span", {
    className: "".concat(classPrefix, "-row-column table")
  }, tableB ? /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(IconFont, {
    type: "shujujiyewu"
  }), tableB === null || tableB === void 0 ? void 0 : tableB.name) : '-')), conditionList.map(function (row, i) {
    return /*#__PURE__*/React.createElement(JoinConditionRow, {
      id: row.id,
      key: row.id,
      value: row.condition,
      tableA: tableA,
      tableB: tableB,
      removeAble: conditionList.length > 1,
      onRemove: function onRemove(id) {
        setConditionList(function (list) {
          var res = _.cloneDeep(list);
          res.forEach(function (item, i) {
            if (item.id === id) res.splice(i, 1);
          });
          return res;
        });
      },
      onChange: function onChange(_ref4, id, enableAdd) {
        var _ref5 = _slicedToArray(_ref4, 2),
          a = _ref5[0],
          b = _ref5[1];
        setConditionList(function (list) {
          var res = _.cloneDeep(list);
          res.forEach(function (item, i) {
            if (item.id === id) res[i].condition = [a, b];
          });
          /**
           * 添加筛选条件
           */
          if (a && b && enableAdd) {
            res.push({
              id: util.guid(),
              condition: []
            });
          }
          return res;
        });
      }
    });
  }));
};
export default JoinConditionPanel;