CN114327465A

CN114327465A - Page component generation method and device, electronic equipment and storage medium

Info

Publication number: CN114327465A
Application number: CN202210001789.7A
Authority: CN
Inventors: 李秋林; 任星旺
Original assignee: Jingdong Technology Holding Co Ltd
Current assignee: Jingdong Technology Holding Co Ltd
Priority date: 2022-01-04
Filing date: 2022-01-04
Publication date: 2022-04-12

Abstract

The disclosure relates to a page component generation method and device, electronic equipment and a computer readable storage medium, relates to the technical field of front-end development, and can be applied to the scene of developing a set of mutually exclusive page components with multiple groups of control contents. The method comprises the following steps: acquiring an initial page component, and determining a current operation control group and a relevant control group based on the initial page component; the control contents between the associated control group and the current operation control group are mutually exclusive; determining the associated control information of the associated control group; performing component editing operation on the current operation control group based on the associated control information to determine updated control information; and carrying out component updating processing on the initial page component according to the updating control information to obtain a target page component. The method comprises the steps of carrying out component editing operation on a current operation control group according to associated control information, and supporting dynamic addition and deletion of components; because the controls of the associated control group and the current operation control group are mutually exclusive, the problem of mutually exclusive selection among different control groups can be solved.

Description

Page component generation method and device, electronic equipment and storage medium

Technical Field

The present disclosure relates to the field of front-end development technologies, and in particular, to a page component generation method, a page component generation apparatus, an electronic device, and a computer-readable storage medium.

Background

Front-end development is a process of creating front-end interfaces such as World Wide Web (WWW) pages or Application programs (APP) and the like to be presented to users, and user interface interaction of internet products is realized through various front-end technologies, frames and solutions.

For example, a drop-down selection is a commonly used control in a web (web) front-end page. A select element exists in HyperText Markup Language (HTML), and can create a single-choice or multi-choice menu. In addition, the Treeselect control is a select-like control, and may be used when the selectable data structure is a tree structure, such as a company hierarchy, a subject system, a category directory, a provincial region selection, and the like.

Currently, in some service scenarios, there is a service requirement that a plurality of page elements need to be configured with corresponding elements, and the same page element in the page cannot correspond to a plurality of configurations, for example, when a treselect control is used to select a page element, a content selection mutual exclusion cannot be realized. The content selection mutual exclusion refers to the situation that the same page element can be selected only at one place and can not be selected for multiple times at the same time. For example, in a logistics freight configuration scenario, freight configuration needs to be performed for different provincial regions, and if a beijing yang-oriented region is selected in a first freight region, the beijing yang-oriented region cannot be selected again in a second freight region. When the Treeselect control is used for selecting page elements, the effect of mutual exclusion of content selection cannot be achieved, namely, a Beijing market sunny region is selected in a first freight interval, and a Beijing market sunny region can be selected again in a second freight interval, so that freight configuration errors can be caused.

It is to be noted that the information disclosed in the above background section is only for enhancement of understanding of the background of the present disclosure, and thus may include information that does not constitute prior art known to those of ordinary skill in the art.

Disclosure of Invention

The present disclosure aims to provide a page component generation method, a page component generation apparatus, an electronic device, and a computer-readable storage medium, so as to overcome, at least to some extent, a problem that content mutual exclusion selection cannot be performed among multiple selection frames of a front-end page.

Additional features and advantages of the disclosure will be set forth in the detailed description which follows, or in part will be obvious from the description, or may be learned by practice of the invention.

According to a first aspect of the present disclosure, there is provided a page component generation method, including: acquiring an initial page component, and determining a current operation control group and a corresponding associated control group based on the initial page component; the control contents between the associated control group and the current operation control group are mutually exclusive; determining the associated control information of the associated control group; performing component editing operation on the current operation control group based on the associated control information to determine updated control information; and carrying out component updating processing on the initial page component according to the updating control information to obtain a target page component.

In an exemplary embodiment of the present disclosure, determining a current set of operating controls and a corresponding set of associated controls based on an initial page component includes: determining a page component template corresponding to the initial page component; in response to a component adding operation aiming at the page component template, determining a current operation control group; and acquiring an associated control identification corresponding to the current operation control group, and determining the associated control group according to the associated control identification.

In an exemplary embodiment of the present disclosure, performing a component editing operation on a current operation control group based on associated control information to determine updated control information includes: determining the component display state of the initial page component according to the associated control information; performing component editing operation on the current operation control group according to the component display state to determine a component updating element; selecting operation mutual exclusion between the current operation control group and the associated control group; and generating updating control information according to the component updating element.

In an exemplary embodiment of the present disclosure, determining a component display state of an initial page component according to associated control information includes: determining candidate component elements and selected component elements according to the associated control information; the selected component elements comprise selected primary elements, selected secondary elements and selected half-selected elements; determining the display states of the selected primary element, the selected secondary element and the selected half-selected element as the selected display states; the display state of the candidate component element is determined as the candidate display state.

In an exemplary embodiment of the present disclosure, the component update element includes a target selection element and a target removal element; performing component editing operation on the current operation control group according to the component display state to determine a component updating element, wherein the method comprises the following steps: in response to a selection operation for the candidate component element, taking the candidate component element subjected to the selection operation as a target selection element; the candidate component element is in an unselected state in the associated control group; and in response to the removal operation for the selected component element, taking the selected component element subjected to the removal operation as a target removal element.

In an exemplary embodiment of the present disclosure, generating update control information from a component update element includes: determining an updating element identifier, an updating element grade and an updating element content corresponding to the updating element of the component so as to generate updating element information; and generating updated control information according to the updated element information and the associated control information.

