Interface configuration method and system, electronic device and storage medium
The interface configuration method, which obtains and populates custom content data on the server side, solves the problem of insufficient interface configuration flexibility and achieves flexible and efficient updates of interface configuration.
Patent Information
- Application Number
- CN202211247614.0
- Authority / Receiving Office
- CN · China
- Patent Type
- Patents(China)
- Current Assignee / Owner
- Filing Date
- 2022-10-12
- Publication Date
- 2026-02-03
- Estimated Expiration
- 2042-10-12
AI Technical Summary
In existing technologies, interface configuration is limited by fixed configuration data set by front-end engineers, resulting in insufficient flexibility in interface configuration.
The target configuration template is obtained from the server and populated with custom content data. The client then customizes the interface according to the target configuration data, enabling flexible rendering of interface information.
It improves the flexibility and efficiency of interface configuration, allowing users to adapt to changes in requirements by updating custom content data or selecting a target configuration template, thus avoiding a complete change to all configuration data.
Smart Images

Figure CN115543310B_ABST
Abstract
Description
Technical Field
[0001] This application relates to the field of artificial intelligence technology, and in particular to an interface configuration method and system, electronic device and storage medium. Background Technology
[0002] Currently, the interface is rendered based on fixed configuration data set by front-end engineers, which restricts the possibilities for user interface configuration and affects the flexibility of interface configuration. Summary of the Invention
[0003] The main objective of this application is to provide an interface configuration method and system, electronic device and storage medium, which aims to improve the flexibility of interface configuration.
[0004] To achieve the above objectives, a first aspect of this application proposes an interface configuration method, the method comprising:
[0005] In response to a trigger operation of a preset request control, the server obtains a target configuration template from a preset configuration template; wherein, the target configuration template includes template content data and custom content data;
[0006] The server responds to the population operation of the template content data to obtain interface information data;
[0007] The server responds to the population operation of the custom content data to obtain interface configuration data; wherein, the interface configuration data includes configuration fields and configuration content data of the configuration fields;
[0008] The server obtains the target configuration data based on the interface configuration data, the interface information data, and the template field of the template content data.
[0009] The server stores the target configuration data in a preset database.
[0010] The server sends the interface information data to the client.
[0011] The client retrieves the target configuration data from the preset database based on the interface information data;
[0012] The client configures the preset interface according to the target configuration data to obtain the target interface.
[0013] In some embodiments, the configuration field includes a first multi-select field, and the configuration content data includes first title data and at least two option identifiers;
[0014] The client configures the preset interface according to the target configuration data to obtain the target interface, including:
[0015] The client configures at least two first selection controls on the preset interface according to the first multi-select field;
[0016] The client matches each of the first selection controls with one of the option identifiers to obtain at least two option data.
[0017] The client configures a menu bar on the preset interface based on the first title data, and matches the menu bar with all the option data to obtain the target interface.
[0018] In some embodiments, each of the option data includes an original permission identifier, the configuration field further includes a select all field, the configuration content data further includes a target permission identifier, and the method further includes:
[0019] The client configures a select all control on the target interface according to the select all field, and associates the select all control with all the option data;
[0020] In response to a touch operation on the select all control, the client updates the original permission identifiers of all option data to the target permission identifiers.
[0021] In some embodiments, the configuration fields include a multi-select search field and a second multi-select field, and the configuration content data includes query fields and multi-select interface data;
[0022] The client configures the preset interface according to the target configuration data to obtain the target interface, including:
[0023] The client obtains business data based on the multi-select search field and the multi-select interface data; wherein, the business data includes business fields and business content data of the business fields;
[0024] The client takes the business field that matches the query field as the target field, takes the business content data that matches the target field as the target content data, and obtains the number of fields of the target field;
[0025] The client configures a second selection control on the preset interface according to the number of fields and the second multi-select field, and matches the second selection control with the target content data to obtain the target interface.
[0026] In some embodiments, the configuration field includes a tree search field, and the configuration content data includes tree interface data and the search field;
[0027] The client configures the preset interface according to the target configuration data to obtain the target interface, including:
[0028] The client obtains tag data based on the tree-shaped search field, the tree-shaped interface data, and the search field;
[0029] The client fills the tree structure data on the preset interface with the tag data to obtain the target interface.
[0030] In some embodiments, the method further includes:
[0031] The client responds to a touch operation on a preset export control, generates an update template based on the target configuration data, and sends the update template to the user terminal;
[0032] The client responds to a touch operation on a preset import control and obtains the target file returned by the user terminal according to the update template;
[0033] The client updates the target interface based on the target file.
[0034] In some embodiments, the interface information data includes push address data, and the method further includes:
[0035] The client responds to the interface update operation of the target interface and generates prompt data;
[0036] The client performs a push operation based on the prompt data and the push address data.
[0037] To achieve the above objectives, a second aspect of this application provides an interface configuration system, the system comprising:
[0038] On the server side, in response to a trigger operation of a preset request control, the server obtains a target configuration template from a preset configuration template; wherein, the target configuration template includes template content data and custom content data; the server obtains interface information data in response to a population operation of the template content data; the server obtains interface configuration data in response to a population operation of the custom content data; wherein, the interface configuration data includes configuration fields and configuration content data matching the configuration fields; the server obtains target configuration data based on the interface configuration data, the interface information data, and preset fields matching the template content data; the server stores the target configuration data in a preset database; the server sends the interface information data to the client;
[0039] The client retrieves the target configuration data from the database based on the interface information data; the client configures the preset interface according to the target configuration data to obtain the target interface.
[0040] To achieve the above objectives, a third aspect of this application provides an electronic device, which includes a memory and a processor. The memory stores a computer program, and the processor executes the computer program to implement the method described in the first aspect.
[0041] To achieve the above objectives, a fourth aspect of the present application provides a computer-readable storage medium storing a computer program that, when executed by a processor, implements the method described in the first aspect.
[0042] The interface configuration method, system, electronic device, and storage medium proposed in this application involve a server obtaining a target configuration template by responding to the triggering operation of a preset request control, and obtaining target configuration data by responding to the user's input of the target configuration template. The client retrieves the target configuration data from a preset database using interface information data, and can then configure a preset interface based on this target configuration data to obtain the target interface. The target configuration template includes template content data describing fixed content in the target interface, and custom content data describing user-customizable content in the target interface. Therefore, the interface configuration method provided in this application can customize the target interface using custom content data, enabling user-configurable interface configuration and improving its flexibility. Furthermore, when user needs change, the interface configuration method provided in this application only requires updating the custom content data or selecting the corresponding target configuration template, thus avoiding the need to modify all configuration data in related technologies where the interface configuration data is fixed, thereby improving the efficiency of interface configuration. Attached Figure Description
[0043] Figure 1 This is a flowchart of an embodiment of the interface configuration method of this application;
[0044] Figure 2 This is a schematic diagram of the target configuration template in an embodiment of this application;
[0045] Figure 3 This is a schematic diagram of the first preset field and the second preset field in an embodiment of this application;
[0046] Figure 4 This is another schematic diagram of the first preset field and the second preset field in the embodiments of this application;
[0047] Figure 5 This is a schematic diagram of the target interface in an embodiment of this application;
[0048] Figure 6This is a schematic diagram showing the target configuration template after being filled in according to an embodiment of this application;
[0049] Figure 7 This is another flowchart of the interface configuration method in an embodiment of this application;
[0050] Figure 8 This is another flowchart of the interface configuration method in an embodiment of this application;
[0051] Figure 9 This is another flowchart of the interface configuration method in an embodiment of this application;
[0052] Figure 10 This is another flowchart of the interface configuration method in an embodiment of this application;
[0053] Figure 11 This is a schematic diagram of a preset interface in an embodiment of this application;
[0054] Figure 12 This is another schematic diagram of the target interface in an embodiment of this application;
[0055] Figure 13 This is another flowchart of the interface configuration method in an embodiment of this application;
[0056] Figure 14 This is a schematic diagram of an updated template according to an embodiment of this application;
[0057] Figure 15 This is a schematic diagram of the object file of an embodiment of this application;
[0058] Figure 16 This is another schematic diagram of the target interface in an embodiment of this application;
[0059] Figure 17 This is another flowchart of the interface configuration method in an embodiment of this application;
[0060] Figure 18 This is a schematic diagram of the interface configuration system according to an embodiment of this application;
[0061] Figure 19 This is a schematic diagram of the hardware structure of the electronic device according to an embodiment of this application. Detailed Implementation
[0062] To make the objectives, technical solutions, and advantages of this application clearer, the following detailed description is provided in conjunction with the accompanying drawings and embodiments. It should be understood that the specific embodiments described herein are merely illustrative and not intended to limit the scope of this application.
[0063] It should be noted that although functional modules are divided in the system diagram and the logical order is shown in the flowchart, in some cases, the steps shown or described may be performed in a different order than the module division in the system or the order in the flowchart. The terms "first," "second," etc., in the specification, claims, and the aforementioned drawings are used to distinguish similar objects and are not necessarily used to describe a specific order or sequence.
[0064] Unless otherwise defined, all technical and scientific terms used herein have the same meaning as commonly understood by one of ordinary skill in the art to which this application belongs. The terminology used herein is for the purpose of describing embodiments of this application only and is not intended to limit this application.
[0065] First, let's analyze some of the terms used in this application:
[0066] Artificial intelligence (AI) is a new branch of computer science that studies, develops, and applies theories, methods, technologies, and systems to simulate, extend, and expand human intelligence. It aims to understand the essence of intelligence and produce intelligent machines that can react in a way similar to human intelligence. Research in this field includes robotics, speech recognition, image recognition, natural language processing, and expert systems. AI can simulate the information processes of human consciousness and thought. Furthermore, AI utilizes digital computers or machines controlled by digital computers to simulate, extend, and expand human intelligence, perceiving the environment, acquiring knowledge, and using that knowledge to achieve optimal results.
[0067] Microservices are a type of distributed architecture that advocates dividing a monolithic application into a set of small services that coordinate and cooperate with each other to provide end-user value. In a monolithic architecture, all services are integrated together. As business complexity increases, code coupling becomes increasingly high, hindering code upgrades and maintenance. Microservices break down a monolithic application into many independent projects based on business function modules, with each project completing a portion of the business functionality. For example, in an e-commerce system, there are order services, user functions, product services, and payment services. Implementing these modules using a monolithic architecture would increase coupling and development complexity. When developing with microservices, each service is treated as a monolithic application; that is, order services, user services, payment services, etc., are all microservices. The entire e-commerce system is composed of these microservices. Each microservice can be deployed in a cluster according to business needs, thereby reducing coupling between services and facilitating service maintenance and upgrades.
[0068] Currently, the interface is rendered based on fixed configuration data set by front-end engineers, which restricts the possibilities for user interface configuration and affects the flexibility of interface configuration.
[0069] Based on this, embodiments of this application provide an interface configuration method and system, an electronic device, and a storage medium, aiming to improve the flexibility of interface configuration.
[0070] The interface configuration method, system, electronic device, and storage medium provided in this application are specifically described through the following embodiments. First, the interface configuration method in this application is described.
[0071] The embodiments of this application can acquire and process relevant data based on artificial intelligence technology. Artificial intelligence (AI) refers to the theories, methods, technologies, and application systems that use digital computers or machines controlled by digital computers to simulate, extend, and expand human intelligence, perceive the environment, acquire knowledge, and use that knowledge to obtain optimal results.
[0072] Foundational technologies for artificial intelligence generally include sensors, dedicated AI chips, cloud computing, distributed storage, big data processing, operating / interactive systems, and mechatronics. AI software technologies mainly encompass computer vision, robotics, biometrics, speech processing, natural language processing, and machine learning / deep learning.
[0073] The interface configuration method provided in this application relates to the field of artificial intelligence technology. The interface configuration method provided in this application can be applied to a terminal, a server, or software running on either a terminal or a server. In some embodiments, the terminal can be a smartphone, tablet, laptop, desktop computer, etc.; the server can be configured as an independent physical server, a server cluster or distributed system composed of multiple physical servers, or a cloud server providing basic cloud computing services such as cloud services, cloud databases, cloud computing, cloud functions, cloud storage, network services, cloud communication, middleware services, domain name services, security services, CDN, and big data and artificial intelligence platforms; the software can be an application implementing the interface configuration method, but is not limited to the above forms.
[0074] This application can be used in a wide variety of general-purpose or special-purpose computer system environments or configurations. Examples include: personal computers, server computers, handheld or portable devices, tablet devices, multiprocessor systems, microprocessor-based systems, set-top boxes, programmable consumer electronics, network PCs, minicomputers, mainframe computers, and distributed computing environments including any of the above systems or devices. This application can be described in the general context of computer-executable instructions executed by a computer, such as program modules. Generally, program modules include routines, programs, objects, components, data structures, etc., that perform specific tasks or implement specific abstract data types. This application can also be practiced in distributed computing environments where tasks are performed by remote processing devices connected via a communication network. In distributed computing environments, program modules can reside in local and remote computer storage media, including storage devices.
[0075] It should be noted that in all specific embodiments of this application, when processing data related to user identity or characteristics, such as user information, user behavior data, user historical data, and user location information, user permission or consent is obtained first. Furthermore, the collection, use, and processing of this data comply with relevant laws, regulations, and standards of the relevant countries and regions. In addition, when embodiments of this application require access to sensitive personal information of users, separate permission or consent from the user is obtained through pop-ups or redirects to confirmation pages. Only after obtaining the user's separate permission or consent is the necessary user-related data for the proper functioning of the embodiments of this application obtained.
[0076] Figure 1 This is an optional flowchart of the interface configuration method provided in the embodiments of this application. Figure 1 The method may include, but is not limited to, steps S101 to S108.
[0077] Step S101: In response to the triggering operation of the preset request control, the server obtains the target configuration template from the preset configuration template; wherein, the target configuration template includes template content data and custom content data;
[0078] Step S102: The server responds to the population operation of the template content data and obtains the interface information data;
[0079] Step S103: The server responds to the population operation of the custom content data and obtains the interface configuration data; wherein, the interface configuration data includes configuration fields and configuration content data of the configuration fields;
[0080] Step S104: The server obtains the target configuration data based on the preset fields of the interface configuration data, interface information data, and template content data;
[0081] Step S105: The server stores the target configuration data in a preset database;
[0082] Step S106: The server sends the interface information data to the client;
[0083] Step S107: The client retrieves the target configuration data from the preset database based on the interface information data;
[0084] Step S108: The client configures the preset interface according to the target configuration data to obtain the target interface.
[0085] In steps S101 to S108 of this embodiment, the server obtains a target configuration template by responding to the triggering operation of a preset request control, and obtains target configuration data by responding to the user's input operation on the target configuration template. The client retrieves the target configuration data from a preset database using interface information data, and can then configure the preset interface according to the target configuration data to obtain the target interface. The target configuration template includes template content data describing fixed content in the target interface, and custom content data describing user-customizable content in the target interface. Therefore, the interface configuration method provided in this embodiment can customize the target interface using custom content data, realizing the possibility of user interface configuration and improving the flexibility of interface configuration. Furthermore, when user needs change, the interface configuration method provided in this embodiment only needs to update the custom content data or select the corresponding target configuration template, thus avoiding the situation in related technologies where the interface configuration data is fixed and therefore all configuration data needs to be changed, thereby improving the configuration efficiency of the interface.
[0086] It should be noted that the interface configuration method provided in this application embodiment is applied to an interface configuration system including a server and a client. The server is a backend capable of responding to user touch operations and obtaining configuration data input by the user on the relevant interface; the client is capable of retrieving target configuration data generated by the server through relevant interfaces and rendering the interface on a preset interface based on the target configuration data, thereby obtaining the frontend of the target interface.
[0087] In step S101 of some embodiments, the server can display a preset configuration interface, which is configured with a request control for generating a configuration request. When the request control is triggered, the server retrieves the corresponding target configuration template from the preset configuration template according to the configuration request. Figure 2As shown, the target configuration template includes template content data and custom content data. The template content data is used to describe the fixed content in the target interface, such as... Figure 2 The table ID, title, menu category, and database name are shown below. The table ID is the identifier for the target interface to be generated, and can consist of letters, numbers, etc. The title is the name of the target interface. The menu category is the name of the parent menu to which the target interface belongs. The menu name is the name of the target interface. The database name is the name of the database used to store the generated business data when the user operates on the target interface, or the name of the preset database used to store the target configuration data. Custom content data is used to describe the user-customizable content in the target interface, such as... Figure 2 The "Table Configuration" shown above. It's understandable that "Microservices that need to be pushed" is template content data, but it can be set as an optional field according to the user's actual needs. Correspondingly, "Table ID," "Title," "Menu Category," and "Database Name" in the template content data are required fields.
[0088] Understandably, the server can pre-set multiple configuration templates, each containing different template content data to suit different application scenarios. For example, for a target interface without interaction, there's no need to set the "database name" and "microservice to be pushed." The server retrieves the corresponding target configuration template from among the multiple pre-set templates based on the configuration request.
[0089] In step S102 of some embodiments, the server obtains interface information data based on the user's filling operation of template content data.
[0090] In step S103 of some embodiments, the server obtains interface configuration data based on the user's population operation of custom content data. It is understood that, as... Figure 3 and Figure 4 As shown, the server predefines multiple first preset fields and second preset fields. The first preset field, used to populate custom content data, is used as a configuration field, and the second preset fields and content data within the scope of this configuration field's definition are used as the configuration content data. Specifically, as... Figure 3 and Figure 4As shown, the first preset fields include "text", "textarea", "textarray", "number", "time", "data", "select", "multiSelect", "multiSelectTree", "json", and "file", while the second preset fields include "hint", "default", "require", "format", "fileType", "maximageSize", "minlength", "maxlength", and "toLowerCase". It can be understood that the second field is used to limit the attributes of the content data.
[0091] The "Meaning" field describes the function of the first field. For example, when "multiSelect" is used as a configuration field, it means the user expects to configure the data within the range defined by "multiSelect" on the preset interface, and that the configuration data will be displayed as multiple options. The "hint" field describes the input prompt for the first preset field. For example, when "text" is used as a configuration field, the configuration data corresponding to "text" includes "hint" and the corresponding content data (such as "Please enter"), which will be displayed on the target interface. Figure 5The text box 101 shown displays "Please enter". It's understood that "Please enter" is a prompt for user input, and its font, size, and color can be customized to differentiate it from other content data. "default" describes the default value of the content data corresponding to the first preset field. "require" describes whether the content data corresponding to the first preset field is required; "require" equals true, indicating a required field, and "require" equals false, indicating an optional field. "form at" describes the text format of the content data corresponding to the first preset field, including formats such as html and text. "fileType" describes the file type of the content data corresponding to the first preset field, including image, video, and document (doc). "maximageSize" describes the maximum image size in pixels for the content data corresponding to the first preset field. "minlength" describes the maximum character length for the content data corresponding to the first preset field. "maxlength" describes the minimum character length for the content data corresponding to the first preset field. "toLowerCase" converts the content data corresponding to the first preset field to lowercase. It is understood that the first and second preset fields mentioned above are merely exemplary, and can be added or removed as needed. This application embodiment does not impose any specific limitations on this.
[0092] In step S104 of some embodiments, such as Figure 6 As shown, this is for Figure 2 The diagram shows the interface after the target configuration template has been populated. The server obtains the target configuration data based on the interface configuration data, interface information data, and template content data template fields shown in this diagram. The target configuration data includes the template field "_id" for "Table ID", the template field "collection" for "Database Name", the template field "title" for "Title", the template field "menuName" for "Menu Name", the template field "menuCategory_name" for "Menu Category", and the content from the "Table Configuration".
[0093] In some embodiments, in step S105, the server sends the target configuration data obtained in the above steps to a preset database. The preset database may be an internal database of the server or an external database (such as MongoDB) that is different from the server and the client.
[0094] In step S106 of some embodiments, the server sends interface information data to the client through API (Application Programming Interface) or other means.
[0095] In step S107 of some embodiments, the client retrieves the corresponding target configuration data from a preset database based on the interface information data. It is understood that the server uses the interface information data as index data for the target configuration data and performs deduplication on the data responsible for the main indexing task within the interface information data. For example, when the interface content data corresponding to the "table ID" in the template content data is used as the data responsible for the main indexing task, a deduplication operation needs to be performed on the interface content data corresponding to the "table ID" to ensure that the client can obtain unique target configuration data based on the interface information data.
[0096] In step S108 of some embodiments, the client renders a preset interface based on the obtained target configuration data to configure the corresponding target interface.
[0097] Reference Figure 7 In some embodiments, step S108 includes, but is not limited to, steps S701 to S703.
[0098] Step S701: The client configures at least two first selection controls on the preset interface according to the first multi-select field;
[0099] Step S702: The client matches each first selection control with an option identifier to obtain at least two option data;
[0100] Step S703: The client configures the menu bar in the preset interface according to the first title data, and matches the menu bar with all option data to obtain the target interface.
[0101] In step S701 of some embodiments, the configuration field includes a first multi-select field `multiSelect`, and the configuration content data includes first title data with at least two option identifiers. It is understood that the first multi-select field `multiSelect` is used to represent multiple options; therefore, the client will configure content data capable of multiple selections on a preset interface according to the configuration content data. Specifically, the client configures the same number of first selection controls on the preset interface as the number of first multi-select fields `multiSelect` and option identifiers. For example, if the target configuration data includes two option identifiers `"name":"bank insurance"` and `"name":"individual insurance"`, and the first title data `"name":"channel"`, then the client will configure the following on the preset interface: Figure 5The two first selection controls shown are selection control 102 and selection control 103. It is understood that... Figure 5 The form of the first selection control shown is merely exemplary. Depending on the actual application requirements, a first preset field or a second preset field can be set to limit the form of the first selection control, such as limiting it to... Figure 5 The tile selection method or drop-down selection method shown are not specifically limited in the embodiments of this application.
[0102] In step S702 of some embodiments, the client maps and matches each first selection control with an option identifier to obtain at least two selection data, such as obtaining... Figure 5 The selected data 104 and selected data 105 are shown.
[0103] In step S703 of some embodiments, the client configures a menu bar on a preset interface based on the first title data, and uses the first title data as the title name of the menu bar. The selection data obtained according to the above steps is then mapped and matched with the menu bar to use all option data as the content data of the menu bar. For example... Figure 5 As shown, the client configures a menu bar 106 with "Channel" as the title name in the preset interface according to the first title data "name": "Channel", and uses selection data 104 and selection data 105 as the content data of the menu bar 106 to obtain the target interface.
[0104] The interface configuration method provided in this application provides a first multi-select field multiSelect to represent multiple options, which enables the client to configure a menu bar for multiple selections on a preset interface based on the first multi-select field, thereby enriching the operation mode and applicable scenarios of the target interface.
[0105] Reference Figure 8 In some embodiments, the interface configuration method provided in this application further includes steps S801 to S802.
[0106] Step S801: The client configures the Select All control on the target interface based on the Select All field, and associates the Select All control with all option data;
[0107] Step S802: In response to the touch operation on the select all control, the client updates the original permission identifier of all option data to the target permission identifier.
[0108] In step S801 of some embodiments, the target configuration data includes a "select all" field (allSelectName). The client configures a "select all" control on the target interface based on this "allSelectName" field and associates the "select all" control with all option data so that when the "select all" control is touched, all option data can be selected. It is understood that the "select all" control can be set in the corresponding menu bar or in other locations on the target interface; this embodiment does not specifically limit this.
[0109] In step S802 of some embodiments, the configuration content data also includes a target permission identifier "allSelectValue": "00". When the select-all control on the target interface is touched, the client will update the original permission identifier of the option data according to the target permission identifier to achieve a one-click replacement effect. It can be understood that the permission identifier (including the target permission identifier and the original permission identifier) is used to indicate the permissions of the content data associated with the corresponding option data. For example, the target configuration data also includes title data "name": "Secondary Institution Information", option identifiers "name": "City A" and "name": "City B", and original permission identifiers "key": "01" and "key": "02". Figure 5 As shown, the client configures a menu bar 107 titled "Secondary Institution Information" on the preset interface according to the aforementioned target configuration data. The original permission identifier for option data 108 is 01, and the original permission identifier for option data 109 is 02. Option identifiers "City A" and "City B" both belong to the headquarters cities under the corresponding insurance business. When the select-all control associated with option data 109 and option data 108 is touched, the client updates the original permission identifiers of both option data 109 and option data 108 to "00". It can be understood that the target permission identifier "00" indicates that City A and City B have permissions with the permission identifier "00". This permission can be set as permission to purchase a certain type of insurance, permission to operate business data, etc., and this embodiment does not specifically limit this. Taking the target permission identifier "00" as the permission to purchase a certain type of insurance as an example, when the original permission identifiers of "City A" and "City B" are both updated to the target permission identifier "00", it means that users associated with "City A" and users associated with "City B" can purchase Class A, Class B, and Class C insurance corresponding to the target permission identifier "00". The original permission identifier "01" indicates that only Class A insurance can be purchased, and the original permission identifier "02" indicates that only Class B insurance can be purchased.
[0110] The interface configuration method provided in this application provides a "one-click replacement" effect by setting an allSelectName field that represents the all-select operation. This allows the client to update the original permission identifier of the option data associated with the all-select field to the target permission identifier, thereby enriching the operation methods and applicable scenarios of the target interface and avoiding the situation in related technologies where the target configuration data needs to be modified as a whole when updating permissions.
[0111] Reference Figure 9 In some embodiments, step S108 includes, but is not limited to, steps S901 to S903.
[0112] Step S901: The client obtains business data based on the multi-select search fields and multi-select interface data; wherein, the business data includes business fields and business content data of the business fields;
[0113] Step S902: The client takes the business field that matches the query field as the target field, takes the business content data that matches the target field as the target content data, and obtains the number of fields of the target field;
[0114] Step S903: The client configures the second selection control on the preset interface according to the number of fields and the second multi-select field, and matches the second selection control with the target content data to obtain the target interface.
[0115] In step S901 of some embodiments, the configuration fields in the target configuration data include a multi-select search field `optionsSource` and a second multi-select field `multiSelect`, and the configuration content data includes a query field `nickName` and multi-select interface data `lookup`. The client is used to obtain business data from the multi-select interface data `lookup` within the scope defined by the multi-select search field `optionsSource`. This business data can be data generated when the user operates on the target interface of another client; or data pre-imported into a preset database. This embodiment does not specifically limit this. The preset database, or the data transmission interface between the other client and the client currently performing the target interface configuration operation, is `lookup`. It is understood that the business fields are used to describe the corresponding user's business operations, and the business content data includes user information and other data. For example, when applied to insurance business, the business field includes `nickName`, which is a code name for type X insurance. The business content data includes user information of the target user, where the target user is a user who has purchased type X insurance.
[0116] In step S902 of some embodiments, the client searches for multiple business fields within the business data based on the query field to obtain a business field that matches the query field. This matching business field is then used as the target field, and the business content data of that target field is used as the target content data. For example, in the above example, the client uses the business field "nickName" as the target field, thereby filtering out the business content data of all users who have purchased insurance of type X. The client also performs statistical analysis on the filtered target fields to obtain the number of fields.
[0117] In step S903 of some embodiments, the client configures the same number of second selection controls as the number of fields on a preset interface according to the second multi-select field, and matches each second selection control with a target content data to obtain the target interface, thereby realizing the associated display of the target content data. For example, in the example above, it is possible to realize the associated display of information of all users who have purchased X type of insurance.
[0118] The interface configuration method provided in this application obtains the target field through query fields and multi-select interface data, thereby enabling the associated display of target content data for the target field. When new business data is added, the client can determine whether the new business data matches the query field through query fields and multi-select interface. If it matches, the client can directly obtain the corresponding business content data through multi-select interface data and update the previously associated business content data based on the newly obtained business content data. This achieves the update of the target interface display content, avoiding the need to manually change all target configuration data when the above situation occurs in related technologies, thus improving the efficiency of interface configuration.
[0119] Reference Figure 10 In some embodiments, step S108 includes, but is not limited to, steps S1001 to S1002.
[0120] Step S1001: The client obtains tag data based on the tree search field, tree interface data, and search field;
[0121] Step S1002: The client fills the tree structure data on the preset interface with the tag data to obtain the target interface.
[0122] In step S1001 of some embodiments, the target configuration data includes a tree-structured search field `multiSelectTree`, and the configuration content data includes tree-structured interface data `getLabelTree` and search fields `searchFields`. Specifically, the client obtains the tree-structured interface data `getLabelTree` and search fields `searchFields` based on the configuration content data within the defined range of the tree-structured search field `multiSelectTree`, and obtains search conditions based on the content data within the defined range of the search fields `searchFields`. Then, based on these search conditions, the client filters the data that can be retrieved by the tree-structured interface data `getLabelTree` to obtain tag data that meets the search conditions. For example, if the search conditions within the defined range of the search field `multiSelectTree` are "type":"content", the client obtains tag data from the `getLabelTree` interface based on these search conditions: tag 1, tag 2, and tag 3. It can be understood that tag 1, tag 2, and tag 3 are data of type directory, i.e., data that meets the search conditions.
[0123] In step S1002 of some embodiments, it is understood that the preset interface has tree-structured data, which includes multiple content-filled boxes arranged in a tree shape, so that the content data filled into the content-filled boxes can be related to each other and form a fixed category order. For example, the preset interface has such Figure 11 The tree structure data 110 shown includes three content-filled boxes. The client is used to sequentially fill all the content-filled boxes with the tag data obtained according to the above steps, thereby obtaining the following... Figure 12 The target interface is shown. It's understandable that the number of content-filled boxes in the tree structure data can be determined based on the number of label data obtained from the getLabelTree interface, or it can be preset by the client. When the number of content-filled boxes in the tree structure data is preset by the client, the client can hide excess content-filled boxes based on the number of obtained label data to avoid guiding the user to perform unnecessary operations.
[0124] The interface configuration method provided in this application embodiment enables the client to arrange multiple tag data obtained from the tree interface data in a tree structure by setting tree structure data on the preset interface, thereby realizing the association and classification sorting of multiple tag data, and thus improving the user's operating experience of the target interface to a certain extent.
[0125] Reference Figure 13 In some embodiments, the interface configuration method provided in this application further includes steps S1301 to S1303.
[0126] Step S1301: In response to the touch operation of the preset export control, the client generates an update template according to the target configuration data and sends the update template to the user terminal.
[0127] Step S1302: The client responds to the touch operation on the preset import control and obtains the target file returned by the user terminal according to the update template;
[0128] Step S1303: The client updates the target interface based on the target file.
[0129] In step S1301 of some embodiments, the target interface has a preset export control for exporting an update template. When the export control is touched, the client obtains the update template based on the target configuration data used to configure the current target interface. Specifically, the update template is used to update the configuration of the current target interface. Therefore, the update template includes interface information data and template fields used to describe fixed content in the target configuration data, as well as configuration content data and configuration fields used to describe custom content. For example, such as... Figure 14 The update template shown is in Excel spreadsheet format. The first row of the update template is used to fill in the storage identifiers of the fields in the interface configuration data, as well as the template fields. That is, for template content data, the first row of the update template can be directly filled according to the template fields; for custom content data, the first row should be filled according to the storage identifiers corresponding to the fields. For example, the first row of the update template includes the template field `menuName`, and the storage identifier "key": "channels" for the field `option` used to describe custom content. The content data within the definition range of the `option` field includes the field `name`, therefore, the update template can also include the storage identifier for the field `name`, i.e., `channels_name`. The second row of the update template serves as a fill-in prompt, used to fill in the data corresponding to the storage identifiers or template fields. For example, the data corresponding to the template field `menuName` is "Underwriting Medical Examination Guide"; the data corresponding to the storage identifier "channels" is "agent"; and the data corresponding to `channels_name` is "Individual Insurance", etc. The client sends this update template to the user terminal so that the user can fill in the data for updating the target interface according to the update template.
[0130] In step S1302 of some embodiments, the target interface also has a preset import control for importing the updated template. When the import control is touched, the client obtains the target file from the user terminal through an API interface or other means. For example, obtaining such... Figure 15 The target file shown.
[0131] In step S1303 of some embodiments, the client updates the current target interface according to the target file to obtain a new target interface. For example, according to... Figure 15 The target file shown will be as follows Figure 5 The current target interface shown is updated as follows: Figure 16 The new target interface is shown.
[0132] Understandably, the client can also generate another target interface based on the target file. That is, instead of updating the current interface, the client retains the current target interface and generates another target interface with the same configuration structure as the current target interface, but with different content data.
[0133] The interface configuration method provided in this application allows the client to update the target interface through the target file generated by the update template via the user terminal. This avoids the need to reset the target configuration data to update the target interface in related technologies, thereby improving the efficiency of interface configuration.
[0134] Reference Figure 17 In some embodiments, the interface configuration method provided in this application further includes steps S1701 to S1702.
[0135] Step S1701: The client responds to the interface update operation of the target interface and generates prompt data;
[0136] Step S1702: The client performs the push operation based on the prompt data and push address data.
[0137] In step S1701 of some embodiments, referring to Figure 6 When the interface information data includes data for filling the template content data "microservices to be pushed" (i.e., push address data), the client is also used to respond to the interface update operation of the target interface and generate prompt data based on the interface update operation to notify the user that the current target interface has been updated. It is understood that the prompt data may include an updated target interface diagram, target configuration data corresponding to the updated target interface, etc., or may only include the prompt content "target interface has been updated". This application embodiment does not specifically limit this.
[0138] In step S1702 of some embodiments, the client pushes prompt data to the corresponding microservice based on the push address data to notify the user that the current target interface has been updated. It is understood that the microservice can be an application loaded on the user's terminal, or an application loaded on other types of terminals; this embodiment does not specifically limit this.
[0139] The interface configuration method provided in this application involves the server obtaining a target configuration template by responding to the triggering operation of a preset request control, and obtaining target configuration data by responding to the user's input of the target configuration template. The client retrieves the target configuration data from a preset database using interface information data, and can then configure the preset interface according to the target configuration data to obtain the target interface. The target configuration template includes template content data describing fixed content in the target interface, and custom content data describing user-customizable content in the target interface. Therefore, the interface configuration method provided in this application can customize the target interface using custom content data, realizing the possibility of user interface configuration and improving the flexibility of interface configuration. Furthermore, when user needs change, the interface configuration method provided in this application only needs to update the custom content data or select the corresponding target configuration template, thus avoiding the situation in related technologies where all configuration data needs to be changed because the interface configuration data is fixed, thereby improving the configuration efficiency of the interface. By setting a first multi-select field (multiSelect) to represent multiple options, the client can configure a menu bar for multiple selections on a preset interface based on this first multi-select field, thereby enriching the operation methods and applicable scenarios of the target interface. By setting an allSelectName field to represent the select-all operation, the client can update the original permission identifier of the option data associated with this allSelect field to the target permission identifier, achieving a "one-click replacement" effect. This further enriches the operation methods and applicable scenarios of the target interface and avoids the situation in related technologies where the entire target configuration data needs to be modified when updating permissions.
[0140] Reference Figure 18 This application also provides an interface configuration system that can implement the above-described interface configuration method. The system includes:
[0141] Server-side 1801: In response to a trigger operation on a preset request control, the server retrieves the target configuration template from a preset configuration template. The target configuration template includes template content data and custom content data. In response to a population operation on the template content data, the server obtains interface information data. In response to a population operation on the custom content data, the server obtains interface configuration data. This interface configuration data includes configuration fields and configuration content data matching the configuration fields. The server obtains the target configuration data based on the interface configuration data, the interface information data, and the preset fields matching the template content data. The server stores the target configuration data in a preset database. Finally, the server sends the interface information data to the client.
[0142] Client 1802: The client retrieves the target configuration data from the database based on the interface information data; the client configures the preset interface according to the target configuration data to obtain the target interface.
[0143] It is evident that the content of the above-described interface configuration method embodiments is applicable to the embodiments of this interface configuration system. The specific functions implemented by the embodiments of this interface configuration system are the same as those of the above-described interface configuration method embodiments, and the beneficial effects achieved are also the same as those achieved by the above-described interface configuration method embodiments.
[0144] This application also provides an electronic device, which includes a memory and a processor. The memory stores a computer program, and the processor executes the computer program to implement the above-described interface configuration method. This electronic device can be any smart terminal, including tablet computers, in-vehicle computers, etc.
[0145] Please see Figure 19 , Figure 19 The hardware structure of an electronic device according to another embodiment is illustrated. The electronic device includes:
[0146] The processor 1901 can be implemented using a general-purpose CPU (Central Processing Unit), microprocessor, application-specific integrated circuit (ASIC), or one or more integrated circuits, and is used to execute relevant programs to implement the technical solutions provided in the embodiments of this application.
[0147] The memory 1902 can be implemented as a read-only memory (ROM), a static storage device, a dynamic storage device, or a random access memory (RAM). The memory 1902 can store the operating system and other applications. When the technical solutions provided in the embodiments of this specification are implemented through software or firmware, the relevant program code is stored in the memory 1902 and is called and executed by the processor 1901 using the interface configuration method of the embodiments of this application.
[0148] The input / output interface 1903 is used to implement information input and output;
[0149] The communication interface 1904 is used to enable communication and interaction between this device and other devices. Communication can be achieved through wired means (such as USB, Ethernet cable, etc.) or wireless means (such as mobile network, WIFI, Bluetooth, etc.).
[0150] Bus 1905 transmits information between various components of the device (e.g., processor 1901, memory 1902, input / output interface 1903, and communication interface 1904);
[0151] The processor 1901, memory 1902, input / output interface 1903, and communication interface 1904 are connected to each other within the device via bus 1905.
[0152] This application also provides a computer-readable storage medium storing a computer program that, when executed by a processor, implements the above-described interface configuration method.
[0153] Memory, as a non-transitory computer-readable storage medium, can be used to store non-transitory software programs and non-transitory computer-executable programs. Furthermore, memory may include high-speed random access memory, and may also include non-transitory memory, such as at least one disk storage device, flash memory device, or other non-transitory solid-state storage device. In some embodiments, memory may optionally include memory remotely located relative to the processor, and these remote memories can be connected to the processor via a network. Examples of such networks include, but are not limited to, the Internet, intranets, local area networks, mobile communication networks, and combinations thereof.
[0154] The embodiments described in this application are for the purpose of more clearly illustrating the technical solutions of the embodiments of this application, and do not constitute a limitation on the technical solutions provided by the embodiments of this application. As those skilled in the art will know, with the evolution of technology and the emergence of new application scenarios, the technical solutions provided by the embodiments of this application are also applicable to similar technical problems.
[0155] Those skilled in the art will understand that the technical solutions shown in the figures do not constitute a limitation on the embodiments of this application, and may include more or fewer steps than shown, or combine certain steps, or different steps.
[0156] Those skilled in the art will understand that all or some of the steps in the methods disclosed above, as well as the functional modules / units in the systems and devices, can be implemented as software, firmware, hardware, or suitable combinations thereof.
[0157] The terms “first,” “second,” “third,” “fourth,” etc. (if present) in the specification and accompanying drawings of this application are used to distinguish similar objects and are not necessarily used to describe a specific order or sequence. It should be understood that such data can be interchanged where appropriate so that the embodiments of this application described herein can be implemented in orders other than those illustrated or described herein. Furthermore, the terms “comprising” and “having,” and any variations thereof, are intended to cover non-exclusive inclusion; for example, a process, method, system, product, or apparatus that comprises a series of steps or units is not necessarily limited to those steps or units explicitly listed, but may include other steps or units not explicitly listed or inherent to such processes, methods, products, or apparatus.
[0158] It should be understood that in this application, "at least one (item)" means one or more, and "more than" means two or more. "And / or" is used to describe the relationship between related objects, indicating that three relationships can exist. For example, "A and / or B" can represent three cases: only A exists, only B exists, and both A and B exist simultaneously, where A and B can be singular or plural. The character " / " generally indicates that the preceding and following related objects are in an "or" relationship. "At least one (item) of the following" or similar expressions refer to any combination of these items, including any combination of single or plural items. For example, at least one (item) of a, b, or c can represent: a, b, c, "a and b", "a and c", "b and c", or "a and b and c", where a, b, and c can be single or multiple.
[0159] In the embodiments provided in this application, it should be understood that the disclosed systems and methods can be implemented in other ways. For example, the system embodiments described above are merely illustrative; for instance, the division of the units described above is only a logical functional division, and in actual implementation, there may be other division methods. For example, multiple units or components may be combined or integrated into another system, or some features may be ignored or not executed. Furthermore, the coupling or direct coupling or communication connection shown or discussed may be through some interfaces; the indirect coupling or communication connection between systems or units may be electrical, mechanical, or other forms.
[0160] The units described above as separate components may or may not be physically separate. The components shown as units may or may not be physical units; that is, they may be located in one place or distributed across multiple network units. Some or all of the units can be selected to achieve the purpose of this embodiment according to actual needs.
[0161] Furthermore, the functional units in the various embodiments of this application can be integrated into one processing unit, or each unit can exist physically separately, or two or more units can be integrated into one unit. The integrated unit can be implemented in hardware or as a software functional unit.
[0162] If the integrated unit is implemented as a software functional unit and sold or used as an independent product, it can be stored in a computer-readable storage medium. Based on this understanding, the technical solution of this application, in essence, or the part that contributes to the prior art, or all or part of the technical solution, can be embodied in the form of a software product. This computer software product is stored in a storage medium and includes multiple instructions to cause a computer device (which may be a personal computer, server, or network device, etc.) to execute all or part of the steps of the methods of the various embodiments of this application. The aforementioned storage medium includes various media capable of storing programs, such as USB flash drives, portable hard drives, read-only memory (ROM), random access memory (RAM), magnetic disks, or optical disks.
[0163] The preferred embodiments of the present application have been described above with reference to the accompanying drawings, but this does not limit the scope of the claims of the present application. Any modifications, equivalent substitutions, and improvements made by those skilled in the art without departing from the scope and substance of the embodiments of the present application shall be within the scope of the claims of the present application.
Claims
1. A method for configuring an interface, characterized in that, The method includes: In response to a trigger operation of a preset request control, the server obtains a target configuration template from a preset configuration template; wherein, the target configuration template includes template content data and custom content data; The server responds to the population operation of the template content data to obtain interface information data; The server responds to the population operation of the custom content data to obtain interface configuration data; wherein, the interface configuration data includes configuration fields and configuration content data of the configuration fields; The server obtains the target configuration data based on the interface configuration data, the interface information data, and the template field of the template content data. The server stores the target configuration data in a preset database. The server sends the interface information data to the client. The client retrieves the target configuration data from the preset database based on the interface information data; The client configures the preset interface according to the target configuration data to obtain the target interface. The configuration fields include a first multi-select field, and the configuration content data includes a first title data and at least two option identifiers; or, the configuration fields include a multi-select search field and a second multi-select field, and the configuration content data includes a query field and multi-select interface data; or, the configuration fields include a tree-structured search field, and the configuration content data includes tree-structured interface data and a search field. The client responds to a touch operation on a preset export control, generates an update template based on the target configuration data, and sends the update template to the user terminal; The client responds to a touch operation on a preset import control and obtains the target file returned by the user terminal according to the update template; The client updates the target interface based on the target file.
2. The method according to claim 1, characterized in that, The configuration fields include a first multi-select field, and the configuration content data includes a first title data and at least two option identifiers; The client configures the preset interface according to the target configuration data to obtain the target interface, including: The client configures at least two first selection controls on the preset interface according to the first multi-select field; The client matches each of the first selection controls with one of the option identifiers to obtain at least two option data. The client configures a menu bar on the preset interface based on the first title data, and matches the menu bar with all the option data to obtain the target interface.
3. The method according to claim 2, characterized in that, Each of the option data includes an original permission identifier, the configuration field also includes a select all field, the configuration content data also includes a target permission identifier, and the method further includes: The client configures a select all control on the target interface according to the select all field, and associates the select all control with all the option data; In response to a touch operation on the select all control, the client updates the original permission identifiers of all option data to the target permission identifiers.
4. The method according to claim 1, characterized in that, The configuration fields include a multi-select search field and a second multi-select field, and the configuration content data includes query fields and multi-select interface data; The client configures the preset interface according to the target configuration data to obtain the target interface, including: The client obtains business data based on the multi-select search field and the multi-select interface data; wherein, the business data includes business fields and business content data of the business fields; The client takes the business field that matches the query field as the target field, takes the business content data that matches the target field as the target content data, and obtains the number of fields of the target field; The client configures a second selection control on the preset interface according to the number of fields and the second multi-select field, and matches the second selection control with the target content data to obtain the target interface.
5. The method according to claim 1, characterized in that, The configuration fields include tree search fields, and the configuration content data includes tree interface data and search fields; The client configures the preset interface according to the target configuration data to obtain the target interface, including: The client obtains tag data based on the tree-shaped search field, the tree-shaped interface data, and the search field; The client fills the tree structure data on the preset interface with the tag data to obtain the target interface.
6. The method according to claim 1, characterized in that, The interface information data includes push address data, and the method further includes: The client responds to the interface update operation of the target interface and generates prompt data; The client performs a push operation based on the prompt data and the push address data.
7. A user interface configuration system, characterized in that, The system includes: On the server side, in response to a trigger operation of a preset request control, the server obtains a target configuration template from a preset configuration template; wherein, the target configuration template includes template content data and custom content data; the server obtains interface information data in response to a population operation of the template content data; the server obtains interface configuration data in response to a population operation of the custom content data; wherein, the interface configuration data includes configuration fields and configuration content data matching the configuration fields; the server obtains target configuration data based on the interface configuration data, the interface information data, and preset fields matching the template content data; the server stores the target configuration data in a preset database; the server sends the interface information data to the client; The client retrieves the target configuration data from the database based on the interface information data; the client configures the preset interface according to the target configuration data to obtain the target interface; wherein, the configuration fields include a first multi-select field, and the configuration content data includes a first title data and at least two option identifiers; or, the configuration fields include a multi-select search field and a second multi-select field, and the configuration content data includes a query field and multi-select interface data; or, the configuration fields include a tree-structured search field, and the configuration content data includes tree-structured interface data and a search field; In response to a touch operation on a preset export control, the client generates an update template based on the target configuration data and sends the update template to the user terminal; in response to a touch operation on a preset import control, the client obtains the target file returned by the user terminal based on the update template; the client updates the target interface based on the target file.
8. An electronic device, characterized in that, The electronic device includes a memory and a processor, the memory storing a computer program, and the processor executing the computer program to implement the interface configuration method according to any one of claims 1 to 6.
9. A computer-readable storage medium storing a computer program, characterized in that, When the computer program is executed by a processor, it implements the interface configuration method according to any one of claims 1 to 6.
Citation Information
Patent Citations
Interface configuration method and device
CN108776610A
Configuration system and method for common component UI interface
CN110321183A