@gdjiami/jm-mrc-components/es/date-picker/DatePickerInner.js

移动端可复用组件库

import { __extends, __read } from "tslib";
import React from 'react';
import MultiPicker from '@gdjiami/rmc-picker/es/MultiPicker';
import Picker from '@gdjiami/rmc-picker/es/Picker';
import { Today, isSameYear, isSameMonth, getLastDateOfMonth, isLeap, } from '../calendar';
var defaultDisabledBefore = new Date(0);
var defaultDisabledAfter = new Date(2100, 1, 1);
var monthList = [];
for (var i = 1; i <= 12; i++) {
    monthList.push(i);
}
var DatePickerInner = /** @class */ (function (_super) {
    __extends(DatePickerInner, _super);
    function DatePickerInner(props) {
        var _this = _super.call(this, props) || this;
        _this.handleSelectChange = function (_a) {
            var _b = __read(_a, 3), year = _b[0], month = _b[1], date = _b[2];
            var value = new Date(_this.props.value || 0);
            value.setFullYear(year);
            value.setDate(1);
            value.setMonth(month - 1);
            value.setDate(Math.min(date, getLastDateOfMonth(value)));
            if (_this.props.onChange) {
                _this.props.onChange(value);
            }
        };
        var value = _this.props.value || Today;
        var _a = _this.props, disabledBefore = _a.disabledBefore, disabledAfter = _a.disabledAfter;
        _this.state = {
            yearList: genYearList(value, disabledBefore, disabledAfter),
            monthList: genMonthList(value, disabledBefore, disabledAfter),
            dayList: genDayList(value, disabledBefore, disabledAfter),
            normalizedValue: [
                value.getFullYear(),
                value.getMonth() + 1,
                value.getDate(),
            ],
        };
        return _this;
    }
    DatePickerInner.prototype.componentDidUpdate = function (prevProps, prevState) {
        if (this.props.value &&
            (this.props.disabledBefore !== prevProps.disabledBefore ||
                this.props.disabledAfter !== prevProps.disabledAfter)) {
            var _a = this.props, value = _a.value, disabledBefore = _a.disabledBefore, disabledAfter = _a.disabledAfter;
            this.setState({
                yearList: genYearList(value, disabledBefore, disabledAfter),
                monthList: genMonthList(value, disabledBefore, disabledAfter),
                dayList: genDayList(value, disabledBefore, disabledAfter),
            });
        }
        if (this.props.value && this.props.value !== prevProps.value) {
            var value = this.props.value;
            this.setState({
                normalizedValue: [
                    value.getFullYear(),
                    value.getMonth() + 1,
                    value.getDate(),
                ],
            });
        }
    };
    DatePickerInner.prototype.render = function () {
        var _a = this.state, yearList = _a.yearList, normalizedValue = _a.normalizedValue;
        return (React.createElement(React.Fragment, null,
            React.createElement(MultiPicker, { className: "jm-date-picker__body", selectedValue: normalizedValue, onValueChange: this.handleSelectChange },
                React.createElement(Picker, { className: "jm-date-picker__date" }, yearList.map(function (i) { return (React.createElement(Picker.Item, { value: i, key: i },
                    i,
                    "\u5E74")); })),
                React.createElement(Picker, { className: "jm-date-picker__date" }, this.renderMonth()),
                React.createElement(Picker, { className: "jm-date-picker__date" }, this.renderDay()))));
    };
    DatePickerInner.prototype.renderMonth = function () {
        var _a = this.props, disabledAfter = _a.disabledAfter, disabledBefore = _a.disabledBefore, _b = _a.value, value = _b === void 0 ? Today : _b;
        var monthList = this.state.monthList;
        var list = disabledBefore && isSameYear(disabledBefore, value)
            ? monthList.before
            : disabledAfter && isSameYear(disabledAfter, value)
                ? monthList.after
                : monthList.normal;
        return list.map(function (i) { return (React.createElement(Picker.Item, { value: i, key: i },
            i,
            "\u6708")); });
    };
    DatePickerInner.prototype.renderDay = function () {
        var _a = this.props, disabledAfter = _a.disabledAfter, disabledBefore = _a.disabledBefore, _b = _a.value, value = _b === void 0 ? Today : _b;
        var dayList = this.state.dayList;
        var list = disabledBefore && isSameMonth(disabledBefore, value)
            ? dayList.before
            : disabledAfter && isSameMonth(disabledAfter, value)
                ? dayList.after
                : dayList.normal[value.getMonth() === 1 && isLeap(value.getFullYear())
                    ? 'leap-2'
                    : value.getMonth() + 1];
        return list.map(function (i) { return (React.createElement(Picker.Item, { value: i, key: i },
            i,
            "\u65E5")); });
    };
    return DatePickerInner;
}(React.PureComponent));
export default DatePickerInner;
function genYearList(date, disabledBefore, disabledAfter) {
    if (disabledBefore === void 0) { disabledBefore = defaultDisabledBefore; }
    if (disabledAfter === void 0) { disabledAfter = defaultDisabledAfter; }
    var list = [date.getFullYear()];
    var prev = new Date(date);
    var next = new Date(date);
    var prevFinished = false;
    var nextFinished = false;
    for (var i = 1; i <= 100; i++) {
        if (!prevFinished) {
            prev = new Date(prev);
            prev.setFullYear(prev.getFullYear() - 1);
            if (disabledBefore.getFullYear() > prev.getFullYear()) {
                prevFinished = true;
            }
            else {
                list.unshift(prev.getFullYear());
            }
        }
        if (!nextFinished) {
            next = new Date(next);
            next.setFullYear(next.getFullYear() + 1);
            if (next.getFullYear() > disabledAfter.getFullYear()) {
                nextFinished = true;
            }
            else {
                list.push(next.getFullYear());
            }
        }
    }
    return list;
}
function genMonthList(date, disabledBefore, disabledAfter) {
    if (disabledBefore === void 0) { disabledBefore = defaultDisabledBefore; }
    if (disabledAfter === void 0) { disabledAfter = defaultDisabledAfter; }
    var before = [];
    var after = [];
    var normal = [];
    var sameYear = isSameYear(disabledBefore, disabledAfter);
    for (var i = disabledBefore.getMonth() + 1, l = sameYear ? disabledAfter.getMonth() + 1 : 12; i <= l; i++) {
        before.push(i);
    }
    if (sameYear) {
        after = before;
    }
    else {
        for (var i = 1; i <= disabledAfter.getMonth() + 1; i++) {
            after.push(i);
        }
    }
    for (var i = 1; i <= 12; i++) {
        normal.push(i);
    }
    return { before: before, after: after, normal: normal };
}
function genDayList(date, disabledBefore, disabledAfter) {
    if (disabledBefore === void 0) { disabledBefore = defaultDisabledBefore; }
    if (disabledAfter === void 0) { disabledAfter = defaultDisabledAfter; }
    var before = [];
    var after = [];
    var normal = {};
    var sameMonth = isSameMonth(disabledAfter, disabledBefore);
    for (var i = disabledBefore.getDate(), l = sameMonth
        ? disabledAfter.getDate()
        : getLastDateOfMonth(disabledBefore); i <= l; i++) {
        before.push(i);
    }
    if (sameMonth) {
        after = before;
    }
    else {
        for (var i = 1; i <= disabledAfter.getDate(); i++) {
            after.push(i);
        }
    }
    var tmpDate = new Date(2019, 0, 1);
    for (var i = 0; i < 12; i++) {
        tmpDate.setMonth(i + 1);
        tmpDate.setDate(0);
        var end = tmpDate.getDate();
        tmpDate.setDate(1);
        var dayList = (normal[i + 1] = []);
        for (var j = 1; j <= end; j++) {
            dayList.push(j);
        }
    }
    normal['leap-2'] = [];
    for (var i = 1; i <= 29; i++) {
        normal['leap-2'].push(i);
    }
    return {
        before: before,
        after: after,
        normal: normal,
    };
}