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[i].dataField()==deleteCol){
return i
}
}
return index
}

复制代码

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

		自动登录	找回密码
密码			立即注册

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

0 个回复