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);
     },

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

三、效果如下:


相关文章
|
5天前
|
前端开发
调试前端时,在浏览器上修改参数并重新调用接口
有时候我们的页面点击过了,但是接口出问题,想修改参数再调用一次,一般是用apiPost工具把接口复制,再加上token和参数,但是这样非常的效率比较低。
53 0
|
3天前
|
前端开发 JavaScript
前端 JS 经典:Math 常用方法汇总
前端 JS 经典:Math 常用方法汇总
6 0
|
3天前
|
前端开发 JavaScript
前端 js 经典:Object 常用原生方法
前端 js 经典:Object 常用原生方法
10 2
|
3天前
|
前端开发 JavaScript
前端 js 经典:array 原生方法
前端 js 经典:array 原生方法
7 1
|
5天前
|
资源调度 前端开发 JavaScript
jenkins升级及基于jeecgboot 的nbcio-boot前端演示发布
jenkins升级及基于jeecgboot 的nbcio-boot前端演示发布
10 1
|
5天前
|
前端开发 JavaScript 开发者
实用技巧:提高前端开发效率的5个方法
提高前端开发效率是每个开发者都追求的目标。本文将介绍5个实用的技巧,帮助前端开发者提升工作效率:使用代码片段加速开发、合理利用浏览器开发者工具、充分利用现有框架和库、使用自动化构建工具、保持学习和不断优化工作流程。
|
5天前
|
前端开发 JavaScript 开发者
【Web 前端】数组迭代的方法有哪些?
【4月更文挑战第22天】【Web 前端】数组迭代的方法有哪些?
|
5天前
|
前端开发
【Web 前端】对于数组去重都有哪些方法?
【4月更文挑战第22天】【Web 前端】对于数组去重都有哪些方法?
|
5天前
|
前端开发 JavaScript
【Web 前端】JS继承的方法有哪些?
【4月更文挑战第22天】【Web 前端】JS继承的方法有哪些?
|
5天前
|
前端开发 JavaScript UED
【Web 前端】说几个未知宽高元素水平垂直居中方法?
【4月更文挑战第22天】【Web 前端】说几个未知宽高元素水平垂直居中方法?