fineui/src/core/controller/controller.popover.js

/**
 * guy
 * popover弹出层控制器, z-index在100w层级
 * @class BI.popoverController
 * @extends BI.Controller
 */
import { Controller } from "./0.controller";
export class PopoverController extends Controller {
    constructor() {
        super();
        this._constructor();
        this.modal = this.options.modal;
    }

    props = {
        modal: true, // 模态窗口
        render: "body"
    }

    init() {
        this.floatManager = {};
        this.floatLayer = {};
        this.floatContainer = {};
        this.floatOpened = {};
        this.zindex = BI.zIndex_popover;
        this.zindexMap = {};
    }

    create(name, options, context) {
        if (this.has(name)) {
            return this;
        }
        const popover = BI.createWidget(options || {}, {
            type: "bi.popover"
        }, context);
        this.add(name, popover, options, context);
        return this;
    }

    open(name) {
        if (!this.has(name)) {
            return this;
        }
        if (!this.floatOpened[name]) {
            this.floatOpened[name] = true;
            const container = this.floatContainer[name];
            container.element.css("zIndex", this.zindex++);
            this.modal && container.element.__hasZIndexMask__(this.zindexMap[name]) && container.element.__releaseZIndexMask__(this.zindexMap[name]);
            this.zindexMap[name] = this.zindex;
            this.modal && container.element.__buildZIndexMask__(this.zindex++);
            this.get(name).setZindex(this.zindex++);
            this.floatContainer[name].visible();
            const popover = this.get(name);
            popover.show && popover.show();
            const W = BI.Widget._renderEngine.createElement(this.options.render).width(),
                H = BI.Widget._renderEngine.createElement(this.options.render).height();
            const w = popover.element.width(), h = popover.element.height();
            let left = (W - w) / 2, top = (H - h) / 2;
            if (left < 0) {
                left = 0;
            }
            if (top < 0) {
                top = 0;
            }
            popover.element.css({
                // 这里直接用px就可以
                left: left + "px",
                top: top + "px"
            });
        }
        return this;
    }

    close(name) {
        if (!this.has(name)) {
            return this;
        }
        if (this.floatOpened[name]) {
            delete this.floatOpened[name];
            this.floatContainer[name].invisible();
            this.modal && this.floatContainer[name].element.__releaseZIndexMask__(this.zindexMap[name]);
        }
        return this;
    }

    show(name) {
        return this.open(name);
    }

    hide(name) {
        return this.close(name);
    }

    isVisible(name) {
        return this.has(name) && this.floatOpened[name] === true;
    }

    add(name, popover, options, context) {
        options || (options = {});
        if (this.has(name)) {
            return this;
        }
        this.floatContainer[name] = BI.createWidget({
            type: "bi.absolute",
            cls: "bi-popup-view",
            items: [{
                el: (this.floatLayer[name] = BI.createWidget({
                    type: "bi.absolute",
                    items: [popover]
                }, context)),
                left: 0,
                right: 0,
                top: 0,
                bottom: 0
            }]
        });
        this.floatManager[name] = popover;
        popover.on(BI.Popover.EVENT_CLOSE, () => this.close(name));
        BI.createWidget({
            type: "bi.absolute",
            element: options.container || this.options.render,
            items: [{
                el: this.floatContainer[name],
                left: 0,
                right: 0,
                top: 0,
                bottom: 0
            }]
        });
        return this;
    }

    get(name) {
        return this.floatManager[name];
    }

    has(name) {
        return BI.isNotNull(this.floatManager[name]);
    }

    remove(name) {
        if (!this.has(name)) {
            return this;
        }
        this.floatContainer[name].destroy();
        this.modal && this.floatContainer[name].element.__releaseZIndexMask__(this.zindexMap[name]);
        delete this.floatManager[name];
        delete this.floatLayer[name];
        delete this.zindexMap[name];
        delete this.floatContainer[name];
        delete this.floatOpened[name];
        return this;
    }

    removeAll() {
        BI.each(this.floatContainer, (name, container) => {
            container.destroy();
            this.modal && this.floatContainer[name].element.__releaseZIndexMask__(this.zindexMap[name]);
        });
        this.floatManager = {};
        this.floatLayer = {};
        this.floatContainer = {};
        this.floatOpened = {};
        this.zindexMap = {};
        return this;
    }

    _getZIndex() {
        return this.zindex++;
    }
}