Data management interface establishment method and construction system

By dividing the data management interface into multiple functional areas and defining collaboration specifications with the server, the problem of low efficiency in data management interface development in the prior art is solved, efficient interface development and back-end data interaction are achieved, and maintenance and development costs are reduced.

CN119987769APending Publication Date: 2025-05-13JIANGNAN SHIPYARD (GRP) CO LTD
View PDF 0 Cites 0 Cited by

Patent Information

Application Number
CN202510068627.9
Authority / Receiving Office
CN · China
Patent Type
Applications(China)
Current Assignee / Owner
Filing Date
2025-01-16
Publication Date
2025-05-13

AI Technical Summary

Technical Problem

In the prior art, the development efficiency of the data management interface is low, the components are granular, the browser compatibility is poor, and the lack of back-end data interaction support leads to poor scalability and high development costs.

Method used

By dividing the data management interface to be established into multiple functional areas, defining collaboration specifications with the server, creating configuration files for the functional areas, rendering them according to the configuration files, defining user interaction rules and response rules, to achieve rapid development and efficient interaction of the data management interface.

Benefits of technology

It realizes the separation of views and logic, reduces maintenance costs, improves development efficiency and scalability, and reduces communication costs between the front and back ends.

✦ Generated by Eureka AI based on patent content.

Smart Images

  • Figure CN119987769A_ABST
    Figure CN119987769A_ABST
Patent Text Reader

Abstract

The invention belongs to the technical field of information processing, and provides a data management interface establishment method and system to establish a data management interface, and the data management interface establishment method comprises the following steps: dividing a to-be-established data management interface into a plurality of functional regions; the cooperation specification between the data management interface and the server is defined, so that the communication cost between the front end and the rear end can be reduced, and the development efficiency is improved; according to the method, the configuration file of the functional area is created, so that the interactive operation between the front-end data management interface and the rear-end server is transferred into the configuration file, the separation between the view and the logic is realized, the maintenance cost is reduced, and the subsequent maintenance and function extension are facilitated; rendering the functional area according to the configuration file; defining a user interaction rule to enable a user to interact with the data management interface; and establishing a response rule of the data management interface and the server to the user operation, so that the data management interface and the server respond to the user operation.
Need to check novelty before this filing date? Find Prior Art

Description

Technical Field

[0001] The present application relates to the field of information processing technology, and in particular to a method and system for establishing a data management interface. Background Art

[0002] Data is the core of an application, and data management design is an indispensable part of any application system development. In software development, the data management interface is the interface for data interaction between users and application software. The development of data management functions accounts for about 30% of the entire application system development workload. At present, the separation of front-end and back-end is the mainstream development collaboration model. For the development of data management interface, the common front-end development solutions include the following two: the first is to use Javascript+html development, which has low development efficiency and poor browser compatibility. The second is to use the front-end framework + UI library development method.

[0003] Although the second development method has relatively high development efficiency and relatively good browser compatibility, since the UI library can only provide general components and the component granularity is relatively fine, the development of data management pages usually requires staff to conduct secondary development and combination, and the reusability is poor, and the development efficiency needs to be further improved. For some simple and general scenarios, there are currently integrated solutions, such as the heavy component Pro-Table provided by Pro-Components, but this solution is overly dependent on the corresponding UI library, resulting in difficulties in migration. At the same time, this type of component only considers interface design, lacks back-end data interaction support, and has poor scalability. Some general operations such as adding, uploading, exporting and other events still need to be handled by developers themselves, which not only increases development costs, but also prolongs the development cycle. Summary of the invention

[0004] In view of the above-mentioned shortcomings of the prior art, the purpose of the present application is to provide a data management interface establishment method and construction system to solve the problems of low development efficiency of the data management interface in the prior art.

[0005] To achieve the above objectives and other related objectives, the present application provides a method for establishing a data management interface, comprising the following steps:

[0006] Divide the data management interface to be established into multiple functional areas;

[0007] Defining the collaboration specification between the data management interface to be established and the server;

[0008] Creating a configuration file for the functional area;

[0009] Rendering the functional area according to the configuration file to obtain the data management interface;

[0010] Defining user interaction rules to enable a user to interact with the data management interface;

[0011] Establish response rules of the data management interface and the server to user operations so that the data management interface and the server respond to the user operations.

[0012] Optionally, the functional area includes:

[0013] A search area, used to request data from the server according to the search conditions entered by the user, the search area including a search form and a query button corresponding to the query operation;

[0014] A global operation area, in which operation trigger buttons are arranged, and the operation trigger buttons at least include an add button corresponding to a data adding operation, an upload button corresponding to an upload operation, an export button corresponding to a data export operation, an update button corresponding to a data updating operation, a delete button corresponding to a data deleting operation, and a custom button corresponding to a custom operation;

