import _inheritsLoose from "@babel/runtime/helpers/inheritsLoose";
import _Button from "@alifd/next/es/button";
import _Icon from "@alifd/next/es/icon";
import _Select from "@alifd/next/es/select";
import _extends from "@babel/runtime/helpers/extends";
import _Grid from "@alifd/next/es/grid";
import React, { Component, useEffect, useState } from "react";
import { computedRelateType } from "../../_utils/conditionRenderService/type";
import { DataSourceType, getConditionRenderList, getDictionaryList } from "../../_utils/formKeyType";
import { t } from "../../../src/locale";
import "./index.less";
import { ConditionRenderService } from "../../_utils/conditionRenderService";
import RenderByFormKey from "./renderByFormKey";
import { uuid } from "../../_utils/utils";
import { cloneDeep } from "lodash";
var Row = _Grid.Row,
  Col = _Grid.Col;
var conditionRenderService = new ConditionRenderService();
var dataForm = getConditionRenderList();
var ConditionRender = function ConditionRender(props) {
  var conditions = props.data,
    isDictionary = props.isDictionary;
  var _useState = useState([]),
    selectOption = _useState[0],
    setSelectOption = _useState[1];
  var _useState2 = useState([]),
    selectRowOption = _useState2[0],
    setSelectRowOption = _useState2[1];
  useEffect(function () {
    conditionRenderService.load(props.data, props.type);
  }, []);
  useEffect(function () {
    conditionRenderService.load(props.data, props.type);
  }, [conditions]);
  useEffect(function () {
    var selectOption = conditionRenderService.getSelectRelateByType(props.selectRelate);
    var selectRowOption = conditionRenderService.getSelectRelateByType(props.selectRowRelate);
    setSelectOption(selectOption);
    setSelectRowOption(selectRowOption);
  }, [props.selectRelate, props.selectRowRelate]);
  function onChangeData(obj) {
    var key = obj.key,
      value = obj.value;
    props.onChange({
      key: key,
      value: value
    });
  }
  return /*#__PURE__*/React.createElement("div", {
    className: "ConditionRenderBox"
  }, conditions.map(function (item) {
    return /*#__PURE__*/React.createElement(_Condition, _extends({}, item, {
      isDictionary: isDictionary,
      conditions: conditions,
      key: item.id,
      selectOption: selectOption,
      selectRowOption: selectRowOption,
      onChange: function onChange(value) {
        onChangeData({
          key: "data",
          value: [].concat(value)
        });
      }
    }));
  }));
};
var _Condition = function Condition(props) {
  var isDictionary = props.isDictionary,
    conditions = props.conditions,
    selectOption = props.selectOption,
    selectRowOption = props.selectRowOption,
    relate = props.relate,
    children = props.children,
    onChange = props.onChange;
  var comData = {
    relate: props.relate,
    rowData: props.rowData,
    id: props.id,
    children: props.children
  };
  function onOutDataData(key, v) {
    var newProps = cloneDeep(comData);
    newProps[key] = v;
    var newConditions = conditionRenderService.alterRowData(newProps);
    props.onChange(newConditions);
  }
  return /*#__PURE__*/React.createElement("div", {
    className: "conditionItem"
  }, children.length > 0 && /*#__PURE__*/React.createElement("div", {
    className: "rule-group"
  }, /*#__PURE__*/React.createElement("div", {
    className: "rule-relation-wrap"
  }, /*#__PURE__*/React.createElement("div", {
    className: "rule-group-line"
  }), /*#__PURE__*/React.createElement("div", {
    className: "rule-relation"
  }, /*#__PURE__*/React.createElement(_Select, {
    style: {
      width: 100 + "%",
      minWidth: 0
    },
    value: relate,
    size: "small",
    onChange: function onChange(v) {
      onOutDataData("relate", v);
    },
    dataSource: selectOption
  }))), /*#__PURE__*/React.createElement("div", {
    className: "rule-list-wrap"
  }, children.map(function (item) {
    return /*#__PURE__*/React.createElement(_Condition, _extends({
      key: item.id
    }, item, {
      isDictionary: true,
      selectOption: selectOption,
      selectRowOption: selectRowOption,
      onChange: onChange
    }));
  }))), children.length === 0 && /*#__PURE__*/React.createElement(ListOneItem, _extends({}, props, {
    conditions: true,
    selectRowOption: selectRowOption
  })));
};
var ListOneItem = function ListOneItem(props) {
  var conditions = props.conditions,
    rowData = props.rowData,
    selectRowOption = props.selectRowOption,
    onChange = props.onChange,
    isDictionary = props.isDictionary;
  var _useState3 = useState(dataForm),
    conditionList = _useState3[0],
    setConditionList = _useState3[1];
  useEffect(function () {
    if (isDictionary) {
      var dd = getDictionaryList();
      setConditionList([].concat(conditionList, dd));
    }
  }, [isDictionary]);
  var comData = {
    relate: props.relate,
    rowData: props.rowData,
    id: props.id,
    children: props.children
  };
  function copyRowData() {
    var newConditions = conditionRenderService.copyRowData(comData);
    onChange(newConditions);
  }
  function addRowData() {
    var newConditions = conditionRenderService.addRowData(comData);
    onChange(newConditions);
  }
  function removeRowData() {
    var newConditions = conditionRenderService.removeRowData(comData);
    onChange(newConditions);
  }
  function onFormKeyChange(obj, key, v) {
    obj[key] = v;
    var newProps = cloneDeep(comData);
    newProps.rowData = obj;
    var newConditions = conditionRenderService.alterRowData(newProps);
    onChange(newConditions);
  }
  function onRenderByFormKeyChange(list) {
    var newProps = cloneDeep(comData);
    list.forEach(function (item) {
      var key = item.key,
        value = item.value;
      newProps.rowData[key] = value;
    });
    var newConditions = conditionRenderService.alterRowData(newProps);
    onChange(newConditions);
  }
  function onRenderByFormKeyChanges(list, key) {
    var changeObj = comData.rowData[key];
    list.forEach(function (item) {
      changeObj[item.key] = item.value;
    });
    var newProps = cloneDeep(comData);
    newProps.rowData[key] = _extends({}, changeObj);
    var newConditions = conditionRenderService.alterRowData(newProps);
    onChange(newConditions);
  }
  return /*#__PURE__*/React.createElement("div", {
    className: "conditionListOneItem"
  }, /*#__PURE__*/React.createElement(Row, {
    className: "conditionListOneItemRow",
    justify: "space-between"
  }, /*#__PURE__*/React.createElement(Col, {
    span: rowData.relate !== computedRelateType.omit ? "10" : "21",
    className: "conditionListOneItemCol"
  }, /*#__PURE__*/React.createElement(RenderByFormKey, {
    relationOption: conditionList,
    value: {
      id: uuid(),
      formKey: rowData.leftTree.formKey || DataSourceType.defaultType,
      data: rowData.leftTree.data,
      treeData: rowData.leftTree.treeData || []
    },
    onChange: function onChange(data) {
      onRenderByFormKeyChanges(data, "leftTree");
    }
  })), /*#__PURE__*/React.createElement(Col, {
    span: "2",
    className: "conditionListOneItemColRelate"
  }, /*#__PURE__*/React.createElement(_Select, {
    className: "itemOne_select",
    autoWidth: false,
    style: {
      width: 100 + "%",
      minWidth: 0
    },
    placeholder: t("setter.selectPlaceHolder"),
    dataSource: selectRowOption,
    value: rowData.relate,
    onChange: function onChange(v) {
      onFormKeyChange(rowData, "relate", v);
    }
  })), rowData.relate !== computedRelateType.omit && /*#__PURE__*/React.createElement(Col, {
    span: "10",
    className: "conditionListOneItemCol"
  }, /*#__PURE__*/React.createElement(RenderByFormKey, {
    relationOption: conditionList,
    value: {
      id: uuid(),
      formKey: rowData.rightTree.formKey || DataSourceType.defaultType,
      data: rowData.rightTree.data,
      treeData: rowData.rightTree.treeData || []
    },
    onChange: function onChange(data) {
      onRenderByFormKeyChanges(data, "rightTree");
    }
  }))), /*#__PURE__*/React.createElement("div", {
    className: "rowBtn"
  }, /*#__PURE__*/React.createElement(_Button, {
    disabled: conditionRenderService.isLastData(conditions),
    type: "primary",
    size: "small",
    onClick: function onClick() {
      copyRowData();
    }
  }, /*#__PURE__*/React.createElement(_Icon, {
    className: "rowBtnIcon",
    type: "copy"
  })), /*#__PURE__*/React.createElement(_Button, {
    type: "primary",
    size: "small",
    onClick: function onClick() {
      addRowData();
    }
  }, /*#__PURE__*/React.createElement(_Icon, {
    type: "add"
  })), /*#__PURE__*/React.createElement(_Button, {
    disabled: conditionRenderService.isLastData(conditions),
    type: "primary",
    size: "small",
    onClick: function onClick() {
      removeRowData();
    }
  }, /*#__PURE__*/React.createElement(_Icon, {
    type: "ashbin"
  }))));
};
var _default = /*#__PURE__*/function (_Component) {
  function _default() {
    return _Component.apply(this, arguments) || this;
  }
  _inheritsLoose(_default, _Component);
  var _proto = _default.prototype;
  _proto.render = function render() {
    return /*#__PURE__*/React.createElement(ConditionRender, this.props);
  };
  return _default;
}(Component);
export { _default as default };