Page code generation method and device, electronic equipment, storage medium and product

Abstract

The invention relates to a page code generation method and device, electronic equipment, a storage medium and a product. The method comprises the following steps: determining at least one current local blueprint from a page blueprint indicating a target page; for each current local blueprint, a target logic code corresponding to the current local blueprint is predicted by using the target large language model, and the target logic code is used for representing triggering conditions required to be met when the plurality of service components are triggered respectively; for each current local blueprint, generating a page code corresponding to the current local blueprint based on the target logic code and respective page description information of the plurality of business components, the page description information being determined based on a visual object corresponding to the business components; and obtaining a page code corresponding to the page blueprint based on the page code corresponding to the at least one current local blueprint. The invention provides a page code generation scheme with higher efficiency and convenience.

Description

Technical Field

[0001] This application relates to the field of Internet communication technology, and in particular to a method, apparatus, electronic device, storage medium and product for generating page code. Background Technology

[0002] With the rapid development of internet communication technology, more and more business scenarios require the support of front-end development, making it particularly important and urgent to improve development efficiency. However, in related technologies, designers typically provide page design drafts, which developers then use to write the page code, resulting in low development efficiency. Therefore, a more efficient page code generation solution is needed. Summary of the Invention

[0003] To address at least one of the aforementioned technical problems, this application provides a page code generation method, apparatus, electronic device, storage medium, and product:

[0004] According to a first aspect of this application, a page code generation method is provided, applied to a target platform, the method comprising:

[0005] At least one current partial blueprint is determined from the page blueprint indicating the target page, the current partial blueprint including at least one visual object;

[0006] For each of the current local blueprints, the target logic code corresponding to the current local blueprint is predicted using the target large language model. The target logic code is used to characterize the triggering conditions that need to be met for multiple business components to be triggered. The multiple business components are determined based on the business scenarios supported by the at least one visual object.

[0007] For each of the current partial blueprints, based on the target logic code and the page description information of each of the multiple business components, page code corresponding to the current partial blueprint is generated, and the page description information is determined based on the visual object corresponding to the business component;

[0008] Based on the page code corresponding to each of the at least one current local blueprint, the page code corresponding to the page blueprint is obtained.

[0009] According to a second aspect of this application, a page code generation apparatus is provided, configured on a target platform, the apparatus comprising:

[0010] Local blueprint determination module: used to determine at least one current local blueprint from the page blueprint indicating the target page, the current local blueprint including at least one visual object;

[0011] Logic code prediction module: For each of the current local blueprints, the target logic code corresponding to the current local blueprint is predicted using the target large language model. The target logic code is used to characterize the triggering conditions that multiple business components need to be triggered. The multiple business components are determined based on the business scenarios supported by the at least one visual object.

[0012] Local page code generation module: for each of the current local blueprints, based on the target logic code and the page description information of each of the multiple business components, the page description information is determined based on the visual object corresponding to the business component;

[0013] Global Page Code Acquisition Module: Used to obtain the page code corresponding to the page blueprint based on the page code corresponding to each of the at least one current local blueprint.

[0014] According to a third aspect of this application, an electronic device is provided, the electronic device including at least one processor and a memory communicatively connected to the at least one processor; wherein the memory stores at least one instruction or at least one program, the at least one instruction or at least one program being loaded and executed by the at least one processor to implement the page code generation method as described in the first aspect.

[0015] According to a fourth aspect of this application, a computer-readable storage medium is provided, wherein at least one instruction or at least one program is stored therein, the at least one instruction or at least one program being loaded and executed by a processor to implement the page code generation method as described in the first aspect.

[0016] According to a fifth aspect of this application, a computer program product is provided, the computer program product comprising at least one instruction or at least one program segment, the at least one instruction or at least one program segment being loaded and executed by a processor to implement the page code generation method as described in the first aspect.

[0017] It should be understood that the above general description and the following detailed description are exemplary and explanatory only, and are not intended to limit this application.

[0018] Implementing this application will have the following beneficial effects:

[0019] This application provides a more efficient and convenient page code generation scheme. Starting from the current local blueprint, this application utilizes a target large language model to predict target logic code based on the visual information provided by the current local blueprint. Leveraging the image processing capabilities of the target large language model, it can improve the efficiency of obtaining target logic code while simultaneously componentizing the current local blueprint and integrating business logic. Based on this, UI-side information (corresponding to the page description information of multiple business components) and business logic-side information (corresponding to target logic code) for business components are fused to generate the page code corresponding to the current local blueprint, thus obtaining the page code corresponding to the page blueprint. This improves the convenience and efficiency of obtaining page-level code.

[0020] Other features and aspects of this application will become clear from the following detailed description of exemplary embodiments with reference to the accompanying drawings. Attached Figure Description

[0021] To more clearly illustrate the technical solutions and advantages in the embodiments of this application or the prior art, the drawings used in the description of the embodiments or the prior art will be briefly introduced below. Obviously, the drawings described below are only some embodiments of this application. For those skilled in the art, other drawings can be obtained based on these drawings without creative effort.

[0022] Figure 1 This diagram illustrates an application environment according to an embodiment of the present application.

[0023] Figure 2 A flowchart illustrating a data processing method according to an embodiment of this application is shown;

[0024] Figure 3 This diagram illustrates a flowchart of obtaining the page code corresponding to the current partial blueprint according to an embodiment of this application.

[0025] Figure 4 This diagram illustrates a process for generating page code corresponding to the current partial blueprint according to an embodiment of this application.

[0026] Figure 5 A schematic diagram illustrating an interface guiding a user to upload design drafts according to an embodiment of this application;

[0027] Figure 6 A schematic diagram of an interface for recommending modules to a user according to an embodiment of this application is shown;

[0028] Figure 7 A schematic diagram illustrating the interface guiding users to upload reconstructed drafts according to an embodiment of this application;

[0029] Figure 8A schematic diagram of the interface for the service event configuration step according to an embodiment of this application is shown;

[0030] Figure 9 A schematic diagram showing the visual arrangement result according to an embodiment of this application;

[0031] Figure 10 A flowchart illustrating the processing of an uploaded design draft according to an embodiment of this application is shown.

