Method and system for generating dynamic table supporting calculation based on JSON configuration

Abstract

The invention discloses a method and a system for generating a dynamic table supporting calculation based on JSON configuration. The method comprises the following steps: acquiring an input parameter set of a user; performing existence verification on the input parameter set to obtain a verification parameter set; dynamic column configuration is defined according to the verification parameter set, table data are matched according to the dynamic column configuration, the dynamic column configuration and a JSON configuration file of the table data are obtained, and the dynamic column configuration is structural configuration of a data table; respectively analyzing the dynamic column configuration and a JSON configuration file of the table data, and generating a plurality of dynamic components based on a tool function; and rendering and mounting the plurality of dynamic components, and performing visual display to obtain a dynamic table. Compared with the prior art, through dynamic configuration driving and an automatic process, the maintenance cost of table generation is remarkably reduced, the service adaptation flexibility is improved, and therefore the interactive dynamic table meeting the multi-scene requirement is efficiently generated.

Description

Technical Field

[0001] This invention relates to the field of computer software technology, and more specifically, to a method and system for generating dynamic tables that support computation based on JSON configuration. Background Technology

[0002] As enterprises deepen their digital transformation, data management scenarios place higher demands on the flexibility and adaptability of spreadsheet tools. Most enterprises need to dynamically adjust the column structure of spreadsheets based on query conditions, business versions, user roles, etc. Traditional static spreadsheets can no longer meet the differentiated display needs of multiple scenarios. As the core tool to adapt to this need, dynamic spreadsheets need to be able to respond to business changes without front-end hard coding. Their configuration parsing efficiency, business linkage depth, and functional integration have become key to improving the efficiency of data processing for enterprises.

[0003] While some existing technologies attempt to optimize the rigidity of static tables through low-code configuration and fixed backend templates, they still cannot achieve dynamic adaptation of column structures and refined functional support in complex scenarios such as multi-business version switching, differentiated editing needs, and high-frequency operation integration. This results in insufficient flexibility, fragmented functions, and low efficiency in business adaptation of dynamic tables.

[0004] Therefore, how to provide a dynamic table generation system that can dynamically adapt the column structure according to business parameters and integrate high-frequency business operations to support calculations has become a technical problem that urgently needs to be solved by those skilled in the art. Summary of the Invention

[0005] To address the aforementioned technical problems, this invention provides a method for generating dynamic tables that support computation based on JSON configuration. Through dynamic configuration-driven and automated processes, it significantly reduces the maintenance cost of table generation and improves business adaptability flexibility, thereby efficiently generating interactive dynamic tables that meet the needs of multiple scenarios. Furthermore, this invention also provides a system for generating dynamic tables that support computation based on JSON configuration, which also achieves the aforementioned technical effects.

[0006] The first technical solution provided by this invention is as follows: This invention provides a method for generating dynamic tables that support computation based on JSON configuration, including the following steps: S1 Obtaining a set of user input parameters; S2 performs an existence check on the input parameter set to obtain a verification parameter set; S3 defines a dynamic column configuration based on the set of verification parameters, matches table data according to the dynamic column configuration, and obtains a JSON configuration file of the dynamic column configuration and the table data. The dynamic column configuration is the structure configuration of the data table. S4 parses the JSON configuration files of the dynamic column configuration and the table data respectively, and generates several dynamic components based on utility functions; S5 renders and mounts several of the aforementioned dynamic components, and displays them visually to obtain a dynamic table.

[0007] Furthermore, in a preferred embodiment of the present invention, the step of performing an existence check on the set of input parameters includes: A basic validation is performed on the input parameter set to verify the completeness of the basic required parameters in the input parameter set. If there is a null value in the basic required parameters, the process is terminated directly and a prompt is triggered. If no null value exists, the basic verification is passed, and the subsequent process continues. The set of input parameters that have passed the basic verification is matched with the business mandatory parameter rules, and the set of input parameters is verified for business association according to the business mandatory parameter rules to determine whether there are empty values ​​in the business association parameters. If there are empty values ​​in the business association parameters, the process is terminated directly and a prompt is triggered. If no null value exists, the existence check is completed through the business association check.

[0008] Furthermore, in a preferred embodiment of the present invention, the step of defining dynamic column configuration based on the set of verification parameters includes: The set of verification parameters is assembled using a hierarchical strategy to obtain the first JSON configuration file; The first JSON configuration file is sent to the backend column configuration interface using the POST interface. The backend column configuration interface receives and parses the first JSON configuration file, extracts the column configuration object from the first JSON configuration file, and generates dynamic column configuration.

[0009] Furthermore, in a preferred embodiment of the present invention, configuring the matching table data according to the dynamic column configuration includes: The verification parameter set and the new parameter set are combined to obtain the second JSON configuration file. The new parameter set is only used to control data query behavior and does not participate in the column structure definition. Send the second JSON configuration file to the data interface via the POST interface; Based on the dynamic column configuration, data is filtered and matched on the second JSON configuration file to obtain table data.

