自定义vxe-table表头标题文字过多，显示两行多余省略号并给出tooltip

let tooltipDiv = document.createElement('div')
tooltipDiv.setAttribute("class","vxe-table--tooltip-wrapper")
document.body.appendChild(tooltipDiv);

mounted() {
    let that = this
setTimeout( () => {
                const tooltipDom = document.querySelector('.vxe-table--tooltip-wrapper')

                let th =document.querySelectorAll('.vxe-table--header th.vxe-header--column')


                let storeColumn = this.$store.state.autoFilter.columnTitleObj

                for(let i=0;i<th.length;i++){
                    let colid = th[i].getAttribute("colid")
                    let currColumn = that.$refs.table.getColumnById(colid)
                    let isTooltip = false
                    let orgTitle = ''
                    for(let j = 0; j < storeColumn.length; j++){
                        if(storeColumn[j]['prop'] == currColumn['property']){
                            isTooltip = storeColumn[j]['tooltip']
                            orgTitle = storeColumn[j]['orgTitle']
                            break
                        }
                    }

                    if(isTooltip){
                        th[i].addEventListener('mouseenter',(e) => {

                            const { scrollTop, scrollLeft, visibleWidth } = this.$TOOL.getDomNode()
                            const { top, left } = this.$TOOL.getAbsolutePos(e.target)
                            const el = th[i]
                            const marginSize = 6
                            const offsetHeight = el.offsetHeight
                            const offsetWidth = el.offsetWidth
                            let tipLeft = left
                            //let tipTop = top - offsetHeight - marginSize
                            tipLeft = Math.max(marginSize, left + Math.floor((e.target.offsetWidth - offsetWidth) / 2))
                            if (tipLeft + offsetWidth + marginSize > scrollLeft + visibleWidth) {
                                tipLeft = scrollLeft + visibleWidth - offsetWidth - marginSize
                            }
                            if (top - offsetHeight < scrollTop + marginSize) {
                                //tipStore.placement = 'bottom'
                                //tipTop = top + e.target.offsetHeight + marginSize
                            }

                            let arrowLeft = `${left - tipLeft + e.target.offsetWidth / 2}px`


                            tooltipDom.classList.add("theme--dark","size--small","placement--top","is--enterable",
                                "is--visible","is--arrow","is--actived")
                            tooltipDom.setAttribute("style","width:auto;left:"+tipLeft+"px;top:126px;z-index:1000;")

                            tooltipDom.innerHTML = '<div class="vxe-table--tooltip-content">'+orgTitle+'</div><div class="vxe-table--tooltip-arrow" style="left:'+arrowLeft+'"></div>'

                        })

                        th[i].addEventListener( 'mouseleave',() => {
                            console.log('鼠标移出')
                            tooltipDom.classList.remove("placement--top","is--visible","is--actived")
                        })

                    }


                }

            },1500)
}

/**
 * 获取某DOM节点的信息
 * @param elem {object} DOM节点
 * @returns {{boundingLeft: number, visibleWidth: *, top: *, left: *, boundingTop: number, visibleHeight: *}}
 */
tool.getAbsolutePos = function(elem){
    const bounding = elem.getBoundingClientRect()
    const boundingTop = bounding.top
    const boundingLeft = bounding.left
    const { scrollTop, scrollLeft, visibleHeight, visibleWidth } = this.getDomNode()
    return { boundingTop, top: scrollTop + boundingTop, boundingLeft, left: scrollLeft + boundingLeft, visibleHeight, visibleWidth }
}
/**
 * 获取body DOM对象相关信息
 * @returns {{visibleWidth: number, visibleHeight: number, scrollLeft: number, scrollTop: number}}
 */
tool.getDomNode = function() {
    const documentElement = document.documentElement
    const bodyElem = document.body
    return {
        scrollTop: documentElement.scrollTop || bodyElem.scrollTop,
        scrollLeft: documentElement.scrollLeft || bodyElem.scrollLeft,
        visibleHeight: documentElement.clientHeight || bodyElem.clientHeight,
        visibleWidth: documentElement.clientWidth || bodyElem.clientWidth
    }
}

export default {
    state: {
        columnTitleObj: [], //列表头标题
        orgTitle: '', //原表头标题
    },
    mutations:{
        SET_COLUMN_TITLE(state,item){
            state.columnTitleObj = item
        },
        SET_ORG_TITLE(state,item){
            state.orgTitle = item
        },
    }
}

resizableChange({column}){
let orgColumn = this.$store.state.autoFilter.columnTitleObj

                for(let i = 0; i < orgColumn.length; i++){
                    if(orgColumn[i].prop == column.property){
                        this.$store.commit("SET_ORG_TITLE", orgColumn[i]['orgTitle'])
                        break
                    }
                }

                let orgTitle = this.$store.state.autoFilter.orgTitle

                let l = orgTitle.length //column.title.length
                let f = 16 //每一个字大小，实际上是每一个字的比例值，大概会比字体大小差很少大一点，


                let subLen = ~~(2 * (Number(column['resizeWidth']) - 30 )) / f

                let lineCount = ~~((Number(column['resizeWidth']) - 30 ) / f)
                let showTextNum = 2 * lineCount


                let isTooltip = false
                if(l > showTextNum){
                    column.title = this.$TOOL.subString(orgTitle,10,true)
                    isTooltip = true


                }else{
                    column.title = this.$TOOL.subString(orgTitle,subLen,false)
                    isTooltip = false

                }

                for(let i = 0; i < orgColumn.length; i++){
                    if(orgColumn[i].prop == column.property){
                        orgColumn[i].tooltip = isTooltip
                        break
                    }
                }

                this.$store.commit("SET_COLUMN_TITLE", orgColumn)
}