Method and system for generating multi-terminal table data display page

Abstract

The invention relates to the technical field of front-end development, in particular to a method and a system for generating a multi-end table data display page. Comprising a table definition module, a table rendering module, a data processing module, a function extension module and a state management module, the table definition module is used for finely defining the structure and behavior of a table, the table rendering module is used for converting the configured table definition into a multi-terminal adaptive visual interface and optimizing rendering performance and interactive experience, and the data processing module is used for efficiently processing table data and carrying out format conversion, cache management and paging loading. The function expansion module provides flexible function expansion capability and meets interaction requirements of complex business scenes, the state management module uniformly manages interaction states of tables and ensures consistency and persistence of multi-terminal operation, and by means of the mode, the problems that table components are limited in function, insufficient in performance and poor in expansibility are solved, and the user experience is improved. Therefore, the table component has good multi-terminal adaptation capability and can meet complex business requirements.

Description

TECHNICAL FIELD

[0001] The present application relates to the technical field of front-end development, and in particular to a multi-terminal table data display page generation method and system. BACKGROUND

[0002] With the rapid development of Internet technology, Web applications have become an important tool for enterprise informatization and digital transformation. In these applications, data tables as a key component for displaying, analyzing and operating data, are an important part of Web application development, and their performance directly affects user experience and system efficiency. With the rapid growth of business data, the amount of data that tables need to display is increasingly large.

[0003] However, as business requirements become increasingly complex and diverse, existing table component libraries gradually expose limitations in functionality, performance and scalability, and table components have limited functionality, making it difficult to meet complex business requirements. SUMMARY

[0004] The purpose of the present application is to provide a multi-terminal table data display page generation method and system, which aims to solve the technical problems of existing table component libraries gradually exposing limitations in functionality, performance and scalability, and table components having limited functionality, making it difficult to meet complex business requirements.

[0005] To achieve the above-mentioned purpose, a multi-terminal table data display page generation system is used, which includes a table definition module, a table rendering module, a data processing module, a function extension module and a state management module; wherein:

[0006] The table definition module is used to define the structure and behavior of the table in detail;

[0007] The table rendering module is used to convert the configured table definition into a multi-terminal adaptive visual interface, optimizing rendering performance and interactive experience;

[0008] The data processing module is used to efficiently process table data, including format conversion, cache management and page loading;

[0009] The function extension module is used to provide flexible function extension capabilities to meet the interactive needs of complex business scenarios;

[0010] The state management module is used to manage the interactive state of the table uniformly to ensure consistency and persistence of multi-terminal operations.

[0011] The table definition module includes a column definition mechanism unit, a row operation definition unit and a table attribute definition unit; wherein:

[0012] The column definition mechanism unit is used to define the attributes and behaviors of table columns, including but not limited to column title, field name, width, alignment, rendering function, conditional style, sorting and filtering attributes;

[0013] The row operation definition unit is used to define row-level operation buttons, including editing, deleting and viewing, supporting button grouping, conditional display and permission control;

[0014] The table attribute definition unit is used to define the global attributes of the table, including the basic attributes, functional attributes, event attributes and performance optimization attributes of the table.

[0015] The table rendering module includes a virtual scrolling mechanism unit, an adaptive layout unit and a theming rendering unit; wherein:

[0016] The virtual scrolling mechanism unit is used for efficient rendering of large data tables, rendering data rows in the current visible area, dynamically updating visible content as the user scrolls, and supporting dynamic row height;

[0017] The adaptive layout unit is used to automatically adjust column width and table height;

[0018] The theming rendering unit is used to provide multiple predefined themes, support custom theme variables and dynamic switching, and allow local style override to meet individual needs.

[0019] The data processing module includes a data conversion mechanism unit, a local data cache unit and a pagination loading mechanism unit; wherein:

[0020] The data conversion mechanism unit is used to process nested fields, data formatting, data validation and error handling, and supports data conversion pipeline;

