Configuration-based middle table layout method

Through the configured middle-end layout method, the editor generates schema and renders the page through the parser, supporting component expansion and code injection, solving the problems of low development efficiency and difficult component maintenance in the existing technology, and achieving efficient development and Stable component management.

CN119201267APending Publication Date: 2024-12-27BEIJING LONGJU YIXING TECH CO LTD
View PDF 0 Cites 0 Cited by

Patent Information

Application Number
CN202411222005.9
Authority / Receiving Office
CN · China
Patent Type
Applications(China)
Current Assignee / Owner
Filing Date
2024-09-02
Publication Date
2024-12-27

AI Technical Summary

Technical Problem

The existing middle-end layout method is based on the UI library to write pages, which makes developers time-consuming and inefficient, making business components difficult to maintain, and the page level cannot be improved through business components, especially when list pages and interactions are similar but fields are inconsistent.

Method used

It adopts a configuration-based middle-end layout method, generates schema through the editor, and renders pages by the parser, and supports plug-in forms of general components and business components, allowing component expansion and code injection, realizing visual configuration and flexible customization of the page.

Benefits of technology

It reduces time-consuming for developers on common pages, improves development efficiency, stabilizes component size, simplifies maintenance, and avoids the problem of logical confusion as required changes.

✦ Generated by Eureka AI based on patent content.

Smart Images

  • Figure CN119201267A_ABST
    Figure CN119201267A_ABST
Patent Text Reader

Abstract

The invention provides a middle table layout method based on configuration. The middle table layout method comprises the following steps that S1, an editor generates schema for a universal page in a visual mode; s2, realizing that a schema rendering page is parsed by a parser; s3, a universal component and a service component are built in in a plug-in mode, the components can be expanded for specific requirements, and the components do not influence each other; s4, code injection is supported, and a special scene can be flexibly customized; the time consumed by developers on a general page is reduced through configuration, the development efficiency is improved, the internal logic is not disordered as required, the size of the component is stabilized, and the maintenance is simple and convenient.
Need to check novelty before this filing date? Find Prior Art

Description

Technical Field

[0001] The present invention relates to the field of computer technology, and in particular to a configuration-based middle platform layout method. Background Art

[0002] The middle-office layout is an enterprise-level technical architecture and strategic decision, which involves multiple levels of the enterprise such as organizational structure, business processes, and technical architecture. Its main purpose is to improve the business efficiency and innovation capabilities of the enterprise.

[0003] At present, the layout of the middle platform is still relatively traditional. Pages are written based on the UI library. There are a large number of similar pages, and the layout and interaction are relatively fixed. These development tasks are time-consuming and inefficient. The defects and shortcomings of the existing technology are:

[0004] 1. Developers will encapsulate business components to improve development efficiency. Business components can be reused to a certain extent, but as requirements change, the internal logic becomes chaotic, and the components become bulky and difficult to maintain.

[0005] 2. Business components cannot be used to improve page efficiency. For example, most list pages have similar display and interaction, and inconsistent fields cannot be improved through business components. Therefore, a configuration-based middle-end layout method is proposed. Summary of the invention

[0006] In view of this, an embodiment of the present invention hopes to provide a configuration-based middle platform layout method to solve or alleviate the technical problems existing in the prior art, and at least provide a beneficial option.

[0007] The technical solution of the embodiment of the present invention is implemented as follows: a configuration-based middle platform layout method comprises the following steps:

[0008] S1. The editor generates schema for common pages in a visual way;

[0009] S2. Implement a parser to parse the schema and render the page;

[0010] S3, general components and business components are built in as plug-ins, and components can be expanded to meet specific needs without affecting each other;

[0011] S4. Supports code injection and can be flexibly customized for special scenarios.

[0012] In some embodiments, in S1, the editor end is divided into materials, panels and attributes. Select the material to the panel, and edit the corresponding attributes in the panel, which includes editing the UI and business attributes of the material. After editing, a description information is obtained as a schema.

[0013] In some embodiments, in S2, the parser renders the schema obtained in S1 to form information describing the page configuration, where the page configuration information includes UI, interaction, and business logic.

[0014] In some embodiments, the parser uses an engine to work, which dynamically renders materials to the page according to different types of attributes, verifies rules and logic from UI to interaction, and supports code insertion to facilitate the processing of specific logic.

