A rapid development platform and method based on data model and front-end configuration model

Abstract

The present invention belongs to the field of data processing technology, and discloses a rapid development platform and method based on a data model and a front-end configuration model. The platform completes the construction and deployment of the front-end interface through an abstract data model and a front-end configuration model, provides a structured description of the application data through the data model, and enables the front-end to display and process various data; configures and combines through the front-end configuration model to build a front-end interface. The platform also supports interactive logic processing, and implements the specific execution of business logic through service layer configuration and front-end call command settings. The realization of this platform is expected to bring revolutionary changes to front-end development and promote the efficiency and quality of software development to a new level.

Description

Technical Field

[0001] The present invention belongs to the field of data processing technology, and in particular relates to a rapid development platform and method based on a data model and a front-end configuration model. Background Art

[0002] In today's information age, software development has become an integral part of any enterprise, and front-end development plays a crucial role in building efficient, user-friendly application interfaces. However, traditional front-end development methods often require significant time and resources and struggle to adapt quickly to evolving market demands and user expectations. To address this, rapid development platforms based on data models and front-end configuration models have emerged.

[0003] The above analysis reveals the following problems and shortcomings of existing technologies: Traditional development methods require writing a large amount of code from scratch, making the development process cumbersome and time-consuming. Product prototyping and iteration are relatively slow with traditional development methods, as each change requires manual code modification and retesting. Due to the tediousness and high technical requirements of traditional development methods, they are relatively slow to respond to business needs. Summary of the Invention

[0004] To overcome the problems existing in the related art, the disclosed embodiments of the present invention provide a rapid development platform and method based on a data model and a front-end configuration model.

[0005] The technical solution is as follows: a rapid development platform based on a data model and a front-end configuration model is used to build and deploy the front-end interface through the abstracted data model and the front-end configuration model. The data model provides a structured description of application data, enabling the front-end to display and process various data. The front-end configuration model is used to configure and combine the data to build the front-end interface. Specifically, it includes:

[0006] Business service module: used to process the business logic contained in the business service interface definition, interact with the database for data storage, update, and query, and provide external service interfaces;

[0007] Model parsing module: used to parse the front-end configuration model generated by the backend, convert the front-end configuration model data into HTML, CSS, and JS data for front-end page rendering, render the parsed content on the page, and componentize the web interface;

[0008] Model management module: used to create model data on the back end. Model data includes data models and interface models. The data model abstracts the characteristics of real business data and is used to describe the type, content, attributes and connections between data objects, and represents entity types and connections between entities. The interface model is used to describe the visual representation of the interaction between users and the system.

[0009] Furthermore, the business service module includes an interactive logic processing module for:

[0010] Service layer settings. The service layer consists of a service layer configuration file and an implementation class. The configuration file is responsible for configuring the address of the external interface, and the implementation class is used to implement the business logic of the interface.

[0011] Front-end call command settings: used to combine the business unit ID, scenario ID, view ID, and command ID in the service layer configuration file to form the interface call address of the back-end service.

[0012] Furthermore, the configuration file includes:

[0013] Business Unit: Contains the business unit code, which together with the business unit version field constitutes a unique business unit, business name, Caption business description, and context builder;

[0014] Business scenario Scene: includes scenario code, scenario name, and scenario description;

[0015] User-operated view interface View: view code, view name, view description;

[0016] Command reference cmdRef: contains command code, command name, command description, and referenced command code;

[0017] Implementation classes include:

[0018] The command parsing engine creates a parsing engine instance baseStationInstance, which finds the current runtime context builder. The builder builds a runtime context instance, which contains the currently accessed business unit, scenario code, user, and user-related information.

[0019] The industrial software base instance builds a business unit instance through the runtime context, and the business unit instance creates a scenario instance based on the context. The scenario instance calls the template function, which defines the order of code execution steps, encapsulates the common part of the function, and implements the variable part through subclasses; the corresponding function loads the executor from the class loader to execute the corresponding function, and the specific execution is handed over to the executor, which executes the corresponding running code.

[0020] Furthermore, the model parsing module includes a page model parser, which is used to parse the page configuration XML input from the backend at the front end, parse the XML into code that can be recognized and executed by the browser, and render the page.

[0021] Furthermore, the parsing process of the page model parser includes:

[0022] S1. Verify the validity of the XML file: Read all elements in the XML document. If there are errors or unrecognized elements, report a parsing error and indicate the incorrect element name and location.

[0023] S2, parsing logic layer;

[0024] S3, parsing style layer;

[0025] S4. Rendering layer analysis.

