CN114417790A - 一种嵌入式web端文档编辑系统及编辑方法 - Google Patents

一种嵌入式web端文档编辑系统及编辑方法 Download PDF

Info

Publication number
CN114417790A
CN114417790A CN202111635736.2A CN202111635736A CN114417790A CN 114417790 A CN114417790 A CN 114417790A CN 202111635736 A CN202111635736 A CN 202111635736A CN 114417790 A CN114417790 A CN 114417790A
Authority
CN
China
Prior art keywords
document
layer module
data
control
module
Prior art date
Legal status (The legal status is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the status listed.)
Pending
Application number
CN202111635736.2A
Other languages
English (en)
Inventor
范绍东
刘洋
马长春
王贲
Current Assignee (The listed assignees may be inaccurate. Google has not performed a legal analysis and makes no representation or warranty as to the accuracy of the list.)
Hangzhou Yongxie Technology Co ltd Chengdu Branch
Original Assignee
Hangzhou Yongxie Technology Co ltd Chengdu Branch
Priority date (The priority date is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the date listed.)
Filing date
Publication date
Application filed by Hangzhou Yongxie Technology Co ltd Chengdu Branch filed Critical Hangzhou Yongxie Technology Co ltd Chengdu Branch
Priority to CN202111635736.2A priority Critical patent/CN114417790A/zh
Publication of CN114417790A publication Critical patent/CN114417790A/zh
Pending legal-status Critical Current

Links

Images

Classifications

    • GPHYSICS
    • G06COMPUTING; CALCULATING OR COUNTING
    • G06FELECTRIC DIGITAL DATA PROCESSING
    • G06F40/00Handling natural language data
    • G06F40/10Text processing
    • G06F40/166Editing, e.g. inserting or deleting
    • GPHYSICS
    • G06COMPUTING; CALCULATING OR COUNTING
    • G06FELECTRIC DIGITAL DATA PROCESSING
    • G06F40/00Handling natural language data
    • G06F40/10Text processing
    • G06F40/189Automatic justification
    • GPHYSICS
    • G06COMPUTING; CALCULATING OR COUNTING
    • G06FELECTRIC DIGITAL DATA PROCESSING
    • G06F40/00Handling natural language data
    • G06F40/10Text processing
    • G06F40/191Automatic line break hyphenation

Landscapes

  • Engineering & Computer Science (AREA)
  • Theoretical Computer Science (AREA)
  • Health & Medical Sciences (AREA)
  • Artificial Intelligence (AREA)
  • Audiology, Speech & Language Pathology (AREA)
  • Computational Linguistics (AREA)
  • General Health & Medical Sciences (AREA)
  • Physics & Mathematics (AREA)
  • General Engineering & Computer Science (AREA)
  • General Physics & Mathematics (AREA)
  • Document Processing Apparatus (AREA)

Abstract

一种嵌入式WEB端文档编辑系统,包括元素层模块、控制层模块、视图层模块、编译层模块和数据层模块,视图层模块用于文档的渲染,所述元素层模块包括控件组件、页面组件和内容组件,控制层模块用于对所述视图层模块中文档的编辑,编译层模块用于生成文档并进行数据传输,数据层模块用于传递所述编译层模块的数据信息。本发明可嵌入第三方系统,并与第三方系统进行数据互通,且提供内置API以供第三方系统开发定制化的文档业务模块,供文档创作者进行复杂的排版操作,支持复杂的表格矩阵设计,单元格合并功能配合单元格的新增行、新增列,以及行与列的宽高调整功能,可做出任意矩阵的表格,以满足文档创作者对复杂表单的需求。

Description

