Generator for rendering page content based on multi-attribute configuration

Abstract

The invention discloses a generator for rendering page content based on multi-attribute configuration, and the generator comprises a component packaging module which is used for creating corresponding components according to a task process, defining a value attribute, and carrying out the bidirectional communication between the components according to a data monitoring logic; the configuration management module is used for adding configuration information for the component according to the use requirement of a user and generating tree structure data according to the configuration information; the dynamic rendering module is used for calling a corresponding component according to the configuration information and generating a display page through recursive rendering; and the task allocation module is used for carrying out preset calculation based on the equipment attributes and carrying out task allocation according to a calculation result. Two-way communication between the components is achieved through component packaging and data monitoring logic, a large amount of repeated work is not needed any more during attribute updating, preconditions are created for improvement of development efficiency, setting can be conducted for services through configuration management, and system flexibility is improved.

Description

Technical Field

[0001] The present invention relates to the field of generators, and particularly to a generator for rendering page content based on multi-attribute configuration. Background Art

[0002] As an important infrastructure of communication operators, the operating status of telecommunication equipment directly affects the stability of the communication network and the service quality. With the improvement of living standards, the number and types of telecommunication-related equipment are constantly increasing, which puts higher requirements on the inspection work of the equipment. Real-time task arrangement is crucial for ensuring the normal operation of the equipment. It is directly related to the discovery, response, and handling speed of faults, and thus affects the operation efficiency of the entire communication network.

[0003] However, in actual application scenarios, the classification and attributes of telecommunication equipment change frequently, posing a significant challenge to the inspection work. The equipment classification may change continuously according to the update of on-site equipment, and the attributes of equipment under each major classification are numerous and updated rapidly. Due to the lack of structured data and efficient data monitoring logic in the prior art, it is often difficult to cope with such rapid changes. The traditional inspection task arrangement method usually requires a complex update process and is accompanied by a large amount of repetitive work, which not only increases the work burden but also may affect the timeliness and accuracy of information.

[0004] Therefore, a solution with higher development efficiency and flexibility is needed. Summary of the Invention

[0005] Aiming at the problems of low development efficiency and poor flexibility in information processing existing in the prior art, the present invention provides a generator for rendering page content based on multi-attribute configuration, which realizes two-way communication between components through component encapsulation and data monitoring logic. When the attributes are updated, a large amount of repetitive work is no longer required, creating a prerequisite for improving the development efficiency. Through configuration management, settings can be made for the business, improving the system flexibility, and completing human-computer interaction through dynamic rendering and task allocation. The present invention solves the problems of low page rendering efficiency, complex configuration, and poor flexibility.

[0006] The following are the technical solutions of the present invention.

[0007] A generator for rendering page content based on multi-attribute configuration includes: A component encapsulation module, which is used to create corresponding components according to the task process and define value attributes, and at the same time perform two-way communication between components according to the data monitoring logic; A configuration management module, which is used to add configuration information to the components according to the user's usage requirements and generate tree structure data according to the configuration information; a dynamic rendering module, which is used to call the corresponding components according to the configuration information and recursively render to generate a display page; A task allocation module, which is used to perform preliminary calculations based on device attributes and allocate tasks according to the calculation results.

[0008] Preferably, the component encapsulation module includes: A component development module, which is used to create components in the components directory, define the value attribute in props for two-way communication, listen for value changes through watch, synchronize data to the parent component, and bind a unique identifier to each component for dynamic matching configuration; A component registration module, which is used to register the unique identifier of the component to a dictionary to form a mapping relationship between the component type and the code.

[0009] Preferably, the configuration management module includes: A dictionary management module, which is used to add device types in the configuration interface, associate attribute fields, and maintain the component type dictionary at the same time; a template designer module, which is used to generate a tree-like page structure through a recursive algorithm, including using the device classification as the parent title node and the attribute fields as the child content nodes, and configuring the page layout parameters.

[0010] Preferably, the dynamic rendering module includes: A recursive rendering module, which is used to parse the template tree structure data, call the corresponding components layer by layer, and use recursive loops to process nested structures, including rendering multiple child attribute fields under the parent title; A data binding module, which is used to bind the component value to the form object, realize the dynamic binding of form data and the component, and support the one-to-many association logic.

