fx-form-widget/lib/packages/multiSelect/index.js

动态表单组件库

"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
exports.__esModule = true;
exports["default"] = void 0;
var _regenerator = _interopRequireDefault(require("@babel/runtime/regenerator"));
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator"));
var _select = _interopRequireDefault(require("antd/lib/select"));
var _react = _interopRequireWildcard(require("react"));
var React = _react;
var _request = require("./request");
var _tools = require("./tools");
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { "default": e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n["default"] = e, t && t.set(e, n), n; }
var Option = _select["default"].Option;
var MultiSelect = function MultiSelect(_ref) {
  var _ref$schema = _ref.schema,
    schema = _ref$schema === void 0 ? {} : _ref$schema,
    _ref$onChange = _ref.onChange,
    onChange = _ref$onChange === void 0 ? function () {} : _ref$onChange,
    _ref$isInit = _ref.isInit,
    isInit = _ref$isInit === void 0 ? false : _ref$isInit,
    _ref$value = _ref.value,
    value = _ref$value === void 0 ? (0, _tools.isNotNullValue)(schema.data) ? schema.data : undefined : _ref$value;
  var _schema$readonly = schema.readonly,
    readonly = _schema$readonly === void 0 ? false : _schema$readonly,
    _schema$required = schema.required,
    required = _schema$required === void 0 ? false : _schema$required,
    _schema$enumKeys = schema.enumKeys,
    enumKeys = _schema$enumKeys === void 0 ? [] : _schema$enumKeys,
    _schema$enumNames = schema.enumNames,
    enumNames = _schema$enumNames === void 0 ? [] : _schema$enumNames,
    _schema$placeholder = schema.placeholder,
    placeholder = _schema$placeholder === void 0 ? '请选择' : _schema$placeholder,
    _schema$allowClear = schema.allowClear,
    allowClear = _schema$allowClear === void 0 ? false : _schema$allowClear,
    _schema$dataUrl = schema.dataUrl,
    dataUrl = _schema$dataUrl === void 0 ? undefined : _schema$dataUrl,
    _schema$fieldName = schema.fieldName,
    fieldName = _schema$fieldName === void 0 ? undefined : _schema$fieldName;
  var _useState = (0, _react.useState)(enumKeys),
    keys = _useState[0],
    setKeys = _useState[1];
  var _useState2 = (0, _react.useState)(enumNames),
    values = _useState2[0],
    setValues = _useState2[1];
  (0, _react.useEffect)(function () {
    if (isInit && dataUrl && fieldName) {
      // 请求参数
      fetchData();
    }
  }, [isInit, dataUrl, fieldName]);
  (0, _react.useEffect)(function () {
    if (!(dataUrl && fieldName)) {
      try {
        if (JSON.stringify(enumKeys) !== JSON.stringify(keys)) {
          setKeys(enumKeys);
        }
        if (JSON.stringify(enumNames) !== JSON.stringify(values)) {
          setValues(enumNames);
        }
      } catch (_) {}
    }
  }, [dataUrl, fieldName, enumKeys, enumNames]);
  var fetchData = /*#__PURE__*/function () {
    var _ref2 = (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee() {
      var queryObj, data, tempKeys, tempValues;
      return _regenerator["default"].wrap(function _callee$(_context) {
        while (1) switch (_context.prev = _context.next) {
          case 0:
            queryObj = (0, _tools.parseQueryString)(dataUrl);
            if (!queryObj) {
              _context.next = 6;
              break;
            }
            _context.next = 4;
            return (0, _request.getUrlData)(dataUrl, queryObj);
          case 4:
            data = _context.sent;
            if (data.success) {
              tempKeys = [];
              tempValues = [];
              if (data.data.length) {
                data.data.forEach(function (optionItem) {
                  tempKeys.push(optionItem.id);
                  tempValues.push(optionItem.name);
                });
              }
              setKeys(tempKeys);
              setValues(tempValues);
            }
          case 6:
          case "end":
            return _context.stop();
        }
      }, _callee);
    }));
    return function fetchData() {
      return _ref2.apply(this, arguments);
    };
  }();
  var handleChange = function handleChange(value) {
    return onChange(value);
  };
  var defaultOption = {};
  if (schema['ui_options']) {
    Object.keys(schema['ui_options']).forEach(function (key) {
      defaultOption[key] = schema['ui_options'][key];
    });
  }
  var options = (0, _extends2["default"])({
    disabled: readonly,
    required: required,
    placeholder: placeholder,
    allowClear: allowClear
  }, defaultOption);
  return /*#__PURE__*/React.createElement(_select["default"], (0, _extends2["default"])({
    // strictMatch
    showArrow: true,
    style: {
      width: '100%'
    },
    mode: "multiple"
  }, options, {
    value: (0, _tools.isNotNullValue)(value) ? value : undefined,
    onChange: handleChange,
    optionFilterProp: "children",
    filterOption: function filterOption(input, option) {
      return option.children.toLowerCase().indexOf(input.toLowerCase()) >= 0;
    }
  }), (keys || []).map(function (keyValue, index) {
    var option = values ? values[index] : keyValue;
    return /*#__PURE__*/React.createElement(Option, {
      value: keyValue,
      key: keyValue
    }, option);
  }));
};
var _default = exports["default"] = MultiSelect;