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

动态表单组件库

"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
exports.__esModule = true;
exports["default"] = void 0;
var _react = _interopRequireWildcard(require("react"));
var React = _react;
var _tools = require("./tools");
var _classnames = _interopRequireDefault(require("classnames"));
require("./index.less");
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 optionsList = ['none', 'dotted', 'solid', 'crudeSolid'];
var LineType = function LineType(_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$value = _ref.value,
    value = _ref$value === void 0 ? (0, _tools.isNotNullValue)(schema.data) ? schema.data : '' : _ref$value;
  var _schema$readonly = schema.readonly,
    readonly = _schema$readonly === void 0 ? false : _schema$readonly,
    values = schema.values,
    defaultValue = schema.defaultValue;
  var _useState = (0, _react.useState)('solid'),
    selectItem = _useState[0],
    setSelectItem = _useState[1];
  (0, _react.useEffect)(function () {
    if (value) {
      setSelectItem(value);
    }
  }, [value]);
  (0, _react.useEffect)(function () {
    if (defaultValue) {
      setSelectItem(defaultValue);
    }
  }, [defaultValue]);
  var renderOptions = function renderOptions() {
    return optionsList.map(function (value, key) {
      return /*#__PURE__*/React.createElement("div", {
        className: (0, _classnames["default"])('lineType_option', {
          selected: selectItem === value
        }),
        key: key,
        onClick: function onClick() {
          setSelectItem(value);
          onChange(value);
        }
      }, value === 'none' && '无边线', value === 'dotted' && /*#__PURE__*/React.createElement("span", {
        className: "lineType_option_dotted"
      }), value === 'solid' && /*#__PURE__*/React.createElement("span", {
        className: "lineType_option_solid"
      }), value === 'crudeSolid' && /*#__PURE__*/React.createElement("span", {
        className: "lineType_option_crudeSolid"
      }));
    });
  };
  var renderValus = function renderValus() {
    return values.map(function (value, key) {
      var id = value.id,
        text = value.text;
      return /*#__PURE__*/React.createElement("div", {
        className: (0, _classnames["default"])('lineType_option', {
          selected: selectItem === id
        }),
        key: key,
        onClick: function onClick() {
          setSelectItem(id);
          onChange(id);
        }
      }, text);
    });
  };
  return /*#__PURE__*/React.createElement("div", {
    className: "lineType_wrap"
  }, readonly && /*#__PURE__*/React.createElement("div", {
    className: "shade_cover"
  }), values ? renderValus() : renderOptions());
};
var _default = exports["default"] = LineType;