@aliretail/react-materials-components
Version:
238 lines (188 loc) • 8.72 kB
JavaScript
;
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
exports.__esModule = true;
exports["default"] = void 0;
var _inheritsLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/inheritsLoose"));
var _input = _interopRequireDefault(require("@alifd/next/lib/input"));
var _extends3 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));
var React = _interopRequireWildcard(require("react"));
var _classnames = _interopRequireDefault(require("classnames"));
var _FormHelpExtra = _interopRequireDefault(require("../FormHelpExtra"));
var _properties = require("./properties");
var _excluded = ["value", "onChange"];
function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
var COM_CLASS = 'aliretail-landline-number';
var REG_NUMBER = /^\d+$/;
var InputX = function InputX(props) {
var value = props.value,
_onChange = props.onChange,
others = (0, _objectWithoutPropertiesLoose2["default"])(props, _excluded);
return /*#__PURE__*/React.createElement(_input["default"], (0, _extends3["default"])({
className: COM_CLASS + "_input",
value: value,
onChange: function onChange(val) {
if (val && !REG_NUMBER.test(val)) {
return;
}
_onChange(val);
}
}, others));
};
var LandlineNumber = /*#__PURE__*/function (_React$Component) {
(0, _inheritsLoose2["default"])(LandlineNumber, _React$Component);
function LandlineNumber() {
var _this;
for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
args[_key] = arguments[_key];
}
_this = _React$Component.call.apply(_React$Component, [this].concat(args)) || this;
_this.state = {
state: {},
errorMsg: {}
};
_this.validate = function (isRequired) {
var _Object$keys;
if (isRequired === void 0) {
isRequired = true;
}
var isEmptyValue = _this.isEmptyValue(); // 如果不是必填项并且内容为空则不做校验
if (!isRequired && isEmptyValue) {
_this.clearErrors();
return true;
}
var value = _this.props.value;
var errorMsg = {};
var validateList = _this.getValuePropsList();
for (var i = 0; i < validateList.length; i++) {
var key = validateList[i];
var errMsg = _properties.validateMap === null || _properties.validateMap === void 0 ? void 0 : _properties.validateMap[key](value === null || value === void 0 ? void 0 : value[key]);
if (errMsg !== true) {
errorMsg[key] = errMsg;
}
}
_this.setErrors(errorMsg);
if ((_Object$keys = Object.keys(errorMsg)) !== null && _Object$keys !== void 0 && _Object$keys.length) {
return errorMsg;
}
return true;
};
return _this;
}
var _proto = LandlineNumber.prototype;
_proto.handleChange = function handleChange(key, val) {
var _extends2;
this.props.onChange((0, _extends3["default"])({}, this.props.value, (_extends2 = {}, _extends2[key] = val, _extends2)));
};
_proto.getValuePropsList = function getValuePropsList() {
var hasExtensionNumber = this.props.hasExtensionNumber;
var validateList = ['areaCode', 'seatNumber'];
if (hasExtensionNumber) {
validateList.push('extensionNumber');
}
return validateList;
}
/**
* 校验规则，提供外部使用 ref 方式调用
* @param isRequired 是否是必填项
*/
;
_proto.setErrors = function setErrors(error) {
if (!error) {
this.clearErrors();
return;
}
this.setState({
state: Object.keys(error).reduce(function (counter, key) {
if (error !== null && error !== void 0 && error[key]) {
counter[key] = 'error';
}
return counter;
}, {}),
errorMsg: error
});
};
_proto.clearErrors = function clearErrors() {
this.setState({
state: {},
errorMsg: {}
});
};
_proto.isEmptyValue = function isEmptyValue() {
var value = this.props.value;
return !Object.keys(value).find(function (key) {
return !!value[key];
});
};
_proto.getPreviewValue = function getPreviewValue() {
var value = this.props.value;
var valuePropsList = this.getValuePropsList();
return valuePropsList.reduce(function (counter, key) {
counter.push(value[key] || '');
return counter;
}, []).join('-');
};
_proto.render = function render() {
var _ref,
_this2 = this;
var _this$props = this.props,
value = _this$props.value,
hasExtensionNumber = _this$props.hasExtensionNumber,
disabled = _this$props.disabled,
readOnly = _this$props.readOnly,
isPreview = _this$props.isPreview;
var _this$state = this.state,
state = _this$state.state,
errorMsg = _this$state.errorMsg;
return /*#__PURE__*/React.createElement("div", {
className: (0, _classnames["default"])([COM_CLASS, (_ref = {}, _ref[COM_CLASS + "-extension"] = hasExtensionNumber, _ref)]),
"data-name": "AliretailLandlineNumber"
}, isPreview ? /*#__PURE__*/React.createElement(InputX, {
value: this.getPreviewValue(),
isPreview: true
}) : /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(InputX, {
placeholder: "\u533A\u53F7",
disabled: disabled,
readOnly: readOnly,
isPreview: isPreview,
maxLength: 4,
value: value === null || value === void 0 ? void 0 : value.areaCode,
state: state === null || state === void 0 ? void 0 : state.areaCode,
onChange: function onChange(val) {
_this2.handleChange('areaCode', val);
}
}), !!(state !== null && state !== void 0 && state.areaCode) && /*#__PURE__*/React.createElement(_FormHelpExtra["default"].Error, null, errorMsg.areaCode)), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(InputX, {
placeholder: "\u5EA7\u673A\u53F7",
disabled: disabled,
readOnly: readOnly,
isPreview: isPreview,
maxLength: 11,
value: value === null || value === void 0 ? void 0 : value.seatNumber,
state: state === null || state === void 0 ? void 0 : state.seatNumber,
onChange: function onChange(val) {
_this2.handleChange('seatNumber', val);
}
}), !!(state !== null && state !== void 0 && state.seatNumber) && /*#__PURE__*/React.createElement(_FormHelpExtra["default"].Error, null, errorMsg.seatNumber)), hasExtensionNumber && /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(InputX, {
placeholder: "\u5206\u673A\u53F7",
disabled: disabled,
readOnly: readOnly,
isPreview: isPreview,
value: value === null || value === void 0 ? void 0 : value.extensionNumber,
state: state === null || state === void 0 ? void 0 : state.extensionNumber,
onChange: function onChange(val) {
_this2.handleChange('extensionNumber', val);
}
}), !!(state !== null && state !== void 0 && state.extensionNumber) && /*#__PURE__*/React.createElement(_FormHelpExtra["default"].Error, null, errorMsg.extensionNumber))));
};
return LandlineNumber;
}(React.Component);
exports["default"] = LandlineNumber;
LandlineNumber.defaultProps = {
value: {},
onChange: function onChange() {},
hasExtensionNumber: true,
disabled: false,
readOnly: false,
isPreview: false
};