import { shortcut, Widget, extend, createWidget } from "@/core";
import { MultiLayerDownListPopup } from "./popup.downlist";
import { Combo } from "@/base";
import { IconTrigger } from "@/case";

@shortcut()
export class MultiLayerDownListCombo extends Widget {
    static xtype = "bi.multi_layer_down_list_combo";

    static EVENT_CHANGE = "EVENT_CHANGE";
    static EVENT_SON_VALUE_CHANGE = "EVENT_SON_VALUE_CHANGE";
    static EVENT_BEFORE_POPUPVIEW = "EVENT_BEFORE_POPUPVIEW";

    _defaultConfig() {
        return extend(super._defaultConfig(...arguments), {
            baseCls: "bi-multilayer-down-list-combo",
            height: 24,
            items: [],
            adjustLength: 0,
            direction: "bottom",
            trigger: "click",
            container: null,
            stopPropagation: false,
            el: {},
        });
    }

    _init() {
        super._init(...arguments);
        const o = this.options;
        this.popupview = createWidget({
            type: "bi.multi_layer_down_list_popup",
            items: o.items,
            chooseType: o.chooseType,
            value: o.value,
        });

        this.popupview.on(MultiLayerDownListPopup.EVENT_CHANGE, value => {
            this.fireEvent(MultiLayerDownListCombo.EVENT_CHANGE, value);
            this.downlistcombo.hideView();
        });

        this.popupview.on(MultiLayerDownListPopup.EVENT_SON_VALUE_CHANGE, (value, fatherValue) => {
            this.fireEvent(MultiLayerDownListCombo.EVENT_SON_VALUE_CHANGE, value, fatherValue);
            this.downlistcombo.hideView();
        });

        this.downlistcombo = createWidget({
            element: this,
            type: Combo.xtype,
            trigger: o.trigger,
            isNeedAdjustWidth: false,
            container: o.container,
            adjustLength: o.adjustLength,
            direction: o.direction,
            stopPropagation: o.stopPropagation,
            el: createWidget(o.el, {
                type: IconTrigger.xtype,
                extraCls: o.iconCls ? o.iconCls : "pull-down-font",
                width: o.width,
                height: o.height,
            }),
            popup: {
                el: this.popupview,
                stopPropagation: o.stopPropagation,
                maxHeight: 1000,
            },
        });

        this.downlistcombo.on(Combo.EVENT_BEFORE_POPUPVIEW, () => {
            this.fireEvent(MultiLayerDownListCombo.EVENT_BEFORE_POPUPVIEW);
        });
    }

    hideView() {
        this.downlistcombo.hideView();
    }

    showView(e) {
        this.downlistcombo.showView(e);
    }

    populate(items) {
        this.popupview.populate(items);
    }

    setValue(v) {
        this.popupview.setValue(v);
    }

    getValue() {
        return this.popupview.getValue();
    }
}