SpreadJS 纯前端表格控件应用案例:Teammark知识管理库

Stella981
• 阅读 725

由三节课研发的Teammark系统,基于 SpreadJS 二次开发实现,采用行业优秀的工作方法,以Excel模板作为基本的文档范例,满足了客户在线编辑Excel文档的刚性需求。

下面,让我们一起来看看三节课是如何在“Teammark系统”中应用表格技术,实现多人实时协作与“表格文档协同编辑”的。

项目背景

在各个企业内部,员工在工作过程中都会产生若干知识财富,很多企业并没有合适的管理工具或平台将这些知识财富聚集在一起,一旦发生员工离职/转岗的情况,这些知识财富便可能遗失,对于公司来说,这就是一种隐形的价值损失。

由三节课研发的Teammark系统,采用行业优秀的工作方法,以Excel模板作为基本的文档范例,旨在收集员工在工作时的高频场景问题,包括日报周报、会议、项目管理、新人入职、目标管理、协同等。

项目架构图

SpreadJS 纯前端表格控件应用案例:Teammark知识管理库

项目截图

Teammark系统的在线文档预览界面,基于 SpreadJS 二次开发实现,上方保留有类似Excel的表格工具栏,采用扁平化的设计模式,使界面看起来更加清爽简洁。通过使用表格工具栏上的加载模板悬浮窗,可以选择已有模板并快速加载。

SpreadJS 纯前端表格控件应用案例:Teammark知识管理库

借助 SpreadJS 的基本功能,Teammark系统实现了文档在线编辑模块,用户可以在文档中在线编辑。该模块支持多人协同编辑和邀请编辑,用户可以邀请其他人共同编辑文档内容。

SpreadJS 纯前端表格控件应用案例:Teammark知识管理库

在多人协同编辑时,其他人编辑的单元格会有高亮及名称提示。

SpreadJS 纯前端表格控件应用案例:Teammark知识管理库

如果存在编辑冲突(同时编辑同一个单元格),会出现警告提示:

SpreadJS 纯前端表格控件应用案例:Teammark知识管理库

通过系统生成的文档可以在线预览,在线预览时,可对文档进行查询、筛选、排序等操作,方便数据的查找及定位。

SpreadJS 纯前端表格控件应用案例:Teammark知识管理库

表格技术带来的价值(选择表格控件 SpreadJS 的主要原因)

该系统基于 SpreadJS 二次开发实现,为客户带来了类似 Excel 的使用体验,并解决了客户在线编辑Excel文档的刚性需求。

借助 SpreadJS 的 API,系统实现了Excel导入导出、公式计算、在线填报数据、打印报送、实时预览、数据校验、服务端数据交互等功能,为客户提供了科学的表格文档管理方式,提升了企业员工之间的办公效率,使员工的知识财富得以迅速积累。

以上就是三节课应用SpreadJS表格控件技术研发的“Teammark系统”案例展示,如需查看 SpreadJS 的更多应用案例或需要了解 SpreadJS 的更多功能特性,欢迎访问SpreadJS 产品官网

关于SpreadJS 纯前端表格控件

SpreadJS 是一款基于 HTML5 的纯前端表格控件,兼容 450 种以上的 Excel 公式,具备“高性能、跨平台、与 Excel 高度兼容”的产品特性,备受华为、苏宁易购、天弘基金、远光软件等各领域龙头企业的青睐,并被中国软件行业协会认定为“中国优秀软件产品”。SpreadJS 可为用户带来亲切、易用的使用体验,并满足 Web Excel 组件开发、表格文档协同编辑、 数据填报、 类 Excel 报表设计等业务场景,可极大降低企业研发成本和项目交付风险。

点赞
收藏
评论区
推荐文章
blmius blmius
3年前
MySQL:[Err] 1292 - Incorrect datetime value: ‘0000-00-00 00:00:00‘ for column ‘CREATE_TIME‘ at row 1
文章目录问题用navicat导入数据时,报错:原因这是因为当前的MySQL不支持datetime为0的情况。解决修改sql\mode:sql\mode:SQLMode定义了MySQL应支持的SQL语法、数据校验等,这样可以更容易地在不同的环境中使用MySQL。全局s
Wesley13 Wesley13
3年前
java将前端的json数组字符串转换为列表
记录下在前端通过ajax提交了一个json数组的字符串,在后端如何转换为列表。前端数据转化与请求varcontracts{id:'1',name:'yanggb合同1'},{id:'2',name:'yanggb合同2'},{id:'3',name:'yang
皕杰报表之UUID
​在我们用皕杰报表工具设计填报报表时,如何在新增行里自动增加id呢?能新增整数排序id吗?目前可以在新增行里自动增加id,但只能用uuid函数增加UUID编码,不能新增整数排序id。uuid函数说明:获取一个UUID,可以在填报表中用来创建数据ID语法:uuid()或uuid(sep)参数说明:sep布尔值,生成的uuid中是否包含分隔符'',缺省为
待兔 待兔
4个月前
手写Java HashMap源码
HashMap的使用教程HashMap的使用教程HashMap的使用教程HashMap的使用教程HashMap的使用教程22
Jacquelyn38 Jacquelyn38
3年前
2020年前端实用代码段,为你的工作保驾护航
有空的时候,自己总结了几个代码段,在开发中也经常使用,谢谢。1、使用解构获取json数据let jsonData  id: 1,status: "OK",data: 'a', 'b';let  id, status, data: number   jsonData;console.log(id, status, number )
Wesley13 Wesley13
3年前
mysql设置时区
mysql设置时区mysql\_query("SETtime\_zone'8:00'")ordie('时区设置失败,请联系管理员!');中国在东8区所以加8方法二:selectcount(user\_id)asdevice,CONVERT\_TZ(FROM\_UNIXTIME(reg\_time),'08:00','0
Stella981 Stella981
3年前
Django中Admin中的一些参数配置
设置在列表中显示的字段,id为django模型默认的主键list_display('id','name','sex','profession','email','qq','phone','status','create_time')设置在列表可编辑字段list_editable
Stella981 Stella981
3年前
SpreadJS 纯前端表格控件应用案例:资料填报系统
由达美盛研发的资料填报系统,借助SpreadJS纯前端表格控件提供的API,实现了高度类似Excel的数据资料填报审批界面,用户可在线完成打印归档、组卷存储和分析。下面,让我们一起来看看达美盛是如何在“资料填报系统”中应用表格技术,实现“数据填报(https://www.oschina.net/action/GoToLink?urlhttp
Wesley13 Wesley13
3年前
MySQL部分从库上面因为大量的临时表tmp_table造成慢查询
背景描述Time:20190124T00:08:14.70572408:00User@Host:@Id:Schema:sentrymetaLast_errno:0Killed:0Query_time:0.315758Lock_
Python进阶者 Python进阶者
10个月前
Excel中这日期老是出来00:00:00,怎么用Pandas把这个去除
大家好,我是皮皮。一、前言前几天在Python白银交流群【上海新年人】问了一个Pandas数据筛选的问题。问题如下:这日期老是出来00:00:00,怎么把这个去除。二、实现过程后来【论草莓如何成为冻干莓】给了一个思路和代码如下:pd.toexcel之前把这