An interface specification and threshold value cooperation-based screening component display method and system

By acquiring task information and the size information of the filtering component, the display of the filtering component is dynamically adjusted, which solves the problem of fixed interface styles in React Native mobile applications, improves screen utilization, and reduces maintenance costs.

CN122285166APending Publication Date: 2026-06-26ZHOUPU DATA TECH NANJING CO LTD

Patent Information

Authority / Receiving Office
CN · China
Patent Type
Applications(China)
Current Assignee / Owner
ZHOUPU DATA TECH NANJING CO LTD
Filing Date
2026-05-06
Publication Date
2026-06-26

AI Technical Summary

Technical Problem

In existing technologies, the fixed interface styles of filtering components in React Native-based mobile applications lead to low screen utilization and high maintenance costs.

Method used

By acquiring the information of the tasks to be processed, the filtering components are determined based on the key filtering attributes of the subtask information, and the filtering is performed according to the display panel size and component size information, dividing them into a first component set and a second component set, which are then displayed on the display panel respectively.

Benefits of technology

It improves the accuracy and flexibility of the filtering component display, increases screen utilization, and reduces maintenance costs.

✦ Generated by Eureka AI based on patent content.

Smart Images

  • Figure CN122285166A_ABST
    Figure CN122285166A_ABST
Patent Text Reader

Abstract

This invention discloses a method and system for displaying filtering components based on interface specifications and threshold collaboration. The method includes: acquiring task information to be processed, including at least one subtask information and at least one key filtering attribute corresponding to each subtask information; for each subtask information, determining at least one filtering component based on the at least one key filtering attribute corresponding to the subtask information; for each filtering component, updating the component state corresponding to the filtering component to update the candidate component sequence; filtering each filtering component in the candidate component sequence according to the display panel size information and the component size information corresponding to each filtering component to determine a first component set and a second component set; and displaying the first component set and the second component set in the display panel according to a corresponding display format. This invention can improve the accuracy of displaying filtering components based on interface specifications and threshold collaboration.
Need to check novelty before this filing date? Find Prior Art

Description

Technical Field

[0001] This invention relates to the field of data processing technology, and in particular to a method and system for displaying filtering components based on interface specifications and threshold coordination. Background Technology

[0002] With the rapid development of technology, mobile applications based on the React Native framework are becoming increasingly widespread. Mobile applications can include multiple filtering components, allowing users to filter database information by selecting the corresponding filter criteria.

[0003] Currently, the interface display style and layout of the filtering components are fixed through hard coding.

[0004] However, a fixed interface style can lead to low screen utilization and high maintenance costs. Summary of the Invention

[0005] This invention provides a method and system for displaying filtering components based on interface specifications and threshold coordination, so as to improve the accuracy of displaying filtering components based on interface specifications and threshold coordination.

[0006] In a first aspect, embodiments of the present invention provide a method for displaying filtering components based on interface specifications and threshold coordination, the method comprising:

[0007] Obtain information about tasks to be processed, including: at least one subtask information and at least one key filtering attribute corresponding to each subtask information;

[0008] For each subtask information, determine at least one filtering component based on at least one key filtering attribute corresponding to the subtask information;

[0009] For each filtering component, update the component status corresponding to the filtering component so that the filtering component updates the candidate component sequence;

[0010] Based on the display panel size information and the component size information corresponding to each filter component, filter each filter component in the candidate component sequence to determine the first component set and the second component set;

[0011] Display the first and second component sets in the display panel according to their respective display formats.

[0012] Secondly, embodiments of the present invention also provide a filtering component display system based on interface specifications and threshold coordination, the system comprising:

[0013] The information acquisition module is used to acquire information about tasks to be processed. The information about tasks to be processed includes: at least one subtask information and at least one key filtering attribute corresponding to each subtask information.

[0014] The component determination module is used to determine at least one filtering component for each subtask information based on at least one key filtering attribute corresponding to the subtask information.

[0015] The status update module is used to update the status of the corresponding component for each filter component, so that the filter component updates the candidate component sequence;

[0016] The component filtering module is used to filter each component in the candidate component sequence based on the display panel size information and the component size information corresponding to each filtering component, and to determine the first component set and the second component set.

[0017] The component display module is used to display the first component set and the second component set in the display panel according to the corresponding display format.

[0018] The technical solution of this invention involves acquiring task information to be processed, including at least one subtask information and at least one key filtering attribute corresponding to each subtask information; for each subtask information, determining at least one filtering component based on the at least one key filtering attribute corresponding to the subtask information; updating the component state corresponding to each filtering component to update the candidate component sequence; filtering each filtering component in the candidate component sequence based on the display panel size information and the component size information corresponding to each filtering component to determine a first component set and a second component set; and displaying the first component set and the second component set on the display panel according to the corresponding display format. By performing different component display steps for different filtering component sets, the accuracy of filtering component display based on interface specifications and threshold collaboration is improved.

[0019] It should be understood that the description in this section is not intended to identify key or essential features of the embodiments of the present invention, nor is it intended to limit the scope of the invention. Other features of the invention will become readily apparent from the following description. Attached Figure Description

[0020] To more clearly illustrate the technical solutions in the embodiments of the present invention, the accompanying drawings used in the description of the embodiments will be briefly introduced below. Obviously, the accompanying drawings described below are only some embodiments of the present invention. For those skilled in the art, other drawings can be obtained based on these drawings without creative effort.

[0021] Figure 1 This is a flowchart of a filtering component display method based on interface specification and threshold coordination according to an embodiment of the present invention;

[0022] Figure 2This is a flowchart of a filtering component display method based on interface specification and threshold coordination according to an embodiment of the present invention;

[0023] Figure 3 This is a structural diagram of a filtering component display system based on interface specifications and threshold coordination according to an embodiment of the present invention. Detailed Implementation

[0024] To enable those skilled in the art to better understand the present invention, the technical solutions of the present invention will be clearly and completely described below with reference to the accompanying drawings of the embodiments of the present invention. Obviously, the described embodiments are only some embodiments of the present invention, and not all embodiments. Based on the embodiments of the present invention, all other embodiments obtained by those skilled in the art without creative effort should fall within the scope of protection of the present invention.

