无需编码，实现类Excel体验的交叉填报
本帖最后由 willning 于 2023-6-1 09:44 编辑[*]客户现在用Excel做交叉填报，如何把Excel文件的数据提取出来存入数据库的表？
[*]相比于表单，客户习惯了在同一个表格上做交叉填报，该如何实现？
通常情况下，开发类Excel的交叉填报应用技术难度较高，需要使用葡萄城的SpreadJS纯前端表格控件配合编码开发的后台服务来实现一个专门的Web应用。借助本方案，你可以在活字格低代码开发平台的应用中实现类似功能，而且不用写前端和后端的代码。
https://hac.app.hzgcloud.cn/upload/FileDownloadUpload/Download?file=89d5baec-f75d-4ef9-89f6-ca3fe8a7bd8c_%E4%BA%A4%E5%8F%89%E5%A1%AB%E6%8A%A5-%E6%95%88%E6%9E%9C%E6%BC%94%E7%A4%BA.mp4
什么是交叉填报？
在企业软件中，人们用数据表（因为数据表是一个由行和列构成的二维结构，也被成为二维表）来存储业务数据，这些表遵循了数据库设计范式，每一行表示一条记录。这种做法是软件行业发展数十年的结果，从根本上解决了数据一致性的问题，让建构其上的企业软件更可靠，也更好维护。
（数据库中的二维表）
这种设计对“写入”操作更友好，但并不易读。现代的企业软件通常会采用“透视表”的表格来展示二维表中的数据。在透视表中，二维表的列被分成行、列和值三种类型，行、列分别当做行头和列头（通常显示为二维表中对应的列所关联的主数据表或字典表中的值，而不是二维表中存储的ID，如二维表中存储的是iCampaign促销活动ID，而显示在透视表列头中的是该ID对应的活动名称），而值则对应了表格中的单元格。从二维表转换为透视表的过程叫做“透视”，我们可以从Excel的透视表功能来理解和体验这一转换过程。
相比于二维表，用户可以在一个页面上更直观的查看数据，配合上必要的统计计算，构成了最常见的报表。这种报表中，除公式外的单元格代表的是行头、列头交叉的结果，所以也被称为交叉报表。交叉报表和企业管理软件几乎同时诞生，至今也有几十年的历史，是一项很成熟的技术。在国内的信息化系统中，交叉报表的数量远大于同定位的国外软件，而且行头、列头众多且都是动态（通常根据字典表或主数据表生成）而非预置的，交叉报表也被称为“中国式复杂报表”。
（基于上文二维表制作的透视表）
在业务软件无法覆盖全业务流程的时候，业务人员通常会将某个系统中的交叉报表导出为Excel文件，然后在这个文件的基础上订正或补充一些数据，用作展示、汇报，或导入另一个系统，简化数据录入过程。这种类似交叉报表的数据填报就是本方案中应用场景：“交叉填报”。
Demo体验
以下是一个使用活字格开发交叉填报演示应用。你可以按照界面指示进行体验。
https://hac.app.hzgcloud.cn/excel_demo/
在这个Demo中，前后端互相配合，实现了从交叉报表中提取数据，并将其保存入数据库的全过程：
1. 前端页面自动分析每一个单元格的值，如果该单元格不为空且不为公式，页面会去根据行列头配置（如行号为3的列头对应Channel属性，列为C的行头对应Account属性），寻找这个单元格对应的行头和列头所对应的属性的值（如单元格E9的值为2000，则Value属性为2000，对应的行号为3的列头是KOL，则将Channel属性设置为KOL，对应的列为C的行头是MakeUp，则将Account设置为MakeUp），并将其加工成一个对象。
2. 前端页面遍历页面中所有被用到的单元格后，将上一步的对象组装成一个数组，并以其作为参数调用后端的服务端命令
3. 后端的服务端命令遍历传入的数组参数，根据主数据表，使用Account、Channel等属性的文本查询到对应的ID，最后使用这些ID插入或更新到业务数据表
（使用活字格开发的交叉填报Demo）
示例解析
架构简图
（交叉填报方案架构简图）
工程文件
（V9.0.3.0）
数据表
[*]Excel_SpreadJSCode：仅一行，sHTML是被嵌入页面的HTML代码，如需调整交互体验则修改这个字段；sKey是SpreadJS的授权码，发布后需替换
[*]Excel_TemplateDefine：每个模板一行，列定义参考template页面
页面
[*]config：调整交互体验时使用该页面进行预览和保存
[*]template：管理填报模板的定义
[*]import：交叉填报体验页面
[*]query1、query2：两个交叉填报场景对应的数据展示页面
服务端命令
[*]import_data_ysld_campaign：场景1的数据服务
[*]import_data_gc_budget：场景2的数据服务
服务端通知
[*]import_success：填报操作完成后，用来这个服务端通知来驱动页面做跳转操作。
页:
[1]