(以菜单管理所配置的导出功能为例进行举例说明)

1.前端vue中的button按钮添加单击事件:(参数为导出文件名称)

@click="handleExportXls('菜单信息')"

2.前端vue中导入混入文件(也可在前端页面直接添加第3步的方法):

import { JeecgListMixin } from '@/mixins/JeecgListMixin'

3.混入js文件中的对应导出方法:JeecgListMixin

handleExportXls(fileName){
      if(!fileName || typeof fileName != "string"){
        fileName = "导出文件"
      }
      let param = {...this.queryParam};
      if(this.selectedRowKeys && this.selectedRowKeys.length>0){
        param['selections'] = this.selectedRowKeys.join(",")
      }
      console.log("导出参数",param)
		//data返回下载文件大小size和文件类型type
		//接口第一个参数为对应controller层方法地址(配置方法在第4步)
      downFile(this.url.exportXlsUrl,param).then((data)=>{
        if (!data) {
          this.$message.warning("文件下载失败")
          return
        }
        if (typeof window.navigator.msSaveBlob !== 'undefined') {
          window.navigator.msSaveBlob(new Blob([data],{type: 'application/vnd.ms-excel'}), fileName+'.xls')
        }else{
          let url = window.URL.createObjectURL(new Blob([data],{type: 'application/vnd.ms-excel'}))
          let link = document.createElement('a')
          link.style.display = 'none'
          link.href = url
          link.setAttribute('download', fileName+'.xls')
          document.body.appendChild(link)
          link.click()
          document.body.removeChild(link); //下载完成移除元素
          window.URL.revokeObjectURL(url); //释放掉blob对象
        }
      })
    },

4.前端vue的data.return中添加,例如:

url: { exportXlsUrl: '/sys/permission/exportXls', },

也可以在第3步传递参数时设置,不过不建议此种用法,不方便统一管理配置

5.后端对应Controller层添加exportXls方法:

	  /**
	  * 导出excel
	  *
	  * @param request
	  */
	 @RequestMapping(value = "/exportXls")
	 public ModelAndView exportXls(SysPermission sysPermission, HttpServletRequest request) {
		 // Step.1 组装查询条件
		 QueryWrapper<SysPermission> queryWrapper = QueryGenerator.initQueryWrapper(sysPermission, request.getParameterMap());
		 //Step.2 AutoPoi 导出Excel
		 ModelAndView mv = new ModelAndView(new JeecgEntityExcelView());
		 //update-begin--Author:kangxiaolin  Date:20180825 for:[03]用户导出,如果选择数据则只导出相关数据--------------------
		 String selections = request.getParameter("selections");
		 if(!oConvertUtils.isEmpty(selections)){
			 queryWrapper.in("id",selections.split(","));
		 }
		 //update-end--Author:kangxiaolin  Date:20180825 for:[03]用户导出,如果选择数据则只导出相关数据----------------------
		 List<SysPermission> pageList = sysPermissionService.list(queryWrapper);

		 //导出文件名称
		 mv.addObject(NormalExcelConstants.FILE_NAME, "测试导出列表");
		 mv.addObject(NormalExcelConstants.CLASS, SysPermission.class);
		 LoginUser user = (LoginUser) SecurityUtils.getSubject().getPrincipal();
		 ExportParams exportParams = new ExportParams("测试列表数据", "导出人:"+user.getRealname(), "导出信息");
		 //exportParams.setImageBasePath(upLoadPath);//导出内容中的照片的存放路径(如果导出的表中无图片则不需要)
		 mv.addObject(NormalExcelConstants.PARAMS, exportParams);
		 mv.addObject(NormalExcelConstants.DATA_LIST, pageList);
		 return mv;
	 }

6.后端对应entity实体类中,为要导出的属性添加Excel注解,例如:

	/**
	 * 菜单名称
	 */
	@Excel(name="菜单名称",width=15)
	private String name;

Excel注解的其他参数参考:Excel 注解说明

以上完成导出功能

Logo

前往低代码交流专区

更多推荐