[0026] The step S2 of parsing the logic layer includes: first reading all <js>component, and then obtain <js>Content in component; create <script>标签，遍历<js>组件中的内容，把js组件中的内容逐条插入到<script>标签中；

[0027] 所述步骤S3解析样式层包括：首先读取所有的<css>组件，然后获取<css>组件中的内容；创建<style>标签，把<css>组件中的内容插入到<style>标签中。

[0028] 所述步骤S4渲染层解析包括：

[0029] S4.1布局的设定，给组件设置占用页面的列数，实现页面的左右布局；

[0030] 将组件<row>表示页面中的一行元素，包含在<row>组件内的元素在页面上呈现在一行上；

[0031] S4.2解析组件：先读取到组件类型，根据组件的类型找到对应的标签，并创建一个标签；再读取组件上的所有属性，遍历属性列表，与标签的属性进行比较，如果属性相同，把组件属性的值赋值给标签的属性，把组件属性添加到标签上；

[0032] S4.3组件组装：用递归方法，重复步骤S4.2将XML数据转换为浏览器能够解析的html数据；

[0033] S4.4页面渲染，包括：

[0034] S4.4.1解析HTML：当浏览器接收到组装完成的HTML文档后，由HTML解析器解析HTML文档，转换为DOM树；

[0035] S4.4.2解析CSS：遍历渲染树的每个节点，根据包括内联样式、样式表中的规则和浏览器默认样式计算每个节点的最终样式；

[0036] S4.4.3构建渲染树：将DOM树和CSSOM树结合起来，构建渲染树的树结构；

[0037] S4.4.4布局计算：浏览器根据渲染树的内容和样式，计算出每个元素在页面中的位置和大小；

[0038] S4.4.5绘制渲染树：将渲染树中的每个节点转化为屏幕上的实际像素。

[0039] 进一步，所述模型管理模块包括：

[0040] 数据模型：用于管理与数据库交互的后台数据模型，包含数据模型基本信息、字段名称、字段编码、字段类型、字段长度、数据表中自动编码、默认值、多对多关系、多对一关系；其中字段类型为枚举值选项，包括、int、long、float、double、String、boolean、对象；

[0041] 页面模型，用于设计页面的展示方式和展示样式，以及页面上包含的功能；页面模型设置采用界面模型设置，包含渲染层和逻辑层，以及CSS层。

[0042] 进一步，所述数据模型设置流程如下：

[0043] 步骤一、创建数据模型基本信息，使用文本编辑器创建一个xml文件，在xml文件中增加<data>标签，设置标签的基本信息包含模型名称、模型编码、数据表编码；

[0044] 步骤二、设置模型字段信息，在<data>标签内创建<field>标签，为<field>标签设置属性，包含字段名称、字段编码、字段类型、字段长度、数据表中自动编码、默认值、字段类型对象，所述字段类型对象包括多对多关系或者多对一关系；

[0045] 所述渲染层用于组装组件的信息包含组件名称、组件ID、组件样式、组件类型；

[0046] 所述逻辑层用于设置前端引用的js包、执行的方法、定义的参数；

[0047] 所述样式层，用于通过CSS组件解析<style>标签，在HTML中用于定义文档的样式信息，CSS组件内部通过编写CSS代码，指定HTML文档中各元素的样式。

[0048] 本发明的另一目的在于提供一种基于数据模型和前端配置模型快速开发方法，应用于所述基于数据模型和前端配置模型快速开发平台，该方法通过数据模型提供对应用程序数据的结构化描述，使前端展示和处理各种数据；通过前端配置模型进行配置和组合，构建出前端界面；具体包括：

[0049] 处理包含业务服务接口定义中的业务逻辑，并与数据库进行数据存储、更新、查询的数据交互，以及对外提供服务接口；

[0050] 解析后台生成的前端配置模型，将前端配置模型数据转换为用于前端页面渲染的html、css和js数据，并且将解析后的内容渲染到页面上，以及将web界面组件化；

[0051] 在后端创建模型数据，模型数据包括数据模型和界面模型，数据模型对现实业务数据特征的抽象，用于描述数据的类型、内容、属性以及数据对象之间的联系，表示实体类型及实体间联系；界面模型用于描述用户与系统交互的可视化表示。

[0052] 结合上述的所有技术方案，本发明所具备的有益效果为：