一种嵌入式WEB端文档编辑系统及编辑方法
技术领域
本发明涉及办公算法技术领域,尤其是一种嵌入式WEB端文档编辑系统。
背景技术
多数WEB端的文档编辑器分为两类,一类是提供对本段落和图片编辑功能的富文本编辑器,一类是提供文档多人在线协作编辑能力的文档编辑器。
上述的两种文档编辑器都存在问题,即:
富文本编辑器专注于单页文档的文本段落的编辑,仅提供图片和简单的表格控件,无法满足复杂的多页文档创作;
而多人在线协作类的文档编辑器虽然能够进行复杂的多页文档的创作,但存在数据不能与第三方系统打通、缺失报表类文档编辑所需的控件及拖拽排版的功能等问题,如编辑器不能集成在第三方系统中,导致不能直接在第三方系统内进行文档创作,且第三方系统的业务数据无法运用到文档的编辑中,编辑器不提供文档内容解析为通用的JSON数据的能力,第三方系统无法充分利用自己创作的文档,且文档不支持用户自定义拖拽排版,表单控件缺失,所以,多人在线协作类的文档编辑器将用户创作的数据锁定在其自己的生态圈内,文档内容仅能以附件形式存储在第三方系统的服务器上,使得第三方系统的业务数据无法渗透到创作的文档中,难以胜任报表形式的文档创作。
发明内容
本发明的目的在于克服现有技术的不足,提供一种可嵌入第三方系统并与其数据共享的WEB端文档编辑系统。
本发明解决其技术问题是采取以下技术方案实现的:
一种嵌入式WEB端文档编辑系统,包括元素层模块、控制层模块、视图层模块、编译层模块和数据层模块,所述视图层模块用于文档的渲染,所述元素层模块包括控件组件、页面组件和内容组件,用于填充所述视图层模块中的文档,所述控制层模块包括面板组件、工具组件、菜单组件,用于对所述视图层模块中文档的编辑,所述编译层模块包括数据处理组件和文件生成组件,所述编译层模块用于生成文档并进行数据传输,所述数据层模块用于传递所述编译层模块的数据信息,所述数据层模块连接有第三方系统的文档业务模块;
所述视图层模块中有文档模板,所述元素层模块对文档模板进行元素填充,所述控制层模块对文档模板进行特征编辑,所述视图层模块将完成的文档数据传输至所述编译层模块中,进行数据解析并生成文档,文档通过所述数据层模块传输至第三方系统的文档业务模块中,完成文档编辑。
优选的,所述元素层模块的控件组件包括标题控件、文本框控件、线段控件、选框控件、图片控件以及表格控件中的一种或多种的结合。
优选的,所述元素层模块的页面组件包括页眉元素、页脚元素、页码元素和水印元素中的一种或多种的结合。
优选的,所述控制层模块的面板组件包括坐标及尺寸属性、字体属性、模型及布局属性、主题设置属性、图片库和填充属性中的一种或多种的结合。
优选的,所述编译层模块的数据处理组件包括数据模型、解析机构和编译机构,所述编译机构用于对原始数据进行编译,所述解析机构用于将编译的数据进行解析。
优选的,所述数据层模块包括JSON数据处理模块、图片数据处理模块和PDF数据处理模块,所述编译机构将编译的数据信息传输至所述JSON数据处理模块中,所述JSON数据处理模块将JSON数据传输至所述解析机构中,所述文件生成组件将文档导出至所述PDF数据处理模块中。
优选的,所述第三方系统的文档业务模块将生成的文档信息传输至服务器中,所述服务器中存储有文档、文档模板、文档草稿。
优选的,所述数据层模块和第三方系统的文档业务模块中的数据互通共享。
一种嵌入式WEB端文档编辑系统的编辑方法,包括以下步骤:
S1、将文档编辑系统嵌入第三方系统中,文档编辑系统的源代码全部集合在一个项目文件夹中,可以直接嵌入到第三方系统中;
S2、利用文档编辑系统提供的应用接口对第三方系统进行二次开发,自研第三方系统的文档业务模块,文档编辑系统采用面向对象的编程思想进行研发,外暴露一个名为Report的构造函数,该构造函数上定义了如下三类静态方法或静态属性:
1)控制文档基本属性的静态属性
如fileName(文档名称)、width(文档宽度)、direction(文档方向)等;
2)对文档进行全局操作的静态方法
如deletePaper(删除文档某页及该页上所有的控件)、titleList(获取文档中所有的标题控件生成文档目录)、addPaper(往文档中插入空白页)等;
3)为第三方系统提供业务支持的静态方法(API)
如init(初始化文档)、exportReport(导出PDF文档)、saveReport(获取文档JSON数据)、createThumbnail(生成缩略图)、reverseReport(使用JSON数据渲染文档)等;
S3、使用文档编辑系统中的元素层模块和控制层模块进行文档的编辑填充,文档编辑系统提供多种类型控件,每一种控件通过数据模型继承了通用的数据字段,不同的控件也通过数据模型设置了私有的数据字段,控件类型如下:
标题控件:为文档添加权重为标题的文本内容,标题共分为四种权重,权重越高标题默认字号越大;
文本框控件:为文档添加文本段落,支持水平和垂直方向上的多种文字对齐方式及富文本样式;
线段控件:为文档添加分割线,有四种类型和两种方向,支持切换类型和方向;
选框控件:为文档插入单选框和复选框控件,支持文本输入和选中操作;
图像控件:为文档插入图片,提供四种标准的图片填充方式;
水印控件:为文档插入图片水印,支持水印平铺、旋转、透明度、尺寸等操作;
表格控件:为文档插入复杂的、可配置性高的表格控件,提供复杂的单元格合并及行列操作等功能;
S4、通过编译层模块的编译机构编译JSON数据,并传输至数据层模块,当文档创作完毕调用Report的静态方法saveReport可以获取该文档的JSON数据,该方法的具体实现步骤如下:
1)从Report构造函数上获取关于文档的基础数据如文档名称、文档宽高、文档页边距等;
2)从Report.reportData上获取文档每一页的数据,包括每一页上挂载的所有控件的数据;
3)对上述获取的数据进行过滤,滤去与渲染无关的字段,与文档基础数据进行组装并序列化,return这个JSON数据;
S5、数据层模块将文档数据传输至第三方系统的文档业务模块中,文档业务模块对文档数据进行组装,并使用预设的文档类型,当第三方业务系统的文档业务模块拿到文档的核心JSON数据后,可以在上面扩张其它业务字段以满足自定义需求,如:
1)添加categories字段设置文档所属分类;
2)添加status字段设置文档状态如草稿、模板等;
3)添加author字段设置文档作者;
S6、将整合后的完成文档数据通过http存储到服务器中,供其他业务调用,并保存为可重复利用的文档模板,用户选择文档模板后,可通过解析机构对JSON数据解析到视图层模块中,对文档进行再次编辑,直到文档全部渲染编辑完成。
本发明的优点和积极效果是:
本发明可嵌入第三方系统,并与第三方系统进行数据互通,且提供内置API以供第三方系统开发定制化的文档业务模块,提供丰富的文档排版布局功能,供文档创作者进行复杂的排版操作,同时提供丰富的文档控件,支持复杂的表格矩阵设计,单元格合并功能配合单元格的新增行、新增列,以及行与列的宽高调整功能,可以做出任意矩阵的表格,以满足文档创作者对复杂表单的需求,成为各类复杂表单数据的容器。
附图说明
图1是本发明的系统结构示意图;
图2是本发明的系统流程示意图;
图3是本发明的嵌入第三方系统的示意图;
图4是本发明的文档、文档JSON数据和文档业务数据的转换示意图;
图5是本发明的复合型文档排版布局的示意图;
图6是本发明的辅助线辅助控件对齐示意图;
图7是本发明的辅助框控制控件坐标与尺寸的示意图;
图8是本发明的表单控件示意图;
图9是本发明的表格控件选中单元格不可进行合并操作的示例图;
图10是本发明的表格控件选中单元格可进行合并操作的示例图;
图11是本发明的表格控件单元格合并成功的示例图。
具体实施方式
下面将结合本发明实施例中的附图,对本发明实施例中的技术方案进行清楚、完整地描述,显然,所描述的实施例仅仅是本发明一部分实施例,而不是全部的实施例。基于本发明中的实施例,本领域普通技术人员在没有做出创造性劳动前提下所获得的所有其他实施例,都属于本发明保护的范围。
需要说明的是,当组件被称为“固定于”另一个组件,它可以直接在另一个组件上或者也可以存在居中的组件。当一个组件被认为是“连接”另一个组件,它可以是直接连接到另一个组件或者可能同时存在居中组件。当一个组件被认为是“设置于”另一个组件,它可以是直接设置在另一个组件上或者可能同时存在居中组件。本文所使用的术语“垂直的”、“水平的”、“左”、“右”以及类似的表述只是为了说明的目的。
除非另有定义,本文所使用的所有的技术和科学术语与属于本发明的技术领域的技术人员通常理解的含义相同。本文中在本发明的说明书中所使用的术语只是为了描述具体的实施例的目的,不是旨在于限制本发明。本文所使用的术语“及/或”包括一个或多个相关的所列项目的任意的和所有的组合。
以下结合附图对本发明实施例做进一步详述:
如图1和图3所示,本发明所述的一种嵌入式WEB端文档编辑系统,包括元素层模块、控制层模块、视图层模块、编译层模块和数据层模块,视图层模块用于文档的渲染,元素层模块包括控件组件、页面组件和内容组件,用于填充视图层模块中的文档,元素层模块的控件组件包括标题控件、文本框控件、线段控件、选框控件、图片控件以及表格控件中的一种或多种的结合,元素层模块的页面组件包括页眉元素、页脚元素、页码元素和水印元素中的一种或多种的结合,控制层模块包括面板组件、工具组件、菜单组件,用于对视图层模块中文档的编辑,控制层模块的面板组件包括坐标及尺寸属性、字体属性、模型及布局属性、主题设置属性、图片库和填充属性中的一种或多种的结合,编译层模块包括数据处理组件和文件生成组件,编译层模块用于生成文档并进行数据传输,编译层模块的数据处理组件包括数据模型、解析机构和编译机构,编译机构用于对原始数据进行编译,解析机构用于将编译的数据进行解析,数据层模块用于传递编译层模块的数据信息,数据层模块包括JSON数据处理模块、图片数据处理模块和PDF数据处理模块,编译机构将编译的数据信息传输至JSON数据处理模块中,JSON数据处理模块将JSON数据传输至解析机构中,文件生成组件将文档导出至PDF数据处理模块中,数据层模块连接有第三方系统的文档业务模块;
视图层模块中有文档模板,元素层模块对文档模板进行元素填充,控制层模块对文档模板进行特征编辑,视图层模块将完成的文档数据传输至编译层模块中,进行数据解析并生成文档,文档通过数据层模块传输至第三方系统的文档业务模块中,完成文档编辑,第三方系统的文档业务模块将生成的文档信息传输至服务器中,服务器中存储有文档、文档模板、文档草稿,数据层模块和第三方系统的文档业务模块中的数据互通共享。
如图4所示,数据共享不仅仅依靠将文档编辑系统嵌入到第三方系统中,起到关键作用的是文档编辑系统中的编译机构、解析机构及渲染器,编译机构的作用是将文档编译成JSON数据,JSON数据才是第三方系统可以直接使用的,编辑系统中的文档是视图层模块渲染的文档,不参与第三方系统数据上的业务来往,解析机构的作用是将JSON数据解析成渲染器能读懂的数据以便进行文档的渲染,渲染器的作用是通过传进来的数据在文档编辑系统上绘制文档页面和控件。编译机构、解析机构及渲染器联合工作就能实现文档编译成JSON数据、JSON数据渲染成文档的相互转换,到目前为止只是实现了JSON数据与文档的相互转换,这只是文档编辑器的内循环,但与第三方系统的外循环的依赖这个内循环,从图2可以看出JSON数据是内循环与外循环的桥梁,通过对JSON数据进行加工包装,可以把第三方系统的文档业务数据字段进行整合,通过http保存在服务器上形成文档业务数据,文档业务数据可以提取出文档JSON数据参与内循环,至此,文档业务数据就可以与文档进行互相转换,也就代表了文档编辑系统能与第三方系统协同工作。
通过文档编辑系统来对复合型文档排版布局:
无论是富文本编辑器还是在线协作的编辑器,都只能使用回车或者空格进行文本和段落的排版布局,本发明额外提供多种文档控件排版布局的方式,精确到1像素,如图5所示:
1)拖拽排版布局:用户在拖拽控件时获取鼠标拖拽事件的事件对象,取出鼠标上一次的位移偏差值x、y,将x和y值与辅助框和控件的实例属性left(x轴坐标)、top(y轴坐标)做加减运算,实例的proxy代理监听到对实例属性的修改会进行拦截,对dom节点的left和top样式进行修改以完成辅助框和控件的同步移动;
2)输入精确坐标值进行排版布局:将用户输入的精确坐标值x、y直接赋值给控件的实例属性left、top,而非做加减运算;
3)磁性吸附排版布局:拖拽排版布局时会计算当前控件与所在文档页面中的其它所有控件之间距离,这个计算包括控件的四条边与水平、垂直中线共6条线,不同控件之间的类型相同的线之间的间距小于某个值会触发磁性吸附效果,被操作的控件会主动贴近目标控件实现磁性吸附排版布局,如图6所示。
计算规则大致如下:
1)首先计算当前操作控件的上边线、水平中线、下边线的Y轴坐标值,左边线、垂直中线、右边线的X轴坐标,一共六个数值;
2)计算当前操作控件所挂载的页面中的其它所有控件的上述6个值;
3)遍历步骤2的数据,通过与步骤1的数值对比找出满足条件的所有线并生成辅助线告知用户当前时那些线触发了磁性吸附效果;
4)修正排版布局:控件在进行拖拽或精确坐标排版布局时,在下一个坐标值生效前会分别计算控件的宽高加上x、y坐标值是否会超过文档的宽高,为保证控件整体限制在文档页面范围内会取消这一次的坐标值赋值;
5)辅助框锚点控制大小与坐标:辅助框提供8个锚点,拖拽锚点可拉伸控件尺寸大小,部分锚点的拖拽不仅会改变控件的尺寸大小,也会改变控件的坐标值,如图7所示,拖拽左上角锚点会同时改变控件的尺寸和坐标值。
大多数的表格控件不会是简单的N列*M行的标准矩阵,部分单元格会同时跨列或跨行,如图8所示,这种情况不仅要在视图上进行体现,也需要在表格控件的数据上体现。
本发明实现表格控件单元格合并功能如下:
1)计算当前选中的单元格是否形成标准矩形,如图9所示,用户使用鼠标从A点拖拽到B点,以AB两点坐标画一个矩形(图中虚线形成区域),与该矩形有重叠的单元格为选中的单元格,(图中填充灰色的单元格为被选中的单元格),从视图上很容易区分这不是一个标准矩形,不能进行单元格的合并操作,但是我们需要从数据上去计算出所选的单元格区域是不是一个标准矩形,计算方式如下:
所选区域的列跨度n=3,如图9所示灰色区域横跨了三列;
所选区域的行跨度m=4,如图9所示灰色区域横跨了4行;
计算形成n列*m行的矩形所需的基础单元格数为n*m=12;
计算灰色区域实际所占基础单元格数为total=2+2+1+4=9;
total!=n*m,所以不能进行单元格合并操作;
2)如图10所示,n=2,m=3,total=1+1+4,n*m=total,可以进行单元格合并操作。合并的逻辑为将最靠左上角的单元格α扩大到选中区域的最靠右下角的基础单元格的位置,再将除α外的单元格全部删除,完成单元格的合并;
单元格α的数据为{col:2,colspan:1,row:2,rowspan:1}
单元格β的数据为{col:3,colspan:1,row:2,rowspan:1}
单元格θ的数据为{col:2,colspan:2,row:3,rowspan:2}
col表示单元格起始列
colspan表示单元格所跨列数
row表示单元格从起始行
rowspan表示单元格所跨行数
(1)从α、β、θ三个单元格中找出最靠左上角的单元格;
col和row都最小的那个单元格必定是最靠左上角的单元格,α的col和row都是2,所以α是最小的单元格;
(2)从选中区域找出最靠右下角的基础单元格所属列数n,所属行数m;
求n和m的值,需要遍历α、β、θ,找出col+colsapn-1、row+rowspan-1最大的两个值,这两个值就是n和m,所以n=2+2-1=3,m=2+3-1=4;
(3)α扩大到第n列和第m行,修改a的colspan和rowspan;
colspan=n-col+1=2
rowspan=m-row+1=3
(4)删除β、θ的数据,使用计算后的数据交给本发明的渲染器进行渲染,结果如图11所示。
本发明的单元格合并功能配合上单元格的新增行、新增列、以及行与列的宽高调整功能可以做出任意矩阵的表格,以满足文档创作者对复杂表单的需求,成为各类复杂表单数据的容器。
具体实施时,嵌入式WEB端文档编辑系统的编辑方法,如图2所示,包括以下步骤:
S1、将文档编辑系统嵌入第三方系统中,文档编辑系统的源代码全部集合在一个项目文件夹中,可以直接嵌入到第三方系统中;
S2、利用文档编辑系统提供的应用接口对第三方系统进行二次开发,自研第三方系统的文档业务模块,文档编辑系统采用面向对象的编程思想进行研发,外暴露一个名为Report的构造函数,该构造函数上定义了如下三类静态方法或静态属性:
1)控制文档基本属性的静态属性
如fileName(文档名称)、width(文档宽度)、direction(文档方向)等;
2)对文档进行全局操作的静态方法
如deletePaper(删除文档某页及该页上所有的控件)、titleList(获取文档中所有的标题控件生成文档目录)、addPaper(往文档中插入空白页)等;
3)为第三方系统提供业务支持的静态方法(API)
如init(初始化文档)、exportReport(导出PDF文档)、saveReport(获取文档JSON数据)、createThumbnail(生成缩略图)、reverseReport(使用JSON数据渲染文档)等;
S3、使用文档编辑系统中的元素层模块和控制层模块进行文档的编辑填充,文档编辑系统提供多种类型控件,每一种控件通过数据模型继承了通用的数据字段,不同的控件也通过数据模型设置了私有的数据字段,控件类型如下:
标题控件:为文档添加权重为标题的文本内容,标题共分为四种权重,权重越高标题默认字号越大;
文本框控件:为文档添加文本段落,支持水平和垂直方向上的多种文字对齐方式及富文本样式;
线段控件:为文档添加分割线,有四种类型和两种方向,支持切换类型和方向;
选框控件:为文档插入单选框和复选框控件,支持文本输入和选中操作;
图像控件:为文档插入图片,提供四种标准的图片填充方式;
水印控件:为文档插入图片水印,支持水印平铺、旋转、透明度、尺寸等操作;
表格控件:为文档插入复杂的、可配置性高的表格控件,提供复杂的单元格合并及行列操作等功能;
每一类控件通过新建一个构造函数实例而创建,控件的构造函数内置控件数据模型、渲染器和事件句柄,不同控件拥有公共数据模型和事件句柄,其被提取到BoxModel构造函数中,控件的构造函数通过继承BoxModel类获取,如class TextBox extends BoxModel(文本框控件继承公共数据模型和事件句柄),详细技术方案如下:
1)公共的数据模型
通过在BoxModel类中定义如width(控件宽)、left(控件X轴坐标)、node(控件Dom节点)、style(控件外观样式)等实例属性而生成;
2)公共事件句柄
通过在BoxModel类中定义如bindDbclickEvent(双击事件句柄)、bindMousedownEvent(单击事件句柄)等原型方法而生成;
3)控件渲染器
通过在BoxModel类中定义createNode(渲染器)静态方法而生成;
4)私有数据模型和私有事件句柄
通过在控件对应的构造函数中定义实例属性和原型方法而生成;
控件受属性面板、右键菜单项、工具栏的控制,对控件的文本内容、数据状态、外观进行细粒度的控制,所有对控件的编辑工具都是对控件的数据模型的值进行修改,如:
1)修改控件的实例属性value可以控制控件的文本内容;
2)修改控件的实例属性style可以控制控件的外观样式;
控件数据模型的值的修改会通过Proxy自动代理到DOM的修改,其中的技术实现方案如下:
1)控件构造函数返回的不是实例,而是被new Proxy包裹后的实例;
2)对控件实例属性的修改会被包裹的Proxy拦截;
3)根据拦截的实例属性的不同调用预先编写的DOM操作函数;
S4、通过编译层模块的编译机构编译JSON数据,并传输至数据层模块,当文档创作完毕调用Report的静态方法saveReport可以获取该文档的JSON数据,该方法的具体实现步骤如下:
1)从Report构造函数上获取关于文档的基础数据如文档名称、文档宽高、文档页边距等;
2)从Report.reportData上获取文档每一页的数据,包括每一页上挂载的所有控件的数据;
3)对上述获取的数据进行过滤,滤去与渲染无关的字段,与文档基础数据进行组装并序列化,return这个JSON数据;
S5、数据层模块将文档数据传输至第三方系统的文档业务模块中,文档业务模块对文档数据进行组装,并使用预设的文档类型,当第三方业务系统的文档业务模块拿到文档的核心JSON数据后,可以在上面扩张其它业务字段以满足自定义需求,如:
1)添加categories字段设置文档所属分类;
2)添加status字段设置文档状态如草稿、模板等;
3)添加author字段设置文档作者;
S6、将整合后的完成文档数据通过http存储到服务器中,供其他业务调用,并保存为可重复利用的文档模板,用户选择文档模板后,可通过解析机构对JSON数据解析到视图层模块中,工作渲染到画布上进行文档再次创作,其技术手段如下:
1)从第三方系统获取文档业务数据后剥离核心数据(文档基础数据和页面及页面上挂载的控件数据),调用文档编辑器暴漏的API Report.reverseReport;
2)Report.reverseReport将核心JSON数据反序列化后,遍历文档文档页面数据,使用new Paper()渲染文档页面;
3)页面渲染后遍历页面控件数据,根据控件的type字段(控件种类)调用相应的构造函数如new TextBox(),挨个初始化该文档页面上挂载的控件,最后将控件DOM挂载在渲染好的页面DOM上;
4)重复步骤2和步骤3直至所有文档页面全部渲染完毕;
5)完整的文档渲染完毕,用户可使用文档编辑系统对文档进行二次创作。
本发明可嵌入第三方系统,并与第三方系统进行数据互通,且提供内置API以供第三方系统开发定制化的文档业务模块,提供丰富的文档排版布局功能,供文档创作者进行复杂的排版操作,同时提供丰富的文档控件,支持复杂的表格矩阵设计,单元格合并功能配合单元格的新增行、新增列,以及行与列的宽高调整功能,可以做出任意矩阵的表格,以满足文档创作者对复杂表单的需求,成为各类复杂表单数据的容器。
需要强调的是,本发明所述的实施例是说明性的,而不是限定性的,因此本发明并不限于具体实施方式中所述的实施例,凡是由本领域技术人员根据本发明的技术方案得出的其他实施方式,同样属于本发明保护的范围。

