[发明专利]一种应用于采购过程公告的Web文档可视化编辑方法及装置

说明书

本发明提供一种应用于采购过程公告的Web文档可视化编辑方法及装置，方法包括：初始化文档目录；初始化公告内容预览区，所述公告内容预览区内设有编辑区域，所述编辑区域用于显示公告内容；生成对应表单；调用浏览器SVG接口将公告内容预览区的编辑区域与表单进行连线；提升了使用体验，降低了编辑难度。

技术领域

本发明涉及计算机技术领域，特别涉及一种应用于采购过程公告的Web文档可视化编辑方法及装置。

背景技术

在电子采购系统中，对采购过程公告(例如资格预审公告，采购公告以及中标公告等等)文档进行在线编辑是一项常用功能。采购过程公告通常编辑项多，编辑内容复杂，普遍的方案是利用表单技术，使用步骤条引导的方式，让用户逐步输入待填项数据，数据全部填写完成并且合法性校验全部通过后，再将数据转化成可预览的公告(HTML模板)。这种引导式编辑的问题在于，如果要修改编辑内容，则要逐步返回上一步进行修改，修改好后，再逐步点击下一步回到预览页进行预览，纠错成本高，编辑难度大，使用起来不够直观。因此，如何使用技术手段提升公告文档在线编辑的体验，降低编辑难度是本领域技术人员目前需要解决的技术问题。

发明内容

本发明要解决的技术问题，在于提供一种应用于采购过程公告的Web文档可视化编辑方法及装置，提升了使用体验，降低了编辑难度。

第一方面，本发明提供了一种应用于采购过程公告的Web文档可视化编辑方法，包括：

步骤1、初始化文档目录；

步骤2、初始化公告内容预览区，所述公告内容预览区内设有编辑区域，所述编辑区域用于显示公告内容；

步骤3、生成对应表单；

步骤4、调用浏览器SVG接口将公告内容预览区的编辑区域与表单进行连线。

进一步地，所述步骤1进一步具体为：获取文档目录数据，根据文档目录数据生成文档目录。

进一步地，所述步骤2进一步具体为：

生成公告内容：获取待填项，生成待填项HTML模板，所述待填项HTML模板中设有一可编辑项，在待填项HTML模板植入包含classEdit的类名用来标记该项为可编辑项；在待填项HTML模板植入含有编辑项唯一标识的id值和对应的类名，用于与编辑区域的表单输入项建立关联；拼接待填项HTML模板生成完整HTML公告文档；

获取公告内容，并在编辑区域显示公告内容；

标记公告内容的可编辑文本：定义类名classEdit的样式为蓝色字体高亮，通过浏览器渲染引擎将类名为classEdit的类进行渲染样式；

识别并标记公告内容的未填项：获取未填数据的编辑项唯一标识，遍历公告文档HTML节点，找出类名中含有classEdit和未填数据的编辑项唯一标识的HTML节点；在所述HTML节点的最外层HTML节点插入值为classUndefined的样式类，定义类名classUndefined的样式为黄色背景高亮；通过浏览器渲染引擎将类名为classUndefined的类进行渲染样式；

对标记为可编辑文本的公告内容HTML节点向浏览器系统注册单击事件。

进一步地，所述步骤3进一步具体为：

获取公告内容，将每个待填项生成对应的单表。

进一步地，所述步骤4进一步具体为：获取公告内容的每个编辑区域的HTML节点，并一一进行解析，得到待填项唯一标识；获取对应的表单项的HTML节点，调用浏览器SVG接口将可编辑区域的HTML节点与对应的表单项的HTML节点进行连线。

第二方面，本发明提供了一种应用于采购过程公告的Web文档可视化编辑装置，包括：