A web label editing and printing system and method supporting multi-device adaptation
By designing a layered architecture and a print adapter layer, the label printing system achieves cross-platform compatibility and template reuse, solves the problem of template format incompatibility, reduces printing costs, and improves the maintainability and scalability of the system.
Patent Information
- Authority / Receiving Office
- CN · China
- Patent Type
- Applications(China)
- Current Assignee / Owner
- CHENGDU SHANGSHANG YUNHUI INFORMATION TECH CO LTD
- Filing Date
- 2026-05-14
- Publication Date
- 2026-06-19
AI Technical Summary
In existing technologies, label printing systems suffer from high printing costs due to incompatible template formats and the inability to reuse them across platforms. Furthermore, changing printing service providers requires redesigning templates, which increases maintenance costs.
A web-based label editing and printing system supporting multi-device adaptation was designed. Through a layered architecture consisting of a user interface layer, an editor layer, a unified data model layer, and a print adapter layer, the system achieves business event transformation of label operation behavior and standardization of data format. The print adapter layer is used for format conversion, supporting compatibility with multiple printing platforms and template reuse.
It achieves print compatibility and cross-platform template reuse, reduces printing costs, eliminates the need to maintain multiple templates, and only requires adding an adapter when changing printing service providers, thus improving the maintainability and scalability of the system.
Smart Images

