[发明专利]一种前后台交互组件通用化的方法

权利要求书

1.一种前后台交互组件通用化的方法，其特征在于，包括以下步骤：

前台定义搭建框架渲染到界面所需的配置数据并发送给后台，后台根据数据格式返回相应配置数据；

前台发送请求后台返回配置数据进行封装，前台根据封装后的表单数组在浏览器中渲染出设备或变量的表格及表单；

当用户编辑表单时执行封装表单验证方法，用于表单增删改查提交时进行验证；

前台整合表单数据，传输用户编辑的数据值给后台，后台循环更新数据库返回给前台展示给用户。

2.根据权利要求1所述的一种前后台交互组件通用化的方法，其特征在于，所述配置数据包括设备管理表单及变量管理表单的如下表项字段：表项名称、prop值、表单类型、表单绑定数据，表单提示信息及表单验证条件；所述表单类型包括输入框和下拉框，下拉框包括下拉选项；

表项名称为数采设备属性，prop值为数采设备属性的标识，表单绑定数据为实际采集的数采设备属性的数据值，表单提示信息用于提示用户编辑内容，表单验证条件用于判断是否接受用户输入信息。

3.根据权利要求1所述的一种前后台交互组件通用化的方法，其特征在于，所述设备或变量的表格及表单包括：

静态表单需要前台预先渲染表项字段至界面，无需后台返回该字段；

动态表单需要前台预先搭建输入框框架、下拉选框框架，结合后台返回的数据配置渲染至界面；

表格加载数据时展示的内容：表头数据源、表格数据源、表格高度、点击行方法、分页总条数、当前条数及每页展示条数。

4.根据权利要求1所述的一种前后台交互组件通用化的方法，其特征在于，所述封装为将接收的后台数据依次存储在预先定义的空数组中，得到封装后的表单数组。

5.根据权利要求1所述的一种前后台交互组件通用化的方法，其特征在于，所述封装表单验证方法包括：

循环遍历封装好的表单数组中的数据，如果用户编辑的当前表单与表单数组中的任一数据的prop一致，再遍历该项数据的表单验证条件，若符合条件则前台接受用户编辑的内容，否则输出提示提醒用户该条内容的编辑格式。

6.根据权利要求1所述的一种前后台交互组件通用化的方法，其特征在于，所述表单验证条件采用if语句与正则表达式相结合的方式进行判断，是否包含：“字母或字母+数字组合”、“IP格式”、“整数”、“包含中文”。

7.根据权利要求1所述的一种前后台交互组件通用化的方法，其特征在于，所述整合的表单数据包括：

对于变量或设备管理表单：将动态表单的表项名称遍历出来，再将表项名称及对应用户编辑的数据以“键值对”的形式传值给后台；所述“键值对”的形式为{prop值：用户编辑的数据}；

对于静态表单中的频率表项，以“键值对”的形式传值给后台；所述“键值对”的形式为{frequency：用户编辑的数据}。