[0010] Furthermore, in a preferred embodiment of the present invention, the step of parsing the JSON configuration files of the dynamic column configuration and the table data respectively includes: Receive the JSON configuration file, initialize the parsing environment, parse the JSON configuration file based on the parsing environment, and obtain the column structure configuration and operation button configuration; The basic parsing elements of the column structure configuration are extracted based on the utility function, and interactive events are bound to the column structure configuration to associate the parent component capabilities. By integrating the above analysis results, a dynamic component configuration is generated, and a mountable object is output.

[0011] Furthermore, in a preferred embodiment of the present invention, the step of initializing the parsing environment includes: Create a table instance object, receive the JSON configuration file based on the table instance object, and perform integrity verification on the JSON configuration file. If abnormal configuration data is found, the error handling mechanism is triggered immediately. If no abnormality is found, proceed with the subsequent steps. Obtain the current system timestamp and generate an encrypted random string. Concatenate the system timestamp with the encrypted random string to obtain a unique identifier. Assign the unique identifier to the table instance object; the unique identifier is used to distinguish the table instance object. Load the core parsing tool and establish a binding relationship between the core parsing tool and the table instance object; A state management container is created for each of the table instances, thus completing the initialization and parsing environment.

[0012] Furthermore, in a preferred embodiment of the present invention, the step of rendering and mounting the plurality of dynamic components includes: The dynamic component is mounted into a specified container on the page using the Vue framework, and a unique identifier is used to re-render the dynamic component. The re-rendered dynamic component is cached using the keep-alive component, and the core interactive events of the table are bound to the parent component's methods. Integrate the dynamic components, core table interaction events, and parent component methods to generate an interactive table view.

[0013] Furthermore, in a preferred embodiment of the present invention, the step of caching the re-rendered dynamic component includes: A caching strategy is implemented for the dynamic components based on the unique identifier, and the caching strategy only caches the dynamic components that match the unique identifier; Configure a cache invalidation mechanism to automatically clear the old cache and create a new cache when an update to the column configuration is detected.

[0014] The present invention provides a second technical solution as follows: This invention also provides a system for generating dynamic tables that support computation based on JSON configuration. The system is used to implement the method described above for generating dynamic tables that support computation based on JSON configuration, comprising: The user interaction module retrieves the user's input parameter set. The business parameter verification module performs an existence verification on the input parameter set to obtain a verification parameter set. The dynamic configuration acquisition module defines dynamic column configurations based on the set of verification parameters, matches table data based on the dynamic column configurations, and obtains a JSON configuration file of the dynamic column configurations and the table data. The dynamic column configurations are the structure configurations of the data table. The configuration parsing and component generation module parses the JSON configuration files of the dynamic column configuration and the table data respectively, and generates several dynamic components based on utility functions; The dynamic table rendering module renders and mounts several dynamic components, and displays them visually to obtain a dynamic table.

[0015] Furthermore, in a preferred embodiment of the present invention, the business parameter verification module includes: The basic parameter verification unit performs basic verification on the input parameter set to verify the completeness of the basic required parameters in the input parameter set. If there is a null value in the basic required parameters, the process is terminated directly and a prompt is triggered. If no null value exists, the basic verification is passed, and the subsequent process continues. The business association verification unit matches the business mandatory parameter rules according to the input parameter set, and performs business association verification on the input parameter set according to the business mandatory parameter rules to determine whether there are empty values ​​in the business association parameters. If there are empty values ​​in the business association parameters, the process is terminated directly and a prompt is triggered. If no null value exists, the existence check is completed through the business association check.

[0016] This invention provides a method for generating a dynamic table supporting computation based on JSON configuration, comprising: S1 obtaining a set of user input parameters; S2 performing an existence check on the set of input parameters to obtain a set of verification parameters; S3 defining a dynamic column configuration according to the set of verification parameters, and matching the table data according to the dynamic column configuration to obtain a JSON configuration file of the dynamic column configuration and the table data, wherein the dynamic column configuration is the structural configuration of the data table; S4 parsing the JSON configuration file of the dynamic column configuration and the table data respectively, and generating several dynamic components based on utility functions; S5 rendering and mounting the several dynamic components, and performing a visual display to obtain a dynamic table. Compared to existing technical solutions, by acquiring and validating the user input parameter set, the problem of business version and required parameters becoming disconnected due to the lack of a unified parameter validation mechanism in existing technologies can be avoided. This provides an accurate and reliable parameter foundation for subsequent dynamic configuration, ensuring parameter integrity during multi-business version switching. By validating the parameter set to define dynamic column configurations and matching them with table data, the rigidity of existing low-code configurations in dynamically adjusting column structures based on business parameters can be solved. This avoids the situation where column structures do not match actual business needs due to fixed templates, providing a highly adaptable configuration core for accurate data rendering. By parsing JSON configuration files with S4 and generating dynamic components based on utility functions, This invention eliminates the deficiencies in existing technologies regarding the lack of multi-type column parsing capabilities and functional fragmentation. It supports zero-code parsing and integration of text, images, progress bars, and other types of data, avoiding the development costs of custom plugins for special columns and providing a unified component foundation for integrated business operations. By rendering, mounting, and visualizing dynamic components, it overcomes the limitations of existing technologies in terms of insufficient online editing and business rule linkage, enabling configuration-based cell-level editing permission control and multi-layered header dynamic interaction. This avoids the low operational efficiency caused by static rendering, significantly improving user experience and business adaptation efficiency. Furthermore, this invention also provides a dynamic table system that generates calculation-supporting data based on JSON configuration, which also has the aforementioned technical effects. Attached Figure Description