[0032] Figure 11 This illustration shows an application diagram of the visual arrangement results according to an embodiment of this application;

[0033] Figure 12 This diagram illustrates an application of the execution engine according to an embodiment of this application.

[0034] Figure 13 This diagram illustrates the application of a dynamic engine according to an embodiment of this application.

[0035] Figure 14 This diagram illustrates an application of page code according to an embodiment of this application.

[0036] Figure 15 This diagram illustrates a device block diagram according to an embodiment of the present application;

[0037] Figure 16 A schematic diagram of an electronic device according to an embodiment of this application is shown. Detailed Implementation

[0038] The technical solutions of the embodiments of this application will be clearly and completely described below with reference to the accompanying drawings. Obviously, the described embodiments are only some embodiments of this application, and not all embodiments. Based on the embodiments of this application, all other embodiments obtained by those of ordinary skill in the art without creative effort are within the scope of protection of this application.

[0039] It should be noted that the terms "first," "second," etc., in the specification, claims, and accompanying drawings of this application are used to distinguish similar objects and are not necessarily used to describe a specific order or sequence. It should be understood that such data can be interchanged where appropriate so that the embodiments of this application described herein can be implemented in orders other than those illustrated or described herein. Furthermore, the terms "comprising" and "having," and any variations thereof, are intended to cover non-exclusive inclusion; for example, a process, method, system, product, or server that comprises a series of steps or units is not necessarily limited to those steps or units explicitly listed, but may include other steps or units not explicitly listed or inherent to such processes, methods, products, or devices.

[0040] In this application embodiment, the terms "module" or "unit" refer to a computer program or part of a computer program that has a predetermined function and works with other related parts to achieve a predetermined goal, and can be implemented wholly or partially using software, hardware (such as processing circuitry or memory), or a combination thereof. Similarly, a processor (or multiple processors or memory) can be used to implement one or more modules or units. Furthermore, each module or unit can be part of an overall module or unit that includes the functionality of that module or unit.

[0041] Various exemplary embodiments, features, and aspects of this application will now be described in detail with reference to the accompanying drawings. The same reference numerals in the drawings denote elements that have the same or similar functions. Although various aspects of the embodiments are shown in the drawings, they are not necessarily drawn to scale unless specifically indicated otherwise.

[0042] The term “exemplary” as used herein means “serving as an example or embodiment.” Any embodiment illustrated herein as “exemplary” is not necessarily to be construed as superior to or better than other embodiments.

[0043] In this document, the term "and / or" is merely a description of the relationship between related objects, indicating that three relationships can exist. For example, A and / or B can represent three cases: A alone, A and B simultaneously, and B alone. Furthermore, the term "at least one" in this document means any combination of at least two of any one or more elements. For example, including at least one of A, B, and C can mean including any one or more elements selected from the set consisting of A, B, and C.

[0044] Furthermore, to better illustrate this application, numerous specific details are provided in the following detailed description. Those skilled in the art should understand that this application can be implemented without certain specific details. In some instances, methods, means, components, and circuits well-known to those skilled in the art have not been described in detail in order to highlight the main points of this application.

[0045] Before providing a further detailed description of the embodiments of this application, the nouns and terms involved in the embodiments of this application will be explained, and the nouns and terms involved in the embodiments of this application shall be interpreted as follows.

[0046] Domain-Specific Language (DSL): A language tool used to solve business problems in specific scenarios.

[0047] Logic Schema: A data model representation for a specific problem domain.

[0048] Please see Figure 1 , Figure 1The diagram illustrates an application environment according to an embodiment of this application. The application environment may include a terminal 10 and a server 20. The terminal 10 and server 20 can be directly or indirectly connected via wired or wireless communication. A target object (e.g., a target user) sends a page code generation request to the server 20 through the terminal 10. The server 20 obtains a page blueprint indicating the target page based on the received page code generation request, and then determines at least one current partial blueprint from the page blueprint. The current partial blueprint includes at least one visual object. Next, for each current partial blueprint, the server predicts the target logic code corresponding to the current partial blueprint using a target large language model. The target logic code is used to characterize the triggering conditions that multiple business components must meet to be triggered. The multiple business components are determined based on the business scenarios supported by at least one visual object. Furthermore, for each current partial blueprint, based on the target logic code and the page description information of each of the multiple business components, the server generates the page code corresponding to the current partial blueprint. The page description information is determined based on the visual object corresponding to the business component. Finally, based on the page codes corresponding to at least one current partial blueprint, the server obtains the page code corresponding to the page blueprint. It should be noted that... Figure 1 This is just one example.

[0049] Terminal 10 can be a physical device such as a smartphone, computer (e.g., desktop computer, tablet computer, laptop computer), augmented reality (AR) / virtual reality (VR) device, digital assistant, smart voice interaction device (e.g., smart speaker), smart wearable device, smart home appliance, in-vehicle terminal, etc. The operating system of Terminal 10 can be Android, iOS (a mobile operating system developed by Apple), Linux, Microsoft Windows, etc. Applications can be installed on Terminal 10, such as browser applications, news feed applications, video applications, game applications, navigation applications, etc.

[0050] The server-side component 20 can be a standalone physical server, a server cluster or distributed system composed of multiple physical servers, or a cloud server providing basic cloud computing services such as cloud services, cloud databases, cloud computing, cloud functions, cloud storage, network services, cloud communication, middleware services, domain name services, security services, CDN (Content Delivery Network), and big data and artificial intelligence platforms. The server may include network communication units, processors, and memory, etc.

[0051] In practical applications, the target platform can consist of a server and multiple terminals. The server performs background data processing tasks, while the terminals receive user commands. Alternatively, the target platform can also instruct the server, in which case the server can obtain user commands by providing an interactive interface.

[0052] It should be noted that when page blueprints, interface diagrams, target logic information, etc., which are related to user information, are applied to specific products or technologies, user permission or consent is required, and the collection, use and processing of related data must comply with the relevant laws, regulations and standards of the relevant countries and regions.

[0053] Figure 2 This diagram illustrates a flow chart of a page code generation method according to an embodiment of this application, such as... Figure 2 As shown, the page code generation method can be executed by the target platform. This method includes:

