反馈已提交

网络繁忙

当前为10.0版本文档,只有最新版本的文档支持在线编辑修改,如果想创建/编辑文档,请移步至 最新版帮助文档

第一张填报报表

  • 文档创建者:文档助手1
  • 历史版本:39
  • 最近更新:Carly 于 2022-08-15
  • 1. 概述

    1.1 学习视频

    本文学习视频:入门示例

    1.2  应用场景

    行式填报报表采用行式报表的样式,数据可以按行新增、修改和删除。

    2. 示例

    2.1 示例效果

    1)新增数据:

    填报预览时,选中某一行数据,点击增加记录按钮,在这行数据后面新增一行数据。

    Snag_8743c11.png

    2)修改数据:

    填报预览时,选中某一行数据,修改其中数据列的信息。

    Snag_86fec10.png

    3)删除数据:

    填报预览时,选中某一行数据,点击删除列行按钮,将这一行数据直接删除。

    Snag_87300e1.png

    2.2 数据准备

    新建数据集 ds1,数据库查询对话框中写入 SQL 查询语句SELECT * FROM S产品 ORDER BY 产品ID LIMIT 5,取出「S产品」表中按「产品ID」排序后的前五条数据。

    Snag_88fc40a.png

    2.3 报表设计

    1)A1~I1 单元格写入表格标题信息,选中 A1~I1 单元格,右边属性面板选择单元格属性>样式,样式下拉框选择预定义样式,给标题设置一个Head类型的样式。

    注:设置预定义样式不是填报模板制作的必要流程,可以视实际情况决定是否使用。

    Snag_8a78a58.png

    2)将数据集中的相关数据列按照标题字段依次拖入到 A2~I2 单元格,选中 A2~I2 单元格,将字体居中。选中 A1~I2 单元格,给表格整体添加预定义样式默认的天蓝色内外框。

    Snag_8aad388.png

    2.4 添加填报控件

    给单元格添加录入数据的控件,根据您的实际应用场景选择填报的控件类型,这边以文本控件为例。

    选中 A2~I2 单元格,右边属性面板选择控件设置,选择控件下拉框选择文本控件。根据实际应用场景设置控件属性。

    如果只想新增数据,不需要查看已有数据,可以不用新建数据集,直接给 A2~I2 空白单元格添加填报控件。如果只想要将数据集中的数据入库,没有修改和新增的需求,可以不给单元格添加填报控件。

    Snag_8b5091e.png

    2.5 设置填报属性

    设置填报属性的目的是为了将需要录入数据的单元格跟数据库表中的字段对应起来,确定这个单元格中录入的数据该写入到哪个数据库表下的哪个字段中。

    1)菜单栏选择模板>报表填报属性,打开报表填报属性设置对话框。

    Snag_9140622.png

    2)报表填报属性设置对话框选择提交,点击Snag_136208e2.png,新增一个内置SQL的数据提交方法。选择提交类型为智能提交,数据库为FRDemo,表为S产品。

    先后通过智能添加字段智能添加单元格功能将单元格与数据库表中的数据列绑定起来,勾选「产品ID」为主键,详细添加方式可参考:内置SQL提交。勾选未修改不更新,点击确定,即完成报表填报属性的设置。

    注1:勾选了 未修改不更新 后,进行填报时,页面上未修改的数据不会参与提交,具体介绍可参考填报未修改不更新

    注2:如果涉及到修改或删除需求,那么必须勾选一个或多个主键,这里的主键相当于 SQL 中 where 的效果,不同于数据库的主键。

    Snag_9236f24.png

    2.6 设置模板 Web 属性

    设置模板 Web 属性的目的是为了自定义填报预览的页面,包括工具栏、报表显示位置、标签页显示位置等等。

    注:设置模板 Web 属性不是填报模板制作的必要流程,也可直接使用默认的Web属性设置。

    1)菜单栏选择模板>模板Web属性,打开模板 Web 属性设置对话框。

    Snag_93bccef.png

    2)模板 Web 属性设置对话框中选择填报页面设置为该模板单独设置填报页面的 Web 属性。勾选填报当前编辑行背景设置,设置其背景色为#33cccc删除默认的顶部工具栏,从下方的工具库中通过双击的方式将控件添加到顶部工具栏,示例中添加的四个自定义控件分别为:提交、数据校验、插入记录、删除记录。其余选项采用默认设置,点击确定,即完成填报预览页面属性的设置。

    Snag_947e8e9.png

    3. 效果预览

    3.1 PC端

    1)点击保存按钮,保存报表。点击预览按钮,选择填报预览查看报表。

    Snag_97da10b.png

    2)新增数据:

    C89B41AD-BFCB-4F18-996C-D4C35637D1D0.GIF

    3)修改数据:

    C493F58A-C8F2-4F86-8C75-85F8D19CFED8.GIF

    4)删除数据:

    D688603D-42A2-4237-AAC7-1202D5BAF0AF.GIF

    3.2 移动端

    移动端查看报表的方式参见 报表移动端预览

    移动端预览时,不会显示填报工具栏,所以示例报表在移动端填报预览时,不能新增和删除数据,只能修改数据。如果想在移动端实现新增和删除效果,可在报表设计时添加插入删除行按钮,设置方法参见文档插入删除行

    Screenshot_20190905_161425_com.finereact.v10.jpg

    4. 已完成模板

    已完成模板可参见:%FR_HOME%\webroot\WEB-INF\reportlets\demo\NewbieGuide\行式填报报表.cpt

    点击下载模板:行式填报报表.cpt

    附件列表


    主题: 快速入门
    已经是第一篇
    已经是最后一篇
    • 有帮助
    • 没帮助
    • 只是浏览

    售前咨询电话

    400-811-8890转1

    在线技术支持

    请前往「服务平台」,选择「在线支持」

    热线电话:400-811-8890转2

    总裁办24H投诉

    热线电话:173-1278-1526