In an exemplary embodiment of the present disclosure, performing component update processing on an initial page component according to update control information to obtain a target page component includes: determining component storage information corresponding to a target page; the component storage information comprises initial component information of the initial page component; updating the initial component information based on the updating control information to obtain updated component information; and displaying the target page component on the target page according to the updated component information.

According to a second aspect of the present disclosure, there is provided a page component generating apparatus, including: the initial component acquisition module is used for acquiring an initial page component and determining a current operation control group and a corresponding associated control group based on the initial page component; the control contents between the associated control group and the current operation control group are mutually exclusive; the control information acquisition module is used for determining the associated control information of the associated control group; the control information updating module is used for carrying out component editing operation on the current operation control group based on the associated control information so as to determine the updated control information; and the target component generation module is used for carrying out component updating processing on the initial page component according to the updating control information so as to obtain a target page component.

In an exemplary embodiment of the present disclosure, the initial component obtaining module includes an initial component obtaining unit, configured to determine a page component template corresponding to an initial page component; in response to a component adding operation aiming at the page component template, determining a current operation control group; and acquiring an associated control identification corresponding to the current operation control group, and determining the associated control group according to the associated control identification.

In an exemplary embodiment of the present disclosure, the control information updating module includes a control information updating unit, configured to determine a component display state of an initial page component according to the associated control information; performing component editing operation on the current operation control group according to the component display state to determine a component updating element; selecting operation mutual exclusion between the current operation control group and the associated control group; and generating updating control information according to the component updating element.

In an exemplary embodiment of the present disclosure, the control information updating unit includes a display state determining subunit configured to determine candidate component elements and selected component elements according to the associated control information; the selected component elements comprise selected primary elements, selected secondary elements and selected half-selected elements; determining the display states of the selected primary element, the selected secondary element and the selected half-selected element as the selected display states; the display state of the candidate component element is determined as the candidate display state.

In an exemplary embodiment of the present disclosure, the component update element includes a target selection element and a target removal element; the control information updating unit comprises an updating element determining subunit, which is used for responding to the selection operation of the candidate component elements and taking the candidate component elements subjected to the selection operation as target selection elements; the candidate component element is in an unselected state in the associated control group; and in response to the removal operation for the selected component element, taking the selected component element subjected to the removal operation as a target removal element.

In an exemplary embodiment of the present disclosure, the control information updating unit includes a control information updating subunit, configured to determine an update element identifier, an update element level, and an update element content corresponding to the component update element, so as to generate update element information; and generating updated control information according to the updated element information and the associated control information.

In an exemplary embodiment of the present disclosure, the target component generation module includes a target component generation unit, configured to determine component storage information corresponding to a target page; the component storage information comprises initial component information of the initial page component; updating the initial component information based on the updating control information to obtain updated component information; and displaying the target page component on the target page according to the updated component information.

According to a third aspect of the present disclosure, there is provided an electronic device comprising: a processor; and a memory having computer readable instructions stored thereon, the computer readable instructions, when executed by the processor, implementing the page component generation method according to any of the above.

According to a fourth aspect of the present disclosure, there is provided a computer readable storage medium having stored thereon a computer program which, when executed by a processor, implements the page component generation method according to any one of the above.

The technical scheme provided by the disclosure can comprise the following beneficial effects:

the page component generation method in the exemplary embodiment of the disclosure obtains an initial page component, and determines a current operation control group and a corresponding associated control group based on the initial page component; the control contents between the associated control group and the current operation control group are mutually exclusive; determining the associated control information of the associated control group; performing component editing operation on the current operation control group based on the associated control information to determine updated control information; and carrying out component updating processing on the initial page component according to the updating control information to obtain a target page component. On one hand, dynamic addition and deletion of the components can be supported by carrying out component editing operation on the initial page components. On the other hand, due to the mutual exclusion of the control contents between the associated control group and the currently operated control group, the effect of mutual exclusion selection among a plurality of control groups can be realized when the assembly editing operation is carried out.

It is to be understood that both the foregoing general description and the following detailed description are exemplary and explanatory only and are not restrictive of the disclosure.

Drawings

The accompanying drawings, which are incorporated in and constitute a part of this specification, illustrate embodiments consistent with the present disclosure and together with the description, serve to explain the principles of the disclosure. It is to be understood that the drawings in the following description are merely exemplary of the disclosure, and that other drawings may be derived from those drawings by one of ordinary skill in the art without the exercise of inventive faculty. In the drawings:

FIG. 1 schematically illustrates a flow diagram of a page component generation method according to an exemplary embodiment of the present disclosure;

FIG. 2 schematically illustrates an interface diagram of a freight generation component in a custom freight scenario, according to an exemplary embodiment of the present disclosure;

FIG. 3 schematically illustrates an interface diagram of a control group for adding regional shipping fees, according to an exemplary embodiment of the present disclosure;

FIG. 4 schematically illustrates a flow diagram of a user operation portion of a page component generation process according to an exemplary embodiment of the present disclosure;

FIG. 5 schematically illustrates a flow diagram of a component display portion of a page component generation process according to an exemplary embodiment of the present disclosure;

FIG. 6 schematically illustrates a block diagram of a page component generation apparatus according to an exemplary embodiment of the present disclosure;

FIG. 7 schematically illustrates a block diagram of an electronic device according to an exemplary embodiment of the present disclosure;