[0015] A data display area, used to display the data responded by the server, wherein a single data operation bar is provided in the data display area, and a single edit button and a single delete button are provided in the single data operation bar;

[0016] The paging control area is used to control the paging logic of the pages in the data management interface.

[0017] Optionally, the step of defining the collaboration specification between the data management interface to be established and the server comprises the following steps:

[0018] Define field naming specifications, request method specifications, and interface response specifications respectively;

[0019] Define a data operation request body; wherein, the data operation request body includes a data request operation request body, a data export operation request body, a data addition operation request body, a data update operation request body, a data deletion operation request body, and an upload operation request body.

[0020] Optionally, the configuration file includes a search area configuration file, a global operation area configuration file, a data display area configuration file and a paging control area configuration file; wherein the search area configuration file includes a search form configuration file and query rule information corresponding to the query button in the functional area.

[0021] Optionally, creating the configuration file of the functional area comprises the following steps:

[0022] Create a single form element profile, a single action button profile, and a single field display rule respectively;

[0023] According to the design requirements of the data management interface, repeat the above steps to obtain multiple form element configuration files, multiple operation button configuration files and multiple field display rules respectively;

[0024] Integrate the plurality of form element configuration files, the plurality of operation button configuration files, and the display rules of the plurality of fields respectively, so as to obtain the search form configuration file, the global operation area configuration file, and the data display area configuration file respectively;

[0025] Define the interface calling method, pre-request data processing function and post-response data processing function required for the query operation corresponding to the query button to obtain the query rule information;

[0026] A paging combination variable, a current page number variable, a per-page display variable, and a total display data variable are created respectively to establish the paging control area configuration file.

[0027] Optionally, the data display area configuration file includes a single data operation bar configuration file, and the configuration file for creating the functional area further includes:

[0028] Create a single data operation bar configuration file;

[0029] The data display area configuration file is used as a main configuration file, and the search area configuration file, the global operation area configuration file and the paging control area configuration file are merged into the data display area configuration file.

[0030] Optionally, the data management interface establishment method further includes the following steps:

[0031] Set data adding operation, data deleting operation, uploading operation, querying operation, data exporting operation and data updating operation as built-in default operations;

[0032] Define built-in operation response rules corresponding to the built-in default operation; wherein the built-in operation response rules include data addition response rules, data deletion response rules, upload response rules, query response rules, data export response rules and data update response rules.

[0033] Optionally, the user interaction rule includes:

[0034] Monitor user operations and trigger actions corresponding to the user operations;

[0035] Determine whether the data management interface has a custom operation corresponding to the user operation, and if the result is "yes", execute the custom operation; if the result is "no", execute the built-in default operation;

[0036] When both the custom operation and the built-in default operation cannot be executed, the data management interface reports an error.

[0037] Optionally, the response rule includes a user operation response rule, and the user operation response rule includes:

[0038] Determine whether the current response request corresponding to the user operation has a pre-request data processing function, and if the result is "yes", execute the pre-request data processing function, and use the return value of the pre-request data processing function as the request body of the response request;

[0039] Initiating the response request, and using the return value of the response request as the response value;

[0040] Determine whether the response request has a post-response data processing function, and if the result is "yes", execute the post-response data processing function, and use the return value of the post-response data processing function as the response value to update the response value;

[0041] When the response request is a query operation, the response value is transmitted to the data display area to display data.

[0042] The present application also provides a data management interface construction system, which uses any one of the data management interface construction methods in the aforementioned implementations to establish a data management interface, including:

[0043] An interface configuration module, used to configure and form a data management module to be established, wherein the data management module includes multiple functional areas;

[0044] A collaboration specification management module is used to define the collaboration specifications between the data management module to be established and the server;

[0045] A configuration file management module, used to create and manage configuration files of the functional areas;

[0046] A page rendering module, used to create the configuration file from the configuration file management module, and render the functional area according to the configuration file to obtain the data management interface;

[0047] An event processing module, used to define user interaction rules so that users can interact with the data management interface;

[0048] The response request module is used to establish the response rules of the data management interface and the server to the user operation, so that the data management interface and the server respond to the user operation.

[0049] As described above, the data management interface establishment method and construction system provided by the present application have at least the following beneficial effects:

[0050] By setting up the configuration file, the interactive operations between the front-end data management interface and the back-end server are transferred to the configuration file, which realizes the separation between view and logic and reduces the maintenance cost. In addition, the configuration file is easy to expand and flexible to use, which is more convenient for subsequent maintenance and function expansion. By defining the user interaction rules and the collaboration specifications and response rules between the front-end and the back-end, the development difficulty is reduced, the communication cost between the front-end and the back-end is reduced, and the development efficiency is improved. By setting up the pre-request data processing function and the post-response data processing function respectively for secondary processing of request data and response data, the compatibility and scalability of the data management interface response request method are effectively improved. BRIEF DESCRIPTION OF THE DRAWINGS

