CN116610889A - WEB page creation method and visualized software designer - Google Patents

Abstract

The invention discloses a WEB page creation method and a visualized software designer. The WEB page creation method comprises the following steps: step one, creating a WEB page and determining components of the WEB page; wherein, the display element and the table element are used as components; setting attribute information of the component to obtain a created WEB page; and thirdly, storing and releasing the WEB page. By setting the attribute of the component in the visualization, the method replaces the development form of pure codes in the process of developing professional codes in the development of software development or WEB page update, reduces the complexity of software development and improves the efficiency of software development.

Description

WEB page creation method and visualized software designer

Technical Field

The invention relates to a software development technology, in particular to a WEB page creation method and a visualized software designer.

Background

With the development of a series of emerging technologies such as the internet, big data, artificial intelligence, the internet of things and cloud computing, and the policy guidelines of the national strategy of digital China, more and more enterprises are actively searching for digital transformation roads to conduct digital transformation.

The demands of government affairs and enterprises on computer software are rapidly increased, a large amount of codes are required to be operated in a traditional WEB software development mode, the complexity of page design is high, the efficiency of software development is reduced, and the requirements on technicians are high.

Disclosure of Invention

The invention provides a WEB page creation method and a visualized software designer, which adopt a development mode of taking a table element as a component and visually set the attribute of the component, thereby solving the problems of high error rate, high complexity and low development efficiency in the development mode of pure codes in software development.

In order to achieve the above purpose, the present invention provides the following technical solutions:

a WEB page creation method, the method comprising:

step one, creating a WEB page and determining components of the WEB page; wherein, the display element and the table element are used as components;

setting attribute information of the component to obtain a created WEB page;

and thirdly, storing and releasing the WEB page.

In one possible implementation manner, the form element and the display element are obtained by adding a self-defined WEB display effect and action definition based on a JSON mode international standard.

In one possible implementation manner, the setting the attribute information of the component to obtain the created WEB page includes:

and setting the general configuration of the component and the exclusive configuration of the component to obtain the created WEB page.

In one possible implementation, the set of form elements is set as a model, and different sets of form elements correspond to different models.

In one possible implementation, the forms are used as a business base model in software development, and are combined into a new model by combining sub-forms and associated forms in the component.

In one possible implementation, the method is characterized by: the generic configuration comprises: component name, component data source, component color style, and component inspection rules.

In one possible implementation, the components include text, numeric, date, switch, single choice, multiple choice, cell phone, amount, mailbox, percentage, attachment, picture, address, rich text, department of choice, person of choice, creator, creation time, updater, update time, serial number, association record, association attribute, sub-table, tree association, formula, layout assistance, title remark, separation line.

In one possible implementation manner, the visualized software designer is used for executing the WEB page creation method, and the software designer includes:

the component module is used for displaying the components to be configured;

the design module is used for designing a WEB page;

and the component attribute setting module is used for setting the attribute of the selected component.

Compared with the prior art, the invention has the beneficial effects that:

according to the method for creating the WEB page, provided by the invention, on the basis of the JSONCHEMA international standard, a self-defined WEB display effect and action definition are added as an extended component to define a WEB page form and a display element, form elements, layout, enterprise-level application selectors (selection personnel, organizations and the like) are used as components, and general configurations such as attributes, styles and the like and special configurations of the components are set for various components, so that the development form of pure codes in the development process of professional codes is comprehensively replaced, the complexity of software development is reduced, and the efficiency of software development is improved. The method has the advantages that the set of form elements is used as a model, the WEB function page is developed in a visual mode, the design, the research and the development are realized, the demand and the delivery are realized, the requirements of technicians are reduced, and non-professional technicians can design complex systems.

Drawings

FIG. 1 illustrates a flowchart of a WEB page creation method according to an embodiment of the present disclosure.

FIG. 2 illustrates a block diagram of a visualized software designer of an embodiment of the disclosure.

Detailed Description

Various exemplary embodiments, features and aspects of the disclosure will be described in detail below with reference to the drawings. In the drawings, like reference numbers indicate identical or functionally similar elements. Although various aspects of the embodiments are illustrated in the accompanying drawings, the drawings are not necessarily drawn to scale unless specifically indicated.

The word "exemplary" is used herein to mean "serving as an example, embodiment, or illustration. Any embodiment described herein as "exemplary" is not necessarily to be construed as preferred or advantageous over other embodiments.