[0054] S201: Determine at least one current partial blueprint from the page blueprint indicating the target page, the current partial blueprint including at least one visual object;

[0055] In this embodiment, the target platform determines at least one current partial blueprint from the page blueprint indicating the target page. The page blueprint indicating the target page can be considered as a whole, and the current partial blueprint can be this whole or a part of this whole. The page blueprint can provide a visual design overview of the target page, and the page blueprint can include at least one visual object. A visual object can be used to represent an image, text, etc.

[0056] When determining the current partial blueprint from the page blueprint, consider the visual object style and position information provided by the page blueprint. At least one visual object in the determined current partial blueprint should have a similar style and be in a similar position. Alternatively, consider the overall layout provided by the page blueprint. For example, if the overall layout reflects the sidebar design and banner design of the target page, then the part corresponding to the sidebar design can be used as one current partial blueprint, and the part corresponding to the banner design as another.

[0057] As one possible implementation, such as Figure 3 As shown, after determining at least one current partial blueprint from the page blueprint indicating the target page, the method further includes:

[0058] S301: Determine a target historical local blueprint that matches the current local blueprint from multiple historical local blueprints;

[0059] S302: Adjust the page code corresponding to the target historical partial blueprint to adapt to the current partial blueprint, so as to obtain the page code corresponding to the current partial blueprint.

[0060] Historical partial blueprints can be derived from historical page blueprints. The page code corresponding to the historical partial blueprints is known. The similarity between each historical partial blueprint and the current partial blueprint can be determined, and then the historical partial blueprint with the highest similarity can be taken as the target historical partial blueprint. Here, similarity calculation can focus on the similarity of visual objects at corresponding positions in the two partial blueprints in terms of style. Since the page code corresponding to the historical partial blueprints is known, using this as the basis for adjustments to obtain the page code corresponding to the current partial blueprint can balance efficiency and accuracy. It can be understood that the page code corresponding to the historical partial blueprints involves both UI-side and business logic-side information of relevant business components. When making adjustments to adapt to the current partial blueprint, for UI-side information, we can consider whether the relevant business components can support the reproduction of the current partial blueprint, and adjust the quantity and attributes of the relevant business components accordingly; for business logic-side information, we can choose to reuse it.

[0061] In practical applications, for multiple historical partial blueprints and their corresponding page codes, the decision to continue maintenance or delete them can be based on the generation time of the page code corresponding to each historical partial blueprint and the number of times that page code has been used as the basis for adjustment. For example, a batch of historical partial blueprints may include multiple candidate partial blueprints, and the generation time of the page code corresponding to each candidate partial blueprint may fall within a preset historical time interval. If the duration between the current time and the end of the preset historical time interval is greater than a preset duration, the number of times the page code corresponding to each candidate partial blueprint has been used as the basis for adjustment is determined. Page codes corresponding to candidate partial blueprints with fewer than the preset number of adjustments are deleted, and the candidate partial blueprint itself is also deleted. This improves matching efficiency and saves computational resources.

[0062] Furthermore, determining the target historical local blueprint that matches the current local blueprint from multiple historical local blueprints may include the following steps: First, displaying a local blueprint processing interface, the local blueprint processing interface including a first area and a second area, the first area displaying the current local blueprint, and the second area displaying at least one candidate historical local blueprint, the candidate historical local blueprint being a local blueprint among the multiple historical local blueprints whose similarity to the current local blueprint is greater than a preset similarity; then, in response to a selection operation on the second area, determining that the selected candidate historical local blueprint is the target historical local blueprint.

[0063] Taking a target platform consisting of a server and multiple terminals as an example, the terminals can display a partial blueprint processing interface and receive selection operations from the target object for the second area; alternatively, the server-side interactive interface can display the partial blueprint processing interface and receive selection operations from the target object for the second area. Taking a target platform instructing a server as an example, the server-side interactive interface can display the partial blueprint processing interface and receive selection operations from the target object for the second area.

[0064] In the displayed partial blueprint processing interface, one area shows the object to be processed, i.e., the current partial blueprint; the other area shows at least one candidate historical partial blueprint. The displayed candidate historical partial blueprints represent the results of filtering multiple historical partial blueprints, which helps improve the quality of the candidate historical partial blueprints. The two areas better support intuitive comparison between two partial blueprints. This visual interface interaction with the user, using the user-selected candidate historical partial blueprint as the target historical partial blueprint, increases the flexibility in determining the target historical partial blueprint.

[0065] As a possible implementation, the method may further include the following steps for step S201: First, acquiring target logic information sent by the target object; then, generating candidate code representing the target logic information; and further, converting the candidate code based on preset rules to obtain the target logic code, wherein the target logic code uses a domain-specific programming language.

[0066] This section describes the process of codifying user-provided target logic information. Having the user provide the basic target logic information improves the flexibility in obtaining the target logic code. For example, the target logic information can be in text format. The generated candidate codes representing the target logic information can indicate a Logic Schema. The target logic information can be visually orchestrated, and the candidate codes can be generated based on the visual orchestration results. This improves the organization of the generated candidate codes and avoids omitting relevant business logic. The visual orchestration results can be referenced... Figure 9 , 11 The visual orchestration results can be represented as a logical flowchart with ordered nodes. Figure 11Two visual orchestration results are provided. The right-hand visual orchestration result is obtained by updating a node (such as "Animation - Flip Card") from the left-hand visual orchestration result. Correspondingly, the right-hand visual orchestration result reuses three nodes from the left-hand result. Based on this, the transformation result, i.e., the target logic code, can be obtained by removing content unrelated to the execution engine's output code. Content unrelated to the execution engine's output code can include canvas graphic colors, node position information, etc., which are related to the visual orchestration results displayed in the graphical interface. The target logic code uses a domain-specific programming language. The concise expression of the target logic code also facilitates its further maintenance and reuse. In practical applications, such as... Figure 12 As shown, the execution engine can be used to parse the target logic code. Figure 12 It illustrates the key considerations during the parsing process. For example, the programming language used to parse the object should be a domain-specific language; field mapping and conversion need to be considered during parsing; and how to handle errors that occur during parsing.