[0051] In order to more clearly illustrate the technical solutions of the embodiments of the present application, the drawings required for use in the embodiments will be briefly introduced below. It should be understood that the following drawings only show certain embodiments of the present application and therefore should not be regarded as limiting the scope. For ordinary technicians in this field, other related drawings can be obtained based on these drawings without paying creative work.

[0052] Figure 1 Shown is a flowchart of a method for establishing a data management interface provided in Example 1 of the present application.

[0053] Figure 2 Shown is a structural diagram of dividing the data management interface into multiple functional areas provided in Example 1 of the present application.

[0054] Figure 3 Display as Figure 2 The structural diagram of the data adding pop-up window after clicking Add in the data management interface shown.

[0055] Figure 4 Shown is a structural schematic diagram of the data management interface provided by the optional embodiment in the first embodiment of the present application.

[0056] Figure 5 Shown is a structural schematic diagram of a data addition pop-up window provided in an optional embodiment of the first embodiment of the present application. DETAILED DESCRIPTION

[0057] In order to make the technical purpose, technical solution and technical effect of the present application clearer, the technical solution in the present application will be clearly and completely described in conjunction with the embodiments below. Obviously, the described embodiments are part of the embodiments of the present application, rather than all the embodiments. The components of the embodiments of the present application described and shown in the drawings here can be arranged and designed in various different configurations.

[0058] Therefore, the following detailed description of the embodiments of the present application is not intended to limit the scope of the present application for protection, but merely represents the selected embodiments of the present application. Based on the embodiments in the present application, all other embodiments obtained by those of ordinary skill in the art without creative work are within the scope of protection of the present application. In addition, the terms "first" and "second" are only used for descriptive purposes and cannot be understood as indicating or implying relative importance.

[0059] In the description of the present application, it should be noted that the description with reference to the terms "one embodiment", "some embodiments", "illustrative embodiments", "example", "specific example" or "some examples" means that the specific features, structures, materials or characteristics described in conjunction with the implementation or example are included in at least one implementation or example of the present application. In this specification, the schematic representation of the above terms does not necessarily refer to the same implementation or example. Moreover, the specific features, structures, materials or characteristics described may be combined in any one or more implementations or examples in a suitable manner.

[0060] Embodiment 1

[0061] This embodiment provides a method for establishing a data management interface, which is used to solve the problems of fine component granularity and low page development efficiency of the data management interface in the prior art.

[0062] Reference Figure 1 The data management interface establishment method provided in this embodiment includes steps S1 to S6, specifically including:

[0063] Step S1: Divide the data management interface to be established into multiple functional areas;

[0064] Step S2: defining the collaboration specification between the data management interface to be established and the server;

[0065] Step S3: creating a configuration file for the functional area;

[0066] Step S4: Rendering the functional area according to the configuration file to obtain the data management interface;

[0067] Step S5: defining user interaction rules to enable the user to interact with the data management interface;

[0068] Step S6: Establishing response rules of the data management interface and the server to user operations, so that the data management interface and the server respond to the user operations.

[0069] The data management interface establishment method of this embodiment will be described in detail below with reference to the accompanying drawings. It should be noted that the above sequence does not strictly represent the step sequence of the data management interface establishment method protected by this application, and those skilled in the art may change it according to actual needs.

[0070] First, step S1 is executed to divide the data management interface to be established into multiple functional areas.

[0071] Reference Figure 2 The functional area includes a data display area for displaying the data responded by the server. The data display area includes a data table and a data operation area in the table; optionally, a single data operation bar is provided in the data display area, and a single edit button and a single delete button are provided in the single data operation bar; further, a plurality of single data operation bars are provided in the data operation area in the table of the data display area, and a single edit button and a single delete button are provided in the single data operation bar to respectively edit or delete the corresponding single data in the data table, for example Figure 2 and Figure 4 “Edit” and “Delete” as shown; further, a custom button can be set in the data operation area in the table for users to expand functions.

[0072] In an alternative embodiment, reference Figure 2 The functional area can also include a search area, a global operation area, and a paging control area. The search area is used to request data from the server according to the search conditions entered by the user. The search area includes a search form and query buttons corresponding to the query operation, such as Figure 2 The global operation area is provided with operation trigger buttons, which include at least an add button, an upload button, and an export button, respectively. Figure 2 The "Add" button, "Upload" button and "Export" button in the data management interface, and the operation trigger buttons also include update button, delete button and custom button. Among them, the add button is a button for triggering the data addition operation in the data management interface, the upload button is a button for triggering the upload operation, the export button is a button for triggering the data export operation, the update button is a button for triggering the data update operation, the delete button is a button for triggering the data deletion operation, and the custom button is a button for triggering the custom operation. The paging control area is used to control the paging logic of the pages in the data management interface, such as switching between the previous page and the next page, and is also used to jump to a specific page, or set the number of pages and how much data to display on each page, etc. Figure 2It shows "Total 20 items", "10 items / page", "<", ">", "Go to 1 page", etc.