[0011] Preferably, the task allocation module includes: An algorithm decision-making module, which is used to allocate inspection tasks based on device attributes and historical data, input the device priority and failure frequency into the machine learning model, output task allocation suggestions, and perform automatic assignment; A task tracking module, which is used to record the full process data of task execution, obtain the device status in real time through the WebSocket interface, trigger an alarm and dispatch tasks when an exception occurs, record the inspection trajectory at the same time, and generate a traceable task report.

[0012] Preferably, it further includes: a user interface module, which provides a customized design of the user interaction interface, and supports drag-and-drop operations, real-time preview and editing functions.

[0013] Preferably, it further includes: a performance optimization module, which is used to reduce the number of requests by means of resource compression and merging, improve the page loading speed, use the caching mechanism to reduce the server pressure, and improve the secondary access speed.

[0014] Preferably, it further includes: an extensibility module for providing API interfaces and a plug-in mechanism to facilitate integration and extension with other systems and tools.

[0015] Preferably, it further includes: a compatibility module for supporting device screens of different sizes and resolutions through responsive design to ensure consistent display of the page on different devices.

[0016] The substantial effects of the present invention include: Through the component encapsulation module, efficient creation and reuse of components are achieved, significantly improving the page rendering efficiency. Developers can quickly create the required components according to the task process and implement two-way communication between components through data listening logic, thus reducing repetitive development work and enhancing the development efficiency.

[0017] Secondly, the configuration management module makes the configuration process more concise and clear. Users can add configuration information to components according to requirements and generate tree structure data to describe the page structure. This method not only simplifies the configuration process but also reduces the risk of configuration errors.

[0018] The dynamic rendering module can recursively render and generate a display page according to the configuration information, support high-fidelity prototype design and dynamic interaction effects, enhancing the user experience. At the same time, the performance optimization module further optimizes the page performance and reduces the loading time through technical means such as resource compression and merging, browser caching, and CDN acceleration.

[0019] In summary, the present invention solves the problems existing in the prior art, such as low page rendering efficiency, complex configuration, and poor flexibility. Brief Description of the Drawings

[0020] Figure 1 It is the system structure diagram of an embodiment of the present invention. Detailed Embodiments

[0021] To make the objectives, technical solutions, and advantages of the embodiments of the present invention clearer, the following will clearly and completely describe the technical solutions in combination with the embodiments. Obviously, the described embodiments are only some of the embodiments of the present invention, rather than all of them. All other embodiments obtained by those of ordinary skill in the art based on the embodiments of the present invention without creative efforts shall fall within the scope of protection of the present invention.

[0022] It should be understood that in various embodiments of the present invention, the magnitudes of the sequence numbers of the processes do not mean the order of execution is prior or subsequent. The order of execution of each process should be determined according to its function and internal logic, and should not constitute any limitation to the implementation process of the embodiments of the present invention.

[0023] It should be understood that in the present invention, "including" and "having" and any variations thereof are intended to cover non-exclusive inclusion. For example, a process, method, system, product or device that includes a series of steps or units is not necessarily limited to those steps or units clearly listed, but may include other steps or units not clearly listed or inherent to these processes, methods, products or devices.

[0024] It should be understood that in the present invention, "a plurality of" means two or more. "And / or" is merely a description of the association relationship between associated objects, indicating that three relationships may exist. For example, A and / or B may represent: A exists alone, A and B exist simultaneously, and B exists alone. The character " / " generally indicates that the associated objects before and after are in an "or" relationship. "Including A, B, and C" and "including A, B, C" mean that all of A, B, and C are included. "Including A, B, or C" means including one of A, B, and C. "Including A, B, and / or C" means including any one or any two or all three of A, B, and C.

[0025] The technical solution of the present invention will be described in detail below with specific embodiments. The embodiments can be combined with each other, and the same or similar concepts or processes may not be described again in some embodiments.