[0067] Furthermore, after obtaining the target logic information sent by the target object, the method may further include the following steps: First, determine the second logic information that matches the target logic information from multiple first logic information, wherein the multiple first logic information corresponds to multiple historical partial blueprints; then, determine the logic code corresponding to the second logic information as the target logic code. It can be understood that the first logic information is provided by the relevant user for the historical partial blueprint. The process of obtaining the logic code corresponding to the first logic information can refer to the aforementioned process of obtaining the target logic code corresponding to the target business logic information. Compared to processing the target business logic information (such as generating candidate code and converting the candidate code) to obtain the target logic code, here, by matching and locating the second logic information, and then using the logic code corresponding to the second logic information, both efficiency and accuracy in obtaining the target logic code can be balanced. Matching two pieces of logic information can be achieved by matching the node dimensions of the visualization orchestration results corresponding to each of the two pieces of logic information.

[0068] In practical applications, the maintenance of "multiple first logical information and the corresponding logical code of each first logical information" can also refer to the aforementioned maintenance of "multiple historical partial blueprints and the corresponding page code of each historical partial blueprint", and will not be repeated here.

[0069] S202: For each of the current local blueprints, the target logic code corresponding to the current local blueprint is predicted using the target large language model. The target logic code is used to characterize the triggering conditions that need to be met for multiple business components to be triggered. The multiple business components are determined based on the business scenarios supported by the at least one visual object.

[0070] In this embodiment, for each current local blueprint, the target platform uses a target large language model to predict the target logic code corresponding to the current local blueprint. The target logic code is used to characterize the triggering conditions that multiple business components need to meet to be triggered. The multiple business components are determined based on the business scenario supported by at least one visual object. A processing method for predicting the target logic code using a target large language model is provided here. It can identify the image or text meaning corresponding to each visual object in the current local blueprint, as well as the style (such as size, color, etc.) and position of each visual object in the current local blueprint, to predict the target function implementation logic of the business scenario in which the current local blueprint is located. The target function implementation logic can indicate the logical link between the local functions each of at least one visual object is responsible for. For example, local function 1, which visual object 1 is responsible for, is a prerequisite for local function 2, which visual object 2 is responsible for. Of course, the logical link can consist of a main link and at least one branch link. Then, based on the target function implementation logic, the association between at least one visual object and multiple business components is established, thus realizing the componentization of the current local blueprint. One of the visual objects can have an association relationship with at least one business component. The candidate source of the business components consists of multiple preset components. Preset components can be UI components, such as button components, text box components, dropdown menu components, checkbox components, slider components, etc. When establishing an association between a visual object and at least one business component, on the one hand, at least one business component needs to support the reproduction of the visual object, and on the other hand, at least one business component needs to carry the local functions responsible for the visual object. Furthermore, based on the target functional implementation logic, target logic code is generated around multiple business components. The target logic code is used to characterize the triggering conditions that must be met for multiple business components to be triggered. For each triggering condition, it defines how to trigger a business component; if the condition is met, then the business component is triggered. Triggering conditions can indicate a specific time, a specific operation, etc. A business component being triggered can mean that the business component is displayed in a specific format, or that the functional logic bound to the business component is executed. For example, business component A is a text box component; business component A is triggered every hour on the hour, and after being triggered, business component A highlights the internal text by changing its border color. Business component B is a button component; business component B is triggered when it receives a click operation, and after being triggered, the functional logic indicating page navigation is executed. It should be understood that both the local functionality and the preconditions are at the visual object level. On one hand, since the local functionality has been decomposed and migrated to the business component level, the preconditions should also be decomposed and migrated to the business component level. Here, the triggering conditions decomposed from the preconditions can point to the same business component or to other business components to establish business logic between the two business components. On the other hand, the triggering conditions decomposed from the preconditions can also point to external information.In addition, considering that the same business component may have different display formats, such as displaying it with two different levels of transparency, the triggering conditions corresponding to the same business component can have multiple sub-conditions that adapt to the granularity of the display format.

[0071] The system can take the current local blueprint and preset prompt text as input, and output target logic code using the target large language model. The preset prompt text provides the functions of several preset components and guides the output of the target large language model. In practical applications, the guidance of the preset prompt text on the output of the target large language model can be handled by the prompt itself. The current local blueprint and the functions of the various preset components can be considered as components of a prompt. The prompt inputting the target large language model is as follows: "You are a professional front-end developer. Please use your expertise to answer my question. Generate the target logic code for the current local blueprint based on the [current local blueprint] and the [functions of the various preset components]."

[0072] As a possible implementation, the method may further include the following steps: First, displaying an interface diagram creation interface, the interface diagram creation interface including a component display area and a component editing area, the display items in the component display area including multiple preset components; then, when a drag operation is detected for a candidate component, and the first destination position of the drag operation is located in the component editing area, displaying a mirror component corresponding to the candidate component at a second destination position in the component editing area, the candidate component being any one of the multiple preset components, the second destination position being determined based on the first destination position and the current component layout in the component editing area; furthermore, using each current component in the component editing area as a business component, generating an interface diagram adapted to the current local blueprint;

[0073] Accordingly, predicting the target logic code corresponding to the current local blueprint using the target large language model includes: predicting the target logic code using the target large language model.

[0074] Taking a target platform consisting of a server and multiple terminals as an example, the terminal can display the interface creation interface and respond to drag operations on candidate components by the target object; alternatively, the server-side interactive interface can display the interface creation interface and respond to drag operations on candidate components by the target object. Taking a server-side target platform as an example, the server-side interactive interface can display the interface creation interface and respond to drag operations on candidate components by the target object. In the displayed interface creation interface, one area displays multiple preset components; another area serves as the component editing area. The user can drag a preset component from the first area to the second area. After dragging, the corresponding mirror component of the preset component will be displayed in the second area, where the preset component and its corresponding mirror component refer to the same UI component. The display position of the mirror component corresponding to the preset component in the second area is the second destination position. The second destination position is determined based on the first destination position and the current component layout within the component editing area. The first destination position indicates the endpoint of the drag operation. If displaying the mirrored component corresponding to the preset component at the first destination position does not affect the current component layout within the component editing area, then the first destination position is used as the second destination position; otherwise, the first destination position is moved up, down, left, or right, and the result of the movement is used as the second destination position. This improves the adaptability of introducing new components to the current component layout.