[0073] Then, step S2 is executed to define the collaboration specification between the data management interface to be established and the server.

[0074] Collaboration specifications can be understood as interaction specifications between the data management interface and the server. By stipulating the collaboration specifications between the data management interface and the server, the communication cost between the front end and the back end can be reduced and the collaboration efficiency between the front end and the back end can be improved. The interaction between the data management interface and the server includes query operations. Optionally, the interaction between the data management interface and the server may also include data adding operations, uploading operations, data exporting operations, data updating operations, data deleting operations, and user-defined operations or other suitable operations.

[0075] In an optional embodiment, executing step S2 includes the following steps: respectively defining field naming specifications, request method specifications, and interface response specifications; defining a data operation request body; wherein the data operation request body includes a data request operation request body, a data export operation request body, a data addition operation request body, a data update operation request body, a data deletion operation request body, an upload operation request body, and other suitable request bodies.

[0076] Furthermore, a field naming convention is defined, for example, xxx is used for fields for data exchange between the data management interface and the server; xxx_value is used for fields displayed in the data management interface, where xxx is the name of any data field.

[0077] Furthermore, a request method specification is defined, for example, POST request can be unified as a request method specification.

[0078] Furthermore, define the interface response specification. For example, you can use Code as the status response code, 200 indicates a successful request, and other codes indicate a failed or error request. Use Data to pass the response data. The query request response returns a data collection, the export request returns a file address, and other requests return null.

[0079] Furthermore, define the data operation request body. For example, Limit can be used to indicate the number of data items displayed per page, -1 indicates no paging, Page indicates the current page number, and Searchinfo is used to pass the query parameters entered in the user query operation. Specifically, the code format of the data request operation request body is, for example, {Limit:-1, Page:1, earchinfo:{}}. The code format of the data export operation request body can refer to the data request operation request body. The data addition operation request body can use the field naming specifications in the collaboration specification to pass the data entered by the user data addition operation. The code format of the data addition operation request body can be {orgid:"", username:"", usercode:"", state:""}. The data deletion operation request body can be a collection of data identification fields to be deleted, and its code format can be, for example, [id1, id2, …… id i,…… ], where id i is the data identification field of the i-th data to be deleted. The upload operation request body can use Url to transfer the file address and use Extra to transfer additional information. Its code format is, for example, {Url: "", / / Extra: {}}.

[0080] Next, step S3 is executed to create a configuration file for the functional area.

[0081] In this embodiment, the functional area includes a data display area, and the corresponding configuration file includes a data display area configuration file. Optionally, the functional area also includes a search area, a global operation area, and a paging control area, and the configuration file also includes a search area configuration file, a global operation area configuration file, and a paging control area configuration file. Further, the search area configuration file includes a search form configuration file and query rule information corresponding to the query button in the functional area.

[0082] In an optional embodiment, executing step S3 includes the following steps: creating a single form element configuration file, a single operation button configuration file, and a display rule for a single field respectively; repeating the above steps according to the design requirements of the data management interface to obtain multiple form element configuration files, multiple operation button configuration files, and display rules for multiple fields respectively; integrating multiple form element configuration files, multiple operation button configuration files, and display rules for multiple fields respectively to obtain a search form configuration file, a global operation area configuration file, and a data display area configuration file respectively; defining an interface calling method required for a query operation corresponding to a query button, a pre-request data processing function, and a post-response data processing function to obtain query rule information; creating a paging combination variable, a current page number variable, a per-page display variable, and a total display data variable respectively to form a paging control area configuration file; wherein the form element configuration file includes at least a form item identifier, a form item label, and a form type.

[0083] In an optional embodiment, the search area configuration file includes a search form configuration file and query rule information corresponding to the query button of the function area. The search form is a collection of multiple form elements. The search form configuration file can be created according to the following steps: Create a single form element configuration file, wherein the single form element configuration file includes at least a form item identifier (Key), a form item label (Label) and a form type (Type), for example Figure 2 The "label1", "label2", "label3", etc. shown in Figure 4The "Organization", "Name", "Work Number" and the corresponding "Organization 1", "Organization 2", "Zhang San", "Li Si", "1001", "1002", "Normal", etc. shown in the figure, the form type may include, for example, an input box (Input), a text field (Textarea), a radio button (Radio), a check box (Checkbox), a drop-down selection (Select), a time selection (Time Picker), a date selection (Date Picker), and a custom form item (Custom). Optionally, a single form element configuration file may also include, for example, a form validation rule set (Rules) and an option class form data source (Data); according to the design requirements of the data management interface, the above steps are repeated to obtain multiple form element configuration files; the multiple form element configuration files are integrated into an array to obtain a search form configuration file; the interface calling method, the pre-request data processing function and the post-response data processing function required for the query operation corresponding to the query button are defined to obtain the query rule information, wherein the return value of the pre-request data processing function may be used as a query request parameter, and the request is interrupted when false is returned, and the return value of the post-response data processing function is passed as a response value to the data display area for display. By setting a pre-request data processing function and a post-response data processing function for secondary processing of request data and response data, the compatibility and scalability of the data management interface can be effectively improved.