In addition, numerous specific details are set forth in the following detailed description in order to provide a better understanding of the present disclosure. It will be understood by those skilled in the art that the present disclosure may be practiced without some of these specific details. In some instances, methods, means, elements, and circuits well known to those skilled in the art have not been described in detail in order not to obscure the present disclosure.

FIG. 1 illustrates a flowchart of a WEB page creation method according to an embodiment of the present disclosure. As shown in fig. 1, the method includes:

step S01, creating a WEB page and determining components of the WEB page; wherein, the display element and the table element are used as components;

step S02, setting attribute information of the component to obtain a created WEB page;

and step S03, storing and releasing the WEB page.

Determining components of the WEB page by creating the WEB page; wherein, the display element and the table element are used as components; setting attribute information of the component to obtain a created WEB page; and storing and releasing the WEB page. The WEB page creation method of the invention generates the forms, the data tables and the data detail pages by setting the attribute of the custom component, and solves the technical problems of high error rate, high complexity and insufficient standardization and unification of software development in a pure code development mode in software development. Compared with the traditional development mode, the software design is carried out by using the standardized components, so that the standardization of the software development is unified, and the software development is more convenient and efficient.

The form is a core scene for the user to collect data information, and meanwhile, the data information is displayed for the user through the form, in short, the form is a bridge between the user and the database, the user can be ensured to fill in information according to requirements and submit the information to the background or guide the user to perform various settings, and the good form can help the user to improve efficiency and increase user satisfaction. The original system or software is free of user information, a user inputs data information through a form, and the more the input information is, the more the information managed by the database is, the data management advantage of the system or software can be highlighted, and the value of the system or software can be realized.

The essence of the browser-side product is 'adding, deleting and checking' of the data information, and 'adding' and 'changing' are corresponding to the application scene examples of the forms, and different form designs are required to be carried out aiming at different user data so as to adapt to various scene functions.

In a possible implementation manner, the component may include a display element and a form element, where the form element and the display element are obtained by adding a custom WEB display effect and action definition based on JSON mode international standards as a framework basis. Forms are typically made up of labels, input fields, fill-in prompts, and operating buttons. For example, the definition of the format input in the input field of the form element, the definition of the tag name of the form element, the definition of the filling prompt, or the action definition of the operation button are added based on the existing JSON mode international standard.

By customizing display elements and table element elements of the selected component, a new software development mode is formed by replacing a development form of a pure code in a professional code development process in a software design process, so that the software development efficiency is improved, and the complexity of the software development is reduced.

In one possible implementation manner, the setting the attribute information of the component to obtain the created WEB page includes: and setting the general configuration of the component and the exclusive configuration of the component to obtain the created WEB page. For example, the generic configuration includes: component name, component data source, component color style, and component inspection rules. For example, the component name "teleconference", the component data source "database a path B", the component color style "blue", the component verification rule "verify that the filled-in information is in the correct format, such as telephone number, mailbox format, user name format", "verify that the user name or password is correct", and the like. The exclusive configuration of the component, such as the setting of "feedback information" and "prompt information" of the component, can also be set.

The visual configuration of the components in the WEB page is realized through the general configuration of the components and the exclusive configuration of the components, so that a large number of codes are prevented from being operated in the development process, the software development efficiency is improved, the complexity of the software development is reduced, and the development of the WEB page software is realized more flexibly and conveniently.

In one possible implementation, the set of form elements may be configured as models, with different sets of form elements corresponding to different models. For example, a table element model for personal information collection may be preset, which includes: form elements such as name, gender, age, telephone number, identification number, home address, etc. In the book management information system, a book borrowing list element model of book management can be further set, which comprises the following steps: borrower, borrower telephone, borrowing starting time, return time and out-of-date time.

By setting the models corresponding to different list element sets, different models can be selected for different services in the process of software development, and the models can be directly applied to the developed software because the models are developed, so that the development efficiency is greatly improved, and the development complexity is reduced.

In one possible implementation, the forms are used as a business base model in software development, and are combined into a new model by combining sub-forms and associated forms in the component. For example, in the application scenario of personal information collection, an optional form element of a provincial city street may be included under the form of address information, and the address information form may also be associated with bus information near the address. In this way, in the software development process, different models can be flexibly combined, a developer does not need to operate a large amount of codes, visual and rapid update and release of WEB pages or application software are realized, and efficient software update and release are completed.

