Report calling display method, system, device and computer readable storage medium

Abstract

The present application relates to the technical field of financial technology (Fintech). The present application discloses a report calling display method, system, device and medium. The report calling instruction is declared in advance, and is referenced in different pages in the form of a label. When the reference is triggered, the target report content to be displayed is automatically obtained. Then, according to the DOM tree of the view corresponding to the label, corresponding compilation operation is performed. The target hotspot instruction is automatically generated according to the field configuration of the target report content. Finally, the target report configuration information is automatically generated, and the target report view is displayed. The configuration file of the report does not need to be developed by the developer in advance. Then, the pre-stored configuration file is reloaded when it needs to be displayed. A series of operations are avoided. Therefore, even if multiple reports are referenced at the same time, the memory consumption will not be excessive.

Description

Technical Field

[0001] This invention relates to the field of financial technology (Fintech), and in particular to a method, system, device, and computer-readable storage medium for displaying and retrieving reports. Background Technology

[0002] With the development of computer technology, more and more technologies (big data, distributed systems, blockchain, artificial intelligence, etc.) are being applied in the financial field. The traditional financial industry is gradually transforming into financial technology (Fintech). However, due to the security and real-time requirements of the financial industry, higher demands are also being placed on web front-end technology.

[0003] When using Handsontable (an open-source JavaScript spreadsheet component) for report display via AngularJS directives (custom tags attached to HTML elements), a new report configuration file needs to be developed to describe the appearance of the current report. This configuration file typically requires a `hot-table` directive and several `hot-column` directives to set its content information, and the field information is configured for each `hot-column`. Therefore, when there are multiple different report display requirements, different report configuration files need to be loaded to render and display different reports. Each loaded configuration file requires a certain amount of memory for caching, and too many files will gradually increase memory consumption, thus highlighting the problem of excessive memory usage when multiple different reports are loaded simultaneously. Summary of the Invention

[0004] The main objective of this invention is to propose a method, system, device, computer storage medium, and computer program product for displaying reports, aiming to solve the technical problem of excessive memory consumption when multiple different reports are loaded simultaneously.

[0005] To achieve the above objectives, the present invention provides a report retrieval and display method, the report retrieval and display method comprising:

[0006] When the report call tag referenced on the current page is triggered, the initial report view corresponding to the report call tag is invoked, wherein the report call tag is set based on a custom report call instruction;

[0007] Obtain the target report content pointed to by the report call instruction, and traverse the Document Object Model (DOM) of the initialized report view based on the target report content to find the loop output instruction and the report call instruction existing in the DOM;

[0008] Execute the related operations of the loop output instruction and the report call instruction to generate target hotspot instructions that match the field configuration of the target report content, and generate target report configuration information based on the target hotspot instructions;

[0009] The initial report view is rendered into the target report view using the target report configuration information and the target report content.

[0010] Optionally, the target hotspot instruction includes a target hotspot table instruction and a target hotspot list instruction.

[0011] The steps of executing the loop output instruction and the report call instruction to generate a target hotspot instruction that matches the field configuration of the target report content include:

[0012] Based on the found report call instruction, insert the content of the initialized report view under the report call instruction;

[0013] The target hotspot table instruction is generated based on the found loop output instruction, and several target hotspot column instructions corresponding to the field configuration are generated under the target hotspot table instruction based on the loop output instruction and the target report content.

[0014] Optionally, before the step of invoking the initial report view corresponding to the report call tag when the report call tag referenced in the current page is triggered, the method further includes:

[0015] Customize the report calling instruction and declare it in the DOM as an element;

[0016] Define an array property for the report call command, wherein the array property is used to store report content information.

[0017] Optionally, the step of obtaining the target report content pointed to by the report invocation instruction and traversing the Document Object Model (DOM) of the initialized report view based on the target report content includes:

[0018] Obtain the target report content and assign the target report content to the target array attribute of the report call tag;

[0019] The compiler function is invoked, and the DOM is traversed in a depth-first manner based on the compiler function.

[0020] Optionally, the step of generating target report configuration information based on the target hotspot instruction includes:

[0021] Obtain the field value of the custom field attribute of the target hot list instruction, and bind the field value and the field value of the target array attribute to the target hot list table. Here, several custom field attributes have been added to the scope corresponding to the hot list instruction.

[0022] The function that connects the target hotspot table instruction and the target hot list instruction is executed to generate the target report configuration information.

[0023] Optionally, after the step of rendering the initial report view into a target report view using the target report configuration information and the target report content, the method further includes:

