yylib-quick-mobile/source/yylib/calendar/YYCalendarRange.js

yylib-quick-mobile

'use strict';

Object.defineProperty(exports, "__esModule", {
    value: true
});

var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();

var _react = require('react');

var _react2 = _interopRequireDefault(_react);

var _Help = require('./Help');

var _Help2 = _interopRequireDefault(_Help);

require('./YYCalendarRange.less');

function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }

function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }

function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }

var Calendar = function (_React$Component) {
    _inherits(Calendar, _React$Component);

    function Calendar(props) {
        _classCallCheck(this, Calendar);

        var _this = _possibleConstructorReturn(this, (Calendar.__proto__ || Object.getPrototypeOf(Calendar)).call(this, props));

        _this.state = {
            select_year: _Help2.default.getFullYear(props.beginDate),
            select_month: _Help2.default.getMonth(props.beginDate),
            select_day: 1,
            click_day: null,
            date_num_array: [],
            current_year: _Help2.default.getFullYear(),
            current_month: _Help2.default.getMonth(),
            current_day: _Help2.default.getDay(),
            weekDay: null };
        return _this;
    }

    _createClass(Calendar, [{
        key: 'componentDidMount',
        value: function componentDidMount() {
            if (this.props.endDate) {
                this.setState({ endDate: this.props.endDate, beginDate: this.props.beginDate ? this.props.beginDate : new Date() });
            } else if (this.props.dayCount) {
                var beginSetDate = this.props.beginDate ? this.props.beginDate : new Date();
                var beginDate = this.getWorkDay(beginSetDate);
                this.setEndDate(beginDate);
            }
        }
    }, {
        key: 'setEndDate',
        value: function setEndDate(beginDate) {
            var _props = this.props,
                dayCount = _props.dayCount,
                onlyWorkDay = _props.onlyWorkDay;

            var endDate = Date.parse(_Help2.default.pattern(beginDate, "yyyy-MM-dd"));
            if (!isNaN(parseInt(dayCount))) {
                dayCount = parseInt(dayCount);
                var count = 0;

                for (var index = 0; index < dayCount; index++) {
                    endDate = this.addOneDay(endDate);
                    if (onlyWorkDay) {
                        if (!this.isWeek(endDate)) {
                            count++;
                        }
                    } else {
                        count++;
                    }
                }
                if (count < dayCount) {
                    for (var index = 0; index < 100; index++) {
                        endDate = this.addOneDay(endDate);
                        if (onlyWorkDay) {
                            if (!this.isWeek(endDate)) {
                                count++;
                            }
                        } else {
                            count++;
                        }

                        if (count == dayCount) {
                            break;
                        }
                    }
                }
                this.setState({ beginDate: beginDate, endDate: endDate });
            }
        }
    }, {
        key: 'getWorkDay',
        value: function getWorkDay(date) {
            if (this.props.onlyWorkDay && this.isWeek(date)) {
                date = this.addOneDay(date);
                if (this.isWeek(date)) {
                    date = this.getWorkDay(date);
                }
            }
            return date;
        }
    }, {
        key: 'addOneDay',
        value: function addOneDay(date) {
            if (!(date instanceof Date)) {
                date = new Date(date);
            }
            date.setDate(date.getDate() + 1);
            return date;
        }
    }, {
        key: '_initMonthDayNumber',
        value: function _initMonthDayNumber(year) {
            var _date_array = [];
            for (var i = 0; i < 12; i++) {
                switch (i + 1) {
                    case 1:
                    case 3:
                    case 5:
                    case 7:
                    case 8:
                    case 10:
                    case 12:
                        _date_array.push(31);
                        break;
                    case 4:
                    case 6:
                    case 9:
                    case 11:
                        _date_array.push(30);
                        break;
                    case 2:
                        if (_Help2.default.isLeapYear(year)) {
                            _date_array.push(29);
                        } else {
                            _date_array.push(28);
                        }
                        break;
                    default:
                        break;
                }
            }

            return _date_array;
        }
    }, {
        key: 'componentWillMount',
        value: function componentWillMount() {
            var date_num_array = this._initMonthDayNumber(this.state.select_year);
            var weekDay = _Help2.default.weekOfMonth(this.getFullDate(this.state.select_year, this.state.select_month + 1, 1));
            this.setState({ date_num_array: date_num_array, weekDay: weekDay });
        }
    }, {
        key: 'selectDate',
        value: function selectDate(s_day) {
            var _this2 = this;

            var _state = this.state,
                select_year = _state.select_year,
                select_month = _state.select_month;

            var clickDate = this.getFullDate(select_year, select_month + 1, s_day);
            this.setState({
                click_day: clickDate
            }, function () {
                _this2.props.onSelectDate && _this2.props.onSelectDate(clickDate);
            });
        }
    }, {
        key: 'previousMonth',
        value: function previousMonth() {
            var _this3 = this;

            var _state2 = this.state,
                select_year = _state2.select_year,
                select_month = _state2.select_month,
                select_day = _state2.select_day,
                date_num_array = _state2.date_num_array,
                weekDay = _state2.weekDay;

            if (select_month === 0) {
                select_year = select_year - 1;
                select_month = 11;
                date_num_array = this._initMonthDayNumber(select_year);
            } else {
                select_month = select_month - 1;
            }
            weekDay = _Help2.default.weekOfMonth(new Date(select_year, select_month, select_day));
            this.setState({
                select_year: select_year,
                select_month: select_month,
                select_day: select_day,
                date_num_array: date_num_array,
                weekDay: weekDay
            }, function () {
                _this3.props.onPreviousMonth && _this3.props.onPreviousMonth(select_year, select_month + 1);
            });
        }
    }, {
        key: 'nextMonth',
        value: function nextMonth() {
            var _this4 = this;

            var _state3 = this.state,
                select_year = _state3.select_year,
                select_month = _state3.select_month,
                select_day = _state3.select_day,
                date_num_array = _state3.date_num_array,
                weekDay = _state3.weekDay;

            if (select_month === 11) {
                select_year = +select_year + 1;
                select_month = 0;
                date_num_array = this._initMonthDayNumber(select_year);
            } else {
                select_month = +select_month + 1;
            }
            weekDay = _Help2.default.weekOfMonth(new Date(select_year, select_month, select_day));
            this.setState({
                select_year: select_year,
                select_month: select_month,
                select_day: select_day,
                date_num_array: date_num_array,
                weekDay: weekDay
            }, function () {
                _this4.props.onNextMonth && _this4.props.onNextMonth(select_year, select_month + 1);
            });
        }
    }, {
        key: 'getFullDate',
        value: function getFullDate(year, month, day) {
            if (month == 1) {
                month = "12";
            }
            if ((month + "").length < 2) {
                month = "0" + month;
            }
            if ((day + "").length < 2) {
                day = "0" + day;
            }
            return year + "-" + month + "-" + day;
        }
    }, {
        key: 'compartDate',
        value: function compartDate(date1, date2) {
            if (date1 && date2) {
                if (!(date1 instanceof Date)) {
                    date1 = new Date(date1);
                }
                if (!(date2 instanceof Date)) {
                    date2 = new Date(date2);
                }
                var year1 = _Help2.default.getFullYear(date1);
                var year2 = _Help2.default.getFullYear(date2);
                var month1 = _Help2.default.getMonth(date1);
                var month2 = _Help2.default.getMonth(date2);
                var day1 = _Help2.default.getDay(date1);
                var day2 = _Help2.default.getDay(date2);
                var fullDate1 = this.getFullDate(year1, month1, day1);
                var fullDate2 = this.getFullDate(year2, month2, day2);
                return fullDate1 >= fullDate2;
            }
        }
    }, {
        key: 'isWeek',
        value: function isWeek(date) {
            return _Help2.default.weekOfMonth(date) == 0 || _Help2.default.weekOfMonth(date) == 6;
        }
    }, {
        key: 'getPage',
        value: function getPage() {
            var _state4 = this.state,
                endDate = _state4.endDate,
                beginDate = _state4.beginDate,
                select_year = _state4.select_year,
                select_month = _state4.select_month,
                select_day = _state4.select_day,
                date_num_array = _state4.date_num_array,
                weekDay = _state4.weekDay,
                click_day = _state4.click_day;


            var normal = beginDate && endDate;

            console.log("开始日期:" + _Help2.default.pattern(beginDate, "yyyy-MM-dd"));
            console.log("结束日期:" + _Help2.default.pattern(endDate, "yyyy-MM-dd"));

            var _props2 = this.props,
                weekCount = _props2.weekCount,
                col_number = _props2.col_number,
                tags = _props2.tags,
                onlyWorkDay = _props2.onlyWorkDay;


            var month_day = date_num_array[select_month];

            var all_day = weekCount * col_number;

            var n_day = all_day - weekDay - month_day;

            var previous_month_days = void 0;

            var next_month_days = void 0;

            var previous_month = void 0;

            var next_month = void 0;

            var current_days = [];

            var previous_days = [];

            var next_days = [];

            var total_days = [];

            var startDay = 1;

            if (weekCount == 5) {
                select_day = 1;
            }

            if (select_month === 0) {
                previous_month = 11;
                next_month = 1;
            } else {
                previous_month = select_month - 1;
                next_month = select_month + 1;
            }
            if (select_month === 11) {
                next_month = 0;
            }
            previous_month_days = date_num_array[previous_month];
            next_month_days = date_num_array[next_month];

            var lastDayCount = 0;

            var currentDayCount = 0;

            var nextDayCount = 0;

            var tempDay = weekDay == 0 ? 7 : weekDay;

            lastDayCount = tempDay - select_day > 0 ? tempDay - select_day : 0;

            currentDayCount = all_day - lastDayCount;

            nextDayCount = all_day - lastDayCount - (month_day - select_day) > 0 ? all_day - lastDayCount - (month_day - select_day) : 0;

            if (lastDayCount == 0) {
                startDay = select_day - weekDay + 1;
            }

            for (var i = 0; i < lastDayCount; i++) {
                previous_days.unshift(_react2.default.createElement(
                    'li',
                    { className: 'item-gray', key: 'previous' + i },
                    _react2.default.createElement(
                        'a',
                        { href: 'javascript:void(0)' },
                        previous_month_days - i
                    )
                ));
            }


            for (var _i = 0; _i < currentDayCount; _i++) {
                if (startDay + _i > month_day) break;
                var currentDate = this.getFullDate(select_year, select_month + 1, startDay + _i);
                var currentText = '';
                var currentClassName = '';

                currentText = startDay + _i;
                if (click_day && _Help2.default.equalDate(currentDate, click_day)) {
                    currentClassName = 'item-active';
                }
                if (_Help2.default.equalDate(currentDate, new Date())) {
                    currentClassName = 'item-current';
                }
                if (onlyWorkDay && this.isWeek(currentDate)) {
                    currentClassName = "item-gray";
                }
                if (normal) {
                    if (!this.compartDate(currentDate, beginDate) || this.compartDate(currentDate, endDate)) {
                        currentClassName = "item-gray";
                    }
                }

                tags && tags.length && tags.map(function (tagDate) {
                    if (_Help2.default.equalDate(currentDate, tagDate)) {
                        currentClassName += ' item-tag';
                    }
                });
                current_days.push(_react2.default.createElement(
                    'li',
                    { className: currentClassName, key: 'current' + _i },
                    _react2.default.createElement(
                        'a',
                        { href: 'javascript:;', onClick: this.selectDate.bind(this, _i + 1) },
                        currentText
                    )
                ));
            }

            for (var _i2 = 0; _i2 < nextDayCount; _i2++) {
                if (_i2 + 1 > next_month_days) break;
                next_days.push(_react2.default.createElement(
                    'li',
                    { className: 'item-gray', key: 'next' + _i2 },
                    _react2.default.createElement(
                        'a',
                        { href: 'javascript:;' },
                        _i2 + 1
                    )
                ));
            }
            total_days = [].concat(previous_days, current_days, next_days);
            var ul_list = [];
            if (total_days.length > 0) {
                for (var _i3 = 0; _i3 < weekCount; _i3++) {
                    var li_list = [],
                        start_index = _i3 * col_number,
                        end_index = (_i3 + 1) * col_number;
                    for (var j = start_index; j < end_index; j++) {
                        li_list.push(total_days[j]);
                    }
                    ul_list.push(li_list);
                }
            }

            var currentPage = _react2.default.createElement(
                'div',
                { style: { "display": this.props.visible ? "block" : "none" }, className: 'calendar', key: select_year + "-" + select_month + "-" + select_day },
                _react2.default.createElement(
                    'div',
                    { className: 'calendar-header' },
                    _react2.default.createElement('i', { className: 'icon-left', onClick: this.previousMonth.bind(this) }),
                    _react2.default.createElement(
                        'span',
                        { className: 'calendar-date' },
                        select_year,
                        ' \u5E74 ',
                        select_month + 1,
                        ' \u6708'
                    ),
                    _react2.default.createElement('i', { className: 'icon-right', onClick: this.nextMonth.bind(this) })
                ),
                _react2.default.createElement(
                    'div',
                    { className: 'calendar-body' },
                    _react2.default.createElement(
                        'ul',
                        { className: 'c-body-head' },
                        _react2.default.createElement(
                            'li',
                            null,
                            '\u4E00'
                        ),
                        _react2.default.createElement(
                            'li',
                            null,
                            '\u4E8C'
                        ),
                        _react2.default.createElement(
                            'li',
                            null,
                            '\u4E09'
                        ),
                        _react2.default.createElement(
                            'li',
                            null,
                            '\u56DB'
                        ),
                        _react2.default.createElement(
                            'li',
                            null,
                            '\u4E94'
                        ),
                        _react2.default.createElement(
                            'li',
                            null,
                            '\u516D'
                        ),
                        _react2.default.createElement(
                            'li',
                            null,
                            '\u65E5'
                        )
                    ),
                    _react2.default.createElement(
                        'div',
                        { className: 'c-body-content' },
                        ul_list.map(function (u, index) {
                            return _react2.default.createElement(
                                'ul',
                                { key: 'ul' + index, className: 'content-row' },
                                u
                            );
                        })
                    )
                )
            );
            return currentPage;
        }
    }, {
        key: 'render',
        value: function render() {
            return this.getPage(this.state);
        }
    }]);

    return Calendar;
}(_react2.default.Component);

Calendar.defaultProps = {
    weekCount: 5,
    col_number: 7,
    tags: [],
    beginDate: null,
    endDate: null,
    onlyWorkDay: false,
    dayCount: 0,
    visible: true
};
exports.default = Calendar;