fig. 8 schematically illustrates a schematic diagram of a computer-readable storage medium according to an exemplary embodiment of the present disclosure.

Detailed Description

Example embodiments will now be described more fully with reference to the accompanying drawings. Example embodiments may, however, be embodied in many different forms and should not be construed as limited to the embodiments set forth herein; rather, these embodiments are provided so that this disclosure will be thorough and complete, and will fully convey the concept of example embodiments to those skilled in the art. The same reference numerals denote the same or similar parts in the drawings, and thus, a repetitive description thereof will be omitted.

Furthermore, the described features, structures, or characteristics may be combined in any suitable manner in one or more embodiments. In the following description, numerous specific details are provided to give a thorough understanding of embodiments of the disclosure. One skilled in the relevant art will recognize, however, that the subject matter of the present disclosure can be practiced without one or more of the specific details, or with other methods, components, devices, steps, and so forth. In other instances, well-known structures, methods, devices, implementations, materials, or operations are not shown or described in detail to avoid obscuring aspects of the disclosure.

The block diagrams shown in the figures are functional entities only and do not necessarily correspond to physically separate entities. That is, these functional entities may be implemented in the form of software, or in one or more software-hardened modules, or in different networks and/or processor devices and/or microcontroller devices.

In the front-end development process, selection controls, whether select elements or Treeselect elements, are mature, but a scene exists, a group of select/Treeselect selection boxes needs to be arranged, the number of the selection boxes is 2-N, dynamic increase and decrease are achieved, mutual exclusion is achieved among the selection boxes, the content selected by one selection box cannot be selected by other selection boxes, the content selected by other selection boxes cannot be selected by a user at any time, the content can be selected by the selection box after the other selection boxes are deleted, and the current selection controls cannot support the scene.

For example, for the configuration of logistics freight, different provinces and cities can be divided into different freight intervals, for example, three areas of "shanghai", "jiangsu" and "zhejiang" are selected in the first freight interval, and two areas of "xinjiang" and "yunan" are selected in the second freight interval. If the developer performs the configuration of the third freight interval, according to the element selection scheme in the prior art, the selected regions in the first two freight intervals, such as "shanghai", "xinjiang", etc., can be selected in the third freight interval. In the actual business requirement, if the area selected in the previous freight interval needs to be prohibited from being selected again in the subsequent freight configuration process, therefore, when the select/treselect selection box is used for element selection, the freight configuration process may be caused to have problems.

Based on this, in the present exemplary embodiment, first, a page component generating method is provided, which may be implemented by a server, or a terminal device, where the terminal described in the present disclosure may include a mobile terminal such as a mobile phone, a tablet computer, a notebook computer, a palm top computer, a Personal Digital Assistant (PDA), and a fixed terminal such as a desktop computer. FIG. 1 schematically illustrates a schematic diagram of a page component generation method flow, according to some embodiments of the present disclosure. Referring to fig. 1, the page component generating method may include the steps of:

step S110, obtaining an initial page component, and determining a current operation control group and a corresponding associated control group based on the initial page component; and the control content between the associated control group and the current operation control group is mutually exclusive.

In some exemplary embodiments of the present disclosure, the initial page component may be a page component in an initial state. The current operation control group may be a control group corresponding to the current operation performed by the user in the initial page component. The associated control group may be another control group associated with the current operating control group, for example, the associated control group may be a control group having a side-by-side relationship with the current operating control group, and the associated control group may be empty. The control content may be specific content contained in the control group.

Before performing component editing operation to generate a page component, an initial page component may be obtained, where the initial page component may include multiple control groups, a control group that performs user operation in the initial page component is used as a current operation control group, and other control groups that have a parallel association relationship with the current operation control group are used as associated control groups. The control content between the associated control group and the current operation control group in the initial page component is mutually exclusive, namely, the selected component element of any one of the associated control group and the current operation control group cannot be selected again by other control groups.

Referring to FIG. 2, FIG. 2 schematically illustrates an interface diagram of a freight generation component in a custom freight scenario, according to an exemplary embodiment of the present disclosure. In the freight self-defining configuration scenes of different regions, the initial page component can comprise three control groups; the control group 210 and the control group 220 may be control groups already existing in the initial page component, and in the current page component generation process, the control group 230 may be a control group acted by the user operation, that is, a currently operated control group.

And step S120, determining the associated control information of the associated control group.

In some example embodiments of the present disclosure, the associated control information may be control information contained in the associated control group, for example, the associated control information may contain information about selected component elements in the associated control group.

After determining the associated control group, the associated control information corresponding to the associated control group may be determined, referring to fig. 2, the associated control information corresponding to the control group 210 may be related information of a selected region, for example, freight information corresponding to "shanghai", "jiangsu" and "zhejiang" regions may be included; the associated control information corresponding to the control group 220 may be freight information corresponding to regions of "xinjiang" and "qujing city".

And step S130, performing component editing operation on the current operation control group based on the associated control information to determine the updated control information.

In some example embodiments of the present disclosure, the component editing operation may be an editing operation performed with respect to the current control group, for example, the component editing operation may be an operation of adding or removing a component element in the current operating control group. The updated control information may be information corresponding to the control information of the current operation control group after the component editing operation is performed on the current operation control group.

With continued reference to fig. 2, the user may perform component editing operations on the control group 230 in fig. 2, for example, since the selected contents of the control group 210 and the control group 220 include "shanghai", "jiangsu", "zhejiang", "xinjiang" and "qujing city" regions, and the related information of these regions is contained in the associated control information. Therefore, when the component editing operation is performed in the current operation control group 230, the area cannot be added again. In addition, if the user wants to change the selected content in the associated control group, the user can remove the selected content in the associated control group and perform the subsequent component editing operation. The number of control groups having an association relationship is not subject to any particular limitation in the present disclosure.

