页面历史

/**
 * 类型：ClientSide
 * 对象：页签组件
 * 事件：onAfterRender
 * 功能描述：切换页签后，调整画布长度为页签绑定组件内容的长度
 */
function main(page: IPage, portlet: IStaticTabsLinkPortlet) {
    // 处理初始化页面的长度
    resizePageHandler('', portlet)

    // 处理切换页签后的页面长度
    portlet.setActiveTabNameChangeHandler(function (activeTabName) {
        resizePageHandler(activeTabName, portlet)
        return activeTabName + ''
    })

    page.appendCss('.theme__page-background__empty-block', `{
        background: none;
    }`)
}

function resizePageHandler(activeTabName?: string, portlet: IStaticTabsLinkPortlet) {
    // 需要延时让页签切换完毕后再处理页面长度
    setTimeout(() => {
         activeTabName = activeTabName || portlet.getActiveTabName()
        resizePage(activeTabName, portlet)
    }, 100)
 }

/**
 * 处理重设画布大小
 */
function resizePage(activeTabName: string, portlet: IStaticTabsLinkPortlet) {
    let links = portlet.getLinksByTabName(activeTabName)
    if (!links.length) return;
    /** 获取页签绑定项的最高 */
    let height = 0
    links.forEach((el: any, index: number) => {
        let portletSlot: any = getSlot(`.db-page div.db-portlet-ui[portletid="${el.id}"]`, true)
        height = Math.max(height, (portletSlot.height + portletSlot.top))
    })

    // 设置仪表盘画布大小
    let layoutSlot: any = getSlot(`.db-page .layout-container`)
    let dataId = '__macro__layout_slot'
    if (!SmartbiXMacro.data[dataId]) {
        SmartbiXMacro.data[dataId] = layoutSlot
    }
    layoutSlot.dom.style.height = Math.min(SmartbiXMacro.data[dataId].height, height) + 'px'

    // 设置最外层的滚动容器的高度
    let scale: any = getPageScale()
    let containerScrollbarSlot: any = getSlot('.db-page .pageContainerForScrollbar')
    containerScrollbarSlot.dom.style.height = parseFloat(layoutSlot.dom.style.height) * scale + 'px'

}
/**
 * 获取目标对象的位置
 */
function getSlot(selector: string, isUpward = false) {
    let dom: any = document.querySelector(selector)
    if (!dom) return;
    if (isUpward) dom = dom.parentElement;
    return {
        dom: dom,
        top: parseInt(dom.style.top || 0),
        left: parseInt(dom.style.left || 0),
        width: parseInt(dom.clientWidth),
        height: parseInt(dom.clientHeight)
    }
}
/**
 * 获取画布缩放比
 */
function getPageScale() { 
    let layoutSlot: any = getSlot('.layout-container')
    let transform = layoutSlot.dom.style.transform
    let scale = 1
    let reg = /scale\((.+?)\)/i
    let value = transform.match(reg)
    value = value[1].replace(/^\(/, '')
    scale = parseFloat(value) || 1
    return scale
}