[0024] The environment attributes of the target hotspot table instruction are monitored by a preset listening function, wherein the environment attributes are bidirectionally bound to the scope corresponding to the report calling instruction, and the field value of the scope corresponding to the report calling instruction is the content of the target report.

[0025] If a change in the content of the target report is detected, it is determined that a change in the environmental attribute has been detected.

[0026] Obtain change information of the target report content, and update the target report configuration information based on the change information.

[0027] Optionally, the step of rendering the initial report view into a target report view using the target report configuration information and the target report content includes:

[0028] Determine whether the target report content is being rendered for the first time;

[0029] If so, when rendering the target report content onto the initialized report view using the target report configuration information, the field length of each rendering is controlled according to the preset field length, and the next field rendering is initiated when a specific page scrolling event is detected.

[0030] The process continues until all the content of the target report is rendered to the initial report view, thus fully loading the target report view.

[0031] Furthermore, to achieve the above objectives, the present invention also provides a report retrieval and display system, the report retrieval and display system comprising:

[0032] The tag trigger module is used to invoke the initial report view corresponding to the report call tag when the report call tag referenced on the current page is triggered, wherein the report call tag is set based on a custom report call instruction;

[0033] The instruction lookup module is used to obtain the target report content pointed to by the report call instruction, and traverse the Document Object Model (DOM) of the initialized report view based on the target report content to find the loop output instruction and the report call instruction existing in the DOM.

[0034] The target configuration generation module is used to execute the related operations of the loop output instruction and the report call instruction, generate target hotspot instructions that match the field configuration of the target report content, and generate target report configuration information based on the target hotspot instructions;

[0035] The target report rendering module is used to render the initial report view into a target report view using the target report configuration information and the target report content.

[0036] In addition, to achieve the above objectives, the present invention also provides a report retrieval and display device, the report retrieval and display device comprising: a memory, a processor, and a report retrieval and display program stored in the memory and executable on the processor, wherein the report retrieval and display program, when executed by the processor, implements the steps of the report retrieval and display method as described above.

[0037] In addition, to achieve the above objectives, the present invention also provides a computer-readable storage medium storing a report calling and display program, which, when executed by a processor, implements the steps of the report calling and display method described above.

[0038] In addition, to achieve the above objectives, the present invention also provides a computer program product, including a computer program, which, when executed by a processor, implements the steps of the report call and display method described above.

[0039] This invention pre-declares report invocation instructions, which are then referenced across different pages as tags. Upon triggering a reference, it automatically retrieves the target report content to be displayed. Then, by performing corresponding compilation operations based on the DOM tree of the view corresponding to the tag, it automatically generates the appropriate target hotspot instructions based on the field configuration of the target report content. Finally, it automatically generates the target report configuration information and renders the target report view. This eliminates the need for developers to pre-develop report configuration files and then reload pre-stored configuration files when needed, thus avoiding excessive memory consumption caused by installing too many files. Even when referencing multiple reports simultaneously, the configuration file for each report can be automatically generated in real-time based on a small amount of data, without loading multiple pre-stored configuration files in memory simultaneously. Compared to existing methods, this significantly reduces memory usage, solving the technical problem of excessive memory consumption when loading multiple different reports simultaneously. Furthermore, because this invention can automatically generate configurations, it has higher versatility, eliminating the need for technical personnel to redevelop each new report, thus reducing development workload and costs. Attached Figure Description

[0040] Figure 1 This is a schematic diagram of the device structure of the hardware operating environment involved in the embodiments of the present invention;

[0041] Figure 2 This is a flowchart illustrating the first embodiment of the report display method of the present invention;

[0042] Figure 3 This is a schematic diagram of the configuration information generation process in the second embodiment of the report display method of the present invention;

[0043] Figure 4 This is a schematic diagram of instruction association in the third embodiment of the report calling and display method of the present invention;

[0044] Figure 5 This is a schematic diagram of the functional modules of the report display system of the present invention.

[0045] The realization of the objective, functional features and advantages of the present invention will be further explained in conjunction with the embodiments and with reference to the accompanying drawings. Detailed Implementation

[0046] It should be understood that the specific embodiments described herein are merely illustrative of the invention and are not intended to limit the invention.

[0047] When using Handsontable (an open-source JavaScript spreadsheet component) for report display via AngularJS directives (custom tags attached to HTML elements), a new report configuration file needs to be developed to describe the appearance of the current report. This configuration file requires a `hot-table` directive and several `hot-column` directives to set its content information, and the field information is configured for each `hot-column`. Therefore, when there are multiple different report display requirements, different report configuration files need to be loaded to render and display different reports. Each loaded configuration file requires a certain amount of memory for caching, and too many files will gradually increase memory consumption, thus highlighting the problem of excessive memory usage when multiple different reports are loaded simultaneously.