Figure CN122240048A_ABST
Abstract
Description
Technical Field
[0001] This invention belongs to the field of computer software technology, specifically relating to a web tag editing and printing system and printing method that supports multi-device adaptation. Background Technology
[0002] In the e-commerce logistics sector, label printing is mainly achieved in two ways: local printing and cloud printing. Local printing uses a local printer and design software (such as BarTender and Clodop, both of which are barcode label printing software). Cloud printing uses cloud printing service providers (such as Feie Cloud Printing and Kuaimai Cloud Printing). Each printing method provides its own template configuration or API interface, requiring the design of multiple label templates based on the selected printing method.
[0003] In practical applications, each cloud printing vendor has different printing template specifications and data formats, resulting in no single printing vendor being able to support universal templates for multiple cloud printing platforms or local printing. This has the following shortcomings: (1) Printing incompatibility: Feige uses JSON format text instructions, Kuaimai uses XML format CPCL language, and local printing uses JavaScript API calls. Therefore, different printing vendors have completely different printing formats, requiring different printing templates to be designed for different printing formats; (2) Templates cannot be reused across platforms, i.e., templates designed by Feige cannot be used for Kuaimai, and cloud printing templates cannot be used for local printing, which leads to enterprises needing to maintain multiple independent templates when using multiple printing methods; (3) Printing costs are extremely high. Changing printing service providers requires redesigning all templates (i.e., redesigning the data structure), which increases printing costs. Furthermore, when using multiple printing methods, multiple templates need to be maintained, which further increases printing costs. Therefore, based on the aforementioned shortcomings, how to provide a Web tag editing and printing system that supports multi-device adaptation has become an urgent problem to be solved. Summary of the Invention
[0004] The purpose of this invention is to provide a Web tag editing and printing system and method that supports multi-device adaptation, in order to solve the problems of template format incompatibility, inability to reuse templates across platforms, and high printing costs in the prior art.
[0005] To achieve the above objectives, the present invention adopts the following technical solution: Firstly, a web label editing and printing system supporting multi-device adaptation is provided, including: The user interface layer is used to receive user commands for interacting with Web tags; The editor layer is used to listen to the tag operation behavior of the user interface layer in response to the operation instruction, and convert the tag operation behavior into a business event to be sent to the user interface layer; The user interface layer is used to update the Web tag based on the business event, obtain the tag printing basic data, and send the tag printing basic data to the unified data model layer through the editor layer; The unified data model layer is used to standardize the data format of the label printing basic data to obtain standardized label printing data, and then send it to the print adapter layer. The print adapter layer is configured with multiple print adapters for acquiring print instructions and determining the target print format based on the print instructions, so as to match the print adapter corresponding to the target print format from the multiple print adapters; The print adapter layer is also used to call the matched print adapter to convert the standardized label printing data into a print file in the target printing format.
[0006] Based on the above disclosure, the Web tag editing and printing system provided by this invention receives user operation instructions for Web tags through a user interface layer. Then, an editor layer listens to the tag operation behavior of the user interface layer in response to the operation instructions, converts the tag operation behavior into a business event, and sends it to the user interface layer. The user interface layer can then update the Web tags based on this business event to obtain the basic data for tag printing. This data is then sent to a unified data model layer for data format standardization processing to form a unified tag data format. Next, this invention includes a print adapter layer with multiple print adapters. Thus, after the tag data format is unified, the desired printing format can be determined based on the printing command, and a print adapter matching the corresponding format can be selected from the multiple print adapters. Finally, the matched print adapter can be used to convert the tag data format to obtain a print file in the target printing format. Based on this, the unified tag data format can be converted to the printing format of the desired printing manufacturer, thereby completing the printing of the Web tags.
[0007] Through the above design, this invention completely decouples the label design process from the specific printing platform. Specifically, it generates the basic data for printing web labels through a user interface layer and an editor layer. Then, using a unified data model layer, it standardizes the data format to form a unified label data, i.e., generates a unified data template. Next, by setting up an independent print adapter layer with multiple print adapters, it performs format conversion of the unified data template. Different print adapter layers correspond to different printing formats, and each adapter is responsible for converting the unified data format to the format of its corresponding platform. This enables rapid conversion from a unified template to different printing formats. Therefore, this invention uses a unified label data format to convert files to different printing formats, eliminating the need to design different print templates for different printing formats, achieving print compatibility. Furthermore, a single template can be reused across multiple printing platforms, achieving cross-platform template reuse. In addition, it eliminates the need to maintain multiple templates, and changing printing service providers does not require redesigning all templates; only new adapters need to be added. Based on this, printing costs can be reduced.
[0008] In one possible design, the user interface layer includes: a business elements panel, an attributes panel, and a canvas editor; The Business Element panel is used to obtain and execute business element operation commands to select the corresponding business fields from the business field library and display them on the canvas editor to form Web tags. A canvas editor is configured to receive the operation instructions, adjust the canvas elements of the Web tag in response to the operation instructions, open the attribute panel, and set the element attributes of the target field in the Web tag based on the attribute panel, wherein the target field is a business field in the business field library corresponding to the business element operation command.
[0009] In one possible design, the editor layer includes an event handler and a canvas engine, wherein the canvas engine is equipped with a callback machine FabricJS engine; An event handler is used to listen for adjustment operations on the canvas elements of the Web tag in the canvas editor and modification operations on the element attributes of the target field in the attribute panel, so as to use the listened adjustment and modification operations as the tag operation behavior. The event handler is also used to convert the tag operation behavior into a business event, and send the business event to the user interface layer through the callback machine FabricJS engine in the canvas engine, so that the user interface layer updates the canvas element of the web tag and the attribute information of the target field according to the business event, so as to obtain the basic data for tag printing after the update.
[0010] In one possible design, the editor layer further includes an element manager, wherein the element manager is used to store element instances using a mapping table structure, and the element instances are the business fields.
[0011] In one possible design, a unified data model layer is used to standardize the element data structure of the label printing basic data to obtain standardized label structure data. A unified data model layer is used to generate an element list based on the standardized tag structure data; The unified data model layer is also used to generate template metadata and configuration data, and based on the element list, template metadata and configuration data, to generate standardized template structure data, so as to use the standardized template structure data as the standardized label printing data.
[0012] In one possible design, the unified data model layer is used to generate standard basic attributes based on the basic information of elements in the label printing basic data, wherein the basic information of elements includes element unique identifier, element type, element position coordinates and element size; A unified data model layer is used to generate standard visual attributes based on the visual information of elements in the label printing base data, wherein the visual information of elements includes font size, font color and font weight; The unified data model layer is also used to extract the data content from the label printing basic data and generate business field identifiers and unified barcode formats for the data content; The unified data model layer is also used to generate standard business attributes based on data content, business field identifiers, and unified barcode format, and to generate the standardized label structure data using standard business attributes, standard basic attributes, and standard visual attributes.
[0013] In one possible design, each print adapter is configured with a corresponding label template. The print adapter layer is used to call the matched print adapter to perform format conversion on the standardized label printing data to obtain label pre-print data in the target printing format. The print adapter layer is used to call the matched print adapter to perform coordinate transformation on the label pre-printing data to obtain the label printing data. The print adapter layer is also used to obtain a specified label template and call the matched print adapter to inject the label printing data into the specified label template to obtain the print file, wherein the specified label template is the label template corresponding to the matched print adapter.
[0014] In one possible design, the user interface layer further includes a selection operation bar, wherein the selection operation bar is configured with global operation buttons, and the global operation buttons include a label type switching button, a save button, a preview button, and a push print button.
[0015] In one possible design, the user interface layer is also used to send the label printing basic data to the unified data model layer through the editor layer in response to the push print button and the user's human-computer interaction operation, and at the same time generate the print instruction to send the print instruction to the print adapter layer.
[0016] Secondly, a method for editing and printing web tags that supports multi-device adaptation is provided, including: The user interface layer receives user commands to interact with Web tags; The editor layer listens to the tag operation behavior of the user interface layer in response to the operation instruction, and converts the tag operation behavior into a business event to be sent to the user interface layer; Based on the business event, the user interface layer updates the Web tag to obtain the tag printing basic data, and sends the tag printing basic data to the unified data model layer through the editor layer; The unified data model layer performs data format standardization processing on the basic data for label printing to obtain standardized label printing data, and sends it to the print adapter layer; The print adapter layer obtains the print instruction and determines the target print format based on the print instruction, so as to match the print adapter corresponding to the target print format from multiple configured print adapters; The print adapter layer calls the matched print adapter to convert the standardized label printing data into a print file in the target printing format.
[0017] Thirdly, a Web tag editing and printing device supporting multi-device adaptation is provided. Taking the device as an electronic device as an example, it includes a memory, a processor, and a transceiver that are connected in sequence. The memory is used to store computer programs, the transceiver is used to send and receive messages, and the processor is used to read the computer programs and execute the Web tag editing and printing method supporting multi-device adaptation as described in the second aspect or any possible design of the second aspect.
[0018] Fourthly, a storage medium is provided, on which instructions are stored, which, when executed on a computer, perform the multi-device-adaptive Web tag editing and printing method as described in the second aspect or any possible design of the second aspect.
[0019] Fifthly, a computer program product containing instructions is provided that, when executed on a computer, causes the computer to perform the multi-device-adaptive Web tag editing and printing method as described in the second aspect or any possible design of the second aspect.
[0020] Beneficial effects: (1) This invention uses a unified label data format to convert files into different printing formats. There is no need to design different printing templates for different printing formats, thus achieving printing compatibility. Moreover, one template can be used to complete the reuse of multiple printing platforms, thus achieving cross-platform template reuse. In addition, there is no need to maintain multiple sets of templates, and when changing printing service providers, there is no need to redesign all templates, but only to add new adapters. Based on this, printing costs can be reduced.
[0021] (2) Four-layer decoupled architecture: Through layered design, the interface, logic, data and printing are completely decoupled, improving the maintainability and scalability of the system.
[0022] (3) Printing adapter mechanism: The cross-platform printing compatibility problem is solved by the adapter pattern. Users do not need to care about the differences in underlying printing technology. A single design can achieve multi-terminal reuse.
[0023] (4) Scalability: Adding a new printing platform only requires developing a new adapter, without modifying the core code. Attached Figure Description
[0024] Figure 1 This is a schematic diagram of the architecture of a Web tag editing and printing system supporting multi-device adaptation provided in an embodiment of the present invention; Figure 2 This is a schematic diagram illustrating the steps of editing and printing Web tags that support multi-device adaptation, provided in an embodiment of the present invention. Figure 3 This is a schematic diagram of the structure of an electronic device provided in an embodiment of the present invention. Detailed Implementation
[0025] To more clearly illustrate the technical solutions in the embodiments of the present invention or the prior art, the present invention will be briefly introduced below in conjunction with the accompanying drawings and descriptions of the embodiments or the prior art. Obviously, the following description of the structure of the accompanying drawings is only some embodiments of the present invention. For those skilled in the art, other drawings can be obtained based on these drawings without creative effort. It should be noted that the description of these embodiments is for the purpose of helping to understand the present invention, but does not constitute a limitation of the present invention.
[0026] It should be understood that although the terms first, second, etc., may be used herein to describe various units, these units should not be limited by these terms. These terms are only used to distinguish one unit from another. For example, a first unit may be referred to as a second unit, and similarly, a second unit may be referred to as a first unit, without departing from the scope of the exemplary embodiments of the invention.
[0027] It should be understood that the term "and / or" that may appear in this document is merely a description of the relationship between related objects, indicating that three relationships can exist. For example, A and / or B can mean: A exists alone, B exists alone, and A and B exist simultaneously. The term " / and" that may appear in this document describes another relationship between related objects, indicating that two relationships can exist. For example, A / and B can mean: A exists alone, and A and B exist alone. In addition, the character " / " that may appear in this document generally indicates that the related objects before and after it are in an "or" relationship.
[0028] Example: See Figure 1 As shown, the Web tag editing and printing system supporting multi-device adaptation provided in the first aspect of this embodiment may include, but is not limited to, a user interface layer, an editor layer, a unified data model layer, and a print adapter layer. The user interface layer provides a visual interactive interface, receives user operation instructions, and provides real-time feedback on editing results. Specifically, the user interface layer receives user operation instructions for Web tags (where Web tags are code symbols used to mark content attributes in a webpage). Operation instructions refer to all interactive operations performed by the user on the interface, including: clicking to select elements, dragging to move element positions, modifying text content in input boxes, adjusting font size, and modifying attributes such as color. Real-time feedback editing is the visual feedback displayed on the canvas after the user's operation. This is mainly achieved through the editor layer, which updates the Web tags on the canvas in the user interface layer, thereby completing the aforementioned visual feedback.
[0029] Therefore, the editor layer is used to listen to the label operation behavior of the user interface layer in response to the operation command, and convert the label operation behavior into business events to be sent to the user interface layer. In specific implementation, the aforementioned label operation behavior is the behavior generated by the user's interaction on the interface, such as adjustment operations on canvas elements (including click, drag, zoom, etc.) and attribute setting operations on canvas elements (such as setting font, color, element size, etc.). Converting the aforementioned label operation behavior into business events means converting the aforementioned operation behavior into business logic information. For example, operations such as element selection (element refers to the business field of the label), element movement, element scaling, and element rotation are converted into the corresponding selection information, the position after movement, the size after scaling, and the coordinates after rotation. Similarly, attribute setting operations are converted into information such as font type, specific color, and specific size.
[0030] Based on this, after converting the aforementioned tag operation behavior into a business event, it can be sent back to the user interface layer, thereby enabling the user interface layer to update the web tags according to the business event, that is: The user interface layer is used to update Web tags based on the business events, obtain basic tag printing data, and send the basic tag printing data to the unified data model layer through the editor layer. In this embodiment, the user interface layer can update Web tags based on the position information of element movement, scaling, and rotation, as well as attribute information, to obtain basic tag printing data. In simpler terms, it moves, scales, or rotates elements based on the aforementioned information, and then sets attribute information such as font, so that after the update is completed, it obtains basic tag printing data and sends it to the unified data model layer to generate a unified data template.
[0031] Specifically, the unified data model layer is used to standardize the data format of the basic label printing data to obtain standardized label printing data, which is then sent to the print adapter layer. In this embodiment, the unified data model layer is used to define the standardized data format and achieve data consistency. Based on this, the aforementioned basic label printing data can be converted into a unified data template. Finally, it can be sent to the print adapter layer for printing conversion.
[0032] The printing adaptation layer works as follows: The printing adapter layer is configured with multiple printing adapters to obtain printing instructions and determine the target printing format based on the printing instructions, so as to match the printing adapter corresponding to the target printing format from the multiple printing adapters; then, it is used to call the matched printing adapter to convert the standardized label printing data into a print file of the target printing format.
[0033] In this embodiment, the print adaptation layer mainly converts the unified design data into specific formats required by different printing service providers, achieving cross-platform printing compatibility. Specifically, this embodiment creates an independent print adapter for each printing service, and each adapter is responsible for converting the unified data model into the format of the corresponding platform. In this way, a unified data format can be used to complete the conversion of different printing formats (such as converting the unified data format into the format corresponding to Feie Cloud Printing, or into the Kuaimai Cloud Printing format, etc.). Finally, after converting the standardized label printing data into a print file of the target printing format, label printing can be performed.
[0034] Thus, through the aforementioned description of the overall architecture of the Web label editing and printing system supporting multi-device adaptation, this invention achieves complete decoupling between label design and label printing. That is, it uses a unified label data format to convert files into different printing formats. Therefore, this invention eliminates the need to design different printing templates for different printing formats, achieving printing compatibility. Furthermore, a single template can be reused across multiple printing platforms, realizing cross-platform template reuse. In addition, this invention does not require maintaining multiple sets of templates, and changing printing service providers does not require redesigning all templates; only a new adapter needs to be added. Based on this, printing costs can be reduced.
[0035] After completing the overall architecture description of the aforementioned system, this embodiment provides a detailed construction of the aforementioned four-layer decoupled architecture.
[0036] In this embodiment, one type of architecture information for the user interface layer is disclosed first: In one possible design, see Figure 1 As shown, the user interface layer may include, but is not limited to, a business element panel, an attribute panel, and a canvas editor; wherein, the business element panel provides a selectable library of business fields, and the user can select a business field through human-computer interaction, that is, the business element panel is used to obtain business element operation commands and execute business element operation commands to select the business field corresponding to the business element operation command from the business field library and display it on the canvas editor to form a Web tag.
[0037] In practical implementation, the aforementioned business field library stores business fields with different labels. For example, business fields may include, but are not limited to, standard fields such as product number, order number, barcode, and QR code. At the same time, the aforementioned business element panel can select business fields in response to business element operation commands.
[0038] Furthermore, the aforementioned business element operation commands can be, but are not limited to, commands to add or remove canvas elements by checking checkboxes; adding by checking checkboxes is to select a business field, while removing a canvas element is to delete a business field; at the same time, the business element panel can also maintain the metadata configuration of the business fields (field identifier, type, default position, whether selected, etc.); thus, when it responds to the business element operation command, selects the business field and displays it on the canvas editor, a web tag (i.e., the initial tag) can be formed.
[0039] Then, users can use the canvas editor to adjust the canvas elements and set their attribute information. In this embodiment, the canvas editor mainly serves as an interactive area, supporting operations such as visual creation, selection, movement, and scaling of elements. The canvas editor is based on the FabricJS engine for rendering and event listening. The FabricJS engine is a graphical operation tool framework based on web canvas.
[0040] Specifically, rendering and event listening will be explained in detail below.
[0041] Thus, the canvas editor is used to receive the operation instructions, and in response to the operation instructions, adjust the canvas elements of the Web tag, open the attribute panel, and set the element attributes of the target field in the Web tag based on the attribute panel. In specific implementation, the aforementioned target field is the business field in the business field library corresponding to the business element operation command, and adjusting the canvas element means performing operations such as selecting, moving, and scaling the canvas element (that is, the edit box of the business field). Furthermore, the element attribute setting operation is to set the attributes of the currently selected element, such as coordinates, size, font, color, and other attribute information.
[0042] Based on this, the function of the attribute panel is to display and edit the attributes of the currently selected element. When the user moves the mouse over an element, the attribute panel of that element will pop up. Based on the attribute panel, the coordinates, size, font, color and other attribute information of the element can be set. Then, the changes are notified to the editor layer through the event mechanism, and the main controller calls the editor core layer interface to update the canvas display synchronously.
[0043] Furthermore, the user interface layer may also include, but is not limited to, a selection operation bar, wherein the selection operation bar is configured with global operation buttons, and the global operation buttons include a label type switching button, a save button, a preview button, and a push print button; thus, label switching, previewing, saving, and printing operations can be performed through the selection operation bar.
[0044] Therefore, the aforementioned user interface layer enables the creation and modification of web tags; then, the editor layer can be used to listen for events and update the canvas upon detecting a tag operation.
[0045] Specifically, the main functions of the editor layer, as exemplified, are: to handle the business logic of user operations, maintain the canvas state technology selection, and use FabricJS as the underlying graphics engine to provide element management and interaction capabilities; wherein, the editor layer may include, but is not limited to, an event handler and a canvas engine, and the canvas engine is equipped with a callback machine FabricJS engine.
[0046] In practical applications, the event handler is used to listen for adjustments to the canvas elements of the Web tag on the canvas editor and modifications to the element attributes of the target field on the attribute panel, using event listeners. The listened-upon adjustments and modifications are then treated as the tag operation behavior. The event handler further converts the tag operation behavior into a business event and sends it to the user interface layer via the FabricJS callback engine in the canvas engine. This allows the user interface layer to update the canvas elements of the Web tag and the attribute information of the target field based on the business event, thereby obtaining the basic data for tag printing after the update.
[0047] In practical applications, event listeners are bound to the canvas object of the canvas editor, that is, the canvas element. They listen for user actions on the canvas editor, such as capturing mouse operations (clicks, drags, zooms, etc.) and setting operations on canvas element (i.e., target field) properties. Then, these underlying interactive events are converted into business semantic events (selecting elements, moving elements, resizing, etc.). Finally, through the FabricJS callback function in the canvas engine (i.e., the aforementioned callback machine FabricJS engine), the user interface layer is notified to update the canvas display and property panel display. That is, when the state of an element in the editor layer changes (such as when the user drags an element to change its position, or the property information changes), the editor layer passes the latest state data to the user interface layer through the callback function, triggering the update of interface components such as the property panel.
[0048] Based on this, the event handler's workflow is as follows: (1) The user performs mouse interaction operations on the canvas editor (belonging to the user interface layer); (2) The editor layer converts the underlying events (i.e., mouse interaction operations) into business events (such as "element position change") through the event listener; (3) The callback machine FabricJS engine notifies the user interface layer to update the canvas elements and the display of the corresponding attribute panel.
[0049] Similarly, the data flow is as follows: Forward: Operations in the user interface layer → Update element state in the editor layer; Reverse: Changes in the state of the editor layer → Notify the user interface layer to refresh the display.
[0050] Furthermore, in this embodiment, see... Figure 1 As shown, the editor layer described in the example may also include, but is not limited to, an element manager; wherein, the element manager is used to store element instances using a mapping table structure, and the element instances are the business fields; at the same time, it also provides interfaces for creating, reading, updating, deleting and other operations of elements, so that users can perform different operations on elements based on the element manager in the user interface layer. In this way, the storage management of business fields can be realized by using the element manager.
[0051] Thus, after completing the tag design operation based on the aforementioned user interface layer and editor layer, a unified format conversion can be performed to obtain a unified tag data template. Specifically, this embodiment defines a standardized data format through a unified data model layer to achieve data consistency across modules and platforms.
[0052] The working process of the unified data model layer is as follows: A unified data model layer is used to standardize the element data structure of the label printing basic data to obtain standardized label structure data. In this embodiment, the element data structure standardization process defines a unified element description format, which mainly includes standard basic attributes, standard visual attributes, and standard business attributes.
[0053] Therefore, the detailed process of standardizing the element structure is as follows: Based on the basic element information in the label printing basic data (the basic element information includes the element's unique identifier, element type, element position coordinates, and element size), standard basic attributes are generated; then, based on the element visual information in the label printing basic data (wherein, the element visual information includes font size, font color, and font weight), standard visual attributes are generated; next, the data content (i.e., target fields) in the label printing basic data is extracted, and business field identifiers and unified barcode formats for the data content are generated (identifiers for different business fields and calibration barcode formats can be preset; when using them, the identifiers are matched according to the target fields, and then the barcode format of the target fields is converted to the calibration barcode format); finally, standard business attributes can be generated based on the data content, business field identifiers, and unified barcode formats, so that the standardized label structure data can be generated using the standard business attributes, standard basic attributes, and standard visual attributes.
[0054] After the element data structure is standardized, the template data structure can be standardized. The process is as follows: a unified data model layer is used to generate an element list based on the standardized label structure data; then, it is used to generate template metadata and configuration data, and based on the element list, template metadata and configuration data, standardized template structure data is generated; finally, the standardized template structure data can be used as the standardized label printing data.
[0055] In practical applications, template data structure standardization defines a unified template saving format. First, the label type, name, size, and creation time are determined to generate template metadata. Then, based on the target fields in the standardized label structure data, the selection status of the target fields is determined (selected means in a checked state, unselected means in an unchecked state), and configuration data is generated based on the selection status of the target fields. Next, the standardized data of all canvas elements (i.e., standardized label structure data) is arranged into an element list. Finally, the three data sets generated above are combined to form the standardized template structure data, which is the standardized label printing data.
[0056] Therefore, through the aforementioned unified data model layer, a unified label data template can be generated. Then, by maintaining this label data template, different printing formats can be converted, thereby achieving printing compatibility and cross-platform template reuse.
[0057] Specifically, this embodiment uses a print adapter layer with multiple print adapters to achieve cross-platform template reuse. Each print adapter is configured with a corresponding label template, such as the Feie Cloud print adapter corresponding to a JSON format label template, and the Kuaimai Cloud print adapter corresponding to an XML format label template. In this way, the format can be converted and the data can be filled according to different print adapters to obtain the corresponding format print file.
[0058] In this embodiment, the aforementioned adapter matching is achieved through human-computer interaction with the push print button. Specifically, the user interface layer is further configured to, in response to the human-computer interaction between the push print button and the user, send the label printing basic data to the unified data model layer via the editor layer (i.e., trigger the label sending operation), and simultaneously generate the print instruction to send the print instruction to the print adapter layer. Optionally, the print instruction may include the type of print adapter selected by the user (an adapter selection box may pop up when the user interacts with the push print button, allowing for adapter selection). Thus, the print adapter layer can determine the selected print adapter based on the print instruction, and then perform format conversion.
[0059] Specifically, the working process of the printing adapter layer is as follows: The print adapter layer is used to call the matched print adapter to convert the standardized label printing data into a format that matches the target printing format. In this embodiment, each adapter is responsible for converting the unified data model into the format of the corresponding platform. Therefore, when the matched print adapter is the Feie Cloud Print Adapter, the standard element data is converted into Feie printing instructions in JSON format, which includes text instructions, barcode instructions, QR code instructions, etc. Similarly, when the matched print adapter is the Kuaimai Cloud Print Adapter, the standard element data is converted into Kuaimai printing instructions in XML format, and the elements are described using the CPCL printing language (CPCL printing language is a simple, efficient, text-based set of printing commands, mainly used to control portable mobile printing devices). If the matched print adapter is the local C-Lodop print adapter (the local C-Lodop print adapter (usually called C-Lodop) is a component in the Lodop printing control system used to implement printing functions locally on the client), the standard element data is converted into the API call sequence of the C-Lodop printing control to support direct printing by the local printer.
[0060] Therefore, after format conversion, coordinate transformation can be performed. Different printing platforms use different coordinate units (pixels, millimeters, dots, etc.), and directly transmitting data will cause positional offsets. Therefore, coordinate transformation is necessary before printing. The coordinate transformation process is as follows: The print adapter layer is used to call the matched print adapter to perform coordinate transformation on the label pre-printing data to obtain the label printing data. In this embodiment, the conversion ratio can be calculated according to the unit requirements of the matched print adapter (e.g., Feige uses 0.1 mm, and Kuaimai uses pixels). Then, the position and size of the elements are automatically converted to coordinate values under the matched print adapter according to the ratio. Of course, the conversion ratio between different print adapters and standardized label printing data can be preset, and the adapter can be matched when needed.
[0061] After the coordinate transformation is completed, data injection is required. That is, the print adapter layer is also used to obtain a specified label template and call the matched print adapter to inject the label printing data into the specified label template to obtain the print file. The specified label template is the label template corresponding to the matched print adapter.
[0062] In this embodiment, the label template only defines the layout and field positions. During actual printing, business data (i.e., target fields, such as order number, product number, etc.) is dynamically injected to obtain the print file.
[0063] In addition, this embodiment also supports batch printing, that is, by using the batch data processing capability of the adapter, a template can be combined with multiple business data to achieve batch printing.
[0064] Therefore, this embodiment completely decouples the label design process from the specific printing platform by setting up an independent printing adapter layer. This allows users to not need to worry about which printing method will be used in the final design stage, and to freely choose any printing platform after the design is completed. In other words, the aforementioned adapter mode can solve the problems of cross-platform printing compatibility and template reuse, and a single design can be reused on multiple platforms.
[0065] In addition, in this embodiment, the system also has a data verification mechanism, namely: performing format verification during data storage and retrieval to ensure data integrity, and using standard format serialization to serialize data when saving the template and deserializing and restoring it during loading to ensure that the design content is not lost or deformed.
[0066] Therefore, based on the foregoing detailed description of the Web tag editing and printing system supporting multi-device adaptation, the advantages of this invention are: Flexibility: Supports arbitrary combinations of business fields to adapt to the tag requirements of different business scenarios.
[0067] Compatibility: Supports multiple printing platforms (cloud printing, local printing), eliminating the need for redesign.
[0068] Ease of use: Visual drag-and-drop design, label creation can be completed without programming knowledge.
[0069] High efficiency: Template reuse mechanism, one-time design for permanent use, supports batch printing.
[0070] Scalability: Adding a new printing platform only requires developing a new adapter, without modifying the core code.
[0071] like Figure 2 As shown, the second aspect of this embodiment provides a Web tag editing and printing method that supports multi-device adaptation. The method is implemented based on the Web tag editing and printing system that supports multi-device adaptation described in the first aspect of the embodiment, and the operation steps of the method may be, but are not limited to, the steps S1 to S6 below.
[0072] S1. The user interface layer receives user commands for operating Web tags.
[0073] S2. The editor layer listens to the tag operation behavior of the user interface layer in response to the operation instruction, and converts the tag operation behavior into a business event to be sent to the user interface layer.
[0074] S3. Based on the business event, the user interface layer updates the Web tag to obtain the basic data for tag printing, and sends the basic data for tag printing to the unified data model layer through the editor layer.
[0075] S4. The unified data model layer performs data format standardization processing on the basic data for label printing to obtain standardized label printing data, and sends it to the print adapter layer.
[0076] S5. The print adapter layer obtains the print instruction and determines the target print format based on the print instruction, so as to match the print adapter corresponding to the target print format from the multiple configured print adapters.
[0077] S6. The print adapter layer calls the matched print adapter to convert the standardized label printing data into a print file in the target printing format.
[0078] The working process, working details and technical effects of the method provided in this embodiment can be found in the first aspect of the embodiment, and will not be repeated here.
[0079] like Figure 3 As shown, the third aspect of this embodiment provides a Web tag editing and printing device that supports multi-device adaptation. Taking the device as an electronic device as an example, it includes: a memory, a processor, and a transceiver that are connected in sequence. The memory is used to store a computer program, the transceiver is used to send and receive messages, and the processor is used to read the computer program and execute the Web tag editing and printing method that supports multi-device adaptation as described in the second aspect of the embodiment.
[0080] For specific examples, the memory may include, but is not limited to, random access memory (RAM), read-only memory (ROM), flash memory, first-in-first-out (FIFO) memory, and / or first-in-last-out (FILO) memory, etc.; specifically, the processor may include one or more processing cores, such as a 4-core processor, an 8-core processor, etc. The processor may be implemented using at least one hardware form of DSP (Digital Signal Processing), FPGA (Field-Programmable Gate Array), PLA (Programmable Logic Array). The processor may also include a main processor and a coprocessor. The main processor, also known as the CPU (Central Processing Unit), is used to process data in the wake-up state; the coprocessor is a low-power processor used to process data in the standby state.
[0081] In some embodiments, the processor integrates a GPU (Graphics Processing Unit), which is responsible for rendering and drawing the content to be displayed on the screen. For example, the processor may not be limited to microprocessors of the STM32F105 series, reduced instruction set computer (RISC) microprocessors, x86 architecture processors, or processors with integrated neural network processing units (NPUs). The transceiver may be, but is not limited to, a Wi-Fi transceiver, a Bluetooth transceiver, a General Packet Radio Service (GPRS) transceiver, a ZigBee (a low-power LAN protocol based on the IEEE 802.15.4 standard) transceiver, a 3G transceiver, a 4G transceiver, and / or a 5G transceiver. Furthermore, the device may also include, but is not limited to, a power module, a display screen, and other necessary components.
[0082] The working process, working details and technical effects of the electronic device provided in this embodiment can be found in the first aspect of the embodiment, and will not be repeated here.
[0083] The fourth aspect of this embodiment provides a storage medium that stores instructions containing the instructions for the multi-device-adaptive Web tag editing and printing method described in the second aspect of this embodiment. That is, the storage medium stores instructions that, when executed on a computer, perform the multi-device-adaptive Web tag editing and printing method as described in the second aspect of this embodiment.
[0084] The storage medium refers to a carrier for storing data, which may include, but is not limited to, floppy disks, optical disks, hard disks, flash memory, USB flash drives, and / or memory sticks. The computer may be a general-purpose computer, a special-purpose computer, a computer network, or other programmable devices.
[0085] The working process, working details and technical effects of the storage medium provided in this embodiment can be found in the first aspect of the embodiment, and will not be repeated here.
[0086] The fifth aspect of this embodiment provides a computer program product containing instructions that, when executed on a computer, cause the computer to perform the Web tag editing and printing method supporting multi-device adaptation as described in the second aspect of this embodiment, wherein the computer may be a general-purpose computer, a special-purpose computer, a computer network, or other programmable device.
[0087] Finally, it should be noted that the above description is merely a preferred embodiment of the present invention and is not intended to limit the scope of protection of the present invention. Any modifications, equivalent substitutions, improvements, etc., made within the spirit and principles of the present invention should be included within the scope of protection of the present invention.
Claims
1. A Web tag editing and printing system supporting multi-device adaptation, characterized in that, include: The user interface layer is used to receive user commands for interacting with Web tags; The editor layer is used to listen to the tag operation behavior of the user interface layer in response to the operation instruction, and convert the tag operation behavior into a business event to be sent to the user interface layer; The user interface layer is used to update the Web tag based on the business event, obtain the tag printing basic data, and send the tag printing basic data to the unified data model layer through the editor layer; The unified data model layer is used to standardize the data format of the label printing basic data to obtain standardized label printing data, and then send it to the print adapter layer. The print adapter layer is configured with multiple print adapters for acquiring print instructions and determining the target print format based on the print instructions, so as to match the print adapter corresponding to the target print format from the multiple print adapters; The print adapter layer is also used to call the matched print adapter to convert the standardized label printing data into a print file in the target printing format.
2. The Web tag editing and printing system supporting multi-device adaptation according to claim 1, characterized in that, The user interface layer includes: a business element panel, an attribute panel, and a canvas editor; The Business Element panel is used to obtain and execute business element operation commands to select the corresponding business fields from the business field library and display them on the canvas editor to form Web tags. A canvas editor is configured to receive the operation instructions, adjust the canvas elements of the Web tag in response to the operation instructions, open the attribute panel, and set the element attributes of the target field in the Web tag based on the attribute panel, wherein the target field is a business field in the business field library corresponding to the business element operation command.
3. A Web tag editing and printing system supporting multi-device adaptation according to claim 2, characterized in that, The editor layer includes an event handler and a canvas engine, wherein the canvas engine is equipped with a callback machine FabricJS engine; An event handler is used to listen for adjustment operations on the canvas elements of the Web tag in the canvas editor and modification operations on the element attributes of the target field in the attribute panel, so as to use the listened adjustment and modification operations as the tag operation behavior. The event handler is also used to convert the tag operation behavior into a business event, and send the business event to the user interface layer through the callback machine FabricJS engine in the canvas engine, so that the user interface layer updates the canvas element of the web tag and the attribute information of the target field according to the business event, so as to obtain the basic data for tag printing after the update.
4. A Web tag editing and printing system supporting multi-device adaptation according to claim 3, characterized in that, The editor layer further includes an element manager, wherein the element manager is used to store element instances using a mapping table structure, and the element instances are the business fields.
5. A Web tag editing and printing system supporting multi-device adaptation according to claim 1, characterized in that, A unified data model layer is used to standardize the element data structure of the label printing basic data to obtain standardized label structure data. A unified data model layer is used to generate an element list based on the standardized tag structure data; The unified data model layer is also used to generate template metadata and configuration data, and based on the element list, template metadata and configuration data, to generate standardized template structure data, so as to use the standardized template structure data as the standardized label printing data.
6. A Web tag editing and printing system supporting multi-device adaptation according to claim 5, characterized in that, The unified data model layer is used to generate standard basic attributes based on the basic information of elements in the label printing basic data. The basic information of elements includes the element's unique identifier, element type, element position coordinates, and element size. A unified data model layer is used to generate standard visual attributes based on the visual information of elements in the label printing base data, wherein the visual information of elements includes font size, font color and font weight; The unified data model layer is used to extract the data content from the label printing basic data and generate business field identifiers and unified barcode formats for the data content; The unified data model layer is also used to generate standard business attributes based on data content, business field identifiers, and unified barcode format, and to generate the standardized label structure data using standard business attributes, standard basic attributes, and standard visual attributes.
7. A Web tag editing and printing system supporting multi-device adaptation according to claim 1, characterized in that, Each print adapter is configured with a corresponding label template. The print adapter layer is used to call the matched print adapter to convert the standardized label printing data into a format to obtain the label pre-print data in the target printing format. The print adapter layer is used to call the matched print adapter to perform coordinate transformation on the label pre-printing data to obtain the label printing data. The print adapter layer is also used to obtain a specified label template and call the matched print adapter to inject the label printing data into the specified label template to obtain the print file, wherein the specified label template is the label template corresponding to the matched print adapter.
8. A Web tag editing and printing system supporting multi-device adaptation according to claim 1, characterized in that, The user interface layer further includes a selection operation bar, wherein the selection operation bar is configured with global operation buttons, and the global operation buttons include a label type switching button, a save button, a preview button, and a push print button.
9. A Web tag editing and printing system supporting multi-device adaptation according to claim 8, characterized in that, The user interface layer is also used to send the label printing basic data to the unified data model layer through the editor layer in response to the push print button and the user's human-computer interaction operation, and at the same time generate the print instruction to send the print instruction to the print adapter layer.
10. A method for editing and printing web tags that supports multi-device adaptation, characterized in that, The system is based on any one of claims 1 to 9, providing a web tag editing and printing system that supports multi-device adaptation, wherein the method includes: The user interface layer receives user commands to interact with Web tags; The editor layer listens to the tag operation behavior of the user interface layer in response to the operation instruction, and converts the tag operation behavior into a business event to be sent to the user interface layer; Based on the business event, the user interface layer updates the Web tag to obtain the tag printing basic data, and sends the tag printing basic data to the unified data model layer through the editor layer; The unified data model layer performs data format standardization processing on the basic data for label printing to obtain standardized label printing data, and sends it to the print adapter layer; The print adapter layer obtains the print instruction and determines the target print format based on the print instruction, so as to match the print adapter corresponding to the target print format from multiple configured print adapters; The print adapter layer calls the matched print adapter to convert the standardized label printing data into a print file in the target printing format.