ukelli-ui
Version:
Base on React's UI lib. Make frontend's dev simpler and faster.
180 lines (179 loc) • 7.02 kB
JavaScript
var __extends = (this && this.__extends) || (function () {
var extendStatics = function (d, b) {
extendStatics = Object.setPrototypeOf ||
({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
return extendStatics(d, b);
};
return function (d, b) {
extendStatics(d, b);
function __() { this.constructor = d; }
d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
};
})();
var __spreadArrays = (this && this.__spreadArrays) || function () {
for (var s = 0, i = 0, il = arguments.length; i < il; i++) s += arguments[i].length;
for (var r = Array(s), k = 0, i = 0; i < il; i++)
for (var a = arguments[i], j = 0, jl = a.length; j < jl; j++, k++)
r[k] = a[j];
return r;
};
import { Call, IsFunc, HasValue } from 'basic-helper';
import FormControlBasic from '../form-control/form-control-basic';
var checkValuesIsEqual = function (value1, value2) {
if (!value1 || !value2)
return true;
var res;
if (Array.isArray(value1)) {
res = value1.length === value2.length;
}
else {
var valObj1 = Object.keys(value1);
var valObj2 = Object.keys(value2);
if (valObj1.length !== valObj2.length) {
res = false;
}
else {
res = JSON.stringify(valObj1) === JSON.stringify(valObj2);
}
}
return res;
};
var toArr = function (target) {
if (!HasValue(target))
return target;
return Array.isArray(target) ? target : [target];
};
var SelectorBasic = /** @class */ (function (_super) {
__extends(SelectorBasic, _super);
function SelectorBasic(props) {
var _this = _super.call(this, props) || this;
_this.changeValue = function (value, idx) {
var _val = value;
var _a = _this.props, isNum = _a.isNum, isMultiple = _a.isMultiple;
if (isNum)
_val = +_val;
if (HasValue(_val)) {
var selectedValue = _this.getValue();
var nextValue = [];
var targetVal = _val;
var removeItem = void 0;
var addVal = void 0;
if (isMultiple) {
nextValue = Array.isArray(selectedValue) ? __spreadArrays(selectedValue) : [];
var valueIdx = nextValue.indexOf(_val);
if (valueIdx > -1) {
removeItem = nextValue.splice(valueIdx, 1);
// nextValue = RemoveArrayItem(nextValue, _val);
}
else {
nextValue.push(_val);
addVal = [_val];
}
}
else {
nextValue = [_val];
addVal = _val;
}
_this.changeEvent(nextValue, {
prevVal: selectedValue, idx: idx, removeItem: removeItem, addVal: addVal, targetVal: targetVal
});
}
else {
_this.emitChange();
}
};
_this.wrapArrayValToObj = function (values) {
var result = {};
values.forEach(function (val) {
result[val.value] = val.text;
});
return result;
};
/**
* 选择器统一的更改 value 接口，会自动根据自身是否受控组件来更改
* @param {*} nextValue 下一个 value
* @param {...any} other
*/
_this.changeEvent = function (nextValue) {
var other = [];
for (var _i = 1; _i < arguments.length; _i++) {
other[_i - 1] = arguments[_i];
}
var _a = _this.props, isNum = _a.isNum, isMultiple = _a.isMultiple;
if (isNum) {
nextValue.forEach(function (item, idx) {
nextValue[idx] = +item;
});
}
var emitVal = isMultiple ? nextValue : nextValue[0];
_this.emitChange.apply(_this, __spreadArrays([emitVal], other));
if (IsFunc(_this.onChangeValue)) {
_this.onChangeValue.apply(_this, __spreadArrays([emitVal], other));
}
else {
_this.setState({
selectedValue: nextValue,
});
_this.value = nextValue;
}
};
_this.emitChange = function () {
var args = [];
for (var _i = 0; _i < arguments.length; _i++) {
args[_i] = arguments[_i];
}
Call.apply(void 0, __spreadArrays([_this.props.onChange], args));
};
var value = props.value, defaultValue = props.defaultValue;
// 受控模式, 详情请查看 react control form
// selectedValue = [...values];
// value 结构: ['values.value']
_this.value = toArr(HasValue(value) ? value : defaultValue);
_this.state = {
selectedValue: _this.value,
};
_this.wrapValues();
return _this;
}
SelectorBasic.prototype.shouldComponentUpdate = function (nextProps, prevState) {
/** 当 values 发生改变时，重新计算 this.values, 并且清空 value */
if (!checkValuesIsEqual(this.props.values, nextProps.values)) {
this.wrapValues(nextProps.values);
this.changeValue();
}
return true;
};
SelectorBasic.prototype.wrapValues = function (values) {
if (values === void 0) { values = this.props.values; }
var isArrayValues = Array.isArray(values);
this.values = isArrayValues ? values : this.wrapObjValToArr(values);
this.valuesObj = isArrayValues ? this.wrapArrayValToObj(values) : values;
return {
valArr: this.values,
valObj: this.valuesObj
};
};
SelectorBasic.prototype.wrapObjValToArr = function (values) {
if (!values)
return {};
var isNum = this.props.isNum;
return Object.keys(values).map(function (valKey) { return ({
text: values[valKey],
value: isNum ? +valKey : valKey
}); });
};
SelectorBasic.prototype.selectAll = function () {
var _a = this.props.values, values = _a === void 0 ? {} : _a;
this.changeEvent(Object.keys(values), { preVal: this.getValue() });
};
SelectorBasic.prototype.clearAll = function () {
this.changeEvent([], { preVal: this.getValue() });
};
SelectorBasic.prototype.checkIsSelectedAll = function () {
var selectedValue = this.getValue();
return !!this.values && !!selectedValue && (this.values.length === selectedValue.length);
};
return SelectorBasic;
}(FormControlBasic));
export default SelectorBasic;