[0017] To more clearly illustrate the technical solutions in the embodiments of the present invention or the prior art, the drawings used in the description of the embodiments or the prior art will be briefly introduced below. Obviously, the 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.

[0018] Figure 1 A flowchart illustrating the steps of a method for generating a dynamic table that supports computation based on JSON configuration, as provided in an embodiment of the present invention. Figure 2 A schematic diagram of the existence verification framework provided for embodiments of the present invention; Figure 3 A schematic diagram of the framework for defining dynamic column configuration provided in an embodiment of the present invention; Figure 4 A framework diagram for configuration parsing provided in embodiments of the present invention; Figure 5 A schematic diagram of the framework of a system for generating dynamic tables that support computation based on JSON configuration, as provided in an embodiment of the present invention; Figure 6 This is a schematic diagram of the internal operation implementation logic provided in an embodiment of the present invention. Detailed Implementation

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

[0020] It should be noted that when a component is referred to as being "fixed to" or "set on" another component, it can be directly on or indirectly set on the other component; when a component is referred to as being "connected to" another component, it can be directly connected to or indirectly connected to the other component.

[0021] It should be understood that the terms "length", "width", "upper", "lower", "front", "rear", "first", "second", "vertical", "horizontal", "top", "bottom", "inner", "outer", etc., indicate the orientation or positional relationship based on the orientation or positional relationship shown in the accompanying drawings. They are only for the convenience of describing the present invention and simplifying the description, and do not indicate or imply that the device or element referred to must have a specific orientation, or be constructed and operated in a specific orientation. Therefore, they should not be construed as limitations on the present invention.

[0022] Furthermore, the terms "first" and "second" are used for descriptive purposes only and should not be construed as indicating or implying relative importance or implicitly specifying the number of indicated technical features. Thus, a feature defined as "first" or "second" may explicitly or implicitly include one or more of that feature. In the description of this invention, "a plurality of" or "several" means two or more, unless otherwise explicitly specified.

[0023] It should be noted that the structures, proportions, sizes, etc., shown in the accompanying drawings of this specification are only for the purpose of assisting those skilled in the art in understanding and reading the content disclosed in the specification, and are not intended to limit the conditions under which the present invention can be implemented. Therefore, they have no substantial technical significance. Any modifications to the structure, changes in the proportions, or adjustments to the size, without affecting the effects and objectives that the present invention can produce, should still fall within the scope of the technical content disclosed in the present invention.

[0024] like Figure 1 As shown in the embodiment of the present invention, the method for generating dynamic tables that support calculations based on JSON configuration includes: S1 obtains the user's input parameter set; S2 performs an existence check on the input parameter set to obtain a verification parameter set; S3 defines a dynamic column configuration based on the set of verification parameters, matches table data according to the dynamic column configuration, and obtains a JSON configuration file of the dynamic column configuration and the table data. The dynamic column configuration is the structure configuration of the data table. S4 parses the JSON configuration files of the dynamic column configuration and the table data respectively, and generates several dynamic components based on utility functions; S5 renders and mounts several of the aforementioned dynamic components, and displays them visually to obtain a dynamic table.

[0025] In a specific embodiment of this invention, firstly, the user inputs business parameters, including version number (VERSION), year (YSND), and user role, through the front-end interaction layer (such as the query condition input area). These parameters are captured in real time through the v-model binding of Vue components or event listeners (such as @change) and stored in JavaScript object format, ensuring that all user input is systematically collected and providing raw input for dynamic table generation. After receiving the set of input parameters, layered validation is performed to obtain a set of validation parameters. After receiving the set of validation parameters, dynamic column configurations are defined for the set of validation parameters and matched with table data to obtain a JSON configuration file. This step ensures that the column structure and data are accurately matched, providing standardized input for parsing. The JSON configuration file is received and parsed using utility functions to generate Vue dynamic components. Finally, the dynamic components are rendered into an interactive table, ensuring that the table responds to business changes in real time and provides a smooth user experience. At the same time, performance is improved through caching and event routing. This embodiment achieves efficient generation of dynamic tables through a five-layer architecture and tool-based parsing, solving the problems of flexibility, maintainability, and performance in enterprise-level data visualization.

[0026] The following detailed explanation of the steps involved in generating a dynamic table that supports computation based on JSON configuration, using specific embodiments.

