fastlion-amis
Version:
一种MIS页面生成工具
246 lines (245 loc) • 13.1 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", { value: true });
exports.NumberControlRenderer = void 0;
var tslib_1 = require("tslib");
var react_1 = (0, tslib_1.__importDefault)(require("react"));
var Item_1 = require("./Item");
var classnames_1 = (0, tslib_1.__importDefault)(require("classnames"));
var tpl_1 = require("../../utils/tpl");
var NumberInput_1 = (0, tslib_1.__importDefault)(require("../../components/NumberInput"));
var Select_1 = tslib_1.__importStar(require("../../components/Select"));
var sub_1 = require("../../utils/sub");
var helper_1 = require("../../utils/helper");
var StaticHoc_1 = require("./StaticHoc");
var lodash_1 = require("lodash");
var NumberControl = /** @class */ (function (_super) {
(0, tslib_1.__extends)(NumberControl, _super);
function NumberControl(props) {
var _this = _super.call(this, props) || this;
_this.hasFormat = false;
_this.handleChange = function (inputValue) {
var _a = _this.props, ns = _a.classPrefix, onChange = _a.onChange, resetValue = _a.resetValue, unitOptions = _a.unitOptions;
// Jay 允许输入字符类型的值
// if (inputValue && typeof inputValue !== 'number') {
// return;
// }
// Jay
if (typeof inputValue !== 'number' && inputValue && (_this.props.prefix || _this.props.suffix)) {
if (_this.props.suffix && inputValue.indexOf(_this.props.suffix) === -1) {
inputValue = inputValue.slice(0, -1);
}
_this.props.prefix && inputValue && (inputValue = inputValue.replace(_this.props.prefix, ''));
_this.props.suffix && inputValue && (inputValue = inputValue.replace(_this.props.suffix, ''));
}
// Jay
if (typeof inputValue === 'number' && inputValue !== null && unitOptions && _this.state.unit) {
inputValue = inputValue + _this.state.unit;
}
if (typeof inputValue === 'number' || inputValue == null) {
onChange(inputValue === null ? resetValue !== null && resetValue !== void 0 ? resetValue : null : inputValue);
}
};
// 单位选项的变更
_this.handleChangeUnit = function (option) {
var value = _this.props.value;
var prevUnitValue = _this.state.unit;
_this.setState({ unit: option.value }, function () {
if (value) {
value = value.replace(prevUnitValue, '');
_this.props.onChange(value + _this.state.unit);
}
});
};
_this.handleKeyArrow = function (e) {
var _a, _b;
var _c = _this.props, rowIndex = _c.rowIndex, colIndex = _c.colIndex;
var containerTable = (_b = (_a = _this.dom) === null || _a === void 0 ? void 0 : _a.current) === null || _b === void 0 ? void 0 : _b.closest('table');
var tableId = containerTable === null || containerTable === void 0 ? void 0 : containerTable.getAttribute('table-id');
var inputarray = [];
if (!_this.props.quickEditForm) {
// 触发自己
sub_1.EventSub.emit(tableId + "/" + sub_1.EventEnum.ShowVistiMap, rowIndex, colIndex, true);
// 并稍后聚焦
(0, helper_1.focusInputAndChooseInput)(e.currentTarget, true);
}
// 获取当前表格下的所有输入框
var Donm = containerTable.querySelectorAll("input[class*=\"Number-input\"][col-index=\"" + _this.props.colIndex + "\"]");
for (var index = 0; index < Donm.length; index++) {
if (Donm[index].type === "text" && _this.props.name === Donm[index].name) {
inputarray.push(index);
}
}
if (inputarray.length) {
var _loop_1 = function (index) {
if (Donm[index].type === "text" && _this.props.name === Donm[index].name && e.currentTarget === Donm[index]) {
inputarray.forEach(function (item, i) {
if (item == index) {
if (e.key === "ArrowDown") {
sub_1.EventSub.emit(tableId + "/" + sub_1.EventEnum.ShowVistiMap, rowIndex + 1, colIndex, true); // 广播订阅事件
if (item + 1 >= inputarray.length)
return;
(0, helper_1.focusInputAndChooseInput)(Donm[inputarray[item + 1]], true);
}
else {
sub_1.EventSub.emit(tableId + "/" + sub_1.EventEnum.ShowVistiMap, rowIndex - 1, colIndex, true); // 广播订阅事件
if (item - 1 < 0)
return;
(0, helper_1.focusInputAndChooseInput)(Donm[inputarray[item - 1]], true);
}
}
});
return "break";
}
};
for (var index = 0; index < Donm.length; index++) {
var state_1 = _loop_1(index);
if (state_1 === "break")
break;
}
}
};
_this.handleKeyDown = function (e) {
if ((e.key === "ArrowUp" || e.key === "ArrowDown")) {
e.stopPropagation();
_this.handleKeyArrow(e);
}
};
_this.dom = react_1.default.createRef();
var unit = _this.getUnit();
var unitOptions = (0, Select_1.normalizeOptions)(props.unitOptions);
_this.state = { unit: unit, unitOptions: unitOptions };
return _this;
}
// 解析出单位
NumberControl.prototype.getUnit = function () {
var props = this.props;
if (props.unitOptions && props.unitOptions.length) {
var optionValues = (0, Select_1.normalizeOptions)(props.unitOptions).map(function (option) { return option.value; });
// 如果有值就解析出来作为单位
if (props.value && typeof props.value === 'string') {
var unit = optionValues[0];
// 先找长的字符，这样如果有 ab 和 b 两种后缀相同的也能识别
optionValues.sort(function (a, b) { return b.length - a.length; });
for (var _i = 0, optionValues_1 = optionValues; _i < optionValues_1.length; _i++) {
var optionValue = optionValues_1[_i];
if (props.value.endsWith(optionValue)) {
unit = optionValue;
break;
}
}
return unit;
}
else {
// 没有值就使用第一个单位
return optionValues[0];
}
}
return undefined;
};
NumberControl.prototype.filterNum = function (value) {
if (typeof value !== 'number') {
value = (0, tpl_1.filter)(value, this.props.data);
value = /^[-]?\d+/.test(value) ? +value : undefined;
}
return value;
};
NumberControl.prototype.componentDidUpdate = function (prevProps) {
if (this.props.value !== prevProps.value) {
var unit = this.getUnit();
this.setState({ unit: unit });
}
if (this.props.unitOptions !== prevProps.unitOptions) {
this.setState({ unitOptions: (0, Select_1.normalizeOptions)(this.props.unitOptions) });
}
};
NumberControl.prototype.componentWillUnmount = function () {
this.dom = null;
};
NumberControl.prototype.render = function () {
var _a;
var _this = this;
var _b;
var _c = this.props, className = _c.className, ns = _c.classPrefix, value = _c.value, step = _c.step, precision = _c.precision, max = _c.max, min = _c.min, disabled = _c.disabled, placeholder = _c.placeholder, showSteps = _c.showSteps, borderMode = _c.borderMode, suffix = _c.suffix, prefix = _c.prefix, kilobitSeparator = _c.kilobitSeparator, unitOptions = _c.unitOptions, readOnly = _c.readOnly;
var precisionProps = {};
var finalPrecision = this.filterNum(precision);
if (typeof finalPrecision === 'number') {
precisionProps.precision = finalPrecision;
}
var unit = (_b = this.state) === null || _b === void 0 ? void 0 : _b.unit;
// 数据格式化
var formatter = function (value) {
var _a, _b, _c, _d;
if ((0, lodash_1.isNil)(value) || value === '')
return '';
var precision = (_a = _this.props.precision) !== null && _a !== void 0 ? _a : 0;
var suffix = _this.props.suffix;
var prefix = _this.props.prefix;
var carry = false;
if (_this.hasFormat) {
precision = Math.min((_c = (_b = ("" + value).toString().split('.')[1]) === null || _b === void 0 ? void 0 : _b.length) !== null && _c !== void 0 ? _c : 0, (_d = _this.props.precision) !== null && _d !== void 0 ? _d : 0);
suffix = undefined;
prefix = undefined;
carry = true;
}
value = (0, helper_1.standardValueText)(value + '', {
precision: precision,
prefix: prefix,
suffix: suffix,
kilobitSeparator: kilobitSeparator,
carry: carry
});
return value;
};
// 将数字还原
var parser = function (value) {
if (value) {
prefix && (value = value.replace(prefix, ''));
suffix && (value = value.replace(suffix, ''));
kilobitSeparator && (value = value.replace(/,/g, ''));
}
return value;
};
var finalValue = unit && value && typeof value === 'string'
? value.replace(unit, '')
: value;
return (react_1.default.createElement("div", { ref: this.dom, className: (0, classnames_1.default)(ns + "NumberControl", (_a = {},
_a[ns + "NumberControl--withUnit"] = unitOptions,
_a), className) },
react_1.default.createElement(NumberInput_1.default, { colIndex: this.props.colIndex, value: finalValue, step: step || 1, max: this.filterNum(max), min: this.filterNum(min), formatter: formatter, parser: parser, name: this.props.name || '', onChange: this.handleChange, onBlur: function (e) {
var _a, _b;
(_b = (_a = _this.props).onBlur) === null || _b === void 0 ? void 0 : _b.call(_a, e);
_this.hasFormat = false;
}, onFocus: function () {
_this.hasFormat = true;
}, disabled: disabled, keyboard: this.props.keyboard || false, placeholder: placeholder, precision: finalPrecision, onKeyDown: this.handleKeyDown, showSteps: showSteps, borderMode: borderMode, readOnly: readOnly, prefix: prefix, suffix: suffix }),
unitOptions ? (react_1.default.createElement(Select_1.default, { value: unit, clearable: false, options: this.state.unitOptions || [], onChange: this.handleChangeUnit })) : null));
};
var _a;
NumberControl.defaultProps = {
step: 1,
resetValue: null
};
(0, tslib_1.__decorate)([
(0, StaticHoc_1.supportStatic)(),
(0, tslib_1.__metadata)("design:type", Function),
(0, tslib_1.__metadata)("design:paramtypes", []),
(0, tslib_1.__metadata)("design:returntype", typeof (_a = typeof JSX !== "undefined" && JSX.Element) === "function" ? _a : Object)
], NumberControl.prototype, "render", null);
return NumberControl;
}(react_1.default.Component));
exports.default = NumberControl;
var NumberControlRenderer = /** @class */ (function (_super) {
(0, tslib_1.__extends)(NumberControlRenderer, _super);
function NumberControlRenderer() {
return _super !== null && _super.apply(this, arguments) || this;
}
NumberControlRenderer.defaultProps = (0, tslib_1.__assign)({ validations: 'isNumeric' }, NumberControl.defaultProps);
NumberControlRenderer = (0, tslib_1.__decorate)([
(0, Item_1.FormItem)({
type: 'input-number'
})
], NumberControlRenderer);
return NumberControlRenderer;
}(NumberControl));
exports.NumberControlRenderer = NumberControlRenderer;
//# sourceMappingURL=./renderers/Form/InputNumber.js.map