Business process construction method combining workflow engine and dynamic form

Abstract

The invention provides a business process construction method combining a workflow engine and a dynamic form, which relates to the technical field of low-code platforms, and comprises the following steps of: establishing a data table according to a business, selecting and importing the data table in a code generation module, generating a basic code package, re-operating a main program compiling code package and loading the code package to a JVM (Java Virtual Machine) operating environment; creating a dynamic form on the basis of the entity class information of the code package through a visual form designer of the dynamic form module, and outputting dynamic form configuration in a JSON (JavaScript Object Notation) format; according to the method, the dynamic form and the process engine are combined, highly flexible business process design can be realized, a user can dynamically design the form and the process model as required to meet different business requirements, and the user-defined component can be designed according to a business data structure and common functions, so that the form can better adapt to a specific business scene, and the user experience is improved. And the user experience and the working efficiency are improved.

Description

Technical Field

[0001] The present invention relates to the field of low-code platform technology, and in particular to a business process construction method combining a workflow engine and a dynamic form. Background Art

[0002] With the continuous development of enterprise information management, more and more business processes need to be processed automatically in information systems. The limitations of traditional BPM systems and workflow engines are that they are too rigidly dependent on processes and forms, lack flexibility and adaptability, and often require a lot of manual intervention to cope with changes. The technical architecture that combines workflow engines and dynamic forms provides higher flexibility, maintainability and scalability, making the design and modification of business processes and forms more dynamic and automated, significantly improving the response speed of the enterprise and the adaptability of the system. This approach enables enterprises to manage complex and dynamic business processes more efficiently, reducing development and maintenance costs and improving the overall efficiency of the system.

[0003] The introduction of dynamic form technology allows business systems to create and adjust forms more flexibly according to business needs, while the application of workflow engines allows business processes to run automatically. By combining dynamic forms with workflow engines, more efficient, flexible and intelligent business process management can be achieved, which is of great significance, especially in corporate environments where processes and form content need to be adjusted frequently.

[0004] In addition, with the popularity of microservice architecture and cloud computing, it is increasingly important to build scalable, modular and easy-to-maintain business process systems. This technology helps improve the scalability, flexibility and maintainability of the system through dynamic generation of code packages, visual form design and flexible workflow management, which meets the needs of modern enterprise applications. The core advantage of this method is that it reduces developers' dependence on static processes and fixed forms through automation, while improving the adaptability and maintainability of the system. Summary of the invention

[0005] In view of the above problems, the present invention proposes a business process construction method combining a workflow engine and a dynamic form. The method realizes highly flexible business process design by integrating a dynamic form with a workflow engine. Users can dynamically design and adjust forms and process models according to actual needs, thereby better meeting changing business needs.

[0006] To achieve the purpose of the present invention, the present invention is implemented by the following technical solution: a business process construction method combining a workflow engine and a dynamic form, comprising the following steps:

[0007] S1: Create a data table according to the business, select and import the data table in the code generation module, generate a basic code package, re-run the main program to compile the code package and load it into the JVM running environment;

[0008] S2: Use the visual form designer of the dynamic form module to create a dynamic form based on the entity class information of the code package and output the dynamic form configuration in JSON format;

[0009] S3: Render the form through the dynamic form engine of the dynamic form module, generate the form page corresponding to the code package, receive the data submitted by the form page through the CRUD interface of the code package and store it in the database;

[0010] S4: The dynamic process module builds business processes based on dynamic forms, establishes workflows according to business processes, configures dynamic forms for workflow nodes, sets up mappings between form fields and process variables, and publishes workflows;

[0011] S5: Start the workflow, display the dynamic form during the process approval process, collect the form data and cache it in the process variables, make conditional judgments based on the process variables, determine the node flow direction, and complete the workflow.

[0012] A further improvement is that: S1 comprises the following steps:

[0013] Clarify business requirements, understand the data structure and relationships required by the system, and design corresponding data tables based on these requirements, including table fields, data types, and relationships between tables;

[0014] Import the above data table through the code generation module, identify the data table structure, and generate a corresponding code template according to it. The code generation module includes a code generation builder and a code generation engine;

[0015] Unzip the code package generated above and introduce the code files into the main program code project, recompile the main program, compile all code files into bytecodes and load them into the JVM environment for running.

[0016] Further improvements are as follows: the code generation builder and the code generation engine are specifically as follows: based on the MyBatis-PlusGenerator code generator, a code generation builder CodegenBuilder is developed, the database configuration is loaded using the DataSourceConfig.Builder class of MyBatis-PlusGenerator, a database connection is established, all tables of the database are queried, and then serialized into JavaBeans. CodegenBuilder then parses TableInfo to split the data table information and data field information into structured objects of CodegenTable and CodegenColumn, respectively, and stores them in the database; based on the Velocity template engine technology, a code generation engine CodegenEngine is developed. CodegenEngine extracts key information based on the above-mentioned imported data tables CodegenTable and CodegenColumn and maps them into a hash list, and then fills the cached variables in the hash list into the preset code template to generate the corresponding entity class, DAO layer, Service layer and Controller layer code class files. Finally, all code class files are packaged into a compressed package, namely, a code package, in Zip format.

[0017] Further improvement is: in said S2, the form designer is a visual form designer secondary developed based on the open source front-end form designer form-create-designer, with the underlying vue3 and element-plus UI framework, including the front-end components required to build dynamic form pages and customize a variety of custom components. At the same time, the form designer extends the support for the code generation module, and is also used to create forms and output form configurations, wherein the customization of a variety of custom components includes the following steps:

[0018] Build page content based on vue.js and element-plus framework, combine ElSelect selector component and HTTP request library to build events that call backend Restful API interface, and use vue syntax to encapsulate it into custom components;

[0019] Register the vue interface app.component to the app global mount, so that the entire front-end application including the form designer supports the above custom components;

[0020] Add a custom component group through the form designer interface designer.addMenu, set the component's 'generation rules' for each custom component, call the interface to add the above custom component to the group, complete the loading of the custom component, and display and operate the above custom component in the visual interface of the form designer.

[0021] Further improvements are: the form designer extends support for the code generation module, including the following steps:

[0022] The form designer adds a 'code package data drop-down list' to query and display the data of the above code package, including data tables and data fields; adds a 'code package CRUD interface document display table', the table display content includes interface description, input and output data structure;

[0023] When a data item in the 'Code Package Data Display List' is selected, in the component's upadte(val, rule, fapi, arg) callback function, the data field of the corresponding data table is obtained and formatted as the drop-down option bindFieldOptions, and then updated to the global variable of the form designer through designerForm.setData(). The corresponding data field option is subsequently obtained in the component's dynamic rendering;

[0024] By adding the rendering rule of 'Data Field Drop-Down List' to the component base rendering rule of the form designer, when a component is dragged out in the form designer, the 'Data Field Drop-Down List' component will be dynamically rendered at the component base configuration, and then the global variable bindFieldOptions will be dynamically loaded through the effect.loadData parameter in the baseRule attribute and inserted into the options of the component as its drop-down option.

[0025] Further improvements are: the form designer creates a form and outputs the form configuration, including the following steps:

[0026] The form designer is divided into three areas: left, middle, and right. The left side is the 'component library area' for draggable components and templates, the middle is the 'form design area' for displaying components and adjusting layouts, and the right side is the 'configuration area' for the entire form or components.

[0027] The component library area displays various basic components and custom components. Drag the selected component on the left to the design area to render the component. The form designer appends the generation rules of the component to the form rendering engine to dynamically generate the component.

[0028] In the configuration area on the right, when a component in the form design area is not selected, the form global configuration is displayed and modified. After a component in the form design area is selected, the component configuration is displayed. The configuration area has the corresponding form global configuration 'code package data drop-down list', 'code package CRUD interface document display table' and the corresponding component configuration 'data field drop-down list' functions;

[0029] Use the above functions to obtain the data table, data table fields, and CRUD interface documents of the code package. According to the fields required by the business, select the appropriate form component or layout component from the component library on the left, drag and drop it to the middle form design area, select the component, and select the bound data field in the 'Data field drop-down list' in the configuration area on the right;

[0030] When a data field is selected in the 'data field drop-down list', in its upadte(val, rule, fapi, arg) callback function, the name of the selected data field is updated to the title of the above selected component through the fapi.setValue interface, and at the same time, it is verified whether the component conforms to the data type of the data field. This operation is repeated until the form is created;

[0031] Finally, save the form, which is divided into form configuration and form structure, which are converted into JSON strings respectively. The form configuration records the binding basic form configuration information; the form structure saves the structure of each form component. Multiple form structures form an array and then convert it into a JSON string for storage.

[0032] A further improvement is that: S3 comprises the following steps:

[0033] Based on the dynamic form configuration and structure of the code package, the front-end page of the code package is built, including the query list page and the detail page. The dynamic form engine obtains the dynamic form configuration and structure according to the form number by remotely calling the back-end service API, and converts the string into the form configuration conf and form structure fields through JSON.parse;

[0034] Parse the form configuration conf, merge the global configuration attribute parameters into the default attributes of the component, including the form component size, font size, label position, set whether the form button is displayed according to the button parameters, pass in the form attributes, modify the form submission event according to the code package CRUD interface document in the form configuration, add the CRUD interface method of the code package, and then submit the form information to the backend service for processing and store it in the database when the form is submitted;

[0035] The dynamic form module builds HTTP request and response interceptors based on axios to handle authentication, token refresh and error handling. It rewrites the HTTP request method fetch of the dynamic engine and changes it to send HTTP requests through the axios interceptor. When the dynamic form engine makes a remote request, the axios interceptor automatically intercepts the HTTP request, obtains the current user's permission token in the method rewritten by the interceptor and adds it to the request parameters, and performs user permission verification in the backend service.

[0036] Traverse the fields of the form structure, obtain the component generation rules through JSON.parse, z-form displays the corresponding title and components according to the generation rules, creates a default value in the form data according to the data field and binds it to the form component in both directions, adds the validation rules of the data field to the validation rules of the form, sets the behavior of the component according to the linkage data, and controls the display and hiding of the component through conditional rendering and events.

[0037] Further improvements are as follows: in the above S4, the dynamic process module is composed of a back-end process engine and a front-end process designer. The process model is constructed through the dynamic process module. First, the process diagram is designed using the visual operation page of the front-end process designer, so that the task node of the process selects the dynamic form through the dynamic form component, and the approver is dynamically specified through the approver strategy component, and the process model is saved and output as an XML format file that complies with the Bpmn2.0 specification; the dynamic process module encapsulates the DeploymentBuilder of the Flowable process engine and expands the process publishing function. When the above process model is published, the deployment process of the DeploymentBuilder is used to obtain the process deployment ID and version number, and finally the above information is integrated into the process definition and saved in the database.