In the operation, the user adds the areas of "tibet" and "Qinghai" to the current operation control group 230, so that the information corresponding to the options of "tibet" and "Qinghai" can be used as the update control information. When the user performs the component editing operation on the control group 230, the freight information of the "tibet" and "Qinghai" regions is configured correspondingly, and the freight information of the "tibet" and "Qinghai" regions corresponding to the configuration operation is used as the updated control information.

In other embodiments, for example, if the "Xinjiang" region in control group 220 is removed and the "Tibet" and "Qinghai" region information is added to control group 230, then control group 220 and control group 230 will change to the current operating control group and control group 210 will be the associated control group. In addition, the user can delete the content of the control group 210 as a whole, and then the control group 220 and the control group 230 will become their associated control groups; if the user continues to add a new control group, the newly added control group belongs to the associated control group of control group 210, control group 220, and control group 230.

And step S140, performing component updating processing on the initial page component according to the updating control information to obtain a target page component.

In some exemplary embodiments of the present disclosure, the component update process may be an update operation on the component state of the initial page component. The target page component may be a corresponding page component obtained by performing update processing on the initial page component.

After the updated control information is obtained, component update processing may be performed on the initial page component according to the updated control information, referring to fig. 2, a third control group, that is, a control group 230, is added to the page component, where the control group 230 includes "tibetan" and "qinghai" regions, and the control group 230 includes freight configuration information of "tibetan" and "qinghai". Therefore, the generated target page component comprises three control groups.

According to the page component generation method in the present exemplary embodiment, on one hand, by performing component editing operation on the initial page component, dynamic addition and deletion of components can be supported. On the other hand, due to the mutual exclusion of the control contents between the associated control group and the currently operated control group, the effect of mutual exclusion selection among a plurality of control groups can be realized when the assembly editing operation is carried out.

Next, a page component generation method in the present exemplary embodiment will be further explained.

The page component template may be a component template used for generating the initial page component. The component adding operation can be an operation of adding a page control on the basis of the page component template. The associated control identification can be a unique identification corresponding to the control group having an associated relationship with the current operation control group.

Referring to fig. 3, fig. 3 schematically illustrates an interface diagram of a control group for adding regional freight in accordance with an exemplary embodiment of the present disclosure. For example, in a scenario of performing freight configuration on freight in different regions, a freight configuration template may be obtained first, and a page component template corresponding to freight custom configuration, that is, a freight configuration template, is provided in fig. 3. A user may perform a component adding operation based on the page component template, and referring to fig. 3, the user may perform the component adding operation by clicking a button "add freight for a specified region", that is, dynamically adding a drop-down box so as to perform a selecting operation based on the content displayed in the drop-down box, and adding three groups of selection boxes to generate the page component shown in fig. 2. Taking the drop-down box corresponding to the current operation as a current operation control group, such as the control group 230 in fig. 2, after the current control operation group is generated, the current operation control identifier corresponding to the current control operation group may be determined. Acquiring the associated information of the current operation control group, determining whether the associated information contains an associated control identifier, and if the associated control identifier corresponding to the current operation control group exists, determining the associated control group according to the associated control identifier. Namely, if other control groups parallel to the current operation control group exist in the initial page assembly, the associated control group is determined according to the associated control identification.

In an exemplary embodiment of the present disclosure, a component display state of an initial page component is determined according to the associated control information; performing component editing operation on the current operation control group according to the component display state to determine a component updating element; selecting operation mutual exclusion between the current operation control group and the associated control group; and generating updating control information according to the component updating element.

The component display state may be a display state of each element in the initial page component, and the component display state may be a display state of whether the page component element is selected. The component update element may be a component element in which the content of the initial page component dynamically changes. The updated control information may be generated based on updated information generated by the component update element during the current component editing operation.

Referring to FIG. 4, FIG. 4 schematically illustrates a flow diagram of a user operation portion of a page component generation process according to an exemplary embodiment of the present disclosure. For the page component information of the initial page component, a common storage area 410 may be set, and the page component information of the initial page component is stored in the common storage area 410, so that when a component editing operation on the initial page component is triggered, the page component information is acquired from the common storage area 410. The page component information includes information of all control groups in the initial page component, such as associated control information corresponding to an associated control group corresponding to the current operation control group.

In step S410, all selected component elements in the selection box are acquired. The associated control information can be obtained from the public storage area, such as the selected component elements and the candidate component elements in the associated control group; wherein the selected component elements may include a selected primary element, a selected secondary element, and a selected semi-selected element. And determining the component display state of the initial page component according to the acquired associated control information. After the initial page component is displayed in the target page, the user may perform a component editing operation on the current operation control group according to the component display state of the initial page component, for example, add a component element or remove a component element in the current operation control group, and determine the component element added or removed by the current operation as a component update element. When the component editing operation is performed, the selection operation between the current operation control group and the associated control group is mutually exclusive, that is, when the current operation control group performs the element adding operation, the selected component elements in the associated control group cannot be added, and unless the selected component elements in the associated control group are removed, the user can add the component elements from which the associated control group is removed to the current operation control group. And after the assembly editing operation is finished, generating the updated control information according to the assembly updating element.

