【web电子表格】实现鼠标提示

function main(page: IPage, portlet: ITableSheetPortlet) {
    createTooltip(portlet.getCell('I2'), portlet.getCustomProperty("I5"));
    createTooltip(portlet.getCell('H2'), portlet.getCustomProperty("H5"));
    createTooltip(portlet.getCell('G2'), portlet.getCustomProperty("G5"));
}

function createTooltip(cell: ISheetCell, tip: Object) {
    let div = document.createElement("div");
    div.style.position = "absolute";
    div.style.border = "1px solid #C4E1FF";
    div.style.padding = "10px";
    div.style.backgroundColor = "#fff"; //设置提示框背景颜色
    div.style.textAlign = 'left';
    div.style.color = 'red';
    div.style.display = 'none';

    div.innerHTML = tip.toString(); //设置提示内容
    let ele = cell.appendChild(div);
    cell.addEventListener('mousemove', function (e: SheetEvent) {
        ele.setStyle({
            left: (e.clientX + 10) + 'px',
            top: e.clientY + 'px'
        });        
        ele.setVisible(true);
    });
    cell.addEventListener('mouseleave', function () {
        ele.setVisible(false);
    });
    return ele;
}

function main(pageServer: IPageServer, portletServer: ITableSheetPortletServer) {
    let sheet = portletServer.getSheetByName("Sheet1"); //根据sheet名称获取sheet
 
    //下面的内容根据单元格，获取要显示出来的内容。并且添加到customProperty中去
    let valueI5 = getDisplayCellValue(sheet, "I5");
    portletServer.setCustomProperty("I5", valueI5);
    let valueH5 = getDisplayCellValue(sheet, "H5");
    portletServer.setCustomProperty("H5", valueH5);
    let valueG5 = getDisplayCellValue(sheet, "G5");
    portletServer.setCustomProperty("G5", valueG5);
}

//获取单元格的值
function getCellValue(cell: any) {
    if (!cell) return null;
    if (typeof cell.length == 'number') {
        let ret = [];
        for (let i = 0; i < cell.length; i++) {
            ret.push(cell[i].value);
        }
        return ret;
    } else {
        return cell.value;
    }
}

//获取单元格的显示值
function getDisplayCellValue(sheet: ISheetServer, position: string) {
    let expandedPositions = sheet.getExpandedPositions(position);
    let cell = sheet.getCell(expandedPositions[0]);
    let value = getCellValue(cell).toString().replaceAll("\\n", "<br>"); //替换换行符。
    return value;
}