[0075] Combining the methods for selecting components for the interface diagram provided above, the styles and positions of components introduced into the component editing area can be set. After editing is complete, each current component within the component editing area can be treated as a business component to generate an interface diagram adapted to the current local blueprint. This allows for user interaction through a visual interface display, achieving both componentization of the current local blueprint and integration of UI-side information, while also improving the flexibility of interface diagram generation.

[0076] Based on this, a target large language model can be used to predict target logic code. Compared to using the current local blueprint and the interface diagram as input, the target large language model does not need to focus on establishing the association between at least one visual object and multiple business components, thus improving prediction efficiency and accuracy. It can identify the style (such as size, color, etc.) and position of each business component in the interface diagram to predict the target function implementation logic of the business scenario in which the interface diagram is located. The target function implementation logic can indicate the logical links between the local functions that at least one business component is responsible for. For example, local function 1 that business component 1 is responsible for is a precondition for local function 2 that business component 2 is responsible for. Of course, the logical link can consist of a main link and at least one branch link. Then, based on the target function implementation logic, target logic code surrounding multiple business components is generated. The target logic code is used to characterize the triggering conditions that multiple business components need to meet to be triggered. It should be understood that local functions are at the business component level, and preconditions are also at the business component level. The triggering conditions determined based on the preconditions can point to the same business component or to other business components to establish the business logic between two business components. Triggering conditions determined based on preconditions can also point to external information.

[0077] S203: For each of the current local blueprints, based on the target logic code and the page description information of each of the multiple business components, generate the page code corresponding to the current local blueprint, wherein the page description information is determined based on the visual object corresponding to the business component;

[0078] In this embodiment, for each current partial blueprint, the target platform generates page code corresponding to the current partial blueprint based on the target logic code and the page description information of each of the multiple business components. The target logic code obtained in the aforementioned step S202 focuses on reflecting the global business logic after the current partial blueprint is componentized. Based on this, the page description information of each of the multiple business components is incorporated here to generate the page code corresponding to the current partial blueprint. In practical applications, the page code corresponding to the current partial blueprint is executable code.

[0079] For the page description information of multiple business components, the style (such as size, color, etc.) and position of the visual object described in step S202 above, as well as the association between a visual object and at least one business component, can be referenced. Using the visual object as an anchor point, at least one business component with an association with the visual object can be identified first. Then, the style of the visual object is decomposed and transferred to at least one business component, and the position of the visual object is decomposed and transferred to at least one business component to obtain the page description information of at least one business component, thereby obtaining the page description information of multiple business components. The decomposed style and position can be used as attribute values ​​for relevant attribute items of the business components to achieve transfer.

[0080] As one possible implementation, such as Figure 4 The target logic code includes at least one event code group, which indicates the triggering condition corresponding to the business component. The page description information includes interface code indicating the style and position of the business component. Generating the page code corresponding to the current partial blueprint based on the target logic code and the page description information of each of the multiple business components includes:

[0081] S401: For each of the aforementioned business components, a dynamic engine is used to establish a binding relationship between the interface code and the event code group based on the business component identifier, thereby obtaining a binding relationship group corresponding to the multiple business components;

[0082] S402: The dynamic engine is used to fuse the page description information of each of the multiple business components and the target logic code based on the binding relationship group to obtain the page code corresponding to the current local blueprint.

[0083] Since the target logic code represents the triggering conditions that multiple business components must meet to be triggered (i.e., business logic-side information), and the page description information of each business component represents UI-side information, the two need to be merged. This provides a method of establishing binding relationships and then merging the business component dimensions according to these relationships, which improves the accuracy of the page code corresponding to the current local blueprint. For example... Figure 13 As shown, the fusion of page description information and target logic code for multiple business components can utilize a dynamic engine, especially its runtime execution layer. Leveraging the characteristics of a dynamic engine improves the efficiency and accuracy of obtaining the page code corresponding to the current local blueprint. Figure 13The terms "UI Reconstruction Draft" and "Reconstruction Draft" refer to the interface diagrams corresponding to the aforementioned page blueprints, while "Logic Code" refers to the aforementioned target logic code. The interface diagrams provide the interface code indicating the style and location of business components. Simultaneously, the business components in the interface diagrams are also bound to functional logic, thus constituting the data binding (interface code) and event binding (functional events indicating functional logic) involved in the reconstruction draft. The dynamic engine can perform AST parsing on the data binding and event binding involved in the reconstruction draft to obtain UI-side information at the business component level. Since the logic code indicates the aforementioned target logic code, and the target logic code includes at least one event code group, which indicates the triggering conditions corresponding to the business component, it can correspond to business logic-side information at the business component level. The fusion performed by the dynamic engine is the fusion of corresponding UI-side information and business logic-side information at the business component level. During the fusion process, a protocol at the business component level can be generated. The protocol template can be found in Table 1 below:

[0084]

[0085]

[0086] Table 1

[0087] The protocol can improve the constraints on the obtained page code at the business component level, making the integration of UI-side information and business logic-side information more accurate and reliable.

[0088] S204: Based on the page code corresponding to each of the at least one current local blueprint, obtain the page code corresponding to the page blueprint.

[0089] In this embodiment, the target platform obtains the page code corresponding to the page blueprint based on the page code corresponding to at least one current partial blueprint. The page code corresponding to each current partial blueprint can be considered as partial page code. Since a page blueprint includes at least one current partial blueprint, at least one partial page code is integrated to obtain a global page code, which is the page code corresponding to the page blueprint. A dynamic engine can also be used when displaying the target page using the page code; for specific implementation details, please refer to [reference needed]. Figure 14 .for Figure 14In essence, a component's global Context (or simply Context) provides a mechanism for sharing data across the component tree. Whether it's a trigger condition for a specific operation or the functional logic bound to a business component, it can be considered a logical component. After a specific operation or functional logic is executed, the relevant data is written to the Context. Business components subscribe to specific node data (such as node1:key) within the Context. When the data in a specific node changes, the business component receives a notification. These notifications support UI updates.

