xinglie / report-designer

⚡打印设计、可视化、标签打印、编辑器、设计器、数据分析、报表设计、组件化、表单设计、h5页面、调查问卷、pdf生成、流程图、试卷、SVG、图形元素、物联网、标签纸
https://xinglie.github.io/report-designer/
902 stars 232 forks source link

数据-单元格 #25

Open xinglie opened 3 years ago

xinglie commented 3 years ago

单元格元素用于数组数据源的单个排版,批量打印

第1步,从数据元素中,添加”单元格“元素到编辑区 image 可根据需要添加行、添加列、合并单元格等完成需要的界面排版

第2步,点击工具栏右侧的”数据源“面板或使用快捷键数字3(数据源面板目前默认关闭状态) 选择合适的数据源,如示例中的地区数据源

image

第3步,拖动数据源中1区的字段,到编辑区“单元格”元素的格子里,拖到相应格子可以放置时,会有可放置提示

image

松开鼠标即完成了单元格与数据源的绑定操作

image

当需要解除绑定时,点击单元格右上角的删除图标即可,当需要替换绑定数据源或数据字段时,直接拖动新的数据字段到相应单元格即可,元素会根据是否同一个数据源,自动删除旧的绑定

数据绑定后,单击相应的单元格,在右侧属性面板中,可以选择单元格内数据的展示形式,比如展示成文本或图片或其它任意需要的格式。

image

单元格内容类型不同,相应的可设置属性也会不一样。

自动撑高

格子默认最小高度即是编辑区设置的高度,当内容较多时,可以设置由内容把高度撑开,但需要注意的是,当一行上有合并单元格时,即使某一个单元格撑开导致合并的单元格也随之撑开,但它的高度依然是编辑时的高度。

打印

点右角的打印,会来到打印页面。在打印页面,会根据数据源中数据的多少,自动生成相应页数的打印,比如地区数据源有100条,则会生成100页。

xinglie commented 3 years ago

自动撑高功能因不好控制最终的打印界面,所以暂时被隐藏起来了,等寻到合适方案后再放开。