[0025] It should be noted that the terms "first," "second," etc., in the specification, claims, and accompanying drawings of this invention 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 the invention 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 a 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.

[0026] In the technical solutions of the embodiments of the present invention, the acquisition, storage and application of information such as the task to be processed are in accordance with the provisions of relevant laws and regulations and do not violate public order and good morals.

[0027] Example 1

[0028] Figure 1 This is a flowchart illustrating a method for displaying filtering components based on interface specifications and threshold coordination, as provided in Embodiment 1 of the present invention. This embodiment of the invention is applicable to situations involving the display of filtering components based on interface specifications and threshold coordination. This method can be executed by a filtering component display system based on interface specifications and threshold coordination, which can be implemented in hardware and / or software.

[0029] See Figure 1 The method for displaying filtering components based on interface specifications and threshold coordination, as shown, includes:

[0030] S101. Obtain information on tasks to be processed. The information on tasks to be processed includes: at least one subtask information and at least one key filtering attribute corresponding to each subtask information.

[0031] The pending task information can be a description of the task sequence to be executed, which may include multiple sub-tasks. Sub-task information can be a description of the business scenario requiring data retrieval and display, such as user consumption behavior information. Key filtering attributes can be dimensional fields used to filter the data, such as order information or shipping warehouse information.

[0032] Specifically, the methods for obtaining information about tasks to be processed include, but are not limited to, depth-first search (DFS) and breadth-first search (BFS) algorithms. In actual execution, a task to be processed may contain one or more independent subtasks. These subtasks together constitute a complete data processing task sequence, corresponding to different dimensions and types of data filtering needs, such as user consumption behavior analysis. While parsing the subtask information, the system automatically identifies and extracts matching key filtering attributes based on the business meaning, data source, and retrieval purpose of each subtask. These key filtering attributes, as core dimension fields for data filtering, can include various types such as order information, user information, product information, shipping warehouse information, and payment information. Through this method, complex business filtering tasks can be broken down into clear, independent, and uniformly manageable combinations of subtasks and attributes.

[0033] S102. For each subtask information, determine at least one filtering component based on at least one key filtering attribute corresponding to the subtask information.

[0034] Among them, the filtering component can be a standardized functional component with corresponding filtering capabilities obtained by matching based on key filtering attributes.

[0035] Specifically, after acquiring and parsing the information of each subtask and the corresponding key filtering attributes, a step-by-step traversal and refined parsing operation is performed on each independent subtask at the granularity of the subtask. During the parsing process, based on the field type, data characteristics, and usage scenario of the key filtering attributes, a pre-built and uniformly maintained filtering component library is used for matching and searching to select standardized filtering components with corresponding processing capabilities. Examples include time information matching time range filtering components, order information matching order identifier filtering components, and order creation time filtering components. Ultimately, at least one filtering component is determined for each subtask.

[0036] S103. For each filtering component, update the component status corresponding to the filtering component so that the filtering component updates the candidate component sequence.

[0037] The component status can be descriptive information that indicates whether the filtering component has been identified as a dimension of the current filtering data.

[0038] Specifically, each filter component is iterated through item by item, and the component status parameters corresponding to each filter component are read. The parameter value of each filter component's component status parameter includes two states: selected and unselected. The parameter value of the component status parameter of each filter component is updated to selected. After the parameter value of the status parameter is updated, all filter components can be reordered, deduplicated, and compliance verified according to preset priority, high frequency of use order, or business rules. Unusable or unauthorized filter items are removed, and finally a candidate component sequence with complete structure, reasonable order, accurate status, and can be directly used for interface layout is formed. The candidate component sequence includes at least one filter component.

[0039] S104. Based on the display panel size information and the component size information corresponding to each filter component, filter each filter component in the candidate component sequence to determine the first component set and the second component set.

[0040] The panel size information can be the overall physical size data representing the interface area carrying the filtering function, including the width, height, and available layout boundaries of the display panel, which is the spatial reference for determining whether a component can be fully displayed. The component size information can be the actual space occupied by the filtering component for rendering on the interface, including the component's width, height, inner margin, outer margin, and the length of the displayed text, which determines the space occupied by a single component in the panel. The first component set can refer to the subset of filtering components that can be fully displayed in the main area of ​​the display panel after filtering, usually high-frequency filtering items that are prioritized for display. The second component set can refer to the subset of filtering components that cannot be fully displayed in the main area due to space limitations and need to be stored in a folded area or displayed through a special entry point, usually low-frequency or auxiliary filtering items.

[0041] Specifically, after obtaining the overall size information of the display panel (such as panel width or maximum available display width) and the size information corresponding to each selected component in the candidate component sequence (such as the width range corresponding to the fixed width of the component or the length of dynamic text), space adaptation and filtering processing is performed. The maximum number of components that the display panel can accommodate horizontally and the total available space are calculated, and a reasonable space allocation benchmark is determined in conjunction with a preset layout strategy (such as adaptive width distribution). According to the priority order of the candidate component sequence, the cumulative space required by each component is calculated and dynamically compared with the remaining available space of the display panel. When the space required by a component does not exceed the remaining available space of the panel, the component is assigned to the first component set; when the space required by a component exceeds the remaining available space of the panel, or when space needs to be reserved to ensure the integrity of the main area component display, the subsequent component is assigned to the second component set. Through the above space calculation and dynamic judgment, the selection of the candidate component sequence is completed, clearly defining the first and second component sets, providing an accurate basis for component division for subsequent differentiated display and layout.

[0042] S105. Display the first component set and the second component set in the display panel according to the corresponding display format.

