基于Vue的web设计打印方案

企业信息化例如ERP,OA等等都会存在纸质单据打印的情况，需要在企业内部流转，打印设计也有很多方案，例如fastReport,bartender等等，今天要说的是

vue-plugin-hiprint，开源的web打印插件，基于此插件可以集成模版设计，打印输入JSON数据进行套打，轻松实现WEB上打印需求。效果如图

 可拖拽式的布局方案，对元素进行字段标记，轻松实现动态数据带入，

  hiprint.PrintElementTypeManager.buildByHtml($(".ep-draggable-item"));

        // 初始化 provider

        hiprint.init({

            providers: [new defaultProvider()],

        });

    $("#hiprint-printTemplate").empty(); // 先清空, 避免重复构建

            this.template = hiprintTemplate = new hiprint.PrintTemplate({

                settingContainer: "#PrintElementOptionSetting", // 元素参数容器

            });

            // 构建 并填充到 容器中

            hiprintTemplate.design("#hiprint-printTemplate");

 提供构建设计区域以及 属性配置区域，配合后端数据保存，可以实现打印模版化，让需要用到打印服务的项目轻松集成。