fineui/packages/fineui/src/widget/timeinterval/timeinterval.js

import {
    HorizontalFillLayout,
    shortcut,
    extend,
    createWidget,
    i18nText,
    print,
    parseDateTime,
    checkDateVoid,
    checkDateLegal,
    isNotNull
} from "@/core";
import { Single, Label, Bubbles } from "@/base";
import { DynamicDateTimeCombo } from "../dynamicdatetime";

@shortcut()
export class TimeInterval extends Single {
    static xtype = "bi.time_interval";

    constants = {
        height: 24,
        width: 24,
        lgap: 15,
        offset: 0,
        timeErrorCls: "time-error",
    };

    static EVENT_VALID = "EVENT_VALID";
    static EVENT_ERROR = "EVENT_ERROR";
    static EVENT_CHANGE = "EVENT_CHANGE";

    _defaultConfig() {
        const conf = super._defaultConfig(...arguments);

        return extend(conf, {
            extraCls: "bi-time-interval",
            minDate: "1900-01-01",
            maxDate: "2099-12-31",
            height: 24,
            supportDynamic: true,
        });
    }

    render() {
        const o = this.options;
        o.value = o.value || {};
        this.left = this._createCombo(o.value.start, o.watermark?.start);
        this.right = this._createCombo(o.value.end, o.watermark?.end);

        return {
            type: HorizontalFillLayout.xtype,
            columnSize: ["fill", "", "fill"],
            items: [
                {
                    el: this.left,
                },
                {
                    el: {
                        type: Label.xtype,
                        height: o.height,
                        hgap: 5,
                        text: "-",
                        ref: _ref => {
                            this.label = _ref;
                        },
                    },
                },
                {
                    el: this.right,
                }
            ],
        };
    }

    _createCombo(v, watermark) {
        const o = this.options;
        const combo = createWidget({
            type: DynamicDateTimeCombo.xtype,
            timeSelectTypes: o.timeSelectTypes,
            simple: o.simple,
            supportDynamic: o.supportDynamic,
            minDate: o.minDate,
            maxDate: o.maxDate,
            behaviors: o.behaviors,
            watermark,
            value: v,
            height: o.height,
        });
        combo.on(DynamicDateTimeCombo.EVENT_ERROR, () => {
            this._clearTitle();
            Bubbles.hide("error");
            this.element.removeClass(this.constants.timeErrorCls);
            this.fireEvent(TimeInterval.EVENT_ERROR);
        });

        combo.on(DynamicDateTimeCombo.EVENT_VALID, () => {
            Bubbles.hide("error");
            const smallDate = this.left.getKey(),
                bigDate = this.right.getKey();
            if (
                this.left.isValid() &&
                this.right.isValid() &&
                this._check(smallDate, bigDate) &&
                this._compare(smallDate, bigDate)
            ) {
                this._setTitle(i18nText("BI-Time_Interval_Error_Text"));
                this.element.addClass(this.constants.timeErrorCls);
                Bubbles.show("error", i18nText("BI-Time_Interval_Error_Text"), this, {
                    offsetStyle: "center",
                });
                this.fireEvent(TimeInterval.EVENT_ERROR);
            } else {
                this._clearTitle();
                this.element.removeClass(this.constants.timeErrorCls);
            }
        });

        combo.on(DynamicDateTimeCombo.EVENT_FOCUS, () => {
            Bubbles.hide("error");
            const smallDate = this.left.getKey(),
                bigDate = this.right.getKey();
            if (
                this.left.isValid() &&
                this.right.isValid() &&
                this._check(smallDate, bigDate) &&
                this._compare(smallDate, bigDate)
            ) {
                this._setTitle(i18nText("BI-Time_Interval_Error_Text"));
                this.element.addClass(this.constants.timeErrorCls);
                Bubbles.show("error", i18nText("BI-Time_Interval_Error_Text"), this, {
                    offsetStyle: "center",
                });
                this.fireEvent(TimeInterval.EVENT_ERROR);
            } else {
                this._clearTitle();
                this.element.removeClass(this.constants.timeErrorCls);
            }
        });

        // 不知道干啥的,先注释掉
        // combo.on(DynamicDateTimeCombo.EVENT_BEFORE_POPUPVIEW, () => {
        //     this.left.hidePopupView();
        //     this.right.hidePopupView();
        // });

        combo.on(DynamicDateTimeCombo.EVENT_CONFIRM, () => {
            Bubbles.hide("error");
            const smallDate = this.left.getKey(),
                bigDate = this.right.getKey();
            if (
                this.left.isValid() &&
                this.right.isValid() &&
                this._check(smallDate, bigDate) &&
                this._compare(smallDate, bigDate)
            ) {
                this._setTitle(i18nText("BI-Time_Interval_Error_Text"));
                this.element.addClass(this.constants.timeErrorCls);
                this.fireEvent(TimeInterval.EVENT_ERROR);
            } else {
                this._clearTitle();
                this.element.removeClass(this.constants.timeErrorCls);
                this.fireEvent(TimeInterval.EVENT_CHANGE);
            }
        });

        return combo;
    }