In an exemplary embodiment of the present disclosure, candidate component elements and selected component elements are determined from the associated control information; the selected component elements comprise selected primary elements, selected secondary elements and selected half-selected elements; determining the display states of the selected primary element, the selected secondary element and the selected half-selected element as the selected display states; the display state of the candidate component element is determined as the candidate display state.

The component element may be an element included in the initial page component, and the candidate component element for the group price element may be a component element that is not selected in the page component in the process of performing component editing according to the rank. The selected component element may be a component element that has been selected in a page component in the course of performing component editing. The selected level element may be a component element whose level of the element that has been selected is at a first level. The selected level element may be a component element whose element level that has been selected is at a second level. The selected half selected elements may be component elements that are in a half selected state, e.g., a state corresponding to the elements of the first level corresponding to when the portion of the elements in the first level are selected. Taking the grade relation of province and city as an example, the first grade may be a regional grade corresponding to province and autonomous region. The second level may be a regional level corresponding to a district, county, city, etc. For example, the half-selected element may refer to a selected state of Beijing City at the great Xingshan of Beijing City, between full selection and non-selection. The primary element, the secondary element and the half selected element can be represented by firstIds, secondIDs and halfIds respectively.

Because the associated control information may include the selected component element and the candidate component element in the associated control group, and the component elements may correspond to different levels, the selected component element includes the selected primary element, the selected secondary element, and the selected half-selected element, and an element identifier (id) of the selected component element may be stored in the common storage area.

Referring to fig. 4, in step S420, a drop-down box is added. After adding the drop-down box, the user will display the drop-down box, i.e., the current set of operational controls, in the initial page component. Taking the scenario of the self-defined configuration of freight in fig. 2 as an example, since the freight criteria of the regions with three selection boxes are different, and are mutually exclusive, that is, a certain region can only select one freight, and cannot appear in a plurality of drop-down boxes. When a user operates the third group drop-down box to perform component editing operation, the selected component elements in the control group 210 and the control group 220 are grayed out, which indicates that the component elements cannot be selected at this time; other unselected component elements, as candidate component elements, will assume a normally selectable display state. In particular, the selected component elements of control group 210 may include the "Shanghai", "Jiangsu", "Zhejiang" regions; moreover, since the administrative levels of the "Shanghai", "Jiangsu" and "Zhejiang" regions belong to the provinces, the regions belong to the selected primary elements. The selected component elements of the control group 220 may include "xinjiang" and "qujing" regions, the administrative level of the "xinjiang" region belongs to province level, then "xinjiang" belongs to the selected first-level element, and the administrative level of the "qujing" region belongs to region level, so "qujing" belongs to the selected second-level element, and in addition, since "qujing" belongs to a region of "yunan", then "yunan" will be the selected semi-selected element corresponding to "qujing" city.

In an exemplary embodiment of the present disclosure, in response to a selection operation for a candidate component element, the candidate component element subjected to the selection operation is taken as a target selection element; the candidate component element is in an unselected state in the associated control group; and in response to the removal operation for the selected component element, taking the selected component element subjected to the removal operation as a target removal element.

The target selection element may be a component element selected by a selection operation of a user. The target removal element may be a selected component element that is removed by a user's removal operation.

As shown in fig. 3, when the component editing operation is performed on the control group 230, the "shanghai", "jiangsu", "zhejiang", "xinjiang", and "qujing" selected by the control group 210 and the control group 220 are grayed out and cannot be selected. The user can perform selection operation on the component elements in the drop-down box which are normally selectable, for example, the user can perform selection operation on areas such as "shanxi", "gansu", "ningxia", and the like, and the candidate component elements which are subjected to the selection operation are used as target selection elements, for example, when the user selects the "gansu" area, the "gansu" area is switched to the target selection elements. In the process of the component editing operation, although the selected component element cannot be selected again, the user can remove the selected component element from the control group by removing the selected component element from the check. For example, the user can remove "maze" from the control group 220, at which point the selected component elements that were subject to the removal operation will be converted to target removal elements, and the user can add "maze" to the control group 230 during subsequent component editing operations. Since the contents between the current operating control group and the associated control group are mutually exclusive, the selected component elements in the control group 210 and the control group 220 cannot be added when performing a component editing operation on the control group 230. Similarly, when performing component editing operation on the control group 220, selected component elements in the control group 210 and the control group 230 cannot be added; selected component elements in control group 220 and control group 230 cannot be added while performing component editing operations on control group 210.

In an exemplary embodiment of the present disclosure, an update element identifier, an update element level, and an update element content corresponding to a component update element are determined to generate update element information; and generating updated control information according to the updated element information and the associated control information.

The update element identifier may be a unique identifier corresponding to the component update element. The update element level may be a level to which the component update element corresponds. The update element content may be related content corresponding to the component update element, for example, the update element content may include a name of the update component element and specific element content, and the like.

The following will describe the procedure for generating the updated control information in detail by taking the generation procedure of three control groups (including drop-down boxes) in fig. 2 as an example. Referring to fig. 4, the user automatically adds a control group to the target page by clicking the "add specified area freight" button, and takes it as the current operation control group. In step S430, a pull-down component element is selected/deleted. The user may perform an operation of adding/removing component elements to the current operation control group, and for example, the user may select to add three provinces of "shanghai", "jiangsu" and "zhejiang" to the drop-down box 211. In step S440, the selected elements of the current selection box are generated, including the selected primary element (selected primary id), the selected secondary element (selected secondary id), the half-selected element (half-selected id), and the like. The user can take the id of the selected three provinces as the id of the selection and can determine the id as an updating element identifier; and determining the element grade and the element content corresponding to the selected element, wherein if the element content can be the names of three regions respectively, and the element grade belongs to a first-grade element because the three regions all belong to province grades. Thus, in step S450, the currently selected element is stored to the common storage area. Determining to add three kinds of data including firstIds, secondis and halfIds to the public storage area, wherein the specific data is as follows: "firstIDs" [2,12,15], "secodIds" [ ], "halfIDs" [ ], as updating element information; wherein firstIds refers to a primary id, secondis refers to a secondary id, and halfIds refers to a half-selected id. In step S460, the data is saved. And saving the determined updating element information.