Claims (9)

1.一种嵌入式WEB端文档编辑系统,其特征在于:包括元素层模块、控制层模块、视图层模块、编译层模块和数据层模块,所述视图层模块用于文档的渲染,所述元素层模块包括控件组件、页面组件和内容组件,用于填充所述视图层模块中的文档,所述控制层模块包括面板组件、工具组件、菜单组件,用于对所述视图层模块中文档的编辑,所述编译层模块包括数据处理组件和文件生成组件,所述编译层模块用于生成文档并进行数据传输,所述数据层模块用于传递所述编译层模块的数据信息,所述数据层模块连接有第三方系统的文档业务模块;
所述视图层模块中有文档模板,所述元素层模块对文档模板进行元素填充,所述控制层模块对文档模板进行特征编辑,所述视图层模块将完成的文档数据传输至所述编译层模块中,进行数据解析并生成文档,文档通过所述数据层模块传输至第三方系统的文档业务模块中,完成文档编辑。
2.根据权利要求1所述的一种嵌入式WEB端文档编辑系统,其特征在于:所述元素层模块的控件组件包括标题控件、文本框控件、线段控件、选框控件、图片控件以及表格控件中的一种或多种的结合。
3.根据权利要求1所述的一种嵌入式WEB端文档编辑系统,其特征在于:所述元素层模块的页面组件包括页眉元素、页脚元素、页码元素和水印元素中的一种或多种的结合。
4.根据权利要求1所述的一种嵌入式WEB端文档编辑系统,其特征在于:所述控制层模块的面板组件包括坐标及尺寸属性、字体属性、模型及布局属性、主题设置属性、图片库和填充属性中的一种或多种的结合。
5.根据权利要求1所述的一种嵌入式WEB端文档编辑系统,其特征在于:所述编译层模块的数据处理组件包括数据模型、解析机构和编译机构,所述编译机构用于对原始数据进行编译,所述解析机构用于将编译的数据进行解析。
6.根据权利要求5所述的一种嵌入式WEB端文档编辑系统,其特征在于:所述数据层模块包括JSON数据处理模块、图片数据处理模块和PDF数据处理模块,所述编译机构将编译的数据信息传输至所述JSON数据处理模块中,所述JSON数据处理模块将JSON数据传输至所述解析机构中,所述文件生成组件将文档导出至所述PDF数据处理模块中。
7.根据权利要求1所述的一种嵌入式WEB端文档编辑系统,其特征在于:所述第三方系统的文档业务模块将生成的文档信息传输至服务器中,所述服务器中存储有文档、文档模板、文档草稿。
8.根据权利要求6所述的一种嵌入式WEB端文档编辑系统,其特征在于:所述数据层模块和第三方系统的文档业务模块中的数据互通共享。
9.一种嵌入式WEB端文档编辑系统的编辑方法,其特征在于:包括以下步骤:
S1、将文档编辑系统嵌入第三方系统中;
S2、利用文档编辑系统提供的应用接口对第三方系统进行二次开发,自研第三方系统的文档业务模块;
S3、使用文档编辑系统中的元素层模块和控制层模块进行文档的编辑填充;
S4、通过编译层模块的编译机构编译JSON数据,并传输至数据层模块;
S5、数据层模块将文档数据传输至第三方系统的文档业务模块中,文档业务模块对文档数据进行组装,并使用预设的文档类型;
S6、将整合后的完成文档数据通过http存储到服务器中,供其他业务调用,并保存为可重复利用的文档模板,用户选择文档模板后,可通过解析机构对JSON数据解析到视图层模块中,对文档进行再次编辑,直到文档全部渲染编辑完成。
CN202111635736.2A 2021-12-29 2021-12-29 一种嵌入式web端文档编辑系统及编辑方法 Pending CN114417790A (zh)

