Equipment state monitoring method and device, storage medium and electronic equipment

Abstract

The invention relates to an equipment state monitoring method and device, a storage medium and electronic equipment, and relates to the technical field of industrial equipment monitoring, and the method comprises the steps: obtaining a primitive corresponding to a monitoring interface of industrial equipment, determining an attribute entity corresponding to the primitive, the attribute entity being used for storing state information and attribute data of the primitive, and the primitive comprising an SVG primitive; in response to the received device message of the industrial device, updating the attribute entity through the ModelView layer according to the device message; updating a primitive corresponding to the monitoring interface through a View class according to the updated attribute entity, the View class being used for rendering the primitive; and displaying the equipment state of the industrial equipment by using the updated primitives in the monitoring interface. According to the application, the architecture design of communication message driving data, data driving primitive attributes and attribute driving primitive rendering is realized, the coupling of the system is reduced, and the flexibility and expansibility are improved.

Description

Technical Field

[0001] This application relates to the field of industrial equipment monitoring technology, specifically to a method, device, storage medium, and electronic equipment for monitoring equipment status. Background Technology

[0002] Industrial equipment monitoring is a system solution that uses technical means to collect and analyze the operating data of industrial equipment in real time, so as to realize equipment status monitoring, fault early warning, remote control and operation and maintenance management. Its core objective is to ensure stable equipment operation, improve production efficiency and reduce downtime losses.

[0003] Currently, in equipment monitoring, relevant technologies typically create or specify specific element attributes based on real-time message values ​​to achieve changes in element characteristics. While this method can achieve basic monitoring functions, the tight binding between elements and entity data results in significant deficiencies in system flexibility and scalability. Summary of the Invention

[0004] In view of this, this application provides a device, apparatus, storage medium and electronic device for monitoring device status, the main purpose of which is to solve the technical problem that the system has significant deficiencies in flexibility and scalability due to the tight binding of graphic elements and entity data.

[0005] According to a first aspect of this application, a device status monitoring method is provided, the method comprising: The monitoring interface of industrial equipment is obtained, and the attribute entity corresponding to the graphic element is determined. The attribute entity is used to store the status information and attribute data of the graphic element. The graphic element includes SVG graphic elements. In response to receiving a device message from the industrial equipment, the attribute entity is updated through the ModelView layer based on the device message; The View class updates the corresponding graphic elements of the monitoring interface based on the updated attribute entities, and the View class is used to render the graphic elements; The updated graphic elements in the monitoring interface are used to display the equipment status of the industrial equipment.

[0006] According to a second aspect of this application, a device for monitoring equipment status is provided, the device comprising: The acquisition module is used to acquire the graphic elements corresponding to the monitoring interface of the industrial equipment, determine the attribute entities corresponding to the graphic elements, and the attribute entities are used to store the status information and attribute data of the graphic elements. The graphic elements include SVG graphic elements. The update module is used to respond to the received device message from the industrial equipment by updating the attribute entity according to the device message through the ModelView layer; updating the corresponding graphic elements of the monitoring interface according to the updated attribute entity through the View class, the View class being used to render the graphic elements; and displaying the device status of the industrial equipment using the updated graphic elements in the monitoring interface.

[0007] According to a third aspect of this application, an electronic device is provided, comprising: at least one processor; and a memory communicatively connected to the at least one processor; wherein the memory stores instructions executable by the at least one processor, the instructions being executed by the at least one processor to enable the at least one processor to perform the method of the first aspect described above.

[0008] According to a fourth aspect of this application, a non-transitory computer-readable storage medium is provided storing computer instructions, wherein the computer instructions are used to cause a computer to perform the method of the first aspect described above.