[0043] Specifically, based on the first and second component sets that have already been divided and categorized, the interface rendering and layout are performed using matching display formats. All filter components within the first component set are laid out sequentially from left to right in the main display area of ​​the display panel according to a pre-set priority order, usage frequency, or business logic order. This ensures that each component is responsive, independently clickable, and updated in real-time, allowing users to directly interact with core filter components without needing to expand or navigate. The number of components within the second component set is assessed: if the second component set contains only a single filter component, it is directly appended and rendered to the far right of the main display area, also laid out in a flat manner, maintaining a visual style and interaction consistent with the main area components, without additional pop-ups or collapsible panels; if the second component set contains two or more filter components, a unified collapsible entry control, such as a "More" button, is generated at the end of the main display area, consolidating all components within the second component set into a pop-up window or collapsible panel, which only expands when the user clicks the collapsible entry. Finally, the main display area and the folded storage area are rendered synchronously according to the established layout rules and presented completely in the display panel, realizing the layered display and orderly arrangement of the filtering components.

[0044] The technical solution of this invention involves acquiring task information to be processed, including at least one subtask information and at least one key filtering attribute corresponding to each subtask information; for each subtask information, determining at least one filtering component based on the at least one key filtering attribute corresponding to the subtask information; updating the component state corresponding to each filtering component to update the candidate component sequence; filtering each filtering component in the candidate component sequence based on the display panel size information and the component size information corresponding to each filtering component to determine a first component set and a second component set; and displaying the first component set and the second component set on the display panel according to the corresponding display format. By performing different component display steps for different filtering component sets, the accuracy of filtering component display based on interface specifications and threshold collaboration is improved.

[0045] Example 2

[0046] Figure 2 This is a flowchart illustrating a filtering component display method based on interface specification and threshold coordination, as provided in Embodiment 2 of the present invention. Based on the above embodiments, this embodiment optimizes and improves the filtering component display operation based on interface specification and threshold coordination.

[0047] Furthermore, the step of "determining at least one filtering component based on at least one key filtering attribute corresponding to the subtask information" is refined to "for each key filtering attribute corresponding to the subtask information, based on the subtask information and the key filtering attribute, identify at least one associated attribute corresponding to the key filtering attribute and the attribute value corresponding to each associated attribute; for each associated attribute, filter the corresponding filtering component from each candidate component in the component library based on the associated attribute", in order to improve the operation of displaying filtering components based on interface specifications and threshold collaboration.

[0048] It should be noted that for parts not described in detail in the embodiments of the present invention, please refer to the descriptions in other embodiments.

[0049] See Figure 2 The method for displaying filtering components based on interface specifications and threshold coordination, as shown, includes:

[0050] S201. Obtain information on tasks to be processed. The information on tasks to be processed includes: at least one subtask information and at least one key filtering attribute corresponding to each subtask information.

[0051] S202. For each subtask information and for each key filtering attribute corresponding to the subtask information, based on the subtask information and the key filtering attributes, identify at least one associated attribute corresponding to the key filtering attribute and the attribute value corresponding to each associated attribute.

[0052] Among them, the related attributes can be attributes that are related to the key filtering attributes, and are used to assist the key filtering attributes in filtering data.

[0053] Specifically, after determining the subtask information and key filtering attributes, each key filtering attribute is analyzed in depth. Based on the business scenario, data structure, and relationships between attributes corresponding to the subtask, related attributes that have business connections, data dependencies, or display matching with the current key filtering attribute are automatically identified. For example, status information is associated with status name, status code, and status description; time information is associated with start time, end time, and time format, etc.

[0054] S203. For each associated attribute, filter the corresponding filter component from the candidate components in the component library according to the associated attribute.

[0055] Specifically, after acquiring each associated attribute, a precise search is performed within the component library based on that attribute. Standardized candidate components are selected that can adapt to the attribute's processing capabilities, have completely consistent interface specifications, mutually compatible data formats, and maintain a unified interactive experience. This completes a one-to-one precise mapping between associated attributes and selected components. For each independent associated attribute, a functionally matching, structurally complete, and directly executable selected component is determined. This ensures that the final generated component can independently handle the entire process of interface rendering, option display, user selection, status updates, data transformation, local caching, and parameter encapsulation for that associated attribute.

[0056] S204. For each filtering component, update the component status corresponding to the filtering component so that the filtering component updates the candidate component sequence.

[0057] Specifically, the state of each generated filter component is updated one by one, and the components are reorganized into a candidate component sequence based on the updated state. For each filter component, this means traversing each standardized filter component; the component state refers to the selection status of the filter component. Updating the candidate component sequence means regenerating an ordered list of components that can be used for UI rendering based on the latest selected state of the filter components. Each filter component is traversed, and its internal state is updated to selected; then, it is reordered according to priority, usage frequency, and business rules, filtering out invalid and unauthorized components to form a candidate component sequence that is accurate in state, logically ordered, and standardized.

[0058] S205. Based on the display panel size information and the component size information corresponding to each filter component, filter each filter component in the candidate component sequence to determine the first component set and the second component set.

[0059] Specifically, the system first obtains spatial information such as the available display width and maximum accommodating length of the current display panel, and simultaneously obtains information such as the actual rendered width and place size of each selected component in the candidate component sequence. Based on the total panel width and the component spacing layout strategy, the maximum number of components that can be fully displayed on the current panel is calculated, and this number is used as the dynamic grouping threshold. Components are sequentially included in the displayable area according to the order of the candidate component sequence: components that can fit completely within the panel space are assigned to the first component set; subsequent components that exceed the maximum accommodating number and cannot be fully displayed are assigned to the second component set. Through spatial calculation and dynamic judgment, the grouping of all selected components is completed, resulting in two clearly structured component sets, providing an accurate basis for subsequent layered display.

[0060] S206. Display the first component set and the second component set in the display panel according to the corresponding display format.

[0061] This invention identifies at least one associated attribute and the attribute value of each associated attribute based on the key filtering attributes corresponding to the subtask information and the key filtering attributes. For each associated attribute, the filtering component corresponding to the associated attribute is obtained from each candidate component in the component library. The filtering component can be determined through multi-dimensional data, which improves the accuracy of filtering component selection.

[0062] Optionally, after updating the component status corresponding to each filtering component to update the candidate component sequence, the method further includes: for each filtering component in the candidate component sequence, determining at least one key time period corresponding to the filtering component based on the subtask information; calculating the total historical number of times the filtering component corresponds to each key time period based on the historical number of times the filtering component corresponds to each key time period; and reordering each filtering component in the candidate component sequence based on the total historical number of times each filtering component has been used to obtain the updated candidate component sequence.