[0090] In practical applications, the target platform can be a platform that integrates visual building and logical arrangement functions, making it easier for staff to maintain. The visual building function can be implemented through a provided graphical interface, supporting the generation of interface diagrams. The logical arrangement function can also be implemented through a provided graphical interface, supporting the acquisition of target logical information and its visual arrangement. For the processing of uploaded design drafts, please refer to [reference needed]. Figure 10 The page code generation provided in this application focuses on... Figure 10 The design draft involves the "UI production" and "logic production" stages. The design draft refers to the aforementioned page blueprint or the corresponding interface diagram. The analysis of the design draft may involve layer grouping, element parsing, COS uploading, protocol assembly, etc. The design draft file format can be PSD. Figure 5 As shown, Figure 5 The screenshot shows the interface guiding users to upload their design drafts. Users need to make relevant selections and inputs while uploading their design drafts. For example... Figure 6 As shown, this interface diagram recommends modules to the user. Module identification here can be referenced from the previous example of matching the current local blueprint with multiple historical local blueprints as candidates. After identification, Module 1 and Module 2 are also shown for the user to choose from. The user can choose to use Module 1 or Module 2, which will then replace the current local blueprint. For Figure 5 , 6 The module in the document indicates a historical partial blueprint with page code (or logic code). If the user has not selected to use the page code (or logic code) corresponding to the relevant historical partial blueprint, they can also... Figure 7-8 This is shown to provide target logical information for the current local blueprint. For Figure 7 The reconstructed draft in the blueprint indicates the interface diagram corresponding to the current local blueprint. Figure 8 The event configuration section is shown, allowing users to bind trigger conditions and functional logic to relevant components through a graphical interface.

[0091] As can be seen from the technical solutions provided in the above embodiments of this application, this application provides a more efficient and convenient page code generation scheme. Starting from the current local blueprint, this application utilizes a target large language model to predict target logic code based on the visual information provided by the current local blueprint. Leveraging the image processing capabilities of the target large language model, it can improve the efficiency of obtaining target logic code while simultaneously componentizing the current local blueprint and integrating business logic. Based on this, UI-side information (corresponding to the page description information of multiple business components) and business logic-side information (corresponding to target logic code) for business components are fused to generate the page code corresponding to the current local blueprint, thereby obtaining the page code corresponding to the page blueprint. This improves the convenience and efficiency of obtaining page-level code.

[0092] This application also provides a page code generation device, such as... Figure 15 As shown, the page code generation device 15 is configured on the target platform, and the page code generation device 150 includes:

[0093] Local blueprint determination module 1501: used to determine at least one current local blueprint from a page blueprint indicating a target page, the current local blueprint including at least one visual object;

[0094] Logic code prediction module 1502: For each of the current local blueprints, it uses a target large language model to predict the target logic code corresponding to the current local blueprint. The target logic code is used to characterize the triggering conditions that multiple business components need to be triggered. The multiple business components are determined based on the business scenarios supported by the at least one visual object.

[0095] Local page code generation module 1503: for each of the current local blueprints, based on the target logic code and the page description information of each of the multiple business components, to generate page code corresponding to the current local blueprint, wherein the page description information is determined based on the visual object corresponding to the business component;

[0096] Global Page Code Acquisition Module 1504: Used to obtain the page code corresponding to the page blueprint based on the page code corresponding to each of the at least one current local blueprint.

[0097] In one embodiment, the target logic code includes at least one event code group, the event code group indicating the triggering condition corresponding to the business component, and the page description information includes interface code indicating the style and position of the business component. Generating the page code corresponding to the current partial blueprint based on the target logic code and the page description information of each of the multiple business components includes: for each business component, using a dynamic engine to establish a binding relationship between the interface code and the event code group based on the business component identifier, obtaining a binding relationship group corresponding to the multiple business components; and using the dynamic engine to fuse the page description information of each of the multiple business components and the target logic code based on the binding relationship group to obtain the page code corresponding to the current partial blueprint.

[0098] In one embodiment, the apparatus further includes a local page code acquisition module;

[0099] The local page code acquisition module is used to determine a target historical local blueprint that matches the current local blueprint from multiple historical local blueprints; and to adjust the page code corresponding to the target historical local blueprint to adapt to the current local blueprint, so as to obtain the page code corresponding to the current local blueprint.

[0100] In one embodiment, determining the target historical local blueprint that matches the current local blueprint from a plurality of historical local blueprints includes: displaying a local blueprint processing interface, the local blueprint processing interface including a first area and a second area, the first area displaying the current local blueprint, the second area displaying at least one candidate historical local blueprint, the candidate historical local blueprint being a local blueprint among the plurality of historical local blueprints whose similarity to the current local blueprint is greater than a preset similarity; and determining, in response to a selection operation on the second area, that the selected candidate historical local blueprint is the target historical local blueprint.

[0101] In one embodiment, the apparatus further includes an interface diagram generation module;

[0102] The interface diagram generation module is used to display an interface diagram creation interface, which includes a component display area and a component editing area. The component display area displays multiple preset components. When a drag operation is detected on a candidate component, and the first destination of the drag operation is located in the component editing area, a mirrored component corresponding to the candidate component is displayed at a second destination position in the component editing area. The candidate component is any one of the multiple preset components. The second destination position is determined based on the first destination position and the current component layout in the component editing area. Each current component in the component editing area is taken as a business component, and an interface diagram adapted to the current local blueprint is generated.

[0103] The step of using the target large language model to predict the target logic code corresponding to the current local blueprint includes: using the target large language model to predict the target logic code.

[0104] In one embodiment, the apparatus further includes a first logic code acquisition module;

[0105] The first logic code acquisition module is used to acquire target logic information sent by the target object; generate candidate code representing the target logic information; and convert the candidate code based on preset rules to obtain the target logic code, wherein the target logic code adopts a domain-specific programming language.

[0106] In one embodiment, the apparatus further includes a second logic code acquisition module;