[0009] Compared with related technologies, the equipment status monitoring method, apparatus, storage medium, and electronic device provided in this application acquire the graphic elements corresponding to the monitoring interface of industrial equipment, determine the attribute entities corresponding to the graphic elements, and the attribute entities are used to store the status information and attribute data of the graphic elements. The graphic elements include SVG graphic elements. In response to receiving equipment messages from the industrial equipment, the attribute entities are updated according to the equipment messages through the ModelView layer. The graphic elements corresponding to the monitoring interface are updated according to the updated attribute entities through the View class, and the View class is used to render the graphic elements. The equipment status of the industrial equipment is displayed using the updated graphic elements in the monitoring interface. In this way, real-time response to equipment messages can be achieved. The attribute entities corresponding to the graphic elements are updated through the ModelView layer, and the graphic elements in the monitoring interface are updated through the View class. This realizes an architecture design where communication messages drive data, data drives graphic element attributes, and attributes drive graphic element rendering, effectively reducing system coupling and significantly improving flexibility and scalability. Attached Figure Description

[0010] The accompanying drawings, which are incorporated in and form part of this specification, illustrate embodiments consistent with this application and, together with the description, serve to explain the principles of this application.

[0011] To more clearly illustrate the technical solutions in the embodiments of this application or related technologies, the accompanying drawings used in the description of the embodiments or related technologies will be briefly introduced below. Obviously, those skilled in the art can obtain other drawings based on these drawings without creative effort.

[0012] Figure 1 A flowchart illustrating a device status monitoring method provided in an embodiment of this application; Figure 2 This is a schematic diagram of the structure of a device status monitoring device provided in an embodiment of this application. Detailed Implementation

[0013] The following description, in conjunction with the accompanying drawings, illustrates exemplary embodiments of this application, including various details to aid understanding. These should be considered merely exemplary. Therefore, those skilled in the art will recognize that various changes and modifications can be made to the embodiments described herein without departing from the scope and spirit of this application. Similarly, for clarity and brevity, descriptions of well-known functions and structures are omitted in the following description. It should be noted that, unless otherwise specified, the embodiments and features described herein can be combined with each other.

[0014] Current technologies based on Scalable Vector Graphics (SVG) for device monitoring typically create or specify specific primitive attributes based on real-time message values ​​to achieve changes in primitive characteristics. While this method enables basic monitoring functions, the tight coupling between primitives and entity data leads to significant limitations in system flexibility and scalability. This tight coupling restricts developers' freedom in system upgrades and feature expansions, making it difficult for the system to adapt quickly to constantly changing industrial needs. Furthermore, this design pattern easily leads to performance bottlenecks when handling complex data streams and diverse monitoring requirements, increasing the difficulty of system optimization. For example, in high-concurrency or large-data-volume scenarios, the system may experience slow response times or excessive resource consumption, impacting the overall efficiency and reliability of the industrial system. Therefore, seeking an innovative architecture that decouples data and primitives is crucial for improving the flexibility, scalability, and performance optimization capabilities of monitoring systems.

[0015] The following description, with reference to the accompanying drawings, describes a device status monitoring method, apparatus, storage medium, and electronic device according to embodiments of this application.

[0016] This application provides a method, apparatus, storage medium, and electronic device for monitoring device status. Its main purpose is to solve the technical problem that the system often suffers from significant deficiencies in flexibility and scalability due to the tight binding of graphic elements and entity data.

[0017] like Figure 1 As shown, an embodiment of this application provides a device status monitoring method, including: Step 101: Obtain the graphic elements corresponding to the monitoring interface of the industrial equipment and determine the attribute entities corresponding to the graphic elements.

[0018] In some embodiments, attribute entities are used to store the status information and attribute data of graphic elements. Graphic elements include SVG graphic elements. In the industrial equipment monitoring interface, graphic elements are the basic graphic elements that constitute the monitoring screen (such as equipment icons, pipes, instruments, etc.), while attribute entities are data structures (or database entities) that store the status information and attribute data of these graphic elements.

