197 lines
8.3 KiB
JavaScript
197 lines
8.3 KiB
JavaScript
|
"use strict";
|
|||
|
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|||
|
|
var tslib_1 = require("tslib");
|
|||
|
|
var props_1 = require("./props");
|
|||
|
|
var dayjs_1 = tslib_1.__importDefault(require("dayjs"));
|
|||
|
|
var fast_deep_equal_1 = tslib_1.__importDefault(require("fast-deep-equal"));
|
|||
|
|
var util_1 = require("./util");
|
|||
|
|
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.DatePickerDefaultProps,
|
|||
|
|
pickerVisible: false,
|
|||
|
|
data: function () {
|
|||
|
|
return {
|
|||
|
|
currentValue: [],
|
|||
|
|
columns: [],
|
|||
|
|
forceUpdate: 0, // 强制更新picker组件，已知需处理的情况：value超限，但是需要更新format，由于picker的参数均未变化，无法触发picker的渲染
|
|||
|
|
};
|
|||
|
|
},
|
|||
|
|
mixins: [
|
|||
|
|
(0, value_1.default)({
|
|||
|
|
transformValue: function (value) {
|
|||
|
|
return {
|
|||
|
|
value: value ? (0, dayjs_1.default)(value).toDate() : undefined,
|
|||
|
|
needUpdate: true,
|
|||
|
|
};
|
|||
|
|
},
|
|||
|
|
}),
|
|||
|
|
],
|
|||
|
|
didMount: function () {
|
|||
|
|
this.pickerVisible = false;
|
|||
|
|
},
|
|||
|
|
deriveDataFromProps: function (nextProps) {
|
|||
|
|
this.updateValue(this.props, nextProps);
|
|||
|
|
},
|
|||
|
|
didUpdate: function (prevProps) {
|
|||
|
|
if (!component2) {
|
|||
|
|
this.updateValue(prevProps, this.props);
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
methods: {
|
|||
|
|
updateValue: function (prevProps, currentProps) {
|
|||
|
|
if (!(0, util_1.isEqualDate)(prevProps.value, currentProps.value)) {
|
|||
|
|
this.setData({
|
|||
|
|
forceUpdate: this.data.forceUpdate + 1,
|
|||
|
|
});
|
|||
|
|
// 展开状态才更新picker的数据，否则下次triggerVisible触发
|
|||
|
|
if (this.pickerVisible) {
|
|||
|
|
this.setCurrentValue(currentProps);
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
// 当前选中的picker值，处理无cValue时的情况，优先取当前时间，不在时间范围内取开始时间
|
|||
|
|
getCurrentValueWithCValue: function (currentProps) {
|
|||
|
|
var realValue = this.getValue();
|
|||
|
|
var min = currentProps.min, max = currentProps.max, precision = currentProps.precision;
|
|||
|
|
if (realValue) {
|
|||
|
|
return (0, util_1.getValueByDate)(realValue, precision);
|
|||
|
|
}
|
|||
|
|
else {
|
|||
|
|
var now = new Date();
|
|||
|
|
if (!(min && (0, dayjs_1.default)(now).isBefore((0, dayjs_1.default)(min))) &&
|
|||
|
|
!(max && (0, dayjs_1.default)(now).isAfter((0, dayjs_1.default)(max)))) {
|
|||
|
|
return (0, util_1.getValueByDate)(now, precision);
|
|||
|
|
}
|
|||
|
|
else {
|
|||
|
|
return (0, util_1.getValueByDate)(this.getMin(min).toDate(), precision);
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
getMin: function (min) {
|
|||
|
|
return min ? (0, dayjs_1.default)(min) : (0, dayjs_1.default)().subtract(10, 'year');
|
|||
|
|
},
|
|||
|
|
getMax: function (max) {
|
|||
|
|
return max ? (0, dayjs_1.default)(max) : (0, dayjs_1.default)().add(10, 'year');
|
|||
|
|
},
|
|||
|
|
/**
|
|||
|
|
* didUpdate、弹窗打开触发
|
|||
|
|
*/
|
|||
|
|
setCurrentValue: function (currentProps) {
|
|||
|
|
var _this = this;
|
|||
|
|
var currentValue = this.getCurrentValueWithCValue(currentProps);
|
|||
|
|
var newColumns = this.generateData(currentValue, currentProps);
|
|||
|
|
if (!(0, fast_deep_equal_1.default)(newColumns, this.data.columns)) {
|
|||
|
|
this.setData({
|
|||
|
|
columns: newColumns,
|
|||
|
|
}, function () {
|
|||
|
|
_this.setData({
|
|||
|
|
currentValue: currentValue,
|
|||
|
|
});
|
|||
|
|
});
|
|||
|
|
}
|
|||
|
|
else {
|
|||
|
|
this.setData({
|
|||
|
|
currentValue: currentValue,
|
|||
|
|
});
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
// 生成选项数据，didmound、picker change、打开弹窗触发
|
|||
|
|
generateData: function (currentValue, currentProps) {
|
|||
|
|
var precision = currentProps.precision, propsMin = currentProps.min, propsMax = currentProps.max;
|
|||
|
|
var min = this.getMin(propsMin);
|
|||
|
|
var max = this.getMax(propsMax);
|
|||
|
|
if (max < min) {
|
|||
|
|
return [];
|
|||
|
|
}
|
|||
|
|
var currentPickerDay = (0, dayjs_1.default)();
|
|||
|
|
if (currentValue.length > 0) {
|
|||
|
|
currentPickerDay = (0, dayjs_1.default)((0, util_1.getDateByValue)(currentValue));
|
|||
|
|
}
|
|||
|
|
if (currentPickerDay < min || currentPickerDay > max) {
|
|||
|
|
currentPickerDay = min;
|
|||
|
|
}
|
|||
|
|
var newColumns = (0, util_1.getRangeData)(precision, min, max, currentPickerDay);
|
|||
|
|
return newColumns;
|
|||
|
|
},
|
|||
|
|
onChange: function (selectedIndex) {
|
|||
|
|
var _this = this;
|
|||
|
|
selectedIndex = (0, util_1.getValidValue)(selectedIndex);
|
|||
|
|
var _a = this.props, onPickerChange = _a.onPickerChange, format = _a.format, precision = _a.precision;
|
|||
|
|
var date = (0, util_1.getDateByValue)(selectedIndex);
|
|||
|
|
var min = this.getMin(this.props.min);
|
|||
|
|
var max = this.getMax(this.props.max);
|
|||
|
|
if ((0, dayjs_1.default)(date).isBefore(min)) {
|
|||
|
|
date = min.toDate();
|
|||
|
|
selectedIndex = (0, util_1.getValueByDate)(date, precision);
|
|||
|
|
}
|
|||
|
|
if ((0, dayjs_1.default)(date).isAfter(max)) {
|
|||
|
|
date = max.toDate();
|
|||
|
|
selectedIndex = (0, util_1.getValueByDate)(date, precision);
|
|||
|
|
}
|
|||
|
|
var newColumns = this.generateData(selectedIndex, this.props);
|
|||
|
|
if (!(0, fast_deep_equal_1.default)(newColumns, this.data.columns)) {
|
|||
|
|
this.setData({
|
|||
|
|
columns: newColumns,
|
|||
|
|
}, function () {
|
|||
|
|
_this.setData({ currentValue: selectedIndex });
|
|||
|
|
if (onPickerChange) {
|
|||
|
|
var date_1 = (0, util_1.getDateByValue)(selectedIndex);
|
|||
|
|
onPickerChange(date_1, (0, dayjs_1.default)(date_1).format(format), (0, fmtEvent_1.default)(_this.props));
|
|||
|
|
}
|
|||
|
|
});
|
|||
|
|
}
|
|||
|
|
else {
|
|||
|
|
this.setData({ currentValue: selectedIndex });
|
|||
|
|
if (onPickerChange) {
|
|||
|
|
var date_2 = (0, util_1.getDateByValue)(selectedIndex);
|
|||
|
|
onPickerChange(date_2, (0, dayjs_1.default)(date_2).format(format), (0, fmtEvent_1.default)(this.props));
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
onCancel: function (e) {
|
|||
|
|
var onCancel = this.props.onCancel;
|
|||
|
|
if (onCancel) {
|
|||
|
|
onCancel((0, fmtEvent_1.default)(this.props, e));
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
onOk: function () {
|
|||
|
|
var currentValue = this.data.currentValue;
|
|||
|
|
var format = this.props.format;
|
|||
|
|
var date = (0, util_1.getDateByValue)(currentValue);
|
|||
|
|
if (!this.isControlled()) {
|
|||
|
|
this.update(date);
|
|||
|
|
}
|
|||
|
|
if (this.props.onOk) {
|
|||
|
|
this.props.onOk(date, (0, dayjs_1.default)(date).format(format), (0, fmtEvent_1.default)(this.props));
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
defaultFormat: function (value, valueStr) {
|
|||
|
|
if (this.props.format && valueStr) {
|
|||
|
|
return valueStr;
|
|||
|
|
}
|
|||
|
|
return '';
|
|||
|
|
},
|
|||
|
|
onFormat: function () {
|
|||
|
|
var _a = this.props, onFormat = _a.onFormat, format = _a.format;
|
|||
|
|
var realValue = this.getValue();
|
|||
|
|
var formatValueByProps = onFormat &&
|
|||
|
|
onFormat(realValue, realValue ? (0, dayjs_1.default)(realValue).format(format) : null);
|
|||
|
|
if (typeof formatValueByProps !== 'undefined') {
|
|||
|
|
return formatValueByProps;
|
|||
|
|
}
|
|||
|
|
return this.defaultFormat(realValue, realValue ? (0, dayjs_1.default)(realValue).format(format) : null);
|
|||
|
|
},
|
|||
|
|
onVisibleChange: function (visible) {
|
|||
|
|
this.pickerVisible = visible;
|
|||
|
|
var onVisibleChange = this.props.onVisibleChange;
|
|||
|
|
if (visible) {
|
|||
|
|
this.setCurrentValue(this.props);
|
|||
|
|
}
|
|||
|
|
if (onVisibleChange) {
|
|||
|
|
onVisibleChange(visible, (0, fmtEvent_1.default)(this.props));
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
},
|
|||
|
|
});
|