[0053] 本发明通过抽象化的数据模型和前端配置模型，实现前端界面的快速构建和部署，降低前端开发的难度和成本，提高开发效率和灵活性。平台包含业务服务模块、模型解析模块和模型管理模块，通过提供高效、灵活且易于维护的开发方式，帮助企业和开发者降低了应用程序的开发门槛和成本。其中，模型管理模块用于设置数据模型和页面模型，页面模型解析器则负责将后端传入的页面配置XML解析为浏览器能够识别、执行的代码，并进行页面渲染。此外，平台还支持交互逻辑处理，通过服务层配置和前端调用命令设置实现业务逻辑的具体执行。附图说明

[0054] 此处的附图被并入说明书中并构成本说明书的一部分，示出了符合本公开的实施例，并与说明书一起用于解释本公开的原理；

[0055] 图1是本发明实施例提供的基于数据模型和前端配置模型快速开发平台示意图；

[0056] 图2是本发明实施例提供的基于数据模型和前端配置模型快速开发平台原理图；

[0057] 图3是本发明实施例提供的数据模型设置模块原理图；

[0058] 图4是本发明实施例提供的页面模型原理图；

[0059] 图5是本发明实施例提供的页面模型解析器的解析流程图；

[0060] 图6是本发明实施例提供的基于数据模型和前端配置模型快速开发方法原理图；

[0061] 图中：1、业务服务模块；2、模型解析模块；3、模型管理模块。具体实施方式

[0062] 为使本发明的上述目的、特征和优点能够更加明显易懂，下面结合附图对本发明的具体实施方式做详细的说明。在下面的描述中阐述了很多具体细节以便于充分理解本发明。但是本发明能够以很多不同于在此描述的其他方式来实施，本领域技术人员可以在不违背本发明内涵的情况下做类似改进，因此本发明不受下面公开的具体实施的限制。

[0063] 本发明的创新点在于：本发明通过数据模型驱动的开发、前端配置模型的可视化配置、快速开发流程、跨平台支持以及集成能力等多个方面的创新，为开发者提供了一种高效、灵活、易用的软件开发方式。这种方式不仅提高了开发效率，降低了开发成本。

[0064] 本发明提供的快速开发平台的核心思想是通过抽象化的数据模型和前端配置模型，实现前端界面的快速构建和部署。数据模型提供了对应用程序数据的结构化描述，使得前端能够灵活地展示和处理各种数据。而前端配置模型则允许开发者通过简单的配置和组合，快速构建出功能丰富、交互性强的前端界面，而无需进行繁琐的手动编码。

[0065] 本发明提出一种基于数据模型和前端配置模型的快速开发平台的实现。该平台旨在通过提供一套完整的前端开发解决方案，帮助开发者更加高效地构建前端应用程序。通过利用数据模型和前端配置模型，该平台能够自动化生成前端代码，并提供丰富的组件库和可视化配置工具，从而大幅降低前端开发的难度和成本。

[0066] 本发明提出了一种以后驱前的技术路线，实现了一个快速开发平台，通过提供高效、灵活且易于维护的开发方式，帮助企业和开发者降低了应用程序的开发门槛和成本，提高了开发效率和灵活性。

[0067] 实施例1，如图1所示，本发明实施例提供的基于数据模型和前端配置模型快速开发平台包括业务服务模块1、模型解析模块2、模型管理模块3三个模块；

[0068] 所述业务服务模块1：主要承担处理业务逻辑的任务，是连接用户界面与数据库之间的桥梁。包含业务服务接口定义中的具体业务逻辑，与数据库进行数据存储、更新、查询等数据交互操作，对外提供服务接口。

[0069] 所述模型解析模块2：主要功能为解析后台生成的前端配置模型，将模型数据转换为可用于前端页面渲染的html、css和js数据，并且将解析后的内容渲染到页面上。该模块还将web界面组件化，分为渲染层和逻辑层。渲染层主要负责渲染可视化界面，逻辑层主要负责实现逻辑处理。