Priority Applications (1)

Application Number Priority Date Filing Date Title
CN202111635736.2A CN114417790A (zh) 2021-12-29 2021-12-29 一种嵌入式web端文档编辑系统及编辑方法

Applications Claiming Priority (1)

Application Number Priority Date Filing Date Title
CN202111635736.2A CN114417790A (zh) 2021-12-29 2021-12-29 一种嵌入式web端文档编辑系统及编辑方法

Publications (1)

Publication Number Publication Date
CN114417790A true CN114417790A (zh) 2022-04-29

Family

ID=81269106

Family Applications (1)

Application Number Title Priority Date Filing Date
CN202111635736.2A Pending CN114417790A (zh) 2021-12-29 2021-12-29 一种嵌入式web端文档编辑系统及编辑方法

Country Status (1)

Country Link
CN (1) CN114417790A (zh)

Similar Documents

Publication Publication Date Title
US7461332B2 (en) Automatic layout of content in a design for a medium
EP0925542B1 (en) Automatic layout and formatting of content for a design in a medium
CN111475163B (zh) 视图模板的代码文件生成方法、装置、设备及存储介质
US9786079B2 (en) Method and system for personalizing images rendered in scenes for personalized customer experience
US5675753A (en) Method and system for presenting an electronic user-interface specification
US5181162A (en) Document management and production system
US5490243A (en) Data processing system for multi-platform print control and electronic data fill
EP1462998B1 (en) Markup language and object model for vector graphics
CN103383645B (zh) 代码生成方法及系统
WO2016054549A1 (en) Application prototyping tool
Pree et al. Active guidance of framework development
CN103136317A (zh) 工程管理系统工程合同在线审批信息化实现方法
CN102722616B (zh) 一种基于Excel绘制勘探点平面图的方法
US7949690B2 (en) Project structure
CN112214218A (zh) 一种高性能高效率的Sketch组件库生成和管理方案及系统
CN105404512B (zh) 一种应用程序窗口界面更改方法及装置
CN114417790A (zh) 一种嵌入式web端文档编辑系统及编辑方法
CN109948133B (zh) 一种基于Layui的数据表格的实现方法
Szyperski Write-ing Applications: Design of an Extensible Text Editor as an Application Framework.
Schwabe et al. OOHDM-WEB: Rapid prototyping of hypermedia applications in the WWW
KR20140075901A (ko) 전자서식문서 생성 방법, 기록매체 및 시스템
Bier Embeddedbuttons: supporting buttons in documents
CN112667210A (zh) 一种地理信息系统软件的模块化定制方法及装置
JP2002091958A (ja) 情報処理装置及びその方法、コンピュータ可読メモリ
Zhu et al. The research and design of the web page information system editor

Legal Events

Date Code Title Description
PB01 Publication
PB01 Publication
SE01 Entry into force of request for substantive examination
SE01 Entry into force of request for substantive examination