[0027] Specifically, such as Figure 2 As shown, in a specific embodiment of the present invention, the step of performing an existence check on the input parameter set includes: performing a basic check on the input parameter set to verify the completeness of the basic required parameters in the input parameter set; if there is a null value in the basic required parameters, the process is terminated directly and a prompt is triggered. If no null value exists, the basic verification is passed, and the subsequent process continues. The set of input parameters that have passed the basic verification is matched with the business mandatory parameter rules, and the set of input parameters is verified for business association according to the business mandatory parameter rules to determine whether there are empty values ​​in the business association parameters. If there are empty values ​​in the business association parameters, the process is terminated directly and a prompt is triggered. If no null value exists, the existence check is completed through the business association check.

[0028] In a specific embodiment of this invention, a list of basic required parameters is extracted from the user input set. These basic parameters typically include VERSION (version) and YSND (year), which are essential for most business scenarios. The list of basic parameters is traversed, checking whether the value of each parameter is null, undefined, an empty string, or an empty array. Data type is considered during the check: numeric parameters are checked for NaN, and array parameters are checked for the length attribute. If any parameter is empty, a utility function is immediately invoked to display an error message specifying the parameter name (e.g., "version cannot be empty"). Simultaneously, all subsequent processes are terminated to avoid invalid operations. If all basic parameters are complete, the parameter set is marked as having passed basic validation and passed to the business-related validation stage. Subsequently, based on the parameter set that passed basic validation, the VERSION value is extracted, and the corresponding list of required parameters is searched based on preset rules, for example: "When VERSION=V1, the required parameters are KUNNR (customer code) and JZB (machine type); when VERSION=V3, the required parameter is NY (year and month)". The matched list of required parameters is traversed, checking whether the value of each parameter in the input set is empty. The checking logic is similar to the basic validation, but for business-specific parameters, if a null value is found, FunMessage is called to prompt the specific missing business parameter, such as the customer code cannot be empty, and the process is terminated. The prompt message includes the parameter name and the associated business context, such as version V1 requires the customer code. If all required parameters are complete, the set of parameters that have passed the validation is output.

[0029] Specifically, such as Figure 3 As shown, in a specific embodiment of the present invention, the step of defining dynamic column configuration based on the verification parameter set includes: The set of verification parameters is assembled using a hierarchical strategy to obtain the first JSON configuration file; The first JSON configuration file is sent to the backend column configuration interface using the POST interface. The backend column configuration interface receives and parses the first JSON configuration file, extracts the column configuration object from the first JSON configuration file, and generates dynamic column configuration.

[0030] In one embodiment of the present invention, firstly, a set of parameters that have passed verification is received, and a basic parameter container is created, which contains mandatory system-level parameters. These parameters form the foundation for table generation, ensuring the backend can identify the request source and basic business context. Then, core business parameters are extracted from the validation parameter set. These core business parameters directly determine the table's column structure, attributes, and display rules, such as column names, data types, and formatting rules. Next, user-defined parameters are added to support externally passed parameters, such as filtering conditions and pagination information. These parameters are assembled according to the aforementioned parameter types to obtain the first JSON configuration file. Then, the frontend system constructs an HTTP request with the POST method set. The target URL points to the backend service's dedicated interface address for handling dynamic column configuration. In this embodiment, the column configuration interface calls ` / ODPS2 / ZJYMXR002 / FRM_GET_HEADER` to obtain the table's column structure configuration. The first JSON configuration file generated in the first step is then used as the body of the POST request. Simultaneously, necessary information is set in the request header, including declaring the body content format as JSON and attaching a user authentication token for server-side permission verification. The frontend sends this request through its network communication module, such as a Promise-based asynchronous request library. The backend column configuration interface controller receives the POST request. The framework automatically deserializes the JSON data in the request body into an object model in the backend language. The interface first performs basic validation on the request, such as checking whether the required hierarchical structure exists and whether the key parameter format is valid. After the validation passes, the service layer logic extracts the key parameters from the deserialized object by hierarchy. The system uses the extracted parameters as query conditions to access the database or configuration center to retrieve matching basic column configuration templates. Then, combined with the parameters of the "business entity layer", the system refines the retrieved basic column configuration templates. After processing, the system obtains a final personalized set of column configurations suitable for the current request. Finally, the backend encapsulates the set of column configurations into a standard response data structure (usually still in JSON format) and returns it to the frontend to generate dynamic column configurations. It should be noted that the above process configuration mode is the "dynamic interface mode". The system itself also supports "fixed JSON mode". "Fixed JSON mode" directly uses the frontend's fixed lwh_col_json (such as this.dialog_005_kBdwfmyb_json), which is suitable for offline scenarios or fixed structure tables and improves loading speed.

[0031] Specifically, such as Figure 3 As shown, in a specific embodiment of the present invention, matching table data according to the dynamic column configuration includes: The verification parameter set and the new parameter set are combined to obtain the second JSON configuration file. The new parameter set is only used to control data query behavior and does not participate in the column structure definition. Send the second JSON configuration file to the data interface via the POST interface; Based on the dynamic column configuration, data is filtered and matched on the second JSON configuration file to obtain table data.