[0107] The second logic code acquisition module is used to acquire target logic information sent by the target object; determine second logic information that matches the target logic information from multiple first logic information, wherein the multiple first logic information corresponds to multiple historical partial blueprints; and determine the logic code corresponding to the second logic information as the target logic code.

[0108] It should be noted that the apparatus and method embodiments described in the device embodiments are based on the same inventive concept.

[0109] In some embodiments, the functions or modules of the apparatus provided in this application can be used to perform the methods described in the above method embodiments. The specific implementation can be referred to the description of the above method embodiments, and for the sake of brevity, it will not be repeated here.

[0110] This application also provides a computer-readable storage medium storing at least one instruction or at least one program segment, which is loaded and executed by a processor to implement the above-described method. The computer-readable storage medium may be a non-volatile computer-readable storage medium.

[0111] This application also provides an electronic device, which includes at least one processor and a memory communicatively connected to the at least one processor; wherein the memory stores at least one instruction or at least one program, and the at least one instruction or at least one program is loaded and executed by the at least one processor to implement the above method.

[0112] Electronic devices can be provided as terminals, servers, or other forms of devices.

[0113] Figure 16 A block diagram of an electronic device according to an embodiment of this application is shown. (Refer to...) Figure 16 The electronic device 1900 includes a processing component 1922, which further includes one or more processors, and memory resources represented by memory 1932 for storing instructions executable by the processing component 1922. Furthermore, the processing component 1922 is configured to execute instructions to perform the methods described above.

[0114] Electronic device 1900 may also include a power supply component 1926 configured to perform power management of electronic device 1900, a wired or wireless network interface 1950 configured to connect electronic device 1900 to a network, and an input / output (I / O) interface 1958. Electronic device 1900 can operate on an operating system stored in memory 1932, such as Windows Server™, Mac OS X™, Unix™, Linux™, FreeBSD™, or similar.

[0115] In an exemplary embodiment, a non-volatile computer-readable storage medium is also provided, such as a memory 1932 including computer program instructions that can be executed by a processing component 1922 of an electronic device 1900 to perform the above-described method.

[0116] This application may be a system, method, and / or computer program product. A computer program product may include a computer-readable storage medium having on it at least one instruction or at least a program segment for causing a processor to implement various aspects of this application.

[0117] Computer-readable storage media can be tangible devices capable of holding and storing instructions for use by an instruction execution device. Computer-readable storage media can be, for example—but not limited to—electrical storage devices, magnetic storage devices, optical storage devices, electromagnetic storage devices, semiconductor storage devices, or any suitable combination thereof. More specific examples (a non-exhaustive list) of computer-readable storage media include: portable computer disks, hard disks, random access memory (RAM), read-only memory (ROM), erasable programmable read-only memory (EPROM or flash memory), static random access memory (SRAM), portable compact disc read-only memory (CD-ROM), digital multifunction disc (DVD), memory sticks, floppy disks, mechanical encoding devices, such as punch cards or recessed protrusions storing instructions thereon, and any suitable combination thereof. The computer-readable storage media used herein are not to be construed as transient signals themselves, such as radio waves or other freely propagating electromagnetic waves, electromagnetic waves propagating through waveguides or other transmission media (e.g., light pulses through fiber optic cables), or electrical signals transmitted through wires.

[0118] At least one instruction or program segment described herein may be downloaded from a computer-readable storage medium to various computing / processing devices, or downloaded via a network, such as the Internet, a local area network, a wide area network, and / or a wireless network, to an external computer or external storage device. The network may include copper transmission cables, fiber optic transmission, wireless transmission, routers, firewalls, switches, gateway computers, and / or edge servers. A network adapter card or network interface in each computing / processing device receives at least one instruction or at least one program segment from the network and forwards the instruction or program segment to a computer-readable storage medium in the respective computing / processing device.

[0119] At least one instruction or at least one program segment used to perform the operations of this application may be assembly instructions, instruction set architecture (ISA) instructions, machine instructions, machine-dependent instructions, microcode, firmware instructions, status setting data, or source code or object code written in any combination of one or more programming languages, including object-oriented programming languages ​​such as Smalltalk, C+, etc., and conventional procedural programming languages ​​such as the "C" language or similar programming languages. At least one instruction or at least one program segment may be executed entirely on the user's computer, partially on the user's computer, as a standalone software package, partially on the user's computer and partially on a remote computer, or entirely on a remote computer or server. In cases involving a remote computer, the remote computer may be connected to the user's computer via any type of network—including a local area network (LAN) or a wide area network (WAN)—or may be connected to an external computer (e.g., via the Internet using an Internet service provider). In some embodiments, electronic circuits, such as programmable logic circuits, field-programmable gate arrays (FPGAs), or programmable logic arrays (PLAs), are personalized by utilizing state information of at least one instruction or at least one program to implement various aspects of this application.

[0120] Various aspects of this application are described herein with reference to flowchart illustrations and / or block diagrams of methods, apparatus (systems), and computer program products according to embodiments of this application. It should be understood that each block of the flowchart illustrations and / or block diagrams, and combinations of blocks in the flowchart illustrations and / or block diagrams, can be implemented by at least one instruction or at least a piece of program.

[0121] The at least one instruction or at least one program segment can be provided to a processor of a general-purpose computer, a special-purpose computer, or other programmable data processing apparatus to produce a machine such that, when executed by the processor of the computer or other programmable data processing apparatus, it creates means for implementing the functions / actions specified in one or more blocks of the flowchart and / or block diagram. The at least one instruction or at least one program segment can also be stored in a computer-readable storage medium that causes a computer, programmable data processing apparatus, and / or other device to operate in a particular manner; thus, the computer-readable medium storing the instructions comprises an article of manufacture that includes instructions for implementing aspects of the functions / actions specified in one or more blocks of the flowchart and / or block diagram.

[0122] At least one instruction or at least one program may be loaded onto a computer, other programmable data processing apparatus, or other device to cause a series of operational steps to be performed on the computer, other programmable data processing apparatus, or other device to produce a computer-implemented process, thereby causing the instructions executed on the computer, other programmable data processing apparatus, or other device to perform the functions / actions specified in one or more boxes of a flowchart and / or block diagram.