[0021] The local data cache unit is used to cache loaded data, reduce repeated requests, support data update, invalidation mechanism and sharding storage optimization memory usage;

[0022] The pagination loading mechanism unit is used for data pagination loading, which makes the server and client page, supports infinite scrolling, preloading and dynamic adjustment of page size.

[0023] The advanced filter unit is used for complex conditional filtering, providing a variety of operators such as and, or, greater than, less than, equal to and contains;

[0024] The column setting panel unit is used to customize the display columns and column order, supporting drag-and-drop sorting, column width setting and user configuration saving;

[0025] The import and export function unit is used to import and export table data.

[0026] The state management module comprises a selected state management unit, a sorting state management unit and an expanded state management unit.

[0027] The selected state management unit is used for managing row selection and column selection states, and supports single selection, multiple selection, full selection, inverse selection and conditional selection.

[0028] The sorting state management unit is used for managing column sorting states, and supports single column and multiple column sorting, ascending / descending switching, custom sorting function and sorting state persistence.

[0029] The expanded state management unit is used for managing row expanded states, and supports expansion, folding and state persistence.

[0030] The application further provides a multi-terminal table data display page generation method, comprising the following steps:

[0031] Defining the structure and behavior of the table;

[0032] Converting the configured table definition into a multi-terminal adaptive visual interface, optimizing rendering performance and interactive experience;

[0033] Processing table data, performing format conversion, cache management and page loading;

[0034] Providing flexible function extension capability to meet the interactive needs of complex business scenarios;

[0035] Ensuring the consistency and persistence of multi-terminal operations by uniformly managing the interactive states of the table.

[0036] The multi-terminal table data display page generation method and system of the application define the structure and behavior of the table in detail through the table definition module; the table rendering module converts the configured table definition into a multi-terminal adaptive visual interface, optimizes rendering performance and interactive experience; the data processing module efficiently processes table data, performs format conversion, cache management and page loading; the function extension module provides flexible function extension capability to meet the interactive needs of complex business scenarios; and the state management module uniformly manages the interactive states of the table, ensuring the consistency and persistence of multi-terminal operations. In the above manner, the problems of limited function, insufficient performance and poor expansibility of the table component are solved, the table component has good multi-terminal adaptation capability and can meet complex business needs. BRIEF DESCRIPTION OF DRAWINGS

[0037] In order to more clearly illustrate the technical solutions in the embodiments of the present application or the prior art, the following will briefly introduce the drawings needed in the embodiments or prior art description. Obviously, the drawings in the following description only represent some of the embodiments of the present application, and for those skilled in the art, other drawings can also be obtained without creative labor.

[0038] Figure 1 is the principle diagram of the generation system of the multi-terminal table data display page of the present application.

[0039] Figure 2 is the overall architecture diagram of the generation system of the multi-terminal table data display page of the present application.

[0040] Figure 3 is the structure principle diagram of the table definition module of the present application.

[0041] Figure 4 is the flowchart of the table rendering module of the present application.

[0042] Figure 5 is the schematic diagram of the data processing module of the present application.

[0043] Figure 6 is the flowchart of the state management module of the present application.

[0044] Figure 7 is the step flowchart of the generation method of the multi-terminal table data display page of the present application.

[0045] 10-table definition module, 20-table rendering module, 30-data processing module, 40-function extension module, 50-state management module, 11-column definition mechanism unit, 12-row operation definition unit, 13-table attribute definition unit, 21-virtual scrolling mechanism unit, 22-adaptive layout unit, 23-theming rendering unit, 31-data conversion mechanism unit, 32-local data cache unit, 33-paging loading mechanism unit, 41-advanced filter unit, 42-column setting panel unit, 43-import and export function unit, 51-selected state management unit, 52-sorting state management unit, 53-expansion state management unit. DETAILED DESCRIPTION

