[发明专利]配置化生成前端页面的方法、装置、设备及存储介质

说明书

本发明公开了一种配置化生成前端页面的方法、装置、设备及存储介质，通过在前端页面生成代码中引用了filter渲染文件以及list渲染文件，并且分别传入了当前的filter配置文件(变量$filter)和list配置文件(变量$list)，然后filter渲染页面根据传入的filter配置项渲染出分类名称以及主档分类两个查询字段，并且根据是否带有查询字段自动渲染了查询和重置按钮。同样的，list渲染页面会根据传入的list配置文件中的list_url调用对应的方法获取到表格数据，然后根据list配置文件展示对应的字段，主要运用了layui的表格自动渲染的功能。最终通过整合filter渲染后的数据和list渲染后的数据得到前端页面，其中filter渲染文件和list渲染文件不需要重复编写，每次开发前端功能，直接调用即可。

技术领域

本发明属于前端页面开发的技术领域，尤其涉及一种配置化生成前端页面的方法、装置、设备及存储介质。

背景技术

一般情况下开发一个软件系统可能前端风格都是差不多的，但是在不同的开发者开发之后可能前端的html以及css样式都是有各自的编码风格，虽然达到的页面效果是一样的，但是代码却是各有千秋，可能很多页面格式都是差不多的，但是每个页面都应用了各自单独的样式，这样就会造成重复代码冗余，并且也不利于后期页面的维护。

发明内容

本发明的目的是提供一种配置化生成前端页面的方法、装置、设备及存储介质，通过书写简单的配置文件filter(按钮以及查询条件等渲染)以及list(数据表格渲染)来达到相同的前端渲染效果，在前端数据表格的加载方面，只需要在配置文件中表明表格数据的来源，就可以按照传入的方法获取到数据来渲染表格，无需对页面单独编码表格数据，避免出现代码冗余及页面维护困难的现象。

为解决上述问题，本发明的技术方案为：

一种配置化生成前端页面的方法，包括：

将预先撰写的filter配置文件及其默认值作为参数传递给SlotFilterService类中的getDataByConfig方法，对filter配置文件中的配置信息做处理，得到变量$filter的数据结构；

将预先撰写的list配置文件及其默认值作为参数传递给SlotListService类中的getDataByConfig方法，对list配置文件中的配置信息做处理，得到变量$list的数据结构；

传递变量$filter及变量$list给前端页面生成代码，实现包括按钮、查询字段及数据表格在内的前端页面渲染。

根据本发明一实施例，所述filter配置文件中包括标题、按钮、隐藏字段及查询字段的配置信息，所述list配置文件中包括表格数据请求路径、初始页面显示记录数量、表格宽度及需要显示的表格字段的配置信息。

根据本发明一实施例，所述对filter配置文件中的配置信息做处理进一步包括：

对filter配置文件中的按钮进行处理，将每个按钮的访问路径进行解析，得到每个按钮点击后的请求路径；

对filter配置文件中查询字段进行处理，判断查询字段的类型是否为select选项，若是，则判定所述查询字段为下拉框，调用所述查询字段对应的方法，获取下拉框对应的下拉数据。

根据本发明一实施例，所述将每个按钮的访问路径进行解析，得到每个按钮点击后的请求路径进一步包括：

通过Config::get的方式获取filter配置文件中的内容，对filter配置文件中的按钮进行循环判断是否存在打开新窗口的请求路径及是否带有返回路径，若带有返回路径，则判断是否为复杂返回路径，若是，则将复杂返回路径进行拆分，解析出复杂返回路径的不同类型，根据类型返回相应的页面。

根据本发明一实施例，所述对filter配置文件中查询字段进行处理进一步包括：