[0019] Specifically, in industrial monitoring scenarios, graphical elements refer to visual elements in the monitoring interface used to represent industrial equipment, facilities, connections, or status indicators. They can be drawn based on SVG format, leveraging SVG's vector characteristics to ensure clear scaling and supporting dynamic attribute modification. Element names can include: equipment elements, representing specific industrial equipment (such as pumps, valves, motors, reactors, sensors, etc.); connection elements, representing physical connections between equipment (such as pipes, cables, conveyor belts, etc.); status elements, representing status indicators (such as indicator lights, dashboards, progress bars, etc.); and area elements, representing physical areas (such as workshops, production lines, tank areas, etc.). Attribute entities are used to store the static attributes (such as equipment number, specifications) and dynamic status (such as operating temperature, pressure, fault codes) of the graphical elements. For example, each graphical element can correspond to an independent Model to ensure data accuracy and real-time performance.

[0020] Step 102: In response to receiving the device message from the industrial equipment, update the attribute entity through the ModelView layer based on the device message.

[0021] In some embodiments, an industrial equipment monitoring system can first be built based on an MVVM architecture. Through a decoupled layered design, real-time equipment data is efficiently synchronized to attribute entities, providing a data foundation for subsequent view updates (such as changes in element state). Specifically, equipment messages can be real-time data sent by industrial equipment via sensors, PLCs, or IoT gateways. The ModelView layer, acting as an intermediary layer, is responsible for receiving equipment messages, parsing data, calling Model layer interfaces to update attribute entities, and encapsulating attribute entities into observable objects. When the Model layer returns the updated entity, it automatically triggers state changes in the observable objects, isolating equipment message processing from UI rendering. Automatic notification of data changes is achieved through observable objects, ensuring real-time synchronization between the UI and equipment state. Optionally, the ModelView layer can also be used for data parsing and validation, parsing equipment messages into structured data (such as extracting deviceId, parameter name param, and value), and validating the structured data's validity (such as whether the device ID exists and whether the parameters are within a preset range).

[0022] Step 103: Update the corresponding graphic elements on the monitoring interface using the View class based on the updated attribute entities.

[0023] In some embodiments, the View class is used to render primitives. By listening to changes in attribute entities, it monitors whether attribute entities are updated, dynamically renders and updates the SVG primitives of the monitoring interface based on the updated attribute entities, and automatically updates the corresponding primitive styles (colors, shapes, etc.), statuses, or texts. It can also be used to initialize the basic primitives of the monitoring interface (such as loading SVG templates and creating primitive instances such as pumps, valves, and sensors).

[0024] Step 104: Use the updated graphic elements in the monitoring interface to display the equipment status of the industrial equipment.

[0025] In some embodiments, the updated graphic elements intuitively display the status of industrial equipment through visual differentiation design (color, animation, text, icons), allowing maintenance personnel to quickly identify normal, abnormal, and faulty operating conditions. For example, different equipment statuses (such as normal, abnormal, faulty, and shutdown) can correspond to different visual identifiers (such as color and animation). When the dynamic fields of the attribute entity (such as temperature and pressure) change, the attributes of the SVG graphic element (such as color, text, and shape) are modified via JavaScript to achieve real-time updates to the monitoring interface (for example, when the temperature exceeds the upper limit, the fill color of the sensor graphic element changes from red to yellow and flashes). In this way, the graphic element status is dynamically bound to the attribute entity, and the monitoring interface is updated in real time after the equipment status changes to display the equipment status of multiple industrial devices in real time.

[0026] Compared with related technologies, this embodiment acquires the graphical elements corresponding to the monitoring interface of industrial equipment, determines the attribute entities corresponding to the graphical elements, and stores the status information and attribute data of the graphical elements. The graphical elements include SVG graphical elements. In response to receiving equipment messages from the industrial equipment, the attribute entities are updated according to the equipment messages through the ModelView layer. The graphical elements corresponding to the monitoring interface are updated through the View class according to the updated attribute entities. The View class is used to render the graphical elements. The equipment status of the industrial equipment is displayed using the updated graphical elements in the monitoring interface. In this way, real-time response to equipment messages can be achieved. The ModelView layer updates the attribute entities corresponding to the graphical elements, and the View class updates the graphical elements in the monitoring interface. This realizes an architecture design where communication messages drive data, data drives graphical element attributes, and attributes drive graphical element rendering. This effectively reduces the coupling of the system and significantly improves flexibility and scalability.