[0046] The exemplary embodiments will be described in detail herein with reference to the drawings. Unless otherwise specified, the same or similar components are denoted by the same reference numerals throughout the different drawings. The embodiments described in the following exemplary embodiments do not represent all the embodiments consistent with the present application.

[0047] The terminology used in this application is for the purpose of describing particular embodiments only and is not intended to be limiting. As used in this application and the appended claims, the singular forms "a," "an" and "the" are intended to include the plural forms as well, unless the context clearly indicates otherwise. It will also be understood that the term "and / or," as used herein, refers to and encompasses any and all possible combinations of one or more of the associated listed items.

[0048] It will be understood that, although the terms first, second, third, etc. can be used herein to describe various information, the information should not be limited to these terms. These terms are used only to distinguish one piece of information from another. For example, a first information could be termed a second information, and, similarly, a second information could be termed a first information without departing from the scope of this application. As used herein, the word "if" can be construed to mean "when" or "upon" or "in response to determining" depending on the context.

[0049] Referring now to the drawings Figures 1-6 The present application provides a multi-terminal table data display page generation system, comprising a table definition module 10, a table rendering module 20, a data processing module 30, a function extension module 40 and a state management module 50; wherein:

[0050] The table definition module 10 is used to define the structure and behavior of the table in detail;

[0051] The table rendering module 20 is used to convert the configured table definition into a multi-terminal adaptive visual interface, optimizing rendering performance and interactive experience;

[0052] The data processing module 30 is used to efficiently process table data, perform format conversion, cache management and page loading;

[0053] The function extension module 40 is used to provide flexible function extension capability to meet the interactive needs of complex business scenarios;

[0054] The state management module 50 is used to uniformly manage the interactive state of the table to ensure the consistency and persistence of multi-terminal operations.

[0055] In the embodiment, the table definition module 10 defines the structure and behavior of the table in detail; the table rendering module 20 converts the configured table definition into a multi-terminal adaptive visual interface, optimizes the rendering performance and the interactive experience; the data processing module 30 efficiently processes the table data, performs format conversion, cache management and page loading; the function extension module 40 provides flexible function extension capability to meet the interactive needs of complex business scenarios; the state management module 50 uniformly manages the interactive state of the table to ensure the consistency and persistence of multi-terminal operation. In the above manner, the problems of limited function, insufficient performance and poor expansibility of the table component are solved, the table component has good multi-terminal adaptation capability, and can meet complex business needs.

[0056] Further, the table definition module 10 includes a column definition mechanism unit 11, a row operation definition unit 12 and a table attribute definition unit 13; wherein:

[0057] The column definition mechanism unit 11 is configured to define the attributes and behaviors of the table columns, including but not limited to column title, field name, width, alignment, rendering function, conditional style, sorting and filtering attributes;

[0058] The row operation definition unit 12 is configured to define the operation buttons at the row level, including editing, deleting and viewing, supporting button grouping, conditional display and permission control;

[0059] The table attribute definition unit 13 is configured to define the global attributes of the table, including the basic attributes, function attributes, event attributes and performance optimization attributes of the table.