Since the control group 210 does not have a corresponding associated control group at this time, the associated control information of the associated control group is empty, the updated control information can be generated according to the updated element information and the associated control information, and the data structure stored in the updated control information is a JSON Object Notation (JavaScript Object Notation) string, i.e., { "ids": 2,12,15, "" names "[" shanghai "," jiasu "," zhejiang "]," firstIds ": 2,12,15," "secodlds" [ ], "halfdids": [ ] }. The drop-down box carries three kinds of data, namely firstIds, secondis and halfIds, besides the id for self-check.

When the user adds the drop-down selection box 221 again, and adds "Xinjiang" and "Quiljing" to the drop-down box 221, three data "firstIds", "secodIds", and "halfIds": 31,25 "," secodIds ": 2247", "halfIds": 25 "may be added to the common storage area. After the data of the pull-down frame 1 and the pull-down frame 2 are respectively added with the data of the public storage area, the data are respectively stored to the rear end, and the storage structure is as follows:

a pull-down frame 1: { "ids": 2,12,15], "names": [ "shanghai", "jiangsu", "zhejiang" ], "firstIds": 31,25,2,12,15], "secondIds": 2247], "halfdids": 25 ];

the drop-down frames 2 { "ids": 31,2247], "names": Xinjiang "," Jingjing "]," firstIDs ": 31,25,2,12,15]," secondIDs ": 2247,"' halfIDs ": 25 }.

That is to say, the stored data corresponding to each control group carries all selected primary element ids, secondary element ids and half-selected element ids besides the component element id selected by itself, that is, all the selection frames are independent individuals, and carry information common to all the selection frames in a certain form. The target page may display the page components according to information stored in the common storage area.

In an exemplary embodiment of the present disclosure, component storage information corresponding to a target page is determined; the component storage information comprises initial component information of the initial page component; updating the initial component information based on the updating control information to obtain updated component information; and displaying the target page component on the target page according to the updated component information.

The target page may be a front page currently operated by the user. The component storage information may be related storage information of page components contained in the target page, and the component storage information may be component information stored in a common storage area (e.g., a database). The initial component information may be related component information corresponding to the initial page component. The update component information may be update information of the page component determined according to the update operation when the update operation is performed on the initial page component, for example, the update component information may include related information of the newly added component element, and the like.

Referring to fig. 5, fig. 5 schematically shows a flowchart of a component display part in a page component generation process according to an exemplary embodiment of the present disclosure. In step S510, component storage information of the target page is acquired, and an initialization operation is performed. For example, when a user performs a component editing operation based on a target page, the component storage information corresponding to the target page may be determined first, and an initialization operation may be performed on an initial page component according to the component storage information, for example, taking the freight configuration component in fig. 2 as an example, if a drop-down box 211 and a drop-down box 221 already exist in the freight configuration component, an initialization selection box operation may be performed according to storage data in a common storage area, so as to respectively display the contents of the drop-down boxes 1 and 2, and simultaneously initialize the common storage area data.

In step S520, update component information of the update component element corresponding to the current component editing operation is determined according to the selection box name of the selection box or the element identifier of the selected element. The user needs to perform component editing operation, for example, add component elements in the drop-down box, and can generate corresponding update control information. For example, element information of the newly added component element is added to the common storage area; if the removal operation is performed on the component element, if the content needs to be deleted, the id selected by the component element is deleted, and meanwhile, the id corresponding to the firstIds, secodlds, and halfIds deleted this time is deleted from the public area, corresponding updated component information is generated according to the above operation, and the updated component information is stored, and in step S530, the target page component can be displayed back in the target page according to the component data stored in the public storage area.

In summary, the page component generation method of the present disclosure obtains an initial page component, and determines a current operation control group and a corresponding associated control group based on the initial page component; the control contents between the associated control group and the current operation control group are mutually exclusive; determining the associated control information of the associated control group; performing component editing operation on the current operation control group based on the associated control information to determine updated control information; and carrying out component updating processing on the initial page component according to the updating control information to obtain a target page component. On one hand, dynamic addition and deletion of the components can be supported by carrying out component editing operation on the initial page components. On the other hand, due to the mutual exclusion of the control contents between the associated control group and the currently operated control group, the effect of mutual exclusion selection among a plurality of control groups can be realized when the assembly editing operation is carried out. On the other hand, by defining the storage structure of the control group, the related control information corresponding to the page component can be stored, the storage structure is relatively simple, user editing is supported, and the target page component can be displayed on the target page through the storage structure.

It is noted that although the steps of the methods of the present invention are depicted in the drawings in a particular order, this does not require or imply that the steps must be performed in this particular order, or that all of the depicted steps must be performed, to achieve desirable results. Additionally or alternatively, certain steps may be omitted, multiple steps combined into one step execution, and/or one step broken down into multiple step executions, etc.

Furthermore, in the present exemplary embodiment, a page component generation apparatus is also provided. Referring to fig. 6, the page component generating apparatus 600 may include: an initial component acquisition module 610, a control information acquisition module 620, a control information update module 630, and a target component generation module 640.

