Form processing method and system, electronic equipment and storage medium

Abstract

The invention relates to a form processing method and system, electronic equipment and a storage medium, and is applied to the technical field of computers.The method comprises the steps that in response to a preview instruction for a target form, the target form is rendered in a canvas preview area, so that at least one form component in the target form is displayed in the canvas preview area; obtaining editing data of a target form component, wherein the target form component is a form component in the at least one form component; and rendering the edited data in the canvas preview area.

Description

Technical Field

[0001] This application relates to the field of computer technology, and in particular to a form processing method, system, electronic device, and storage medium. Background Technology

[0002] Insurance agents negotiate the form of insurance products with insurance companies. After signing an agreement, the product manager of the technology team transforms it into an online sales product. The technology team, based on different product forms, goes through processes such as user interaction design, page design, system design, technology development, internal testing, and deployment and launch before releasing the product to the Internet for sale.

[0003] In related technologies, after product development is completed, only basic product attributes can be configured on simple forms. This process is separate from page development, and it is impossible to preview the final product display in real time. Only after the product is released and launched can the final effect be seen. Page corrections require re-publishing the code, which is costly. Summary of the Invention

[0004] This application provides a form processing method, system, electronic device, and storage medium to solve the problem in the prior art that the final presentation of a product cannot be previewed in real time, and the final effect of the product can only be seen after it is published and launched.

[0005] According to a first aspect of the embodiments of this application, a form processing method is provided, comprising: In response to a preview command for a target form, the target form is rendered in a canvas preview area to display at least one form component of the target form in the canvas preview area. Obtain edit data for a target form component, wherein the target form component is a form component among the at least one form components; The edited data is rendered in the canvas preview area.

[0006] Optionally, retrieve edit data for the target form component, including: In response to an editing operation on the target form component in the canvas preview area, the target configuration information corresponding to the target form component is displayed; In response to the editing operation on the target configuration information, the edited target configuration information is determined to be the edited data.

[0007] Optionally, before retrieving edit data from the target form component, the following steps are also included: The component editing area is used to display the configuration information corresponding to the form component; the canvas preview area and the component editing area are different areas within the same canvas. The step of obtaining the edit data for the target form component includes: In response to the editing operation of the target configuration information of the target form component in the component editing area, the edited target configuration information is determined to be the edited data, and the canvas preview area and the component editing area are different areas in the same canvas.

[0008] Optionally, in response to a preview instruction for the target form, the following may also be included: In response to the selection of any candidate component in the component library, determine the selected form component; Obtain the selection configuration information corresponding to the selected form component; The target form is generated based on the selected configuration information.

[0009] Optionally, after rendering the edit data in the canvas preview area, the method further includes: The target form or the edited target form is stored as a template form in the template database.

[0010] Optionally, after rendering the edit data in the canvas preview area, the method further includes: The target template form is obtained from multiple template forms in the template database, and the target template form includes multiple fields to be filled in; In response to the user's action of filling in the area to be filled, obtain the filled content; Based on the target template form and the filled-in content, the user's form filling file is generated.

[0011] Optionally, before generating the user's form completion file based on the target template form and the filled-in content, the method further includes: Verify the accuracy of the information entered; If all fields to be filled have been filled and the filled content has passed verification, then the process of generating the user's form file based on the target template form and the filled content is executed.

[0012] According to a second aspect of the embodiments of this application, a form processing system is provided, including: a compiler, a page previewer, and a control panel; A compiler, used to render the target form in the canvas preview area in response to a preview instruction for the target form; A page previewer is used to display at least one form component of the target form in the canvas preview area; A control panel is used to obtain editing data for a target form component, wherein the target form component is a form component among the at least one form components; The page previewer is also used to render the edited data in the canvas preview area.

[0013] According to a third aspect of the embodiments of this application, an electronic device is provided, including a memory and a processor; The memory is connected to the processor and is used to store programs; The processor is used to implement the form processing method as described in the first aspect by running a program in the memory.

[0014] According to a fourth aspect of the embodiments of this application, a storage medium is provided, on which a computer program is stored, and when the computer program is run by a processor, it implements the form processing method as described in the first aspect.

[0015] According to a fifth aspect of the embodiments of this application, a computer program product is provided, including computer program instructions that, when executed by a processor, cause the processor to perform a form processing method as described in the first aspect.