In one possible implementation, the components include text, numeric, date, switch, single choice, multiple choice, cell phone, amount, mailbox, percentage, attachment, picture, address, rich text, department of choice, person of choice, creator, creation time, updater, update time, serial number, association record, association attribute, sub-table, tree association, formula, layout assistance, title remark, separation line.

In one possible implementation manner, the components can be selected to be combined into different component sets, namely different component models are formed, and when software development is carried out, the models can be taken and used at once, so that the software development efficiency is improved. The component model may be a set of the text, the numerical value, the creator, etc., and different components may be selected to form different component models according to development requirements.

Through setting the diversified form components, related modules can be directly clicked in the process of software development, so that a user can more clearly utilize the component content without updating or modifying complex abstract codes, the complexity of software development is reduced, and the efficiency of software development is improved. In addition, page form elements, layouts, enterprise-level application selectors (selection personnel, organizations, etc.) are used as components.

Aiming at the general configuration such as attributes, styles and the like and the special configuration of the components, the development form of pure codes in the development process of professional codes is comprehensively replaced to form a new mode, the requirements of technicians are reduced, non-professional technicians can design a complex system, the professional development environment is canceled, and professional operation and maintenance and test on newly developed pages are not needed.

In the embodiment of the disclosure, based on the JSONEMA international standard, a self-defined WEB display effect and action definition are added as extensions to define a WEB page form and display elements; the JSON schema with the expansion capability can configure or expand the attribute, records all configuration items of form elements and custom components, has the capability of generating forms, data tables and data detail pages, and can enable a user to check the contents of the data tables in time and complete release in time.

In one possible implementation, the visualized software designer may be used to perform the WEB page creation method, the software designer including: the component module is used for displaying the components to be configured; the design module is used for designing a WEB page; and the component attribute setting module is used for setting the attribute of the selected component.

For example, the visualized components and component models can be set, and attributes of the components and the component models can be set, for example, after clicking the components, the components are subjected to configuration items such as names, data sources, color styles and the like style classes, inspection rules and the like.

FIG. 2 illustrates a block diagram of a visualized software designer of an embodiment of the disclosure. As shown in fig. 2, when designing a WEB page, the design module may be a design area, through creation of a visual WEB page, a user opens a visual software designer, selects "component module 1" and "component module 2", drags to the design area, clicks a component module in the design area, and then the rightmost component attribute setting module pair performs attribute configuration on the displayed component configuration item, and after clicking "save", the design area may be generated and used as a final interface. The method avoids operating a large amount of pure codes, improves the efficiency of software development, reduces the complexity of software development, and is favorable for timely updating and releasing the WEB page.

It should be noted that, for simplicity of description, the foregoing method embodiments are all described as a series of acts, but it should be understood by those skilled in the art that the present disclosure is not limited by the order of acts described, as some steps may be performed in other orders or concurrently in accordance with the present disclosure. Further, those skilled in the art will also appreciate that the embodiments described in the specification are all alternative embodiments, and that the acts and modules referred to are not necessarily required by the present disclosure.

In the foregoing embodiments, the descriptions of the embodiments are emphasized, and for parts of one embodiment that are not described in detail, reference may be made to related descriptions of other embodiments.

In the several embodiments provided in the present disclosure, it should be understood that the disclosed apparatus may be implemented in other manners. For example, the apparatus embodiments described above are merely illustrative, such as the division of the units, merely a logical function division, and there may be additional manners of dividing the actual implementation, such as multiple units or components may be combined or integrated into another system, or some features may be omitted, or not performed. Alternatively, the coupling or direct coupling or communication connection shown or discussed with each other may be an indirect coupling or communication connection via some interfaces, devices or units, or may be in electrical or other forms.

The units described as separate units may or may not be physically separate, and units shown as units may or may not be physical units, may be located in one place, or may be distributed on a plurality of network units. Some or all of the units may be selected according to actual needs to achieve the purpose of the solution of this embodiment.

In addition, each functional unit in each embodiment of the present disclosure may be integrated in one processing unit, or each unit may exist alone physically, or two or more units may be integrated in one unit. The integrated units described above may be implemented either in hardware or in software program modules.