[0063] Specifically, each filter component in the candidate component sequence is traversed. Based on the business scenario corresponding to the current subtask information, at least one key time period related to the component is first determined, such as daily usage periods, high-frequency operation cycles, and historically active time periods. From historical logs, cached records, or backend statistics, the historical number of times the filter component was triggered, selected, and used by users within each key time period is read, and the number of times in each time period is accumulated to obtain the total historical number of times for the filter component. The higher the total historical number of times, the more frequently the component is used in the current business scenario, and the higher its priority. All filter components are sorted from highest to lowest based on their total historical number of times, with frequently used components at the top of the sequence and less frequently used components arranged sequentially towards the bottom, ultimately resulting in an updated candidate component sequence that better reflects user habits and has a more reasonable priority.

[0064] By identifying at least one key time period corresponding to each filtering component in the candidate component sequence based on subtask information, calculating the total historical number of filtering times for each filtering component based on the historical number of filtering times for each key time period, and reordering each filtering component in the candidate component sequence based on the total historical number of filtering times for each filtering component, an updated candidate component sequence is obtained, which can prioritize displaying filtering components with higher priority.

[0065] Optionally, based on the display panel size information and the component size information corresponding to each filtering component, each filtering component in the candidate component sequence is filtered to determine the first component set and the second component set, including: obtaining the identifier length of the component display identifier corresponding to each filtering component; determining the display threshold based on the display panel size information and the identifier length corresponding to each filtering component; comparing the number of components in the candidate component sequence with the display threshold to obtain the threshold comparison result; and dividing each filtering component in the candidate component sequence according to the threshold comparison result to determine the first component set and the second component set.

[0066] Specifically, first, obtain the component display identifier corresponding to each filter component in the candidate component sequence, and calculate the character length or text display length of each identifier. Combining the available display size information of the display panel, component spacing, and layout rules, calculate and determine the maximum number of components that the current interface can accommodate based on the identifier lengths of all components; this is the display threshold. Compare the total number of components contained in the candidate component sequence with this display threshold to determine if the total number of components exceeds the panel's capacity. Based on the comparison result, divide the candidate component sequence: if the total number of components is not greater than the display threshold, all components are included in the first component set for direct display; if the total number of components is greater than the display threshold, the first corresponding number of components are included in the first component set, and the remaining excess are uniformly included in the second component set, thus completing the division of primary and secondary components and providing a basis for subsequent layered display. The size of the filter component can be determined by the length of the identifier field of the filter component. The identifier field can represent the range of filter data corresponding to the filter component or the number of filter conditions corresponding to the filter component, etc.

[0067] The process involves obtaining the identifier length of the component display identifier corresponding to each filtering component; determining the display threshold based on the display panel size information and the identifier length corresponding to each filtering component; comparing the number of components in the candidate component sequence with the display threshold to obtain the threshold comparison result; and dividing each filtering component in the candidate component sequence according to the threshold comparison result to determine the first component set and the second component set. The first component set and the second component set can be divided according to the dynamic threshold, which improves the accuracy of filtering component division.

[0068] Optionally, the first component set and the second component set are displayed in the display panel according to the corresponding display format, including: obtaining the set quantity and super-item threshold corresponding to the second component set; comparing the set quantity with the super-item threshold to obtain the super-item comparison result; and rendering each filtered component in the first component set and the second component set according to the super-item comparison result, and displaying it in the display panel.

[0069] Specifically, the total number of filter components contained in the second component set (i.e., the set count) is counted, and a preset over-item threshold is read. This set count is then compared to the over-item threshold to obtain the over-item comparison result. If the result shows the set count is less than or equal to the over-item threshold, it indicates fewer components are included, and the filter components in the second component set are displayed on the display panel along with the first component set using the same rendering format. If the result shows the set count is greater than the over-item threshold, it indicates more components are included, and the first component set is rendered normally in the main area. Simultaneously, a "More" collapsible entry control is generated at the end of the panel, and the second component set is rendered uniformly into a collapsible panel or pop-up window, only expanding when triggered by the user. Based on the comparison result, differentiated rendering is performed, displaying all filter components in an orderly manner on the display panel.

[0070] The system obtains the set quantity and super-item threshold corresponding to the second component set; compares the set quantity with the super-item threshold to obtain the super-item comparison result; and renders each filtered component in the first and second component sets according to the super-item comparison result, and displays them in the display panel. Different display methods are executed for different super-item comparison results, which improves the accuracy of component display.

[0071] Optionally, based on the super-item comparison result, each filtered component in the first component set and the second component set is rendered and displayed in the display panel, including: obtaining the tiled display area and the collapsed display area corresponding to the display panel; when the super-item comparison result is that the number of sets is less than the super-item threshold, each filtered component in the first component set is rendered according to the tiled rendering style corresponding to each filtered component and displayed in the tiled display area; when the super-item comparison result is that the number of sets is equal to the super-item threshold, each filtered component in the first component set is rendered according to the tiled rendering style corresponding to each filtered component and displayed in the tiled display area, and the filtered components in the second component set are rendered according to the tiled rendering style corresponding to each filtered component and displayed in the collapsed display area; when the super-item comparison result is that the number of sets is greater than the super-item threshold, each filtered component in the first component set is rendered according to the tiled rendering style corresponding to each filtered component and displayed in the tiled display area, and the filtered components in the second component set are rendered according to the collapsed rendering style corresponding to each filtered component and displayed in the collapsed display area.