[0016] Compared with the prior art, the technical solution provided in this application has the following advantages: The method provided in this application, in response to a preview command for a target form, renders the target form in a canvas preview area to display at least one form component of the target form in the canvas preview area; obtains editing data for the target form component, where the target form component is one of the at least one form components; and renders the editing data in the canvas preview area. Thus, for a generated target form, by previewing the target form, when modifications are needed, the target form components can be directly edited to obtain editing data, which is then rendered in the canvas preview area. This allows for real-time previewing during the editing process of the target form, eliminating the need to wait for publication and requiring code re-publishing for page corrections, thereby reducing the cost of modification. Attached Figure Description

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

[0018] Figure 1 A flowchart illustrating a form processing method according to an embodiment of this application.

[0019] Figure 2 A schematic diagram of a canvas is provided for one embodiment of this application.

[0020] Figure 3 A flowchart of a form processing method is provided for another embodiment of this application.

[0021] Figure 4 This is a schematic diagram of a form processing system provided for an embodiment of this application.

[0022] Figure 5 This is a structural diagram of an electronic device provided in an embodiment of this application. Detailed Implementation

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

[0024] Exemplary Implementation Environment The form processing method according to embodiments of this application can be executed by electronic devices such as terminal devices or servers. Terminal devices can be user equipment (UE), mobile devices, user terminals, terminals, cellular phones, cordless phones, personal digital assistants (PDAs), handheld devices, computing devices, in-vehicle devices, wearable devices, etc. Servers can be independent physical servers, server clusters composed of multiple physical servers, or cloud servers capable of cloud computing. This method can be implemented by a processor calling computer-readable program instructions stored in memory. This application uses the execution of the form processing method by a server as an example for explanation, but does not limit it.

[0025] Exemplary methods Before providing a detailed description of the embodiments of the present invention, the relevant background information involved in the embodiments of the present invention will be further explained.

[0026] DOM: The Document Object Model (DOM) is the data representation of the objects that make up the structure and content of a document on the web.

[0027] Compiler: A tool that converts structured page data into DOM structure and renders it into page elements that can be displayed in a browser.

[0028] Component library: A code library that categorizes and designs the page's DOM structure, abstracts it into a standardized DOM structure, and provides it to third parties for use.

[0029] Page structure: refers to a data structure that virtualizes the browser's DOM structure into a JSON structure to facilitate reading and processing by program code.

[0030] JSON: JSON (JavaScript Object Notation) is an open standard file and data exchange format designed based on a subset of ECMAScript. It is easy for humans to read and write, and also easy for machines to parse and generate.

[0031] Store: A data storage (linker) is a design that temporarily stores data in memory for use by other parts of the system. Users can write data to the store or listen to changes in the data in the store to make their own decisions.

[0032] User forms: These are web forms that users need to fill in when purchasing insurance. Dynamic forms refer to technologies that allow the system to dynamically delete, add, or change items on the form based on product content or configuration, compared to a fixed form structure in a traditional development model.

[0033] Control Panel: In the editor, this refers to the area used to manage and organize structured data for page components.

[0034] Form validator: A tool that validates the input of different types of fields in a form to ensure that the user's input is correct.

[0035] Redis: Redis (Remote Dictionary Server) is an open-source, ANSI C-written, network-enabled, in-memory or persistent, log-structured, key-value database that provides APIs for multiple languages.

[0036] MongoDB: MongoDB is a database based on distributed file storage. It is written in C++ and aims to provide scalable, high-performance data storage solutions for web applications.

[0037] MySQL Database: MySQL is a relational database management system. It is one of the most popular relational database management systems, and in web applications, MySQL is one of the best RDBMS (Relational Database Management System) application software.

[0038] Please see Figure 1In one exemplary embodiment, a form processing method is provided, including: Step 101: In response to a preview command for the target form, render the target form in the canvas preview area to display at least one form component of the target form in the canvas preview area.

[0039] In some embodiments, the target form can be a fully created form or a partially created form. The target form includes multiple form components, each implementing a corresponding form function. The target form can be a form generated in any scenario. For example, in an office administration scenario, the target form can be an internal approval form or a project application form; in a financial scenario, the target form can be an insurance application or a loan application form; in a medical scenario, the target form can be a medical registration form; and in an educational scenario, the target form can be a student registration application form.