[0032] In an embodiment of the present invention, after a column configuration request is successful, the system begins to request the corresponding data content, ensuring the data matches the column structure, receiving a set of verification parameters, and collecting a set of new parameters. The set of new parameters can be actively entered through interactive controls on the table interface. The set of new parameters is independent of the column configuration process and is a set of parameters specifically introduced to control data query behavior. Typical parameters include: page number, amount of data per page, sorting field, sorting method (ascending / descending), and data filtering conditions. These parameters only affect the quantity, order, and range of query results and do not change the column structure definition of the table. Afterward, the system provides a data query request assembly function. This function merges the two types of parameters mentioned above into a single, structured JSON request object, namely the second JSON configuration file. Then, the front-end system constructs a new HTTP POST request, the target URL of which points to the interface address of the back-end providing data query services. In this embodiment, the data interface calls / ODPS2 / ZJYMXR002 / FRM_QUERY to obtain table data matching the column structure. This interface is independent of the interface for obtaining column configurations. The second JSON configuration file assembled in the first step is used as the body content of this POST request. Similarly, the content type is set to JSON in the request header, and authentication information is attached. This request process is similar to that of the column configuration request. After receiving the second JSON configuration file, the back-end data interface parses it, separating the business query conditions (verification parameter set) and data control parameters (new parameter set). The business query conditions and data control parameters are converted into WHERE conditions for database queries, and the dynamically constructed query statement is executed to obtain the result set from the database. Subsequently, the original data list returned by the database is encapsulated into a standardized response structure.

[0033] Specifically, such as Figure 4 As shown, in this embodiment of the invention, the steps of parsing the dynamic column configuration and the JSON configuration file of the table data respectively include: Receive the JSON configuration file, initialize the parsing environment, parse the JSON configuration file based on the parsing environment, and obtain the column structure configuration and operation button configuration; The basic parsing elements of the column structure configuration are extracted based on the utility function, and interactive events are bound to the column structure configuration to associate the parent component capabilities. By integrating the above analysis results, a dynamic component configuration is generated, and a mountable object is output.

[0034] Specifically, in a specific embodiment of the present invention, the front-end system receives two independent JSON configuration files successfully returned from the back-end interface. One is a dynamic column configuration file, which defines the structure of the table; the other is a table data file, which contains the specific data records to be displayed. Then, the parsing environment is initialized. In the initialized environment, the dynamic column configuration file is parsed to extract two core elements: column structure configuration: an array describing the attributes of each column, such as field name, column title, width, whether it is sortable, and the formula expression for calculating the column; operation button configuration: an array defining the operation buttons that can be executed for each row of data in the table, such as "edit" and "delete" buttons, including their display text, type, and the name of the callback function to be triggered. Subsequently, a dedicated column configuration parsing tool function is called to perform a deep traversal of the column structure configuration array obtained in the first step. This utility function extracts the most basic properties used to render the table column from the configuration object of each column, such as field name, column header, width, cell alignment, etc. For calculated columns, the utility function will specifically parse its calculation formula and convert it into an executable function. At the same time, for columns that require interaction, such as clickable links and sortable headers, the utility function will dynamically add event listeners to the configuration objects of these columns. For example, click events can be bound to the table header for sorting and click events can be bound to buttons within specific columns. These event listeners do not directly implement specific business logic in the current parsing environment. Instead, they associate event triggering with the parent component, i.e., the predefined method of the page or component that calls this dynamic table. For example, when the "Edit" button is parsed, the utility function generates a configuration that stipulates that when this button is clicked, an event named onEdit needs to be triggered, and the data of the current row is passed as a parameter to the parent component. The parent component is then responsible for implementing the specific onEdit method to complete the editing operation. This decouples the dynamic table component from the specific business logic. Finally, the extracted basic parsing elements (column information) and operation button configurations are merged, the defined interaction event bindings are attached to the integrated configuration, and the received table data is also injected into the configuration, generating a component option object that meets the requirements of a front-end framework (such as Vue.js).

[0035] Specifically, in a specific embodiment of the present invention, the step of initializing the parsing environment includes: Create a table instance object, receive the JSON configuration file based on the table instance object, and perform integrity verification on the JSON configuration file. If abnormal configuration data is found, the error handling mechanism is triggered immediately. If no abnormality is found, proceed with the next steps. Get the current system timestamp and generate an encrypted random string. Concatenate the system timestamp with the encrypted random string to obtain a unique identifier. Assign a unique identifier to a table instance object; the unique identifier is used to distinguish table instance objects. Load the core parsing tool and establish a binding relationship between the core parsing tool and the table instance object; A state management container is created for each table instance object, which ultimately completes the initialization of the parsing environment.

