更新日志

2025-08-07

@sv-print/plugin-text-auto@0.1.0

🌈 新增插件文本字体自适应

🎮 代码示例

import pluginTextAuto from "@sv-print/plugin-text-auto";
let plugins = [
  pluginTextAuto({
    sizeList: [12, 5, 4, 3, 2, 1], // 适应最小字体选项
    maxIterations: 15, // 适应次数
    enablePrecision: true, // 启用精确适应
    precision: 0.5, // 适应精确step
    precisionCount: 10, // 适应精确次数
    lineHeightMode: "auto", // 行高模式 auto | original | normal | unset
    overrideHidden: false, // 超出是否隐藏
    extendsCss: {
      // 扩展css
      "word-wrap": "break-word", // 单词换行
    },
  }),
]

2025-08-06

sv-print@0.1.31
@sv-print/hiprint@0.2.21

🌈 新增 toolbar 新增水平/垂直间隙、网格对齐工具
✨ 优化新增 setElsGrid API 用于设置元素网格对齐.

🎮 代码示例

// 消除水平间隙
printTemplate?.setElsAlign("clearVer");
// 消除垂直间隙
printTemplate?.setElsAlign("clearHor");
// 默认2列 网格对齐
printTemplate?.setElsAlign("clearGrid");
// 水平间隙
printTemplate?.setElsSpace(10, true);
// 垂直间隙
printTemplate?.setElsSpace(10, false);
// grid网格对齐
const column = 2;
printTemplate?.setElsGrid(column);

2025-08-05

@sv-print/hiprint@0.2.20

✨ 优化表格行/列合并函数,跨页合并显示问题.

2025-08-01

sv-print客户端@2.0.3

✨ 新增 MQTT服务,并提供了MQTT在线测试HTML.
✨ 新增预览功能,打印日志支持预览打印的模板/html.支持自定义预览渲染器
✨ 优化在线设计功能,支持新窗口打开,支持自定义设计器地址
✨ 优化模板中心功能,支持自定义API请求
✨ fix 多打印机自动创建渲染窗口BUG, 默认最大 3 个渲染窗口.

2025-07-29

sv-print@0.1.30
@sv-print/hiprint@0.2.19
@sv-print/plugin-i18n@0.1.1
✨ 优化 i18n插件,适配右键菜单、插件元素新增属性
✨ 适配移动端 toolbar i18n
✨ fix 移动端预览多页高度显示问题
✨ 优化 touchZoom 使用 css "zoom" 做缩放

2025-07-25

sv-print@0.1.29
@sv-print/hiprint@0.2.18
@sv-print/plugin-i18n@0.1.0

🌈 新增支持多语言 i18n 插件

// vue3 为例
<template>
  <Designer :plugins="plugins"></Designer>
</template>
<script setup lang="ts">
  import { onMounted, ref } from 'vue';
  import { Designer } from '@sv-print/vue3';
  // 先安装所需插件: eg: npm i @sv-print/plugin-i18n
  // 再引入插件
  import pluginI18n, { translateBySelector } from "@sv-print/plugin-i18n";
  import en from "./i18n/en.json"; // 自己准备多语言文件
  const plugins = ref([
    pluginI18n(
      {
        // lng: "英文", // 默认: "简体中文"
        // debug: true, // 调试: 可查看对应语言 缺少的翻译
        resources: {
          // 自定义 key: "英文", 则列表 显示对应的名称
          英文: {
            translation: en,
          },
        },
      },
      (i18next, t, err) => {
        // 回调,干点儿其他的
        console.log("测试翻译", t("文本"));
        // 插件提供的一个 API, 根据 选择器 翻译
        // translateBySelector([".sv-print"]);
      }
    ),
  ]);
</script>

✨ 优化新增hook "onDesigned"、"onPreview"
✨ fix: customDataFun 导致表格无法拖拽
✨ fix: 元素参数默认值设置失效问题

2025-07-22