Specifically, the initial component obtaining module 610 is configured to obtain an initial page component, and determine a current operation control group and a corresponding associated control group based on the initial page component; the control contents between the associated control group and the current operation control group are mutually exclusive; a control information obtaining module 620, configured to determine associated control information of an associated control group; a control information updating module 630, configured to perform component editing operation on the current operation control group based on the associated control information to determine to update the control information; and the target component generating module 640 is configured to perform component update processing on the initial page component according to the update control information to obtain a target page component.

The specific details of the virtual module of each page component generation apparatus have been described in detail in the corresponding page component generation method, and therefore are not described herein again.

It should be noted that although several modules or units of the page component generation apparatus are mentioned in the above detailed description, such division is not mandatory. Indeed, the features and functionality of two or more modules or units described above may be embodied in one module or unit, according to embodiments of the present disclosure. Conversely, the features and functions of one module or unit described above may be further divided into embodiments by a plurality of modules or units.

In addition, in an exemplary embodiment of the present disclosure, an electronic device capable of implementing the above method is also provided.

As will be appreciated by one skilled in the art, aspects of the present invention may be embodied as a system, method or program product. Thus, various aspects of the invention may be embodied in the form of: an entirely hardware embodiment, an entirely software embodiment (including firmware, microcode, etc.) or an embodiment combining hardware and software aspects that may all generally be referred to herein as a "circuit," module "or" system.

An electronic device 700 according to such an embodiment of the invention is described below with reference to fig. 7. The electronic device 700 shown in fig. 7 is only an example and should not bring any limitation to the functions and the scope of use of the embodiments of the present invention.

As shown in fig. 7, electronic device 700 is embodied in the form of a general purpose computing device. The components of the electronic device 700 may include, but are not limited to: the at least one processing unit 710, the at least one memory unit 720, a bus 730 connecting different system components (including the memory unit 720 and the processing unit 710), and a display unit 740.

Wherein the memory unit stores program code that is executable by the processing unit 710 such that the processing unit 710 performs the steps according to various exemplary embodiments of the present invention as described in the above section "exemplary method" of the present specification.

The storage unit 720 may include readable media in the form of volatile memory units, such as a random access memory unit (RAM)721 and/or a cache memory unit 722, and may further include a read only memory unit (ROM) 723.

The memory unit 720 may include a program/utility 724 having a set (at least one) of program modules 725, such program modules 725 including, but not limited to: an operating system, one or more application programs, other program modules, and program data, each of which, or some combination thereof, may comprise an implementation of a network environment.

Bus 730 may represent one or more of any of several types of bus structures, including a memory unit bus or memory unit controller, a peripheral bus, an accelerated graphics port, a processing unit, or a local bus using any of a variety of bus architectures.

The electronic device 700 may also communicate with one or more external devices 770 (e.g., keyboard, pointing device, bluetooth device, etc.), with one or more devices that enable a user to interact with the electronic device 700, and/or with any devices (e.g., router, modem, etc.) that enable the electronic device 700 to communicate with one or more other computing devices. Such communication may occur via an input/output (I/O) interface 750. Also, the electronic device 700 may communicate with one or more networks (e.g., a Local Area Network (LAN), a Wide Area Network (WAN), and/or a public network such as the internet) via the network adapter 760. As shown, the network adapter 760 communicates with the other modules of the electronic device 700 via the bus 730. It should be appreciated that although not shown in the figures, other hardware and/or software modules may be used in conjunction with the electronic device 700, including but not limited to: microcode, device drivers, redundant processing units, external disk drive arrays, RAID systems, tape drives, and data backup storage systems, among others.

Through the above description of the embodiments, those skilled in the art will readily understand that the exemplary embodiments described herein may be implemented by software, or by software in combination with necessary hardware. Therefore, the technical solution according to the embodiments of the present disclosure may be embodied in the form of a software product, which may be stored in a non-volatile storage medium (which may be a CD-ROM, a usb disk, a removable hard disk, etc.) or on a network, and includes several instructions to enable a computing device (which may be a personal computer, a server, a terminal device, or a network device, etc.) to execute the method according to the embodiments of the present disclosure.

In an exemplary embodiment of the present disclosure, there is also provided a computer-readable storage medium having stored thereon a program product capable of implementing the above-described method of the present specification. In some possible embodiments, aspects of the invention may also be implemented in the form of a program product comprising program code means for causing a terminal device to carry out the steps according to various exemplary embodiments of the invention described in the above-mentioned "exemplary methods" section of the present description, when said program product is run on the terminal device.

Referring to fig. 8, a program product 800 for implementing the above method according to an embodiment of the present invention is described, which may employ a portable compact disc read only memory (CD-ROM) and include program code, and may be run on a terminal device, such as a personal computer. However, the program product of the present invention is not limited in this regard and, in the present document, a readable storage medium may be any tangible medium that can contain, or store a program for use by or in connection with an instruction execution system, apparatus, or device.

The program product may employ any combination of one or more readable media. The readable medium may be a readable signal medium or a readable storage medium. A readable storage medium may be, for example, but not limited to, an electronic, magnetic, optical, electromagnetic, infrared, or semiconductor system, apparatus, or device, or any combination of the foregoing. More specific examples (a non-exhaustive list) of the readable storage medium include: an electrical connection having one or more wires, a portable disk, a hard disk, a Random Access Memory (RAM), a read-only memory (ROM), an erasable programmable read-only memory (EPROM or flash memory), an optical fiber, a portable compact disc read-only memory (CD-ROM), an optical storage device, a magnetic storage device, or any suitable combination of the foregoing.

