Disclosure of Invention
Based on the technical problems, the application aims to provide a webpage generating method and a computer based on JS real-time analysis, so as to simplify webpage generating steps, improve webpage updating efficiency, meet the real-time, efficient, simple and convenient business requirements of the medical industry on webpage generation and improve user experience.
The embodiment of the application provides a page generation method based on JS real-time analysis, which is used for generating a visual page and is characterized in that the visual page comprises format content and data content, and the page generation method comprises the following steps:
acquiring the visual page ID;
acquiring a visual page Json program package according to the visual page ID;
analyzing the visual page Json program package in real time through JS language, and acquiring a page component of the visual page and a configuration data source bound with the page component;
rendering according to the real-time analysis result of the page component and the visual page Json program package to generate the format content;
acquiring the data content according to the configuration data source bound with the page component;
and loading the data content into the page component bound with the configuration data source to generate the visual page.
Preferably, the visualization page Json package is generated by a page configuration system, including the page component and attribute configuration, wherein,
the page component comprises a preset component and/or a user configuration component, and is used for forming the format content of the visual page;
the attribute configuration includes a display style for setting the format content of the visual page and an event including binding the page component with the configuration data source for setting the data content of the visual page.
Preferably, the visualization page Json package further comprises a mapping model comprising the configuration data source, the query data source, and the mapping relationship, wherein,
the configuration data source is a data source mapped by the mapping model;
the query data source comprises one or more of a service system database, a data table and a field;
the mapping relation binds the configuration data source with the query data source and sends the query data of the query data source to the configuration data source.
Preferably, the method for generating the format content according to the real-time parsing result rendering of the page component and the visualized page Json package includes:
analyzing and acquiring the display style in the attribute configuration aiming at the visual page in the visual page Json program package through JS language in real time;
analyzing and acquiring the position layout of the page component in the visual page Json program package in real time through JS language;
analyzing and acquiring the display style in the attribute configuration aiming at the page component in the visual page Json program package through JS language in real time;
generating the format content of the visual page according to the display style for the visual page, the page component, the position layout of the page component and the display style rendering for the page component.
Preferably, the method for acquiring the data content according to the configuration data source bound with the page component comprises the following steps:
acquiring the corresponding mapping model according to the configuration data source bound with the page component;
acquiring the query data source according to the configuration data source and the mapping model which are bound with the page component;
transmitting the query data in the query data source to the configuration data source through the mapping relation in the mapping model;
and directly generating the data content by the query data sent to the configuration data source, or generating the data content by function processing.
Preferably, each mapping model corresponds to a section of mapping model Json program statement and corresponds to a mapping model ID, and the mapping model ID is used to identify the mapping model, and the mapping model Json program statement and/or the mapping model ID is/are contained in the visualization page Json program package.
Preferably, the mapping model Json program statement includes the mapping model ID, which is used to describe and identify the mapping model, and the mapping model Json program statement is included in the visualization page Json program package.
Preferably, the method for acquiring the query data source according to the configuration data source and the mapping model bound with the page component includes:
analyzing the mapping model Json program sentences in the visual page Json program package in real time through JS language to obtain all the mapping relations in the mapping model;
and searching and acquiring the corresponding query data source in all the mapping relations according to the configuration data source bound with the page component.
Preferably, the method for acquiring the query data source according to the configuration data source and the mapping model bound with the page component includes:
analyzing the visual page Json program package in real time through JS language to obtain the mapping model ID;
acquiring the Json program statement of the mapping model through the ID of the mapping model;
analyzing the Json program statement of the mapping model in real time through JS language to obtain all the mapping relations in the mapping model;
and searching and acquiring the corresponding query data source in all the mapping relations according to the configuration data source bound with the page component.
In order to solve the above technical problems, the embodiment of the present application further provides a computer, including a memory, a processor, and a computer program stored in the memory and capable of running on the processor, where the computer program run by the processor includes any one of the above page generation methods based on JS real-time parsing.
Compared with the prior art, the technical scheme of the embodiment of the application has the following beneficial effects:
the visual page ID is obtained, and then the visual page Json program package is directly obtained, so that the complex process that a page configuration system is required to independently generate an HTML file in the prior art, export the HTML file to the local and finally form an operable web program is omitted; according to the method, based on JS language, the visual page Json program package is analyzed in real time, the visual page is generated in real time, when page configuration content is modified, the latest visual page Json program package can be obtained in real time, the latest visual page configuration content is analyzed and generated in real time, various data are obtained and displayed in real time, the page updating efficiency is improved, the visual page content is enriched, and the real-time, efficient, simple and convenient business requirements of the medical industry on page generation can be met.
Detailed Description
The present application will be described in further detail with reference to the drawings and examples, in order to make the objects, technical solutions and advantages of the present application more apparent. It should be understood that the specific embodiments described herein are for purposes of illustration only and are not intended to limit the scope of the application.
Fig. 1 is a flowchart of a page generating method based on JS real-time parsing in an embodiment. The method is used for generating a visual page, and as one embodiment, the visual page comprises format content and data content, as shown in fig. 1, the page generation method comprises the following steps:
step S101: acquiring the visual page ID;
step S102: acquiring a visual page Json program package according to the visual page ID;
step S103: analyzing the visual page Json program package in real time through JS language, and acquiring a page component of the visual page and a configuration data source bound with the page component;
step S104: rendering according to the real-time analysis result of the page component and the visual page Json program package to generate the format content;
step S105: acquiring the data content according to the configuration data source bound with the page component;
step S106: and loading the data content into the page component bound with the configuration data source to generate the visual page.
Specifically, the visual page generated by the page generation method based on JS real-time analysis includes not only format contents such as pictures, characters, text boxes, labels, buttons, colors, backgrounds, display proportions and the like, but also data contents such as patient diagnosis and treatment data, patient real-time diagnosis and treatment data, patient diagnosis and treatment statistics data and the like. The visualization page consists of one visualization page Json program package and corresponds to at least 1 visualization page ID.
In step S101, a server address storing the visual page and the visual page ID are input in an address field of a browser, and a link operation is performed, so that the browser can obtain the visual page ID; or firstly enabling the browser to access a corresponding server, inputting the visual page ID in a corresponding search box, and performing search operation, or enabling the browser to acquire the visual page ID. Of course, other operation modes are also possible, as long as the browser or the client can accurately acquire the visualized page ID.
In step S102, after the browser obtains the visualized page ID, the visualized page ID is sent to a corresponding server storing the visualized page, and then the server obtains the visualized page Json package according to the visualized page ID, and sends the obtained visualized page Json package to the browser.
In step S103, after the browser receives the visual page Json package, the visual page Json package is parsed in real time through JS language, and a page component of the visual page and a configuration data source bound with the page component included in the visual page Json package are obtained. At present, the JS language, namely JavaScript language, is an transliteration script language, is a dynamic type, weak type and prototype-based language, and is a built-in support type of the browser, and all main browsers such as IE, chrome and home and abroad support JS language. Its interpreter is called JavaScript engine, which is part of the browser. Therefore, after the browser obtains the visual page Json package, the visual page Json package can be analyzed in real time, and a page component such as a picture, a word, a text box, a label, a button and the like forming the visual page format content and a configuration data source which is used for providing the visual page data content and is bound with the page component are obtained.
In step S104, the browser parses, in real time, the page component, such as a picture, a text box, a label, a button, etc., obtained by the Json package of the visual page, and other format contents, such as a color, a background, a display proportion, etc., obtained by the Json real-time parsing, renders and generates the format contents of the visual page by using a rendering engine built in the browser itself, generates an HTML file of the visual page in real time, and displays the visual page. When the browser rendering engine renders and generates the visual page format content, the browser may parse the visual page Json program package, acquire all the page components and parsing results, and uniformly render and generate the visual page format content; and the visual page Json program package can be analyzed to obtain the page assembly and the analysis result, and the visual page format content can be rendered and generated at the same time, so that real-time analysis of the visual page Json program package is truly realized, and the visual page format content is generated at real time.
In step S105, the browser sends the configuration data source bound to the page component acquired in step S103 to the server, and the server acquires the data content of the visual page according to the configuration data source bound to the page component.
In step S106, the server sends the acquired data content of the visual page to the browser, and the browser loads the data content into the page component bound with the configuration data source, so as to generate the complete visual page.
By the arrangement, the visual page ID is obtained, and then the visual page Json program package is directly obtained, so that the complex process that a page configuration system is required to independently generate an HTML file in the prior art, then export the HTML file to the local and finally form a program capable of running a web is omitted; the visual page Json program package is analyzed in real time through JS language, the visual page is generated in real time, when page configuration content is modified, the latest visual page Json program package can be obtained in real time, the latest visual page configuration content is analyzed and generated in real time, various data are obtained and displayed in real time, the page updating efficiency is improved, the visual page content is enriched, and the real-time, efficient, simple and convenient business requirements of the medical industry on page generation can be met.
Further, the visualization page Json package is generated by a page configuration system, including the page component and an attribute configuration, wherein,
the page component comprises a preset component and/or a user configuration component, and is used for forming the format content of the visual page;
the attribute configuration includes a display style for setting the format content of the visual page and an event including binding the page component with the configuration data source for setting the data content of the visual page.
Specifically, the page configuration system is configured to configure the visualization page, and finally generate the visualization page Json package, and the page configuration system includes:
the visual design interface module is used for visually configuring the visual page and comprises a page assembly sub-module, a design page sub-module and an attribute configuration sub-module;
wherein the page component submodule comprises a plurality of page components, and optionally one or more of the page components form format contents of the visual page; the design page submodule comprises a design page, wherein the design page is used for displaying a page component and a display style of the visual page; the attribute configuration submodule comprises an attribute configuration interface, wherein the attribute configuration interface is used for configuring a display style and an event of the visual page;
wherein the design page is a base template of the visualization page; the page component is one of format contents arranged on the basic template, and the display style in the attribute configuration is other format contents of the visual page. The attribute configuration interface can perform attribute configuration on the design page independently, for example, configuration of a display style of the design page including background color, display proportion and the like, or perform attribute configuration on the page component independently, for example, configuration of a display style of the page component including color, display proportion, display content and the like, or independently configure contents such as a data acquisition way, a data processing way, a data presentation format and the like of the page component through setting an event to generate data content in the page component, so as to realize binding of the page component and the configuration data source, or simultaneously configure the display style and the event of the design page and/or the page component.
The Json generation module is used for analyzing the visual page format contents and the data contents such as the page components, the attribute configuration and the like configured in the visual design interface module, generating the visual page Json program package and corresponding to at least one visual page ID.
Further, the page component comprises a preset component and/or a user configuration component, wherein the preset component is a component preset by the page configuration system, and the user configuration component is a component generated by the page configuration system.
Specifically, the visual page configured by the user through the visual design interface module can be stored as the visual page when stored, a corresponding visual page Json program package is generated, and the corresponding visual page ID is corresponding to the visual page Json program package; the user configuration component can also be saved as one of the page components and is saved in the page component sub-module; the user configuration component and the visual page can be saved, so that diversified configuration requirements of users can be met, and repeated configuration of the users can be reduced. By setting the user configuration component, a user can rapidly develop a large number of page functions suitable for own business, and the workload is reduced.
Further, the user configuration component comprises a sharing component and/or a non-sharing component, and when the sharing component is modified, all the visual pages configuring the sharing component are modified; when the non-shared component is modified, all the visual pages configuring the non-shared component are not modified.
Further, as one embodiment, the visualization page Json package further includes a mapping model, the mapping model including the configuration data source, the query data source, and the mapping relationship,
the configuration data source is a data source mapped by the mapping model;
the query data source comprises one or more of a service system database, a data table and a field;
the mapping relation binds the configuration data source with the query data source and sends the query data of the query data source to the configuration data source.
Specifically, in the event in the visualization page Json package, the configuration data source bound to the page component may be a direct data source for directly storing service data, such as a database of each service system of a hospital or a database of the clinical data center, or may be a mapping data source obtained by mapping the direct data source through a mapping model. The mapping model comprises a configuration data source which can be directly bound with the page component, a query data source which directly stores each service data and provides query data according to a data acquisition instruction, and a mapping relation which binds the configuration data source with the query data source and sends the query data of the query data source to the configuration data source. The query data source not only comprises the service system database or the clinical data center database, but also comprises each data table stored in the database and each field in each data table, namely, the query data source comprises any one or more of a service system database, a data table and a field combination.
Through setting the mapping model, the configuration data source and the query data source are bound through the mapping relation, when the browser analyzes the visual page Json program package in real time based on JS language to generate the visual page, the server sends query data of different format attributes stored in different business systems and different query data sources to corresponding configuration data sources, so that data content in a designated page component of the visual page is generated, a medical information system and a page configuration system can be isolated, configuration of page data content can be simplified, the volume of the visual page Json program package is reduced, the speed of JS real-time analysis of the visual page Json program package is improved, and page generation efficiency is improved. Meanwhile, the relative stability of the visual page can be maintained, the data content of the visual page is updated in real time, when one or more of query data source names or data formats in the service system database, the data table and the fields are changed, the visual page Json program package is generated without being modified again, and the latest service data content can be acquired by the visual page in real time only by modifying the mapping relation in the mapping model according to the situation, so that the high-efficiency and simple service requirements of the medical industry on page generation can be met.
Fig. 2 is a flow chart of generating the format content of the visual page based on JS real-time parsing rendering in one embodiment, and as one embodiment, in step S104, a method for generating the format content according to the page component and the real-time parsing result rendering of the visual page Json package, as shown in fig. 2, includes:
step S201: analyzing and acquiring the display style in the attribute configuration aiming at the visual page in the visual page Json program package through JS language in real time;
step S202: analyzing and acquiring the position layout of the page component in the visual page Json program package in real time through JS language;
step S203: analyzing and acquiring the display style in the attribute configuration aiming at the page component in the visual page Json program package through JS language in real time;
step S204: generating the format content of the visual page according to the display style for the visual page, the page component, the position layout of the page component and the display style rendering for the page component.
Specifically, in step S201, a page display style, such as a background color, a display proportion, and the like, for the visual page in the visual page Json package is obtained through real-time parsing in JS language.
In step S202, the position layout of the page component in the visual page Json package is obtained through real-time parsing in JS language as follows: the picture as one page component is placed on the top in the visual page, the text box page component is placed on the left below, the label page component is arranged on the right side of the text box, and the editable form page component is arranged below the text box and the label. Thereby acquiring the specific positions of all the page components in the visualized page.
In step S203, the display style of the visual page Json package for the page component is obtained through real-time parsing in Json language, such as the display size, background color, and the display style of the page component including the picture, the text box, the editable form, and the display size, the background color, and the display character of the label.
In step S204, the format content of the visual page is generated according to the display style for the visual page, the page component, the position layout of the page component, and the display style rendering for the page component. For example, the visual page is displayed according to a screen ratio of 1:1, the size of the client display screen is automatically adapted to display the visual page, the page background is white, other page components are displayed according to a fixed proportion with the page, the font color is black, the background color is light blue, and the format content of the visual page is rendered and generated according to the specific position acquired in the step S202.
By means of the method, when the JS language analyzes the visual page Json program package in real time to generate the visual page, format content of the visual page is generated rapidly and accurately, and then data content of the visual page is loaded independently, so that the problems of low generation speed and poor user experience of the visual page caused by long-time waiting for the data content are avoided, page generation speed and accuracy are improved, and user experience is improved.
Fig. 3 is a flowchart of acquiring the visual page data content based on JS real-time parsing in one embodiment, and as one embodiment, the method for acquiring the data content according to the configuration data source bound to the page component in step S105, as shown in fig. 3, includes:
step S301: acquiring the corresponding mapping model according to the configuration data source bound with the page component;
step S302: acquiring the query data source according to the configuration data source and the mapping model which are bound with the page component;
step S303: transmitting the query data in the query data source to the configuration data source through the mapping relation in the mapping model;
step S304: and directly generating the data content by the query data sent to the configuration data source, or generating the data content by function processing.
Specifically, in step S301, by way of example, the editable form page component in the visual page is bound to the patient name, age, and sex fields in the outpatient/emergency patient data table in the configuration data source, that is, the Json program package of the visual page is parsed in real time to obtain the patient name, age, and sex fields in the outpatient/emergency patient data table as the configuration data source bound to the page component, and then the mapping model a corresponding to the outpatient/emergency patient data table is obtained according to the above fields.
In step S302, the mapping model a uses the gate/emergency patient data table as a configuration data source, uses a gate/emergency registration table of a gate/emergency registration subsystem in a hospital management information system (totally called Hospital Information System, HIS system) of the first company version 2.0 as a query data source, and has a mapping relationship that fields and field data are equal in one-to-one correspondence; i.e. all fields of the gate/emergency registration list are included in the mapping model, for example, field data including identification card number, contact phone, registration time, etc. in addition to patient name, age, sex fields. In this step, the server obtains the patient name, age, sex field in the portal/emergency registration table as the query data source bound to the page component according to the patient name, age, sex field bound to the editable form and all field information of the portal/emergency patient data table in the mapping model a.
In step S303, according to the mapping relationship that the patient name, age, and sex fields in the gate/emergency patient data table in the mapping model a are equal to the patient name, age, and sex fields in the gate/emergency registration table in one-to-one correspondence, the query data in the patient name, age, and sex fields in the gate/emergency registration table is sent to the patient name, age, and sex fields in the gate/emergency patient data table.
In step S304, the data under the name, age and sex fields of the patient sent to the gate/emergency patient data table may be directly used as the data content in the visual page editable table, or the data under the name, age and sex fields of the patient sent to the gate/emergency patient data table may be filtered out by a filtering function, and the patient data with age less than 60 years old may be filtered out as the data content in the visual page editable table.
By the arrangement, the medical information system and the page configuration system can be isolated, the configuration of page data content can be simplified, the size of the visual page Json program package is reduced, the speed of JS real-time analysis of the visual page Json program package is improved, page generation efficiency is improved, meanwhile, the relative stability of the visual page can be kept, the latest service data content can be acquired by the visual page in real time, and the high-efficiency and simple service requirements of the medical industry on page generation can be met.
As an embodiment, each mapping model corresponds to a segment of mapping model Json program statement and corresponds to a mapping model ID, the mapping model Json program statement is used to describe the mapping model, the mapping model ID is used to identify the mapping model, and the mapping model Json program statement and/or the mapping model ID are/is included in the visualization page Json package.
Specifically, one mapping model includes multiple mapping tables, each mapping model includes multiple data, so if the mapping model is completely stored in the visualized page Json program package, the visualized page Json program package will become huge and complicated in data volume, which is not favorable for storage, and is not favorable for the browser to analyze the visualized page Json program package in real time based on the JS language, so that the real-time generation efficiency of the visualized page is reduced, and therefore, in the embodiment, each mapping model corresponds to a segment of mapping model Json program statement, which is used for describing the structure of the mapping model, for example, describing the mapping model includes several mapping tables, the storage position, the storage content and the like of each mapping table, and by storing the mapping model Json program statement in the visualized page Json program package, the network transmission efficiency is improved, the acquisition time of the visualized page Json program package is shortened, and the real-time analysis of the visualized page Json program package is favorable for improving the real-time generation speed of the visualized page Json program package.
Furthermore, a section of mapping model Json program statement is adopted to describe the mapping model structure instead of other formats, for example, an XML format is adopted to describe the mapping model, because JSON is a lightweight data exchange format, text formats completely independent of programming languages are adopted to store and represent data, the hierarchical structure is simple and clear, the JSON is easy to read and write by people, meanwhile, the JSON is easy to analyze and generate by machines, the network transmission efficiency is improved more effectively, the speed and the efficiency of generating a visual page by analyzing the Json program package of the visual page in real time are improved more effectively, and in the aspect of effective data rate, JSON is used as a data package format to transmit with higher efficiency, so that the effective data volume is greatly improved compared with the total data package, and the transmission pressure of the network is improved under the condition of reducing the same data flow. Therefore, a section of the mapping model Json program statement is adopted to describe the mapping model structure, and other formats are not adopted, so that the real-time, efficient, simple and convenient business requirements of the medical industry on page generation can be met.
In this embodiment, each mapping model corresponds to a mapping model Json program sentence and also corresponds to a mapping model ID, where the mapping model ID is used to identify the mapping model. By including the mapping model ID in the visualization page Json package, the volume of the visualization page Json package can be made smaller, the speed of the Json language real-time parsing of the visualization page Json package is faster, and the speed and efficiency of generating the visualization page are also higher.
As an embodiment, the mapping model Json program statement includes the mapping model ID, which is used to describe and identify the mapping model, and the mapping model Json program statement is included in the visualization page Json package.
Specifically, the mapping model ID is added into the mapping model Json program statement, so that the mapping model can be more comprehensively described by the mapping model Json program statement, the mapping model represented by each mapping model Json program statement can be more clearly identified, the JS language real-time analysis of the mapping model Json program statement is facilitated, the mapping model is quickly obtained, and the real-time generation speed and efficiency of a visual page are further improved.
FIG. 4 is a flowchart of a query data source for obtaining the data content based on JS real-time parsing in one embodiment, and as one embodiment, a method for obtaining the query data source according to the configuration data source and the mapping model bound with the page component in step S302, as shown in FIG. 4, includes:
step S401: analyzing the mapping model Json program sentences in the visual page Json program package in real time through JS language to obtain all the mapping relations in the mapping model;
step S402: and searching and acquiring the corresponding query data source in all the mapping relations according to the configuration data source bound with the page component.
Specifically, when the visualization page Json program package contains the mapping model Json program statement, the overall structure of the mapping model can be obtained by analyzing the mapping model Json program statement in real time through a JS language, and then all the mapping relations in the mapping model are obtained; and then searching and acquiring the query data source corresponding to the page component in all the mapping relations in the mapping model according to the configuration data source bound to the page component. And acquiring query data through a server, generating the data content of the visual page, and sending the data content to a corresponding page component in the visual page of the browser, wherein the data content and the visual page format content form the final visual page.
Fig. 5 is a flowchart of a query data source for obtaining data content based on JS real-time parsing in another embodiment, and as another embodiment, a method for obtaining the query data source according to the configuration data source and the mapping model bound to the page component in step S302, as shown in fig. 5, includes:
step S501: analyzing the visual page Json program package in real time through JS language to obtain the mapping model ID;
step S502: acquiring the Json program statement of the mapping model through the ID of the mapping model;
step S503: analyzing the Json program statement of the mapping model in real time through JS language to obtain all the mapping relations in the mapping model;
step S504: and searching and acquiring the corresponding query data source in all the mapping relations according to the configuration data source bound with the page component.
Specifically, when the visualization page Json program package contains the mapping model ID, analyzing the visualization page Json program package in real time through JS language to obtain the mapping model ID, and sending the mapping model ID to a server, so that the server obtains the mapping model Json program statement through the mapping model ID, and the overall structure of the mapping model can be obtained by analyzing the mapping model Json program statement in real time through JS language, thereby obtaining all the mapping relations in the mapping model; and then searching and acquiring the query data source corresponding to the page component in all the mapping relations in the mapping model according to the configuration data source bound to the page component. And further, acquiring the query data through a server, generating the visual page data content, and sending the data content to a corresponding page component in the visual page of the browser, wherein the data content and the visual page format content form the final visual page.
In summary, the method and the device directly acquire the visual page Json program package by acquiring the visual page ID, so that the complex process that a page configuration system is required to independently generate an HTML file, export the HTML file to the local and finally form an operable web program in the prior art is omitted; according to the method, based on JS language, the visual page Json program package is analyzed in real time, the visual page is generated in real time, when page configuration content is modified, the latest visual page Json program package can be obtained in real time, the latest visual page configuration content is analyzed and generated in real time, various data are obtained and displayed in real time, the page updating efficiency is improved, the visual page content is enriched, and the real-time, efficient, simple and convenient business requirements of the medical industry on page generation can be met.
The embodiment of the application also provides a computer, which comprises a memory, a processor and a computer program stored on the memory and capable of running on the processor, wherein the computer program running on the computer processor comprises the page generation method based on JS real-time analysis. The embodiments of the page generating method can be referred to specifically, and will not be described herein.
The above-described embodiments are merely illustrative, and a person skilled in the art may select some or all of them according to actual needs to achieve the object of the embodiment solution. Although the present application is disclosed above, the present application is not limited thereto. Modifications and variations of the foregoing embodiments, as well as equivalent arrangements of parts, will occur to those skilled in the art, and are within the skill of the art to which the present application pertains; such modifications, changes or substitutions do not depart from the spirit and scope of the embodiments of the present application, and are intended to be included within the scope of the present disclosure. Therefore, the protection scope of the present disclosure shall be subject to the protection scope of the claims.