A method and system for filling in and displaying various types of data of a power system
By constructing a tree structure of hierarchical relationships in the power plant database organization, dynamically configuring indicator information, and utilizing the Table component of element-ui, the problem of displaying and filling in various types of indicator data in the power system was solved, realizing flexible data display and editing functions.
Patent Information
- Application Number
- CN202311136370.3
- Authority / Receiving Office
- CN · China
- Patent Type
- Patents(China)
- Current Assignee / Owner
- Filing Date
- 2023-09-04
- Publication Date
- 2025-11-25
- Estimated Expiration
- 2043-09-04
AI Technical Summary
The existing power system cannot meet the needs of displaying and filling in various types of tree-shaped table data of organizational indicators, especially the dynamic display and configurable display of indicator data.
The system constructs a tree-structured data representation of the organizational hierarchy of the power plant database, dynamically configures and loads indicator information, determines and dynamically displays the data based on its data type, implements the tree-structured table UI format display using the Element-UI Table component, and provides different data entry controls.
It enables flexible display and data entry of various types of indicators in the power system, can be dynamically configured according to business needs, supports multiple display formats such as text, numbers, time, drop-down and files, and determines the editing or data entry capability based on the cell status.
Smart Images

Figure CN117194748B_ABST
Abstract
Description
TECHNICAL FIELD
[0001] The application belongs to the technical field of front-end display of computer application, and particularly relates to a power system various type data filling and display method. BACKGROUND
[0002] There are various monitoring index data in the power industry system, which need to be statistically calculated and classified displayed, and part of the data needs to be filled or edited. Under this demand background, currently, a plurality of manufacturers provide some system solutions to solve the display and statistics of various index data of the power system.
[0003] Usually, these power systems can only meet one or part of the needs, and the needs of the tree table data of the organization index data and the filling and reporting scheme of multiple types of display cannot be met, and the configurable index data display cannot be dynamically displayed. SUMMARY
[0004] The purpose of the application is to provide a power system various type data filling and display method, which realizes the display and filling of multiple types of tree table data of organization index data.
[0005] To achieve the above purpose, the application adopts the following technical solutions:
[0006] The first aspect of the application is to provide a power system various type data filling and display method, comprising:
[0007] A tree structure data is constructed according to the organization level relationship of the power plant database;
[0008] According to different business needs, the index information and the corresponding index data are dynamically configured and loaded,
[0009] According to different organization information and index information, the corresponding index value data is read from the database, and then processed, filtered and combined into tree structure table data;
[0010] The data type of the index data is judged;
[0011] According to the different data types, the data is dynamically displayed, and according to the expansion information of the index, the tree structure table data displays different UI formats for different column data, and different filling controls are displayed for the cell data that can be filled. For part of the business functions, the row and column conversion display related data function is provided.
[0012] As a further improvement of the application, the column of the tree structure organization data is the tree table JSON data of the index information.
[0013] As a further improvement of the application, the dynamic display according to different data types refers to:
[0014] According to the returned tree table JSON data, the relevant data is displayed through the Table component based on element-ui.
[0015] As a further improvement of the application, the different UI format display for different column data specifically includes:
[0016] The tree structure table data is displayed on the page, and the index data of the business is loaded; the tree table data is obtained according to the query condition, including the organization information and the corresponding index data, and then different UI formats are analyzed and displayed;
[0017] The column of the table displays index information, the list header includes index name, index unit, and description information of the index when the mouse moves to the index header; the cell content of the table displays the index value information corresponding to the organization.
[0018] As a further improvement of the application, the different UI format display for different column data includes shrinking data, displaying data, and lazy loading mode to expand sub-level data.
[0019] As a further improvement of the application, the data type of the index data includes text, number, time, drop-down, and file, and the display includes text display, number display, time display, file display, and rich text display, and according to the state of the cell, it is determined whether the cell can be edited or reported;
[0020] The type of the cell corresponds to editable or reportable and display, and the column data will display different background colors according to the state.
[0021] As a further improvement of the application, the tree structure table data displays different UI formats for different column data, including:
[0022] When the index data type is text, too much text is automatically omitted according to the column width, the complete information is displayed in a tooltip manner by detecting the mouse position;
[0023] When the index data type is number, the decimal point digit processing is performed according to the formatting field of the index, including retaining a set number of decimal places and supplementing the decimal point digit processing;
[0024] When the index data type is time, the time format is automatically formatted and displayed, and when reporting, a time control is automatically displayed;
[0025] When the index data type is drop-down data, the value of the drop-down data is automatically displayed, and when reporting, a drop-down box and related data are automatically displayed;
[0026] When the index data type is a file, a browse button is displayed, and the user can view the file online or download the browse file, and when filling in the report, an upload button and a delete button are displayed, and an upload and delete file operation interface is displayed.
[0027] The second aspect of the present application provides a power system various types of data reporting and display system, comprising:
[0028] The construction module is configured to construct tree structure data according to the hierarchical relationship of the power plant database organization;
[0029] The configuration module is configured to dynamically configure and load index information and corresponding index data according to different business requirements,
[0030] The combination module is configured to read corresponding index value data from the database according to different organization information and index information, and then process, filter and combine the tree structure table data;
[0031] The judgment module is configured to judge the data type of the index data;
[0032] The display module is configured to dynamically display according to the different data types, and display different UI formats for different column data according to the extension information of the index and the tree structure table data, and display different reporting controls for the cell data that can be reported; for part of the business functions, the row and column conversion display related data function is provided.
[0033] The third aspect of the present application provides an electronic device, comprising a memory, a processor and a computer program stored in the memory and executable on the processor, and the processor executes the computer program to realize the power system various types of data reporting and display method.
[0034] The fourth aspect of the present application provides a computer readable storage medium, the computer readable storage medium stores a computer program, and the computer program is executed by the processor to realize the power system various types of data reporting and display method.
[0035] Compared with the prior art, the present application has at least the following beneficial technical effects:
[0036] The application constructs tree-shaped JSON data according to the tree structure of the power plant organization, realizes tree-shaped indentation and free contraction and expansion display through the Table component of element-ui, dynamically configures the indicators of the power system according to different business needs, the front end can dynamically display the related indicator information according to different business indicator data, the back end constructs a complete tree-shaped JSON table structure data according to different organization levels and the obtained indicator data, the front end displays the data table according to the data returned by the back end, the front end can present different UI effects according to the expansion information of the indicators, such as text display, digital display, time display, file display and rich text display, and can determine whether the cell can be edited or reported according to the state of the cell. The method realizes flexible display and reporting editing of various types of indicator data of the power system. BRIEF DESCRIPTION OF DRAWINGS
[0037] In order to more clearly illustrate the technical solutions in the embodiments of the present application, the drawings needed to be used in the embodiments or prior art description will be briefly introduced. Obviously, the drawings in the following description are only some embodiments of the present application, and other drawings can be obtained by those skilled in the art without creative labor.
[0038] Figure 1 is the overall flowchart of the power system various types of data reporting and display method of the present application;
[0039] Figure 2 is the system structure schematic diagram of the power system various types of data reporting and display system of the preferred embodiment of the present application. DETAILED DESCRIPTION
[0040] The present application will be described in detail below with reference to the drawings and in combination with the embodiments. It should be noted that the embodiments in the present application and the features in the embodiments can be combined with each other without conflict.
[0041] The following detailed description is exemplary description, which is intended to provide further detailed description of the present application. Unless otherwise specified, all technical terms used in the present application are the same as the meanings generally understood by those skilled in the art to which the present application belongs. The terms used in the present application are only for describing specific real-time manner, and are not intended to limit the exemplary embodiments according to the present application.
[0042] As shown in Figure 1 , the present application provides a power system various types of data reporting and display method, comprising:
[0043] S1, constructing tree-shaped structure data according to the organization level relationship of the power plant database;
[0044] S2, according to different business requirements, dynamically configure the index information and the corresponding index data,
[0045] S3, according to different organization information and index information, read the corresponding index value data from the database, and then process and filter the table data in a tree structure;
[0046] S4, judge the data type of the index data;
[0047] S5, dynamically display according to the different data types, and display different UI formats for different column data according to the extension information of the index and the table data in a tree structure, and display different reporting controls for the cell data that can be reported; for some business functions, provide row and column conversion display related data functions.
[0048] The present application can present different UI effects according to the extension information of the index, such as text display, numerical display, time display, file display and rich text display, and can determine whether the cell can be edited or reported according to the state of the cell. The method realizes flexible display and reporting editing of various types of index data of the power system.
[0049] Optionally, the tree table data is displayed on the page, specifically including:
[0050] The content of the present application will be described in detail below in combination with specific embodiments.
[0051] As shown in Figure 1 , the present application provides a method and system for realizing reporting and display of various types of data of the power system based on element-ui, including:
[0052] The tree-shaped JSON data is constructed according to the tree structure of the power plant organization, and the Table component of element-ui is used to realize the tree-shaped indentation and free expansion and contraction display;
[0053] According to different business requirements, the indexes of the power system are dynamically configured, and the front end can dynamically display the related index information according to different business index data;
[0054] The back end constructs a complete tree-shaped JSON table structure data according to different organization levels and obtained index data, and the front end displays according to the data returned by the back end;
[0055] The front end display data table can present different UI effects according to the extension information of the index, such as text display, numerical display, time display, file display and rich text display, and can determine whether the cell can be edited or reported according to the state of the cell.
[0056] The tree-shaped JSON data is constructed according to the tree structure of the power plant organization, and the tree-shaped indentation and free expansion display are realized through the Table component of element-ui, and specifically include:
[0057] The backend program first reads and loads the organization data, then loads the index information and the corresponding index data according to the business configuration, and then processes and filters to combine a table data in a tree structure.
[0058] According to the database organization level relationship, the organization tree structure data is read and loaded, then the index data and its related expansion information are read and loaded according to the business configuration, then the corresponding index value data is read from the database according to different organization information and index information, then a row of tree structure organization data and a column of index information tree table JSON data are combined, the front end displays the relevant data through the Table component based on element-ui according to the returned JSON table data, and dynamically displays according to different indicators, then according to the expansion information of the index, different UI format display is performed on different column data, different reporting controls are displayed for the cell data that can be reported, and the user is facilitated to report operation. For some business functions, row and column conversion display related data functions are provided.
[0059] As a specific scheme, the tree structure table data is displayed on the page, specifically including:
[0060] The front end first loads the index data of the business, then obtains the tree table data according to the query conditions, including organization information and the corresponding index data, and then analyzes and displays different UI interfaces according to these data.
[0061] The data is displayed in the form of a table on the page, and the row data of the table displays the tree structure of the organization, which can be collapsed and displayed. In order to improve performance, the lazy loading mode is also supported to expand the child data. The column of the table displays the index information, and the column header includes the index name, the index unit, and the description information of the index when the mouse moves to the index header. The cell content of the table displays the index value information corresponding to the organization.
[0062] Exemplarily, according to the related expansion information of the index, the table cell content presents different UI effects, including the following steps:
[0063] The types of the index include text, number, time, drop-down, and file, the types of the cell include editable or reportable and display, and the column data will display different background colors according to the state;
[0064] When the index data type is text, too much text is automatically omitted according to the column width, and the complete information is displayed in a tooltip mode by mouse hovering, so that the interface table is beautiful and easy to view.
[0065] When the index data type is a number, the decimal point digit is processed according to the formatting field of the index, including the reserved decimal place and the supplement of the decimal point digit.
[0066] When the index data type is a time type, the time format is automatically formatted and displayed, and a time control is automatically displayed when filling in the report, so as to facilitate user operation and selection of time.
[0067] When the index data type is a drop-down data, the value of the drop-down data is automatically displayed, and a drop-down box and related data are automatically displayed when filling in the report, so as to facilitate user selection of drop-down data.
[0068] When the index data type is a file, a browse button is displayed, the user can view the file online or download the browse file, and when filling in the report, an upload button and a delete button are displayed, so that the file can be uploaded and deleted.
[0069] As shown in Figure 2 From the performance display aspect, the application is based on a configuration file dynamic loading function page system, which comprises:
[0070] An index information configuration module is used for newly creating and editing index data information and extended information related to various types of power systems.
[0071] A table data construction module is used for reading and loading organization data by a back-end program, then loading index information and corresponding index data according to business configuration, and then processing, filtering and combining into a table data of a tree structure.
[0072] A table data display module is used for displaying data in the form of a table, the row data of the table displays a tree structure of an organization, and the data can be contracted and displayed, in order to improve performance, the table also supports lazy loading to expand sub-level data. The column of the table displays index information, the list header contains an index name, an index unit and description information of the index when the mouse is moved to the index header. The cell content of the table displays index value information corresponding to the organization.
[0073] A table data filling module is used for displaying a control matched with the data type on the table according to the data type of the index and the editable state of the cell, so as to facilitate and standardize the filling of user data.
[0074] The table data display module is specifically used for:
[0075] The backend program first reads and loads organization data, then loads index information and corresponding index data according to business configuration, and then processes and filters to combine into table data in a tree structure;
[0076] The interface displays data in the form of a table, and the row data of the table displays the tree structure of the organization, which can be contracted and displayed. In order to improve performance, the lazy loading method is also supported to expand the child data. The column of the table displays the index information, the table header includes the index name, the index unit, and the description information of the index when the mouse is moved to the index table header. The cell content of the table displays the index value information corresponding to the organization.
[0077] The table data filling module, specifically used for:
[0078] The type of the index includes text, number, time, drop-down, and file. The type of the cell includes editable or fillable and display. The column data will display different background colors according to the state.
[0079] When the data type of the index is text, too much text will be automatically omitted according to the column width, and the complete information will be displayed through the tooltip method when the mouse is placed, so as to ensure that the interface table is beautiful and easy to watch.
[0080] When the data type of the index is number, the decimal point processing will be performed according to the formatting field of the index, including the reserved decimal place and the complete decimal point processing.
[0081] When the data type of the index is time, the time format will be automatically formatted and displayed, and the time control will be automatically displayed when filling, which is convenient for users to select time.
[0082] When the data type of the index is drop-down data, the value of the drop-down data will be automatically displayed, and the drop-down box and related data will be automatically displayed when filling, which is convenient for users to select drop-down data.
[0083] When the data type of the index is file, the browse button will be displayed, the user can online view the file or download the browse file, and when filling, the upload button and the delete button will be displayed, the file can be uploaded and deleted.
[0084] The method of the application will be described in detail in combination with specific embodiments:
[0085] According to the business requirements, the related index data and the related information thereof are created first, which include the index data type, the formatting mode, the index description and the like. Then, the corresponding organization information and the obtained index data are loaded according to the user role and the right, a complete tree-shaped json table structure data is constructed, the front end is displayed according to the data returned by the back end, the front end displays the data table, different UI effects can be presented according to the expansion information of the index, including the text display, the digital display, the time display, the file display and the rich text display, and whether the cell can be edited or reported can be determined according to the state of the cell.
[0086] Therefore, a second object of the present application is to provide a power system various type data reporting and display system, comprising:
[0087] The construction module is configured to construct the tree-shaped structure data according to the organization hierarchy relationship of the power plant database.
[0088] The configuration module is configured to dynamically configure and load the index information and the corresponding index data according to different business requirements.
[0089] The combination module is configured to read the corresponding index value data from the database according to the different organization information and the index information, and then process, filter and combine the index value data into the table data in the tree-shaped structure.
[0090] The judgment module is configured to judge the data type of the index data.
[0091] The display module is configured to dynamically display according to the different data types, and display the different column data in different UI formats according to the expansion information of the index and the table data in the tree-shaped structure, and display different reporting controls for the cell data that can be reported. For some business functions, the row-column conversion display related data function is provided.
[0092] A third object of the present application is to provide an electronic device, comprising a memory, a processor and a computer program stored in the memory and executable on the processor, wherein the processor executes the computer program to realize the power system various type data reporting and display method.
[0093] A fourth object of the present application is to provide a computer readable storage medium, which stores a computer program, wherein the computer program is executed by a processor to realize the power system various type data reporting and display method.
[0094] Those skilled in the art will appreciate that embodiments of the present application can be readily used as a method, a system or a computer program product. Accordingly, the present application can take the form of an entirely hardware embodiment, an entirely software embodiment or an embodiment combining software and hardware aspects. Furthermore, the present application can take the form of a computer program product on one or more computer-usable storage media (including, but not limited to, disk storage, CD-ROMs, optical storage devices, etc.) embodying computer readable program code.
[0095] The present application is described in reference to the flowchart illustrations and / or block diagrams of methods, apparatus (systems) and computer program products according to embodiments of the application. It will be understood that each block of the flowchart illustrations and / or block diagrams, and combinations of blocks in the flowchart illustrations and / or block diagrams, can be implemented by computer program instructions. These computer program instructions can be provided to a processor of a general purpose computer, special purpose computer, embedded processor or other programmable data processing apparatus to produce a machine, such that the instructions, which execute via the processor of the computer or other programmable data processing apparatus, create means for implementing the functions specified in the flowchart illustrations and / or block diagrams block or blocks. Figure 1 one or more functions specified in the flowchart illustrations and / or block diagrams block or blocks. Figure 1 one or more functions specified in the flowchart illustrations and / or block diagrams block or blocks.
[0096] These computer program instructions can also be stored in a computer- readable memory that can direct a computer or other programmable data processing apparatus to function in a particular manner, such that the instructions stored in the computer-readable memory produce an article of manufacture including instructions which implement the function specified in the flowchart illustrations and / or block diagrams block or blocks. Figure 1 one or more functions specified in the flowchart illustrations and / or block diagrams block or blocks. Figure 1 one or more functions specified in the flowchart illustrations and / or block diagrams block or blocks.
[0097] These computer program instructions can also be loaded onto a computer or other programmable data processing apparatus to cause a series of operational steps to be performed on the computer or other programmable apparatus to produce a computer implemented process such that the instructions which execute on the computer or other programmable apparatus provide steps for implementing the functions specified in the flowchart illustrations and / or block diagrams block or blocks. Figure 1 one or more functions specified in the flowchart illustrations and / or block diagrams block or blocks. Figure 1 one or more functions specified in the flowchart illustrations and / or block diagrams block or blocks.
[0098] In the embodiments of the present application, it should be understood that the disclosed devices, apparatuses and methods can be implemented in other ways. For example, the above-described device embodiments are merely schematic, for example, the division of the modules is merely a logical function division, and there can be another division manner in actual implementation; the modules illustrated as separate components can or can not be physically separate, and the components illustrated as modules can or can not be physical units, i.e., can be located in one place or distributed on a plurality of network units. In actual implementation, some or all of the modules can be selected according to the actual needs to implement the purposes of the embodiments of the method.
[0099] It is apparent for those skilled in the art that the present application is not limited to the details of the above exemplary embodiments, and the present application can be implemented in other concrete forms without departing from the spirit or essential characteristics of the present application.
[0100] Therefore, no matter from which point of view, the embodiments should be regarded as exemplary and non-limiting, and the scope of the present application is defined by the appended claims rather than the above description, and it is intended to include all changes falling within the meaning and scope of the equivalent elements of the claims. Any reference signs in the claims should not be regarded as limiting the claims to which they relate.
[0101] In addition, it is clear that the word "comprising" does not exclude other units or steps, and the singular does not exclude the plural. The plurality of units or devices stated in the system claims can also be implemented by one unit or device through software or hardware. The second word is used to indicate the name and does not mean any specific order.
[0102] Finally, it should be noted that the above embodiments are merely used to illustrate the technical solutions of the present application but not limit the present application, and finally it should be noted that: the above embodiments are merely used to illustrate the technical solutions of the present application but not limit the present application, although the present application is described in detail with reference to the above embodiments, those skilled in the art should understand that the specific embodiments of the present application can be modified or replaced by the same, without departing from the spirit and scope of the present application, any modification or equivalent replacement thereof should be covered in the protection scope of the claims of the present application.
Claims
1. A method for filling in and displaying various types of data of a power system, characterized in that, The method comprises the following steps: constructing tree structure data according to the organization hierarchy relationship of the power plant database; According to different business needs, dynamically configure and load index information and corresponding index data, According to different organization information and index information, read the corresponding index value data from the database, and then process, filter and combine into tree structure table data; Determine the data type of the index data; According to the different data types, dynamically display, and according to the expansion information of the index, the tree structure table data displays different UI formats for different column data, and displays different reporting controls for cell data that can be reported; For some business functions, provide row and column conversion display related data functions; The different UI formats for different column data include: Display tree structure table data on the page and load business index data; obtain tree table data according to the query condition, including organization information and corresponding index data, and then analyze and display different UI formats; The column of the table displays index information, and the list header includes index name, index unit, and description information of the index displayed when the mouse moves to the index header; the cell content of the table displays the index value information corresponding to the organization; The data type of the index data includes text, number, time, drop-down, and file, and the display includes text display, number display, time display, file display, and rich text display, and according to the state of the cell, it is determined whether the cell can be edited or reported; The types of the cells include editable or reportable and display, and the column data will display different background colors according to the state; The tree structure table data displays different UI formats for different column data, including: When the index data type is text, automatically omit too much text according to the column width, and display the complete information in the tooltip mode by detecting the mouse position; When the index data type is number, process the decimal point according to the formatting field of the index, including retaining a certain number of decimal places and supplementing the decimal point; When the index data type is time, automatically format the time format, and automatically display the time control when reporting; When the index data type is drop-down data, automatically display the value of the drop-down data, and automatically display the drop-down box and related data when reporting; When the index data type is file, display the browse button, and the user can view the file online or download the file for browsing, and when reporting, display the upload button and the delete button to display the upload and delete file operation interface.
2. The method of claim 1, wherein, The column of the tree structure organization data is the tree table JSON data of the index information.
3. The method of claim 1, wherein, The dynamic display according to the different data types is: According to the returned tree table JSON data, display the related data through the Table component based on element-ui.
4. The method of claim 1, wherein, The different UI formats for different column data include shrinking data, displaying data, and expanding child data in a lazy loading mode.
5. A power system various type data filling and displaying system based on the power system various type data filling and displaying method of any one of claims 1-4, characterized in that, The method comprises the following steps: constructing module, for constructing tree structure data according to the organization hierarchy relationship of the power plant database; The configuration module is configured to dynamically configure the loading index information and corresponding index data according to different service requirements, The combination module is configured to read corresponding index value data from the database according to different organization information and index information, and then process and filter the index value data into table data in a tree structure; The judgment module is configured to judge the data type of the index data; The display module is configured to dynamically display according to the different data types, and display different UI formats for different column data according to the extension information of the index and the table data in the tree structure, and display different reporting controls for the cell data that can be reported; for some business functions, the row and column conversion display related data function is provided. 6.An electronic device, comprising a memory, a processor, and a computer program stored in the memory and executable on the processor, wherein the processor implements the power system data reporting and display method of any one of claims 1-4 when executing the computer program. 7.A computer readable storage medium, storing a computer program, wherein the computer program is executed by a processor to implement the power system data reporting and display method of any one of claims 1-4.
Citation Information
Patent Citations
Method and system for dynamically loading functional page based on configuration file
CN114637951A
Dynamic form generation method based on data driving
CN115495072A