[0070] 所述模型管理模块3：该模块主要用于在后端创建模型数据。模型数据分为数据模型和界面模型，数据模型是对现实业务数据特征的抽象，用于描述数据、组织数据和对数据进行操作。数据模型是数据库系统的核心和基础，描述了数据的类型、内容、属性以及数据对象之间的联系，表示了实体类型及实体间联系。界面模型是用于描述用户与系统交互的可视化表示，不仅关注界面的布局和外观，还关注用户与界面之间的交互行为。数据模型是对现实业务数据特征的抽象，用于描述数据、组织数据和对数据进行操作。数据模型是数据库系统的核心和基础，描述了数据的类型、内容、属性以及数据对象之间的联系，表示了实体类型及实体间联系。数据模型作为数据库架构的基石，深刻反映了业务领域的本质特征，通过精准定义数据的结构、类型、约束以及实体间的复杂关系，确保了数据的完整性、一致性和高效性。数据模型不仅为数据存储与检索提供了坚实的框架，还保障了数据在不同模块间的无缝流通与共享。界面模型聚焦于用户与系统之间的直接对话，通过精心设计的可视化元素与交互流程，构建出既美观又易用的用户界面。界面模型不仅关注于布局的合理性与视觉的吸引力，更强调用户操作的便捷性、反馈的即时性以及整体体验的流畅性。界面模型通过定义清晰、高效的接口，界面模型能够实时调用后台服务，实现数据的双向流动。用户操作触发接口调用，后台响应并处理请求，再将结果反馈至界面，这一过程无缝衔接，确保了用户能够即时获得系统反馈与数据更新。

[0071] 界面模型通常指的是由窗口、按钮、菜单、图标等组成的视觉布局和交互元素。这些元素的设计需要考虑到用户如何理解和操作界面，以实现直观、高效的交互。

[0072] 其中，图2为本发明实施例提供的基于数据模型和前端配置模型快速开发平台原理。

[0073] 实施例2，作为进一步优选实施例，模型管理模块3包括：

[0074] 数据模型：主要用于管理与数据库交互的后台数据模型，如图3所示。包含数据模型基本信息、字段名称、字段编码、字段类型、字段长度、数据表中自动编码、默认值、多对多关系、多对一关系。其中字段类型为枚举值可选项有、int、long、float、double、String、boolean、对象。

[0075] 数据模型设置流程如下。

[0076] 步骤一、创建数据模型基本信息。使用文本编辑器创建一个xml文件，在xml文件中增加<data>标签，设置标签的基本信息包含模型名称（name）、模型编码（code）、数据表编码（tableCode）。

[0077] 步骤二、设置模型字段信息。在<data>标签内创建<field>标签，为<field>标签设置属性，包含字段名称（name）、字段编码（code）、字段类型（type）、字段长度（length）、数据表中自动编码（columnCode）、如果有默认值需要设置默认值（defaultvalue）、字段类型是对象必须设置多对多关系或者多对一关系（relation），如图3所示。

[0078] 页面模型设置，用于设计页面的展示方式和展示样式，以及页面上包含哪些功能。页面模型设置采用界面模型设置，包含渲染层设置和逻辑层设置，以及CSS层设置；

[0079] 其中，渲染层设置包括：

[0080] 展示层，主要是组装组件的信息包含组件名称、组件ID、组件样式、组件类型。组件名称是本组件的名字，允许重复。组件ID是本组件在整个页面中的唯一标识，不允许重复。在逻辑处理、事件绑定等设置时具有关联作用。组件样式是定义组件的展示样式例如：背景色、长度、高度、字体颜色等样式。判断组件样式和CSS样式是否设置了相同的样式名称，如果设置了相同的样式名称，则出现样式冲突的情况。当组件样式和CSS组件设置的样式冲突时，组件样式的优先级高于CSS组件样式。组件类型支持所有常见的html控件，包含：布局（layout）、行（row）、列（col）、按钮（button）、文字链接（link）、单选框（radio）、多选框（checkbox）、输入框（input）、计数器（inputNumber）、密码框（inputPassword）、文本域（inputTextarea）、选择器（select）、开关（switch）、日期选择器（datePicker）、日期时间选择器（dateTimePicker）、上传（upload）、穿梭框（transfer）、表单（form）、表单内容（form-item）、表格（table）、树形控件（tree）、分页（pagination）、导航菜单（navMenu）、标签页（tabs）、图片（image）；

[0081] 在本发明实施例中，逻辑层设置包括：

[0082] 逻辑层主要设置前端引用的js包、执行的方法、定义的参数。Js组件可以直接在HTML文档中嵌入JavaScript代码，这些代码会被解析到<script>和< / script> In between. All events and logic on the page are executed here. In addition to directly embedding code, js components can also reference external JavaScript files through the src attribute.

[0083] In an embodiment of the present invention, the style layer, i.e., the CSS layer, includes:

[0084] The CSS component will be parsed into <style>标签，在HTML中的主要作用是用于定义文档的样式信息，它可以帮助开发者控制和样式化HTML元素的呈现方式。CSS组件内部可以编写CSS（层叠样式表）代码，这些代码用于指定HTML文档中各元素的样式，如颜色、字体、布局等。通过这些样式定义，可以创建出视觉上吸引人且具有高度可读性的网页。页面模型如图4所示。