[0038] Further improvements are as follows: the backend process engine is developed based on the process engine technology framework Flowable. The backend process engine integrates the native functions of the Flowable framework, connects to the dynamic form module, and extends the approver's custom policy component. The dynamic form component connects to the API of the dynamic form module, so that the process engine obtains dynamic form information and configures the dynamic form in the active node of the process. The subsequent process tasks read the form configuration and display the form page. In addition, when the process is running, the data field information associated with the dynamic form is mapped to the local process variables of the task node. Subsequent process operations make flow condition judgments based on the process variables. The approver's custom policy component is used to extend the Flowable approver's specified strategy, add strategies to set approvers, and write expressions to set approvers.

[0039] A further improvement is that: S5 comprises the following steps:

[0040] The workflow is initiated through the unified start interface of the dynamic process module. The client selects the process definition and passes the key parameters of the process definition ID to call the unified start interface of the process. The dynamic process module finds the corresponding process deployment ID according to the process definition ID. ProcessInstanceBuilder finds the corresponding published process in the process engine according to the process deployment ID to create a process instance ProcessInstance and return the process instance ProcessInstanceID to the client.

[0041] Relevant approvers enter the workflow task management, query the workflow details according to the process instance ProcessInstanceID, enter the workflow details page to view or enter the form information of the current process task. The process details page displays the dynamic form through the dynamic form engine embedded in the dynamic form module. Its form information is dynamically rendered after reading the dynamic form configuration according to the dynamic form component;

[0042] When the approver submits the form, the information collected through the form is submitted to the CRUD interface of the associated code package and then saved in the corresponding data table. At the same time, the form variables are mapped to the process variables, and the process enters the next node. When the node is a conditional judgment node, the process branch is dynamically selected by configuring the expression. The workflow collects information in the above way and submits it to the next node, and then different branches are popular or fixed popular branches are selected according to the conditions until the process is completed.

[0043] The beneficial effects of the present invention are:

[0044] 1. The present invention combines dynamic forms and process engines to achieve highly flexible business process design. Users can dynamically design forms and process models as needed to meet different business needs. Custom components can be designed based on business data structures and common functions, so that forms can better adapt to specific business scenarios and improve user experience and work efficiency.

[0045] 2. The present invention uses dynamic forms and process engines, so developers can design and configure forms, process models and tasks more quickly, shorten the development cycle, and quickly build complete business processes by configuring tasks and binding forms, reducing development and deployment time and increasing the speed of system launch.

[0046] 3. By rendering the form according to the form structure and data, the present invention allows users to intuitively fill in and view relevant information during the process execution, thereby enhancing user participation and interactivity. Users can interact with dynamic forms and process engines in real time, quickly respond to business changes, and improve user satisfaction and work efficiency.

[0047] 4. The present invention combines dynamic forms and process engines to optimize business processes and data management, realize automation and standardization of business processes, and can achieve visual management of processes through process model design and task configuration, thereby improving the transparency and efficiency of business processes.

[0048] 5. The present invention is based on a code generation module. Automated code generation not only reduces the workload of manual writing, but also ensures the consistency and reliability of the generated code, thereby improving the overall development efficiency and quality of the project. BRIEF DESCRIPTION OF THE DRAWINGS

[0049] Figure 1 is a flow chart of the present invention;

[0050] Figure 2 It is a flow chart of the form designer of the present invention. DETAILED DESCRIPTION

[0051] In order to deepen the understanding of the present invention, the present invention will be further described in detail below in conjunction with examples. The examples are only used to explain the present invention and do not constitute a limitation on the protection scope of the present invention.

[0052] Embodiment 1

[0053] according to Figure 1 , 2 As shown, this embodiment proposes a business process construction method combining a workflow engine and a dynamic form, including the following steps:

[0054] Create a data table based on the business, select and import the data table in the code generation module, generate a basic code package, re-run the main program to compile the code package and load it into the JVM operating environment;

[0055] Use the visual form designer of the dynamic form module to create a dynamic form based on the entity class information of the code package and output the dynamic form configuration in JSON format;

[0056] Render the form through the dynamic form engine of the dynamic form module, generate the form page corresponding to the code package, receive the data submitted by the form page through the CRUD interface of the code package and store it in the database;

[0057] The dynamic process module builds business processes based on dynamic forms, establishes workflows according to business processes, configures dynamic forms for workflow nodes, sets up mappings between form fields and process variables, and publishes workflows;

[0058] Start the workflow, display the dynamic form during the process approval, collect the form data and cache it in the process variables, make conditional judgments based on the process variables, determine the node flow direction, and complete the workflow.

[0059] The present invention combines the technologies of dynamic forms and process engines to bring about many beneficial effects such as flexibility, efficiency, user participation and business process optimization, which helps to improve the functionality of the system and user experience.

[0060] Embodiment 2

[0061] according to Figure 1 , 2 As shown, this embodiment proposes a business process construction method combining a workflow engine and a dynamic form, including the following steps:

[0062] Automatically generate most repetitive codes (addition, deletion, query and modification functions): Create a data table according to the business, select and import the data table in the code generation module, generate a basic code package, re-run the main program to compile the code package and load it into the JVM running environment;

[0063] First, you need to clarify the business requirements and understand the data structure and relationships required by the system. Based on these requirements, design the corresponding data tables, including the table fields, data types, and the relationships between tables (such as primary and foreign key relationships);