sv-print@0.1.28
@sv-print/hiprint@0.2.15
@sv-print/plugin-ele-bwip-js@0.1.15
@sv-print/plugin-ele-e2table@0.1.4
@sv-print/plugin-ele-echarts@0.1.10
@sv-print/plugin-ele-fabric@0.1.11

🌈 新增支持设置多个字段名和自定义字段名值获取方法

// 第3个参数 printData, 兼容表格列数据获取.
const customDataFun = (data, field, printData) => {
  let fieldData;
  const fieldList = `${field}`.split(",");
  const len = fieldList.length;
  for (var i = 0; i < len; i++) {
    const f = fieldList[i];
    const curData = (f.split(".").reduce((a, c) => (a ? a[c] : data ? data[c] : ""), false) || "");
    // 如果是表格: curData 是个对象哟
    if (typeof curData == "object") {
      if (Array.isArray(curData)) {
        fieldData = [...fieldData||[], ...curData];
      } else {
        fieldData = {...fieldData||{}, ...curData};
      }
    } else {
      const connector = i == 0 ? '' : '->'
      // 有必要考虑 number 情况么?
      fieldData = `${(fieldData || '')}${connector}${curData}`;
    }
  }
  return fieldData;
};
// 组件中
const fun = ref(customDataFun);
<Designer :customDataFun="fun" />
// 或者
const hiprintTemplate = new hiprint.PrintTemplate({
  template: panel, // 模板
  customDataFun: customDataFun,
});
// 或者
hiprintTemplate.setCustomDataFun(customDataFun);

🌈 调整优化组件内编辑器新增清空复制按钮

✨ fix 行列合并函数, 跨页首行colspan列数显示问题
✨ 优化 register api

2025-07-11

sv-print@0.1.25
@sv-print/hiprint@0.2.13

🌈 调整优化支持触摸事件 & 适配移动端UI

🌈 新增支持 touchZoom 方法,以适配移动端预览双指缩放

const box = globalThis.$("#preview_content .hiprint-printPaper");
const ww = window.innerWidth - 64; // 64: 边距
const tw = box.width();
const zoom = Math.round((ww / tw) * 100) / 100;
box.css({
  transform: `scale(${zoom})`,
  "transform-origin": "0px 0px",
});
globalThis.$(box).touchZoom({
  minScale: 0.2,
  maxScale: 6.0,
  transform: true, // 启用 transform 缩放
});

🌈 新增支持 ${paperNo} ${paperCount} 和 ${field} 值替换

// 编辑就完了

🌈 新增支持 addPrintElementToPaperByTid 根据 tid 添加元素

printTemplate?.addPrintElementToPaperByTid("defaultModule.text");
// 添加到指定位置 pt
const left = 10;
const top = 30;
printTemplate?.addPrintElementToPaperByTid("defaultModule.text", left,top);

🌈 新增支持 providerMap 支持传自定义渲染函数 --> hiprint.PrintElementTypeManager.build 支持自定义渲染可拖拽元素


const providerMap = ref({
    container: '.hiprintEpContainer',
    value: 'defaultModule',
    render: (list) => {
      let container = globalThis.$('<div class="hiprint-printElement-type"></div>');
      // xxx
      return container;
    },
});

hiprint.PrintElementTypeManager.build('.hiprintEpContainer', 'defaultModule', (list) => {
  let container = globalThis.$('<div class="hiprint-printElement-type"></div>');
  list.forEach(function (item) {
    const box = globalThis.$(`
          <div class="draggable-ele-group">
            <span class="title">${item.name}</span>
            <div class="list"></div>
          </div>
          `);
    const typeList = box.find('.list');
    item.printElementTypes.forEach(function (t) {
      typeList.append(`
              <div class="draggable-ele ep-draggable-item" tid=${t.tid}>
                <i class="svicon sv-base sv-${t.type}"></i>
                <p style="white-space:nowrap">${t.getText()}</p>
              </div>
          `);
    });
    container.append(box);
  });
  return container;
});