[0085] 实施例3，作为优选实施例，所述模型解析模块2包括：

[0086] 页面模型解析器，用于在前端解析后端传入的页面配置XML，将XML解析为浏览器能够识别、执行的代码，并且将页面渲染处理。具体页面模型解析器的解析流程如图5、图6所示，包括：

[0087] S1、验证XML文件的合法性：解析器可以检查XML文档的合法性，验证其是否符合XML的规范以及是否遵循了相关的DTD（文档类型定义）或XML Schema。解析器首先会读取XML文档中所有的元素，如果存在错误或无法识别的元素，解析器会报告解析错误，并且提示存在错误的元素名称和位置。

[0088] S2、解析逻辑层：

[0089] 首先读取所有<js>组件，然后获取<js>组件中的内容。

[0090] 创建<script>标签，遍历<js>组件中的内容，把js组件中的内容逐条插入到<script>标签中。

[0091] S3、解析样式层：

[0092] 首先读取所有的<css>组件，然后获取<css>组件中的内容。

[0093] 创建<style>标签，把<css>组件中的内容插入到<style>标签中。

[0094] S4、渲染层解析：

[0095] S4.1、布局的设定。整个页面平均分为36列，只要给组件设置占用页面的列数，设置span =’6’，即占页面的六分之一大小，即可轻松的实现页面的左右布局。

[0096] 组件<row>表示页面中的一行元素，包含在<row>组件内的元素在页面上呈现在一行上。从配置文件从上往下开始解析，遇到<row>就换到下一行，实现页面的上下布局。

[0097] S4.2、解析组件：

[0098] 每一种组件在前端都对应一种标准的HTML标签元素。解析器先读取到组件类型，根据组件的类型找到对应的标签，并创建一个标签。再读取组件上的所有属性，遍历属性列表，与标签的属性进行比较，通过属性的名字进行属性是否相同的判定，如果属性相同，就把组件属性的值赋值给标签的属性，这样就把组件属性添加到标签上。本发明支持vue框架下的所有属性。

[0099] S4.3、组件组装：

[0100] 用递归方法，重复步骤S4.2将XML数据转换为浏览器能够解析的html数据。在解析XML时，从前开始往后解析。在步骤S4.2中已经对标签元素和标签的属性进行了对应，所以在解析到标签时和属性时，可以直接根据对应关系，进行替换。这样对xml数据只需要一次遍历便可以完成XML数据到HTML数据的转换。

[0101] S4.4、页面渲染，包括：

[0102] S4.4.1、解析HTML：当浏览器接收到组装完成的HTML文档后，首先会由HTML解析器解析HTML文档，将其转换为DOM树（文档对象模型）。DOM树是一个节点树，它代表了文档的结构，每个节点都对应HTML文档中的一个元素。

[0103] S4.4.2、解析CSS：同时，浏览器也会解析外部和内部的CSS样式表，生成CSSOM树（CSS对象模型）。这个过程包括遍历渲染树的每个节点，根据包括内联样式、样式表中的规则和浏览器默认样式来计算每个节点的最终样式，这些属性将影响元素在页面上的最终呈现。

[0104] S4.4.3、构建渲染树：

[0105] 接下来，浏览器会将DOM树和CSSOM树结合起来，构建一个称为渲染树的树结构。渲染树只包含需要显示的页面元素和这些元素的样式信息。

[0106] S4.4.4、布局计算：

[0107] 一旦渲染树构建完成，浏览器会开始进行布局计算，也称为重排或回流。在这个过程中，浏览器会根据渲染树的内容和样式，计算出每个元素在页面中的位置和大小。这是一个重要的步骤，因为它确定了每个元素在屏幕上的精确位置。

[0108] S4.4.5、绘制渲染树：

[0109] 布局计算完成后，浏览器会开始绘制渲染树。这个过程将渲染树中的每个节点转化为屏幕上的实际像素，通过绘制操作将它们显示在用户的屏幕上。这个阶段也称为重绘。

[0110] 实施例4，作为本发明的优选实施例，所述业务服务模块1包括交互逻辑处理模块，具体包括：

[0111] （i）服务层设置：服务层配置文件和实现类组成，配置文件负责配置对外接口的地址，实现类是接口的业务逻辑具体的实现。具体包括：

[0112] （i.1）配置文件设置，包括：

[0113] Unit：是业务单元，最基本的业务模块节点。包含id（业务单元编码）,与 version（业务单元版本）字段共同构成唯一的业务单元、