[0064] Import the above data table through the code generation module, identify the data table structure, and generate corresponding code templates (such as entity class, DAO layer, Service layer, etc.) according to it. The code generation module mainly includes a code generation builder and a code generation engine;

[0065] Based on the MyBatis-Plus Generator code generator, a code generation builder CodegenBuilder was developed. It is mainly responsible for importing and analyzing data tables. Specifically, it uses the DataSourceConfig.Builder class of MyBatis-Plus Generator to load database configuration, establish a database connection, query all tables in the database, and then serialize them into JavaBean (TableInfo). CodegenBuilder then parses TableInfo to split the data table information and data field information into structured objects of CodegenTable and CodegenColumn, and stores them in the database.

[0066] The code generation engine CodegenEngine was developed based on the Velocity template engine technology. CodegenEngine extracts key information (table information, data field information) based on the above-mentioned imported data tables CodegenTable and CodegenColumn and maps them to a hash list (key-value pairs), and then fills the cached variables in the hash list into the preset code templates (such as Controller.vm, Do.vm, Mapper.vm, service.vm, etc.) to generate the corresponding entity class, DAO layer, Service layer and Controller layer code class files, and finally packages all the code class files into a compressed package in Zip format, the so-called code package.

[0067] Developers unzip the generated code package and import the code files into the main program code project, make fine adjustments and tests as needed, and then recompile the main program, compile all code files into bytecodes and load them into the JVM environment for running. After the main system runs normally, the code generation module can query the data tables, data field information and API interface documents involved in the code package, and can debug the API;

[0068] In the process of software development, code duplication is a common problem. Almost every module needs to implement CRUD (create, delete, modify and query) functions. The implementation of these functions is often highly similar, which causes developers to have to repeatedly write a large amount of similar code, reducing development efficiency. In addition, manually writing duplicate code may also introduce errors and increase the complexity of later maintenance. Through the code generation module, automated code generation not only reduces the workload of manual writing, but also ensures the consistency and reliability of the generated code, thereby improving the overall development efficiency and quality of the project.

[0069] Use the visual form designer of the dynamic form module to create a dynamic form based on the entity class information of the code package and output the dynamic form configuration in JSON format;

[0070] Form Designer (z-form-designer) is a visual form designer developed based on the open source front-end form designer form-create-designer. The underlying framework is vue3 and element-plus UI framework. Form-create-designer includes some front-end components required to build dynamic form pages, including basic components such as input boxes and drop-down boxes, but it is not enough to meet some business scenarios, so z-form-designer customizes a variety of custom components, such as user selectors, department selectors, dictionary selectors, etc. The implementation methods are as follows:

[0071] First, customize the custom components: build the page content based on vue.js and element-plus framework, combine the ElSelect selector component and HTTP request library to build events that call the backend Restful API interface, such as querying interfaces for users, departments, and dictionary data, and finally use vue syntax to encapsulate them into custom components (save as .vue files), such as user selectors, department selectors, and dictionary selectors;

[0072] Then register to app global mount through vue interface app.component (app is the vue application instance in the front-end JavaScript running environment), so that the entire front-end application including the form designer supports the above custom components;

[0073] Finally, mount the custom component in the form designer: first, add a custom component group through the form designer interface designer.addMenu, then set the component's 'generation rule' for each custom component (according to the specification of form-create-designer), and finally add the above custom component to the group by calling the interface designer.addComponent (component name). In this way, the form designer completes the loading of the custom component, that is, the above custom component is displayed and operated in the visual interface of the form designer;

[0074] The form designer (z-form-designer) also extends support for the above-mentioned code generation module, and the technical solution for implementation is as follows: Prerequisite 1, the data structure of the component generation rules, designer configuration, etc. in form-create-designer is defined through TypeScript description. TypeScript is an open source programming language developed by Microsoft. It is a superset of JavaScript and mainly adds static types and other functions. By modifying the static type of the above-mentioned TypeScript, the functions of the designer can be customized and extended to meet the needs of docking with the above-mentioned code generation module; Prerequisite 2, the form designer inherits the designer configuration props.config (TypeScript data structure) of form-create-designer, and then extends the core properties therein to implement custom functions, specifically overwriting the default designer rendering rules (formRule) and component base rendering rules (baseRule). The following specific extension steps all involve the above-mentioned properties;

[0075] First, the form designer adds a 'code package data drop-down list', which can query and display the data of the above code package, including data tables, data fields and other information; adds a 'code package CRUD interface document display table', the table display content includes interface description, input and output data structure, etc. The specific implementation details are as follows:

[0076] Build a TypeScript data structure to define the external interface of the code generation module, such as querying the code package list and querying the code package details. The TypeScript is defined as multiple methods according to the API addresses, request methods and parameters of each interface of the code generation module. The method uses Axios (Http request library) to call each remote interface and return the result asynchronously.

[0077] The form designer imports the TypeScript that defines the interface above. When the form designer page is loaded (mounted), the TypeScript method is called to remotely obtain the data table list of the code package, cache the list and format it as drop-down options;

[0078] The key at this time is to obtain the TypeScript configuration of the form designer at runtime and dynamically modify its properties, that is, by adding a custom rendering rule to the formRule property of the designer rendering rule. This rule is to dynamically render the 'code package data drop-down list' component, and the data displayed in the list is the above drop-down options options;

[0079] After the form designer page is loaded, the 'Code Package Data Drop-down List' is rendered and displayed. At this time, select a data in the 'Code Package Data Display List', and the 'Code Package CRUD Interface Document Display Table' component will be dynamically rendered;

