具体实施方式

下面将结合本发明实施例中的附图，对本发明实施例中的技术方案进行清楚、完整地描述，显然，所描述的实施例仅仅是本发明一部分实施例，而不是全部的实施例。基于本发明中的实施例，本领域普通技术人员在没有做出创造性劳动前提下所获得的所有其他实施例，都属于本发明保护的范围。

请参阅图1-3，本发明提供技术方案：包括智能表单设计模块S1、智能表单编辑模块S2、智能表单属性区别模块S3、智能表单渲染模块S4、智能表单数据对比模块S5和智能表单打印模块S6；

智能表单设计模块S1用于设计出满足用户需求的智能表单，并将设计出的智能表单传输至智能表单编辑模块S2；智能表单设计模块S1包括表单组件生成单元S11、组件属性设置单元S12、数据接收处理单元S13和数据库单元S14，表单组件生成单元S11用于在现有组件类型的基础上增加扩展自定义组件，在可视化界面上，通过vue-grid-layout组件使用鼠标拖曳生成各类满足用户需求的组件，将各组件配置成业务需要的表单，并将初步形成的表单传输至组件属性设置单元S12，智能表单中的基本控件包括静态文本、单行、多行输入框、单选框、复选框、下拉框、级联组件、日期控件、静态表格和动态表格，静态文本用于显示的静态文本类控件，主要支持域、id、标题、字体、对齐方式等属性；单行、多行输入框主要用于支持id，标题、标题宽度、对齐方式、限制类型(数字、精确度)等；单选框主要用于支持id，标题、标题宽度、对齐方式、选择项的配置等；复选框主要用于支持id，标题、标题宽度、对齐方式、选择项的配置等；下拉框主要用于支持id，标题、标题宽度、对齐方式、选择项的配置等；级联组件主要用于支持id，标题、标题宽度、对齐方式等，其中id支持CDASH字典联想输入，数据来源于业务端，通过回调钩子的方式从业务获取下拉数据，支持多级联动，一般可用于地域以及字典常量的选择；日期控件主要用于支持id，标题、标题宽度、对齐方式、日期格式、缺失选项、未来日期控制、宽高等，其中id支持CDASH字典联想输入；静态表格主要支持id，行列设置(包括数量、列宽、列名)、字体、对齐方式等，支持表格内部添加各类其他空间，以及统一设置每一列的属性等；动态表格主要用于支持id，行列设置(包括数量、列宽、列名)、字体、对齐方式等。支持表格内部添加各类其他空间，以及统一设置每一列的属性等，在表单填写是支持动态添加行，其中单选框、复选框、下拉框和级联组件的id支持CDASH字典联想输入，选择项的配置支持CDASH的codelist自动匹配，支持通过配置逻辑的方式实现子选项的联动操作，组件属性设置单元S12用于通过属性页对各个组件的属性进行定义，并将属性设置后组件的位置、排列信息和组件的属性数据使用Json进行装封，并将装封后的数据信息传输至数据接收处理单元S13，属性设置包括对字段id，字体、对齐方式、显示名称、宽度和选项等设置，数据接收处理单元S13用于接收组件属性设置单元S12传输的数据信息，并接收用户发送的AJAX请求，数据接收处理单元S13根据AJAX请求将Json字符串拆分成两个字段，然后将拆分的两个字段发送至数据库单元S14，数据接收处理单元S13为服务器，服务器用于对Json格式封装的数据信息进行处理，数据库单元S14用于接收数据接收处理单元S13发送的数据信息，并将接收的数据信息进行存储。

智能表单编辑模块S2用于根据智能表单设计模块S1设计的智能表单对试验数据进行填写，并将填写后的智能表单传递至智能表单属性区别模块S3，智能表单编辑模块S2包括智能表单数据获取单元S21、智能表单数据录入单元S22和智能表单存储单元S23，智能表单数据获取单元S21通过AXAJ请求从数据库单元S14获取符合用户需求的表单模板的排列信息和组件属性数据，并将获取的数据信息传输至智能表单数据录入单元S22，智能表单数据录入单元S22通过prop属性将排列信息和组件属性数据传输至智能表单内部，智能表单通过vue-grid-layout组件渲染到vue组件中，用户在渲染出的表单中填写数据信息，填写时，业务端与智能表单内部通过$emit和$on进行消息通讯，$emit用于将消息进行发送，$on用于接收发送的消息，以便传递用户的操作动作及数据，并将录入数据后的智能表单进行提交，智能表单存储单元S23将提交后的智能表单通过Json格式进行封装，并经过AJAX回传到服务器，对表单数据进行存储。