[0060] In this embodiment, a fully programmable table metadata management system is constructed through the hierarchical configuration architecture of the column definition mechanism unit 11, the row operation definition unit 12, and the table attribute definition unit 13. This systematically solves the problems of fragmented configuration and high maintenance costs of traditional table components in complex business scenarios. The column definition mechanism unit 11 adopts JSONSchema-driven declarative configuration, supports atomic definition of column-level attributes (such as {title: "Amount", field: "amount", width: 120, align: "right", render: (val) => $${val.toFixed(2)}, style: {color: val>1000? 'red': 'black'}, sortable: true, filterable: {type: 'number', range: true}}). Through combined rendering functions (supporting JSX / VueTemplate / ReactComponent) and conditional style hooks (such as dynamically switching font bolding based on data values), pixel-level restoration of scenarios such as financial reports and data dashboards is achieved. The row operation definition unit 12 provides buttons. The system offers DSL configuration capabilities, supporting customization of operation button icons / text / colors (e.g., {icon: 'edit', text: 'modify', type: 'primary', show: (row) => row.status => 'draft'}), grouped layouts (e.g., placing frequently used operations in the top toolbar), and RBAC permission integration (controlling button visibility via permission: ['user: edit']). Combined with operation log tracking (automatically recording operator, time, and data snapshots), it meets audit compliance requirements. The table attribute definition unit 13 uniformly manages the table's global behavior parameters, including basic attributes (e.g., height: 600px, bordered: true), function switches (e.g., virtualScroll: true, showSummary: false), event listeners (e.g., onRowClick: (row) => console.log(row)), and performance optimization configurations (e.g., cacheSize: 1000, debounceInterval: 300). It also implements multi-environment differentiated configurations through environment variable injection (e.g., enabling the debug panel in the development environment and disabling it in the production environment).

[0061] Furthermore, the table rendering module 20 includes a virtual scrolling mechanism unit 21, an adaptive layout unit 22, and a themed rendering unit 23; wherein:

[0062] The virtual scrolling mechanism unit 21 is used for efficient rendering of large data tables, rendering data rows in the current visible area, dynamically updating visible content as the user scrolls, and supporting dynamic row height;

[0063] The adaptive layout unit 22 is used for automatically adjusting column width and table height;

[0064] The theming rendering unit 23 is used for providing multiple predefined themes, supporting custom theme variables and dynamic switching, and allowing local style override to meet individual needs.