[0048] To address the aforementioned issues, this invention provides a method for calling and displaying reports. This method involves pre-declaring report calling instructions, referencing them as tags on different pages, and automatically retrieving the target report content to be displayed when a reference is triggered. Then, by performing corresponding compilation operations based on the DOM tree of the view corresponding to the tag, it automatically generates the appropriate target hotspot instructions based on the field configuration of the target report content. Finally, it automatically generates the target report configuration information and renders and displays the target report view. This eliminates the need for developers to pre-develop report configuration files and then reload pre-stored configuration files when needed, thus avoiding excessive memory consumption due to installing too many files. Therefore, even when referencing multiple reports simultaneously, memory consumption is minimal, solving the technical problem of high memory usage when loading multiple different reports concurrently. Furthermore, because this invention can automatically generate configurations, it eliminates the need for technical personnel to redevelop each new report, reducing development workload and costs.

[0049] like Figure 1 As shown, Figure 1 This is a schematic diagram of the device structure of the hardware operating environment involved in the embodiments of the present invention.

[0050] like Figure 1As shown, the report display system may include: a processor 1001, such as a CPU; a user interface 1003; a network interface 1004; a memory 1005; and a communication bus 1002. The communication bus 1002 is used to establish communication between these components. The user interface 1003 may include a display screen and an input unit such as a keyboard. Optionally, the user interface 1003 may also include a standard wired interface or a wireless interface. The network interface 1004 may optionally include a standard wired interface or a wireless interface (such as a Wi-Fi interface). The memory 1005 may be high-speed RAM or non-volatile memory, such as a disk drive. Optionally, the memory 1005 may also be a storage device independent of the aforementioned processor 1001.

[0051] Those skilled in the art will understand that Figure 1 The device structure shown does not constitute a limitation on the device and may include more or fewer components than shown, or combine certain components, or have different component arrangements.

[0052] like Figure 1 As shown, the memory 1005, which serves as a computer storage medium, may include an operating system, a network communication module, a user interface module, and a report display program.