[0027] Based on the technical implementation shown in the above embodiments, in order to further illustrate the specific implementation process of the method in this embodiment, the attribute entity corresponding to the graphic element is determined, including: based on the strong typing and object-oriented characteristics of TypeScript, the attribute entity corresponding to the graphic element is determined, and the interface corresponding to the attribute entity is constructed. The interface is used to ensure the standardization and consistency of the Model object.

[0028] Specifically, the attribute entities of the graphic elements corresponding to industrial equipment share commonalities (such as unique identifiers and types) and unique characteristics (such as pump speed and sensor measurement range). Based on TypeScript's strong typing and object-oriented features, common fields can be defined through a basic interface, and characteristic fields can be extended through sub-interfaces inheriting from the basic interface. This achieves code reuse and clear hierarchy, and explicitly defines the field types (such as string, number, boolean) and whether they are required (for non-optional fields), avoiding runtime exceptions caused by incorrect data types. Rapid expansion through inheritance of existing interfaces ensures consistency when adding new equipment to the system. Correspondingly, attribute entities can be defined according to interface specifications, ensuring consistent entity structures created by different developers or modules. This allows the Model layer objects of the industrial monitoring system to remain standardized under strong typing constraints, providing a reliable structured data foundation for subsequent data processing in the ModelView layer and graphic element rendering in the View layer.

[0029] Optionally, before updating the attribute entity according to the device message received from the industrial equipment through the ModelView layer, the method further includes: determining the ModelView layer corresponding to the attribute entity, wherein the ModelView layer is used to control and manage the updating of the attribute entity.

[0030] Correspondingly, the ViewModel layer can be used to configure different business logic (such as data validation rules and state deduction logic) for different types of attribute entities (such as temperature sensors and centrifugal pumps). Specifically, the association between device types and corresponding ModelView classes can be uniformly managed through a mapping table, which supports dynamic expansion. When a new device type is added, a ModelView class corresponding to the new device type can be created and added to the mapping table without modifying the existing process.

[0031] Optionally, step 102 may specifically include: receiving equipment messages from industrial equipment in real time via a web interface; and updating attribute entities using the ModelView layer based on the page logic of the monitoring interface and the equipment messages.

[0032] In some examples, the web client receives equipment messages from industrial devices via real-time communication protocols, ensuring low latency and high reliability. For instance, WebSocket full-duplex communication can be used, suitable for scenarios with high-frequency bidirectional interaction, such as receiving status feedback after remotely controlling equipment via the web client. Correspondingly, the ModelView layer combines page logic (such as data filtering and access control) with equipment messages to standardize the updating of attribute entities. This constructs a device status monitoring method where communication messages drive data, data drives element attributes, and attributes drive element rendering. This achieves decoupling between data and elements, enhances the modular design of the system, and allows each part to be developed and maintained independently.

[0033] Optionally, the ModelView layer is used to update the attribute entities based on the page logic and device messages of the monitoring interface, including: deserializing the device messages into Model objects corresponding to the graphic elements and updating the status information of the attribute entity Model objects in the Web client; and using the ModelView layer to update the attribute data of the graphic elements in the monitoring interface based on the configuration information and object status corresponding to the page logic.

[0034] In some embodiments, device messages received from the web client (such as JSON strings) are deserialized to convert them into Model objects that conform to TypeScript type constraints, ensuring data structure compliance. Based on the deserialized device messages, the state information (such as temperature value, running status) of the corresponding graphic element's Model object in the web client's memory is updated. The ModelView layer can combine page logic configuration (such as permissions, filtering rules, visual mapping) and the latest object state of the Model object to calculate the attribute data (such as color, animation, text) required by the graphic element, triggering the View layer to update the graphic element.

[0035] Optionally, before updating the corresponding graphical elements of the monitoring interface based on the updated attribute entities through the View class, the method also includes: determining the View class for rendering the graphical elements. The View class includes a base class and an interface. The View class is used to present the updated data of the ModelView layer to the user in a graphical way to ensure the real-time monitoring effect of the device status.