🌈 调整优化 setElsAlign 支持对齐纸张;单项默认对齐纸张, 多选按住 ctrl/command 键可批量对齐

printTemplate?.setElsAlign("left", true);
printTemplate?.setElsAlign("right", true);

🌈 调整优化锁定元素禁止调整大小 & 全局配置 disableNoDraggableSize 默认 true

hiprint.setConfig({
  disableNoDraggableSize: false, // 锁定元素,可编辑属性 宽高大小
})

🌈 调整新增 buildPagination 构建多面板菜单

// 手动构建多面板菜单
printTemplate.buildPagination("#printPanels");

✨ 优化导出PDF,导出图片部分元素清晰度 & 导出图片支持 quality: 0~1
✨ 优化双击编辑功能(可编辑为html)
✨ 优化删除元素逻辑(锁定元素,全选元素) & 右键菜单删除情况
✨ 优化预览支持设置是否隐藏导出图片,导出PDF以及直接打印按钮
✨ 优化全选时触发元素选中事件
✨ 优化 designer 组件传 template 为模板对象时,默认事件处理
✨ fix setConfig 方法可能导致 tab 显示错误问题

2025-06-26

sv-print@0.1.23
@sv-print/hiprint@0.2.11
@sv-print/vue@0.1.20
@sv-print/vue3@0.1.20
@sv-print/react@0.1.20
@sv-print/plugin-ele-bwip-js@0.1.14
@sv-print/plugin-ele-e2table@0.1.3
@sv-print/plugin-ele-echarts@0.1.9
@sv-print/plugin-ele-fabric@0.1.10

🌈 优化 hiprint.setConfig 方法, 支持扩展插件元素属性 & 支持before

hiprint.setConfig({
  // 插件新元素的 元素属性
  xxx: {
    tabs: [
      {}
    ]
  }, 
  text: {
    tabs: [
      {},
      // 当修改第二个 tabs 时,必须把他之前的 tabs 都列举出来.
      {
        name: '样式', options: [
          {
            name: 'scale',
            before: 'color', // 自定义参数，插入在 color 之前
            hidden: false
          },
        ]
      }
    ],
  }
});

🌈 新增 hiprint.getOptionItems 查看所有元素参数对象, 新增 getOptionItem hook

// 元素的所有参数对象
const optionItems = hiprint.getOptionItems;

// hook getOptionItem
const getOptionItemHook = {
  hook: 'getOptionItem',
  name: '对元素参数做一个包装',
  description: '渲染元素属性时,构建更多值,或者做多语言处理',
  priority: 1,
  run: (item) => {
    // 示例 给 元素属性 添加一个 data-name 属性
    const oldCreate = item.createTarget;
    item.createTarget = function (...args) {
      const target = oldCreate.call(item, ...args);
      console.log(target);
      target.attr({
        "data-name": item.name,
      });
      return target;
    };
    return item;
  }
}

🌈 vue/vue3/react 组件新增导出 Header 组件

import { Header } from '@sv-print/vue'
import { Header } from '@sv-print/vue3'
import { Header } from '@sv-print/react'

🌈 toolbar 新增 setZoom 方法设置默认缩放

const onDesigned = (e) => {
  const {designerUtils} = e.detail;
  designerUtils.toolbar.setZoom(1.5)
};

✨ 优化水印内容支持 ${name} 取打印数据中的字段值
✨ 优化缩放时元素的 [位置大小],[删除按钮] 缩放问题
✨ 修复插件[plugin-ele-fabric] fText 元素宽高问题
✨ 优化插件[plugin-scale] 点击元素位置偏移问题
✨ 优化插件[bwip-js,fabric,echarts,e2table] 支持扩展元素参数
✨ 修复插件[plugin-ele-echarts] 部分图表渲染问题
✨ 修复文本 writing-mode 对 resize-panel 的影响
✨ fix 表格列渲染条形码/二维码导出pdf问题
✨ fix 删除元素时 of null (reading 'className'), 组件销毁时 cloneNode error