[0114] Name（名称）、Caption（业务描述）、contextBuilder（上下文构建器）。业务单元内部传递数据与工软基台的交互等都通过context,contextBuilder负责构建context。

[0115] Scene：业务场景，包含id（场景编码,本业务单元内唯一）、name（场景名称）、caption（场景描述）。

[0116] View：用户操作的视图界面，视图是一个虚拟的概念实际的对应关系可能多个页面或者多个组件共同对应一个视图。包含包含id（视图编码,本业务单元内唯一）、name（视图名称）、caption（视图描述）。

[0117] cmdRef：命令引用。id（命令编码，在本视图内唯一，如果不指定cmdCode则使用id代替cmdCode,如果指定了cmdCode，则引用的命令编码为cmdCode中的值）、name（名称）、caption（描述）cmdCode（引用的命令编码）。

[0118] （i.2）xml配置解析，包括：

[0119] 由命令解析引擎创建一个解析引擎实例baseStationInstance，由解析引擎实例找到当前运行时上下文构建器，由构建器构建一个运行时上下文实例（包含当前访问的业务单元、场景编码、用户、用户相关信息）；

[0120] 工软基台实例通过运行时上下文构建一个业务单元实例，由业务单元实例根据上下文创建一个场景实例，场景实例调用模板函数，模版函数定义了代码的执行的步骤的顺序，封装了函数的公共部分，可变部分可以通过子类来实现；具体过程为：

[0121] 1. 定义运行时上下文：使用一个类来表示运行时上下文，该类包含多个属性和方法，用于存储和访问上下文数据。

[0122] 2. 创建业务单元实例：定义一个业务单元基类，包含一些基本的业务逻辑处理方法。每个具体的业务单元通过继承这个基类并实现特定的方法来创建其实例。在创建实例时，将运行时上下文作为参数传递给构造函数，以便在业务逻辑中使用。

[0123] 3. 由业务单元实例创建场景实例：在业务单元内部，根据运行时上下文的不同或业务逻辑的特定需求，动态创建场景实例。场景实例可以包含多个步骤，这些步骤按照预定义的顺序执行。

[0124] 4. 场景实例调用模板函数：使用模板方法设计模式，在模板函数中定义好执行流程，包括一些固定步骤和可变步骤（这些可变步骤通过抽象方法定义，留待子类实现）。场景实例通过调用模板函数来执行其业务逻辑，而模板函数中的可变部分则由场景实例所属的类（即子类）来实现。

[0125] 5. 封装公共部分，通过子类实现可变部分：在模板函数中定义好公共步骤和逻辑，然后通过抽象方法或接口定义可变部分。每个场景实例所属的类（子类）负责实现这些抽象方法或接口，从而提供具体场景所需的逻辑。

[0126] 第一段是创建命令解析引擎。第二段的工软基台示例，用于调用创建的命令解析引擎。执行相应功能相应函数从类加载器(BeanLoader)中加载执行器，将具体执行交给执行器，执行器执行对应的运行代码。

[0127] 创建命令解析引擎：定义识别命令的触发点。这些触发点可能是用户界面上的按钮点击、API调用、定时任务或其他任何能够产生命令输入的事件。

[0128] 使用BeanLoader加载执行器：当命令解析引擎确定需要执行某个命令时，它会通过BeanLoader（一个类加载器或依赖注入容器）来加载并执行该命令对应的执行器（可能是命令类的一个实例，或者是其他能够执行命令逻辑的组件）。BeanLoader负责根据配置或约定查找并实例化执行器。

[0129] 执行命令：一旦执行器被加载，命令解析引擎就调用执行器的相应方法来执行命令。执行器可能会进一步调用其他服务或组件来完成命令的执行。执行器执行完命令后，需要将结果返回给命令解析引擎，由解析引擎将结构返回给触发命令的源头。结果的处理方式取决于具体的应用场景和需求。

[0130] （ii）前端调用命令设置：服务层配置文件中业务单元id、场景id、视图id、命令id拼接在一起就是后端服务的接口调用地址，如：单元id\场景id\视图id\命令id。

[0131] 实施例4，本发明实施例提供一种基于数据模型和前端配置模型快速开发方法，该方法通过数据模型提供对应用程序数据的结构化描述，使前端展示和处理各种数据；通过前端配置模型进行配置和组合，构建出前端界面；具体包括：

[0132] 处理包含业务服务接口定义中的业务逻辑，并与数据库进行数据存储、更新、查询的数据交互，以及对外提供服务接口；