[0040] The target form can be generated using a form processing system. After the target form is generated, a preview instruction for the target form can be generated by triggering the preview button on the system (i.e., the form processing system mentioned above).

[0041] The system configures a canvas preview area. Upon responding to a preview command, the target form is rendered within the canvas preview area to display its components. Understandably, if the target form has many components and the canvas preview area is small, only a portion of the components may be displayed. Users can slide the canvas preview area to view the remaining components. Conversely, if the canvas preview area is large, all components of the target form can be displayed.

[0042] If a user finds a form component that needs adjustment while previewing the target form, they can edit that component during the preview process and render the edited data in the canvas preview area. This allows for real-time previewing while editing the target form.

[0043] In an alternative embodiment, prior to responding to a preview instruction for the target form, the method further includes: In response to the selection of any component in the component library, determine the selected form component; Obtain the selection configuration information corresponding to the selected form component; The target form is generated based on the selected configuration information.

[0044] In some embodiments, the target form can be generated in multiple ways. To reduce development costs, the components of the page are modularly encapsulated, including various commonly used front-end components such as images, text, forms, and buttons. Each component is built into a component library, which stores components that can be dragged or selected directly during form design and modification for use by the editor and front-end browser.

[0045] When creating a target form, components from the component library can be displayed on the system. Users can select (by clicking, double-clicking, or dragging) the desired components to confirm the selected form component. Each component has its own configuration information. This configuration information can be stored in the component library along with the corresponding component, or it can be stored in a separate database. A unique identifier can be set for each component and its configuration information to determine the corresponding configuration information from the database. Based on this, after selecting a form component, the selection configuration information for each selected form component can be retrieved from the component library or the database.

[0046] Since the component's configuration information reflects its structure and how the page is displayed, the target form can be generated based on the selected configuration information. The system's compiler can then compile the component's configuration information into a data structure (such as the DOM structure) that can be rendered and displayed in the browser.

[0047] Step 102: Obtain the editing data for the target form component, wherein the target form component is a form component among the at least one form component.

[0048] In some embodiments, when adjustments to the target form component are required, edit data can be obtained by triggering an edit of the target form component.

[0049] In one optional embodiment, obtaining edit data for the target form component includes: In response to an editing operation on the target form component in the canvas preview area, the target configuration information corresponding to the target form component is displayed; In response to the editing operation on the target configuration information, the edited target configuration information is determined to be the edited data.

[0050] In some embodiments, when it is necessary to adjust the target form component, the target form component can be selected directly in the canvas preview area to trigger the editing operation on it, thereby displaying the target configuration information of the target form component, so as to adjust the target form component by editing the target configuration information.

[0051] Editing operations on the target form component can be triggered by double-clicking, right-clicking the target form component, etc.