[0084] Further, refer to Figure 4 , the code format of the search form configuration file can be configured as [{Key:"orgid", Label:"Organization", Type:"Select", Data:[{orgid:"orgid1", orgid_value:"Organization1"}, {orgid:"orgid2", orgid_value:"Organization2"}], Rules:[{required:false}]}, {Key:"username", Label:"Name", Type:"Input", Rules:[{required:false}]}, {Key:"usercode", Label:"Employee Number", Type:"Input", Rules:[{required:false}]}, ]. The query rule information can be configured as {Api:https: / / demo / api / search,

[0085] / / Beforerequest:()=>{}, / / Afterrequest:(data)=>{return data},},where Api is the response request address, Beforeerequest is the data processing function before the request, and Afterrequest is the data processing function after the response.

[0086] In an optional embodiment, a global operation area configuration file can be created according to the following steps: create a single operation button configuration file, the operation button configuration file is in array format, each element of which represents an operation trigger button, optionally, the configuration file of each operation trigger button includes the corresponding button name (Lable), button icon (Icon), button color (Color), button event processing function (Event), data request interface (Api), pre-request data processing function (Beforerequst) and post-response data processing function (Afterrequest); according to the design requirements of the data management interface, repeat the above steps to obtain multiple operation button configuration files; integrate multiple operation button configuration files into an array to obtain a global operation area configuration file.

[0087] In an optional embodiment, a data display area configuration file may be created in accordance with the following steps: create display rules for a single field, optionally, the display rules for a single field are: use Label to represent column titles, such as Label: "Organization", Label: "Name", Label: "Status", Label: "Work Number", Label: "Operation", use Prop to represent the field name to be displayed, such as Prop: "orgid_value", use Width to represent the width of the table occupied by the field, use Style to represent the field display style, and use Html to represent the use of Html code snippets to render the field; repeat the above steps according to the design requirements of the data management interface to obtain display rules for multiple fields; integrate the display rules for multiple fields into an array to obtain a data display area configuration file.

[0088] In an optional embodiment, the data display area configuration file also includes a single data operation bar configuration file, and step S3 is executed, further comprising the following steps: creating a single data operation bar configuration file. The single data operation bar is provided with single data operation buttons, including a single edit button and a single delete button, for example, corresponding to Figure 4The "Edit" button and "Delete" button shown in the figure, the specific steps of creating a single data operation bar configuration file can refer to the steps of creating a global operation area configuration file. Optionally, creating a single data operation bar configuration file includes the following steps: creating a single single data operation button configuration file; repeating the above steps according to the design requirements of the data management interface to obtain multiple single data operation button configuration files; integrating multiple single data operation button configuration files into an array to obtain a single data operation bar configuration file.

[0089] In an alternative embodiment, reference Figure 2 and Figure 4 , the paging control area configuration file can be created according to the following steps: create a paging combination variable, a current page number variable, a per-page display variable, and a total display data variable respectively to form the paging control area configuration file. Optionally, the paging combination variable (Sizes) can be set to a universal paging combination to reduce the subsequent code development amount and improve development efficiency. For example, the universal paging combination variable can be set to [30, 50, 100, 500]; the current page number variable is used to display the page number of the current page, which will change with the user's operation. For example, when the user clicks on the previous page or the next page, the default value of the current page number variable (Page) can be set to 1; the per-page display variable is used to display how many data items are displayed per page, and the specific value of the per-page display variable is set according to the paging combination variable; the total display data variable (Total) is used to limit the number of pages of data, and the value of the total display variable can be determined according to the per-page display variable. The default value of the total display data variable is 0. Specifically, the code format of the paging control area configuration file can be, for example,

[0090] {Sizes:[10,50,100],Limit:10,Page:1,Total:0}.

[0091] In an optional embodiment, the data display area is the core part of the data management page, and executing step S3 further includes the following steps: using the data display area configuration file as the main configuration file, merging the search area configuration file, the global operation area configuration file, and the paging control area configuration file into the data display area configuration file. By merging the search area configuration file, the global operation area configuration file, the paging control area configuration file, and the data display area configuration file, the system integration and development efficiency can be improved, and only one configuration file is needed to quickly create a data management interface.