[0015] In some embodiments, in the S3, the most basic general components and business components are materials, which are divided into two categories: atoms and containers. Containers are nested atoms to support deep nesting.

[0016] In actual development, materials will be used in multiple pages. Directly modifying the parameters of the materials will increase the test scope, which may easily lead to missed cases.

[0017] In some embodiments, in the S3, materials are registered in the business component in the form of plug-ins. When materials do not meet the requirements, existing materials can be inherited and expanded into a new material, thereby avoiding uncontrollable situations.

[0018] In some embodiments, in the S4, code injection is supported, and special scenarios can flexibly customize the attribute editing to add specific business logic and verification rules to materials and pages. In order to meet the sass scenario business, it supports inserting code editing into the attributes to facilitate the expansion of complex logic.

[0019] The embodiment of the present invention has the following advantages due to the adoption of the above technical solution:

[0020] The present invention reduces the time spent by developers on general pages through configuration, improves development efficiency, does not cause internal logic to become chaotic as requirements change, stabilizes the size of components, and facilitates maintenance.

[0021] The above summary is for illustrative purposes only and is not intended to be limiting in any way. In addition to the illustrative aspects, embodiments and features described above, further aspects, embodiments and features of the present invention will be readily apparent by reference to the accompanying drawings and the following detailed description. BRIEF DESCRIPTION OF THE DRAWINGS

[0022] In order to more clearly illustrate the embodiments of the present application or the technical solutions in the prior art, the drawings required for use in the embodiments or technical descriptions will be briefly introduced below. Obviously, the drawings described below are only some embodiments of the present application. For ordinary technicians in this field, other drawings can be obtained based on these drawings without paying creative work.

[0023] Figure 1 is a flow chart of the present invention;

[0024] Figure 2 is a schematic diagram of an editor of the present invention;

[0025] Figure 3 A schematic diagram of supporting code insertion according to the present invention. DETAILED DESCRIPTION

[0026] In the following, only some exemplary embodiments are briefly described. As those skilled in the art will appreciate, the described embodiments may be modified in various ways without departing from the spirit or scope of the present invention. Therefore, the drawings and descriptions are considered to be exemplary and non-restrictive in nature.

[0027] It should be noted that the terms "first", "second", "symmetrical", "array", etc. are only used to distinguish between description and position description purposes, and cannot be understood as indicating or implying relative importance or implicitly indicating the number of the indicated technical features. Therefore, the definition of "first", "symmetrical", etc. can explicitly or implicitly include one or more of these features; similarly, when the quantity of certain features is not limited in the form of words such as "two" or "three", it should be noted that this feature also explicitly or implicitly includes one or more feature quantities;

[0028] In the present invention, unless otherwise clearly specified and limited, the terms such as "installation", "connection", "fixation" and the like should be understood in a broad sense; for example, it can be a fixed connection, a detachable connection, or an integral molding; it can be a mechanical connection, a direct connection, welding, or an indirect connection through an intermediate medium, or it can be the internal connection of two elements or the interaction relationship between two elements. For ordinary technicians in this field, the specific meanings of the above terms in the present invention can be understood based on the description and drawings combined with specific circumstances.

[0029] The embodiments of the present invention are described in detail below with reference to the accompanying drawings.

[0030] like Figure 1-Figure 3 As shown, an embodiment of the present invention provides a configuration-based middle platform layout method, comprising the following steps:

[0031] S1. The editor generates schema for common pages in a visual way;

[0032] S2. Implement a parser to parse the schema and render the page;

[0033] S3, general components and business components are built in as plug-ins, and components can be expanded to meet specific needs without affecting each other;

[0034] S4. Supports code injection and can be flexibly customized for special scenarios.

[0035] In this embodiment, specifically, in S1, the editor end is divided into materials, panels and attributes. Select the material to the panel, and edit the corresponding attributes in the panel, including editing the UI and business attributes of the material. After editing, a description information is obtained as a schema. Through the above settings in the editor, the material may refer to a collection of various functions and elements supported by the editor, which can be used to create, edit and manage content.

[0036] Depending on the editor, materials may include:

[0037] Text editing functions: such as font, font size, color, bold, italic, etc.

[0038] Content structure: such as titles, paragraphs, lists, quotes, etc.

[0039] Media embedding: such as pictures, videos, audio, etc.