[0036] In this embodiment of the invention, firstly, the system allocates an independent space in the memory heap and creates an empty JavaScript object as the core working area for this dynamic table generation task. This object will serve as the carrier for all intermediate parsing results and component states in subsequent steps. Then, the externally passed dynamic column configuration JSON file and table data JSON file are mounted as attributes onto the newly created table instance object. A dedicated configuration verification function is called to perform structured verification on the mounted configuration file. This verification does not involve the correctness of business logic but focuses on the basic integrity and format validity of the JSON data. The verification content may include checking whether tableData exists and is of array type (empty arrays are allowed, indicating no data), etc. If the verification fails, it is determined that the configuration data is abnormal, and an error handling mechanism is immediately triggered, such as outputting detailed error logs to the console, sending error notification messages to the user interface, and suspending the entire parsing process. After passing the verification, a numerical timestamp representing the current moment is obtained by calling the JavaScript built-in Date.now() method or other equivalent system interfaces. To prevent multiple instances from being created within the same millisecond, causing timestamp duplication, the system also generates a cryptographically secure random string. Specifically, by calling the `crypto.getRandomValues()` method or a similar interface, a random string of a specified length, such as 16 characters, is generated. This string consists of numbers and letters and is highly unpredictable and unique. The obtained numerical system timestamp is then concatenated with the generated encrypted random string. A specific delimiter, such as an underscore or hyphen, is typically used to connect the strings, forming a final unique identifier. This unique identifier string is assigned to the table instance object created in the first step. Subsequently, throughout the entire application's lifecycle, this table instance object is identified and referenced using this uniqueId. When a page needs to display multiple dynamic tables simultaneously, this identifier is the fundamental basis for distinguishing different table instances and performing independent operations such as refreshing, caching, and destroying them. Afterward, the system dynamically introduces or initializes a series of utility function libraries specifically for configuration parsing. Each utility function focuses on a specific parsing subtask. Through JavaScript's `call`, `apply` methods, or by directly passing parameters, the calling context (this value) or the first parameter of these core parsing tools is bound to the current table instance object. Finally, a dedicated state storage object is created on the table instance object to complete the initialization.

[0037] Specifically, in embodiments of the present invention, the steps of rendering and mounting several dynamic components include: The Vue framework is used to mount dynamic components into a specified container on the page, and a unique identifier is used to re-render the dynamic components. The keep-alive component is used to cache the re-rendered dynamic components and bind the core interactive events of the table to the parent component's methods; Integrate dynamic components, core table interaction events, and parent component methods to generate an interactive table view.

[0038] In this embodiment of the invention, firstly, a DOM element to hold the dynamic table needs to be predefined in the HTML page; this is typically a container with a specific ID. Then, using the Vue framework's component mounting API, several dynamic components are mounted onto the specified page container. This operation triggers Vue's rendering process, compiling the component template into a virtual DOM and ultimately converting it into real DOM nodes inserted into the page container, completing the initial display of the table. Simultaneously, to ensure the independence and state accuracy of the table instance, during or after mounting, the system forces a re-rendering operation using a unique identifier as the key. In this embodiment, this unique identifier is set to the `key` attribute of the outermost element of the component. When Vue detects a change in the `key` value, it considers it a completely new component instance, thus destroying the old instance and creating a new one. This effectively avoids internal state chaos caused by reusing components in the same location, ensuring that the table can be re-rendered in a clean state after each parameter change. Subsequently, the system uses Vue's built-in... <keep-alive>This component wraps the dynamic table component. When the user switches to another task and then returns, <keep-alive>This allows the table component instance to be cached after the first render, instead of being destroyed. When the component is reactivated, Vue directly restores the instance from the cache, including its current data state such as sorting, filtering, and pagination position, thus avoiding repeated execution of time-consuming parsing and initialization processes and achieving fast rendering. Subsequently, the core interactive events of the table are bound to the parent component's methods. In this embodiment, the names of the core interactive events that may be triggered to the parent component are predefined in the internal configuration of the dynamic table component. For example, an event named "edit" is declared to represent an editing operation. Then, in the code logic of the parent component, i.e., the page or component that imports and uses the dynamic table, specific JavaScript functions need to be written to handle these events. Finally, in the parent component's template, the above two are linked through Vue's template syntax. When the parent component uses the dynamic table component, event listeners are bound through the v-on directive. Ultimately, Vue's reactive system organically integrates the dynamic table component, its internal state, caching mechanism, event bus, and parent component methods to generate an interactive table view.

[0039] Specifically, in a specific embodiment of the present invention, the step of caching the re-rendered dynamic component includes: A caching strategy is implemented for the dynamic components based on the unique identifier, and the caching strategy only caches the dynamic components that match the unique identifier; Configure a cache invalidation mechanism to automatically clear the old cache and create a new cache when an update to the column configuration is detected.

[0040] Specifically, in a specific embodiment of the present invention, the Vue framework... <keep-alive>Components control caching strategies through their include, exclude, or max attributes. In this invention, the key identifier for caching is the unique identifier of each dynamic table instance. The system sets the name option of the dynamic table component to this unique identifier, or creates a wrapper component and sets its name to the unique identifier. <keep-alive>When wrapping a dynamic table component, setting the `include` property to an array containing unique identifiers for the current table instance instructs Vue's caching system. Vue's virtual DOM comparison algorithm checks if the component's name matches an identifier in the `include` list when switching components. Only when there is a complete match will the component instance be cached or restored from the cache, ensuring that instances of the same table with different parameters (possessing different unique identifiers) are cached separately without interference. Afterward, the system continuously monitors the source conditions that trigger the regeneration of the dynamic table. When a column configuration update is detected, cache cleanup logic is executed. While clearing the old cache, the system re-triggers the entire dynamic table creation process based on the new column configuration and the new unique identifier: re-parse the configuration, regenerate the component, and re-mount and render.

