V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
GrapeCityChina
V2EX  ›  推广

前端展示中实现批量标签动态生成

  •  
  •   GrapeCityChina · 2022-10-26 14:06:54 +08:00 · 558 次点击
    这是一个创建于 759 天前的主题,其中的信息可能已经有所发展或是发生改变。

    前端展示中实现批量标签动态生成

    使用过报表的小伙伴,经常会有条码打印、标签打印的需求,一两个标签还好处理,但很多时候我们可能需要的是几十、上百个内容的批量打印,如下图所示:

    今天我们就来为大家介绍,如何快速实现报表的标签条码批量打印。 

    项目实战

    今天我们从 Wyn 出发,为大家展示整个功能的实现过程。 Wyn作为一款专业的商业智能软件,除了可以将整个仪表板和单个图表嵌入、仪表板设计器嵌入、分析门户嵌入、OEM 安装包嵌入,同时,提供丰富的 API ,以满足个性化嵌入需要,除了本文即将介绍的批量打印标签功能外,对更多行业解决方感兴趣可查看:

    https://www.grapecity.com.cn/solutions/wyn/industry

    1.创建 RDL 报表,绑定数据集

    2.设计单个标签的样式以及字段绑定 单个标签设计有多种方式,可以用文本框和条形码组件拼接:

    也可以采用表格组件标题行嵌套文本框和数据字段; 选择表格组件,删除汇总行和明细行

    然后表格标题嵌入条形码,以及绑定数据字段

    预览可以看到目前设计的单个标签样式

    如果单个标签外层还想添加圆角边框,或者其它的样式,可以在外层嵌套容器 选择容器,然后设计圆角,以及边框粗细,颜色等等;

    接下来把上面设计的单个表格整个嵌套到这个容器内部

    到此单个标签设计全部完成

    3.根据数据循环生成多个标签 要实现根据数据行数循环生成多个标签,就需要利用列表组件,根据列表组件的分组功能实现该需求

    然后把上面的容器整个再放入到列表组件里面,预览即可看到根据数据循环显示多次

    4.最后调整实现让循环生成以 Z 字型生成 首先确定一个标签的大小,以及纸张的大小,确定一下一行可以显示几个标签; 比如我的标签宽度 9 厘米,我希望一行显示 3 个标签,那我就需要纸张的宽度至少是  9*3+左右页边距=29cm

    然后设置纸张高度为:标签高度+上下页边距=7cm ;

    然后设置报表进行分栏,分成 3 栏,这样一行就可以显示 3 个标签

    注意:在设计的时候有一些尺寸高度,宽度微调,这块尽量使用属性设置的宽度高度调整固定值,不要手动拖动大小;

    到这里我们就完整实现了前端报表中完整调整标签内容格式,并设置正确的打印格式顺序。

    大家如果对更多前端数据分析、报表、仪表板相关内容感兴趣,欢迎访问:

    https://www.grapecity.com.cn/solutions/wyn/demo

    目前尚无回复
    关于   ·   帮助文档   ·   博客   ·   API   ·   FAQ   ·   实用小工具   ·   2693 人在线   最高记录 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 22ms · UTC 05:26 · PVG 13:26 · LAX 21:26 · JFK 00:26
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.