[0133] 解析后台生成的前端配置模型，将前端配置模型数据转换为用于前端页面渲染的html、css和js数据，并且将解析后的内容渲染到页面上，以及将web界面组件化；

[0134] 在后端创建模型数据，模型数据包括数据模型和界面模型，数据模型对现实业务数据特征的抽象，用于描述数据的类型、内容、属性以及数据对象之间的联系，表示实体类型及实体间联系；界面模型用于描述用户与系统交互的可视化表示。

[0135] 在上述实施例中，对各个实施例的描述都各有侧重，某个实施例中没有详述或记载的部分，可以参见其它实施例的相关描述。

[0136] 本发明提出一种基于数据模型和前端配置模型的快速开发平台，旨在提高前端开发的效率和质量。该平台通过抽象化的数据模型和前端配置模型，实现了前端界面的快速构建和部署。数据模型提供了对应用程序数据的结构化描述，使得前端能够灵活地展示和处理各种数据；而前端配置模型则允许开发者通过简单的配置和组合，快速构建出功能丰富、交互性强的前端界面，无需进行繁琐的手动编码。

[0137] 平台包含业务服务模块、模型解析模块和模型管理模块三个核心模块。业务服务模块负责处理业务逻辑和与数据库进行交互；模型解析模块负责解析前端配置模型，将其转换为可用于页面渲染的html、css和js数据；模型管理模块则用于在后端创建和管理数据模型和界面模型。

[0138] 该平台还具有灵活的扩展性和定制性，能够满足不同企业的特定需求。通过实现该平台，开发者将能够更加专注于业务逻辑的实现，降低开发难度和成本，提高开发效率。未来，基于数据模型和前端配置模型的快速开发平台有望成为前端开发的新范式，推动软件开发的效率和质量迈向新的高度。

[0139] 以上所述，仅为本发明较优的具体的实施方式，但本发明的保护范围并不局限于此，任何熟悉本技术领域的技术人员在本发明揭露的技术范围内，凡在本发明的精神和原则之内所作的任何修改、等同替换和改进等，都应涵盖在本发明的保护范围之内。< / style> < / js> < / js>

Claims

1. A rapid development platform based on data model and front-end configuration model, characterized in that: The platform completes the construction and deployment of the front-end interface through an abstract data model and front-end configuration model. It provides a structured description of application data through the data model, allowing the front-end to display and process various data. The front-end interface is constructed by configuring and combining the front-end configuration model; specifically, it includes: Business service module (1): used to process the business logic contained in the business service interface definition, and to interact with the database for data storage, update, and query, as well as to provide service interfaces to the outside world; Model parsing module (2): used to parse the front-end configuration model generated by the background, convert the front-end configuration model data into HTML, CSS and JS data for front-end page rendering, render the parsed content on the page, and componentize the web interface; Model management module (3): used to create model data in the backend. Model data includes data model and interface model. Data model is an abstraction of the characteristics of real business data. It is used to describe the type, content, attributes and relationship between data objects, and to represent entity types and relationships between entities. Interface model is used to describe the visual representation of the interaction between users and the system. The business service module (1) comprises an interactive logic processing module, which is used for: Service layer settings. The service layer consists of a service layer configuration file and an implementation class. The configuration file is responsible for configuring the address of the external interface, and the implementation class is used to implement the business logic of the interface. Front-end call command settings: used to combine the business unit id, scenario id, view id, and command id in the service layer configuration file to form the interface call address of the back-end service; The model parsing module (2) includes a page model parser, which is used to parse the page configuration XML input from the back end at the front end, parse the XML into a code that can be recognized and executed by the browser, and render the page; The model management module (3) comprises: Data model: a backend data model used to manage interactions with the database, including basic information about the data model, field name, field code, field type, field length, automatic coding in the data table, default value, many-to-many relationship, and many-to-one relationship; the field type is an enumeration value option, including int, long, float, double, String, boolean, and object; The page model is used to design the display method and style of the page, as well as the functions included in the page; the page model setting adopts the interface model setting, which includes the rendering layer, the logic layer, and the CSS layer.

2. The rapid development platform based on data model and front-end configuration model according to claim 1 is characterized in that: The configuration file includes: Business unit Unit: contains the business unit code, which together with the business unit version field constitutes a unique business unit, business name, Caption business description, and context builder; Business scenario Scene: includes scenario code, scenario name, and scenario description; The view interface for user operations: view code, view name, view description; Command reference cmdRef: contains command code, command name, command description, and referenced command code; The implementation classes include: The command parsing engine creates a parsing engine instance baseStationInstance, the parsing engine instance finds the current runtime context builder, and the builder builds a runtime context instance, the runtime context instance includes the currently accessed business unit, scenario code, user, and user related information; The industrial software base instance builds a business unit instance through the runtime context, and the business unit instance creates a scenario instance according to the context. The scenario instance calls the template function, which defines the order of code execution steps, encapsulates the common part of the function, and implements the variable part through subclasses; the corresponding function loads the executor from the class loader to execute the corresponding function, and the specific execution is handed over to the executor, which executes the corresponding running code.

