"use strict";
import { util } from "../../util/util.js";
class khcMask {
    constructor() {
    }
    //全屏遮罩
    /**
     *
     * 全屏遮罩
     * @param text 遮罩标题
     * @param timeout 指定遮罩显示的持续时间，空则为一直显示，可以通过hide(timeout)关闭。
     * @returns {Promise<unknown>}
     */
    show(text,timeout){
        return new Promise((resolve, reject) => {
            $.blockUI({
                message: `
                        <div class="sk-folding-cube sk-primary">
                            <div class="sk-cube1 sk-cube"></div>
                            <div class="sk-cube2 sk-cube"></div>
                            <div class="sk-cube4 sk-cube"></div>
                            <div class="sk-cube3 sk-cube"></div>
                        </div>
                        <h5 style="color: #444" id="showMaskText">${text}</h5>`,
                css: {
                    backgroundColor: 'transparent',
                    border: '0',
                    zIndex: 9999999
                },
                overlayCSS:  {
                    backgroundColor: '#fff',
                    opacity: 0.8,
                    zIndex: 9999990
                }
            })
            if(!util.isNull(timeout)){
                setTimeout(() =>{
                    $.unblockUI();
                }, timeout);
            }
            resolve();
        });
    }
    hide(timeout){
        if(util.isNull(timeout)){
            timeout=0
        }
        setTimeout(() =>{
            $.unblockUI();
        }, timeout);
    }
    showNewText(text,timeout){
        let thisShowTextEle=document.getElementById('showMaskText');
        if(thisShowTextEle==undefined){
            this.show(text,timeout);
        }else{
            thisShowTextEle.innerText=text;
        }
    }
    /**
     * 局部遮罩
     * @param eleId  元素id
     * @param timeout  默认2秒消失
     */
    showByElement(eleId,timeout=2000){
        $('#'+eleId).block({
            message: '<div class="sk-wave sk-primary"><div class="sk-rect sk-rect1"></div> <div class="sk-rect sk-rect2"></div> <div class="sk-rect sk-rect3"></div> <div class="sk-rect sk-rect4"></div> <div class="sk-rect sk-rect5"></div></div>',
            css: {
                backgroundColor: 'transparent',
                border: '0'
            },
            overlayCSS:  {
                backgroundColor: '#fff',
                opacity: 0.8
            }
        });
        setTimeout(function (){
            $('#'+eleId).unblock();
        },timeout)
    }
}
export { khcMask }