[0040] Links & Anchors: Create hyperlinks and anchor links.

[0041] Tables and Charts: Create and edit tables and charts.

[0042] Styles and Formatting: Apply different styles and formats, such as background color, borders, alignment, etc.

[0043] Scripts and Macros: Run scripts or macros to automate certain tasks.

[0044] Components and templates: pre-made components or templates that can be quickly inserted into content;

[0045] In an editor, a panel is an interface element that is typically used to display and control information, settings, and tools related to the editor's functionality;

[0046] In an editor, properties generally refer to a set of settings and characteristics associated with an element selected in the editor. These properties can include, but are not limited to, the following:

[0047] Style attributes:

[0048] Including font, font size, color, background color, alignment, line height, margin and padding, etc.

[0049] These attributes are used to control the appearance and formatting of an element.

[0050] Content attributes:

[0051] Including text content, image source, video source, link address, etc.

[0052] These attributes are used to define the intrinsic content or data of an element.

[0053] Structural properties:

[0054] Including headings, paragraph levels, list types, citation styles, etc.

[0055] These attributes are used to define the position and role of an element in the document structure.

[0056] Behavioral attributes:

[0057] Including event handling (such as click, mouse hover, etc.), animation effects, data binding, etc.

[0058] These properties are used to define how an element behaves and interacts.

[0059] Data attributes:

[0060] Includes data-related properties such as data binding, data source, data format, etc.

[0061] These attributes are used to handle operations and presentation related to the data.

[0062] Context properties:

[0063] These attributes are related to the context in which the element is used. For example, in a table editor, there may be attributes for rows, columns, and cells.

[0064] Device properties:

[0065] Display and function settings for different devices (such as mobile phones, tablets, and desktop computers).

[0066] These properties are used to adapt to different devices and screen sizes.

[0067] In this embodiment, specifically, some key points of editing the UI and business attributes of materials are as follows:

[0068] UI properties:

[0069] layout:

[0070] Editorial materials should have a logical layout so that users can understand and operate them easily.

[0071] The layout needs to take accessibility and internationalization into consideration.

[0072] style:

[0073] Including color, font, size, margin, padding, etc. to provide a good visual effect.

[0074] The style should be customizable to suit different design styles and brand requirements.

[0075] Interaction:

[0076] The user's interaction with edited materials should be intuitive and responsive.

[0077] It includes input verification, feedback mechanism (such as prompt information in the input box), dynamic effects (such as dragging, expanding and shrinking, etc.).

[0078] Input Control:

[0079] Make sure users can easily enter, edit, and clear content.

[0080] For different types of editing materials, provide appropriate input controls such as text fields, radio buttons, check boxes, etc.

[0081] Error handling:

[0082] Provide clear error prompts and guidance when user input is incorrect or does not meet requirements.

[0083] Include visual feedback for error conditions and interactive steps to help users correct errors.

[0084] Business attributes:

[0085] Functional consistency:

[0086] Editing materials should provide a consistent interactive experience to reduce users' learning costs.

[0087] Ensure that the editing material functions and operation methods are consistent in the same business scenario.

[0088] Data Binding:

[0089] Editorial materials should be able to be synchronized with backend data sources or other editorial materials to reflect the latest business status.

[0090] Provides a data binding interface or mechanism to support dynamic updates and data validation.

[0091] Business rules:

[0092] Editing materials should support the implementation of business rules, such as input restrictions, data format requirements, complex queries, etc.

[0093] These rules can be validated via the backend or implemented on the frontend to ensure data accuracy and integrity.

[0094] Flexibility and scalability:

[0095] Editorial materials should be designed so that new features can be easily added or modified to accommodate changes in business requirements.

[0096] Provides extension points or a plugin system that allows developers to customize the behavior and functionality of editing materials.

[0097] Security:

[0098] Editing materials should ensure the security of user input to prevent malicious input and data leakage.

[0099] Including security measures such as input verification, data encryption, and access control.

[0100] In this embodiment, schema has different meanings. The following are some common meanings:

[0101] Data structure or pattern:

[0102] In computer science and data science, schema refers to the structure or pattern in a data model that defines how data is stored, organized, and related to each other. For example, in a database, the schema defines the structure of a table, including column names, data types, constraints, etc.

[0103] Semantic structure:

[0104] In the semantic web and knowledge graph, schema is a semantic structure used to represent entities, attributes, and relationships between entities. It helps machines understand and process data and enhances the semantic expression of data by defining vocabulary and rules.

[0105] Metadata:

[0106] In information architecture, schema can refer to a set of metadata that describes the data and is used to provide information about the data, such as its source, format, creation time, etc.

[0107] XML Schema:

[0108] In XML (Extensible Markup Language), a schema is an XML file that defines the structure and content of an XML document. It specifies which elements can appear in a document, as well as their attributes and types.

[0109] Patterns in programming languages:

[0110] In some programming languages, schema can refer to a pattern or template that defines the shape or structure of data, such as type annotations or type hints in Python.

[0111] User Interface Design:

[0112] In user interface design, schema can refer to a design prototype or layout template that defines the structure of the user interface, its components, and their relationships.

[0113] Configuration Files:

[0114] In software configuration, a schema can refer to a set of rules or structure that defines parameters, settings, and their values ​​in a configuration file.

[0115] In this embodiment, specifically, in S2, the parser renders the schema obtained in S1 to form information describing the page configuration, and the page configuration information includes UI, interaction and business logic.

[0116] In this embodiment, specifically, the parser uses an engine to work, which dynamically renders materials to the page according to different types of attributes, verifies rules and logic from UI to interaction, and supports code insertion to facilitate the processing of specific logic.

[0117] In this embodiment, specifically, in S3, the most basic general components and business components are materials, which are divided into two categories, atoms and containers. Containers are nested atoms to support deep nesting;

[0118] In actual development, materials will be used in multiple pages. Directly modifying the parameters of the materials will increase the test scope, which may easily lead to missed cases.

[0119] In this embodiment, specifically, in S3, materials are registered in the business component in the form of plug-ins. When materials do not meet the requirements, existing materials can be inherited and expanded into a new material, thereby avoiding uncontrollable situations.

[0120] In this embodiment, specifically, in S4, code injection is supported, and special scenarios can flexibly customize the attribute editing to add specific business logic and verification rules to materials and pages. In order to meet the sass scenario business, it supports inserting code editing into the attributes to facilitate the expansion of complex logic.

[0121] In the present embodiment, specifically, for those skilled in the art, it can be further realized that the units and algorithm steps of each example described in conjunction with the embodiments disclosed herein can be implemented in electronic hardware, computer software, or a combination of the two. In order to clearly illustrate the interchangeability of hardware and software, the composition and steps of each example have been generally described in the above description according to the function. Whether these functions are performed in hardware or software depends on the specific application and design constraints of the technical solution. Professional and technical personnel can use different methods to implement the described functions for each specific application, but such implementation should not be considered to be beyond the scope of the present invention.

[0122] At the same time, those skilled in the art can understand that all or part of the processes in all the above-mentioned embodiments can be completed by instructing the relevant hardware through a computer program, and the computer program can be stored in a non-volatile computer-readable storage medium. When the computer program is executed, it can include the processes of the embodiments of the above-mentioned methods. Among them, any reference to memory, storage, database or other media provided in this application and used in the embodiments may include non-volatile and / or volatile memory. Non-volatile memory may include read-only memory (ROM), programmable ROM (PROM), electrically programmable ROM (EPROM), electrically erasable programmable ROM (EEPROM) or flash memory. Volatile memory may include random access memory (RAM) or external cache memory. By way of illustration and not limitation, RAM is available in many forms, such as static RAM (SRAM), dynamic RAM (DRAM), synchronous DRAM (SDRAM), double data rate SDRAM (SSRSDRAM), enhanced SDRAM (ESDRAM), synchronous link DRAM (SLDRAM), RAMbus direct RAM (RDRAM), direct RAMbus dynamic RAM (DRDRAM), and RAMbus dynamic RAM (RDRAM), etc.

[0123] In this embodiment, specifically, it can be implemented in whole or in part by software, hardware, firmware or any other combination. When implemented by software, the above embodiments can be implemented in whole or in part in the form of computer program goods;

