首页 › 教程集锦 › SpreadJS表格（Table）列可见权限控制

Winny 发表于 2021-12-16 18:02:19

SpreadJS表格（Table）列可见权限控制

本帖最后由 Winny 于 2021-12-27 18:19 编辑

在用户实际需求中，根据权限，要隐藏表格（Table）的特定列。但SpreadJS目前对于列可见性的设置只提供整列设置可见性，如：sheet.getCell(-1, 0).visible(false);
上述代码用来设置表单第一列不可见。但该API无法设置某一行或某一列的局部区域不可见。

本文提供了一种设置表格某一列不可见的实现方式，具体方案如下：
1. 创建所有列数组和临时列数组；
let colsInfo = []               //所有列
let tempInfo = []               //临时列

function generateCol(empCol){
    let column1 = new GC.Spread.Sheets.Tables.TableColumn(1,'orderDate','订单日期')
    empCol.push(column1)

    let column2 = new GC.Spread.Sheets.Tables.TableColumn(2,'item','明细',)
    empCol.push(column2)
   
    let column3 = new GC.Spread.Sheets.Tables.TableColumn(3,'cost','金额','$#,##0.00')
    empCol.push(column3)

    let checkBox = new GC.Spread.Sheets.CellTypes.CheckBox()
    checkBox.textTrue('是')
    checkBox.textFalse('否')
    let column4 = new GC.Spread.Sheets.Tables.TableColumn(4,'isCash','是否现金',null,checkBox,'isCash')
    empCol.push(column4)
   
    return empCol
}

colsInfo = generateCol(colsInfo)
tempInfo = generateCol(tempInfo)
2. 创建表格，初始绑定所有列；
let table = sheet.tables.add('table01',1,1,4,4,GC.Spread.Sheets.Tables.TableThemes.light1)；
table.bindColumns(colsInfo)
3. 创建隐藏某一列按钮，点击按钮时在临时列中删除对应列；spread.bind(GC.Spread.Sheets.Events.ButtonClicked,function(s,e){
    let {row,col,sheet} = e
    let deleteCol = sheet.getCell(row,col).value()
    sheet.suspendPaint()
    if(deleteCol!=='reset'){
      let index = findColIndex(deleteCol)
      if(index > -1){
            tempInfo.splice(index,1)
            let table = sheet.tables.findByName('table01')
            let range = table.range()
            sheet.tables.remove(table);
            let newTable = sheet.tables.add('table01',range.row,range.col,range.rowCount,tempInfo.length,GC.Spread.Sheets.Tables.TableThemes.light1)
            newTable.bindColumns(tempInfo)
      }
    }else{
            let table = sheet.tables.findByName('table01')
            let range = table.range()
            sheet.tables.remove(table);
            let newTable = sheet.tables.add('table01',range.row,range.col,range.rowCount,colsInfo.length,GC.Spread.Sheets.Tables.TableThemes.light1)
            newTable.bindColumns(colsInfo)
            tempInfo = generateCol([])
    }
    sheet.resumePaint()
})

function findColIndex(deleteCol){
    let index = -1
    for(let i = 0;i<tempInfo.length;i++){
      if(tempInfo.dataField()==deleteCol){
            return i
      }
    }
    return index
}

demo演示地址：https://jscodemine.grapecity.com/share/xZjphOykbU2p7_kIzvIInw/
演示项目服务器在国外，因此访问较慢，可以耐心等待一会。
demo演示动图见文章末尾。

查看完整版本: SpreadJS表格（Table）列可见权限控制