通过宏代码隐藏交互式仪表盘中明细表里的某一列。

系统版本信息：Version: 11.0.89539.24122

 

场景如下：在一个明细表中通过点击某个人的身份证号码，跳转到他个人的详情信息页，因为身份证号码进行脱敏处理了，所以需要添加一个未脱敏的证件号码字段作为参数，但这个未脱敏的证件号码列没脱敏，所以需要隐藏。

 

下图为一个简单的测试表格，是明细表组件，现在需要隐藏证件号码列。

 

由于本人对于JavaScript代码并不熟悉，只能上网查询，以及通过deepseek等AI工具来编写，试了很多种方法，一次都没成功。

 

如图，这是找到的最简单的代码，方法是客服说的，但是报错，请看截图：

 

上面这个失败，后面 AI又给了个代码：

function main(page, component) {
    try {
        // 1. 定义目标列名
        const targetColumnName = "证件号码"; // 按实际列名修改

        // 2. 延迟执行，确保 DOM 加载完成
        setTimeout(() => {
            // 3. 隐藏表头和数据列
            const headers = document.querySelectorAll("th"); // 获取所有表头
            const cells = document.querySelectorAll("td");  // 获取所有数据单元格

            headers.forEach(header => {
                if (header.innerText.trim() === targetColumnName) {
                    header.style.display = "none"; // 隐藏表头
                }
            });

            cells.forEach(cell => {
                if (cell.innerText.trim() === targetColumnName) {
                    cell.style.display = "none"; // 隐藏数据单元格
                }
            });

            console.log(`列 "${targetColumnName}" 隐藏成功！`);
        }, 1000); // 延迟 1 秒确保 DOM 加载完成
    } catch (e) {
        console.error("DOM 操作失败：", e);
    }
}

 

显示隐藏成功，但是无论是刷新页面、预览页面、刷新缓存之后，仍然没有隐藏，如下图：

 

期间有通过AI给的方法来

确认组件类型，如下图：

 

折腾了大半天，最终还是没有解决，希望各位大佬帮忙看看，感激不尽。

 

列号从0开始

onBeforeRender(组件渲染前)

https://wiki.smartbi.com.cn/page ... mp;pageId=136913079

/******************************宏代码说明******************************
* version:Smartbi V11
* 类型：ClientSide
* 对象：交互仪表盘
* 事件：onAfterRender
* 效果描述：隐藏清单表或汇总表指定的列
* 是否可修改：是,需要更新对应war版本，具体版本已在文档中进行说明
*********************************************************************/
// 隐藏列序号，序号从0开始：隐藏第一列和第三列: const indexes = [0,3]
const indexes = [6];
function main(page: IPage, portlet: ITableListPortlet) {
    let type = portlet.getType();
    if (type != "TABLE_DETAIL_LIST" && type != "TABLE_LIST2") {
        return;
    }
    for (let index of indexes) {
        portlet.hideTableColumn(index);
    }
}