fx-form-widget/es/packages/radio/index.js

动态表单组件库

import _Radio from "antd/es/radio";
import _extends from "@babel/runtime/helpers/extends";
import _asyncToGenerator from "@babel/runtime/helpers/asyncToGenerator";
import _regeneratorRuntime from "@babel/runtime/regenerator";
import * as React from 'react';
import { useState, useEffect } from 'react';
import { getUrlData } from './request';
import { parseQueryString, isNotNullValue } from './tools';
var RadioWidget = function RadioWidget(_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 ? 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$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 = useState(enumKeys),
    keys = _useState[0],
    setKeys = _useState[1];
  var _useState2 = useState(enumNames),
    values = _useState2[0],
    setValues = _useState2[1];
  useEffect(function () {
    if (isInit && dataUrl && fieldName) {
      // 请求参数
      fetchData();
    }
  }, [isInit, dataUrl, fieldName]);
  useEffect(function () {
    if (!(dataUrl && fieldName)) {
      setKeys(enumKeys);
      setValues(enumNames);
    }
  }, [enumKeys, enumNames]);
  var fetchData = /*#__PURE__*/function () {
    var _ref2 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee() {
      var queryObj, data, tempKeys, tempValues;
      return _regeneratorRuntime.wrap(function _callee$(_context) {
        while (1) switch (_context.prev = _context.next) {
          case 0:
            queryObj = parseQueryString(dataUrl);
            if (!queryObj) {
              _context.next = 6;
              break;
            }
            _context.next = 4;
            return 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(e) {
    return onChange(e.target.value);
  };
  var defaultOption = {};
  if (schema['ui_options']) {
    Object.keys(schema['ui_options']).forEach(function (key) {
      defaultOption[key] = schema['ui_options'][key];
    });
  }
  var options = _extends({
    disabled: readonly,
    required: required
  }, defaultOption);
  return /*#__PURE__*/React.createElement(_Radio.Group, _extends({
    style: {
      width: '100%'
    }
  }, options, {
    value: value,
    onChange: handleChange
  }), (keys || []).map(function (keyValue, index) {
    var option = values ? values[index] : keyValue;
    return /*#__PURE__*/React.createElement(_Radio, {
      value: keyValue,
      key: index
    }, option);
  }));
};
export default RadioWidget;