hy-checkbox
Version:
checkbox & radio ui components for react
222 lines (176 loc) • 9.36 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", {
value: true
});
var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
var _react = require('react');
var _react2 = _interopRequireDefault(_react);
var _classnames2 = require('classnames');
var _classnames3 = _interopRequireDefault(_classnames2);
var _formsyReact = require('formsy-react');
var _formsyReact2 = _interopRequireDefault(_formsyReact);
var _Label = require('../Label');
var _Label2 = _interopRequireDefault(_Label);
var _Input = require('../Input');
var _Input2 = _interopRequireDefault(_Input);
var _Button = require('../Button');
var _Button2 = _interopRequireDefault(_Button);
require('./form.less');
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; } /*
* @Author: SiMeiyu
* @Date: 2017-07-04 10:01:27
*/
var HOC = _formsyReact2.default.HOC;
// Formsy.addValidationRule('gt', (values, value, num) => value > num);
// Formsy.addValidationRule('gte', (values, value, num) => value >= num);
// Formsy.addValidationRule('lt', (values, value, num) => value < num);
// Formsy.addValidationRule('lte', (values, value, num) => value <= num);
// Formsy.addValidationRule('isIn', (values, value, array) => array.indexOf(value) >= 0);
_formsyReact2.default.addValidationRule('isName', function (values, value, array) {
var reg = /^[\u4E00-\u9FA5A-Za-z0-9_]+$/g;
return reg.test(value);
});
_formsyReact2.default.addValidationRule('isPassword', function (values, value, array) {
var reg = /^[\S]{6,16}$/g;
return reg.test(value);
});
_formsyReact2.default.addValidationRule('isTel', function (values, value, array) {
var reg = /^(?:(?:0\d{2,3}[\- ]?[1-9]\d{6,7})|(?:[48]00[\- ]?[1-9]\d{6}))$/g;
return reg.test(value);
});
_formsyReact2.default.addValidationRule('isMobile', function (values, value, array) {
var reg = /^1[3-9]\d{9}$/g;
return reg.test(value);
});
var InputForm = function (_React$Component) {
_inherits(InputForm, _React$Component);
function InputForm(props) {
_classCallCheck(this, InputForm);
var _this = _possibleConstructorReturn(this, (InputForm.__proto__ || Object.getPrototypeOf(InputForm)).call(this, props));
var _this$props = _this.props,
prefixCls = _this$props.prefixCls,
className = _this$props.className;
_this.state = {
classes: (0, _classnames3.default)(prefixCls + '-form-group', className),
errorMessage: null,
codeBtn: true,
s: '30'
};
_this.validClass = '';
return _this;
}
_createClass(InputForm, [{
key: 'changeValue',
value: function changeValue(event) {
this.props.setValue(event.currentTarget.value);
}
}, {
key: 'handleBlur',
value: function handleBlur() {
var _props = this.props,
prefixCls = _props.prefixCls,
className = _props.className,
showRequired = _props.showRequired,
showError = _props.showError,
getValue = _props.getValue;
this.validClass = showRequired() ? getValue() == '' ? 'required' : '' : showError() ? 'error' : '';
this.setState({
classes: (0, _classnames3.default)(prefixCls + '-form-group', className, this.validClass),
errorMessage: this.validClass == 'required' ? this.props.label + '\u4E0D\u80FD\u4E3A\u7A7A\uFF01' : this.props.getErrorMessage()
});
}
}, {
key: 'componentWillUnmount',
value: function componentWillUnmount() {
this.timer = null;
}
}, {
key: 'issueIdentifyCode',
value: function issueIdentifyCode() {
this.setState({
codeBtn: false
});
var Num = "";
for (var i = 0; i < 6; i++) {
Num += Math.floor(Math.random() * 10);
}
console.log("验证码：", Num);
this.props.handleIdentifyCode(Num);
var space = 30;
this.timer = function () {
var _this2 = this;
if (space > 0) {
this.setState({
s: space
});
space--;
setTimeout(function () {
_this2.timer();
}, 1000);
} else {
this.setState({
codeBtn: true
});
}
};
this.timer();
}
}, {
key: 'render',
value: function render() {
var _props2 = this.props,
prefixCls = _props2.prefixCls,
name = _props2.name,
type = _props2.type,
label = _props2.label,
isRequired = _props2.isRequired,
readOnly = _props2.readOnly,
disabled = _props2.disabled,
placeholder = _props2.placeholder,
icon = _props2.icon;
var _state = this.state,
s = _state.s,
codeBtn = _state.codeBtn,
errorMessage = _state.errorMessage,
classes = _state.classes;
var identifyCode = name == 'identifyCode';
return _react2.default.createElement(
'div',
{ className: classes },
_react2.default.createElement(_Label2.default, {
name: label,
require: isRequired()
}),
_react2.default.createElement(_Input2.default, {
type: type || 'text',
name: name,
onChange: this.changeValue.bind(this),
onBlur: this.handleBlur.bind(this),
value: this.props.getValue(),
disabled: disabled || readOnly || false,
placeholder: placeholder || '',
icon: icon || null
}),
identifyCode ? _react2.default.createElement(_Button2.default, { className: 'btn-identifyCode', type: 'default', name: codeBtn ? "发送验证码" : '\u91CD\u65B0\u53D1\u9001(' + s + ')', disabled: !codeBtn, onClick: this.issueIdentifyCode.bind(this) }) : null,
_react2.default.createElement(
'span',
{ className: (0, _classnames3.default)('validation-error', _defineProperty({}, prefixCls + '-form-identifyCode-error', identifyCode)) },
errorMessage
)
);
}
}]);
return InputForm;
}(_react2.default.Component);
InputForm.propTypes = {
className: _react2.default.PropTypes.string,
prefixCls: _react2.default.PropTypes.string
};
InputForm.defaultProps = {
prefixCls: "ult"
};
exports.default = HOC(InputForm);