226 lines
8.6 KiB
JavaScript
226 lines
8.6 KiB
JavaScript
"use strict";
|
||
Object.defineProperty(exports, "__esModule", { value: true });
|
||
var tslib_1 = require("tslib");
|
||
var fast_deep_equal_1 = tslib_1.__importDefault(require("fast-deep-equal"));
|
||
var props_1 = require("./props");
|
||
var utils_1 = require("./utils");
|
||
var fmtEvent_1 = tslib_1.__importDefault(require("../_util/fmtEvent"));
|
||
var value_1 = tslib_1.__importDefault(require("../mixins/value"));
|
||
var component2 = my.canIUse('component2');
|
||
Component({
|
||
props: props_1.PickerDefaultProps,
|
||
data: {
|
||
formatValue: '',
|
||
columns: [],
|
||
visible: false,
|
||
selectedIndex: [],
|
||
},
|
||
mixins: [(0, value_1.default)()],
|
||
tempSelectedIndex: null,
|
||
single: false,
|
||
isChangingPickerView: false,
|
||
onInit: function () {
|
||
this.initData();
|
||
},
|
||
didMount: function () {
|
||
if (!component2) {
|
||
this.initData();
|
||
}
|
||
},
|
||
deriveDataFromProps: function (nextProps) {
|
||
this.updateValue(this.props, nextProps);
|
||
},
|
||
didUpdate: function (prevProps) {
|
||
if (!component2) {
|
||
this.updateValue(prevProps, this.props);
|
||
}
|
||
},
|
||
methods: {
|
||
initData: function () {
|
||
var _this = this;
|
||
var columns = this.getterColumns(this.props.options);
|
||
this.setData({
|
||
columns: columns,
|
||
}, function () {
|
||
var formatValue = _this.getterFormatText();
|
||
var selectedIndex = _this.getterSelectedIndex();
|
||
_this.setData({
|
||
formatValue: formatValue,
|
||
selectedIndex: selectedIndex,
|
||
});
|
||
});
|
||
},
|
||
updateValue: function (prevProps, currentProps) {
|
||
var _this = this;
|
||
if (!(0, fast_deep_equal_1.default)(prevProps.options, currentProps.options)) {
|
||
var newColums = this.getterColumns(currentProps.options);
|
||
this.setData({
|
||
columns: newColums,
|
||
}, function () {
|
||
// 如果是在滚动过程中columns发生变化，以onChange里抛出的selectedIndex为准
|
||
if (!_this.isChangingPickerView) {
|
||
_this.tempSelectedIndex = null;
|
||
var selectedIndex = _this.getterSelectedIndex();
|
||
_this.setData({
|
||
selectedIndex: selectedIndex,
|
||
});
|
||
}
|
||
_this.isChangingPickerView = false;
|
||
});
|
||
}
|
||
if (!(0, fast_deep_equal_1.default)(currentProps.value, prevProps.value)) {
|
||
var selectedIndex = this.getterSelectedIndex();
|
||
this.tempSelectedIndex = null;
|
||
this.setData({
|
||
selectedIndex: selectedIndex,
|
||
});
|
||
}
|
||
var formatValue = this.getterFormatText();
|
||
if (formatValue !== this.data.formatValue) {
|
||
this.setData({
|
||
formatValue: formatValue,
|
||
});
|
||
}
|
||
},
|
||
getterColumns: function (options) {
|
||
var columns = [];
|
||
if (options.length > 0) {
|
||
if (options.every(function (item) { return item instanceof Array; })) {
|
||
this.single = false;
|
||
columns = options.slice();
|
||
}
|
||
else {
|
||
this.single = true;
|
||
columns = [options];
|
||
}
|
||
}
|
||
return columns;
|
||
},
|
||
defaultFormat: function (value, column) {
|
||
if (column instanceof Array) {
|
||
return column
|
||
.filter(function (c) { return c !== undefined; })
|
||
.map(function (c) {
|
||
if (typeof c === 'object') {
|
||
return c.label;
|
||
}
|
||
return c;
|
||
})
|
||
.join('-');
|
||
}
|
||
return (column && column.label) || column || '';
|
||
},
|
||
getterFormatText: function () {
|
||
var onFormat = this.props.onFormat;
|
||
var columns = this.data.columns;
|
||
var realValue = this.getValue();
|
||
var matchedColumn = (0, utils_1.getStrictMatchedItemByValue)(columns, realValue, this.single).matchedColumn;
|
||
var formatValueByProps = onFormat && onFormat(realValue, matchedColumn);
|
||
if (typeof formatValueByProps !== 'undefined') {
|
||
return formatValueByProps;
|
||
}
|
||
return this.defaultFormat(realValue, matchedColumn);
|
||
},
|
||
getterSelectedIndex: function () {
|
||
var selectedIndex = [];
|
||
var columns = this.data.columns;
|
||
var realValue = this.getValue();
|
||
var value = realValue;
|
||
if (this.single) {
|
||
value = [realValue];
|
||
}
|
||
var _loop_1 = function (i) {
|
||
var column = columns[i];
|
||
var compareValue = value[i];
|
||
if (compareValue === undefined || compareValue === null) {
|
||
selectedIndex[i] = 0;
|
||
}
|
||
var index = column.findIndex(function (c) {
|
||
return c === compareValue || c.value === compareValue;
|
||
});
|
||
if (index === -1) {
|
||
index = 0;
|
||
}
|
||
selectedIndex[i] = index;
|
||
};
|
||
for (var i = 0; i < columns.length; i++) {
|
||
_loop_1(i);
|
||
}
|
||
return selectedIndex;
|
||
},
|
||
onOpen: function () {
|
||
var disabled = this.props.disabled;
|
||
if (!disabled) {
|
||
this.tempSelectedIndex = null;
|
||
this.setData({
|
||
visible: true,
|
||
});
|
||
this.triggerPicker(true);
|
||
}
|
||
},
|
||
triggerPicker: function (visible) {
|
||
var onVisibleChange = this.props.onVisibleChange;
|
||
if (onVisibleChange) {
|
||
onVisibleChange(visible, (0, fmtEvent_1.default)(this.props));
|
||
}
|
||
},
|
||
onMaskDismiss: function () {
|
||
var onCancel = this.props.onCancel;
|
||
this.setData({
|
||
visible: false,
|
||
});
|
||
this.triggerPicker(false);
|
||
if (onCancel) {
|
||
return onCancel((0, fmtEvent_1.default)(this.props, { detail: { type: 'mask' } }));
|
||
}
|
||
},
|
||
onCancel: function () {
|
||
var onCancel = this.props.onCancel;
|
||
this.setData({
|
||
visible: false,
|
||
});
|
||
this.triggerPicker(false);
|
||
if (onCancel) {
|
||
return onCancel((0, fmtEvent_1.default)(this.props, { detail: { type: 'cancel' } }));
|
||
}
|
||
},
|
||
onChange: function (e) {
|
||
var onChange = this.props.onChange;
|
||
var selectedIndex = e.detail.value;
|
||
this.tempSelectedIndex = selectedIndex;
|
||
this.isChangingPickerView = true;
|
||
var _a = (0, utils_1.getMatchedItemByIndex)(this.data.columns, this.tempSelectedIndex, this.single), matchedColumn = _a.matchedColumn, matchedValues = _a.matchedValues;
|
||
this.setData({
|
||
selectedIndex: selectedIndex,
|
||
});
|
||
if (onChange) {
|
||
onChange.call(this, matchedValues, matchedColumn, (0, fmtEvent_1.default)(this.props, e));
|
||
}
|
||
},
|
||
onOk: function () {
|
||
return tslib_1.__awaiter(this, void 0, void 0, function () {
|
||
var result, matchedColumn, matchedValues;
|
||
return tslib_1.__generator(this, function (_a) {
|
||
if (this.tempSelectedIndex) {
|
||
result = (0, utils_1.getMatchedItemByIndex)(this.data.columns, this.tempSelectedIndex, this.single);
|
||
}
|
||
else {
|
||
result = (0, utils_1.getMatchedItemByValue)(this.data.columns, this.getValue(), this.single);
|
||
}
|
||
matchedColumn = result.matchedColumn, matchedValues = result.matchedValues;
|
||
this.setData({
|
||
visible: false,
|
||
});
|
||
this.triggerPicker(false);
|
||
if (!this.isControlled()) {
|
||
this.update(matchedValues);
|
||
}
|
||
if (this.props.onOk) {
|
||
this.props.onOk.call(this, matchedValues, matchedColumn, (0, fmtEvent_1.default)(this.props));
|
||
}
|
||
return [2 /*return*/];
|
||
});
|
||
});
|
||
},
|
||
},
|
||
}); |