import { shortcut, Widget, createWidget, parseFloat } from "@/core";
import { Msg } from "@/base";
import { NumberEditor } from "@/widget";

@shortcut()
export class FileManager extends Widget {
    static xtype = "demo.number_editor";

    props = { baseCls: "" };

    render() {
        const editor1 = createWidget({
            type: "bi.number_editor",
            validationChecker(v) {
                return parseFloat(v) <= 100 && parseFloat(v) >= 0;
            },
            height: 24,
            width: 150,
            errorText: "hahah",
            watermark: "每个人都是自己健康的第一责任人",
        });
        editor1.on(NumberEditor.EVENT_CHANGE, function () {
            if (parseFloat(this.getValue()) < 1) {
                editor1.setDownEnable(false);
            } else {
                editor1.setDownEnable(true);
            }
            Msg.toast(editor1.getValue());
        });

        const editor2 = createWidget({
            type: "bi.number_editor",
            validationChecker(v) {
                return parseFloat(v) <= 100 && parseFloat(v) >= 0;
            },
            valueFormatter: v => `${v}$`,
            valueParser: v => v.replace(/\$\s?|(,*)/g, ""),
            height: 24,
            width: 150,
            errorText: "hahah",
        });
        editor2.on(NumberEditor.EVENT_CHANGE, function () {
            if (parseFloat(this.getValue()) < 1) {
                editor2.setDownEnable(false);
            } else {
                editor2.setDownEnable(true);
            }
            Msg.toast(editor2.getValue());
        });

        return {
            type: "bi.vertical",
            hgap: 20,
            vgap: 20,
            items: [
                {
                    el: editor1,
                    height: 24,
                },
                {
                    el: editor2,
                    height: 24,
                }
            ],
        };
    }
}