[0092] Next, step S4 is executed to render the functional area according to the configuration file to obtain a data management interface.

[0093] In this embodiment, native Html, CSS, Javascript and other languages ​​and their combinations can be used to execute step S4, or a third-party front-end framework can be used in conjunction with a UI library to execute step S4, wherein the UI library is used to implement the creation and rendering of interface elements in the data management interface, and the third front-end framework is used to execute the data operation method in the configuration file.

[0094] In an optional embodiment, the front-end cross-border Vue3 is used in conjunction with the UI library Elemeent Plus to implement page rendering of the data management interface. Specifically, the functional areas include a search area, a global operation area, a data display area, and a paging control area. For example, el-form and el-button components are used to render the search area, the v-for instruction and el-button components are used to render the global operation area, the v-for instruction and el-table, el-button components are used to render the data display area, and the el-pagination component is used to render the paging control area.

[0095] In an optional embodiment, the method for establishing a data management interface further includes the following steps: setting a data adding operation, a data deleting operation, an uploading operation, a querying operation, a data exporting operation, and a data updating operation as built-in default operations; defining built-in operation response rules corresponding to the built-in default operations, wherein the built-in operation response rules include a data adding response rule, a data deleting response rule, an uploading response rule, a querying response rule, a data exporting response rule, and a data updating response rule. By setting built-in default operations, when developing a data management interface, there is no need to perform repeated configuration, which can improve development efficiency.

[0096] Furthermore, the data adding response rule for responding to the data adding operation is: when the user clicks the add button, for example Figure 2 and Figure 4 The "Add" button shown displays the data adding form in a pop-up window based on its configuration file, for example Figure 3 and Figure 5 The data addition pop-up window shown, wherein a confirmation button is provided in the data addition pop-up window, optionally, a cancel button and "label1", "label2", "label3", etc. are also provided in the data addition pop-up window, such as "organization", "name", "employee number", "status", etc.; when the user clicks the confirmation button, the form verification is automatically triggered, and after the verification passes, the API request interface configured in the data addition configuration file is automatically called to pass the user's entered data to the server; after the server responds successfully, the data query operation is automatically triggered to refresh the data in the data display area.

[0097] Furthermore, the data deletion response rules for responding to data deletion operations are as follows: when the user clicks the delete button, a batch data deletion operation is triggered to obtain a list of data identifiers selected by the user; when the data identifier list is empty, an error message is given; when the data identifier list is not empty, based on its configuration file, the API request interface configured in the configuration file is automatically called to pass the list of data identifiers to be deleted to the server to achieve batch deletion of data.

[0098] Furthermore, the upload response rules for responding to data upload operations are as follows: when the user clicks the upload button, a file selector pops up; when the user selects the file to be uploaded and the upload is successful, the API request interface configured in the configuration file is called to pass the file address to the server; after the server responds successfully, a query operation is triggered to refresh the data display area list.

[0099] Furthermore, the data export response rules for responding to the data export operation are: when the user clicks the export button, the query conditions entered by the user are obtained; the Api request interface configured in the configuration file is called; when the request interface responds successfully, the exported file is saved locally.

[0100] Next, step S5 is executed to define user interaction rules so that the user can interact with the data management interface.

[0101] The user interaction rules are the rules for the data management interface to respond to user operations. When the user operates the data management interface, the data management interface responds to the user operation according to the user interaction rules.

[0102] In an optional embodiment, the user interaction rules include: monitoring user operations and responding to user operations; determining whether the data management interface has a custom operation corresponding to the user operation, and when the result is "yes", executing the custom operation; when the result is "no", executing the built-in default operation; when both the custom operation and the built-in default operation cannot be executed, the data management interface reports an error to alert the user.

[0103] Finally, step S6 is executed to establish response rules of the data management interface and the server to the user operation, so that the data management interface and the server respond to the user operation.

[0104] The response rule is the rule by which the data management interface and the server respond to the operation triggered by the user after the user triggers the button of the data management interface. Optionally, the response rule includes user operation response rules and built-in operation response rules, which can be set at the same time or separately.

[0105] In an optional embodiment, the response rules include user operation response rules, and the user operation response rules are: determine whether the current response request corresponding to the user operation has a pre-request data processing function, when the result is "yes", execute the pre-request data processing function, and use the return value of the pre-request data processing function as the request body of the response request, wherein when the combination is "no", skip this step and execute the next operation; initiate a response request, and use the return value of the response request as the response value; determine whether the response request has a post-response data processing function, when the result is "yes", execute the post-response data processing function, and use the return value of the post-response data processing function as the response value to update the above response value, wherein when the result is "no", skip this step and execute the next operation; when the response request is a query operation, pass the response value to the data display area to display the data.