[0026] Embodiment: A generator for rendering page content based on multi-attribute configuration, as Figure 1 shown, includes a component encapsulation module, a configuration management module, a dynamic rendering module, and a task allocation module. Among them, the component encapsulation module is used to create corresponding components according to the task flow and define the value attribute, and at the same time perform two-way communication between components according to the data listening logic; the configuration management module is used to add configuration information to the components according to the user's usage requirements and generate tree structure data according to the configuration information; the dynamic rendering module is used to call the corresponding components according to the configuration information and recursively render to generate a display page; the task allocation module is used to perform pre-design calculation based on the device attributes and perform task allocation according to the calculation results.

[0027] In this embodiment, the component encapsulation module specifically includes: A component development module, which is used to create components in the components directory, define the value attribute in props for two-way communication, listen for value changes through watch, synchronize data to the parent component, and bind a unique identifier to each component for dynamic matching of configurations; A component registration module, which is used to register the unique identifier of the component to the dictionary to form a mapping relationship between the component type and the code.

[0028] This embodiment uses the Vue framework. The component development module in the component encapsulation module allows for the creation of a component named ProductDisplay in the components directory according to user requirements, and defines the value property in its props to receive form data. By watching for changes in the value property, dynamic updates of the form data can be achieved and synchronized to the parent component. At the same time, the component registration module will register the unique identifier of the ProductDisplay component in the dictionary, forming a mapping relationship between the component type and the code. In this way, in subsequent development, the component can be directly referenced by the identifier without having to rewrite the code, greatly improving the development efficiency.

[0029] Therefore, the component encapsulation module of this embodiment realizes the efficient creation and reuse of components through two sub-modules: component development and registration, reduces code redundancy, and improves development efficiency. At the same time, through the data monitoring and two-way communication mechanism, the real-time synchronization and dynamic update of component data are ensured.

[0030] In this embodiment, the configuration management module specifically includes: The dictionary management module is used to add device types in the configuration interface, associate attribute fields, and maintain the component type dictionary at the same time; the template designer module is used to generate a tree-like page structure through a recursive algorithm, including using the device classification as the parent-level title node and the attribute fields as the child-level content nodes, and configuring the page layout parameters.

[0031] Among them, the dictionary management module in the configuration management module allows users to add user role types in the configuration interface and associate corresponding attribute fields. For example, the "administrator" role may be associated with attribute fields such as "user management" and "permission settings". The template designer module then organizes these attribute fields into a tree-like page structure through a recursive algorithm and configures the page layout parameters. For example, the administrator page may include a top navigation bar, a left menu, and a right content area, while the ordinary user page may only include a top navigation bar and a main content area.

[0032] Therefore, the configuration management module of this embodiment realizes the flexible configuration and dynamic generation of the page structure through two sub-modules: dictionary management and template designer. This can not only meet the needs of different user roles, but also quickly adjust the page layout and functions according to business requirements, improving the flexibility and scalability of the application.

[0033] In this embodiment, the dynamic rendering module specifically includes: The recursive rendering module is used to parse the template tree structure data, layer by layer call the corresponding components, and use recursive loops to process nested structures, including rendering multiple child-level attribute fields under the parent-level title; A data binding module, which is used to bind component values to form objects, realize the dynamic binding of form data and components, and support one-to-many association logic.

[0034] Among them, the recursive rendering module in the dynamic rendering module is responsible for parsing the template tree structure data generated by the configuration management module, and layer by layer calling the corresponding news components for rendering. The data binding module is responsible for binding the values of the components to the form objects, realizing the dynamic binding and display of data. When the user clicks on a certain piece of information, the data binding module will automatically update the currently displayed content.

[0035] Therefore, the dynamic rendering module of this embodiment realizes the dynamic generation and display of page content through two sub-modules: recursive rendering and data binding. This method not only improves the interactivity and user experience of the page, but also enables the page content to be updated and adjusted in real time according to the user's behavior and needs.

[0036] In this embodiment, the task allocation module specifically includes: An algorithm decision-making module, which is used to allocate inspection tasks based on device attributes and historical data. By inputting device priorities and failure frequencies into a machine learning model, it outputs task allocation suggestions for automatic assignment; A task tracking module, which is used to record the whole process data of task execution, obtain the device status in real time through a WebSocket interface, trigger an alarm and dispatch tasks when an exception occurs, and at the same time record the inspection trajectory and generate a traceable task report.