[0041] This invention also provides a system for generating dynamic tables that support calculations based on JSON configuration, such as... Figure 5 As shown, it includes: The user interaction module retrieves the user's input parameter set. The business parameter verification module performs an existence verification on the input parameter set to obtain a verification parameter set. The dynamic configuration acquisition module defines dynamic column configurations based on the set of verification parameters, matches table data based on the dynamic column configurations, and obtains a JSON configuration file of the dynamic column configurations and the table data. The dynamic column configurations are the structure configurations of the data table. The configuration parsing and component generation module parses the JSON configuration files of the dynamic column configuration and the table data respectively, and generates several dynamic components based on utility functions; The dynamic table rendering module renders and mounts several dynamic components, and displays them visually to obtain a dynamic table.

[0042] Specifically, in a specific embodiment of the present invention, the business parameter verification module includes: The basic parameter verification unit performs basic verification on the input parameter set to verify the completeness of the basic required parameters in the input parameter set. If there is a null value in the basic required parameters, the process is terminated directly and a prompt is triggered. If no null value exists, the basic verification is passed, and the subsequent process continues. The business association verification unit matches the business mandatory parameter rules according to the input parameter set, and performs business association verification on the input parameter set according to the business mandatory parameter rules to determine whether there are empty values ​​in the business association parameters. If there are empty values ​​in the business association parameters, the process is terminated directly and a prompt is triggered. If no null value exists, the existence check is completed through the business association check.

[0043] As described above, the present invention provides a method for generating a dynamic table supporting computation based on JSON configuration, comprising: S1 obtaining a set of user input parameters; S2 performing an existence check on the set of input parameters to obtain a set of verification parameters; S3 defining a dynamic column configuration according to the set of verification parameters, and matching table data according to the dynamic column configuration to obtain a JSON configuration file of the dynamic column configuration and the table data, wherein the dynamic column configuration is the structural configuration of the data table; S4 parsing the JSON configuration file of the dynamic column configuration and the table data respectively, and generating several dynamic components based on utility functions; S5 rendering and mounting the several dynamic components, and performing a visual display to obtain a dynamic table. Compared to existing technical solutions, by acquiring and validating the user input parameter set, the problem of business version and required parameters becoming disconnected due to the lack of a unified parameter validation mechanism in existing technologies can be avoided. This provides an accurate and reliable parameter foundation for subsequent dynamic configuration, ensuring parameter integrity during multi-business version switching. By validating the parameter set to define dynamic column configurations and matching them with table data, the rigidity of existing low-code configurations in dynamically adjusting column structures based on business parameters can be solved. This avoids the situation where column structures do not match actual business needs due to fixed templates, providing a highly adaptable configuration core for accurate data rendering. Through S4 parsing... By using JSON configuration files and generating dynamic components based on utility functions, this technology eliminates the lack of multi-type column parsing capabilities and functional fragmentation in existing technologies. It supports zero-code parsing and integration of text, images, progress bars, and other types of data, avoiding the development costs of custom plugins for special columns and providing a unified component foundation for integrated business operations. By rendering, mounting, and visualizing dynamic components, it overcomes the limitations of existing technologies in terms of online editing and business rule linkage, enabling configuration-based cell-level editing permission control and multi-layered header dynamic interaction. This avoids the low operational efficiency caused by static rendering and significantly improves user experience and business adaptation efficiency.

[0044] The above description of the disclosed embodiments enables those skilled in the art to make or use the invention. Various modifications to these embodiments will be readily apparent to those skilled in the art, and the general principles defined herein may be implemented in other embodiments without departing from the spirit or scope of the invention. Therefore, the invention is not to be limited to the embodiments shown herein, but is to be accorded the widest scope consistent with the principles and novel features disclosed herein.

Claims

1. A method for generating dynamic tables that support calculations based on JSON configuration, characterized in that, include: S1 obtains the user's input parameter set; S2 performs an existence check on the input parameter set to obtain a verification parameter set; S3 defines a dynamic column configuration based on the set of verification parameters, matches table data according to the dynamic column configuration, and obtains a JSON configuration file of the dynamic column configuration and the table data. The dynamic column configuration is the structure configuration of the data table. S4 parses the JSON configuration file containing the dynamic column configuration and the table data, and generates dynamic components based on utility functions; S5 renders and mounts the dynamic component, and displays it visually to obtain a dynamic table.

