fineui/src/widget/datetimepane/card.static.datetimepane.js

import { shortcut, Widget, extend, getDate, createWidget, bind, isNull, each, isNotEmptyString, getMonthDays } from "@/core";
import { DatePicker, DateCalendarPopup } from "../date/calendar";
import { Calendar } from "@/case";
import { Navigation } from "@/base";
import { DynamicDateTimeSelect } from "../dynamicdatetime/dynamicdatetime.timeselect";

@shortcut()
export class StaticDateTimePaneCard extends Widget {
    static xtype = "bi.static_date_time_pane_card"

    static EVENT_BEFORE_YEAR_MONTH_POPUPVIEW = "EVENT_BEFORE_YEAR_MONTH_POPUPVIEW"

    _defaultConfig() {
        const conf = super._defaultConfig(...arguments);
        
        return extend(conf, {
            baseCls: "bi-date-time-pane",
            min: "1900-01-01", // 最小日期
            max: "2099-12-31", // 最大日期
            selectedTime: null,
        });
    }

    _init() {
        super._init(...arguments);
        const o = this.options;

        this.today = getDate();
        this._year = this.today.getFullYear();
        this._month = this.today.getMonth() + 1;

        this.selectedTime = o.selectedTime || {
            year: this._year,
            month: this._month,
        };

        this.datePicker = createWidget({
            type: "bi.date_picker",
            behaviors: o.behaviors,
            min: o.min,
            max: o.max,
        });
        this.datePicker.on(DatePicker.EVENT_CHANGE, () => {
            const value = this.datePicker.getValue();
            const monthDay = getMonthDays(getDate(value.year, value.month - 1, 1));
            let day = this.selectedTime.day || 0;
            if (day > monthDay) {
                day = monthDay;
            }
            this.selectedTime = extend(this.selectedTime, {
                year: value.year,
                month: value.month,
            });
            day !== 0 && (this.selectedTime.day = day);
            this.calendar.setSelect(Calendar.getPageByDateJSON(this.selectedTime));
            this.calendar.setValue(this.selectedTime);
            day !== 0 && this.fireEvent(DateCalendarPopup.EVENT_CHANGE);
        });

        this.datePicker.on(DatePicker.EVENT_BEFORE_YEAR_MONTH_POPUPVIEW, () => {
            this.fireEvent(StaticDateTimePaneCard.EVENT_BEFORE_YEAR_MONTH_POPUPVIEW);
        });

        this.calendar = createWidget({
            direction: "custom",
            // logic: {
            //     dynamic: false
            // },
            type: "bi.navigation",
            tab: this.datePicker,
            cardCreator: bind(this._createNav, this),
        });
        this.calendar.on(Navigation.EVENT_CHANGE, () => {
            this.selectedTime = extend(this.calendar.getValue(), this.timeSelect.getValue());
            this.calendar.empty();
            this.setValue(this.selectedTime);
            this.fireEvent(DateCalendarPopup.EVENT_CHANGE);
        });

        createWidget({
            type: "bi.vtape",
            element: this,
            hgap: 10,
            items: [{
                el: this.datePicker,
                height: 40,
            }, this.calendar, {
                el: {
                    type: "bi.dynamic_date_time_select",
                    cls: "bi-split-top",
                    ref: _ref => {
                        this.timeSelect = _ref;
                    },
                    listeners: [{
                        eventName: DynamicDateTimeSelect.EVENT_CONFIRM,
                        action: () => {
                            this.selectedTime = extend(this.calendar.getValue(), this.timeSelect.getValue());
                            this.fireEvent("EVENT_CHANGE");
                        },
                    }],
                },
                height: 40,
            }],
        });

        createWidget({
            type: "bi.absolute",
            element: this,
            items: [{
                el: {
                    type: "bi.layout",
                    cls: "bi-split-top",
                },
                height: 1,
                top: 40,
                left: 0,
                right: 0,
            }],
        });
        this.setValue(o.selectedTime);
    }

    _createNav(v) {
        const date = Calendar.getDateJSONByPage(v);
        const calendar = createWidget({
            type: "bi.calendar",
            logic: {
                dynamic: false,
            },
            min: this.options.min,
            max: this.options.max,
            year: date.year,
            month: date.month,
            day: this.selectedTime.day,
        });
        
        return calendar;
    }

    _getNewCurrentDate() {
        const today = getDate();
        
        return {
            year: today.getFullYear(),
            month: today.getMonth() + 1,
        };
    }

    _setCalenderValue(date) {
        this.calendar.setSelect(Calendar.getPageByDateJSON(date));
        this.calendar.setValue(date);
        this.selectedTime = extend({}, this.timeSelect.getValue(), date);
    }

    _setDatePicker(timeOb) {
        if (isNull(timeOb) || isNull(timeOb.year) || isNull(timeOb.month)) {
            this.datePicker.setValue(this._getNewCurrentDate());
        } else {
            this.datePicker.setValue(timeOb);
        }
    }

    _setCalendar(timeOb) {
        if (isNull(timeOb) || isNull(timeOb.day)) {
            this.calendar.empty();
            this._setCalenderValue(this._getNewCurrentDate());
        } else {
            this._setCalenderValue(timeOb);
        }
    }

    _checkMin() {
        const o = this.options;
        each(this.calendar.getAllCard(), (idx, calendar) => {
            calendar.setMinDate(o.min);
        });
    }

    _checkMax() {
        const o = this.options;
        each(this.calendar.getAllCard(), (idx, calendar) => {
            calendar.setMaxDate(o.max);
        });
    }

    setMinDate(minDate) {
        if (isNotEmptyString(this.options.min)) {
            this.options.min = minDate;
            this.datePicker.setMinDate(minDate);
            this._checkMin();
        }
    }

    setMaxDate(maxDate) {
        if (isNotEmptyString(this.options.max)) {
            this.options.max = maxDate;
            this.datePicker.setMaxDate(maxDate);
            this._checkMax();
        }
    }

    setValue(timeOb) {
        timeOb = timeOb || {};
        this._setDatePicker(timeOb);
        this._setCalendar(timeOb);
        this.timeSelect.setValue({
            hour: timeOb.hour,
            minute: timeOb.minute,
            second: timeOb.second,
        });
    }

    getValue() {
        return this.selectedTime;
    }
}