[0053] exist Figure 1 In the device shown, the network interface 1004 is mainly used to connect to the backend server and communicate with the backend server; the user interface 1003 is mainly used to connect to the client (programmer's end) and communicate with the client; and the processor 1001 can be used to call the report call and display program stored in the memory 1005 and execute the operations in the report call and display method described below.

[0054] Based on the above hardware structure, an embodiment of the report display method of the present invention is proposed.

[0055] Reference Figure 2 , Figure 2 This is a flowchart illustrating the first embodiment of the report retrieval and display method of the present invention. The report retrieval and display method includes:

[0056] Step S10: When the report call tag referenced on the current page is triggered, the initial report view corresponding to the report call tag is called, wherein the report call tag is set based on a custom report call instruction;

[0057] In this embodiment, the present invention is applied to a displayable terminal device. The current page can be various different pages, and this embodiment does not specifically limit it. The report call tag refers to a tag that can reference report call instructions in the page. The report call instruction refers to a custom AngularJS instruction used to call and display the report. The initialized report view refers to the view used to display the report but has not yet rendered the report content.

[0058] Specifically, when the terminal displays the current page, if it detects a report call tag referenced by the page (e.g., ...<excel-table data="excel"> If triggered, the report call tag will generate a report call instruction, and then the process of calling and displaying the target report corresponding to the tag will begin based on the report call instruction. The triggering method can be clicking a corresponding button, link, etc. on the page. When the terminal receives the tag trigger instruction, it first needs to call the initial view used to display the target report but before the report content is rendered, and then overwrite the current page with this initial view.

[0059] Step S20: Obtain the target report content pointed to by the report call instruction, and traverse the Document Object Model (DOM) of the initialized report view based on the target report content to find the loop output instruction and the report call instruction existing in the DOM;

[0060] In this embodiment, the target report content refers to the content information of the target report to be displayed. This data is pre-stored on the terminal, and the report call tag can be invoked by referencing the target report's identifier. DOM (Document Object Model) refers to the document object model corresponding to the HTML document of the target report. The loop output instruction refers to the ng-repeat instruction, which is used to loop the output of HTML elements a specified number of times.

[0061] Specifically, the terminal obtains the report content of the target report to be displayed from the background according to the report call instruction, then assigns the report content to the report call instruction, and traverses the DOM tree to find the required instruction in the DOM tree, such as the loop output instruction, the aforementioned report call instruction, etc. The instruction search can be achieved by searching the instruction name.

[0062] Step S30: Execute the related operations of the loop output instruction and the report call instruction to generate a target hotspot instruction that matches the field configuration of the target report content, and generate target report configuration information based on the target hotspot instruction;

[0063] Step S40: Render the initial report view into a target report view using the target report configuration information and the target report content.

[0064] In this embodiment, related operations refer to operations related to loop output instructions and report call instructions. Target hotspot instructions refer to hotspot instructions related to the target report configuration, specifically including target hotspot table instructions (i.e., the target report's hot-table instruction) and target hot column instructions (i.e., the target report's hot-cloum instruction). Target report configuration information refers to the configuration information of the target report. Report view refers to the final page view displaying the content information of the target report.

[0065] Specifically, after the terminal finds the instruction name for the loop output execution and report call instructions in the DOM tree, it executes the operation related to that instruction. This generates target hotspot instructions that match the field configuration in the target report. These target hotspot instructions typically include one `hot-table` instruction and multiple `hot-column` instructions. After obtaining the `hot-table` and `hot-column` instructions, the terminal automatically generates target configuration information for displaying the target report. After generating the configuration file for the target report to be displayed, the terminal notifies the Handsontable component of this configuration file. The component then renders the report content based on this configuration file, displaying the target report's content on the initialized report view. Finally, the target report view, displaying the target report's content, is loaded for the user to view.

[0066] This embodiment provides a method for calling and displaying reports. The method pre-declares report calling instructions, references them as tags on different pages, and automatically retrieves the target report content to be displayed when a reference is triggered. Then, it performs corresponding compilation operations based on the DOM tree of the view corresponding to the tag, automatically generating corresponding target hotspot instructions based on the field configuration of the target report content. Finally, it automatically generates the target report configuration information and renders and displays the target report view. This eliminates the need for developers to pre-develop report configuration files and then reload pre-stored configuration files when needed, thus avoiding excessive memory consumption due to adding too many files. Even when referencing multiple reports simultaneously, the configuration file for each report can be automatically generated in real time based on a small amount of data, without having to load multiple pre-stored configuration files in memory simultaneously. Compared to existing methods, this significantly reduces memory usage, thus solving the technical problem of excessive memory consumption when loading multiple different reports simultaneously. Furthermore, because this invention can automatically generate configurations, it has higher versatility and eliminates the need for technicians to redevelop each new report, reducing development workload and costs.

[0067] Furthermore, based on the above Figure 2 The first embodiment shown presents a second embodiment of the report display method of the present invention. In this embodiment, the target hotspot instruction includes a target hotspot table instruction and a target hotspot column instruction. The step S30, which involves executing the related operations of the loop output instruction and the report call instruction to generate a target hotspot instruction that matches the field configuration of the target report content, includes:

[0068] Step S31: Based on the found report call instruction, insert the content of the initialized report view under the report call instruction;

[0069] Step S32: Generate a target hotspot table instruction based on the found loop output instruction, and generate several target hotspot list instructions corresponding to the field configuration under the target hotspot table instruction based on the loop output instruction and the target report content.

[0070] In this embodiment, the target hotspot instructions include the hot-table instruction and the hot-column instruction of the target report.

[0071] The terminal finds the name of the pre-defined report calling instruction (excel-table) in the DOM tree, obtains the instruction object instance through dependency injection, executes the compile function of the instruction object, and inserts the content of the initialized report view into the report calling instruction. Then, it finds the ng-repeat instruction and triggers the target hot table generation instruction simultaneously. Based on the target hot table generation instruction, it generates a target hot-table instruction. When performing operations related to the ng-repeat instruction (traversing the field information in the target report content and looping to output n target hot-column instructions with the same length as the displayed field information list columns), these n target hot-column instructions are output to the target hot-table instruction.

[0072] As one implementation method, when dynamically generating hot-column directives using the ng-repeat directive, each hot-column is assigned a sequence number (starting from 0) based on their order. During rendering and value retrieval, the value is retrieved from the object defined in dataRows (an attribute of the hot-table used to store the corresponding values ​​bound to the hot-column). A unified and standardized dataRows (report data) format ensures that the configuration of each attribute in each hot-column can find its corresponding value through col{{index}}.

[0073] This embodiment executes operations related to report call instructions and loop output instructions, and standardizes the format of report data, enabling the automatic generation of target hot-column instructions corresponding to the field configuration of the target report content, without manual configuration. This eliminates the need for manual redevelopment of each new report, reducing development workload and costs.

[0074] Furthermore, prior to step S10, the following steps are also included:

[0075] Step A1: Define the report calling instruction by declaring it in the DOM as an element;

[0076] Step A2: Define the array attribute of the report call instruction, wherein the array attribute is used to store report content information.

[0077] In this embodiment, it should be noted that before step S10, the technician has already customized the report calling instruction ExcelTable on the AngularJS platform, declared it in the DOM as an element (E), and the template address points to the corresponding HTML page (excelTable.html), and customized the attribute data (i.e. the above array attribute) for the instruction to store the report content information.

[0078] This embodiment uses a custom report call command to enable the display of report content in the form of tags, thereby reducing the problem of excessive memory consumption caused by loading too many files.

[0079] Further, step S20, which involves obtaining the target report content pointed to by the report call instruction and traversing the Document Object Model (DOM) of the initialized report view based on the target report content, includes:

[0080] Step S21: Obtain the target report content and assign the target report content to the target array attribute of the report call tag;

[0081] Step S22: Call the compilation function and traverse the DOM in a depth-first manner based on the compilation function.

[0082] In this embodiment, the terminal obtains the target report content associated with the instruction from the backend database, then assigns this content information to the data attribute of the report call instruction, and then calls the compileNodes function in the AngularJS platform to traverse the DOM tree to find the instruction names of the pre-defined report call instruction and ng-repeat instruction on the DOM tree.

[0083] This embodiment assigns the target report content to the target array attribute of the tag, enabling the tag to locate the target report content more quickly when it is invoked; and by traversing the DOM tree in a depth-first manner, it makes searching for instructions in the DOM tree more efficient.

[0084] Further, step S30, which generates target report configuration information based on the target hotspot instruction, includes:

[0085] Step S33: Obtain the field value of the custom field attribute of the target hot list instruction, and bind the field value and the field value of the target array attribute to the target hot list table. Here, several custom field attributes have been added to the scope corresponding to the hot list instruction.

[0086] Step S34: Execute the connection function of the target hotspot table instruction and the target hot list instruction to generate the target report configuration information.

[0087] In this embodiment, it should be noted that the scope is a JavaScript object with properties and methods that can be used in both the view and the controller. It serves as the link between HTML (view) and JavaScript (controller). Before step S10, the technicians had already added custom properties such as `hotReadOnly` (whether it's read-only), `hotType` (cell field type), `hotFormat` (cell field format), and `hotClassName` (cell style) to the scope of the `hot-cloumn` directive. By using the prefix identifier `@` to retrieve the property values ​​from the parent scope (the parent scope of the `hot-cloumn` directive is the scope of the `hot-table` directive, and the parent scope of the `hot-table` directive is the scope of the report call directive, whose property values ​​are report content information) and applying them to the property values ​​of the current directive, this configuration information is obtained through injection and applied to the final display effect. Correspondingly, custom properties such as `hotReadOnly`, `hotType`, `hotFormat`, and `hotClassName` are also added to the `Handsontable` component, corresponding one-to-one with those on `hot-cloumn`. When rendering cells in the Handsontable component, when encountering a configuration starting with "hot", the component retrieves the actual value from the scope based on its corresponding value and informs it of the original configuration property (such as readOnly, type, format, etc., obtained by removing "hot" and converting the first letter to lowercase). Finally, the value is applied to the current cell to achieve cell rendering.

[0088] The terminal obtains the field values ​​of the custom field attributes (hotReadOnly, hotType, etc.) of the target hot-column directive, binds these field values ​​and the field values ​​of the data attribute of the report calling directive ExcelTable (i.e., the target report content) to the target hot-table directive. After binding, the hot-table directive and hot-column directive are found in the DOM tree, and their link methods are executed to generate the target report configuration information.

[0089] As a specific embodiment, such as Figure 3 The process of generating the target report configuration information is shown below. First, the `compileNodes` function is called to traverse the DOM tree using a depth-first search. The custom directive name (`excel-table`) is found in the DOM tree. An instance of the directive object is obtained through dependency injection, and the `compile` method of the directive object is executed, inserting the content of `excelTable.html` into the `excel-table` tag. Next, the `ng-repeat` directive (used as an `A` attribute) is found. The field information in `data.columns` is traversed, and `n` `hot-column` directives, matching the length of `columns`, are output to the `hot-table` directive. Fields in the scope corresponding to attributes such as `data`, `hotReadOnly`, and `hotType` are bound to these directives. Finally, the `link` method of the `hot-table` and `hot-column` directives is executed to generate the target report configuration information. This information is then sent to the `Handsontable` component for rendering and displaying the target report content.

[0090] This embodiment adds custom attributes to the scope of the hot-cloum directive and the Handsontable component, enabling the automatic acquisition of report content configuration when rendering report cells through the Handsontable component. The report content is then rendered according to the configuration without the need for manual development of report configuration files, thus improving rendering efficiency and accuracy.

[0091] Furthermore, based on the second embodiment described above, a third embodiment of the report display method of the present invention is proposed. In this embodiment, after step S40, the method further includes:

[0092] Step S50: Monitor the environment attributes of the target hotspot table instruction through a preset monitoring function, wherein the environment attributes are bidirectionally bound to the scope corresponding to the report call instruction, and the field value of the scope corresponding to the report call instruction is the target report content.

[0093] Step S60: If a change in the content of the target report is detected, it is determined that a change in the environmental attribute has been detected.

[0094] Step S70: Obtain change information of the target report content, and update the target report configuration information based on the change information.

[0095] In this embodiment, as Figure 4 As shown in the diagram, the `excel-table` directive is the report calling directive mentioned above, with the restricted reference form being `E(element)`. The `hot-table` and `hot-cloumn` directives work similarly. The scope field value of the `hot-cloumn` directive is obtained from the `datarows` of the `hot-table` directive's scope, while the scope field value of the `hot-table` directive is obtained from the `data` of the `excel-table` directive's scope. In other words, the scope of the `excel-table` directive is the parent scope of the `hot-table` directive, and the scope of the `hot-table` directive is the parent scope of the `hot-cloumn` directive.

[0096] Before step S10, the `hot-table` directive listens for changes in settings environment properties using `$wtach` (a listener function). Afterward, when a change is detected in the value of the corresponding object (i.e., the target report content) in the parent scope of the settings' two-way binding, the values ​​of the object before and after the change are retrieved, and the attribute values ​​are compared one by one. Finally, the changed attribute values ​​are notified to the Handsontable component, causing it to reload and update configuration information, such as freezing rows and columns, merging cells, etc.

[0097] In the existing approach, when the settings property value in a hot-table changes, it will not be automatically reloaded and re-rendered because no listener is set. The entire original table needs to be deleted and reloaded, which reduces efficiency and results in a poor user experience. This embodiment adds listeners to the settings property in multiple hot-tables, so that the report can be refreshed in time when its content changes, thereby improving update efficiency and user experience.

[0098] Further, step S40 includes:

[0099] Step S41: Determine whether the target report content is being rendered for the first time;

[0100] Step S42, if yes, when rendering the target report content on the initial report view using the target report configuration information, the field length of each rendering is controlled according to the preset field length, and the next field rendering is entered when a specific page scrolling event is detected.

[0101] Step S43 continues until all the content of the target report is rendered to the initial report view, so that the target report view is fully loaded.

[0102] In this embodiment, to prevent page lag caused by rendering too many fields initially, the length of the columns (the list of displayed field information) is used to control the amount of report information to be loaded and displayed. The preset field length can be flexibly set according to actual needs. The method for determining whether it is the first rendering can be: checking if there is a rendered flag in the target report content (this flag is added to the target report content after the first rendering). If it exists, it means the report content has been rendered; if not, it means the report content has not been rendered, and it is determined to be the first rendering. Specific page scrolling events can include scrolling to the far right of the page, scrolling to the bottom of the page, etc.

[0103] As a specific implementation method, during the initial rendering, the first 20 fields are extracted and displayed using the array truncation function columns.splice(0,20). When the user scrolls to the far right, the information content of the last 10 fields is rendered, and so on, until the entire report is fully loaded and displayed.

[0104] In existing solutions, too many hot-column settings in a report can slow down page rendering, increase memory usage and CPU consumption. This embodiment improves rendering speed and reduces the performance requirements of the client machine by controlling the number of dynamically generated hot-columns during the rendering process.

[0105] like Figure 5 As shown, the present invention also provides a report display system, the report display system comprising:

[0106] The tag triggering module 10 is used to call the initial report view corresponding to the report call tag when the report call tag referenced in the current page is triggered, wherein the report call tag is set based on a custom report call instruction;

[0107] The instruction lookup module 20 is used to obtain the target report content pointed to by the report call instruction, and traverse the Document Object Model (DOM) of the initialized report view based on the target report content to find the loop output instruction and the report call instruction existing in the DOM.

[0108] The target configuration generation module 30 is used to execute the related operations of the loop output instruction and the report call instruction, generate target hotspot instructions that match the field configuration of the target report content, and generate target report configuration information based on the target hotspot instructions;

[0109] The target report rendering module 40 is used to render the initial report view into a target report view using the target report configuration information and the target report content.

[0110] Optionally, the target hotspot instruction includes a target hotspot table instruction and a target hotspot list instruction, and the target configuration generation module 30 includes:

[0111] The view content insertion unit is used to insert the content of the initialized report view under the report call instruction according to the found report call instruction;

[0112] The target instruction generation unit is used to generate target hotspot table instructions based on the found loop output instructions, and to generate several target hotspot list instructions corresponding to the field configuration under the target hotspot table instructions based on the loop output instructions and the target report content.

[0113] Optionally, the report display system further includes:

[0114] A custom instruction declaration module is used to customize the report call instruction and declare the report call instruction in the DOM in the form of an element.

[0115] The array attribute definition module is used to define the array attributes of the report call command, wherein the array attributes are used to store report content information.

[0116] Optionally, the call instruction lookup module 20 includes:

[0117] The report content acquisition unit is used to acquire the target report content and assign the target report content to the target array attribute of the report call tag;

[0118] The depth-first traversal unit is used to call the compiler function and traverse the DOM in a depth-first manner based on the compiler function.

[0119] Optionally, the target configuration generation module 30 includes:

[0120] The field hot table binding unit is used to obtain the field value of the custom field attribute of the target hot column instruction, and bind the field value and the field value of the target array attribute to the target hot table, wherein several custom field attributes have been added to the scope corresponding to the hot column instruction;

[0121] The connection function execution unit is used to execute the connection function between the target hotspot table instruction and the target hot list instruction to generate the target report configuration information.

[0122] Optionally, the report display system further includes:

[0123] The environment attribute monitoring module is used to monitor the environment attributes of the target hotspot table instruction through a preset monitoring function. The environment attribute is bidirectionally bound to the scope corresponding to the report call instruction, and the field value of the scope corresponding to the report call instruction is the content of the target report.

[0124] The target content detection module is used to determine that a change in the environmental attribute has been detected if a change in the target report content is detected.

[0125] The target configuration update module is used to obtain change information of the target report content and update the target report configuration information based on the change information.

[0126] Optionally, the target report rendering module 40 includes:

[0127] The first rendering determination unit is used to determine whether the target report content is being rendered for the first time;

[0128] The field length truncation unit is used to control the field length of each rendering according to the preset truncation field length when the target report content is rendered on the initial report view using the target report configuration information, and to enter the next field rendering when a specific page scroll event is detected.

[0129] The target content loading unit is used to render all the target report content to the initial report view, so as to fully load the target report view.

[0130] The present invention also provides a report display device.

[0131] The report display device includes a processor, a memory, and a report display program stored in the memory and executable on the processor. When the report display program is executed by the processor, it implements the steps of the report display method described above.

[0132] The method implemented when the report calling and display program is executed can be referred to in various embodiments of the report calling and display method of the present invention, and will not be repeated here.

[0133] The present invention also provides a computer-readable storage medium.

[0134] The present invention provides a report retrieval and display program stored on a computer-readable storage medium, which, when executed by a processor, implements the steps of the report retrieval and display method described above.

[0135] The method implemented when the report calling and display program is executed can be referred to in various embodiments of the report calling and display method of the present invention, and will not be repeated here.

[0136] The present invention also provides a computer program product, including a computer program, which, when executed by a processor, implements the steps of the report call and display method described above.

[0137] The method implemented when the computer program is executed can be referred to in various embodiments of the report call and display method of the present invention, and will not be repeated here.

[0138] It should be noted that, in this document, the terms "comprising," "including," or any other variations thereof are intended to cover non-exclusive inclusion, such that a process, method, article, or system that comprises a list of elements includes not only those elements but also other elements not expressly listed, or elements inherent to such a process, method, article, or system. Unless otherwise specified, an element defined by the phrase "comprising one..." does not exclude the presence of other identical elements in the process, method, article, or system that includes that element.

[0139] The sequence numbers of the above embodiments of the present invention are for descriptive purposes only and do not represent the superiority or inferiority of the embodiments.

[0140] Through the above description of the embodiments, those skilled in the art can clearly understand that the methods of the above embodiments can be implemented by means of software plus necessary general-purpose hardware platforms. Of course, they can also be implemented by hardware, but in many cases the former is a better implementation method. Based on this understanding, the technical solution of the present invention, or the part that contributes to the prior art, can be embodied in the form of a software product. This computer software product is stored in a storage medium (such as ROM / RAM, magnetic disk, optical disk) as described above, and includes several instructions to cause a terminal device (which may be a mobile phone, computer, server, or network device, etc.) to execute the methods described in the various embodiments of the present invention.

[0141] The above are merely preferred embodiments of the present invention and do not limit the scope of the patent. Any equivalent structural or procedural transformations made based on the description and drawings of the present invention, or direct or indirect applications in other related technical fields, are similarly included within the scope of patent protection of the present invention.

Claims

1. A method for calling and displaying reports, characterized in that, The methods for calling and displaying the reports include: When the report call tag referenced on the current page is triggered, the initial report view corresponding to the report call tag is invoked, wherein the report call tag is set based on a custom report call instruction; Obtain the target report content pointed to by the report call instruction, and traverse the Document Object Model (DOM) of the initialized report view based on the target report content to find the loop output instruction and the report call instruction existing in the DOM; Execute the related operations of the loop output instruction and the report call instruction to generate target hotspot instructions that match the field configuration of the target report content, and generate target report configuration information based on the target hotspot instructions; The initial report view is rendered into the target report view using the target report configuration information and the target report content; The target hotspot instructions include target hotspot table instructions and target hotspot list instructions. The step of executing the related operations of the loop output instructions and the report call instructions to generate target hotspot instructions that match the field configuration of the target report content includes: inserting the content of the initialized report view under the report call instructions according to the found report call instructions; generating target hotspot table instructions according to the found loop output instructions; and generating several target hotspot list instructions corresponding to the field configuration under the target hotspot table instructions based on the loop output instructions and the target report content.

2. The report display method as described in claim 1, characterized in that, Before the step of invoking the initial report view corresponding to the report call tag when the report call tag referenced in the current page is triggered, the method further includes: Customize the report calling instruction and declare it in the DOM as an element; Define an array property for the report call command, wherein the array property is used to store report content information.

3. The report display method as described in claim 2, characterized in that, The steps of obtaining the target report content pointed to by the report invocation instruction and traversing the Document Object Model (DOM) of the initialized report view based on the target report content include: Obtain the target report content and assign the target report content to the target array attribute of the report call tag; The compiler function is invoked, and the DOM is traversed in a depth-first manner based on the compiler function.

4. The report display method as described in claim 3, characterized in that, The step of generating target report configuration information based on the target hotspot instruction includes: Obtain the field value of the custom field attribute of the target hot list instruction, and bind the field value and the field value of the target array attribute to the target hot list table. Here, several custom field attributes have been added to the scope corresponding to the hot list instruction. The function that connects the target hotspot table instruction and the target hot list instruction is executed to generate the target report configuration information.

5. The report display method as described in claim 1, characterized in that, After the step of rendering the initial report view into the target report view using the target report configuration information and the target report content, the method further includes: The environment attributes of the target hotspot table instruction are monitored by a preset listening function, wherein the environment attributes are bidirectionally bound to the scope corresponding to the report calling instruction, and the field value of the scope corresponding to the report calling instruction is the content of the target report. If a change in the content of the target report is detected, it is determined that a change in the environmental attribute has been detected. Obtain change information of the target report content, and update the target report configuration information based on the change information.

6. The report display method as described in any one of claims 1-5, characterized in that, The step of rendering the initial report view into a target report view using the target report configuration information and the target report content includes: Determine whether the target report content is being rendered for the first time; If so, when rendering the target report content onto the initialized report view using the target report configuration information, the field length of each rendering is controlled according to the preset field length, and the next field rendering is initiated when a specific page scrolling event is detected. The process continues until all the content of the target report is rendered to the initial report view, thus fully loading the target report view.

7. A report display system, characterized in that, The report display system includes: The tag trigger module is used to invoke the initial report view corresponding to the report call tag when the report call tag referenced on the current page is triggered, wherein the report call tag is set based on a custom report call instruction; The instruction lookup module is used to obtain the target report content pointed to by the report call instruction, and traverse the Document Object Model (DOM) of the initialized report view based on the target report content to find the loop output instruction and the report call instruction existing in the DOM. The target configuration generation module is used to execute the related operations of the loop output instruction and the report call instruction, generate target hotspot instructions that match the field configuration of the target report content, and generate target report configuration information based on the target hotspot instructions. The target hotspot instructions include target hotspot table instructions and target hotspot list instructions. The step of executing the related operations of the loop output instruction and the report call instruction to generate target hotspot instructions that match the field configuration of the target report content includes: inserting the content of the initialized report view under the found report call instruction; generating target hotspot table instructions based on the found loop output instruction; and generating several target hotspot list instructions corresponding to the field configuration under the target hotspot table instructions based on the loop output instruction and the target report content. The target report rendering module is used to render the initial report view into a target report view using the target report configuration information and the target report content.

8. A report display device, characterized in that, The report display device includes: a memory, a processor, and a report display program stored in the memory and executable on the processor. When the report display program is executed by the processor, it implements the steps of the report display method as described in any one of claims 1 to 6.

9. A computer-readable storage medium, characterized in that, The computer-readable storage medium stores a report retrieval and display program, which, when executed by a processor, implements the steps of the report retrieval and display method as described in any one of claims 1 to 6.

Images