The integrated units, if implemented in the form of software program modules, may be stored in a computer-readable memory for sale or use as a stand-alone product. Based on such understanding, the technical solution of the present disclosure may be embodied in essence or a part contributing to the prior art or all or part of the technical solution in the form of a software product stored in a memory, comprising several instructions for causing a computer device (which may be a personal computer, a server or a network device, etc.) to perform all or part of the steps of the method described in the various embodiments of the present disclosure. And the aforementioned memory includes: a U-disk, a Read-Only Memory (ROM), a random access Memory (RAM, random Access Memory), a removable hard disk, a magnetic disk, or an optical disk, or other various media capable of storing program codes.

Those of ordinary skill in the art will appreciate that all or a portion of the steps in the various methods of the above embodiments may be implemented by a program that instructs associated hardware, and the program may be stored in a computer readable memory, which may include: flash disk, read-Only Memory (ROM), random access Memory (Random Access Memory, RAM), magnetic disk or optical disk.

The foregoing has described in detail embodiments of the present disclosure, with specific examples being employed herein to illustrate the principles and implementations of the present disclosure, the above examples being provided solely to assist in understanding the methods of the present disclosure and their core ideas; meanwhile, as one of ordinary skill in the art will have variations in the detailed description and the application scope in light of the ideas of the present disclosure, the present disclosure should not be construed as being limited to the above description.

Various aspects of the present disclosure are described herein with reference to flowchart illustrations and/or block diagrams of methods, apparatus (systems) and computer program products according to embodiments of the disclosure. It will 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 computer-readable program instructions.

The flowcharts and block diagrams in the figures illustrate the architecture, functionality, and operation of possible implementations of systems, methods and computer program products according to various embodiments of the present disclosure. In this regard, each block in the flowchart or block diagrams may represent a module, segment, or portion of instructions, which comprises one or more executable instructions for implementing the specified logical function(s). In some alternative implementations, the functions noted in the block may occur out of the order noted in the figures. For example, two blocks shown in succession may, in fact, be executed substantially concurrently, or the blocks may sometimes be executed in the reverse order, depending upon the functionality involved. It will also be noted that each block of the block diagrams and/or flowchart illustration, and combinations of blocks in the block diagrams and/or flowchart illustration, can be implemented by special purpose hardware-based systems which perform the specified functions or acts, or combinations of special purpose hardware and computer instructions.

The foregoing description of the embodiments of the present disclosure has been presented for purposes of illustration and description, and is not intended to be exhaustive or limited to the embodiments disclosed. Many modifications and variations will be apparent to those of ordinary skill in the art without departing from the scope and spirit of the various embodiments described. The terminology used herein was chosen in order to best explain the principles of the embodiments, the practical application, or the technical improvements in the marketplace, or to enable others of ordinary skill in the art to understand the embodiments disclosed herein.

Claims (8)

1. A WEB page creation method, the method comprising:

step one, creating a WEB page and determining components of the WEB page; wherein, the display element and the table element are used as components;

setting attribute information of the component to obtain a created WEB page;

and thirdly, storing and releasing the WEB page.

2. The WEB page creation method according to claim 1, wherein the form element and the display element are obtained by adding a custom WEB display effect and an action definition based on JSON mode international standards.

3. The WEB page creation method according to claim 1, wherein the setting the attribute information of the component to obtain the created WEB page includes:

and setting the general configuration of the component and the exclusive configuration of the component to obtain the created WEB page.

4. The WEB page creation method according to claim 1, wherein the set of form elements is set as a model, and different sets of form elements correspond to different models.

5. The WEB page creation method according to claim 1, wherein the form is used as a business base model in software development, and is combined into a new model by combining a sub-form and an associated form in the component.

6. The WEB page creation method according to claim 3, wherein: the generic configuration comprises: component name, component data source, component color style, and component inspection rules.

7. The WEB page creation method according to claim 1, wherein: the components comprise texts, numerical values, dates, switches, single choices, multiple choices, mobile phones, amounts, mailboxes, percentages, attachments, pictures, addresses, rich texts, departments of choice, personnel of choice, creator, creation time, updater, update time, serial numbers, associated records, associated attributes, sub-tables, tree associations, formulas, layout assistance, title notes and separation lines.

8. A visualized software designer for performing the WEB page creation method of any of claims 1-7, the software designer comprising:

the component module is used for displaying the components to be configured;

the design module is used for designing a WEB page;

and the component attribute setting module is used for setting the attribute of the selected component.