Implementation method for dynamic extension of low-code business function plug-in

Abstract

The invention relates to an implementation method for dynamic extension of a low-code business function plug-in, which belongs to the technical field of intelligent information processing and comprises the following steps of: 1, compiling a front-end business component source code on line, setting corresponding parameters and storing low-code extension component data to a database; 2, in the front-end process definition, obtaining a business component data list, and displaying the business component data list to a dragging area; 3, dragging the low-code business function plug-in component to the canvas, and performing corresponding business process arrangement; and 4, when the process runs, analyzing the service component data, and executing the service code. The lightweight front-end assembly framework is operated in a data-driven loading mode, the project maintenance cost is saved, the maintainability and expansibility of a project are greatly improved, a traditional development mode is changed, and the effect of getting twofold results with half the effort is achieved.

Description

Technical Field

[0001] The present invention relates to an implementation method for dynamic expansion of low-code business function plug-ins, belonging to the technical field of intelligent information processing. Background Art

[0002] Due to the widespread application of low-code / no-code platforms, the market demand for online code expansion is becoming stronger. The expansion and change of business needs have led to chaotic and difficult to maintain front-end source code. It is difficult for developers to delete the code regularly, and project development requires a huge investment in maintaining historical code. Code standardization cannot be unified, large business scenario methods cannot be abstracted into interface methods, and cannot meet the logical requirements of complex business scenarios. Summary of the invention

[0003] In order to solve the above problems, the present invention discloses a method for implementing dynamic expansion of low-code business function plug-ins, and its specific technical solution is as follows: A method for implementing dynamic expansion of a low-code business function plug-in includes the following steps: Step 1: Based on the front-end native javascript and vue framework, write the front-end business component source code online on the low-code platform, set the corresponding parameters, form the low-code extension component data, and save it to the local Oracle database; Step 2: In the front-end process definition, obtain the business component data list and display it in the drag-and-drop area; Step 3: Drag the low-code business function plug-in component to the canvas and perform corresponding business process orchestration; Step 4: When the process is running, parse the business component data and execute the front-end business component source code described in step 1.

[0004] Furthermore, the specific process of writing the front-end business component source code online and setting the corresponding parameters in step 1 is as follows: Step 1a: Write the source code of the front-end business component online: Open the low-code platform, and the entry path is: Settings-Microflow Component Management-Add / Modify; Step 1b: The source code is: setTimeout(()=>{ callObject['S']() },timer) Among them, timer is a variable, a custom input parameter; Step 1c: Set the corresponding parameters: Enter the component name and component description of the low-code business function plug-in. The parameters are required and are used to display the drag area. The component name is unique; Step 1d: By default, there is no output parameter. If you select output parameter, you need to enter the output parameter name and description; Step 1e: Do not enter any input parameters, or enter one or more than two input parameters. When entering more than two input parameters, enter the input parameter name and input parameter description, and the input parameter names will be displayed in a list; Step 1f: Export represents the number of exports of the current business component. The default is 1 export, or you can add 2 or more exports according to the business scenario. Step 1g: Enter the code in the code field to process the business logic. Low-code built-in method objects are provided to facilitate developers to implement specific business logic.

[0005] Furthermore, in the step 2, in the front-end process definition, the specific process of obtaining the business component data list and displaying it in the drag area is as follows: Step 2a: Obtain the business plug-in component list information through the back-end interface call and place it in the custom component area; Step 2b: The component properties on the right show the input and output parameters of the dragged component.

[0006] Furthermore, the specific process of dragging the low-code business function plug-in component to the canvas in step 3 and performing the corresponding business process orchestration is as follows: Step 3a: Click the business component and drag it to the specified location on the canvas; Step 3b: Connect components in series based on actual business logic.

[0007] Furthermore, when the process in step 4 is running, the specific process of parsing the business component data and executing the business code is as follows: Step 4a: Configure the component properties of the business function plug-in, including description, input parameters, and output parameters; Step 4b: Configure the corresponding page flow on the low-code page, preview and click the button to execute the flow, trigger the parsing function of the business function plug-in, and execute the corresponding online code.