[0124] When the computer instruction or computer program is loaded or executed on a computer, the process or function described in the embodiment of the present application is generated in whole or in part. The computer can be a general-purpose computer, a special-purpose computer, a computer network, or other programmable devices. The computer instruction can be stored in a computer-readable storage medium, or transmitted from a computer-readable storage medium to another computer-readable storage medium. For example, the computer instruction can be transmitted from a website site, a computer, a server, or a data center to another website site, a computer, a server, or a data center by wired or wireless (such as infrared, wireless, microwave, etc.). The computer-readable storage medium can be any available medium that a computer can access or a data storage device such as a server, a data center, etc. that contains one or more available media sets. The available medium can be a magnetic medium (for example, a floppy disk, a hard disk, a tape), an optical medium (for example, a DVD), or a semiconductor medium. The semiconductor medium can be a solid-state hard disk.

[0125] It should be understood that in the various embodiments of the present application, the size of the serial numbers of the above-mentioned processes does not mean the order of execution. The execution order of each process should be determined by its function and internal logic, and should not constitute any limitation on the implementation process of the embodiments of the present application.

[0126] Those of ordinary skill in the art will appreciate that the units and algorithm steps of each example described in conjunction with the embodiments disclosed herein can be implemented in electronic hardware, or a combination of computer software and electronic hardware. Whether these functions are performed in hardware or software depends on the specific application and design constraints of the technical solution. Professional and technical personnel can use different methods to implement the described functions for each specific application, but such implementation should not be considered to be beyond the scope of this application.

[0127] Those skilled in the art can clearly understand that, for the convenience and brevity of description, the specific working process of the system described above can refer to the corresponding process in the aforementioned method embodiment, and will not be repeated here.

[0128] If the functions are implemented in the form of software functional units and sold or used as independent goods, they can be stored in a computer-readable storage medium. Based on this understanding, the technical solution of the present application, or the part that contributes to the prior art or the part of the technical solution, can be embodied in the form of software goods. The computer software goods are stored in a storage medium, including several instructions for a computer device (which can be a personal computer, server, or network device, etc.) to perform all or part of the steps of the methods described in each embodiment of the present application. The aforementioned storage medium includes: U disk, mobile hard disk, read-only memory (ROM), random access memory (RAM), disk or optical disk, etc., various media that can store program codes.

[0129] In this embodiment, specifically, the parser recursively parses the configuration information as follows:

[0130]

[0131] The above is only a specific embodiment of the present invention, but the protection scope of the present invention is not limited thereto. Any person skilled in the art can easily think of various changes or substitutions within the technical scope disclosed by the present invention, which should be included in the protection scope of the present invention. Therefore, the protection scope of the present invention should be based on the protection scope of the claims.

Claims

1. A configuration-based middle platform layout method, characterized in that: The following steps are involved: S1. The editor generates schema for common pages in a visual way; S2. Implement a parser to parse the schema and render the page; S3, general components and business components are built in as plug-ins, and components can be expanded to meet specific needs without affecting each other; S4. Supports code injection and can be flexibly customized for special scenarios.

2. The configuration-based middle platform layout method according to claim 1 is characterized in that: In S1, the editor side is divided into materials, panels and attributes. Select the material to the panel, and edit the corresponding attributes in the panel, which includes editing the UI and business attributes of the material. After editing, a description information is obtained as a schema.

3. The configuration-based middle platform layout method according to claim 1 is characterized in that: In S2, the parser renders the schema obtained in S1 to form information describing the page configuration, and the page configuration information includes UI, interaction and business logic.

4. The configuration-based middle platform layout method according to claim 3 is characterized in that: The parser uses an engine to work. The engine dynamically renders materials to the page according to different types of attributes, verifies rules and logic from UI to interaction, and supports code insertion to facilitate the processing of specific logic.

5. The configuration-based middle platform layout method according to claim 1 is characterized in that: In S3, the most basic general components and business components are materials. Materials are divided into two categories: atoms and containers. Containers are nested atoms to support deep nesting. In actual development, materials will be used in multiple pages. Directly modifying the parameters of the materials will increase the test scope, which may easily lead to missed cases.

6. The configuration-based middle platform layout method according to claim 1 is characterized in that: In the S3, materials are registered in the business component in the form of plug-ins. When materials are not satisfied, the existing materials can be inherited and expanded into a new material, thereby avoiding uncontrollable situations.

7. The configuration-based middle platform layout method according to claim 1 is characterized in that: In the S4, code injection is supported, and special scenarios can flexibly customize the attribute editing to add specific business logic and verification rules to materials and pages. In order to meet the sass scenario business, it supports inserting code editing into the attributes to facilitate the expansion of complex logic.