[0052] Users can edit the target form component in the displayed target configuration information, such as modifying the target configuration information of the target form component. This target configuration information includes the target form component's appearance configuration information (used to determine the component's inherent identifier, appearance, and basic characteristics; this is a prerequisite for the component to be recognized and initially used, and does not involve complex functional logic), functional rule configuration information (used to set the component's behavioral logic, triggering conditions, and data processing methods; directly determining the component's functional scope and operating rules), and association adaptation configuration information (used to solve the component's interaction adaptation problems with other components, ensuring that the component can integrate into the overall environment rather than running in isolation), etc.

[0053] By responding to editing operations based on target configuration information, the edited data can be displayed in real time in the canvas preview area, enabling users to preview while editing and allowing them to know the effect of the edit in a timely manner, thus improving editing efficiency.

[0054] For example, taking an insurance policy as the target form, the target form component is the homepage banner, and the target configuration information includes the homepage banner image. The editing operation can be to upload a new homepage banner image to replace the old homepage banner image, and the corresponding edit data is the new homepage banner image. The editing operation can also add a new homepage banner image, and the corresponding edit data is the old homepage banner image and the new homepage banner image.

[0055] In an optional embodiment, before obtaining the edit data for the target form component, the method further includes: The component editing area is used to display the configuration information corresponding to the form component; the canvas preview area and the component editing area are different areas within the same canvas. The step of obtaining the edit data for the target form component includes: In response to the editing operation of the target configuration information of the target form component in the component editing area, the edited target configuration information is determined to be the edited data, and the canvas preview area and the component editing area are different areas in the same canvas.

[0056] In some embodiments, after the target form is rendered in the canvas preview area, the configuration information of the form components displayed in the canvas preview area can be displayed in the component editing area. When it is necessary to adjust the target form component, the target configuration information of the target form component can be directly selected in the component editing area for editing, so as to adjust the target form component by editing the target configuration information.

[0057] Understandably, users can also find the target form component that needs to be adjusted in the component editing area. If the target form component is not displayed in the canvas preview area, the canvas preview area will adjust to display the target form component after the user triggers the editing operation on the target form component, so as to achieve editing and previewing at the same time.

[0058] For example, the canvas preview area and component editing area can be referenced. Figure 2 The setup shown displays the target form in the canvas preview area and the target configuration information in the component editing area.

[0059] The editing operations for the target configuration information can be referred to the relevant embodiments mentioned above, and will not be repeated here.

[0060] Step 103: Render the edited data in the canvas preview area.

[0061] In some embodiments, the edited data is rendered in the canvas preview area, thereby enabling real-time preview during the editing of the target form without waiting for publication and online release. Page corrections also require republishing the code, thus reducing the cost of modification.

[0062] In an optional embodiment, after rendering the edit data in the canvas preview area, the method further includes: The target form or the edited target form is stored as a template form in the template database.

[0063] In some embodiments, if it is determined that the created or edited target form meets the requirements, it can be stored as a template form in a template database so that when there are similar business requirements in the future, it can be directly retrieved from the template database without having to create it again, thus improving efficiency.

[0064] For example, taking an insurance form in the financial sector as the target form, it could be a life insurance policy or a car insurance policy.

[0065] In an optional embodiment, after rendering the edit data in the canvas preview area, the method further includes: The target template form is obtained from multiple template forms in the template database, and the target template form includes multiple fields to be filled in; In response to the user's action of filling in the area to be filled, obtain the filled content; Based on the target template form and the filled-in content, the user's form filling file is generated.

[0066] In some implementations, once the target form is created, it can be displayed on the system for users to select the target form they need. Template forms often have multiple fields to be filled in, which vary depending on the user's input. Filling in the corresponding information in these fields personalizes the form and distinguishes it from other users' submissions.

[0067] For example, when a user wants to purchase a car insurance policy, they can select the desired template form from the template forms according to their needs. Usually, the policy requires the user and vehicle information to be filled in. The user fills in the corresponding information in the fields to be filled in, and after completion, they will receive the corresponding form file, i.e., the policy, and then complete the payment to complete the purchase.

[0068] In an optional embodiment, before generating the user's form completion file based on the target template form and the filled-in content, the method further includes: Verify the accuracy of the information entered; If all fields to be filled have been filled and the filled content has passed verification, then the process of generating the user's form file based on the target template form and the filled content is executed.

[0069] In some embodiments, after obtaining the entered content, it can be validated. Only after successful validation is the form file generated, thus ensuring the validity and accuracy of the form file. The generated form file can then be published and sold as a product.

[0070] The content to be filled in each field must meet the filling rules corresponding to that field, and these rules can be part of the component's configuration information.

[0071] For example, if the field to be filled in is age, the content should be Arabic numerals; if the content is text, the verification will fail.

[0072] The form processing method described in this application, taking the insurance application process as an example, includes the template design stage, the product release stage, and the form filling stage.

[0073] In the template design phase, programmers can abstract the current product into standard processes, components, dynamic forms, and dynamic interfaces, and pre-configure the structured process and component information. During the product release phase, these processes, components, forms, and interfaces can be flexibly combined to achieve personalized product configuration. This eliminates the need for product design, page and process development, and deployment, replacing it with direct deployment after configuration, thus shortening the development cycle and reducing development costs.

[0074] During the product release phase, operations personnel operate within the system. Through a user-friendly visual workflow and page editor, operations personnel can flexibly combine the product's insurance process and page elements to personalize the product. The configuration process and the front-end display process are linked in real time. The content configured by the user can be previewed in real time, providing a WYSIWYG experience. The product is released only after the expected effect is achieved, with 100% accuracy.

[0075] The form filling stage is operated by users. Users access different product pages released during the product launch stage through various channels, and complete the filling of various dynamic forms according to the process nodes of the product. The system will collect the data filled in by users into the system according to the configured forms and interfaces, and then carry out the insurance purchase operation.

[0076] The above process involves a highly standardized and abstract design of insurance products. Product attributes, form structures, page components, and application processes have all undergone rigorous design and testing. Compared with traditional methods, this reduces a significant amount of manual operation during the release process. Regardless of the number of products released, the application process, visual effects, user experience, and data transmission remain consistent and reliable, greatly improving product launch efficiency and shortening the product launch cycle.

[0077] Exemplary System Accordingly, this application also provides a form processing system, including: a compiler, a page previewer, and a control panel; A compiler, used to render the target form in the canvas preview area in response to a preview instruction for the target form; A page previewer is used to display at least one form component of the target form in the canvas preview area; A control panel is used to obtain editing data for a target form component, wherein the target form component is a form component among the at least one form components; The page previewer is also used to render the edited data in the canvas preview area.

[0078] The compiler is used to compile structured page data into a DOM structure that can be rendered and displayed in the browser. Both the editor and the browser need to use the compiler. In the editor, the compiler combines components and sample business data to generate a DOM structure for real-time preview; in the browser, the compiler combines components and real business data to generate a DOM structure for display.

[0079] The page previewer calls the compiler to render the configuration information of page components set by the operations staff into a page that is consistent with the effect seen by the front-end user, allowing the operations staff to preview the page effect in real time when configuring the page.

[0080] The control panel is an area where operations personnel can manage page flow, page structure, and page component configuration. These configurations are displayed in real time through a previewer, making the configuration WYSIWYG and highly consistent with the actual page seen by users after publication, thus achieving the goal of configuring and quickly publishing the product.

[0081] Specifically, when a user (operation staff) enters the editor, the editor will connect each component to its corresponding control panel component through the store (data connector). Once the page preview is rendered in the canvas preview area, the user can make fine-tuning modifications to the page through the control panel. The modified content will be rendered in the canvas preview area in real time. When the page meets expectations, the product can be published and sold.

[0082] The control panel and the canvas are linked in two directions; see [link / reference]. Figure 3 When a user interacts with the control panel, the data generated by the interaction is written to the store. The compiler in the canvas preview area listens for changes in the data and renders the page onto the canvas in conjunction with the web components. When a user clicks on a component in the canvas preview area, an event is sent to the control panel. The control panel compiler finds the corresponding control panel component through the component mapping relationship and expands it for the user to interact with.

[0083] Further, see Figure 4 The form processing system also includes at least one of the following: a front-end component library, a Redis caching system, a MongoDB database, a client compiler, a form validator, a MySQL database system, and an API interface.

[0084] The front-end component library modularly encapsulates the components of a page, including various commonly used front-end components such as images, text, forms, and buttons. The component library is available for use by both the editor and the front-end browser.

[0085] The Redis caching system is used to store frequently accessed page structure data. When the page previewer in the editor or the client browser needs to use the page structure data, it retrieves this initialization structure data from the Redis cache, reducing database pressure.

[0086] The MongoDB database is used to store structured page data from different process nodes of various products, which is then used by the compiler to compile into a visible page structure in conjunction with component libraries.

[0087] The client-side compiler calls the backend API to obtain page structure data and business data for each process node of different products. In conjunction with the component library, it generates page content and forms for users to use. Users can complete the insurance application process by browsing the content and filling in the forms.

[0088] A form validator is a standardized validation logic that abstracts various types of fields and provides a unified validation framework for different forms. It is used to verify whether the content entered by the user is correct and whether the current form meets the submission requirements.

[0089] The MySQL database system is used to store business data for each product. This data is provided to the client's compiler to generate dynamic forms for different products, which users can fill out and the forms can be validated.

[0090] The API interface is divided into a page editor interface and a client interface, which are used to upload and download data between the front-end and back-end of the editor, driving the operation of the entire system.

[0091] The form processing system provided in this embodiment belongs to the same application concept as the form processing method provided in the above embodiments of this application. It can execute the method provided in any of the above embodiments of this application and has the corresponding functional modules and beneficial effects of the method. Technical details not described in detail in this embodiment can be found in the specific processing content of the form processing method provided in the above embodiments of this application, and will not be repeated here.

[0092] The functions implemented by each functional unit in the above form processing system can be implemented by the same or different processors, and this application embodiment does not limit this.

[0093] It should be understood that the functional units in the above system can be implemented by the processor calling software. For example, the system includes a processor connected to memory, which stores instructions. The processor calls the instructions stored in memory to implement any of the above methods or to implement the functions of each unit in the system. The processor can be a general-purpose processor, such as a CPU or microprocessor, and the memory can be internal or external to the system. Alternatively, the units in the system can be implemented as hardware circuits. By designing the hardware circuits, some or all of the unit functions can be implemented. The hardware circuit can be understood as one or more processors. For example, in one implementation, the hardware circuit is an ASIC, and the functions of some or all of the above units are implemented by designing the logical relationships between the components within the circuit. In another implementation, the hardware circuit can be implemented by a PLD, such as an FPGA, which can include a large number of logic gates. The connection relationships between the logic gates are configured through configuration files to implement the functions of some or all of the above units. All units in the above system can be implemented entirely by the processor calling software, entirely by hardware circuits, or partially by the processor calling software with the remaining parts implemented by hardware circuits.

[0094] In this application embodiment, a processor is a circuit with signal processing capabilities. In one implementation, the processor can be a circuit with instruction reading and execution capabilities, such as a CPU, microprocessor, GPU, or DSP. In another implementation, the processor can implement certain functions through the logical relationships of hardware circuits. These logical relationships are fixed or reconfigurable. For example, the processor may be a hardware circuit implemented as an ASIC or PLD, such as an FPGA. In a reconfigurable hardware circuit, the process of the processor loading a configuration document and configuring the hardware circuit can be understood as the processor loading instructions to implement the functions of some or all of the above units. Furthermore, it can also be a hardware circuit designed for artificial intelligence, which can be understood as an ASIC, such as an NPU, TPU, or DPU.

[0095] As can be seen, each unit in the above system can be one or more processors (or processing circuits) configured to implement the above methods, such as: CPU, GPU, NPU, TPU, DPU, microprocessor, DSP, ASIC, FPGA, or a combination of at least two of these processor types.

[0096] Furthermore, the units in the above systems can be integrated in whole or in part, or they can be implemented independently. In one implementation, these units are integrated together and implemented in the form of a System-on-Chip (SoC). This SoC may include at least one processor for implementing any of the above methods or implementing the functions of the units in the system. The at least one processor can be of different types, such as CPU and FPGA, CPU and AI processor, CPU and GPU, etc.

[0097] Exemplary electronic devices Another embodiment of this application also provides an electronic device, see [link to relevant documentation] Figure 5 As shown, the device includes: Memory 500 and processor 510; The memory 500 is connected to the processor 510 and is used to store programs; The processor 510 is configured to implement the form processing method disclosed in any of the above embodiments by running the program stored in the memory 500.

[0098] Specifically, the above-mentioned form processing device may also include: a bus, a communication interface 530, an input device 530, and an output device 540.

[0099] The processor 510, memory 500, communication interface 530, input device 530, and output device 540 are interconnected via a bus. Among them: A bus can include a pathway for transmitting information between various components of a computer system.

[0100] The processor 510 can be a general-purpose processor, such as a general-purpose central processing unit (CPU), a microprocessor, etc., or an application-specific integrated circuit (ASIC), or one or more integrated circuits used to control the execution of the program of the present invention. It can also be a digital signal processor (DSP), an application-specific integrated circuit (ASIC), an off-the-shelf programmable gate array (FPGA), or other programmable logic devices, discrete gate or transistor logic devices, or discrete hardware components.

[0101] The processor 510 may include a main processor, as well as a baseband chip, modem, etc.

[0102] The memory 500 stores a program that executes the technical solution of this invention, and may also store an operating system and other key business functions. Specifically, the program may include program code, which includes computer operation instructions. More specifically, the memory 500 may include read-only memory (ROM), other types of static storage devices capable of storing static information and instructions, random access memory (RAM), other types of dynamic storage devices capable of storing information and instructions, disk storage, flash memory, etc.

[0103] Input device 530 may include a device for receiving user input data and information, such as a keyboard, mouse, camera, scanner, light pen, voice input device, touch screen, pedometer, or gravity sensor.

[0104] Output device 540 may include devices that allow information to be output to a user, such as a display screen, printer, speaker, etc.

[0105] The communication interface 530 may include a device that uses any transceiver to communicate with other devices or communication networks, such as Ethernet, Radio Access Network (RAN), Wireless Local Area Network (WLAN), etc.

[0106] The processor 510 executes the program stored in the memory 500 and calls other devices, which can be used to implement the various steps of any form processing method provided in the above embodiments of this application.

[0107] Exemplary computer program products and storage media In addition to the methods and devices described above, embodiments of this application may also be computer program products, which include computer program instructions that, when executed by a processor, cause the processor to perform the steps in the form processing methods according to various embodiments of this application as described in any of the foregoing embodiments of this specification.

[0108] The computer program product can be written in any combination of one or more programming languages ​​to perform the operations of the embodiments of this application. The programming languages ​​include object-oriented programming languages ​​such as Java and C++, as well as conventional procedural programming languages ​​such as C or similar languages. The program code can be executed entirely on the user's computing device, partially on the user's computing device, as a standalone software package, partially on the user's computing device and partially on a remote computing device, or entirely on a remote computing device or server.

[0109] Furthermore, embodiments of this application may also be storage media storing a computer program, which is executed by a processor to perform the steps of the form processing methods according to various embodiments of this application described in any of the above embodiments of this specification, specifically implementing the following steps: In response to a preview command for a target form, the target form is rendered in a canvas preview area to display at least one form component of the target form in the canvas preview area. Obtain edit data for a target form component, wherein the target form component is a form component among the at least one form components; The edited data is rendered in the canvas preview area.

[0110] For the foregoing method embodiments, in order to simplify the description, they are all described as a series of actions. However, those skilled in the art should understand that this application is not limited to the described order of actions, because according to this application, some steps can be performed in other orders or simultaneously. Furthermore, those skilled in the art should also understand that the embodiments described in the specification are all preferred embodiments, and the actions and modules involved are not necessarily essential to this application.

[0111] It should be noted that the various embodiments in this specification are described in a progressive manner, with each embodiment focusing on the differences from other embodiments. Similar or identical parts between embodiments can be referred to interchangeably. For apparatus embodiments, since they are basically similar to method embodiments, the description is relatively simple; relevant parts can be referred to the descriptions in the method embodiments.

[0112] The steps in the methods of the various embodiments of this application can be adjusted, merged, or deleted in order according to actual needs, and the technical features described in each embodiment can be replaced or combined.

[0113] The modules and sub-modules in the apparatus and terminal in the various embodiments of this application can be merged, divided, and deleted according to actual needs.

[0114] It should be understood that the disclosed terminals, devices, and methods can be implemented in other ways, given the several embodiments provided in this application. For example, the terminal embodiments described above are merely illustrative. For instance, the division of modules or sub-modules is only a logical functional division, and in actual implementation, there may be other division methods. For example, multiple sub-modules or modules may be combined or integrated into another module, or some features may be ignored or not executed. Furthermore, the coupling or direct coupling or communication connection shown or discussed may be indirect coupling or communication connection through some interfaces, devices, or modules, and may be electrical, mechanical, or other forms.

[0115] The modules or submodules described as separate components may or may not be physically separate. The components that constitute a module or submodule may or may not be physical modules or submodules; that is, they may be located in one place or distributed across multiple network modules or submodules. Some or all of the modules or submodules can be selected to achieve the purpose of this embodiment's solution, depending on actual needs.

[0116] Furthermore, the functional modules or sub-modules in the various embodiments of this application can be integrated into one processing module, or each module or sub-module can exist physically separately, or two or more modules or sub-modules can be integrated into one module. The integrated modules or sub-modules described above can be implemented in hardware or in the form of software functional modules or sub-modules.

[0117] Those skilled in the art will further recognize that the units and algorithm steps of the various examples described in conjunction with the embodiments disclosed herein can be implemented in electronic hardware, computer software, or a combination of both. To clearly illustrate the interchangeability of hardware and software, the components and steps of the various examples have been generally described in terms of functionality in the foregoing description. Whether these functions are implemented in hardware or software depends on the specific application and design constraints of the technical solution. Those skilled in the art can use different methods to implement the described functions for each specific application, but such implementation should not be considered beyond the scope of this application.

[0118] The steps of the methods or algorithms described in conjunction with the embodiments disclosed herein can be implemented directly by hardware, a software unit executed by a processor, or a combination of both. The software unit can be located in random access memory (RAM), main memory, read-only memory (ROM), electrically programmable ROM, electrically erasable programmable ROM, registers, hard disk, removable disk, CD-ROM, or any other form of storage medium known in the art.

[0119] Finally, it should be noted that in this document, relational terms such as "first" and "second" are used only to distinguish one entity or operation from another, and do not necessarily require or imply any such actual relationship or order between these entities or operations. Furthermore, the terms "comprising," "including," or any other variations thereof are intended to cover non-exclusive inclusion, such that a process, method, article, or apparatus that comprises a list of elements includes not only those elements but also other elements not expressly listed, or elements inherent to such a process, method, article, or apparatus. Without further limitations, an element defined by the phrase "comprising one..." does not exclude the presence of other identical elements in the process, method, article, or apparatus that includes said element.

[0120] The above description of the disclosed embodiments enables those skilled in the art to make or use this application. Various modifications to these embodiments will be readily apparent to those skilled in the art, and the general principles defined herein may be implemented in other embodiments without departing from the spirit or scope of this application. Therefore, this application is not to be limited to the embodiments shown herein, but is to be accorded the widest scope consistent with the principles and novel features disclosed herein.

Claims

1. A method for processing forms, characterized in that, include: In response to a preview command for a target form, the target form is rendered in a canvas preview area to display at least one form component of the target form in the canvas preview area. Obtain edit data for a target form component, wherein the target form component is a form component among the at least one form components; The edited data is rendered in the canvas preview area.

2. The method according to claim 1, characterized in that, Retrieve edit data for the target form component, including: In response to an editing operation on the target form component in the canvas preview area, the target configuration information corresponding to the target form component is displayed; In response to the editing operation on the target configuration information, the edited target configuration information is determined to be the edited data.

3. The method according to claim 1, characterized in that, Before retrieving edit data from the target form component, the following steps are also included: The component editing area is used to display the configuration information corresponding to the form component; the canvas preview area and the component editing area are different areas within the same canvas. The step of obtaining the edit data for the target form component includes: In response to the editing operation of the target configuration information of the target form component in the component editing area, the edited target configuration information is determined to be the edited data, and the canvas preview area and the component editing area are different areas in the same canvas.

4. The method according to claim 1, characterized in that, Prior to the preview instruction for the target form, it also includes: In response to the selection of any candidate component in the component library, determine the selected form component; Obtain the selection configuration information corresponding to the selected form component; The target form is generated based on the selected configuration information.

5. The method according to claim 1 or 4, characterized in that, After rendering the edited data in the canvas preview area, the process also includes: The target form or the edited target form is stored as a template form in the template database.

6. The method according to claim 1, characterized in that, After rendering the edited data in the canvas preview area, the process also includes: The target template form is obtained from multiple template forms in the template database, and the target template form includes multiple fields to be filled in; In response to the user's action of filling in the area to be filled, obtain the filled content; Based on the target template form and the filled-in content, the user's form filling file is generated.

7. The method according to claim 6, characterized in that, Before generating the user's form completion file based on the target template form and the filled content, the method further includes: Verify the accuracy of the information entered; If all fields to be filled have been filled and the filled content has passed verification, then the process of generating the user's form file based on the target template form and the filled content is executed.

8. A form processing system, characterized in that, include: Compiler, page previewer, and control panel; A compiler, used to render the target form in the canvas preview area in response to a preview instruction for the target form; A page previewer is used to display at least one form component of the target form in the canvas preview area; A control panel is used to obtain editing data for a target form component, wherein the target form component is a form component among the at least one form components; The page previewer is also used to render the edited data in the canvas preview area.

9. An electronic device, characterized in that, Including memory and processor; The memory is connected to the processor and is used to store programs; The processor is used to implement the form processing method as described in any one of claims 1 to 7 by running a program in the memory.

10. A storage medium, characterized in that, The storage medium stores a computer program, which, when executed by a processor, implements the form processing method as described in any one of claims 1 to 7.

Images