2. The method for generating a dynamic table supporting computation based on JSON configuration according to claim 1, characterized in that, The step of performing an existence check on the set of input parameters includes: A basic validation is performed on the input parameter set to verify the completeness of the basic required parameters in the input parameter set. If there is a null value in the basic required parameters, the process is terminated directly and a prompt is triggered. If no null value exists, the basic verification is passed, and the subsequent process continues. The set of input parameters that have passed the basic verification is matched with the business mandatory parameter rules, and the set of input parameters is verified for business association according to the business mandatory parameter rules to determine whether there are empty values ​​in the business association parameters. If there are empty values ​​in the business association parameters, the process is terminated directly and a prompt is triggered. If no null value exists, the existence check is completed through the business association check.

3. The method for generating dynamic tables supporting computation based on JSON configuration according to claim 1, characterized in that, The steps define dynamic column configuration based on the set of verification parameters, including: The set of verification parameters is assembled using a hierarchical strategy to obtain the first JSON configuration file; The first JSON configuration file is sent to the backend column configuration interface using the POST interface. The backend column configuration interface receives and parses the first JSON configuration file, extracts the column configuration object from the first JSON configuration file, and generates dynamic column configuration.

4. The method for generating a dynamic table supporting computation based on JSON configuration according to claim 3, characterized in that, Matching table data based on the dynamic column configuration includes: The verification parameter set and the new parameter set are combined to obtain the second JSON configuration file. The new parameter set is only used to control data query behavior and does not participate in the column structure definition. Send the second JSON configuration file to the data interface via the POST interface; Based on the dynamic column configuration, the second JSON configuration file is filtered and matched to obtain table data.

5. The method for generating a dynamic table supporting computation based on JSON configuration according to claim 1, characterized in that, The steps include parsing the dynamic column configuration and the JSON configuration file of the table data, including: Receive the JSON configuration file, initialize the parsing environment, parse the JSON configuration file based on the parsing environment, and obtain the column structure configuration and operation button configuration; The basic parsing elements of the column structure configuration are extracted based on the utility function, and interactive events are bound to the column structure configuration to associate the parent component capabilities. By integrating the above analysis results, a dynamic component configuration is generated, and a mountable object is output.

6. The method for generating a dynamic table supporting computation based on JSON configuration according to claim 5, characterized in that, The steps to initialize the parsing environment include: Create a table instance object, receive the JSON configuration file based on the table instance object, and perform integrity verification on the JSON configuration file. If abnormal configuration data is found, the error handling mechanism is triggered immediately. If no abnormality is found, proceed with the subsequent steps. Obtain the current system timestamp and generate an encrypted random string. Concatenate the system timestamp with the encrypted random string to obtain a unique identifier. Assign the unique identifier to the table instance object; the unique identifier is used to distinguish the table instance object. Load the core parsing tool and establish a binding relationship between the core parsing tool and the table instance object; A state management container is created for each of the table instances, thus completing the initialization and parsing environment.

7. The method for generating dynamic tables supporting computation based on JSON configuration according to claim 6, characterized in that, The steps for rendering and mounting the dynamic component include: The dynamic component is mounted into a specified container on the page using the Vue framework, and a unique identifier is used to re-render the dynamic component. The re-rendered dynamic component is cached using the keep-alive component, and the core interactive events of the table are bound to the parent component's methods. Integrate the dynamic components, core table interaction events, and parent component methods to generate an interactive table view.

8. The method for generating a dynamic table supporting computation based on JSON configuration according to claim 7, characterized in that, The step of caching the re-rendered dynamic component includes: A caching strategy is implemented for the dynamic components based on the unique identifier, and the caching strategy only caches the dynamic components that match the unique identifier; Configure a cache invalidation mechanism to automatically clear the old cache and create a new cache when an update to the column configuration is detected.

9. A system for generating dynamic tables supporting computation based on JSON configuration, the system being used to implement the method for generating dynamic tables supporting computation based on JSON configuration according to any one of claims 1 to 8, the system comprising: The user interaction module retrieves the user's input parameter set. The business parameter verification module performs an existence verification on the input parameter set to obtain a verification parameter set. The dynamic configuration acquisition module defines dynamic column configurations based on the set of verification parameters, matches table data based on the dynamic column configurations, and obtains a JSON configuration file of the dynamic column configurations and the table data. The dynamic column configurations are the structure configurations of the data table. The configuration parsing and component generation module parses the JSON configuration files of the dynamic column configuration and the table data respectively, and generates several dynamic components based on utility functions; The dynamic table rendering module renders and mounts several dynamic components, and displays them visually to obtain a dynamic table.

10. The system for generating dynamic tables supporting computation based on JSON configuration according to claim 9, characterized in that, The business parameter verification module includes: The basic parameter verification unit performs basic verification on the input parameter set to verify the completeness of the basic required parameters in the input parameter set. If there is a null value in the basic required parameters, the process is terminated directly and a prompt is triggered. If no null value exists, the basic verification is passed, and the subsequent process continues. The business association verification unit matches the business mandatory parameter rules according to the input parameter set, and performs business association verification on the input parameter set according to the business mandatory parameter rules to determine whether there are empty values ​​in the business association parameters. If there are empty values ​​in the business association parameters, the process is terminated directly and a prompt is triggered. If no null value exists, the existence check is completed through the business association check.

Images