如何用web表格控件FineReport做web表格

1、下面我们以一个简单的示例来体会体会一下表单。最终效果如下：

3、拖入组件如上图所示的效果图，我们可以看到该表单需要有1个下拉框控件以及对应的1个标签控件和一个查询遽牟赓雁按钮，还需要一个以表格形式显示数据的报表块和显示图表的图表块，此时，我们确定了需要在表单中添加一个报表块，一个图表块，3个控件。注：在组件介绍中，我们知道控件即可依附于参数面板组件存在，也可以单独以组件的形式存在，在这里可随意使用哪种形式，效果都一样，那么使用依附于参数面板组件存在的形式。参数组件从工具栏中将参数组件拖拽至表单主体中，并将相应的三个控件：下拉框、文本控件和查询按钮拖拽至参数组件中，并设置标签控件的控件值为：客户，如下图：

5、注：如果组件数量过多，在web端展示的时候自适应在一页内显示会比较拥挤，那么此时可以在右侧下方选中整体框架body，在右侧上方的属性表中将组件缩放修改为自适应原样缩放，如下图：

7、控件绑定数据定义数据集效果图中，新建数据集ds1：SELECT 产品名称,库存量,产品.成本价 ,产品.单价 FROM 订单,订单明细,产品 wher髫潋啜缅e 客户ID='${company}'and 订单.订单ID=订单明细.订单ID and 订单明细.产品ID=产品.产品ID，参数company的默认值为VINET,。注：参数名字必须与客户ID下拉框控件名称保持一致。客户下拉框控件选中下拉框控件拖拽到适当位置，下拉框控件名设为“company”，数据字典来自FRDemo数据库的客户表（数据类型选择数据库表，数据库选择FRDemo），实际值和显示值分别为客户ID和客户名称，控件值为VINET：

9、新建数据集效果图中，报表块里面要显示订单明细数据，根据客户ID进行过滤，新建数据集ds2：select * from 订单 where 客户ID='${company}'，company默认值为VINET.表样设计如下图所示，设计表样：

11、图表块鼠标选中图表块所在区域，为该图表绑定数据，图表数据源来源于数据集数据源，其分类系列设置如下：

13、注：设置条件选择系列序号的时候需要与数据绑定时的数据列顺序相匹配，在上图设置图表数倌栗受绽据时，库存量、成本价和单价的系列序号依次为1、2、3，条件属性主要是设置库存量系列用柱形图展示，成本价和单价用折线图展示并使用次坐标轴。在添加一个组合图时，会默认添加2个条件属性，详细请查看组合图到此为止，表单就已经制作好了。