[0080] The implementation principle of the above steps is that in the upadte(val, rule, fapi, arg) callback function of the 'Code Package Data Drop-down List' component, after selecting a code package to bind, obtain the CRUD interface document content corresponding to the code package and format it into a table, and then similarly add a custom rendering rule to the formRule attribute of the form designer rendering rule to dynamically render the 'Code Package CRUD Interface Document Display Table' with the data in the above table;

[0081] In addition, when a data item in the 'Code Package Data Display List' is selected, the data field of the corresponding data table will be obtained and formatted as the drop-down option bindFieldOptions in the component's upadte(val, rule, fapi, arg) callback function, and then updated to the global variable of the form designer through designerForm.setData(), so that the corresponding data field option bindFieldOptions can be obtained in the subsequent dynamic rendering of the component;

[0082] Then, by adding the rendering rule of 'Data Field Drop-down List' to the component base rendering rule (baseRule) of the form designer, when a component is dragged out in the form designer, the 'Data Field Drop-down List' component will be dynamically rendered at the component base configuration. Then, through the effect.loadData parameter in the baseRule attribute, the above global variable bindFieldOptions is dynamically loaded and inserted into the options of the component as its drop-down option;

[0083] The form designer creates a form and outputs the form configuration

[0084] The above form designer (z-form-designer) is mainly divided into three areas: left, middle and right. The left is the 'component library area' for draggable components and templates, the middle is the 'form design area' for displaying components and adjusting layouts, and the right is the 'configuration area' for the entire form or components;

[0085] The component library area displays various basic components and custom components. Users drag the selected component on the left to the design area to render the component. The form designer appends the component generation rules to the form rendering engine to dynamically generate the component.

[0086] The configuration area on the right, when a component in the form design area is not selected, is used to display and modify the form global configuration. After selecting a component in the form design area, it is displayed as component configuration. The form designer adds the corresponding form global configuration 'code package data drop-down list' and 'code package CRUD interface document display table' and the corresponding component configuration 'data field drop-down list' function in the 'configuration area' on the right;

[0087] Through the above functions, you can obtain the data table, data table fields, CRUD interface documents and other data of the code package. Users can view the data table information and interface documents. According to the fields used in business needs, select the appropriate form component or layout component from the component library on the left, drag and drop it to the middle form design area, then select the component, and select the bound data field in the 'Data field drop-down list' in the configuration area on the right.

[0088] Then select a data field in the 'Data Field Drop-Down List', and in its upadte(val, rule, fapi, arg) callback function, update the name of the selected data field to the title of the above selected component through the fapi.setValue interface, and verify whether the component conforms to the data type of the data field; repeat this operation until the form is created;

[0089] Finally, saving the form will convert the form configuration and form structure into JSON strings respectively. The form configuration will record basic form configuration information such as bound data table, CRUD interface address, form name, component alignment, form size, submit reset button attributes, etc. The form structure will save the structure of each form component, and record the component type type, component attributes, title, layout position, etc. of the form component. Multiple form structures form an array and then convert it into a JSON string for storage.

[0090] Render the form through the dynamic form engine of the dynamic form module, generate the form page corresponding to the code package, receive the data submitted by the form page through the CRUD interface of the code package and store it in the database;

[0091] The above steps build the dynamic form configuration and structure (JSON format) of the code package. Based on this dynamic form, the front-end page of the code package can be built, including the query list page, detail page, etc. The implementation principle is to embed the 'dynamic form engine (z-form)'. The form engine loads the above dynamic form configuration and form structure, parses the structure and dynamically renders the generated form layout and components, etc. The following steps further explain;

[0092] FormCreate is a low-code form generation component that can generate dynamic rendering, data collection, validation and submission functions through JSON. The dynamic form engine (z-form) is developed based on FormCreate, which extends the permission authentication mechanism when remotely calling other module APIs;

[0093] The dynamic form engine remotely calls the backend service API to obtain the saved dynamic form configuration and structure according to the form number, and converts the string into the form configuration conf and form structure fields through JSON.parse;

[0094] Parse the form configuration conf: merge the global configuration attribute parameters into the default attributes of the component, including the form component size, font size, label position and other styles. Set whether the form button is displayed according to the button parameters, and pass in the form attributes. According to the code package CRUD interface document in the form configuration, modify the form submission event and add the CRUD interface method of the code package. Then, when the form is submitted, the form information will be submitted to the backend service for processing and stored in the database;

[0095] In addition, the dynamic form module builds an Http request and response interceptor based on axios to handle authentication, token refresh, and error handling. Then rewrite the dynamic engine's Http request method fetch and modify it to send Http requests through the axios interceptor. Therefore, when the dynamic form engine makes a remote request, the axios interceptor automatically intercepts the Http request, obtains the current user's permission token in the method rewritten by the interceptor, and adds it to the request parameters for user permission verification in the backend service;

[0096] Parse the form structure fields: traverse the form structure fields and obtain the component generation rules through JSON.parse. z-form displays the corresponding title and components according to the generation rules, creates a default value in the form data according to the data field and binds it to the form component in both directions, and then adds the validation rules of the data field to the validation rules of the form. Set the behavior of the component according to the linkage data, control the display and hiding of the component through conditional rendering and events, and recursively parse if the generation rules also contain sub-generation rules;

[0097] The dynamic process module builds business processes based on dynamic forms, establishes workflows according to business processes, configures dynamic forms for workflow nodes, sets up mappings between form fields and process variables, and publishes workflows;

