SpreadJS实现基于权限的编辑控制
本帖最后由 Winny 于 2021-11-12 13:10 编辑在实际项目中,对于同一个模板,不同用户登录之后,能编辑的区域可能并不相同,针对当前权限的用户,需要动态的去控制其无法编辑的区域。本文提供有一种根据用户登记来切换可编辑范围的实现方案。要实现此需求,首先要了解SpreadJS中如何进行单元格保护,具体可以参考SpreadJS设置单元格保护 。本文根据权限改变编辑状态的步骤为:
step1: 设置模板单元格标签
右键选中需要根据权限切换编辑状态的单元格,选择标签项,输入对应的标签。这里我将系统用户分为一级用户和二级用户,对应的值都为true。
用于用户不可编辑时,对应的单元格锁定状态需要变为true,因此这里表明,一级用户和二级用户都无法编辑当前单元格。
上方截图表明,二级用户无法编辑当前选中区域。当模板中只有少量单元格用户无法编辑时,其实只需要给这些单元格添加标签即可,对应的标签中输入无法编辑的权限等级。这里其实用数组也可以实现,但是在正式项目中,业务逻辑可能比较复杂,因此用json来表示。
Step2: 设置当前sheet启用保护状态,且所有单元格默认不锁定。
let sheet = spread.getActiveSheet()
let defaultStyle = sheet.getDefaultStyle()
defaultStyle.locked = false
sheet.setDefaultStyle(defaultStyle)
sheet.options.isProtected = true
Step3:解析标签内容,根据标签具体内容设置锁定状态。
for (let i = 0; i < sheet.getRowCount(); i++) {
for (let j = 0; j < sheet.getColumnCount(); j++) {
//没有tag信息跳过
if (sheet.getTag(i, j)) {
let info = JSON.parse(sheet.getTag(i, j))
//当前tag是否存在key值为当前用户的数据项
if (info) {
let range = sheet.getRange(i, j, 1, 1)
range.backColor('#9cf')
range.locked(true)
}
}
}
}
至此,一个简单的根据权限设置编辑状态的例子就基本完成,需要本地测试时,建议下载附件Demo,因为Demo中还有设置内容时的优化点,并且提供了在用户切换时编辑范围的切换。
如上图所示,用户可以点击红色区域中的下拉框,来模拟权限的切换。
测试文件见附件。
页:
[1]