[0036] In some embodiments, the View class implements a standardized design through base classes and interfaces, and combines the associations configured by the UI designer to transform real-time data from the ViewModel layer into a graphical display, ensuring that the rendering logic for different types of primitives (pumps, sensors, pipes, etc.) is unified and scalable. Specifically, the View class can combine the interface layout (primitive position, size) defined by the UI designer and the updated attribute entities to refresh the monitoring interface in real time, meeting the real-time requirements of industrial monitoring. By unifying primitive rendering specifications through interfaces and base classes, adding new device types only requires implementing subclasses without modifying the framework code.

[0037] Optionally, step 103 may specifically include: based on the interface layout corresponding to the monitoring interface, updating the corresponding graphic elements of the monitoring interface through the View class according to the updated attribute entities, and designing and configuring the association between the attributes of the graphic elements and the device messages through the UI designer.

[0038] In some embodiments, a UI designer (such as a Figma plugin or a dedicated industrial monitoring configuration tool) can be used to design the layout of the monitoring interface, configure the association between graphic elements and device messages, flexibly adapt to different monitoring scenarios, and be used for View class initialization and rendering. The graphic element rendering logic is determined by the association between graphic elements configured by the UI designer and device messages. The interface can be adjusted through visualization tools to present the real-time status of industrial equipment.

[0039] In some embodiments, an efficient architecture technique can be provided to achieve real-time monitoring of device status, drive data updates through real-time messages, thereby driving changes in SVG primitive attributes and ultimately achieving dynamic rendering of the primitives. The specific design and implementation process is as follows: 1) Design and develop graphic element attribute entities (Models): Define attribute entities for various graphic elements. These entities are used to store the status information and attribute data of the graphic elements. Each graphic element corresponds to an independent Model to ensure the accuracy and real-time performance of the data; 2) Design the primitive update attribute object (ModelView): Design the ModelView layer to control and manage the updates of primitive attribute entities. The ModelView is responsible for receiving real-time messages and updating the corresponding Model based on the message content. This layer effectively combines data with the visual representation of primitives; 3) Design the primitive rendering View class: Develop the primitive rendering View class, including base class and interface, to achieve flexible primitive rendering. The View class is responsible for presenting the updated data of the ModelView layer to the user in a graphical way, ensuring real-time monitoring of device status; 4) Real-time message-driven attribute entity update: Upon receiving a device message, the system first identifies the message content and updates the corresponding attribute entity (Model). This process ensures the real-time nature and accuracy of the data, enabling subsequent primitive rendering to reflect the latest state of the device; 5) ModelView updates View display: The ModelView updates the View display based on the current page logic and the latest attribute entity data. This process ensures that the visual representation of the primitives is consistent with the actual state of the device, enabling real-time monitoring of the device status.

[0040] Through the above design process, this architecture technology can effectively realize real-time monitoring of equipment status, provide efficient and accurate equipment status feedback, and provide reliable data support for users' monitoring and decision-making.

[0041] In some embodiments, the preparation phase may include the following steps: 1) Employing TypeScript for object-oriented development leverages its strong typing and object-oriented features to build systems, making the code more maintainable and extensible. TypeScript's class and interface capabilities will facilitate clear architectural design. 2) Define the backend Model objects and interfaces: Define Model objects in the backend; these objects are used to store and process device status information. Create corresponding interfaces to ensure the standardization and consistency of Model objects, facilitating interaction between different modules; 3) Design the ModelView object to control the display: Develop ModelView objects to manage and update the display properties of primitives. The ModelView is responsible for handling data changes from the Model and reflecting these changes in the user interface; 4) Secondary encapsulation of SVG primitives: SVG primitives are encapsulated based on TypeScript objects and interfaces to enhance their functionality and interactivity. The encapsulated SVG primitives can then bind data and update attributes with the ModelView through the interface. 5) Develop a UI designer: Create a UI designer to design and configure the relationships between SVG primitive attributes and Model messages. The UI designer allows users to visually define how primitives respond to different device state changes.