[0106] As described above, in this embodiment, the establishment and rendering of the data management interface driven by data is used to effectively improve the development efficiency of the front-end data management interface; by setting the configuration file, the interactive operations between the front-end data management interface and the back-end server are transferred to the configuration file, which realizes the separation of view and logic and reduces the maintenance cost, and the configuration file is easy to expand and flexible to use, which facilitates subsequent maintenance and functional expansion; by defining user interaction rules and the collaboration specifications and response rules between the front and back ends, the difficulty of use for developers is reduced, the communication cost between the front and back ends is reduced, and the development efficiency is improved; by setting a pre-request data processing function before responding to the request and setting a post-response data processing function after responding to the request, so as to perform secondary processing of request data and response data, the compatibility and scalability of the data management interface can be effectively improved.

[0107] Embodiment 2

[0108] This embodiment provides a data management interface construction system, which uses any of the data management interface construction methods in Embodiment 1 to establish a data management interface. The data management interface construction system of this embodiment includes an interface configuration module, a collaboration specification management module, a configuration file management module, a page rendering module, an event processing module, and a response request module.

[0109] The interface configuration module is used to configure the data management module to be established. The data management module includes multiple functional areas. Optionally, the functional areas include a search area, a global operation area, a data display area and a paging control area, that is, the data management module includes at least the above functional areas.

[0110] The collaboration specification management module is used to define the collaboration specifications between the data management interface to be established and the server. Specifically, the collaboration specification management module can be used to define field naming specifications, request method specifications, and interface response specifications, and define data operation request bodies, wherein the data operation request bodies include data request operation request bodies, data export operation request bodies, data addition operation request bodies, data update operation request bodies, data deletion operation request bodies, upload operation request bodies, and other request bodies corresponding to user operations.

[0111] The configuration file management module is used to create and manage configuration files for functional areas. The functional areas of the data management interface include the data display area, search area, global operation area, and paging control area. The corresponding configuration files include the data display area configuration file, the search area configuration file, the global operation area configuration file, the paging control area configuration file, and other configuration files corresponding to the functional areas. The configuration file management module is used to create the data display area configuration file, the search area configuration file, the global operation area configuration file, and the paging control area configuration file respectively. Optionally, the configuration file management module can also modify, delete, or update the configuration files.

[0112] In an optional embodiment, the configuration file is one file, and the configuration file management module can be used to separately create a data display area configuration file, a search area configuration file, a global operation area configuration file, and a paging control area configuration file, and the data display area configuration file is used as the main configuration file, and the search area configuration file, the global operation area configuration file, and the paging control area configuration file are merged into the data display area configuration file to form a configuration file; or, a configuration file management module is used to directly create a configuration file, and the configuration file includes a data display area configuration file, a search area configuration file, a global operation area configuration file, and a paging control area configuration file.

[0113] The page rendering module is used to create a configuration file from the configuration file management module, and render the functional area according to the configuration file to obtain a data management interface.

[0114] In an optional embodiment, the data management interface construction system also includes a default operation management module, which is used to set built-in default operations and corresponding built-in operation response rules. Optionally, the default operation management module is used to set data addition operations, data deletion operations, upload operations, query operations, data export operations and data update operations as built-in default operations, and define built-in operation response rules corresponding to the above-mentioned built-in default operations.

[0115] The event processing module is used to define user interaction rules so that the user can interact with the data management interface. Optionally, the event processing module is also used to respond to user operations according to the user interaction rules to achieve interaction between the user and the data management interface. Specifically, the user interaction rules are set through the event processing module. When the user interacts with the data management interface, the event processing module triggers an operation corresponding to the user operation according to the set user interaction rules, such as a user-defined operation or a built-in default operation.

[0116] The response request module is used to establish the response rules of the data management interface and the server to the user operation, so that the data management interface and the server respond to the user operation. Optionally, the response request module is also used to respond to the response request triggered by the user operation according to the response rule, so that the data management interface and the server respond to the user operation. Specifically, the response rule is set by the response request module. When the event processing module triggers an operation corresponding to the user operation, the response request module processes the triggered operation according to the set response rule to initiate a response request so that the data management interface and the server respond to the user operation.

[0117] The data management interface construction system provided in this embodiment adopts any one of the data management interface construction methods in the first embodiment to establish a data management interface, and therefore also has the beneficial effects of the first embodiment.

[0118] The above embodiments are merely illustrative of the principles and effects of the present application and are not intended to limit the present application. Anyone familiar with the technology may modify, change or combine the above embodiments without violating the spirit and scope of the present application. Therefore, all equivalent modifications or changes made by a person of ordinary skill in the art without departing from the spirit and technical ideas disclosed in the present application shall still be covered by the claims of the present application.

Claims

