jeecgboot中前端使用带有参数报表的方法

简介: jeecgboot中前端使用带有参数报表的方法

   在实际开发中,jeecgboot里的在线开发里的报表配置带有参数的情况,所以需要如何调用这种报表,官方没有提出方法,我把我解决的办法写出来,供大家参考。

    一、带参数的选择有库存销售商品选择报表

如下:

select a.id,a.code,a.name,a.spu_id,a.category_id,a.brand_id,a.tax_rate,a.sale_tax_rate,a.spec,a.unit,a.status,b.purchase,b.sale,b.retail,c.stock_num from erp_goods a 
               left join erp_goods_price b on a.id = b.id left join erp_goods_stock c on a.id = c.goods_id  where a.status = '1' and c.sc_id = ${sc_id}
其中参数是为sc_id仓库id

二、调用上面带参数报表方法

首先定义一个参数param ,同时对选择商品id里设置调用的这个报表,设置如下:

这里采用popup类型,popupCode就是报表编码,param是传递的参数,设置如下

//自定义配置报表参数
        param:{
          sc_id: '',
        },
<a-col :span="8" >
            <a-form-model-item label="仓库ID" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="scId">
              <j-popup
                v-model="model.scId"
                 field="scId"
                org-fields="id"
                dest-fields="scId"
                code="SelectorWarehouse"
                :multi="false"
                @input="popupCallback"
                />
            </a-form-model-item>
          </a-col>
popupCallback(value,row){
       this.model = Object.assign(this.model, row);
       this.param.sc_id = this.model.scId;
       this.erpSaleOutDetailTable.columns[0].param = this.param;
       this.isAdd = true;
       console.log("popupCallback param=",this.param);
       console.log("popupCallback this.erpSaleOutDetailTable.columns[goodsId].param=",this.erpSaleOutDetailTable.columns[0].param);
     },

这样对选择仓库的时候进行处理,给参数赋值,这样就可以满足要求了。

三、效果如下:


相关文章
|
3月前
|
开发框架 前端开发 JavaScript
在Vue&Element前端项目中,使用FastReport + pdf.js生成并展示自定义报表
在Vue&Element前端项目中,使用FastReport + pdf.js生成并展示自定义报表
|
7天前
|
前端开发 JavaScript
前端基础(九)_this基本使用、this指向判断、改变this指向的方法
本文介绍了JavaScript中this的基本使用、this指向的判断以及改变this指向的方法。
21 1
前端基础(九)_this基本使用、this指向判断、改变this指向的方法
|
7天前
|
前端开发
前端基础(十四)_隐藏元素的方法
本文介绍了几种在前端开发中隐藏元素的方法,包括使用`display:none`、`visibility:hidden`、`opacity:0`等CSS属性,并提供了相应的示例代码。此外,还提到了其他隐藏元素的技巧,如通过设置元素位置、使用`overflow`属性和`filter`属性以及`rgba`颜色值来实现元素的隐藏。
27 1
前端基础(十四)_隐藏元素的方法
|
7天前
|
前端开发
前端基础(十一)_Float浮动、清除浮动的几种方法
本文介绍了浮动的概念、属性、特性以及清除浮动的几种方法,并通过实例演示了如何使用CSS实现元素的浮动和处理浮动带来的问题。
24 3
|
7天前
|
存储 前端开发 JavaScript
前端基础(十一)_函数声明及调用、函数的形参与实参、arguments参数、函数的参数类型、函数中的问题
本文介绍了JavaScript中函数的声明及调用、形参与实参的概念、arguments对象的使用、函数参数的类型以及函数中this的作用。通过示例代码详细解释了函数如何接收参数、如何处理参数个数不匹配的情况,以及函数在不同上下文中this的指向。
14 1
|
28天前
|
前端开发 JavaScript
前端ES5 | js —添加元素方法
前端ES5 | js —添加元素方法
|
2月前
|
前端开发 JavaScript
这篇文章介绍了如何使用form表单结合Bootstrap格式将前端数据通过action属性提交到后端的servlet,包括前端表单的创建、数据的一级和二级验证,以及后端servlet的注解和参数获取。
这篇文章介绍了使用AJAX技术将前端页面中表单接收的多个参数快速便捷地传输到后端servlet的方法,并通过示例代码展示了前端JavaScript中的AJAX调用和后端servlet的接收处理。
这篇文章介绍了如何使用form表单结合Bootstrap格式将前端数据通过action属性提交到后端的servlet,包括前端表单的创建、数据的一级和二级验证,以及后端servlet的注解和参数获取。
|
7天前
|
前端开发 JavaScript
前端JS截取url上的参数
文章介绍了两种前端JS获取URL参数的方法:手动截取封装和使用URLSearchParams。
20 0
|
2月前
|
JavaScript 前端开发 开发者
JS 继承之谜:究竟有哪些神秘方法?Web 前端开发者必知的关键技巧待你揭开谜底!
【8月更文挑战第23天】JavaScript (JS) 是 Web 前端开发的关键语言,其中继承是面向对象编程的重要概念。本文探讨了 JS 中几种继承机制:原型链继承、构造函数继承及组合继承。原型链继承利用原型对象实现属性和方法的共享;构造函数继承通过在子类构造器内调用父类构造器实现私有属性的复制;组合继承结合两者优点,既支持属性共享又避免了属性被意外覆盖的风险。理解这些模式有助于开发者更高效地组织代码结构,提升程序质量。
29 1
|
2月前
|
Java 开发者 关系型数据库
JSF与AWS的神秘之旅:如何在云端部署JSF应用,让你的Web应用如虎添翼?
【8月更文挑战第31天】在云计算蓬勃发展的今天,AWS已成为企业级应用的首选平台。本文探讨了在AWS上部署JSF(JavaServer Faces)应用的方法,这是一种广泛使用的Java Web框架。通过了解并利用AWS的基础设施与服务,如EC2、RDS 和 S3,开发者能够高效地部署和管理JSF应用。文章还提供了具体的部署步骤示例,并讨论了使用AWS可能遇到的挑战及应对策略,帮助开发者更好地利用AWS的强大功能,提升Web应用开发效率。
51 0
下一篇
无影云桌面