[0072] Specifically, the layout area information corresponding to the current display panel is obtained, and the display panel is divided into a tiled display area for directly displaying core components and a collapsed display area for storing and displaying auxiliary components. After completing the area division, based on the previously obtained super-item comparison results, different rendering methods are used to process the first component set and the second component set. When the super-item comparison result is that the number of sets corresponding to the second component set is less than the super-item threshold, each filter component in the first component set is rendered according to its preset tiled rendering style, and the rendered filter components are uniformly displayed in the tiled display area, so that all core filter components can be directly presented to the user. When the super-item comparison result is that the number of sets is equal to the super-item threshold, each filter component in the first component set is still rendered according to its corresponding tiled rendering style and displayed in the tiled display area; at the same time, the filter components in the second component set are rendered according to their corresponding tiled rendering style and displayed in the collapsed display area, realizing the orderly display of primary and secondary areas. The filter components in the second component set can be displayed without manually triggering the collapsed area entry. When the number of items in the set exceeds the threshold, the filter components in the first set are rendered and displayed in the tiled display area using a flat rendering style. The filter components in the second set are rendered using a collapsed rendering style and displayed in the collapsed display area. They are only expanded when the user triggers the collapsed entry, thus achieving an efficient, clean, and hierarchical display effect of filter components within a limited interface space.

[0073] By acquiring the tiled display area and collapsed display area corresponding to the display panel; when the number of sets in the super-item comparison result is less than the super-item threshold, each filter component in the first component set is rendered according to the tiled rendering style corresponding to each filter component and displayed in the tiled display area; when the number of sets in the super-item comparison result is equal to the super-item threshold, each filter component in the first component set is rendered according to the tiled rendering style corresponding to each filter component and displayed in the tiled display area, and the filter components in the second component set are rendered according to the tiled rendering style corresponding to each filter component and displayed in the collapsed display area; when the number of sets in the super-item comparison result is greater than the super-item threshold, each filter component in the first component set is rendered according to the tiled rendering style corresponding to each filter component and displayed in the tiled display area, and the filter components in the second component set are rendered according to the collapsed rendering style corresponding to each filter component and displayed in the collapsed display area. Different rendering formats are used for different types of filter components, which can adapt to different types of display areas.

[0074] Optionally, after displaying the first set of components and the second set of components in the display panel according to the corresponding display format, the method further includes: determining the component display type based on the acquired user input information; when the component display type is a historical display type, updating the content displayed in the display panel according to the historical display components corresponding to the historical time period; when the component display type is a current display type, generating component storage information according to the current display components corresponding to the current time period.

[0075] Specifically, the system obtains the user's input command on the interface, parses and determines the component display type corresponding to the current filter component. If the user's command is a cancel command, indicating that the user needs to clear the filtered components corresponding to the current time, the component display type is determined to be the historical display type. That is, the system reads the component usage records within a preset historical time period, obtains the historical display components corresponding to that time period, and replaces the displayed content in the display panel according to the historical component list to restore the historical display state. If the user's command is a save or confirm command, indicating that the user needs to save the filtered components corresponding to the current time, the system obtains the currently displayed components in the current business scenario based on the current time period. The system structures and encapsulates the identification, status, order, and type information of these components to generate component storage information that can be used for caching, recording, or subsequent retrieval, so as to facilitate rapid loading and reuse later.

[0076] The component display type is determined based on the acquired user input information. When the component display type is the historical display type, the content displayed in the display panel is updated according to the historical display components corresponding to the historical time period. When the component display type is the current display type, component storage information is generated according to the current display components corresponding to the current time period, thereby enhancing the reusability of filtering information.

[0077] Optionally, the filtering component is obtained through the following steps: obtaining interface specification information, which includes at least one function to be executed; generating a function template corresponding to each function to be executed based on the function templates in the interface specification information; determining at least one piece of information to be merged for each function to be executed based on the function templates corresponding to the function to be executed; merging the user input information corresponding to each piece of information to be merged with the function templates to obtain function-driven information; and encapsulating the function-driven information corresponding to each piece of information to be executed to obtain the filtering component.

[0078] Specifically, the process of building the filtering component is initiated to obtain the interface specification information used for the standardized construction of the filtering component. This interface specification information is a predefined unified constraint system, clearly containing at least one function information that the filtering component must implement. This function information covers core business capabilities such as receiving filtering conditions, validating data formats, encapsulating filtering parameters, updating component status, and providing feedback on filtering results. It also clarifies the interface parameter formats, data interaction protocols, return result structures, and exception handling rules for each function, providing a unified standard basis for component construction. For each function information to be executed, its functional purpose (e.g., whether it is used for basic filtering, advanced filtering, or batch filtering), interface constraints (e.g., required parameters, data type restrictions, and transmission rate requirements), and standardized execution process (e.g., request initiation order, data processing steps, and response callback mechanisms) are deeply analyzed. Based on the analysis results, a corresponding standardized function template is generated. This function template is a functional framework with a fixed logical structure, preset execution paths, and a unified interface format. It internally reserves dedicated injection points for information to be merged and user input information, ensuring both the stability of the core logic and the ability to flexibly adapt to different business scenarios. For each pending function information, considering the current business scenario requirements, data source characteristics, and the application scenario of the filtering component, at least one piece of information needs to be integrated with the function template. This information includes, but is not limited to, key variable information such as business configuration parameters, data field mapping relationships, filtering rule thresholds, permission control conditions, and interface display style configurations. After obtaining the user's actual operation data (such as filtering condition values, function activation commands, and personalized configuration parameters) for each piece of pending information through interface interaction, configuration file reading, or backend API calls, the user input information and the corresponding pending information are injected into the reserved position of the function template according to preset mapping rules, data validation rules, and logical binding rules. This completes the deep integration of information and template, forming function-driven information with complete business logic that can directly drive function execution, ensuring that each pending function can run accurately based on actual input and configuration. The function-driven information generated from all pending function information corresponding to the same filtering component is uniformly packaged, integrated, and encapsulated with standardized interfaces. During the encapsulation process, compatibility checks and process optimizations are performed on the internal logic of each function's driving information. The implementation details, data interaction processes, and logical dependencies within the components are hidden, while a unified call entry point, initialization interface, status query interface, and function triggering interface are provided externally. Through this encapsulation process, a standardized filtering component is ultimately formed. This component can flexibly adapt to the calling requirements of different business scenarios and supports independent maintenance and dynamic expansion.For example, establish a unified interface specification, define the IFilterItem standard interface, and agree on the properties and methods that must be implemented. The properties include uiShowData (whether selected, title, number of selected items, etc.); the methods include onShowClick, getSelectedData, buildRequestData, etc. Implement IFilterItem using the BaseFilterItem base class to encapsulate common capabilities. To add a new library filter, simply inherit from BaseFilterItem and override customBuildRequestData to automatically obtain caching, restoration, and UI refresh capabilities.