1. A method for establishing a data management interface, characterized in that: The following steps are involved: Divide the data management interface to be established into multiple functional areas; Defining the collaboration specification between the data management interface to be established and the server; Creating a configuration file for the functional area; Rendering the functional area according to the configuration file to obtain the data management interface; Defining user interaction rules to enable a user to interact with the data management interface; Establish response rules of the data management interface and the server to user operations so that the data management interface and the server respond to the user operations.

2. The method for establishing a data management interface according to claim 1, characterized in that: The functional areas include: A search area, used to request data from the server according to the search conditions entered by the user, the search area including a search form and a query button corresponding to the query operation; A global operation area, in which operation trigger buttons are arranged, and the operation trigger buttons at least include an add button corresponding to a data adding operation, an upload button corresponding to an upload operation, an export button corresponding to a data export operation, an update button corresponding to a data updating operation, a delete button corresponding to a data deleting operation, and a custom button corresponding to a custom operation; A data display area, used to display the data responded by the server, wherein a single data operation bar is provided in the data display area, and a single edit button and a single delete button are provided in the single data operation bar; The paging control area is used to control the paging logic of the pages in the data management interface.

3. The method for establishing a data management interface according to claim 1, characterized in that: Defining the collaboration specification between the data management interface to be established and the server includes the following steps: Define field naming specifications, request method specifications, and interface response specifications respectively; Define a data operation request body; wherein, the data operation request body includes a data request operation request body, a data export operation request body, a data addition operation request body, a data update operation request body, a data deletion operation request body, and an upload operation request body.

4. The method for establishing a data management interface according to claim 1, characterized in that: The configuration files include a search area configuration file, a global operation area configuration file, a data display area configuration file and a paging control area configuration file; wherein the search area configuration file includes a search form configuration file and query rule information corresponding to the query button in the functional area.

5. The method for establishing a data management interface according to claim 4, characterized in that: Creating the configuration file for the functional area includes the following steps: Create a single form element profile, a single action button profile, and a single field display rule respectively; According to the design requirements of the data management interface, repeat the above steps to obtain multiple form element configuration files, multiple operation button configuration files and multiple field display rules respectively; Integrate the plurality of form element configuration files, the plurality of operation button configuration files, and the display rules of the plurality of fields respectively, so as to obtain the search form configuration file, the global operation area configuration file, and the data display area configuration file respectively; Define the interface calling method, pre-request data processing function and post-response data processing function required for the query operation corresponding to the query button to obtain the query rule information; A paging combination variable, a current page number variable, a per-page display variable, and a total display data variable are created respectively to establish the paging control area configuration file.

6. The method for establishing a data management interface according to claim 5, characterized in that: The data display area configuration file includes a single data operation bar configuration file, and the configuration file for creating the functional area also includes: Create a single data operation bar configuration file; The data display area configuration file is used as a main configuration file, and the search area configuration file, the global operation area configuration file and the paging control area configuration file are merged into the data display area configuration file.

7. The method for establishing a data management interface according to claim 1, characterized in that: The following steps are also included: Set data adding operation, data deleting operation, uploading operation, querying operation, data exporting operation and data updating operation as built-in default operations; Define built-in operation response rules corresponding to the built-in default operation; wherein the built-in operation response rules include data addition response rules, data deletion response rules, upload response rules, query response rules, data export response rules and data update response rules.

8. The method for establishing a data management interface according to claim 7, characterized in that: The user interaction rules include: Monitor user operations and trigger actions corresponding to the user operations; Determine whether the data management interface has a custom operation corresponding to the user operation, and if the result is "yes", execute the custom operation; if the result is "no", execute the built-in default operation; When both the custom operation and the built-in default operation cannot be executed, the data management interface reports an error.

9. The method for establishing a data management interface according to claim 1, characterized in that: The response rules include user operation response rules, and the user operation response rules include: Determine whether the current response request corresponding to the user operation has a pre-request data processing function, and if the result is "yes", execute the pre-request data processing function, and use the return value of the pre-request data processing function as the request body of the response request; Initiating the response request, and using the return value of the response request as the response value; Determine whether the response request has a post-response data processing function, and when the result is "yes", execute the post-response data processing function, and use the return value of the post-response data processing function as the response value to update the response value; When the response request is a query operation, the response value is transmitted to the data display area to display data.

10. A data management interface construction system, using the data management interface construction method according to any one of claims 1 to 9 to establish a data management interface, characterized in that: include: An interface configuration module, used to configure and form a data management interface to be established, wherein the data management interface includes multiple functional areas; A collaboration specification management module is used to define the collaboration specifications between the data management interface to be established and the server; A configuration file management module, used to create and manage configuration files of the functional areas; A page rendering module, used to create the configuration file from the configuration file management module, and render the functional area according to the configuration file to obtain the data management interface; An event processing module, used to define user interaction rules so that users can interact with the data management interface; The response request module is used to establish response rules of the data management interface and the server to user operations, so that the data management interface and the server respond to the user operations.