    _dateCheck(date) {
        return (
            print(parseDateTime(date, "%Y-%x-%d %H:%M:%S"), "%Y-%x-%d %H:%M:%S") === date ||
            print(parseDateTime(date, "%Y-%X-%d %H:%M:%S"), "%Y-%X-%d %H:%M:%S") === date ||
            print(parseDateTime(date, "%Y-%x-%e %H:%M:%S"), "%Y-%x-%e %H:%M:%S") === date ||
            print(parseDateTime(date, "%Y-%X-%e %H:%M:%S"), "%Y-%X-%e %H:%M:%S") === date
        );
    }

    _checkVoid(obj) {
        const o = this.options;

        return !checkDateVoid(obj.year, obj.month, obj.day, o.minDate, o.maxDate)[0];
    }

    _check(smallDate, bigDate) {
        const smallObj = smallDate.match(/\d+/g),
            bigObj = bigDate.match(/\d+/g);

        return (
            this._dateCheck(smallDate) &&
            checkDateLegal(smallDate) &&
            this._checkVoid({
                year: smallObj[0],
                month: smallObj[1],
                day: smallObj[2],
            }) &&
            this._dateCheck(bigDate) &&
            checkDateLegal(bigDate) &&
            this._checkVoid({
                year: bigObj[0],
                month: bigObj[1],
                day: bigObj[2],
            })
        );
    }

    _compare(smallDate, bigDate) {
        smallDate = print(parseDateTime(smallDate, "%Y-%X-%d %H:%M:%S"), "%Y-%X-%d %H:%M:%S");
        bigDate = print(parseDateTime(bigDate, "%Y-%X-%d %H:%M:%S"), "%Y-%X-%d %H:%M:%S");

        return isNotNull(smallDate) && isNotNull(bigDate) && smallDate > bigDate;
    }

    _setTitle(v) {
        this.left.setTitle(v);
        this.right.setTitle(v);
        this.label.setTitle(v);
    }

    _clearTitle() {
        this.left.setTitle("");
        this.right.setTitle("");
        this.label.setTitle("");
    }

    setMinDate(minDate) {
        const o = this.options;
        o.minDate = minDate;
        this.left.setMinDate(minDate);
        this.right.setMinDate(minDate);
    }

    setMaxDate(maxDate) {
        const o = this.options;
        o.maxDate = maxDate;
        this.left.setMaxDate(maxDate);
        this.right.setMaxDate(maxDate);
    }

    setValue(date) {
        date = date || {};
        this.left.setValue(date.start);
        this.right.setValue(date.end);
    }

    getValue() {
        return {
            start: this.left.getValue(),
            end: this.right.getValue(),
        };
    }
}