[0008] The beneficial effects of the present invention are: The present invention realizes online code editing capability and is ready for use out of the box. Key codes are provided by the platform, which reduces code redundancy and realizes lightweight front-end engineering.

[0009] The present invention changes the traditional code editing method, realizes the stripping of common functions of complex business logic, and abstracts them into business components, which greatly improves the reusability. It saves the manpower cost of project implementation and completes the construction of complex business logic with very little manpower cost. The business logic is atomized, which improves the readability of the business logic. BRIEF DESCRIPTION OF THE DRAWINGS

[0010] Figure 1is a flow chart of the present invention, Figure 2 is the name and description configuration interface of the business component of the embodiment of the present invention, Figure 3 This is the business component parameter configuration interface of the embodiment of the present invention. Figure 4 This is the business component input parameter configuration interface of the embodiment of the present invention. Figure 5 This is the business component export configuration interface of the embodiment of the present invention. Figure 6 It is the online code writing configuration interface of the business component of the embodiment of the present invention. Figure 7 It is the business function plug-in display interface of the embodiment of the present invention. Figure 8 This is a business function plug-in attribute configuration page of an embodiment of the present invention. Fig. 9 This is the business component arrangement display interface of the embodiment of the present invention. Fig.10 This is the business component execution effect interface of the embodiment of the present invention. DETAILED DESCRIPTION

[0011] The present invention is further explained below in conjunction with the accompanying drawings and specific embodiments. It should be understood that the following specific embodiments are only used to illustrate the present invention and are not used to limit the scope of the present invention.

[0012] Combined with Figure 1-10 It can be seen that the implementation method of the present invention for dynamic expansion of low-code business function plug-ins includes the following steps: Step 1: Write the front-end business component source code online, set the corresponding parameters, and save the low-code extension component data to the local Oracle database; The editing software is: Low-code platform. The entry path for writing the source code of the front-end business component is: Settings-Microflow Component Management-Add / Modify. For details, see the attached Figure 2 .

[0013] The source code is original and the code is as follows: setTimeout(()=>{ callObject['S']() },timer) Here, timer is a variable and a custom input parameter.

[0014] Step (1.1): Enter the component name and component description of the low-code business function plug-in. The parameters are required and are used for the display of the drag area. The component name is unique.

[0015] The component name is unique and required, and the component description is required. Figure 2 .

[0016] Step (1.2): By default, there is no output parameter. If you choose to output a parameter, you need to enter the output parameter name and description.

[0017] See also Figure 3 If you select "Yes" for output parameter, the output parameter name and output parameter description are required.

[0018] Step (1.3): You can enter no input parameters or multiple parameters can be entered. If multiple parameters are entered, they will be displayed in a list. The input parameter name and input parameter description are required. Figure 4 .

[0019] Step (1.4): The export represents the number of exports of the current business component. The default is one S (success) export, and you can add multiple exports based on the business scenario.

[0020] Click Single Exit to add an exit named S. Click Double Exit to add two exits named S and F. The default exit cannot be modified but can be deleted. Click Add to add additional exits. For example, add Exit O to represent other business meanings. Figure 5 .

[0021] Step (1.5): Enter the code in the code field (i.e. write the code) to process the business logic. It provides low-code built-in methods (existing built-in methods, or secondary development) objects to facilitate developers to implement specific business logic. Figure 6 .

[0022] Code arrangement is generally implemented through JavaScript and Vue, and the specific code writing should be developed according to business logic.

[0023] For example, if you need a prompt message, this.that.$message.success('success') The meaning of the codes are as follows: this.that: the this object in the vue file.

[0024] Step 2: In the front-end process definition, obtain the business component data list and display it in the drag area: Step (2.1): Get the business plug-in component list information through the back-end interface call and place it in the custom component area. Figure 7 .

[0025] Step (2.2): The component properties on the right show the input and output parameters of the dragged component, see Figure 8 .

[0026] Step 3: Drag the low-code business function plug-in component to the canvas and perform corresponding business process orchestration. For details, see Fig. 9 .

