报表插件（ReportSheet）实现权限控制

收藏

本帖最后由 Ellia.Duan 于 2024-11-28 11:52 编辑

在上篇文章中，我们介绍了如何利用ReportSheet实现员工在线考勤表。
image.png821777038.png

在此基础上，我们添加一些设置，使不同的用户有不同的权限。在查看报表时，可以分权限进行数据填报。

在开始前，我们先回顾下，SpreadJS如何进行权限控制，如果对这部分内容已经熟悉，请直接看第二部分。
一、表单保护
在SpreadJS中，可以利用表单保护将整个表单保护起来，代码如下：

sheet.options.isProtected = true
//或者是
sheet.protect()

复制代码

但是整个表单保护后，没有办法起到权限控制的目的。
接下来，我们了解一个属性是locked属性，它可以作用在cell上，也可以是一片区域range ，或者是style上。我们分别介绍：

sheet.getCell(0,0).locked(false)

复制代码

通过上述代码，我们将A1单元格设置了locked属性为false ，即不锁定。
如果此时加上表单保护的代码，即

sheet.options.isProtected = true
sheet.getCell(0,0).locked(false)

复制代码

这两行代码起到的作用是：在表单保护基础上，仅A1单元格可以编辑，其他单元格不可以编辑。

那么，有的用户有疑问，如果我的大部分单元格都可以编辑，仅仅是一小部分单元格不允许编辑呢？这个也好办。
大家知道，在SpreadJS中如果row=-1表示所有行，column=-1表示所有列，
如果写了下面的代码：

sheet.getCell(-1,-1)

复制代码

则表示获取了整个sheet的所有区域。

sheet.getCell(-1,-1).locked(false)
sheet.getRange(0,0,1,5).locked(true)
sheet.protect()

复制代码

上述三行代码表示，仅第一行前五列不编辑，剩余单元格可以正常编辑。

通过上述几行代码，大家是不是已经对表单保护有了一个基本了解，通过locked属性配合表单保护就可以达到控制单元格是否编辑的效果。
上文还特意到了，我们可以通过style设置locked ，我们来看看是如何实现的吧：
在SpreadJS中，有一个默认样式，可以通过setDefaultStyle设置默认样式。
所以，我们可以将默认样式的locked属性设置为false ,就可以达到全部单元格解锁的目的了，如下代码：

var style = new GC.Spread.Sheets.Style();
style.locked = false;
sheet.setDefaultStyle(style)

复制代码

也可以设置一些单元格可以编辑：

let lockedStyle = new GC.Spread.Sheets.Style()
lockedStyle.locked = true;
lockedStyle.backColor = 'white'
sheet.getRange(-1,0,-1,5).setStyle(lockedStyle)

复制代码

最后加上表单保护

sheet.options.isProtected = true

复制代码

最后我们进行下总结，在SpreadJS中，可以设置整个表单保护，也可以设置大部分单元格可以编辑，也可以设置小部分单元格可以编辑，大部分单元格不可以编辑。核心是将不可编辑的单元格的locked属性置为true ,可以编辑的单元格的locked属性置为false 。

二、报表权限设置
我们将上一篇文章中，文章末尾给出的样式模板文件，在Designer中导入eas.sjs文件，以及启动服务，运行nodeJS
eas.js 启动后，浏览器访问http://localhost:3000/getEas可以看到有数据返回：
image.png659143676.png

此时，我们在Designer中点击预览，发现可以看到数据。

在一些场景中，员工只能查看，不能修改，这个时候我们需要设置表单保护，
image.png548264159.png

当然，也可以通过代码方式设置：

let sheet = spread.getActiveSheetTab()
let templateSheet = sheet.getTemplate()
templateSheet.protect()

复制代码

再来升级一下难度，如果想对日期和请假类型设置锁定，则在表单保护前，点击corner进行全选，右键设置单元格格式，对所有的单元格进行解锁。
image.png93778990.png

然后鼠标选择C5,C6单元格，右键设置单元格格式，对单元格进行锁定。
最后再设置表单保护即可，
此时预览时，发现请假类型及日期无法修改。
当然，也可以通过代码完成：

templateSheet.getCell(-1,-1).locked(false)
templateSheet.getRange(4,2,2,1).locked(true)
templateSheet.protect()

复制代码

以上，就完成了报表的权限设置。

注意：需要对templateSheet进行设置。

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

报表插件（ReportSheet）实现权限控制

0 个回复

SpreadJS 认证

SpreadJS 高级认证