[0079] The filtered components are obtained through the following steps: First, interface specification information is acquired, including at least one function to be executed. Second, based on the function to be executed information in the interface specification information, a function template corresponding to each function to be executed is generated. Third, for each function to be executed, at least one piece of information to be merged is determined based on the corresponding function template. Fourth, user input information corresponding to each piece of information to be merged is merged with the function template to obtain function-driven information. Fifth, the function-driven information corresponding to each piece of information to be executed is encapsulated to obtain the filtered components, thereby improving component reusability and development efficiency.

[0080] Optionally, after displaying the first component set and the second component set in the display panel according to the corresponding display format, the method further includes: obtaining the filtering information corresponding to each filtering component; concatenating the filtering information corresponding to each filtering component to obtain interface transmission information; updating the interface transmission information according to the interface specification corresponding to the data query interface; transmitting the interface transmission information to the data query interface corresponding to the data query module so that the data query module can query the data to be displayed according to the interface transmission information; and displaying the data to be displayed in the display panel according to the preset rendering style.

[0081] Specifically, the process iterates through all selected filter components, extracting the filter information for each component, including but not limited to core data such as component-associated attribute identifiers, user-selected filter values, data matching intervals, and time range boundaries. Following preset concatenation rules (such as key-value pair mapping), the filter information from each filter component is systematically integrated and concatenated to form the initial interface transmission information. The interface specification corresponding to the data query interface is read, which clarifies the field names, data types (such as strings, numbers, or arrays), format requirements, mandatory field constraints, and transmission protocols (such as HTTP or internal RPC) of the request parameters. Based on this interface specification, the initial interface transmission information is updated accordingly: this includes standardizing and correcting field names, adapting and converting data types, completing missing mandatory fields, and validating the legality and range validity of filter values, ensuring that the interface transmission information fully complies with the interaction requirements of the data query interface. After the update is complete, the standardized interface transmission information is transmitted to the corresponding data query interface of the data query module through a preset communication link. After receiving information transmitted from the API, the data query module parses the filtering conditions and connects to the backend data source (such as a database or data warehouse) to perform precise data retrieval operations, filtering out the target data that meets all conditions, i.e., the data to be displayed. The module then retrieves the data to be displayed returned by the data query module and renders it into visual interface elements according to pre-configured rendering styles (such as list layout, field display order, numerical formatting rules, or pagination parameters), displaying it in the designated data display area of ​​the display panel. For example, all filter items output standard parameters through `buildRequestData`, and multiple items are automatically merged using `Object.assign`. It supports custom field names, array formats, and conversion functions in `OtherData`. For instance, time filtering outputs `{startDate, endDate}`, and status filtering outputs `{status:1}`, which are merged into `{startDate, endDate, status:1}` and directly sent to the API. The data format is unified, the business layer only needs to receive one object, there is no adaptation cost, and data consistency is strong.

[0082] By acquiring the filtering information corresponding to each filtering component; concatenating the filtering information corresponding to each filtering component to obtain the interface transmission information; updating the interface transmission information according to the interface specification corresponding to the data query interface; transmitting the interface transmission information to the data query interface corresponding to the data query module so that the data query module can query the data to be displayed based on the interface transmission information; and displaying the data to be displayed in the display panel according to the preset rendering style, the consistency and accuracy of the filtering information transmission between modules are ensured through unified concatenation and interface specification adaptation, avoiding query failures caused by inconsistent formats.

[0083] Example 3

[0084] Figure 3 This is a schematic diagram of a filtering component display system based on interface specification and threshold coordination, provided in Embodiment 3 of the present invention. This embodiment of the invention is applicable to the display of filtering components based on interface specification and threshold coordination. The system can execute a filtering component display method based on interface specification and threshold coordination, and the system can be implemented in hardware and / or software.

[0085] See Figure 3 The component display system based on interface specifications and threshold coordination, as shown, includes: an information acquisition module 301, a component determination module 302, a status update module 303, a component filtering module 304, and a component display module 305.

[0086] The information acquisition module 301 is used to acquire information about the task to be processed, which includes: at least one subtask information and at least one key filtering attribute corresponding to each subtask information.

[0087] The component determination module 302 is used to determine at least one filtering component for each subtask information based on at least one key filtering attribute corresponding to the subtask information.

[0088] The status update module 303 is used to update the status of the corresponding component for each filtering component, so that the filtering component updates the candidate component sequence;

[0089] The component filtering module 304 is used to filter each component in the candidate component sequence according to the display panel size information and the component size information corresponding to each filtering component, and determine the first component set and the second component set;

[0090] The component display module 305 is used to display the first component set and the second component set in the display panel according to the corresponding display format.

[0091] The technical solution of this invention involves acquiring task information to be processed, including at least one subtask information and at least one key filtering attribute corresponding to each subtask information; for each subtask information, determining at least one filtering component based on the at least one key filtering attribute corresponding to the subtask information; updating the component state corresponding to each filtering component to update the candidate component sequence; filtering each filtering component in the candidate component sequence based on the display panel size information and the component size information corresponding to each filtering component to determine a first component set and a second component set; and displaying the first component set and the second component set on the display panel according to the corresponding display format. By performing different component display steps for different filtering component sets, the accuracy of filtering component display based on interface specifications and threshold collaboration is improved.

[0092] Optionally, the component determination module 302 is specifically used for:

[0093] For each key filtering attribute corresponding to the subtask information, based on the subtask information and the key filtering attributes, at least one associated attribute corresponding to the key filtering attribute and the attribute value corresponding to each associated attribute are identified.

[0094] For each associated attribute, the corresponding filter component is obtained from the candidate components in the component library based on the associated attribute.

[0095] Optionally, the filtering component display system based on interface specifications and threshold coordination is also specifically used for:

[0096] After updating the component status of each filtering component to update the candidate component sequence, for each filtering component in the candidate component sequence, at least one key time period corresponding to the filtering component is determined based on the subtask information.

[0097] The total historical number of times the filtering component is used is calculated based on the historical number of times the filtering component is used in each key time period.

[0098] Based on the total historical count of each filtering component, the filtering components in the candidate component sequence are reordered to obtain the updated candidate component sequence.

[0099] Optional, component filtering module 304, specifically used for:

[0100] Get the label length of the component display label corresponding to each filter component;

[0101] The display threshold is determined based on the display panel size information and the corresponding label length of each filtering component;

[0102] The number of components in the candidate component sequence is compared with the display threshold to obtain the threshold comparison result;

[0103] Based on the threshold comparison results, each screening component in the candidate component sequence is divided to determine the first component set and the second component set.

[0104] Optionally, component display module 305 includes:

[0105] The quantity acquisition unit is used to obtain the set quantity and super-item threshold corresponding to the second component set;

[0106] The threshold comparison unit is used to compare the number of sets with the superitem threshold to obtain the superitem comparison result.

[0107] The component rendering unit is used to render each filtered component in the first component set and the second component set according to the super-item comparison results, and display them in the display panel.

[0108] Optional, component rendering unit, specifically used for:

[0109] Obtain the tiled display area and folded display area corresponding to the display panel;

[0110] When the number of items in the set is less than the threshold, each filter component in the first component set will be rendered according to the tiled rendering style corresponding to each filter component and displayed in the tiled display area.

[0111] When the result of the comparison of the number of super items is equal to the number of super items threshold, each filter component in the first component set is rendered according to the tiling rendering style corresponding to each filter component and displayed in the tiling display area. The filter components in the second component set are rendered according to the tiling rendering style corresponding to the filter components and displayed in the collapsed display area.

[0112] When the number of sets exceeds the threshold for exceeding the number of items, each filter component in the first component set is rendered according to the tiling rendering style corresponding to each filter component and displayed in the tiling display area. The filter components in the second component set are rendered according to the collapsible rendering style corresponding to the filter components and displayed in the collapsible display area.

[0113] Optionally, the filtering component display system based on interface specifications and threshold coordination is also specifically used for:

[0114] The component display type is determined based on the obtained user input information;

[0115] When the component display type is history display type, the content displayed in the display panel is updated according to the historical display components corresponding to the historical time period;

[0116] When the component display type is the current display type, the component storage information is generated based on the current display component corresponding to the current time period.

[0117] Optionally, the filtered components can be obtained through the following steps:

[0118] Obtain interface specification information, which includes at least one function to be executed;

[0119] Based on the information of each function to be executed in the interface specification information, generate the function template corresponding to each function to be executed.

[0120] For each function information to be executed, at least one piece of information to be merged is determined based on the function template corresponding to the function information to be executed.

[0121] The function-driven information is obtained by fusing the user input information corresponding to each piece of information to be fused with the function template.

[0122] The function driver information corresponding to each function to be executed is encapsulated to obtain the filtering component.

[0123] Optionally, the filtering component display system based on interface specifications and threshold coordination is also specifically used for:

[0124] After displaying the first and second component sets in the display panel according to their respective display formats, obtain the filtering information corresponding to each filtering component;

[0125] By concatenating the filtering information corresponding to each filtering component, the interface transmission information is obtained.

[0126] Update the information transmitted through the interface according to the interface specification corresponding to the data query interface;

[0127] The interface transmission information is transmitted to the data query interface corresponding to the data query module, so that the data query module can query the data to be displayed based on the interface transmission information.

[0128] Display the data to be displayed in the display panel according to the preset rendering style.

[0129] The filtering component display device based on interface specification and threshold coordination provided in the embodiments of the present invention can execute the filtering component display method based on interface specification and threshold coordination provided in any embodiment of the present invention, and has the corresponding functional modules and beneficial effects of executing the filtering component display method based on interface specification and threshold coordination.

[0130] Various implementations of the systems and techniques described above herein can be implemented in digital electronic circuit systems, integrated circuit systems, field-programmable gate arrays (FPGAs), application-specific integrated circuits (ASICs), application-specific standard products (ASSPs), systems-on-a-chip (SoCs), complex programmable logic devices (CPLDs), computer hardware, firmware, software, and / or combinations thereof. These various implementations may include: implementations in one or more computer programs that can be executed and / or interpreted on a programmable system including at least one programmable processor, which may be a dedicated or general-purpose programmable processor, capable of receiving data and instructions from a storage system, at least one input device, and at least one output device, and transmitting data and instructions to the storage system, the at least one input device, and the at least one output device.

[0131] Computer programs used to implement the methods of the present invention may be written in any combination of one or more programming languages. These computer programs may be provided to a processor of a general-purpose computer, a special-purpose computer, or other programmable data processing device, such that when executed by the processor, the computer programs cause the functions / operations specified in the flowcharts and / or block diagrams to be performed. The computer programs may be executed entirely on a machine, partially on a machine, or as a standalone software package, partially on a machine and partially on a remote machine, or entirely on a remote machine or server.

[0132] The systems and technologies described herein can be implemented in computing systems that include backend components (e.g., as data servers), or middleware components (e.g., application servers), or frontend components (e.g., user computers with graphical user interfaces or web browsers through which users can interact with implementations of the systems and technologies described herein), or any combination of such backend, middleware, or frontend components. The components of the system can be interconnected via digital data communication of any form or medium (e.g., communication networks). Examples of communication networks include local area networks (LANs), wide area networks (WANs), blockchain networks, and the Internet.

[0133] A computing system can include clients and servers. Clients and servers are generally geographically separated and typically interact via communication networks. The client-server relationship is created by computer programs running on the respective computers and having a client-server relationship with each other. The server can be a cloud server, also known as a cloud computing server or cloud host, which is a hosting product within the cloud computing service system. It addresses the shortcomings of traditional physical hosts and VPS (Virtual Private Server) services, such as high management difficulty and weak business scalability.