[0098] The dynamic process module consists of a backend process engine and a frontend process designer. It can quickly and easily define business processes by combining actual business scenarios with dynamic forms. The following is a technical solution for the dynamic process module:

[0099] The backend process engine is developed based on the process engine technology framework Flowable. In addition to integrating the native functions of the Flowable framework, namely core capabilities such as process definition, process instance and task management, the backend process engine also connects to the dynamic form module and expands the custom strategies of the approvers.

[0100] Bpmn process designer is a Bpmn process designer developed using the front-end JavaScript technology framework Vue2 and Bpmn.js (a BPMN 2.0 rendering toolkit and web modeler developed by the Camunda team). It is deeply integrated with the Flowable process engine. The front-end process designer (z-process-designer) is an extension based on Bpmn processdesigner, and the corresponding front-end display components are developed for the secondary development of the back-end process engine (dynamic forms, custom policies for approvers, and decision-making task listeners);

[0101] Dynamic form component: This component is connected to the dynamic form module API, so that the process engine can obtain dynamic form information (including entity classes, API interfaces, and form page configurations, etc.), and configure dynamic forms in the activity nodes of the process (by extending the properties of the process activity (UserTask) in the Bpmn process description file, adding properties such as FormId and submitUrl, and configuring the form ID and form submission API address in the front-end designer, etc.), and subsequent process tasks can read the form configuration and display the form page; in addition, when the process is running, the data field information associated with the dynamic form will be mapped to the local process variables of the task node, and the subsequent process operation can also make flow condition judgments based on the process variables;

[0102] Approver custom strategy component: This component extends the designated strategy of Flowable approvers, adds user, role, department and other strategies to set approvers, and writes expressions to set approvers. By extending the properties of the process activity (UserTask) in the Bpmn process description file, adding Strategy and Param properties to configure strategies and parameters in the front-end designer, and then implementing custom process activities by inheriting DefaultActivityBehaviorFactory, rewriting the createUserTaskActivityBehavior method, querying the Strategy and Param properties in this method, and then finding the corresponding strategy to execute the designated approver method;

[0103] Build a process model through the dynamic process module. First, use the visual operation page of the front-end process designer to design a process diagram. The focus of secondary development is to select the dynamic form through the dynamic form component at the task node of the process, and dynamically specify the approver through the approver strategy component. Save the process model and output it as an XML format file that complies with the Bpmn2.0 specification.

[0104] The dynamic process module encapsulates the DeploymentBuilder of the Flowable process engine and expands the process publishing function. When publishing the above process model, the deployment process of the DeploymentBuilder is used to obtain the process deployment ID, version number, etc. Finally, the above information is integrated into the process definition and saved in the database.

[0105] Start the workflow, display the dynamic form during the process approval process, collect the form data and cache it in the process variables, make conditional judgments based on the process variables, determine the node flow direction, and complete the workflow;

[0106] After completing the above process release, you can initiate the workflow through the unified startup interface of the dynamic process module. The dynamic process module encapsulates the ProcessInstanceBuilder of the Flowable process engine, and uses its ability to start the process to build a unified startup interface (Restful API). The client selects the process definition, and passes through key parameters such as the process definition ID to call the unified startup interface of the process. The dynamic process module finds the corresponding process deployment ID based on the process definition ID. The ProcessInstanceBuilder finds the corresponding published process in the process engine based on the process deployment ID to create a process instance ProcessInstance, and returns the process instance ProcessInstanceID to the client;

[0107] The relevant reviewers will then enter the workflow task management, query the workflow details according to the process instance ProcessInstanceID, and enter the workflow details page to view or enter the form information of the current process task. The process details page uses the dynamic form engine (z-form) embedded in the dynamic form module to display the dynamic form. The form information is dynamically rendered after the dynamic form component reads the dynamic form configuration;

[0108] When the approver submits the form, the information collected through the form will be submitted to the CRUD interface of the associated code package and then saved in the corresponding data table. At the same time, the form variables are mapped to the process variables, and the process enters the next node. When the node is a conditional judgment node, the process branch can be dynamically selected by configuring the expression. For example, if the user age is configured in the previous node, the subsequent process for adults can be selected in the conditional node based on the user age being over 18 years old, otherwise other branches will be taken. The workflow collects information in the above way and submits it to the next node, and then different branches are popular or fixed popular branches are selected according to the conditions until the process is completed.

[0109] The business process construction method combining the workflow engine and the dynamic form is combined with the dynamic form and the process engine, and a highly flexible business process design can be realized. The user can dynamically design the form and the process model according to the needs to meet different business needs, and the custom component can be designed according to the business data structure and the common functions, so that the form can better adapt to the specific business scenario, improve the user experience and work efficiency. And the present invention uses the dynamic form and the process engine, and the developer can design and configure the form, the process model and the task more quickly, shorten the development cycle, and can quickly build a complete business process by configuring the task and binding the form, reducing the development and deployment time, and improving the system online speed. At the same time, the present invention renders the form according to the form structure and data, and the user can intuitively fill in and view the relevant information during the process execution, enhance the user's sense of participation and interactivity, and the user can interact with the dynamic form and the process engine in real time, quickly respond to business changes, and improve user satisfaction and work efficiency; in addition, the present invention combines the dynamic form and the process engine, can optimize the business process and data management, realize the automation and standardization of the business process, can realize the visual management of the process through the process model design and task configuration, and improve the transparency and efficiency of the business process. Finally, the present invention is based on a code generation module, and automated code generation not only reduces the workload of manual writing, but also ensures the consistency and reliability of the generated code, thereby improving the overall development efficiency and quality of the project.

