@ttk/component
Version:
ttk组件库
1,058 lines (883 loc) • 35.6 kB
JavaScript
import { _ as _extends } from '../extends-b1af4ff7.js';
import { _ as _defineProperty } from '../defineProperty-847730aa.js';
import { _ as _slicedToArray } from '../slicedToArray-da0a5f5c.js';
import { _ as _inherits, a as _getPrototypeOf, b as _possibleConstructorReturn, c as _classCallCheck, d as _createClass, e as _assertThisInitialized } from '../getPrototypeOf-b95655c5.js';
import React__default, { Component } from 'react';
import { Input, Tooltip, Icon, InputNumber } from 'antd';
import classNames from 'classnames';
import 'react-dom';
import { number } from '@ttk/utils';
import isequal from 'lodash.isequal';
import { _ as _objectWithoutProperties } from '../objectWithoutProperties-0c3c7796.js';
import PropTypes from 'prop-types';
import '../_commonjsHelpers-471920d6.js';
import '../unsupportedIterableToArray-01f9082a.js';
function _createSuper$1(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$1(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
function _isNativeReflectConstruct$1() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
var InputNumberComponent = /*#__PURE__*/function (_Component) {
_inherits(InputNumberComponent, _Component);
var _super = _createSuper$1(InputNumberComponent);
function InputNumberComponent(props) {
var _this;
_classCallCheck(this, InputNumberComponent);
_this = _super.call(this, props);
_this.state = {
oldValue: "",
value: "",
max: Infinity,
min: -Infinity,
format: "",
interceptTab: false,
regex: ""
};
_this.assitShouldComponent = function (target) {
var obj = {};
for (var _i = 0, _Object$entries = Object.entries(target); _i < _Object$entries.length; _i++) {
var _Object$entries$_i = _slicedToArray(_Object$entries[_i], 2),
key = _Object$entries$_i[0],
value = _Object$entries$_i[1];
if (typeof value != 'function') {
obj[key] = value;
}
}
return obj;
};
_this.onKeyDown = function (e) {
if (e.key === 'Enter' || e.keyCode == 13 || e.keyCode == 108 || e.keyCode == 9) {
//e.keyCode == 9 不支持tab键,因为如果阻止了事件外抛,select的选择项键盘选中无法生效
if (_this.props.onEndEdit) {
_this.props.onEndEdit();
if (_this.props.interceptTab) {
if (e.keyCode == 9) {
if (e.preventDefault) e.preventDefault();
if (e.stopPropagation) e.stopPropagation();
}
}
return;
}
} //空格和等号,这两个对于凭证有特殊含义的快捷键
if (e.key === ' ' || e.keyCode == 32 || e.key === '=' || e.keyCode == 187 || e.target.value && (e.key === '-' || e.keyCode == 189 || e.keyCode == 109) || e.key === 'Process' && e.keyCode === 229) {
// 解决微软拼音中文状态下无法录入金额的问题
if (e.key === 'Process' && e.keyCode === 229) {
if (e.preventDefault) e.preventDefault();
if (e.stopPropagation) e.stopPropagation();
return;
} else {
if (_this.props.onShortcutKey) {
_this.props.onShortcutKey(e);
if (e.preventDefault) e.preventDefault();
if (e.stopPropagation) e.stopPropagation();
return;
}
}
}
if (e.type !== 'keydown' || e.keyCode == 8 || e.keyCode == 46 || e.keyCode == 27 || e.keyCode == 9 || e.keyCode == 37 || e.keyCode == 39 || e.keyCode == 38 || e.keyCode == 40 || e.key === 'Enter' || e.keyCode == 13 || e.keyCode == 108 || e.ctrlKey) {
//this.props.onEventKeyDown && this.props.onEventKeyDown(e)
//this.props.onKeyDown && this.props.onKeyDown(e)
return;
} //解极品五笔输入法下，新增凭证中无法输入数字的问题
if (e.keyCode == '229') {
// COMMENT TTK-2229 TTK-2242 解决该问题(IE下微软中文时无法录入数字) 故先注释掉以下四行
// if (e.preventDefault)
// e.preventDefault()
// if (e.stopPropagation)
// e.stopPropagation()
return;
} // 获取光标当前位置
var cursorPosition = _this.getCursorPosition(e.target); //utils.dom && utils.dom.getCursorPosition(e.target)
var regExp = _this.getRegExp(); //IE 、IE8兼容处理
var selectedText = _this.getSelection(),
checkText,
keyCode; //Chrome中小数点的ascii码是110（小键盘）、190（大键盘）
if (e.keyCode == 46 || e.keyCode == 110 || e.keyCode == 190) {
// keyCode = 46
//当为小数正则表达式时，不进行小数点正则检查
if (regExp.test('0.0') && e.target.value && e.target.value.indexOf('.') == -1) {
console.log('e.key: ' + e.key);
return;
} //109：小键盘负号的keyCode 189:大键盘负号的keyCode
} else if (e.keyCode == 189 || e.keyCode == 109) {
keyCode = 45; //当为负数正则表达式时，不进行负号正则检查
if (regExp.test('-1') && !e.target.value) {
return;
}
} else {
keyCode = e.keyCode;
}
var stateValue = _this.state.value.toString();
if (selectedText != '') {
stateValue = stateValue.replace(selectedText, '');
} //将输入的字符插入数字串中
if (stateValue.length == cursorPosition) {
if (regExp.test('-1')) {
//为了解决edge和ie下，值有负号不能全选修改的问题
stateValue = stateValue.replace(/-/g, '');
}
checkText = stateValue + _this.stringFromCharCode(keyCode);
} else if (cursorPosition == 0) {
if (regExp.test('-1')) {
//为了解决edge和ie下，值有负号不能全选修改的问题
stateValue = stateValue.replace(/-/g, '');
}
checkText = _this.stringFromCharCode(keyCode) + stateValue;
} else {
if (regExp.test('-1')) {
//为了解决edge和ie下，值有负号不能全选修改的问题
stateValue = stateValue.replace(/-/g, '');
}
checkText = stateValue.substring(0, cursorPosition) + _this.stringFromCharCode(keyCode) + stateValue.substring(cursorPosition);
} //去掉输入值中的逗号
if (checkText) {
if (checkText.indexOf(',') > -1) {
checkText = checkText.replace(/,/g, '');
}
} // if (!regExp.test(checkText)) {
// if (e.preventDefault)
// e.preventDefault()
// if (e.stopPropagation)
// e.stopPropagation()
// return
// }
if (regExp.test('-1')) {
// 为了解决 360浏览器和谷歌浏览器输入负号无法输入的情况
// if (checkText != '-' && !regExp.test(checkText)) {
if (checkText != '-' && !regExp.test(checkText) && !(checkText && (checkText.toLocaleLowerCase().includes('x') || checkText.toLocaleLowerCase().includes('c') || checkText.toLocaleLowerCase().includes('v')))) {
if (e.preventDefault) e.preventDefault();
if (e.stopPropagation) e.stopPropagation();
return;
}
} else {
if (!regExp.test(checkText)) {
if (e.preventDefault) e.preventDefault();
if (e.stopPropagation) e.stopPropagation();
return;
}
}
};
_this.getCursorPosition = function (target) {
var oTxt1 = target;
var cursorPosition = -1;
if (oTxt1.selectionStart != undefined) {
//非IE浏览器
cursorPosition = oTxt1.selectionStart;
} else {
//IE
var range = document.selection.createRange();
range.moveStart("character", -oTxt1.value.length);
cursorPosition = range.text.length;
}
return cursorPosition;
};
_this.getSelection = function () {
if (window.getSelection) {
return window.getSelection().toString();
} else if (document.getSelection) {
return document.getSelection().toString();
} else if (document.selection) {
return document.selection.createRange().text;
}
};
_this.stringFromCharCode = function (keyCode) {
var ret = '';
if (keyCode == 96) {
ret = '0';
} else if (keyCode == 97) {
ret = '1';
} else if (keyCode == 98) {
ret = '2';
} else if (keyCode == 99) {
ret = '3';
} else if (keyCode == 100) {
ret = '4';
} else if (keyCode == 101) {
ret = '5';
} else if (keyCode == 102) {
ret = '6';
} else if (keyCode == 103) {
ret = '7';
} else if (keyCode == 104) {
ret = '8';
} else if (keyCode == 105) {
ret = '9';
} else {
ret = String.fromCharCode(keyCode);
}
return ret;
};
_this.handleFocus = function (e) {
//获取事件对象 兼容IE8
var eve = e || window; ////获取document 对象的引用 兼容IE8
var objEle = eve.target || eve.srcElement;
objEle.focus();
var keyRandom = Math.floor(Math.random() * 10000000);
_this.keyRandom = keyRandom;
clearTimeout(_this.time);
_this.time = setTimeout(function () {
if (keyRandom == _this.keyRandom) {
if (document.activeElement && typeof document.activeElement.select == 'function') {
document.activeElement.select();
} else {
objEle.select();
}
}
}, 10);
_this.props.onFocus && _this.props.onFocus(e);
};
_this.state = _this.calculateState(props);
return _this;
}
_createClass(InputNumberComponent, [{
key: "componentWillReceiveProps",
value: function componentWillReceiveProps(nextProps) {
if (this.props.customAttribute) {
//期初余额 自定义的一个属性 为了重置超过限制的数据为初始数据
if (this.props.customAttribute !== nextProps.customAttribute) {
this.setState(this.calculateState(nextProps));
}
}
if (this.props.value !== nextProps.value) {
this.setState(this.calculateState(nextProps));
}
}
}, {
key: "shouldComponentUpdate",
value: function shouldComponentUpdate(nextProps, nextState) {
return !(isequal(this.assitShouldComponent(this.props), this.assitShouldComponent(nextProps)) && isequal(this.state, nextState));
}
}, {
key: "calculateState",
value: function calculateState(props) {
var data = {};
if (props.value !== undefined) {
data.value = props.value + '';
data.oldValue = data.value;
} else {
data.value = '';
data.oldValue = data.value;
}
if (props.min !== undefined && props.min !== null && props.min !== '' && !isNaN(props.min)) data.min = props.min;
if (props.max !== undefined && props.max !== null && props.max !== '' && !isNaN(props.max)) data.max = props.max;
if (props.format) data.format = props.format;
if (props.precision || props.precision == 0) {
data.precision = props.precision || 0;
}
if (props.interceptTab) {
data.interceptTab = props.interceptTab;
}
if (props.regex) {
data.regex = props.regex;
} else {
data.regex = /^-?(0|[1-9][0-9]*)(\.[0-9]*)?$/;
}
return data;
}
}, {
key: "getCurrentValidValue",
value: function getCurrentValidValue(value) {
var val = value;
this.props;
if (val === '') {
return '';
} else if (!this.isNotCompleteNumber(val)) {
val = Number(val);
if (val < this.state.min) {
return this.state.min;
}
if (val > this.state.max) {
return this.state.max;
}
} else {
return this.state.value;
}
return value;
}
/**
* 转换为数字
* @param {[type]} num [description]
* @return {[type]} [description]
*/
}, {
key: "toNumber",
value: function toNumber(num) {
if (this.isNotCompleteNumber(num)) {
return num;
}
return Number(num);
}
/**
* 判断是否非完整数字
* @param {[type]} num [description]
* @return {Boolean} [description]
*/
}, {
key: "isNotCompleteNumber",
value: function isNotCompleteNumber(num) {
return isNaN(num) || num === '' || num.toString().indexOf('.') === num.toString().length - 1;
}
/**
* 根据精度转换值
* @param {[type]} num [description]
* @return {[type]} [description]
*/
}, {
key: "toPrecisionAsStep",
value: function toPrecisionAsStep(num) {
//非完整数字直接返回, NaN,'',3444.
if (this.isNotCompleteNumber(num) || num === '') {
return num;
} //获取精度
var precision = this.state.precision; //精度非0的数字，转换
if (precision) {
return Number(num).toFixed(precision);
}
return num.toString();
}
/**
* 获取最大精度
* @param {[type]} currentValue [description]
* @return {[type]} [description]
*/
}, {
key: "getMaxPrecision",
value: function getMaxPrecision(currentValue) {
var step = this.props.step;
var stepPrecision = this.getPrecision(currentValue); //存在step取step的精度，step的值例如0.0001
if (step) stepPrecision = this.getPrecision(step);
return stepPrecision;
}
/**
* 获取精度
* @param {[type]} value [description]
* @return {[type]} [description]
*/
}, {
key: "getPrecision",
value: function getPrecision(value) {
var valueString = value.toString(); //取e-后字符转换成int,e-10=>10
if (valueString.indexOf('e-') >= 0) {
return parseInt(valueString.slice(valueString.indexOf('e-') + 1), 10);
}
var precision = 0; //取小数点后字符长度0.0001=>4
if (valueString.indexOf('.') >= 0) {
precision = valueString.length - valueString.indexOf('.') - 1;
} //否则0
return precision;
}
}, {
key: "toFixedLocal",
value: function toFixedLocal(value, precision) {
var ret = value;
if (value && value.toString().indexOf('.') > -1) {
if (value.toString().split('.')[1].length > precision) {
if (!isNaN(value)) {
//以下有问题，类似1.255这样的，四舍五入后，变成了1.25,调整成新的
// ret = Math.round(value * Math.pow(10, precision) / Math.pow(10, precision))
ret = Math.round(Math.abs(value) + 'e' + precision) / Math.pow(10, precision);
ret = value < 0 ? -ret : ret;
} else {
ret = 0;
}
}
}
return ret;
}
}, {
key: "onChange",
value: function onChange(e) {
var _this2 = this;
var value;
if (e.target.validity) {
value = e.target.validity.valid ? e.target.value : this.state.value;
} else {
value = e.target.value;
}
if (value.trim() == '-.') value = 0;
var regExp = this.getRegExp();
var isFullAngle = value.match(/[\uff00-\uffff]/g);
if (isFullAngle && isFullAngle.length > 0) {
//全角输入法转换为半角输入法
var tmp = "";
for (var i = 0; i < value.length; i++) {
if (value.charCodeAt(i) == 12288) {
tmp += String.fromCharCode(value.charCodeAt(i) - 12256);
continue;
}
if (value.charCodeAt(i) > 65280 && value.charCodeAt(i) < 65375) {
tmp += String.fromCharCode(value.charCodeAt(i) - 65248);
} else {
tmp += String.fromCharCode(value.charCodeAt(i));
}
}
value = tmp;
}
if (value && value.toString().length > 1) {
//copyPaste 加个属性缩小一下范围
if (number.clearThousPos(value, true) && this.props.copyPaste && value.toString().length - value.toString().indexOf('.') >= this.props.precision) {
//复制粘贴 四舍五入
value = "".concat(this.toFixedLocal(value, this.props.precision));
} else if (value.toString().substr(value.toString().length - 1, 1) != '.' && !regExp.test(number.clearThousPos(value, true))) {
//手动录入
// edge浏览器微软拼音中文输入法下，小数位数控制不住的问题处理
if (e.preventDefault) e.preventDefault();
if (e.stopPropagation) e.stopPropagation();
return;
}
} //当为小数正则表达式时，不进行小数点正则检查
if (regExp.test('0.0') && e.target.value && e.target.value != '' && e.target.value.indexOf('.') > -1) {
if (typeof this.props.maxValue == 'number' && !isNaN(Number(value)) && this.props.maxValue < Number(value)) {
value = this.props.maxValue;
}
if (this.props.maxValue == 0 && !isNaN(Number(value)) && 0 < Number(value)) {
value = 0;
}
if (typeof this.props.maxValue == 'number' && !isNaN(Number(value)) && this.props.minValue > Number(value)) {
value = this.props.minValue;
}
if (this.props.minValue == 0 && !isNaN(Number(value)) && 0 > Number(value)) {
value = 0;
}
this.setState({
value: value
});
if (this.props.timeout) {
var keyRandom = Math.floor(Math.random() * 10000000);
this.keyRandom = keyRandom;
clearTimeout(this.time);
this.time = setTimeout(function () {
if (keyRandom == _this2.keyRandom) {
_this2.state.oldValue != value && _this2.props.onChange && _this2.props.onChange(value);
}
}, 100);
} else {
this.state.oldValue != value && this.props.onChange && this.props.onChange(value);
}
} //是数字或者是空或者是-
if (!isNaN(number.clearThousPos(value, true)) && regExp.test(number.clearThousPos(value)) || value === '' || value === '-' || value == '=') {
if (typeof this.props.maxValue == 'number' && !isNaN(Number(value)) && this.props.maxValue < Number(value)) {
value = this.props.maxValue;
}
if (this.props.maxValue == 0 && !isNaN(Number(value)) && 0 < Number(value)) {
value = 0;
}
if (typeof this.props.maxValue == 'number' && !isNaN(Number(value)) && this.props.minValue > Number(value)) {
value = this.props.minValue;
}
if (this.props.minValue == 0 && !isNaN(Number(value)) && 0 > Number(value)) {
value = 0;
}
this.setState({
value: value
});
if (this.props.timeout) {
var _keyRandom = Math.floor(Math.random() * 10000000);
this.keyRandom = _keyRandom;
clearTimeout(this.time);
this.time = setTimeout(function () {
if (_keyRandom == _this2.keyRandom) {
if (_this2.state.oldValue == '' && value == '-') {
console.log('keyRandom:' + _this2.state.oldValue + " newValue:" + value);
value = '';
}
_this2.state.oldValue != value && _this2.props.onChange && _this2.props.onChange(value);
}
}, 100);
} else {
this.state.oldValue != value && this.props.onChange && this.props.onChange(value);
}
}
}
}, {
key: "getStep",
value: function getStep(str) {
var strAfterPoint = (str + '').split('.')[1];
return strAfterPoint && strAfterPoint.length ? strAfterPoint.length : 0;
}
}, {
key: "onBlur",
value: function onBlur() {
var value = this.state.value; //最后一个字符是.或者-那么去掉
if (value && (value.charAt(value.length - 1) === '.' || value === '-')) {
value = value.slice(0, -1);
value = this.getCurrentValidValue(value);
value = this.toPrecisionAsStep(this.toNumber(value));
this.setState({
value: value + ''
});
this.state.oldValue != value && this.props.onChange && this.props.onChange(value, this.toPrecisionAsStep(this.toNumber(value)));
}
if (value == '' && this.props.nullToZero) {
value = 0;
}
value = this.getCurrentValidValue(value);
value = this.toPrecisionAsStep(this.toNumber(value));
this.setState({
value: value + ''
});
if (this.props.executeBlur) {
/**
* 业务，填制凭证金额由于ONCHANGE事件，导致oldvalue与value永远相等，onblur事件一直执行
*/
this.props.onBlur && this.props.onBlur(value);
} else {
this.state.oldValue != value && this.props.onBlur && this.props.onBlur(value);
}
}
}, {
key: "getRegExp",
value: function getRegExp() {
var regExp;
if (this.props.regex) {
regExp = new RegExp(this.props.regex);
} else {
if (this.props.precision) {
regExp = new RegExp("^(-?[0-9]+)(?:\\.[0-9]{1," + this.props.precision + "})?$");
} else if (this.props.precision == 0) {
regExp = new RegExp(/^(-?[0-9]+)?$/);
} else {
regExp = new RegExp(/^(-?[0-9]+)(?:\.[0-9]{1,12})?$/);
}
}
return regExp;
}
}, {
key: "handleKeyUp",
value: function handleKeyUp(e) {
var repValue = e.target.value; //[\u4e00-\u9fa5] 中文正则表达式 将中文替换为空，实现Input无法输入中文的功能
if (e.target.value.indexOf('.') != -1) {
repValue = e.target.value.replace('。', '');
}
repValue = repValue.replace(/[\u4e00-\u9fa5]/g, ''); //录入了字母+中文时，字母会被录入
var regExp = this.getRegExp(); //若regex为小数正则，则忽略小数点.
if (regExp.test('0.0') && e.target.value && e.target.value.indexOf(".") == 0 && e.target.value != '-.' || regExp.test('-1') && e.target.value == '-' || e.target.value != '-.') {
if (!regExp.test(e.target.value)) {
if (e.preventDefault) e.preventDefault();
if (e.stopPropagation) e.stopPropagation();
return;
}
} else {
if (!regExp.test(repValue)) {
repValue = '';
}
}
this.setState({
value: repValue
});
this.props.onKeyUp && this.props.onKeyUp(e);
}
}, {
key: "render",
value: function render() {
var className = classNames(_defineProperty({
'mk-input-number': true
}, this.props.className, !!this.props.className));
return /*#__PURE__*/React__default.createElement(Input, _extends({}, this.props, {
autoComplete: "off",
className: className,
onChange: this.onChange.bind(this),
onKeyDown: this.onKeyDown.bind(this),
onKeyUp: this.handleKeyUp.bind(this),
onFocus: this.handleFocus.bind(this),
value: this.state.value,
onBlur: this.onBlur.bind(this)
}));
}
}]);
return InputNumberComponent;
}(Component);
var _excluded = ["tooltip", "visible"];
var defaultTooltip = {
show: '显示密码',
hide: '隐藏密码'
}; // const HoverIcon = `
// cursor: pointer;
// &:hover {
// color: #40a9ff
// }
// `
var Suffix = function Suffix(_ref) {
var _ref$tooltip = _ref.tooltip,
tooltip = _ref$tooltip === void 0 ? defaultTooltip : _ref$tooltip,
_ref$visible = _ref.visible,
visible = _ref$visible === void 0 ? false : _ref$visible,
otherProps = _objectWithoutProperties(_ref, _excluded);
return /*#__PURE__*/React__default.createElement(Tooltip, {
title: visible ? tooltip.hide : tooltip.show
}, visible ? /*#__PURE__*/React__default.createElement(Icon, _extends({
type: "eye"
}, otherProps)) : /*#__PURE__*/React__default.createElement(Icon, _extends({
type: "eye-invisible"
}, otherProps)));
};
Suffix.propTypes = {
tooltip: PropTypes.object,
visible: PropTypes.bool
};
function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
var InputComponent = /*#__PURE__*/function (_Component) {
_inherits(InputComponent, _Component);
var _super = _createSuper(InputComponent);
function InputComponent(props) {
var _this;
_classCallCheck(this, InputComponent);
_this = _super.call(this, props);
_this.state = {
regex: "",
//录入规则 内容为正则表达式
value: "",
visible: false
};
_this.assitShouldComponent = function (target) {
var obj = {};
for (var _i = 0, _Object$entries = Object.entries(target); _i < _Object$entries.length; _i++) {
var _Object$entries$_i = _slicedToArray(_Object$entries[_i], 2),
key = _Object$entries$_i[0],
value = _Object$entries$_i[1];
if (typeof value != 'function') {
obj[key] = value;
}
}
return obj;
};
_this.getSelection = function () {
if (window.getSelection) {
return window.getSelection().toString();
} else if (document.getSelection) {
return document.getSelection().toString();
} else if (document.selection) {
return document.selection.createRange().text;
}
};
_this.handleVisible = function () {
_this.setState({
visible: !_this.state.visible
});
};
_this.renderSuffix = function () {
// 打开会导致从空输入后失去焦点
// if (!this.state.value) {
// // hide icon while value is empty
// return null;
// }
return /*#__PURE__*/React__default.createElement(Suffix, {
onClick: _this.handleVisible,
visible: _this.state.visible,
tooltip: _this.props.tooltip
});
};
_this.state = {
value: props.value
};
_this.handleKeyDown = _this.handleKeyDown.bind(_assertThisInitialized(_this));
_this.handleKeyUp = _this.handleKeyUp.bind(_assertThisInitialized(_this));
return _this;
}
_createClass(InputComponent, [{
key: "shouldComponentUpdate",
value: function shouldComponentUpdate(nextProps, nextState) {
// console.log((isequal(this.props, nextProps) && isequal(this.state, nextState)))
return !(isequal(this.assitShouldComponent(this.props), this.assitShouldComponent(nextProps)) && isequal(this.state, nextState));
}
}, {
key: "componentWillReceiveProps",
value: function componentWillReceiveProps(nextProps) {
if (nextProps.value != this.state.value && nextProps.value != this.props.value) {
this.setState({
value: nextProps.value
});
}
}
}, {
key: "handleKeyDown",
value: function handleKeyDown(e) {
//e.keyCode 8:Backspace 46:Delete 27:Esc 9:Tab 37:Left 39:Right 保持Backspace键和Delete键可用
if (e.type !== 'keydown' || e.keyCode == 8 || e.keyCode == 46 || e.keyCode == 27 || e.keyCode == 9 || e.keyCode == 37 || e.keyCode == 39) {
return;
} //进行正则判断
if (this.props.regex) {
//支持Ctrl+C、Ctrl+V粘贴功能
if (e.ctrlKey || e.keyCode == '86' || e.keyCode == '229') {
return;
} // 获取光标当前位置
var cursorPosition = this.getCursorPosition(e.target);
var regExp = new RegExp(this.props.regex); ///^[A-Za-z0-9]+$/)
var selectedText = this.getSelection(); //window.getSelection().toString(),
var checkText, keyCode; //Chrome中小数点的ascii码是110（小键盘）、190（大键盘）
if (e.keyCode == 46 || e.keyCode == 110 || e.keyCode == 190) {
keyCode = 46; //当为小数正则表达式时，不进行小数点正则检查
if (regExp.test('0.0') && e.target.value && e.target.value.indexOf('.') == -1) {
return;
} //189:负号(-) 109:小键盘的负号(-)
} else if (e.keyCode == 189 || e.keyCode == 109) {
// if(!regExp.test(checkText)){
// if (e.preventDefault)
// e.preventDefault()
// if (e.stopPropagation)
// e.stopPropagation()
// return
// }
keyCode = 45; //当为负数正则表达式时，不进行负号正则检查
if (regExp.test('-1') && cursorPosition == 0 && e.target.value.indexOf('-') == -1) {
return;
}
} else {
keyCode = e.keyCode;
}
var stateValue = this.state.value && this.state.value.toString();
if (selectedText != '') {
stateValue = stateValue.replace(selectedText, '');
} //将输入的字符插入数字串中
if (!stateValue) stateValue = '';
if (stateValue.length == cursorPosition) {
checkText = stateValue + this.stringFromCharCode(keyCode);
} else if (cursorPosition == 0) {
checkText = this.stringFromCharCode(keyCode) + stateValue;
} else {
checkText = stateValue.substring(0, cursorPosition) + this.stringFromCharCode(keyCode) + stateValue.substring(cursorPosition);
}
if (!regExp.test(this.clearThousandsPosition(checkText))) {
if (e.preventDefault) e.preventDefault();
if (e.stopPropagation) e.stopPropagation();
return;
}
}
this.props.onKeyDown && this.props.onKeyDown(e);
}
/**
* IE：document.selection
* FireFox：window.getSelection()
* window.getSelection()也只有FireFox和Safari支持 selection 对象
*/
}, {
key: "stringFromCharCode",
value: function stringFromCharCode(keyCode) {
var ret = '';
if (keyCode == 96) {
ret = '0';
} else if (keyCode == 97) {
ret = '1';
} else if (keyCode == 98) {
ret = '2';
} else if (keyCode == 99) {
ret = '3';
} else if (keyCode == 100) {
ret = '4';
} else if (keyCode == 101) {
ret = '5';
} else if (keyCode == 102) {
ret = '6';
} else if (keyCode == 103) {
ret = '7';
} else if (keyCode == 104) {
ret = '8';
} else if (keyCode == 105) {
ret = '9';
} else {
ret = String.fromCharCode(keyCode);
}
return ret;
} //去除千分位
}, {
key: "clearThousandsPosition",
value: function clearThousandsPosition(num) {
var ret;
if (num && num.toString().indexOf(',') > -1) {
ret = num.toString().replace(/,/g, "");
} else {
ret = num;
}
return ret;
}
}, {
key: "getCursorPosition",
value: function getCursorPosition(target) {
var oTxt1 = target;
var cursorPosition = -1;
if (oTxt1.selectionStart != undefined) {
//非IE浏览器
cursorPosition = oTxt1.selectionStart;
} else {
//IE
var range = document.selection.createRange();
range.moveStart("character", -oTxt1.value.length);
cursorPosition = range.text.length;
}
return cursorPosition;
}
}, {
key: "handleKeyUp",
value: function handleKeyUp(e) {
var repValue = e.target.value;
if (this.props.regex) {
//[\u4e00-\u9fa5] 中文正则表达式 将中文替换为空，实现Input无法输入中文的功能
repValue = e.target.value.replace(/[\u4e00-\u9fa5]/g, ''); //录入了字母+中文时，字母会被录入
var regExp = new RegExp(this.props.regex); //若regex为小数正则，则忽略小数点.
if (regExp.test('0.0') && e.target.value && e.target.value.indexOf(".") == 0 && e.target.value != '-.' || regExp.test('-1') && e.target.value == '-' || e.target.value != '-.') ; else {
if (!regExp.test(repValue)) {
repValue = '';
}
}
}
this.setState({
value: repValue
});
this.props.onKeyUp && this.props.onKeyUp(e);
}
}, {
key: "handleChange",
value: function handleChange(e) {
var _this2 = this;
//const value = e.target.validity ? (e.target.validity.valid ? e.target.value : this.state.value) : e.target.value
//IE9一下没有此属性
var value;
if (e.target.validity) {
value = e.target.validity.valid ? e.target.value : this.state.value;
} else {
value = e.target.value;
}
this.setState({
value: value
}); // 有些地方太卡，增加一个节流
if (this.props.timeout) {
var keyRandom = Math.floor(Math.random() * 10000000);
this.keyRandom = keyRandom;
var a = e.target;
setTimeout(function () {
if (keyRandom == _this2.keyRandom) {
_this2.props.onChange && _this2.props.onChange({
target: a
});
}
}, 100);
} else {
this.props.onChange && this.props.onChange(e);
} // this.props.onChange && this.props.onChange(e)
}
}, {
key: "render",
value: function render() {
var className = classNames(_defineProperty({
'mk-input': true
}, this.props.className, !!this.props.className));
var filedType = this.props.type,
type = (this.state.visible == false || this.state.visible == undefined) && filedType == 'password' ? "password" : "text";
return /*#__PURE__*/React__default.createElement(Input, _extends({}, this.props, {
type: type == "password" ? 'password' : this.props.type == 'password' ? 'text' : this.props.type,
value: this.state.value,
className: className,
suffix: filedType == 'password' ? this.renderSuffix() : '',
onChange: this.handleChange.bind(this),
onKeyUp: this.handleKeyUp.bind(this),
onKeyDown: this.handleKeyDown.bind(this)
}));
}
}]);
return InputComponent;
}(Component);
InputComponent.Search = Input.Search;
InputComponent.Group = Input.Group;
InputComponent.Number = InputNumberComponent;
InputComponent.TextArea = Input.TextArea;
InputComponent.Password = Input.Password;
InputComponent.AntNumber = InputNumber;
export { InputComponent as default };