[0134] It should be understood that the various forms of processes shown above can be used, with steps reordered, added, or deleted. For example, the steps described in this invention can be executed in parallel, sequentially, or in different orders, as long as the desired result of the technical solution of this invention can be achieved, and no limitation is imposed herein.

[0135] The specific embodiments described above do not constitute a limitation on the scope of protection of this invention. Those skilled in the art should understand that various modifications, combinations, sub-combinations, and substitutions can be made according to design requirements and other factors. Any modifications, equivalent substitutions, and improvements made within the spirit and principles of this invention should be included within the scope of protection of this invention.

Claims

1. A method for displaying filtering components based on interface specifications and threshold coordination, characterized in that, The method includes: Obtain information on tasks to be processed, which includes: at least one subtask information and at least one key filtering attribute corresponding to each subtask information; For each of the subtask information, at least one filtering component is determined based on at least one key filtering attribute corresponding to the subtask information; For each of the filtering components, the component state corresponding to the filtering component is updated so that the filtering component updates the candidate component sequence; Based on the display panel size information and the component size information corresponding to each of the filtering components, each filtering component in the candidate component sequence is filtered to determine the first component set and the second component set. The first component set and the second component set are displayed in the display panel according to their respective display formats.

2. The method according to claim 1, characterized in that, The step of determining at least one filtering component based on at least one key filtering attribute corresponding to the subtask information includes: For each key filtering attribute corresponding to the subtask information, at least one associated attribute corresponding to the key filtering attribute and the attribute value corresponding to each associated attribute are identified based on the subtask information and the key filtering attribute. For each of the aforementioned associated attributes, the corresponding filter component is obtained from each candidate component in the component library based on the associated attributes.

3. The method according to claim 1, characterized in that, After updating the component state corresponding to each of the filtering components to update the candidate component sequence for each filtering component, the method further includes: For each filtering component in the candidate component sequence, at least one key time period corresponding to the filtering component is determined based on the subtask information; The total historical number of times the filtering component is used is calculated based on the historical number of times the filtering component is used in each of the key time periods. Based on the total historical count of each filtering component, the filtering components in the candidate component sequence are reordered to obtain the updated candidate component sequence.

4. The method according to claim 1, characterized in that, The step of filtering each component in the candidate component sequence according to the display panel size information and the component size information corresponding to each of the filtering components to determine the first component set and the second component set includes: Obtain the identifier length of the component display identifier corresponding to each of the filtering components; The display threshold is determined based on the display panel size information and the corresponding identifier length of each filtering component; The number of components in the candidate component sequence is compared with the display threshold to obtain the threshold comparison result; Based on the threshold comparison results, each screening component in the candidate component sequence is divided to determine the first component set and the second component set.

5. The method according to claim 1, characterized in that, The step of displaying the first component set and the second component set in the display panel according to the corresponding display format includes: Get the number of sets and the super-item threshold corresponding to the second component set; The number of sets is compared with the super-item threshold to obtain the super-item comparison result; Based on the super-item comparison results, each filtered component in the first component set and the second component set is rendered and displayed in the display panel.

6. The method according to claim 5, characterized in that, The step of rendering and displaying each filtered component in the first component set and the second component set based on the super-item comparison results in the display panel includes: Obtain the tiled display area and the folded display area corresponding to the display panel; When the result of the comparison of super items is that the number of sets is less than the super item threshold, each filter component in the first component set is rendered according to the tiling rendering style corresponding to each filter component and displayed in the tiling display area. When the result of the super-item comparison is that the number of sets is equal to the super-item threshold, each filter component in the first component set is rendered according to the tiling rendering style corresponding to each filter component and displayed in the tiling display area; the filter components in the second component set are rendered according to the tiling rendering style corresponding to the filter components and displayed in the collapsed display area. When the number of super-items in the comparison result is greater than the super-item threshold, each filter component in the first component set is rendered according to the tiling rendering style corresponding to each filter component and displayed in the tiling display area. The filter components in the second component set are rendered according to the collapsible rendering style corresponding to the filter components and displayed in the collapsible display area.

7. The method according to claim 1, characterized in that, After displaying the first component set and the second component set in the display panel according to their respective display formats, the method further includes: The component display type is determined based on the obtained user input information; When the component display type is historical display type, the content displayed in the display panel is updated according to the historical display component corresponding to the historical time period; When the component display type is the current display type, component storage information is generated based on the current display component corresponding to the current time period.

8. The method according to claim 1, characterized in that, The filtering component is obtained through the following steps: Obtain interface specification information, which includes at least one function to be executed; Based on the pending function information in the interface specification information, generate a function template corresponding to each pending function information; For each of the functions to be executed, at least one piece of information to be merged is determined based on the function template corresponding to the function to be executed. The function-driven information is obtained by fusing the user input information corresponding to each of the acquired information to be fused with the function template. The function driver information corresponding to each of the functions to be executed is encapsulated to obtain the filtering component.

9. The method according to claim 1, characterized in that, After displaying the first component set and the second component set in the display panel according to their respective display formats, the method further includes: Retrieve the filtering information corresponding to each filtering component; By concatenating the filtering information corresponding to each filtering component, the interface transmission information is obtained. Update the information transmitted through the interface according to the interface specification corresponding to the data query interface; The interface transmission information is transmitted to the data query interface corresponding to the data query module, so that the data query module can query the data to be displayed based on the interface transmission information. The data to be displayed is displayed in the display panel according to a preset rendering style.

10. A filtering component display system based on interface specifications and threshold coordination, characterized in that, The system includes: The information acquisition module is used to acquire information about tasks to be processed, which includes: at least one subtask information and at least one key filtering attribute corresponding to each subtask information. The component determination module is used to determine at least one filtering component for each of the subtask information based on at least one key filtering attribute corresponding to the subtask information. The status update module is used to update the component status corresponding to each of the filtering components, so that the filtering component updates the candidate component sequence; The component filtering module is used to filter each component in the candidate component sequence according to the display panel size information and the component size information corresponding to each of the filtering components, and determine the first component set and the second component set; The component display module is used to display the first component set and the second component set in the display panel according to the corresponding display format.