3. The rapid development platform based on data model and front-end configuration model according to claim 1 is characterized in that: The parsing process of the page model parser includes: S1. Verify the validity of the XML file: read all elements in the XML document. If there are errors or unrecognizable elements, report parsing errors and indicate the name and position of the incorrect element. S2, parsing logic layer; S3, parsing style layer; S4, rendering layer analysis.

4. The rapid development platform based on data model and front-end configuration model according to claim 3 is characterized in that: The step S2 of parsing the logic layer includes: first reading all <js>Component, then get <js>Content in component; create <script>标签，遍历<js>组件中的内容，把js组件中的内容逐条插入到<script>标签中；所述步骤S3解析样式层包括：首先读取所有的<css>组件，然后获取<css>组件中的内容；创建<style>标签，把<css>组件中的内容插入到<style>标签中。5.根据权利要求3所述的基于数据模型和前端配置模型快速开发平台，其特征在于，所述步骤S4渲染层解析包括：S4.1布局的设定，给组件设置占用页面的列数，实现页面的左右布局；将组件<row>表示页面中的一行元素，包含在<row>组件内的元素在页面上呈现在一行上；S4.2解析组件：先读取到组件类型，根据组件的类型找到对应的标签，并创建一个标签；再读取组件上的所有属性，遍历属性列表，与标签的属性进行比较，如果属性相同，把组件属性的值赋值给标签的属性，把组件属性添加到标签上；S4.3组件组装：用递归方法，重复步骤S4.2将XML数据转换为浏览器能够解析的html数据；S4.4页面渲染，包括：S4.4.1解析HTML：当浏览器接收到组装完成的HTML文档后，由HTML解析器解析HTML文档，转换为DOM树；S4.4.2解析CSS：遍历渲染树的每个节点，根据包括内联样式、样式表中的规则和浏览器默认样式计算每个节点的最终样式；S4.4.3构建渲染树：将DOM树和CSSOM树结合起来，构建渲染树的树结构；S4.4.4布局计算：浏览器根据渲染树的内容和样式，计算出每个元素在页面中的位置和大小；S4.4.5绘制渲染树：将渲染树中的每个节点转化为屏幕上的实际像素。6.根据权利要求1所述的基于数据模型和前端配置模型快速开发平台，其特征在于，所述数据模型设置流程如下：步骤1、创建数据模型基本信息，使用文本编辑器创建一个xml文件，在xml文件中增加<data>标签，设置标签的基本信息包含模型名称、模型编码、数据表编码；步骤2、设置模型字段信息，在<data>标签内创建<field>标签，为<field>标签设置属性，包含字段名称、字段编码、字段类型、字段长度、数据表中自动编码、默认值、字段类型对象，所述字段类型对象包括多对多关系或者多对一关系；所述渲染层用于组装组件的信息包含组件名称、组件ID、组件样式、组件类型；所述逻辑层用于设置前端引用的js包、执行的方法、定义的参数；所述样式层，用于通过CSS组件解析<style>标签，在HTML中用于定义文档的样式信息，CSS组件内部通过编写CSS代码，指定HTML文档中各元素的样式。7.一种基于数据模型和前端配置模型快速开发方法，其特征在于，应用于如权利要求1-6任意一项所述基于数据模型和前端配置模型快速开发平台，该方法通过数据模型提供对应用程序数据的结构化描述，使前端展示和处理各种数据；通过前端配置模型进行配置和组合，构建出前端界面；具体包括：处理包含业务服务接口定义中的业务逻辑，并与数据库进行数据存储、更新、查询的数据交互，以及对外提供服务接口；解析后台生成的前端配置模型，将前端配置模型数据转换为用于前端页面渲染的html、css和js数据，并且将解析后的内容渲染到页面上，以及将web界面组件化；在后端创建模型数据，模型数据包括数据模型和界面模型，数据模型对现实业务数据特征的抽象，用于描述数据的类型、内容、属性以及数据对象之间的联系，表示实体类型及实体间联系；界面模型用于描述用户与系统交互的可视化表示。< / script> < / js> < / js>

Images