import _objectSpread from "@babel/runtime/helpers/objectSpread2";
import _slicedToArray from "@babel/runtime/helpers/slicedToArray";

/* eslint-disable */
import React, { useState } from 'react';
import { set, get } from 'dot-prop-immutable';
import { i18n } from '@fishx/i18n';
import { SimpleForm as Form, Switch, Select } from '@whalecloud/fdx';
import CustomInput from "../../../components/CustomInput";
import { toolFormAttr, transformDependencyValues, isSingleBoolen } from "../../../utils";
import OptionSettings from "../../elements/components/OptionSettings";
import CascaderOptionSettings from "../../elements/components/CascaderOptionSettings";
/**
 * cascadeSet
 * 设置表单级联属性
 */

var valueKey = 'data.formSettings.dependency';

var DatasourceRelation = function DatasourceRelation(props) {
  var updateElement = props.updateElement,
      element = props.element,
      relateOptions = props.relateOptions,
      formItems = props.formItems;
  var type = element.type;
  var _element$data = element.data,
      _element$data$formIte = _element$data.formItemSettings;
  _element$data$formIte = _element$data$formIte === void 0 ? {} : _element$data$formIte;
  var _element$data$formIte2 = _element$data$formIte.options,
      options = _element$data$formIte2 === void 0 ? {} : _element$data$formIte2,
      _element$data$formSet = _element$data.formSettings;
  _element$data$formSet = _element$data$formSet === void 0 ? {} : _element$data$formSet;
  var _element$data$formSet2 = _element$data$formSet.dependency,
      dependency = _element$data$formSet2 === void 0 ? {} : _element$data$formSet2;
  var _dependency$source = dependency.source,
      source = _dependency$source === void 0 ? {} : _dependency$source;

  var _Form$useForm = Form.useForm(),
      _Form$useForm2 = _slicedToArray(_Form$useForm, 1),
      formDS = _Form$useForm2[0];

  var _useState = useState(isSingleBoolen(source.inputs) ? 'switch' : ''),
      _useState2 = _slicedToArray(_useState, 2),
      relationTag = _useState2[0],
      setRelationTag = _useState2[1];

  var initialValues_DS = {
    relates: source.relates ? source.relates.join(',') : '',
    inputs: source.inputs ? source.inputs.join(',') : ''
  };

  var onRelationChange = function onRelationChange(value) {
    var item = formItems.find(function (v) {
      return v.name === value;
    });

    if (item && item.type === 'switch') {
      setRelationTag('switch');
    } else {
      setRelationTag(''); //复原 relationTag
    }
  };

  var onDatasoucreChange = function onDatasoucreChange(changedValues, allValues) {
    var values = transformDependencyValues(allValues);
    var propName = "".concat(valueKey, ".source");
    var source = get(element, propName);

    var newSource = _objectSpread(_objectSpread({}, source), values);

    var newElement = values ? set(element, propName, newSource) : set(element, valueKey, {});
    updateElement({
      element: newElement
    });
  };

  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Form, Object.assign({}, toolFormAttr, {
    form: formDS,
    initialValues: initialValues_DS,
    onValuesChange: onDatasoucreChange
  }), /*#__PURE__*/React.createElement(Form.Item, {
    label: i18n('PAGEBUIDER_SETTINGS_RELATION'),
    name: "relates"
  }, /*#__PURE__*/React.createElement(Select, {
    placeholder: i18n('PAGEBUIDER_SETTINGS_PLEASE_INPUT_VALUE'),
    allowClear: true,
    onChange: onRelationChange
  }, relateOptions.map(function (v) {
    return /*#__PURE__*/React.createElement(Select.Option, {
      value: v.value,
      title: v.title
    }, v.label);
  }))), relationTag === 'switch' ? /*#__PURE__*/React.createElement(Form.Item, {
    label: i18n('PAGEBUIDER_SETTINGS_INPUT'),
    name: "inputs",
    valuePropName: "checked"
  }, /*#__PURE__*/React.createElement(Switch, null)) : /*#__PURE__*/React.createElement(Form.Item, {
    label: i18n('PAGEBUIDER_SETTINGS_INPUT'),
    name: "inputs"
  }, /*#__PURE__*/React.createElement(CustomInput, {
    inputProps: {
      placeholder: i18n('PAGEBUIDER_SETTINGS_PLEASE_INPUT_VALUE')
    }
  }))), /*#__PURE__*/React.createElement("p", null, i18n('PAGEBUIDER_SETTINGS_OUTPUT')), type === 'select' ? /*#__PURE__*/React.createElement(OptionSettings, {
    updateElement: updateElement,
    element: updateElement,
    remote: true,
    sourceKey: "data.formSettings.dependency.source.output"
  }) : /*#__PURE__*/React.createElement(CascaderOptionSettings, {
    updateElement: updateElement,
    element: updateElement,
    remote: true,
    sourceKey: "data.formSettings.dependency.source.output"
  }), /*#__PURE__*/React.createElement("p", null, i18n('PAGEBUIDER_SETTINGS_DEFAULT_OUTPUT')), type === 'select' ? /*#__PURE__*/React.createElement(OptionSettings, {
    updateElement: updateElement,
    element: updateElement,
    remote: true,
    sourceKey: "data.formSettings.dependency.source.defaultOutput"
  }) : /*#__PURE__*/React.createElement(CascaderOptionSettings, {
    updateElement: updateElement,
    element: updateElement,
    remote: true,
    sourceKey: "data.formSettings.dependency.source.defaultOutput"
  }));
};

export default DatasourceRelation;
//# sourceMappingURL=DatasourceRelation.js.map