[0037] Among them, the algorithm decision-making module in the task allocation module receives input data such as device priorities and failure frequencies, and calculates task allocation suggestions through a machine learning model. For example, for devices with a high failure frequency, the algorithm decision-making module may suggest increasing the inspection frequency or arranging maintenance personnel for processing first. The task tracking module is responsible for recording the whole process data of task execution and obtaining the device status in real time through a WebSocket interface. When an exception occurs in the device, the task tracking module will trigger an alarm and dispatch tasks to relevant personnel for processing, and at the same time record the inspection trajectory and generate a traceable task report.

[0038] Therefore, the task allocation module of this embodiment realizes the intelligent allocation and real-time tracking of inspection tasks through two sub-modules: algorithm decision-making and task tracking. This method can not only improve the inspection efficiency and quality, but also timely discover and handle device failures, reduce operation risks and maintenance costs. At the same time, the generated traceable task report also provides strong data support for subsequent analysis and optimization.

[0039] In another embodiment, it further includes: a user interface module, which provides a customized design of the user interaction interface, and supports drag-and-drop operations, real-time preview and editing functions.

[0040] In another embodiment, it further includes a performance optimization module, which is used to reduce the number of requests by means of resource compression and merging, improve the page loading speed, utilize the caching mechanism to reduce the server pressure, and improve the secondary access speed.

[0041] In another embodiment, it further includes an extensibility module, which is used to provide API interfaces and plug-in mechanisms for easy integration and extension with other systems and tools.

[0042] In another embodiment, it further includes a compatibility module, which supports device screens of different sizes and resolutions through responsive design to ensure consistent display of the page on different devices.

[0043] The substantial effects of this embodiment include: Through the component encapsulation module, the efficient creation and reuse of components are realized, significantly improving the page rendering efficiency. Developers can quickly create the required components according to the task process and achieve two-way communication between components through the data listening logic, thus reducing the repetitive development work and improving the development efficiency.

[0044] Secondly, the configuration management module makes the configuration process more concise and clear. Users can add configuration information to components according to their needs and generate tree structure data to describe the page structure. This method not only simplifies the configuration process but also reduces the risk of configuration errors.

[0045] The dynamic rendering module can recursively render and generate the display page according to the configuration information, support high-fidelity prototype design and dynamic interaction effects, and improve the user experience. At the same time, the performance optimization module further optimizes the page performance and reduces the loading time through technical means such as resource compression and merging, browser caching, and CDN acceleration.

[0046] In summary, this embodiment seeks a balance among development, operation and maintenance, and on-site personnel; when technicians use this embodiment to implement the relevant task configuration process, the workload and error rate are first reduced, and the overall development progress will be greatly improved. At the same time, when operation and maintenance personnel maintain the current process and encounter the need to add, delete, or modify some link devices proposed by users, they can complete the configuration by themselves through the operation and maintenance manual without seeking the redevelopment or function iteration of developers, greatly saving the system cost. At the same time, on-site task managers can also configure themselves to meet the on-site inspection task functions. Therefore, this embodiment solves the problems existing in the prior art, such as low page rendering efficiency, complex configuration, and poor flexibility.

[0047] From the description of the above embodiments, those skilled in the art can understand that for the convenience and conciseness of description, only the division of the above functional modules is used as an example. In actual applications, the above functions can be allocated to different functional modules as needed, that is, the internal structure of a specific device can be divided into different functional modules to complete all or part of the functions described above.

[0048] In the embodiments provided in the present application, it should be understood that the disclosed structure and method can be implemented in other ways. For example, the embodiments of the structure described above are only illustrative. For example, the division of modules or units is only a logical function division. In actual implementation, there may be other division methods. For example, multiple units or components can be combined or integrated into another structure, or some features can be ignored or not executed. Another point is that the displayed or discussed coupling or direct coupling or communication connection between each other can be through some interfaces, and the indirect coupling or communication connection of structures or units can be in electrical, mechanical or other forms.

[0049] The units described as separate components may or may not be physically separated. The components displayed as units may be one physical unit or multiple physical units, that is, they may be located in one place or distributed to multiple different places. Some or all of the units can be selected according to actual needs to achieve the purpose of the solution of this embodiment.

