CN113419733A - User interface rendering method and device in rail transit industry and electronic equipment - Google Patents
User interface rendering method and device in rail transit industry and electronic equipment Download PDFInfo
- Publication number
- CN113419733A CN113419733A CN202110752814.0A CN202110752814A CN113419733A CN 113419733 A CN113419733 A CN 113419733A CN 202110752814 A CN202110752814 A CN 202110752814A CN 113419733 A CN113419733 A CN 113419733A
- Authority
- CN
- China
- Prior art keywords
- interface
- rendered
- display
- data
- page
- Prior art date
- Legal status (The legal status is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the status listed.)
- Pending
Links
Images
Classifications
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F8/00—Arrangements for software engineering
- G06F8/30—Creation or generation of source code
- G06F8/38—Creation or generation of source code for implementing user interfaces
Landscapes
- Engineering & Computer Science (AREA)
- Software Systems (AREA)
- General Engineering & Computer Science (AREA)
- Theoretical Computer Science (AREA)
- Human Computer Interaction (AREA)
- Physics & Mathematics (AREA)
- General Physics & Mathematics (AREA)
- Stored Programmes (AREA)
Abstract
The invention provides a user interface rendering method, a user interface rendering device and electronic equipment in the rail transit industry, wherein the method comprises the following steps: acquiring service requirements and service data, wherein the service requirements comprise: the page display form, the content space and the display component identification corresponding to different content spaces; selecting a display component corresponding to the display component identification from an open source component library comprising Element-UI and EChats; processing the display component corresponding to the selected display component identifier on the universal interface to obtain a content space according to the page display form, so that an interface template to be rendered is generated by using the universal interface; filling the service data into a page template to be rendered; rendering a page template to be rendered filled with the business data, and generating a display interface; displaying the display interface to a user; interface butt joint and data rendering can be directly carried out, and the development efficiency of the user interaction interface is improved.
Description
Technical Field
The invention relates to the technical field of computers, in particular to a user interface rendering method and device in the rail transit industry and electronic equipment.
Background
At present, the traditional page development usually needs to complete the page construction, then perform API docking with the back end, and finally render the data to the page, which affects the development efficiency of the whole project and increases the development burden.
Disclosure of Invention
In order to solve the above problems, embodiments of the present invention provide a method and an apparatus for rendering a user interface in a rail transit industry, and an electronic device.
In a first aspect, an embodiment of the present invention provides a user interface rendering method in a rail transit industry, including:
acquiring service requirements and service data, wherein the service requirements comprise: the page display form, the content space and the display component identification corresponding to different content spaces;
selecting a display component corresponding to the display component identification from an open source component library comprising Element-UI and EChats;
processing the display component corresponding to the selected display component identifier on a universal interface to obtain a content space according to the page display form, so that an interface template to be rendered is generated by the universal interface;
filling the service data into the page template to be rendered;
rendering the page template to be rendered filled with the business data, and generating a display interface;
and displaying the display interface to a user.
In a second aspect, an embodiment of the present invention further provides a user interface rendering apparatus in a rail transit industry, including:
the system comprises an acquisition module, a processing module and a processing module, wherein the acquisition module is used for acquiring service requirements and service data, and the service requirements comprise: the page display form, the content space and the display component identification corresponding to different content spaces;
the selection module is used for selecting the display component corresponding to the display component identifier from an open source component library comprising Element-UI and EChats;
the processing module is used for processing the display component corresponding to the selected display component identifier on a universal interface to obtain a content space according to the page display form, so that an interface template to be rendered is generated by the universal interface;
the filling module is used for filling the service data into the page template to be rendered;
the rendering module is used for rendering the page template to be rendered filled with the business data and generating a display interface;
and the display module is used for displaying the display interface to a user.
In a third aspect, the present invention further provides a computer-readable storage medium, where a computer program is stored on the computer-readable storage medium, and when the computer program is executed by a processor, the computer program performs the steps of the method in the first aspect.
In a fourth aspect, embodiments of the present invention also provide an electronic device, which includes a memory, a processor, and one or more programs, where the one or more programs are stored in the memory and configured to be executed by the processor to perform the steps of the method according to the first aspect.
In the solutions provided in the foregoing first to fourth aspects of the embodiments of the present invention, after obtaining service data and service requirements having page presentation forms, content spaces, and presentation component identifiers corresponding to different content spaces, a presentation component corresponding to the presentation component identifier may be selected from an open source component library including Element-UI and ECharts, and then, according to the page presentation form, the content space is processed by using the presentation component corresponding to the selected presentation component identifier to obtain an interface template to be rendered, the page template to be rendered, which is filled with service data, is rendered, and a presentation interface is generated, so that the presentation form of the interface and the display of the components are controlled by specific parameters by using the unified visual effect of the Element-UI and the componentized data presentation form, and using the characteristics of multiple visualization data presentation forms of ECharts, the method is convenient for front-end interface development, can flexibly select a rendering scheme according to the rail transit service logic, abandons the interface construction flow in the traditional flow, directly carries out interface butt joint and data rendering, and improves the development efficiency of the user interaction interface.
In order to make the aforementioned and other objects, features and advantages of the present invention comprehensible, preferred embodiments accompanied with figures are described in detail below.
Drawings
In order to more clearly illustrate the embodiments of the present invention or the technical solutions in the prior art, the drawings used in the description of the embodiments or the prior art will be briefly described below, it is obvious that the drawings in the following description are only some embodiments of the present invention, and for those skilled in the art, other drawings can be obtained according to the drawings without creative efforts.
Fig. 1 is a flowchart illustrating a user interface rendering method in the rail transit industry according to embodiment 1 of the present invention;
fig. 2 is a schematic structural diagram illustrating a user interface rendering device in the rail transit industry according to embodiment 2 of the present invention;
fig. 3 shows a schematic structural diagram of an electronic device provided in embodiment 3 of the present invention.
Detailed Description
In the description of the present invention, it is to be understood that the terms "center", "longitudinal", "lateral", "length", "width", "thickness", "upper", "lower", "front", "rear", "left", "right", "vertical", "horizontal", "top", "bottom", "inner", "outer", "clockwise", "counterclockwise", and the like, indicate orientations and positional relationships based on those shown in the drawings, and are used only for convenience of description and simplicity of description, and do not indicate or imply that the device or element being referred to must have a particular orientation, be constructed and operated in a particular orientation, and thus, should not be considered as limiting the present invention.
Furthermore, the terms "first", "second" and "first" are used for descriptive purposes only and are not to be construed as indicating or implying relative importance or implicitly indicating the number of technical features indicated. Thus, a feature defined as "first" or "second" may explicitly or implicitly include one or more of that feature. In the description of the present invention, "a plurality" means two or more unless specifically defined otherwise.
In the present invention, unless otherwise expressly specified or limited, the terms "mounted," "connected," "secured," and the like are to be construed broadly and can, for example, be fixedly connected, detachably connected, or integrally connected; can be mechanically or electrically connected; they may be connected directly or indirectly through intervening media, or they may be interconnected between two elements. The specific meanings of the above terms in the present invention can be understood by those skilled in the art according to specific situations.
At present, the traditional page development usually needs to complete the page construction, then perform API docking with the back end, and finally render the data to the page, which affects the development efficiency of the whole project and increases the development burden.
Based on this, embodiments of the present application provide a user interface rendering method, apparatus, and electronic device in the rail transit industry, after obtaining service data and service requirements having page presentation forms, content spaces, and presentation component identifiers corresponding to different content spaces, a presentation component corresponding to the presentation component identifier may be selected from an open source component library including Element-UI and ECharts, then according to the page presentation forms, the content spaces are processed by using the selected presentation component corresponding to the presentation component identifier, an interface template to be rendered is obtained, a page template to be rendered filled with service data is rendered, and a presentation interface is generated, so that a presentation form of the interface and display of the components are controlled by using characteristics of a unified visual effect of the Element-UI and a componentized data presentation form, and a plurality of visualization data presentation forms of ECharts, through specific parameters, the method is convenient for front-end interface development, can flexibly select a rendering scheme according to the rail transit service logic, abandons the interface construction flow in the traditional flow, directly carries out interface butt joint and data rendering, and improves the development efficiency of the user interaction interface.
In order to make the aforementioned objects, features and advantages of the present application more comprehensible, the present application is described in further detail with reference to the accompanying drawings and the detailed description.
Example 1
The execution main body of the user interface rendering method in the rail transit industry provided by the embodiment is the server.
Referring to a flowchart of a user interface rendering method in the rail transit industry shown in fig. 1, the present embodiment provides a user interface rendering method in the rail transit industry, including the following specific steps:
In step 100, the page display format includes, but is not limited to: the display method comprises a table type information display form, a chart type information display form, a detail type information display form and a tree structure display form.
And the form information display form is used for displaying vehicle main data, vehicle protocols and fault list management.
And the chart information display form is used for displaying the vehicle health management.
The detail information display form is used for displaying fault phenomena, fault reasons and solutions in the fault dictionary.
And the tree structure display form is used for displaying the vehicle body structure.
The content space is a space divided for distinguishing functions or features of different display contents in the various page display forms.
If the form page display form comprises: content spaces such as screening operation, increasing, deleting, modifying and checking operation, table information display and the like; the tree structure display form comprises: tree structure and node detail information.
And 102, selecting a display component corresponding to the display component identifier from an open source component library comprising Element-UI and EChats.
In step 102, the open source component library is preset in the server.
The Element-UI is a desktop end UI framework based on Vue, and a set of desktop end component libraries based on Vue is prepared for developers, designers and product managers. The EChats are a data visualization component library, can realize a line graph, a bar graph, a scatter graph, a pie graph, a K-plot and the like, can be directly used without conversion of various data types, and simultaneously support interactive operations of multi-dimensional screening, view scaling, detail display and the like on data.
And the presentation components in the Element-UI and the EChats are used for processing the general page and generating content spaces for various page presentation forms in the general page.
And 104, processing the display component corresponding to the selected display component identifier on a universal interface to obtain a content space according to the page display form, so that an interface template to be rendered is generated by using the universal interface.
In step 104, according to the page display form, the content space is obtained by processing the display component corresponding to the selected display component identifier on the universal interface, so that a specific process of generating the interface template to be rendered by using the universal interface is the prior art, and details are not repeated here.
Before the business data is filled into the page template to be rendered, the following steps (1) to (2) need to be executed, and an interactive button is added into the page template to be rendered:
(1) inquiring an interactive button corresponding to the display component identifier and a setting position of the interactive button in the interface template to be rendered by using the display component identifier;
(2) and setting the interactive button in the page template to be rendered based on the setting position of the interactive button in the interface template to be rendered.
In the step (1), the interactive buttons include, but are not limited to: add button, modify button, return button.
The interactive button carries functions (behaviors) generated after the interactive button is operated, so that the functions (behaviors) generated after the interactive button is operated are realized when the interactive button is triggered.
After adding the interactive button in the page template to be rendered, the following step 106 is continued.
And 106, filling the service data into the page template to be rendered.
In the step 106, in order to fill the service data into the page template to be rendered, the following steps (1) to (3) may be performed:
(1) screening out data to be displayed from the service data;
(2) converting the data to be displayed into a preset data format;
(3) and filling the data to be displayed in the preset data format into the page template to be rendered.
In the step (1), the process of screening the data to be displayed from the service data is the prior art, and is not described herein again.
In the step (2), the preset data format is a data receiving format specified by an open-source component (element-ui, echarts). For example, the data receiving format of the presentation component in the form of table type information presentation is: an array comprising a plurality of objects having a table column family and data (an array comprising a plurality of objects having a table column family and corresponding data therein); the data receiving format of the drop-down box component is as follows: an array containing a plurality of objects with option names and option values (an array containing a plurality of objects, each object corresponding to an option in a drop-down box, the display name of an option in an object and the value fed back when the option is selected).
In the step (3), a specific process of filling the data to be displayed in the preset data format into the page template to be rendered is the prior art, and is not described herein again.
And 108, rendering the page template to be rendered filled with the service data, and generating a display interface.
In the step 108, the Vue frame is used to render the page template to be rendered, which is filled with the business data, so as to generate a display interface.
Here, when mainpage vue is defined as a general page in the Vue framework and a variable is defined as an identifier of a selected page type in the props of the < script > tag, such as setPageType ═ tree', the interface is represented in the form of a tree graph structure. At the present stage, only the table type, the icon type, the detail type and the tree type structure are displayed, and simultaneously, an expandable space is reserved to realize more display forms or make customized pages for users. After the type selection is completed, each display type has a corresponding content space to support the corresponding display type, and meanwhile, the content spaces are also displayed through the tips in the < script > tag through specific parameters, for example, in the table type information display, when hasSearch ═ false', the part of the screening operation is completely hidden, and all the content spaces corresponding to the display types are displayed under the default condition. After the content space is selected, the displayed content is controlled by a specific parameter through the tips in the < script > tag, for example, in the content space of the add/delete modify operation shown by the table type information, when the hasImport is equal to 'true', the import button is displayed. The method comprises the steps that components such as Element-UI and EChats are used in the construction of a general page, meanwhile, variables of the props are monitored in a watch method of a < script > tag, and if the values of the variables are updated, the values of the associated local variables are updated, so that the component part or the data part of the page is driven to be updated. This $ emit is used among methods of a specific method to pass parameters to a parent method.
In the project, each business interface requirement is used as a parent component, and a universal page (MainPage. vue) is linked as a child component by using a custom element of HTML. Receiving, filtering and processing relevant service data transmitted by the back end in the parent component, putting the relevant service data into a specified variable, and packaging the function of the back end writing into a specified method of the method. The method comprises the steps of using a stage variable of colon plus a general page to transfer service data, for example, tree-data which is 'treeData' can transfer treeData of a parent component into the general component; the method of transferring the parent component using the @ plus method name, such as @ search ═ fettreedetail, can transfer the fettreedetail method of the parent component to the generic component.
Vue the main utilization of data bidirectional binding is as follows: data hijacking and publish subscription patterns. The publish-subscribe mode defines a one-to-many relationship between objects, allowing multiple watcher objects to simultaneously monitor a topic object, and when an object changes, all objects dependent on it will be notified. The data hijacking is to utilize a visitor property of JavaScript, that is, object.
The View template is first compiled via Compiler object, during the compilation process, it is analyzed where Vue data (data in Model) is used in the template, once Vue data (data in Model) is used, a Water (observer object) is created and added to the array of publisher objects, and the data obtained in Vue is compiled instead of generating a new View View. In the process of creating Vue instance, data hijacking operation is carried out on data in Vue data, namely, attributes on the data are all proxied to Vue instance in an object.
Therefore, the page cannot be refreshed by using the route in combination with the Vue framework, the data are bound bidirectionally, and the code writing amount is reduced by modular development; Element-UI unified visual effect and componentized data presentation form; the characteristics of multiple visualization data display forms of ECharts are fused, the display forms of the interface and the display of the components are controlled through specific parameters, and the rendering scheme can be flexibly selected according to the logic of the rail transit service for the development of the front-end interface. The interface construction process in the traditional process is abandoned, interface butt joint and data rendering are directly carried out, and development efficiency is improved.
And step 110, displaying the display interface to a user.
To sum up, this embodiment provides a user interface rendering method in the rail transit industry, after acquiring service data and service requirements having page presentation forms, content spaces, and presentation component identifiers corresponding to different content spaces, a presentation component corresponding to the presentation component identifier may be selected from an open source component library including Element-UI and ECharts, then, according to the page presentation form, the content space is processed by using the presentation component corresponding to the selected presentation component identifier, an interface template to be rendered is obtained, the page template to be rendered filled with service data is rendered, and a presentation interface is generated, so that the presentation form of the interface and the display of the components are controlled by specific parameters by using the unified visual effect of the Element-UI and the componentized data presentation form, and using the characteristics of multiple visualization data presentation forms of ECharts, the method is convenient for front-end interface development, can flexibly select a rendering scheme according to the rail transit service logic, abandons the interface construction flow in the traditional flow, directly carries out interface butt joint and data rendering, and improves the development efficiency of the user interaction interface.
Example 2
The present embodiment provides a user interface rendering apparatus in the rail transit industry, which is configured to execute the user interface rendering method in the rail transit industry provided in embodiment 1.
Referring to fig. 2, a schematic structural diagram of a user interface rendering apparatus in the rail transit industry includes:
an obtaining module 200, configured to obtain a service requirement and service data, where the service requirement includes: page presentation form, content space, presentation component identification corresponding to different content spaces.
And the selecting module 202 is configured to select a display component corresponding to the display component identifier from an open source component library including Element-UI and ECharts.
And the processing module 204 is configured to process the display component corresponding to the selected display component identifier on a universal interface to obtain a content space according to the page display form, so as to generate an interface template to be rendered by using the universal interface.
And a filling module 206, configured to fill the service data into the page template to be rendered.
And the rendering module 208 is configured to render the to-be-rendered page template filled with the service data, and generate a display interface.
And the display module 210 is configured to display the display interface to a user.
The filling module 206 is specifically configured to:
screening out data to be displayed from the service data;
converting the data to be displayed into a preset data format;
and filling the data to be displayed in the preset data format into the page template to be rendered.
The rendering module 208 is specifically configured to:
and utilizing an Vue frame to render the page template to be rendered filled with the business data, and generating a display interface.
The user interface rendering device in the rail transit industry provided by the embodiment further includes:
the query module is used for querying the interactive buttons corresponding to the display component identifications and the setting positions of the interactive buttons in the interface template to be rendered by utilizing the display component identifications;
and the setting module is used for setting the interactive button in the page template to be rendered based on the setting position of the interactive button in the interface template to be rendered.
To sum up, this embodiment provides a user interface rendering apparatus in the rail transit industry, which, after acquiring service data and service requirements having page presentation forms, content spaces, and presentation component identifiers corresponding to different content spaces, may select a presentation component corresponding to the presentation component identifier from an open source component library including Element-UI and ECharts, then process the content space according to the page presentation form by using the presentation component corresponding to the selected presentation component identifier, obtain an interface template to be rendered, render the page template to be rendered filled with the service data, and generate a presentation interface, so as to control whether the presentation form of the interface and the display of the components are performed or not by using the unified visual effect of the Element-UI and the componentized data presentation forms, and using the characteristics of multiple visualization data presentation forms of ECharts through specific parameters, the method is convenient for front-end interface development, can flexibly select a rendering scheme according to the rail transit service logic, abandons the interface construction flow in the traditional flow, directly carries out interface butt joint and data rendering, and improves the development efficiency of the user interaction interface.
Example 3
The present embodiment provides a computer-readable storage medium, which stores a computer program, and when the computer program is executed by a processor, the computer program performs the steps of the user interface rendering method in the rail transit industry described in embodiment 1 above. For specific implementation, refer to method embodiment 1, which is not described herein again.
In addition, referring to the schematic structural diagram of an electronic device shown in fig. 3, the present embodiment further provides an electronic device, where the electronic device includes a bus 51, a processor 52, a transceiver 53, a bus interface 54, a memory 55, and a user interface 56. The electronic device comprises a memory 55.
In this embodiment, the electronic device further includes: one or more programs stored on the memory 55 and executable on the processor 52, configured to be executed by the processor for performing the following steps (1) to (6):
(1) acquiring service requirements and service data, wherein the service requirements comprise: the page display form, the content space and the display component identification corresponding to different content spaces;
(2) selecting a display component corresponding to the display component identification from an open source component library comprising Element-UI and EChats;
(3) processing the display component corresponding to the selected display component identifier on a universal interface to obtain a content space according to the page display form, so that an interface template to be rendered is generated by the universal interface;
(4) filling the service data into the page template to be rendered;
(5) rendering the page template to be rendered filled with the business data, and generating a display interface;
(6) and displaying the display interface to a user.
A transceiver 53 for receiving and transmitting data under the control of the processor 52.
Where a bus architecture (represented by bus 51) is used, bus 51 may include any number of interconnected buses and bridges, with bus 51 linking together various circuits including one or more processors, represented by processor 52, and memory, represented by memory 55. The bus 51 may also link various other circuits such as peripherals, voltage regulators, power management circuits, and the like, which are well known in the art, and therefore, will not be described any further in this embodiment. A bus interface 54 provides an interface between the bus 51 and the transceiver 53. The transceiver 53 may be one element or may be multiple elements, such as multiple receivers and transmitters, providing a means for communicating with various other apparatus over a transmission medium. For example: the transceiver 53 receives external data from other devices. The transceiver 53 is used for transmitting data processed by the processor 52 to other devices. Depending on the nature of the computing system, a user interface 56, such as a keypad, display, speaker, microphone, joystick, may also be provided.
The processor 52 is responsible for managing the bus 51 and the usual processing, running a general-purpose operating system as described above. And memory 55 may be used to store data used by processor 52 in performing operations.
Alternatively, processor 52 may be, but is not limited to: a central processing unit, a singlechip, a microprocessor or a programmable logic device.
It will be appreciated that the memory 55 in embodiments of the invention may be either volatile memory or nonvolatile memory, or may include both volatile and nonvolatile memory. The non-volatile Memory may be a Read-Only Memory (ROM), a Programmable ROM (PROM), an Erasable PROM (EPROM), an Electrically Erasable PROM (EEPROM), or a flash Memory. Volatile Memory can be Random Access Memory (RAM), which acts as external cache Memory. By way of illustration and not limitation, many forms of RAM are available, such as Static random access memory (Static RAM, SRAM), Dynamic Random Access Memory (DRAM), Synchronous Dynamic random access memory (Synchronous DRAM, SDRAM), Double Data Rate Synchronous Dynamic random access memory (ddr Data Rate SDRAM, ddr SDRAM), Enhanced Synchronous SDRAM (ESDRAM), Synchlink DRAM (SLDRAM), and Direct Rambus RAM (DRRAM). The memory 55 of the systems and methods described in this embodiment is intended to comprise, without being limited to, these and any other suitable types of memory.
In some embodiments, memory 55 stores elements, executable modules or data structures, or a subset thereof, or an expanded set thereof as follows: an operating system 551 and application programs 552.
The operating system 551 includes various system programs, such as a framework layer, a core library layer, a driver layer, and the like, for implementing various basic services and processing hardware-based tasks. The application 552 includes various applications, such as a Media Player (Media Player), a Browser (Browser), and the like, for implementing various application services. A program implementing the method of an embodiment of the present invention may be included in the application 552.
To sum up, this embodiment provides an electronic device and a computer-readable storage medium, after acquiring service data and service requirements having page presentation forms, content spaces, and presentation component identifiers corresponding to different content spaces, a presentation component corresponding to the presentation component identifier may be selected from an open source component library including Element-UI and ECharts, and then according to the page presentation form, the content space is processed by using the presentation component corresponding to the selected presentation component identifier to obtain an interface template to be rendered, the page template to be rendered filled with service data is rendered, and a presentation interface is generated, so that the presentation form of the interface and the display of the components are controlled by specific parameters by using the unified visual effect of the Element-UI and the presentation form of the componentized data, and using the characteristics of multiple visualization data presentation forms of ECharts, the method is convenient for front-end interface development, can flexibly select a rendering scheme according to the rail transit service logic, abandons the interface construction flow in the traditional flow, directly carries out interface butt joint and data rendering, and improves the development efficiency of the user interaction interface.
The above description is only for the specific embodiments of the present invention, but the scope of the present invention is not limited thereto, and any person skilled in the art can easily conceive of the changes or substitutions within the technical scope of the present invention, and all the changes or substitutions should be covered within the scope of the present invention. Therefore, the protection scope of the present invention shall be subject to the protection scope of the appended claims.
Claims (10)
1. A user interface rendering method in the rail transit industry is characterized by comprising the following steps:
acquiring service requirements and service data, wherein the service requirements comprise: the page display form, the content space and the display component identification corresponding to different content spaces;
selecting a display component corresponding to the display component identification from an open source component library comprising Element-UI and EChats;
processing the display component corresponding to the selected display component identifier on a universal interface to obtain a content space according to the page display form, so that an interface template to be rendered is generated by the universal interface;
filling the service data into the page template to be rendered;
rendering the page template to be rendered filled with the business data, and generating a display interface;
and displaying the display interface to a user.
2. The method according to claim 1, wherein the populating the business data into the page template to be rendered comprises:
screening out data to be displayed from the service data;
converting the data to be displayed into a preset data format;
and filling the data to be displayed in the preset data format into the page template to be rendered.
3. The method according to claim 1, wherein the rendering of the page template to be rendered filled with the business data generates a presentation interface, comprising:
and utilizing an Vue frame to render the page template to be rendered filled with the business data, and generating a display interface.
4. The method according to claim 1, wherein before the step of filling the service data into the page template to be rendered, further comprising:
inquiring an interactive button corresponding to the display component identifier and a setting position of the interactive button in the interface template to be rendered by using the display component identifier;
and setting the interactive button in the page template to be rendered based on the setting position of the interactive button in the interface template to be rendered.
5. A user interface rendering device in the rail transit industry is characterized by comprising:
the system comprises an acquisition module, a processing module and a processing module, wherein the acquisition module is used for acquiring service requirements and service data, and the service requirements comprise: the page display form, the content space and the display component identification corresponding to different content spaces;
the selection module is used for selecting the display component corresponding to the display component identifier from an open source component library comprising Element-UI and EChats;
the processing module is used for processing the display component corresponding to the selected display component identifier on a universal interface to obtain a content space according to the page display form, so that an interface template to be rendered is generated by the universal interface;
the filling module is used for filling the service data into the page template to be rendered;
the rendering module is used for rendering the page template to be rendered filled with the business data and generating a display interface;
and the display module is used for displaying the display interface to a user.
6. The apparatus according to claim 5, wherein the filling module is specifically configured to:
screening out data to be displayed from the service data;
converting the data to be displayed into a preset data format;
and filling the data to be displayed in the preset data format into the page template to be rendered.
7. The apparatus of claim 5, wherein the rendering module is specifically configured to:
and utilizing an Vue frame to render the page template to be rendered filled with the business data, and generating a display interface.
8. The apparatus of claim 5, further comprising:
the query module is used for querying the interactive buttons corresponding to the display component identifications and the setting positions of the interactive buttons in the interface template to be rendered by utilizing the display component identifications;
and the setting module is used for setting the interactive button in the page template to be rendered based on the setting position of the interactive button in the interface template to be rendered.
9. A computer-readable storage medium, on which a computer program is stored, which, when being executed by a processor, carries out the steps of the method according to any one of the claims 1 to 4.
10. An electronic device comprising a memory, a processor, and one or more programs, wherein the one or more programs are stored in the memory and configured to be executed by the processor to perform the steps of the method of any of claims 1-4.
Priority Applications (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN202110752814.0A CN113419733A (en) | 2021-07-02 | 2021-07-02 | User interface rendering method and device in rail transit industry and electronic equipment |
Applications Claiming Priority (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN202110752814.0A CN113419733A (en) | 2021-07-02 | 2021-07-02 | User interface rendering method and device in rail transit industry and electronic equipment |
Publications (1)
| Publication Number | Publication Date |
|---|---|
| CN113419733A true CN113419733A (en) | 2021-09-21 |
Family
ID=77720305
Family Applications (1)
| Application Number | Title | Priority Date | Filing Date |
|---|---|---|---|
| CN202110752814.0A Pending CN113419733A (en) | 2021-07-02 | 2021-07-02 | User interface rendering method and device in rail transit industry and electronic equipment |
Country Status (1)
| Country | Link |
|---|---|
| CN (1) | CN113419733A (en) |
Cited By (1)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN114816568A (en) * | 2022-04-13 | 2022-07-29 | 北京达佳互联信息技术有限公司 | Page configuration method and device, electronic equipment and storage medium |
Citations (3)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| US20100125502A1 (en) * | 2008-11-18 | 2010-05-20 | Peer 39 Inc. | Method and system for identifying web documents for advertisements |
| CN111476010A (en) * | 2020-04-03 | 2020-07-31 | 智业软件股份有限公司 | High-flexibility report method and system |
| CN111753227A (en) * | 2019-03-26 | 2020-10-09 | 北京宸信征信有限公司 | Screen display system and method based on asynchronous loading data information |
-
2021
- 2021-07-02 CN CN202110752814.0A patent/CN113419733A/en active Pending
Patent Citations (3)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| US20100125502A1 (en) * | 2008-11-18 | 2010-05-20 | Peer 39 Inc. | Method and system for identifying web documents for advertisements |
| CN111753227A (en) * | 2019-03-26 | 2020-10-09 | 北京宸信征信有限公司 | Screen display system and method based on asynchronous loading data information |
| CN111476010A (en) * | 2020-04-03 | 2020-07-31 | 智业软件股份有限公司 | High-flexibility report method and system |
Non-Patent Citations (2)
| Title |
|---|
| STEPHY_YY: "vue项目中所使用的element-UI / echarts", pages 1 - 14, Retrieved from the Internet <URL:https://blog.csdn.net/weixin_43503511/article/details/103549170> * |
| 阿雷前进中...: "ElementUI中使用ECharts", pages 1 - 4, Retrieved from the Internet <URL:csdn博客，https://blog.csdn.net/qq_41154522/article/details/104615251> * |
Cited By (2)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN114816568A (en) * | 2022-04-13 | 2022-07-29 | 北京达佳互联信息技术有限公司 | Page configuration method and device, electronic equipment and storage medium |
| CN114816568B (en) * | 2022-04-13 | 2024-05-14 | 北京达佳互联信息技术有限公司 | Page configuration method, page configuration device, electronic equipment and storage medium |
Similar Documents
| Publication | Publication Date | Title |
|---|---|---|
| CN113094037B (en) | Interaction method, development platform, equipment and storage medium for forms and workflows | |
| US10318628B2 (en) | System and method for creation of templates | |
| CN100562871C (en) | In the web browser, check tables of data and mutual with it method and apparatus | |
| US10643023B2 (en) | Programmatic native rendering of structured content | |
| US7769570B2 (en) | Hierarchical references or links in modeling environments | |
| US6003047A (en) | Non-hierarchical application interface for HTML-based network storage management programs | |
| CN109062567B (en) | B/S structure-based information management system rapid development platform | |
| AU2016302392B2 (en) | Methods and systems for creating configurable forms, configuring forms and for form flow and form correlation | |
| US20100088618A1 (en) | Developing user interface element settings | |
| WO2006051970A1 (en) | Data processing device, document processing device, data relay device, data processing method, and data relay method | |
| CN113326044A (en) | Development method, system and storage medium based on control library | |
| US20030128239A1 (en) | Method and apparatus for XML schema publishing into a user interface | |
| CN115543282A (en) | Page code generation method and device, storage medium and computer equipment | |
| CN113419733A (en) | User interface rendering method and device in rail transit industry and electronic equipment | |
| CN104081347A (en) | Graphical representation of an order of operations | |
| US8230353B2 (en) | Iterative development of services from WSDL | |
| US20030016242A1 (en) | Use of hyperlinks in an automation application program and a station for programming such an application | |
| CN101203848A (en) | Document processing device and document processing method | |
| CN114706580A (en) | Front-end webpage development method and device, storage medium and electronic equipment | |
| WO2006051717A1 (en) | Document processing device and document processing method | |
| WO2006051714A1 (en) | Document processing device, and document processing method | |
| Macedo | OCaml-Flat on the Ocsigen framework | |
| CN112540803B (en) | Form design adaptation method, device, equipment and storage medium | |
| Chang et al. | W-Revised: An amazing tool for creating customized websites | |
| Engel et al. | A review of user interface description languages |
Legal Events
| Date | Code | Title | Description |
|---|---|---|---|
| PB01 | Publication | ||
| PB01 | Publication | ||
| SE01 | Entry into force of request for substantive examination | ||
| SE01 | Entry into force of request for substantive examination | ||
| TA01 | Transfer of patent application right |
Effective date of registration: 20221123 Address after: 100160 room 1118, building 1, yard 3, South Yuren Road, Fengtai District, Beijing Applicant after: Beijing rail transit technology and Equipment Group Co.,Ltd. Applicant after: Beijing Infrastructure Investment Co.,Ltd. Address before: 100070 room 1118, building 1, yard 3, South Yuren Road, Fengtai District, Beijing Applicant before: Beijing rail transit technology and Equipment Group Co.,Ltd. |
|
| TA01 | Transfer of patent application right |