[0042] In some embodiments, the runtime phase may include the following steps: 1) Using WebSocket technology to push real-time data from the backend to the web client: WebSocket technology is used to achieve real-time data communication between the backend and the web client. WebSocket provides low-latency bidirectional communication capabilities, ensuring that device status information can be pushed to the frontend in a timely manner; 2) After receiving a real-time message, the web client deserializes it into a Model object: Upon receiving a real-time message, the web client deserializes the message into a Model object and updates the object state in the web client's Model pool. This ensures that the device status data on the front end remains synchronized with the back end. 3) Update SVG element attributes and render status based on the current user UI configuration: The ModelView updates the attributes of SVG elements to reflect the latest device status. The rendering process is integrated with the user interface layout and design to ensure intuitive information display and optimized user experience.

[0043] Through the above implementation steps, real-time monitoring of equipment status can be achieved, providing an efficient system architecture and user interface design to ensure timely and accurate display of equipment information.

[0044] Compared with related technologies, this embodiment can receive equipment messages from industrial equipment in real time via a web interface. Utilizing the ModelView layer, it updates attribute entities based on the page logic of the monitoring interface and the equipment messages. The UI designer designs and configures the association between the attributes of graphic elements and the equipment messages. Based on the interface layout corresponding to the monitoring interface, the View class updates the corresponding graphic elements on the monitoring interface according to the updated attribute entities. By employing a communication message-driven data, data-driven graphic element attribute, and attribute-driven graphic element rendering approach, it achieves decoupling between data and graphic elements, reduces system coupling, enhances the modular design of the system, and allows each part to be developed and maintained independently. The system design is more flexible. It facilitates functional expansion and upgrades, enabling rapid adaptation to ever-changing industrial needs, reducing development and maintenance complexity, and improving encapsulation and scalability. Through intelligent rendering strategies, primitives are updated only when necessary, reducing unnecessary rendering operations and thus improving browser rendering efficiency. Due to the improved rendering efficiency, the client can handle more messages, significantly improving overall system performance and response speed, and increasing message throughput. Primitives actually visible to the user are prioritized, ensuring a rapid user interface response and enhancing the user experience. It provides reliable technical support for monitoring massive amounts of equipment in industrial environments, ensuring system stability and reliability under high concurrency and large data volume scenarios.

[0045] Based on the above Figure 1 The specific implementation of the method shown in this embodiment provides a device for monitoring device status, such as... Figure 2 As shown, the device includes: an acquisition module 31 and an update module 32; The acquisition module 31 is used to acquire the graphic elements corresponding to the monitoring interface of the industrial equipment, determine the attribute entities corresponding to the graphic elements, and store the status information and attribute data of the graphic elements. The graphic elements include SVG graphic elements. The update module 32 is used to respond to the received equipment message from the industrial equipment, update the attribute entity according to the equipment message through the ModelView layer, update the corresponding graphic elements on the monitoring interface according to the updated attribute entity through the View class, and the View class is used to render the graphic elements; and display the equipment status of the industrial equipment using the updated graphic elements in the monitoring interface.

[0046] In some examples of this embodiment, the update module 32 is specifically configured to receive equipment messages from industrial equipment in real time via a web interface; and to update attribute entities using the ModelView layer based on the page logic of the monitoring interface and the equipment messages.

[0047] In some examples of this embodiment, the update module 32 is specifically configured to deserialize the device message into a Model object corresponding to the primitive and update the state information of the attribute entity Model object in the Web client; The ModelView layer is used to update the attribute data of the graphic elements in the monitoring interface based on the configuration information and object status corresponding to the page logic.

[0048] In some examples of this embodiment, the update module 32 is specifically configured to determine the ModelView layer corresponding to the attribute entity, and the ModelView layer is used to control and manage the update of the attribute entity.

[0049] In some examples of this embodiment, the update module 32 is specifically configured to update the corresponding graphic elements of the monitoring interface according to the interface layout of the monitoring interface, through the View class based on the updated attribute entities. The monitoring interface designs and configures the association between the attributes of the graphic elements and the device messages through the UI designer.