[0065] In the embodiment, through the cooperative design of the virtual scrolling mechanism unit 21, the adaptive layout unit 22, and the theming rendering unit 23, the efficiency bottleneck and multi-end adaptation problem of table rendering in a large data scenario are systematically solved. The virtual scrolling mechanism unit 21 adopts a dynamic rendering strategy based on viewport calculation, loads only the data rows in the current visible area (such as rendering only 20 rows of visible content in 1000 rows of data), and combines row height caching and scroll offset prediction algorithms to update the DOM in milliseconds when the user scrolls, support precise rendering in dynamic row height scenarios (such as content containing pictures or multiple lines of text), reduce the memory occupancy of a million-level data table by 90%, and improve the rendering performance by more than 10 times. The adaptive layout unit 22 has an intelligent column width allocation algorithm that can automatically adjust the column width according to the container size, column content length, and priority weight (such as ensuring the minimum width of key columns), while supporting the dynamic stretching of table height with the parent container. Perfect adaptation without overflow or blank can be achieved on both PC (1920px) and mobile (375px) ends. The theming rendering unit 23 provides five predefined themes such as dark, light, and highlight. CSS variables are used to centrally manage style parameters such as color, font, and spacing. Developers can quickly customize themes by modifying variable values (such as --primary-color: #42b983), and local style override is allowed for specific cells or rows (such as highlighting abnormal data rows). The dynamic theme switching function (without page refresh) is also supported.

[0066] Further, the data processing module 30 includes a data conversion mechanism unit 31, a local data caching unit 32, and a paging loading mechanism unit 33; wherein:

[0067] The data conversion mechanism unit 31 is used for processing nested fields, data formatting, data verification, and error handling, and supports a data conversion pipeline;

[0068] The local data caching unit 32 is used for caching loaded data, reducing repeated requests, supporting data updating, invalidation mechanisms, and sharding storage optimization memory usage;

[0069] The page loading mechanism unit 33 is used for page loading of data, and makes the server and the client page, supports infinite scrolling, preloading, and dynamic adjustment of page size.

[0070] In the embodiment, through the deep cooperation of the data conversion mechanism unit 31, the local data cache unit 32, and the page loading mechanism unit 33, an efficient, stable, and scalable data processing middle platform is constructed, and the data processing bottleneck of the table component in the big data scene is systematically solved: the data conversion mechanism unit 31 adopts a pipeline architecture design, supports nested field parsing (such as user.address.city), dynamic formatting (date / currency / number localization), and asynchronous data verification (such as regular check, API linkage check), and developers can realize chain call of complex data processing logic through configuration of a conversion chain (such as [parseNested, formatDate, validateRange]), and an error processing module can automatically capture exceptions and return a friendly prompt (such as converting NaN to "-"), so as to ensure the standardization and safety of data before rendering; the local data cache unit 32 realizes intelligent cache management based on the LRU algorithm, supports storage according to data identifiers (such as ID), automatically eliminates cold data when the memory occupation exceeds a threshold, and simultaneously provides a fine-grained update mechanism (full replacement / incremental merging) and an invalidation strategy (TTL expiration / manual cleaning), so that the table does not need to repeatedly request data when frequently interacting (such as sorting and filtering), and the memory occupation is optimized by 70% and the operation response delay is reduced to less than 50 ms in the scene of 100,000 rows of data, in cooperation with the multi-threaded processing of the Web Worker; the page loading mechanism unit 33 provides dual-mode support of server-side paging (dynamically passing the page number / page length through API parameters) and client-side paging (local data slicing), integrates infinite scrolling (automatically loading the next page when scrolling to the bottom) and preloading (preloading the N+2th page) strategies, the page size can be dynamically adjusted based on device performance (such as 20 rows for mobile terminals and 50 rows for PC terminals) or user preferences, and in cooperation with the virtual scrolling mechanism, the “loading while rendering” non-perception experience is realized, and smooth interaction can still be maintained in a weak network environment.

[0071] Further, the function expansion module 40 includes an advanced filter unit 41, a column setting panel unit 42, and an import and export function unit 43; wherein:

[0072] The advanced filter unit 41 is used for complex conditional filtering, and provides multiple operators such as and, or, greater than, less than, equal to, and containing.

[0073] The column setting panel unit 42 is used for customizing display columns and column order, supports drag-and-drop sorting, column width setting, and user configuration saving.

[0074] The import and export function unit 43 is used for importing and exporting table data.

[0075] In the embodiment, through the integrated design of the advanced filter unit 41, the column setting panel unit 42 and the import and export function unit 43, an interactive enhancement system covering all scenarios is constructed, and the flexibility and ease of use of the table component in a complex business scenario are systematically solved: the advanced filter unit 41 adopts a visual condition builder, supports multi-field combined filtering (such as (age>30 OR department="technical") AND hire date<2020-01-01), provides 12 kinds of operators such as logical operators (AND / OR / NOT), comparison operators (> / < / = / !=), fuzzy matching (contains / starts with / ends with), and supports dynamic parameter binding (such as filtering the data of the department where the current user is located), combined with filtering history and shortcut operation (Ctrl+F quickly calls), which makes the efficiency of complex data query improved by 80%; the column setting panel unit 42 provides a WYSIWYG column management interface, users can adjust the column order by dragging, set the column width by sliding bar (supporting pixel / percentage dual mode), check the control column display / hide, and configure the results to be stored persistently to the local (LocalStorage) or server (synchronized through API), combined with batch operation (select all / deselect all / reset) and responsive layout adaptation (mobile devices automatically hide non-key columns), which can still maintain efficient operation experience in a complex table with 10+ columns; the import and export function unit 43 supports bidirectional conversion of 5 kinds of mainstream formats such as CSV / Excel / JSON, provides field mapping (automatic matching of table headers or manual drag alignment), data verification (mandatory / format / unicity check) and error positioning (highlighting invalid rows) during import, and supports custom templates (such as adding watermarks / adjusting column width), paging control (maximum number of rows in a single file) and compression options (ZIP packaging) during export, combined with WebWorker multi-threading processing, which optimizes the time consumption from minutes to seconds in the scenario of importing and exporting 100,000 rows of data.

[0076] Further, the state management module 50 includes a selected state management unit 51, a sorting state management unit 52 and an expanded state management unit 53; wherein:

[0077] The selected state management unit 51 is used for managing row selection and column selection states, supporting single selection, multiple selection, full selection, inverse selection and conditional selection;

[0078] The sorting state management unit 52 is used for managing column sorting states, supporting single column and multi-column sorting, ascending / descending switching, custom sorting functions and sorting state persistence;

[0079] The expanded state management unit 53 is used for managing row expansion states, supporting expansion, folding and state persistence.

[0080] In the present embodiment, through the cooperative design of the selected state management unit 51, the sorting state management unit 52 and the expanded state management unit 53, a full-dimensional interactive state management system is constructed, and the state synchronization and persistence problem of a large data table in a complex business scenario is systematically solved: the selected state management unit 51 adopts an event-driven architecture, supports a composite selection mode of row level (single selection / multiple selection / total selection / inverse selection) and column level (cell selection), provides a conditional selector (such as selecting a row with an amount greater than 1000) and a shortcut operation (Shift+click range selection), optimizes performance through a debounce mechanism and a batch update strategy, reduces memory occupation by 60% in a ten-thousand-level data selection scenario, and supports the persistence of the selected state to URL parameters or local storage, realizing cross-page / cross-device state synchronization; the sorting state management unit 52 realizes multi-column priority sorting (such as sorting by department in ascending order first and then by salary in descending order), supports a custom sorting function (such as customizing comparison logic for complex types such as dates and arrays), provides sorting state visualization (↑↓ arrow + number sequence) and interactive feedback (hovering to prompt the current sorting rule), realizes sorting history backtracking through a state snapshot mechanism, and cooperates with the WebStorageAPI to persist the sorting configuration to the browser, so that the user can automatically restore the last sorting state after refreshing the page; the expanded state management unit 53 provides single-row expansion / collapsing, batch operation (expanding all / collapsing all) and conditional expansion (such as expanding only rows with child nodes) functions for tree table or detail expansion scenarios, optimizes rendering performance through a virtual DOM (only rendering the content area of the expanded row), supports expansion state persistence (recording the unique identifier of the expanded row), and still maintains a smooth interactive experience in multi-layer nested data (such as an organizational structure table).

[0081] Please refer to Figure 7 The present application also provides a method for generating a multi-terminal table data display page, comprising the following steps:

[0082] S100: defining the structure and behavior of the table;

[0083] S200: converting the configured table definition into a multi-terminal adapted visual interface, optimizing rendering performance and interactive experience;

[0084] S300: processing table data, performing format conversion, cache management and page loading;

[0085] S400: providing flexible function extension capability to meet the interactive needs of complex business scenarios;

[0086] S500: managing the interactive state of the table uniformly to ensure the consistency and persistence of multi-terminal operations.

[0087] In the embodiment, the structure and behavior of the table are defined; the configured table definition is converted into a multi-terminal adaptive visual interface, the rendering performance and interactive experience are optimized; the table data is processed, the format conversion, cache management and page loading are performed; flexible function extension capability is provided to meet the interactive needs of complex business scenarios; the interactive state of the table is uniformly managed to ensure the consistency and persistence of multi-terminal operation. Through the above process, the problems of limited function, insufficient performance and poor scalability of the table component are solved, the table component has good multi-terminal adaptation capability, and can meet the complex business needs.

[0088] Other embodiments of the application will be apparent to those skilled in the art from consideration of the specification and practice of the application disclosed herein. It is intended that the application embrace any and all variations of the application that fall within the scope of the general description herein. Various modifications and changes can be made as would be obvious to a person skilled in the art having the benefit of this disclosure. It is intended that the application embrace all such modifications and changes and, accordingly, the application is not to be limited by the foregoing description.

[0089] It is to be understood that the application is not limited to the precise construction described and as shown in the accompanying drawings, and that various modifications and changes can be effected thereon without departing from the scope of the application.

Claims

1. A system for generating a multi-end table data presentation page, characterized in that, The system comprises a table definition module, a table rendering module, a data processing module, a function extension module, and a state management module. The table definition module is used to define the structure and behavior of the table in detail. The table rendering module is used to convert the configured table definition into a multi-end adaptive visual interface, optimize rendering performance and interactive experience. The data processing module is used to efficiently process table data, perform format conversion, cache management, and page loading. The function extension module is used to provide flexible function extension capabilities to meet the interactive needs of complex business scenarios. The state management module is used to uniformly manage the interactive state of the table to ensure consistency and persistence of multi-end operations.

2. The system for generating a multi-end table data display page according to claim 1, wherein the table definition module comprises a column definition mechanism unit, a row operation definition unit, and a table attribute definition unit. The column definition mechanism unit is used to define the attributes and behaviors of table columns, including but not limited to column title, field name, width, alignment, rendering function, conditional style, sorting, and filtering attributes. The row operation definition unit is used to define row-level operation buttons, including editing, deleting, and viewing, supporting button grouping, conditional display, and permission control. The table attribute definition unit is used to define global attributes of the table, including basic attributes, function attributes, event attributes, and performance optimization attributes of the table.

3. The system for generating a multi-end table data display page according to claim 1, wherein the table rendering module comprises a virtual scrolling mechanism unit, an adaptive layout unit, and a theming rendering unit. The virtual scrolling mechanism unit is used for efficient rendering of large data tables, rendering data rows in the current visible area, dynamically updating visible content as the user scrolls, and supporting dynamic row heights. The adaptive layout unit is used to automatically adjust column widths and table heights. The theming rendering unit provides multiple predefined themes, supports custom theme variables and dynamic switching, and allows local style overrides to meet individual needs.

4. The system for generating a multi-end table data display page according to claim 1, wherein the data processing module comprises a data conversion mechanism unit, a local data cache unit, and a page loading mechanism unit. The data conversion mechanism unit is used to handle nested fields, data formatting, data validation, and error handling, and supports data conversion pipelines. The local data cache unit is used to cache loaded data, reduce repeated requests, support data updates, invalidation mechanisms, and sharding storage optimization memory usage. The page loading mechanism unit is used for page loading of data, enabling server and client-side paging, supporting infinite scrolling, preloading, and dynamic adjustment of page size.

5. The system for generating a multi-end table data display page according to claim 1, wherein the function extension module comprises an advanced filter unit, a column settings panel unit, and an import and export function unit. The advanced filter unit is used for complex conditional filtering, providing multiple operators such as and, or, greater than, less than, equal to, and contains. ​ ​ ​ ​ The column setting panel unit is used for customizing display columns and column order, supporting drag-and-drop sorting, column width setting and user configuration saving; The import and export function unit is used for importing and exporting table data.

6. The multi-terminal table data display page generation system of claim 1, wherein, The state management module includes a selected state management unit, a sorting state management unit and an expanded state management unit; wherein: The selected state management unit is used for managing row selection and column selection states, supporting single selection, multiple selection, full selection, inverse selection and conditional selection; The sorting state management unit is used for managing column sorting states, supporting single column and multiple column sorting, ascending and descending switching, custom sorting function and sorting state persistence; The expanded state management unit is used for managing row expansion states, supporting expansion, folding and state persistence.

7. The method for generating a multi-terminal table data display page, applied to the multi-terminal table data display page generation system of claim 1, characterized in that, The method comprises the following steps: Defining the structure and behavior of the table; Converting the configured table definition into a multi-terminal adapted visual interface, optimizing rendering performance and interactive experience; Processing table data, performing format conversion, cache management and page loading; Providing flexible function extension capability to meet the interactive needs of complex business scenarios; Through unified management of the interactive state of the table, the consistency and persistence of multi-terminal operation are ensured.

Images