智能表单属性区别单元S3用于对当前智能表单与上一访视阶段试验记录的表单中各组件属性进行对比，并将对比后的结果数据传输至智能表单渲染模块S4，智能表单属性区别模块S3包括组件属性对比单元S31、组件属性区别标记单元S32、属性数据封装单元S33，组件属性对比单元S31对该次药物临床试验填写的各web表单的属性进行对比，将对比后区别于同属性的组件名称进行记录，并将记录后的组件名称传输至组件属性区别标记单元S32，组件属性区别标记单元S32对组件属性对比单元S31传输的组件名称进行接收，对接收的组件名称的属性进行标记，并将标记后的组件属性传输至属性数据封装单元S33，属性数据封装单元S33对组件属性区别标记单元S32标记后的组件属性数据进行接收，对接收的属性数据通过Json进行装封，并将封装后的属性数据信息传输至能表单渲染模块S4，智能表单渲染模块S4用于对智能表单属性区别模块S3传输的结果数据进行接收，并对区别出的组件进行渲染；智能表单渲染模块S4包括Json页面数据模板转换单元S41、组件渲染单元S42和渲染组件显示单元S43，Json页面数据模板转换单元S41根据智能表单属性区别模块S3传输的带有标记的属性对应的Json页面数据进行模板转换，获得待解析的AST文件，并将待解析文件传输至组件渲染单元S42，AST文件不依赖于具体的文法，不依赖于语言的细节，将Json页面数据转化为待解析的AST文件后，便于对AST文件进行相关操作，组件渲染单元S42通过vue组件对待解析的AST文件进行动态渲染，生成目标文件，目标文件为HTML，HTML文件运行在浏览器上，由浏览器进行解析，并将生成的目标文件传输至渲染组件显示单元S43，渲染组件显示单元S43接收组件渲染单元S42传输的目标文件，并在浏览器上打开目标文件进行显示，智能表单数据对比模块S5对渲染后在浏览器上进行展示的智能表单的数据进行对比分析，并将对比分析结果进行存储，渲染组件显示单元S43为PC浏览器或小程序端，渲染组件显示单元S43设置为PC浏览器或小程序端，便于使用者随时对web智能表单进行更改。

智能表单数据对比模块S5包括同属性数据折线图绘制单元S51、数据对比分析单元S52和数据分析结果存储单元S53；同属性数据折线图绘制单元S51根据智能表单属性区别模块S3区别出的同属性数据绘制出对应的折线图，并将绘制完成的折线图传输至数据对比分析单元S52，折线图为二维视图，其中x轴记录的为时间，y轴记录的为试验内容数据，将试验数据以折线图的方式进行展示，便于对试验结果进行有效分析，数据对比分析单元S52根据绘制完成的折线图进行对比分析，并结合各个折线图所对应的不同属性的数据进行观察，查找出对试验结果影响最大的数据，并将数据分析结果传输至数据分析结果存储单元S53，数据分析结果存储单元S53对数据对比分析单元S52传输的数据结果进行接收，并将数据对比分析结果与对应的折线图进行组合存储。

智能表单打印模块S6用于对编辑处理后的智能表单进行打印，智能表单打印模块S6从智能表单存储单元S23获取表单数据，并挂载到智能表单组件，监听mounted生命周期，等待智能表单渲染完成后，计算各组件渲染后的高度，进行分页拆分成若干个组件，每页一个组件，以保证组件在跨页时不被截取，避免打印出的智能表单无法进行使用，mounted生命周期为vue的生命周期。

智能表单通过普通npm组件接入的方式接入，智能表单主要参数为：isEdit:是否编辑模式；printModel：是否打印模式；userLayout：dom数据；input-search:CDASH字典联想输入回调数据源；cascader：级联组件数据回调；templASTeList：公共模板数据；save：保存回调方法；action-btn：操作按钮响应回调；componentValueChange：组件变化回调响应。

实施例：

Vue，是一套用于构建用户界面的渐进式JavaScript框架，Vue被设计为可以自底向上逐层应用；

npm组件，npm是一个软件包管理器，主要进行JAVAScript的包管理；

Json(JavaScript Object Notation,JS对象简谱)，是一种轻量级的数据交换格式。它基于ECMAScript(欧洲计算机协会制定的js规范)的一个子集，采用完全独立于编程语言的文本格式来存储和表示数据,简洁和清晰的层次结构使得Json成为理想的数据交换语言，易于人阅读和编写，同时也易于机器解析和生成，并有效地提升网络传输效率；

vue-grid-layout，是一个非常优秀的vue栅格拖动布局的组件；

AJAX，是一种在无需重新加载整个网页的情况下，能够更新部分网页的技术；

Prop属性，是一个对象,在这个对象里可以定义一些数据,而这些数据可以通过父组件传递给子组件，在没有状态管理机制的时候,prop属性是组件之间主要的通信方式；

CDASH(Clinical Data Acquisition Standards Harmonization)，表示临床数据获取标准协调；

Codelist，指代码列表；

$emit用于发送数据，$on用于接收数据；

Mounted，vue的生命周期；

HTML，是一种用于创建网页的标准标记语言；

AST，是源代码的抽象语法结构的树状表示，树上的每个节点都表示源代码中的一种结构。

需要说明的是，在本文中，诸如第一和第二等之类的关系术语仅仅用来将一个实体或者操作与另一个实体或操作区分开来，而不一定要求或者暗示这些实体或操作之间存在任何这种实际的关系或者顺序。而且，术语“包括”、“包含”或者其任何其他变体意在涵盖非排他性的包含，从而使得包括一系列要素的过程、方法、物品或者设备不仅包括那些要素，而且还包括没有明确列出的其他要素，或者是还包括为这种过程、方法、物品或者设备所固有的要素。

最后应说明的是：以上所述仅为本发明的优选实施例而已，并不用于限制本发明，尽管参照前述实施例对本发明进行了详细的说明，对于本领域的技术人员来说，其依然可以对前述各实施例所记载的技术方案进行修改，或者对其中部分技术特征进行等同替换。凡在本发明的精神和原则之内，所作的任何修改、等同替换、改进等，均应包含在本发明的保护范围之内。