[0050] In some examples of this embodiment, the update module 32 is specifically configured to determine the View class of the rendered primitives. The View class includes a base class and an interface. The View class is used to present the updated data of the ModelView layer to the user in a graphical way to ensure the real-time monitoring effect of the device status.

[0051] In some examples of this embodiment, the acquisition module 31 is specifically configured to determine the attribute entity corresponding to the primitive based on the strong typing and object-oriented features of TypeScript, and construct the interface corresponding to the attribute entity. The interface is used to ensure the standardization and consistency of the Model object.

[0052] Based on the above, Figure 1 Accordingly, this embodiment also provides a computer-readable storage medium having a computer program stored thereon, which, when executed by a processor, implements the above-described method. Figure 1 The method shown.

[0053] Based on this understanding, the technical solution of this application can be embodied in the form of a software product, which can be stored in a non-volatile storage medium (such as CD-ROM, USB flash drive, mobile hard drive, etc.) and includes several instructions to cause a computer device (such as personal computer, server, or network device, etc.) to execute the methods of various implementation scenarios of this application.

[0054] Based on the above, Figure 1 The method shown, and Figure 2 To achieve the above objectives, the present application also provides an electronic device, comprising a storage medium and a processor; the storage medium for storing a computer program; and the processor for executing the computer program to implement the above-described virtual device embodiments. Figure 1 The method shown.

[0055] Optionally, the aforementioned physical devices may also include a user interface, a network interface, a camera, radio frequency (RF) circuitry, sensors, audio circuitry, a Wi-Fi module, etc. The user interface may include a display screen, input units such as a keyboard, etc., and optional user interfaces may also include USB interfaces, card reader interfaces, etc. The network interface may optionally include standard wired interfaces, wireless interfaces (such as Wi-Fi interfaces), etc.

[0056] Those skilled in the art will understand that the physical device structure provided in this embodiment does not constitute a limitation on the physical device, and may include more or fewer components, or combine certain components, or have different component arrangements.

[0057] The storage medium may also include an operating system and a network communication module. The operating system is a program that manages the hardware and software resources of the aforementioned physical device, supporting the operation of information processing programs and other software and / or programs. The network communication module is used to enable communication between the various components within the storage medium, as well as communication with other hardware and software in the information processing physical device.

[0058] Through the above description of the embodiments, those skilled in the art can clearly understand that this application can be implemented using software plus necessary general-purpose hardware platforms, or it can be implemented using hardware. Through the solution of this application, this application can receive equipment messages from industrial equipment in real time via a web interface. Using the ModelView layer, it updates attribute entities based on the page logic of the monitoring interface and the equipment messages. The UI designer designs and configures the association between the attributes of graphic elements and the equipment messages. Based on the interface layout corresponding to the monitoring interface, the View class updates the corresponding graphic elements of the monitoring interface according to the updated attribute entities. By adopting a method of communication message-driven data, data-driven graphic element attributes, and attribute-driven graphic element rendering, it achieves decoupling of data and graphic elements, reduces system coupling, enhances the modular design of the system, and allows each part to be developed and maintained independently; the system design is more flexible. It facilitates functional expansion and upgrades, enabling rapid adaptation to ever-changing industrial needs, reducing development and maintenance complexity, and improving encapsulation and scalability. Through intelligent rendering strategies, primitives are updated only when necessary, reducing unnecessary rendering operations and thus improving browser rendering efficiency. Due to the improved rendering efficiency, the client can handle more messages, significantly improving overall system performance and response speed, and increasing message throughput. Primitives actually visible to the user are prioritized, ensuring a rapid user interface response and enhancing the user experience. It provides reliable technical support for monitoring massive amounts of equipment in industrial environments, ensuring system stability and reliability under high concurrency and large data volume scenarios.

[0059] It should be noted that, in this document, relational terms such as "first" and "second" are used merely to distinguish one entity or operation from another, and do not necessarily require or imply any such actual relationship or order between these entities or operations. Furthermore, the term "comprising" or any other variations thereof is intended to cover non-exclusive inclusion, such that a process, method, article, or apparatus 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 apparatus. Without further limitations, an element defined by the phrase "comprising one..." does not exclude the presence of other identical elements in the process, method, article, or apparatus that includes the element.