[0110] The above shows and describes the basic principles, main features and advantages of the present invention. It should be understood by those skilled in the art that the present invention is not limited to the above embodiments. The above embodiments and descriptions are only for explaining the principles of the present invention. Without departing from the spirit and scope of the present invention, the present invention may have various changes and improvements, which fall within the scope of the present invention. The scope of protection of the present invention is defined by the attached claims and their equivalents.

Claims

1. A business process construction method combining a workflow engine and a dynamic form, characterized in that: The following steps are involved: S1: Create a data table according to the business, select and import the data table in the code generation module, generate a basic code package, re-run the main program to compile the code package and load it into the JVM running environment; S2: Use the visual form designer of the dynamic form module to create a dynamic form based on the entity class information of the code package and output the dynamic form configuration in JSON format; S3: Render the form through the dynamic form engine of the dynamic form module, generate the form page corresponding to the code package, receive the data submitted by the form page through the CRUD interface of the code package and store it in the database; S4: The dynamic process module builds business processes based on dynamic forms, establishes workflows according to business processes, configures dynamic forms for workflow nodes, sets up mappings between form fields and process variables, and publishes workflows; S5: Start the workflow, display the dynamic form during the process approval process, collect the form data and cache it in the process variables, make conditional judgments based on the process variables, determine the node flow direction, and complete the workflow.

2. A method for constructing a business process combining a workflow engine and a dynamic form according to claim 1, characterized in that: The S1 comprises the following steps: Clarify business requirements, understand the data structure and relationships required by the system, and design corresponding data tables based on these requirements, including table fields, data types, and relationships between tables; Import the above data table through the code generation module, identify the data table structure, and generate a corresponding code template according to it. The code generation module includes a code generation builder and a code generation engine; Unzip the code package generated above and introduce the code files into the main program code project, recompile the main program, compile all code files into bytecodes and load them into the JVM environment for running.

3. A method for constructing a business process combining a workflow engine and a dynamic form according to claim 2, characterized in that: The code generation builder and code generation engine are as follows: based on the MyBatis-Plus Generator code generator, the code generation builder CodegenBuilder is developed, and the database configuration is loaded using the DataSourceConfig.Builder class of the MyBatis-Plus Generator, a database connection is established, and all tables of the database are queried and serialized into JavaBeans. The CodegenBuilder then parses TableInfo to split the data table information and data field information into structured objects of CodegenTable and CodegenColumn, and stores them in the database; The code generation engine CodegenEngine is developed based on Velocity template engine technology. CodegenEngine extracts key information based on the above imported data tables CodegenTable and CodegenColumn and maps it to a hash list, then fills the cached variables in the hash list into the preset code template to generate the corresponding entity class, DAO layer, Service layer and Controller layer code class files, and finally packages all code class files into a compressed package, namely the code package, in Zip format.

4. A method for constructing a business process combining a workflow engine and a dynamic form according to claim 1, characterized in that: In S2, the form designer is a visual form designer secondary developed based on the open source front-end form designer form-create-designer, with the underlying vue3 and element-plus UI frameworks, including the front-end components required to build dynamic form pages and customize multiple custom components. At the same time, the form designer extends the support for code generation modules and is also used to create forms and output form configurations. Customizing multiple custom components includes the following steps: Build page content based on vue.js and element-plus framework, combine ElSelect selector component and HTTP request library to build events that call backend Restful API interface, and use vue syntax to encapsulate it into custom components; Register the vue interface app.component to the app global mount, so that the entire front-end application including the form designer supports the above custom components; Add a custom component group through the form designer interface designer.addMenu, set the component's 'generation rules' for each custom component, call the interface to add the above custom component to the group, complete the loading of the custom component, and display and operate the above custom component in the visual interface of the form designer.

5. A method for constructing a business process combining a workflow engine and a dynamic form according to claim 4, characterized in that: The form designer extends its support for code generation modules, including the following steps: The form designer adds a 'code package data drop-down list' to query and display the data of the above code package, including data tables and data fields; adds a 'code package CRUD interface document display table', the table display content includes interface description, input and output data structure; When a data item in the 'Code Package Data Display List' is selected, in the component's upadte(val, rule, fapi, arg) callback function, the data field of the corresponding data table is obtained and formatted as the drop-down option bindFieldOptions, and then updated to the global variable of the form designer through designerForm.setData(). The corresponding data field option is subsequently obtained in the component's dynamic rendering; By adding the rendering rule of 'Data Field Drop-Down List' to the component base rendering rule of the form designer, when a component is dragged out in the form designer, the 'Data Field Drop-Down List' component will be dynamically rendered at the component base configuration, and then the global variable bindFieldOptions will be dynamically loaded through the effect.loadData parameter in the baseRule attribute and inserted into the options of the component as its drop-down option.