A computer readable signal medium may include a propagated data signal with readable program code embodied therein, for example, in baseband or as part of a carrier wave. Such a propagated data signal may take many forms, including, but not limited to, electro-magnetic, optical, or any suitable combination thereof. A readable signal medium may also be any readable medium that is not a readable storage medium and that can communicate, propagate, or transport a program for use by or in connection with an instruction execution system, apparatus, or device.

Program code embodied on a readable medium may be transmitted using any appropriate medium, including but not limited to wireless, wireline, optical fiber cable, RF, etc., or any suitable combination of the foregoing.

Program code for carrying out operations for aspects of the present invention may be written in any combination of one or more programming languages, including an object oriented programming language such as Java, C + + or the like and conventional procedural programming languages, such as the "C" programming language or similar programming languages. The program code may execute entirely on the user's computing device, partly on the user's device, as a stand-alone software package, partly on the user's computing device and partly on a remote computing device, or entirely on the remote computing device or server. In the case of a remote computing device, the remote computing device may be connected to the user computing device through any kind of network, including a Local Area Network (LAN) or a Wide Area Network (WAN), or may be connected to an external computing device (e.g., through the internet using an internet service provider).

Furthermore, the above-described figures are merely schematic illustrations of processes involved in methods according to exemplary embodiments of the invention, and are not intended to be limiting. It will be readily understood that the processes shown in the above figures are not intended to indicate or limit the chronological order of the processes. In addition, it is also readily understood that these processes may be performed synchronously or asynchronously, e.g., in multiple modules.

Other embodiments of the disclosure will be apparent to those skilled in the art from consideration of the specification and practice of the disclosure disclosed herein. This application is intended to cover any variations, uses, or adaptations of the disclosure following, in general, the principles of the disclosure and including such departures from the present disclosure as come within known or customary practice within the art to which the disclosure pertains. It is intended that the specification and examples be considered as exemplary only, with a true scope and spirit of the disclosure being indicated by the following claims.

It will be understood that the present disclosure is not limited to the precise arrangements described above and shown in the drawings and that various modifications and changes may be made without departing from the scope thereof. The scope of the present disclosure is to be limited only by the terms of the appended claims.

Claims

1. A page component generation method is characterized by comprising the following steps:

acquiring an initial page component, and determining a current operation control group and a corresponding associated control group based on the initial page component; the control content between the associated control group and the current operation control group is mutually exclusive;

determining associated control information of the associated control group;

performing component editing operation on the current operation control group based on the associated control information to determine updated control information;

and carrying out component updating processing on the initial page component according to the updating control information to obtain a target page component.

2. The method of claim 1, wherein determining a current set of operating controls and a corresponding set of associated controls based on the initial page component comprises:

determining a page component template corresponding to the initial page component;

in response to a component add operation for the page component template, determining the current operation control group;

and acquiring an associated control identification corresponding to the current operation control group, and determining the associated control group according to the associated control identification.

3. The method of claim 1, wherein performing a component editing operation on the current set of operational controls based on the associated control information to determine updated control information comprises:

determining the component display state of the initial page component according to the associated control information;

performing the component editing operation on the current operation control group according to the component display state to determine the component updating element; selecting operation mutual exclusion between the current operation control group and the associated control group;

and generating the updating control information according to the component updating element.

4. The method of claim 3, wherein determining a component display state of the initial page component from the associated control information comprises:

determining candidate component elements and selected component elements according to the associated control information; the selected component elements comprise selected primary elements, selected secondary elements and selected semi-selected elements;

determining a display state of the selected primary element, the selected secondary element, and the selected semi-selected element as a selected display state;

determining a display state of the candidate component element as a candidate display state.

5. The method of claim 3, wherein the component update element comprises a target selection element and a target removal element; performing the component editing operation on the current operation control group according to the component display state to determine the component update element, including:

in response to a selection operation for a candidate component element, regarding the candidate component element subjected to the selection operation as the target selection element; the candidate component element is in an unselected state in the associated control group;

in response to a removal operation for a selected component element, the selected component element that has undergone the removal operation is taken as the target removal element.

6. The method of claim 3, wherein generating the update control information from the component update element comprises:

determining an update element identifier, an update element grade and an update element content corresponding to the component update element to generate update element information;

and generating the updated control information according to the updated element information and the associated control information.

7. The method of claim 1, wherein performing component update processing on the initial page component according to the update control information to obtain a target page component comprises:

determining component storage information corresponding to a target page; the component storage information comprises initial component information of the initial page component;

updating the initial component information based on the updating control information to obtain updated component information;

and displaying the target page component on the target page according to the updated component information.

8. A page component generating apparatus, comprising:

the initial component acquisition module is used for acquiring an initial page component; the initial page assembly comprises a current operation control group and a corresponding association control group; the control content between the associated control group and the current operation control group is mutually exclusive;

the control information acquisition module is used for determining the associated control information of the associated control group;

the control information updating module is used for carrying out component editing operation on the current operation control group based on the associated control information so as to determine the updated control information;

and the target component generation module is used for carrying out component updating processing on the initial page component according to the updating control information so as to obtain a target page component.

9. An electronic device, comprising:

a processor; and

a memory having stored thereon computer readable instructions which, when executed by the processor, implement the page component generation method of any of claims 1 to 7.

10. A computer-readable storage medium, on which a computer program is stored which, when being executed by a processor, carries out the page component generation method according to any one of claims 1 to 7.