[0123] The flowcharts and block diagrams in the accompanying drawings illustrate the architecture, functionality, and operation of possible implementations of systems, methods, and computer program products according to various embodiments of this application. In this regard, each block in a flowchart or block diagram may represent a module, segment, or portion of an instruction, which includes one or more executable instructions for implementing a specified logical function. In some alternative implementations, the functions specified in the blocks may occur in a different order than those specified in the drawings. For example, two consecutive blocks may actually be executed substantially in parallel, and they may sometimes be executed in reverse order, depending on the functions involved. It should also be noted that each block in the block diagrams and / or flowcharts, and combinations of blocks in the block diagrams and / or flowcharts, can be implemented using a dedicated hardware-based system that performs the specified function or action, or using a combination of dedicated hardware and computer instructions.

[0124] The various embodiments of this application have been described above. These descriptions are exemplary and not exhaustive, nor are they limited to the disclosed embodiments. Many modifications and variations will be apparent to those skilled in the art without departing from the scope and spirit of the described embodiments. The terminology used herein is chosen to best explain the principles, practical applications, or technological improvements to the embodiments in the market, or to enable others skilled in the art to understand the embodiments disclosed herein.

Claims

1. A method for generating page code, characterized in that, Applied to a target platform, the method includes: At least one current partial blueprint is determined from the page blueprint indicating the target page, the current partial blueprint including at least one visual object; For each of the current local blueprints, the target logic code corresponding to the current local blueprint is predicted using the target large language model. The target logic code is used to characterize the triggering conditions that need to be met for multiple business components to be triggered. The multiple business components are determined based on the business scenarios supported by the at least one visual object. For each of the current partial blueprints, based on the target logic code and the page description information of each of the multiple business components, page code corresponding to the current partial blueprint is generated, and the page description information is determined based on the visual object corresponding to the business component; Based on the page code corresponding to each of the at least one current local blueprint, the page code corresponding to the page blueprint is obtained.

2. The method according to claim 1, characterized in that, The target logic code includes at least one event code group, which indicates the triggering condition corresponding to the business component. The page description information includes interface code indicating the style and position of the business component. Generating the page code corresponding to the current partial blueprint based on the target logic code and the page description information of each of the multiple business components includes: For each of the aforementioned business components, a binding relationship between the interface code and the event code group is established based on the business component identifier using a dynamic engine, thereby obtaining the binding relationship group corresponding to the multiple business components; The dynamic engine is used to fuse the page description information of each of the multiple business components and the target logic code based on the binding relationship group to obtain the page code corresponding to the current local blueprint.

3. The method according to claim 1, characterized in that, After determining at least one current partial blueprint from the page blueprint indicating the target page, the method further includes: Identify a target historical local blueprint that matches the current local blueprint from multiple historical local blueprints; The page code corresponding to the target historical partial blueprint is adjusted to adapt to the current partial blueprint to obtain the page code corresponding to the current partial blueprint.

4. The method according to claim 3, characterized in that, The step of determining a target historical local blueprint that matches the current local blueprint from multiple historical local blueprints includes: The local blueprint processing interface is displayed. The local blueprint processing interface includes a first area and a second area. The first area displays the current local blueprint, and the second area displays at least one candidate historical local blueprint. The candidate historical local blueprint is a local blueprint among the multiple historical local blueprints whose similarity to the current local blueprint is greater than a preset similarity. In response to the selection operation for the second region, it is determined that the selected candidate historical local blueprint is the target historical local blueprint.

5. The method according to claim 1, characterized in that, The method further includes: The interface diagram creation interface includes a component display area and a component editing area. The component display area displays multiple preset components. When a drag operation is detected for a candidate component, and the first destination of the drag operation is located in the component editing area, a mirror component corresponding to the candidate component is displayed at the second destination position in the component editing area. The candidate component is any one of the plurality of preset components, and the second destination position is determined based on the first destination position and the current component layout in the component editing area. Each current component within the component editing area is considered a business component, and an interface diagram adapted to the current local blueprint is generated. The step of using the target large language model to predict the target logic code corresponding to the current local blueprint includes: using the target large language model to predict the target logic code.

6. The method according to claim 1 or 2, characterized in that, After determining at least one current partial blueprint from the page blueprint indicating the target page, the method further includes: Obtain the target logic information sent by the target object; Generate candidate codes that represent the target logical information; The candidate code is transformed based on preset rules to obtain the target logic code, which is written in a domain-specific programming language.

7. The method according to claim 6, characterized in that, After obtaining the target logic information sent by the target object, the method further includes: A second logical information matching the target logical information is determined from a plurality of first logical information, wherein the plurality of first logical information corresponds to a plurality of historical partial blueprints; The logic code corresponding to the second logic information is determined to be the target logic code.

8. A page code generation device, characterized in that, Configured on the target platform, the device includes: Local blueprint determination module: used to determine at least one current local blueprint from the page blueprint indicating the target page, the current local blueprint including at least one visual object; Logic code prediction module: For each of the current local blueprints, the target logic code corresponding to the current local blueprint is predicted using the target large language model. The target logic code is used to characterize the triggering conditions that multiple business components need to be triggered. The multiple business components are determined based on the business scenarios supported by the at least one visual object. Local page code generation module: for each of the current local blueprints, based on the target logic code and the page description information of each of the multiple business components, the page description information is determined based on the visual object corresponding to the business component; Global Page Code Acquisition Module: Used to obtain the page code corresponding to the page blueprint based on the page code corresponding to each of the at least one current local blueprint.

9. An electronic device, characterized in that, The electronic device includes at least one processor and a memory communicatively connected to the at least one processor; wherein the memory stores at least one instruction or at least one program, the at least one instruction or at least one program being loaded and executed by the at least one processor to implement the page code generation method as described in any one of claims 1-7.

10. A computer-readable storage medium, characterized in that, The computer-readable storage medium stores at least one instruction or at least one program, which is loaded and executed by a processor to implement the page code generation method as described in any one of claims 1-7.

11. A computer program product, characterized in that, The computer program product includes at least one instruction or at least one program segment, which is loaded and executed by a processor to implement the page code generation method as described in any one of claims 1-7.

Images