fineui/src/widget/dynamicdatetime/dynamicdatetime.timeselect.js

import { shortcut, Widget, isNaturalNumber, parseInt, isNumeric, i18nText, isNull, isEmptyString } from "@/core";
import { SignEditor } from "@/case";

@shortcut()
export class DynamicDateTimeSelect extends Widget {
    static xtype = "bi.dynamic_date_time_select"

    static HOUR = 1
    static MINUTE = 2
    static SECOND = 3

    static EVENT_CONFIRM = "EVENT_CONFIRM"

    props = {
        baseCls: "bi-date-time-select",
    };

    render() {
        return {
            type: "bi.center_adapt",
            items: [{
                type: "bi.vertical_adapt",
                items: [{
                    el: {
                        type: "bi.number_editor",
                        ref: _ref => {
                            this.hour = _ref;
                        },
                        validationChecker (v) {
                            return isNaturalNumber(v) && parseInt(v) < 24;
                        },
                        errorText (v) {
                            if (isNumeric(v)) {
                                return i18nText("BI-Basic_Input_From_To_Number", "\"00-23\"");
                            }
                            
                            return i18nText("BI-Numerical_Interval_Input_Data");
                        },
                        listeners: [{
                            eventName: SignEditor.EVENT_CONFIRM,
                            action: () => {
                                const value = this.hour.getValue();
                                this._checkHour(value);
                                this.hour.setValue(this._formatValueToDoubleDigit(value));
                                this.fireEvent(DynamicDateTimeSelect.EVENT_CONFIRM);
                            },
                        }, {
                            eventName: SignEditor.EVENT_CHANGE,
                            action: () => {
                                const value = this._autoSwitch(this.hour.getValue(), DynamicDateTimeSelect.HOUR);
                                this.hour.setValue(value);
                            },
                        }],
                        width: 60,
                        height: BI.SIZE_CONSANTS.LIST_ITEM_HEIGHT,
                    },
                }, {
                    type: "bi.label",
                    text: ":",
                    width: 20,
                }, {
                    type: "bi.number_editor",
                    ref: _ref => {
                        this.minute = _ref;
                    },
                    validationChecker (v) {
                        return isNaturalNumber(v) && parseInt(v) < 60;
                    },
                    errorText (v) {
                        if (isNumeric(v)) {
                            return i18nText("BI-Basic_Input_From_To_Number", "\"00-59\"");
                        }
                        
                        return i18nText("BI-Numerical_Interval_Input_Data");
                    },
                    listeners: [{
                        eventName: SignEditor.EVENT_CONFIRM,
                        action: () => {
                            const value = this.minute.getValue();
                            this._checkMinute(value);
                            this.minute.setValue(this._formatValueToDoubleDigit(value), DynamicDateTimeSelect.MINUTE);
                            this.fireEvent(DynamicDateTimeSelect.EVENT_CONFIRM);
                        },
                    }, {
                        eventName: SignEditor.EVENT_CHANGE,
                        action: () => {
                            const value = this._autoSwitch(this.getValue(), DynamicDateTimeSelect.MINUTE);
                            this.minute.setValue(value);
                        },
                    }],
                    width: 60,
                    height: BI.SIZE_CONSANTS.LIST_ITEM_HEIGHT,
                }, {
                    type: "bi.label",
                    text: ":",
                    width: 20,
                }, {
                    type: "bi.number_editor",
                    ref: _ref => {
                        this.second = _ref;
                    },
                    validationChecker (v) {
                        return isNaturalNumber(v) && parseInt(v) < 60;
                    },
                    errorText (v) {
                        if (isNumeric(v)) {
                            return i18nText("BI-Basic_Input_From_To_Number", "\"00-59\"");
                        }
                        
                        return i18nText("BI-Numerical_Interval_Input_Data");
                    },
                    listeners: [{
                        eventName: SignEditor.EVENT_CONFIRM,
                        action: () => {
                            const value = this.second.getValue();
                            this._checkSecond(value);
                            this.second.setValue(this._formatValueToDoubleDigit(value));
                            this.fireEvent(DynamicDateTimeSelect.EVENT_CONFIRM);
                        },
                    }],
                    width: 60,
                    height: BI.SIZE_CONSANTS.LIST_ITEM_HEIGHT,
                }],
            }],
        };
    }

    _checkBorder(v) {
        v = v || {};
        this._checkHour(v.hour);
        this._checkMinute(v.minute);
        this._checkSecond(v.second);
    }

    _checkHour(value) {
        this.hour.setDownEnable(parseInt(value) > 0);
        this.hour.setUpEnable(parseInt(value) < 23);
    }

    _checkMinute(value) {
        this.minute.setDownEnable(parseInt(value) > 0);
        this.minute.setUpEnable(parseInt(value) < 59);
    }

    _checkSecond(value) {
        this.second.setDownEnable(parseInt(value) > 0);
        this.second.setUpEnable(parseInt(value) < 59);
    }

    _autoSwitch(v, type) {
        let limit = 0;
        let value = `${v}`;
        switch (type) {
        case DynamicDateTimeSelect.HOUR:
            limit = 2;
            break;
        case DynamicDateTimeSelect.MINUTE:
            limit = 5;
            break;
        default:
            break;
        }
        if (value.length === 1 && parseInt(value) > limit) {
            value = `0${value}`;
        }
        if (value.length === 2) {
            switch (type) {
            case DynamicDateTimeSelect.HOUR:
                this.hour.isEditing() && this.minute.focus();
                break;
            case DynamicDateTimeSelect.MINUTE:
                this.minute.isEditing() && this.second.focus();
                break;
            case DynamicDateTimeSelect.SECOND:
            default:
                break;
            }
        }
        
        return value;
    }

    _formatValueToDoubleDigit(v) {
        if (isNull(v) || isEmptyString(v)) {
            v = 0;
        }
        let value = parseInt(v);
        if (value < 10) {
            value = `0${value}`;
        }
        
        return value;
    }

    _assertValue(v) {
        v = v || {};
        v.hour = this._formatValueToDoubleDigit(v.hour) || "00";
        v.minute = this._formatValueToDoubleDigit(v.minute) || "00";
        v.second = this._formatValueToDoubleDigit(v.second) || "00";
        
        return v;
    }

    getValue() {
        return {
            hour: parseInt(this.hour.getValue()),
            minute: parseInt(this.minute.getValue()),
            second: parseInt(this.second.getValue()),
        };
    }

    setValue(v) {
        v = this._assertValue(v);
        this.hour.setValue(v.hour);
        this.minute.setValue(v.minute);
        this.second.setValue(v.second);
        this._checkBorder(v);
    }
}