6. A method for constructing a business process combining a workflow engine and a dynamic form according to claim 5, characterized in that: The form designer creates a form and outputs the form configuration, including the following steps: The form designer is divided into three areas: left, middle, and right. The left side is the 'component library area' for draggable components and templates, the middle is the 'form design area' for displaying components and adjusting layouts, and the right side is the 'configuration area' for the entire form or components. The component library area displays various basic components and custom components. Drag the selected component on the left to the design area to render the component. The form designer appends the generation rules of the component to the form rendering engine to dynamically generate the component. In the configuration area on the right, when a component in the form design area is not selected, the form global configuration is displayed and modified. After a component in the form design area is selected, the component configuration is displayed. The configuration area has the corresponding form global configuration 'code package data drop-down list', 'code package CRUD interface document display table' and the corresponding component configuration 'data field drop-down list' functions; Use the above functions to obtain the data table, data table fields, and CRUD interface documents of the code package. According to the fields required by the business, select the appropriate form component or layout component from the component library on the left, drag and drop it to the middle form design area, select the component, and select the bound data field in the 'Data field drop-down list' in the configuration area on the right; When a data field is selected in the 'data field drop-down list', in its upadte(val, rule, fapi, arg) callback function, the name of the selected data field is updated to the title of the above selected component through the fapi.setValue interface, and at the same time, it is verified whether the component conforms to the data type of the data field. This operation is repeated until the form is created; Finally, save the form, which is divided into form configuration and form structure, which are converted into JSON strings respectively. The form configuration records the binding basic form configuration information; the form structure saves the structure of each form component. Multiple form structures form an array and then convert it into a JSON string for storage.

7. A method for constructing a business process combining a workflow engine and a dynamic form according to claim 1, characterized in that: The S3 comprises the following steps: Based on the dynamic form configuration and structure of the code package, the front-end page of the code package is built, including the query list page and the detail page. The dynamic form engine obtains the dynamic form configuration and structure according to the form number by remotely calling the back-end service API, and converts the string into the form configuration conf and form structure fields through JSON.parse; Parse the form configuration conf, merge the global configuration attribute parameters into the default attributes of the component, including the form component size, font size, label position, set whether the form button is displayed according to the button parameters, pass in the form attributes, modify the form submission event according to the code package CRUD interface document in the form configuration, add the CRUD interface method of the code package, and then submit the form information to the backend service for processing and store it in the database when the form is submitted; The dynamic form module builds HTTP request and response interceptors based on axios to handle authentication, token refresh and error handling. It rewrites the HTTP request method fetch of the dynamic engine and changes it to send HTTP requests through the axios interceptor. When the dynamic form engine makes a remote request, the axios interceptor automatically intercepts the HTTP request, obtains the current user's permission token in the method rewritten by the interceptor and adds it to the request parameters, and performs user permission verification in the backend service. Traverse the fields of the form structure, obtain the component generation rules through JSON.parse, z-form displays the corresponding title and components according to the generation rules, creates a default value in the form data according to the data field and binds it to the form component in both directions, adds the validation rules of the data field to the validation rules of the form, sets the behavior of the component according to the linkage data, and controls the display and hiding of the component through conditional rendering and events.

8. The method for constructing a business process combining a workflow engine and a dynamic form according to claim 1, characterized in that: In the S4, the dynamic process module is composed of a back-end process engine and a front-end process designer. The process model is constructed through the dynamic process module. First, the process diagram is designed using the visual operation page of the front-end process designer, so that the task node of the process selects the dynamic form through the dynamic form component, and the approver is dynamically specified through the approver strategy component. The process model is saved and output as an XML format file that complies with the Bpmn2.0 specification; the dynamic process module encapsulates the DeploymentBuilder of the Flowable process engine and expands the process publishing function. When the above process model is published, the deployment process of the DeploymentBuilder is used to obtain the process deployment ID and version number, and finally the above information is integrated into the process definition and saved in the database.

9. A method for constructing a business process combining a workflow engine and a dynamic form according to claim 8, characterized in that: The backend process engine is developed based on the process engine technology framework Flowable. The backend process engine integrates the native functions of the Flowable framework, connects to the dynamic form module, and extends the approver's custom strategy component. The dynamic form component connects to the API of the dynamic form module, allowing the process engine to obtain dynamic form information and configure the dynamic form in the active node of the process. The subsequent process tasks read the form configuration and display the form page. In addition, when the process is running, the data field information associated with the dynamic form is mapped to the local process variables of the task node. Subsequent process operations make flow condition judgments based on the process variables; the approver's custom strategy component is used to extend the Flowable approver's specified strategy, add strategies to set approvers, and write expressions to set approvers.

10. The method for constructing a business process combining a workflow engine and a dynamic form according to claim 1, characterized in that: The S5 comprises the following steps: The workflow is initiated through the unified start interface of the dynamic process module. The client selects the process definition and passes the key parameters of the process definition ID to call the unified start interface of the process. The dynamic process module finds the corresponding process deployment ID according to the process definition ID. ProcessInstanceBuilder finds the corresponding published process in the process engine according to the process deployment ID to create a process instance ProcessInstance and return the process instance ProcessInstanceID to the client. Relevant approvers enter the workflow task management, query the workflow details according to the process instance ProcessInstanceID, enter the workflow details page to view or enter the form information of the current process task. The process details page displays the dynamic form through the dynamic form engine embedded in the dynamic form module. Its form information is dynamically rendered after reading the dynamic form configuration according to the dynamic form component; When the approver submits the form, the information collected through the form is submitted to the CRUD interface of the associated code package and then saved in the corresponding data table. At the same time, the form variables are mapped to the process variables, and the process enters the next node. When the node is a conditional judgment node, the process branch is dynamically selected by configuring the expression. The workflow collects information in the above way and submits it to the next node, and then different branches are popular or fixed popular branches are selected according to the conditions until the process is completed.

Images