[0060] The above are merely specific embodiments of this application, enabling those skilled in the art to understand or implement this application. Various modifications to these embodiments will be readily apparent to those skilled in the art, and the general principles defined herein may be implemented in other embodiments without departing from the spirit or scope of this application. Therefore, this application is not to be limited to these embodiments, but is to be accorded the widest scope consistent with the principles and novel features claimed herein.

Claims

1. A method for monitoring equipment status, characterized in that, include: The monitoring interface of industrial equipment is obtained, and the attribute entity corresponding to the graphic element is determined. The attribute entity is used to store the status information and attribute data of the graphic element. The graphic element includes SVG graphic elements. In response to receiving a device message from the industrial equipment, the attribute entity is updated through the ModelView layer based on the device message; The View class updates the corresponding graphic elements of the monitoring interface based on the updated attribute entities, and the View class is used to render the graphic elements; The updated graphic elements in the monitoring interface are used to display the equipment status of the industrial equipment.

2. The method according to claim 1, characterized in that, The step of responding to receiving a device message from the industrial equipment and updating the attribute entity based on the device message through the ModelView layer includes: Receive device messages from the industrial equipment in real time via a web interface; The ModelView layer updates the attribute entity based on the page logic of the monitoring interface and the device messages.

3. The method according to claim 2, characterized in that, The step of updating the attribute entity using the ModelView layer based on the page logic of the monitoring interface and the device messages includes: The device message is deserialized into the Model object corresponding to the graphic element, and the state information of the attribute entity Model object in the Web client is updated. The ModelView layer updates the attribute data of the graphic elements in the monitoring interface based on the configuration information corresponding to the page logic and the object state.

4. The method according to claim 2, characterized in that, Before updating the attribute entity based on the device message received from the industrial equipment through the ModelView layer, the method further includes: The ModelView layer corresponding to the attribute entity is determined, and the ModelView layer is used to control and manage the updates of the attribute entity.

5. The method according to claim 2, characterized in that, The step of updating the corresponding graphic elements of the monitoring interface through the View class based on the updated attribute entities includes: Based on the interface layout corresponding to the monitoring interface, the View class updates the corresponding graphic elements of the monitoring interface according to the updated attribute entities. The monitoring interface uses the UI designer to design and configure the association between the attributes of the graphic elements and the device messages.

6. The method according to claim 5, characterized in that, Before updating the corresponding graphic elements of the monitoring interface through the View class based on the updated attribute entities, the method further includes: The View class for rendering the primitives is determined. The View class includes a base class and an interface. The View class is used to present the updated data of the ModelView layer to the user in a graphical way to ensure the real-time monitoring effect of the device status.

7. The method according to claim 1, characterized in that, The step of determining the attribute entity corresponding to the graphic element includes: Based on TypeScript's strong typing and object-oriented features, the attribute entities corresponding to the primitives are determined, and the interfaces corresponding to the attribute entities are constructed. These interfaces are used to ensure the standardization and consistency of Model objects.

8. A device for monitoring equipment status, characterized in that, include: The acquisition module is used to acquire the graphic elements corresponding to the monitoring interface of the industrial equipment, determine the attribute entities corresponding to the graphic elements, and the attribute entities are used to store the status information and attribute data of the graphic elements. The graphic elements include SVG graphic elements. The update module is used to respond to the received device message from the industrial equipment by updating the attribute entity according to the device message through the ModelView layer; updating the corresponding graphic elements of the monitoring interface according to the updated attribute entity through the View class, the View class being used to render the graphic elements; and displaying the device status of the industrial equipment using the updated graphic elements in the monitoring interface.

9. A computer-readable storage medium having a computer program stored thereon, characterized in that, When the computer program is executed by a processor, it implements the method of any one of claims 1 to 7.

10. An electronic device comprising a storage medium, a processor, and a computer program stored on the storage medium and executable on the processor, characterized in that, When the processor executes the computer program, it implements the method of any one of claims 1 to 7.

Images