[0050] In addition, each functional unit in the embodiments of the present application can be integrated into one processing unit, or each unit can exist physically alone, or two or more units can be integrated into one unit. The above integrated unit can be implemented in the form of hardware or in the form of a software functional unit.

[0051] If the integrated unit is implemented in the form of a software functional unit and sold or used as an independent product, it can be stored in a readable storage medium. Based on this understanding, the technical solution of the embodiments of the present application, in essence, or the part that contributes to the prior art, or all or part of the technical solution, can be embodied in the form of a software product. The software product is stored in a storage medium and includes several instructions for causing a device (which can be a single-chip microcomputer, a chip, etc.) or a processor to execute all or part of the steps of the methods of the various embodiments of the present application. The foregoing storage medium includes: USB flash drive, mobile hard disk, read only memory (ROM), random access memory (RAM), magnetic disk or optical disk and other various media that can store program codes.

[0052] The above content is only a specific implementation manner of this application, but the protection scope of this application is not limited thereto. Any person skilled in the art within the technical scope disclosed by this application can easily think of changes or substitutions, which should all be covered within the protection scope of this application. Therefore, the protection scope of this application shall be subject to the protection scope of the claims.

Claims

1. A generator for rendering page content based on multi-attribute configuration, characterized in that: include: The component encapsulation module is used to create corresponding components according to the task flow and define value attributes, and to perform two-way communication between components based on data monitoring logic; The configuration management module is used to add configuration information to the components according to user requirements and generate tree structure data according to the configuration information; the dynamic rendering module is used to call the corresponding components according to the configuration information and recursively render and generate display pages; The task allocation module is used to perform preset calculations based on device attributes and to allocate tasks according to the calculation results.

2. A generator for rendering page content based on multi-attribute configuration according to claim 1, characterized in that: The component packaging module comprises: The component development module is used to create components in the components directory, define the value attribute in props for two-way communication, monitor value changes through watch, synchronize data to the parent component, and bind a unique identifier to each component for dynamic matching configuration; The component registration module is used to register the unique identifier of the component into the dictionary to form a mapping relationship between the component type and the code.

3. A generator for rendering page content based on multi-attribute configuration according to claim 1 or 2, characterized in that: The configuration management module includes: Dictionary management module, used to add new device types in the configuration interface, associate attribute fields, and maintain component type dictionaries; The template designer module is used to generate a tree-like page structure through a recursive algorithm, including device classification as a parent title node, attribute fields as child content nodes, and configure page layout parameters.

4. A generator for rendering page content based on multi-attribute configuration according to claim 1, characterized in that: The dynamic rendering module includes: Recursive rendering module, used to parse template tree structure data, call corresponding components layer by layer, and use recursive loops to process nested structures, including rendering multiple child attribute fields under the parent title; The data binding module is used to bind component values ​​to form objects, realize dynamic binding of form data and components, and support one-to-many association logic.

5. A generator for rendering page content based on multi-attribute configuration according to claim 1, characterized in that: The task allocation module includes: The algorithm decision module is used to allocate inspection tasks based on equipment attributes and historical data. It inputs equipment priority and fault frequency into the machine learning model, outputs task allocation suggestions, and performs automatic assignment. The task tracking module is used to record the data of the entire task execution process, obtain the device status in real time through the WebSocket interface, trigger alarms and dispatch tasks when abnormalities occur, and record inspection tracks to generate traceable task reports.

6. A generator for rendering page content based on multi-attribute configuration according to claim 1, characterized in that: Also includes: The user interface module provides customized design of the user interaction interface and supports drag-and-drop operation, real-time preview and editing functions.

7. A generator for rendering page content based on multi-attribute configuration according to claim 1, characterized in that: Also includes: The performance optimization module is used to reduce the number of requests by compressing and merging resources, improve page loading speed, use the cache mechanism to reduce server pressure, and improve secondary access speed.

8. A generator for rendering page content based on multi-attribute configuration according to claim 1, characterized in that: Also includes: Extensibility modules are used to provide API interfaces and plug-in mechanisms to facilitate integration and expansion with other systems and tools.

9. A generator for rendering page content based on multi-attribute configuration according to claim 1, characterized in that: Also includes: The compatibility module is used to support device screens of different sizes and resolutions through responsive design, ensuring consistent display of pages on different devices.

Images