[0027] Step (3.1): Click the business component and drag it to the specified location on the canvas; Step (3.2): Connect components in series according to the actual business logic.

[0028] Step 4: When the process is running, parse the business component data and execute the business code: Multiple business processes are connected in series, and the corresponding business process codes can be executed in sequence. Fig.10 .

[0029] Step (4.1): Configure the component properties of the business function plug-in, including description, input parameters, and output parameters; Step (4.2): Configure the corresponding page flow on the low-code page, preview and click the button to execute the flow, trigger the parsing function of the business function plug-in, and execute the corresponding online code.

[0030] It will be understood by those skilled in the art that, unless otherwise defined, all terms (including technical and scientific terms) used herein have the same meaning as generally understood by those skilled in the art to which this application belongs. It should also be understood that terms such as those defined in common dictionaries should be understood to have meanings consistent with the meanings in the context of the prior art, and will not be interpreted with idealized or overly formal meanings unless defined as herein.

[0031] Based on the above ideal embodiments of the present invention, the relevant staff can make various changes and modifications without departing from the technical concept of the present invention through the above description. The technical scope of the present invention is not limited to the contents of the specification, and its technical scope must be determined according to the scope of the claims.

Claims

1. A method for implementing dynamic expansion of low-code business function plug-ins, characterized in that: The following steps are involved: Step 1: Based on the front-end native javascript and vue framework, write the front-end business component source code online on the low-code platform, set the corresponding parameters, form the low-code extension component data, and save it to the local Oracle database; Step 2: In the front-end process definition, obtain the business component data list and display it in the drag-and-drop area; Step 3: Drag the low-code business function plug-in component to the canvas and perform corresponding business process orchestration; Step 4: When the process is running, parse the business component data and execute the front-end business component source code described in step 1.

2. The method for implementing dynamic expansion of low-code business function plug-ins according to claim 1 is characterized in that: The specific process of writing the front-end business component source code online and setting the corresponding parameters in step 1 is as follows: Step 1a: Write the source code of the front-end business component online: Open the low-code platform, and the entry path is: Settings-Microflow Component Management-Add / Modify; Step 1b: The source code is: setTimeout(()=>{ callObject['S']() },timer) Among them, timer is a variable, a custom input parameter; Step 1c: Set the corresponding parameters: Enter the component name and component description of the low-code business function plug-in. The parameters are required and are used to display the drag area. The component name is unique. Step 1d: By default, there is no output parameter. If you select output parameter, you need to enter the output parameter name and description; Step 1e: Do not enter any input parameters, or enter one or more than two input parameters. When entering more than two input parameters, enter the input parameter name and input parameter description, and the input parameter names will be displayed in a list; Step 1f: Export represents the number of exports of the current business component. The default is 1 export, or you can add 2 or more exports according to the business scenario. Step 1g: Enter the code in the code field to process the business logic. Low-code built-in method objects are provided to facilitate developers to implement specific business logic.

3. The method for implementing dynamic expansion of low-code business function plug-ins according to claim 1 is characterized in that: In the step 2, in the front-end process definition, the specific process of obtaining the business component data list and displaying it in the drag area is as follows: Step 2a: Obtain the business plug-in component list information through the back-end interface call and place it in the custom component area; Step 2b: The component properties on the right show the input and output parameters of the dragged component.

4. The implementation method for dynamic expansion of low-code business function plug-ins according to claim 1 is characterized in that: The specific process of dragging the low-code business function plug-in component to the canvas and arranging the corresponding business process in step 3 is as follows: Step 3a: Click the business component and drag it to the specified location on the canvas; Step 3b: Connect components in series based on actual business logic.

5. The method for implementing dynamic expansion of low-code business function plug-ins according to claim 1 is characterized in that: When the process in step 4 is running, the specific process of parsing the business component data and executing the business code is as follows: Step 4a: Configure the component properties of the business function plug-in, including description, input parameters, and output parameters; Step 4b: Configure the corresponding page flow on the low-code page, preview and click the button to execute the flow, trigger the parsing function of the business function plug-in, and execute the corresponding online code.

Images