分sheet,自定义表头导出表格

原创

已于 2022-06-14 14:32:54 修改 · 991 阅读

1 ·

CC 4.0 BY-SA版权

文章标签：

#angular.js #前端 #javascript

于 2019-01-20 21:52:34 首次发布

  在一次做项目时,需要导出自定义的表格,然后就有了这次实践,然后分享给大家仅供参考!

表格样式展示

在这里插入图片描述

先看数据结构

0 = {ExamExamRoomListModel@10157} "ExamExamRoomListModel(super=com.tfjybj.itoo.exam.model.ExamExamRoomListModel@772bec3f, examId=1081922739738075137, examName=税法与税务会计考试, examTimeSlot=15:51--17:50, examDate=2019-01-07 , examRoomId=1081922887100751874, examRoomName=实训楼103机房, invigilatorMainId=1071011036863262722, invigilatorMainName=李仲林, invigilatorSubId=1071010777927905281, invigilatorSubName=甄立, week=null,
 // 孩子节点
    childList=[ExamExamineeListModel(super=com.tfjybj.itoo.exam.model.ExamExamineeListModel@88bb82c3, examineeId=1081922887767646209, examineeName=安紫莹, examineeCode=17090134022,  examineeClass=17级会计专科4班), ExamExamineeListModel(super=com.tfjybj.itoo.exam.model.ExamExamineeListModel@fd7a732a, examineeId=1081922887776034817, examineeName=白雨, examineeCode=17090134012,  examineeClass=17级会计专科4班), ExamExamineeListModel(super=com.tfjybj.itoo.exam.model.ExamExamineeListModel@6b05208e, examineeId=1081922887780229121, examineeName=陈梦丽, examineeCode=17090134039,  examineeClass=17级会计专科4班), ExamExamineeListModel(super=com.tfjybj.itoo.exam"

前端方法

// 前端调取样式(angular)   
  /**
     * 导出考生签到表(ts中的方法,在HTML中调取就哦了)
     * @since 2019-1-8 20:57:36
     * @author Ryan
     */
    checkInTable() {
        const excel = [];
        this.checkedItem.forEach(
            item => {
                excel.push(item.id);
            }
        );
        let url: string;
        if (excel.length === 0) {
            this.openAndCloseAll();
            // this.tipMsgService.createMessage('温馨提示', '请选择要导出的数据');
        } else {
            url = 'exam-web/examinee/customExportExcel/' + '?examIdList='+excel;
            const downURL = this.http.getServerUrl(url);
            window.open(downURL);
            URL.revokeObjectURL(downURL);
        }
    }

后端方法

  // controller方法中的方法定义
	@ApiOperation(value = "导出Excel表格,分sheet,自定义表头")
    @GetMapping(value = "/customExportExcel")
    public void customExportExcel(@RequestParam List<String> examIdList,HttpServletRequest request,
                                  HttpServletResponse response) {
        examineeService.customExportExcel(examIdList,request,response);
    }
	// 接口层省略..............
	
	/**
	 * @param examIdList 这个是传的实体集合
	*/
	@Override
    public void customExportExcel(List<String> examIdList, HttpServletRequest request, HttpServletResponse response) {
		/**
		* 利用前端传过来的参数,查询所要的数据
		*/
        List<ExamExamRoomListModel> newInfomation = new ArrayList<>();
        List<ExamExamRoomListModel> examExamRoomListModelList = examRoomService.selectExamAndExamRoomInfomation(examIdList);
        examExamRoomListModelList.forEach(examExamRoomListModel -> {
            ExamExamRoomListModel exam = new ExamExamRoomListModel();
            examExamRoomListModel.setExamRoomName(examExamRoomListModel.getExamRoomName().substring(0, examExamRoomListModel.getExamRoomName().indexOf("-")));
            List<ExamExamineeListModel> examExamineeListModels = examineeDao.selectExamineeInfomation(examExamRoomListModel.getExamId(), examExamRoomListModel.getExamRoomId());
            BeanUtils.copyProperties(examExamRoomListModel, exam);
            exam.setChildList(examExamineeListModels);
            newInfomation.add(exam);
        });
        // 开始构建表格,自定义表头 
        try {
            //在excel中的第3行每列的参数
            String[] head0 = new String[]{"考试时间", "考试时间", "考试时间", "考试时间", "考试时间", "地点", "地点", "地点", "考生人数", "考生人数",
            };
            //在excel中的第4行每列（合并列）的参数
            String[] head1 = new String[]{"座位号", "姓名", "学号", "班级", "学生签名", "座位号", "姓名", "学号", "班级", "学生签名",};
            //对应excel中的行和列，下表从0开始{"开始行,结束行,开始列,结束列"}
            String[] headnum0 = new String[]{"2,2,1,5", "2,2,6,8", "2,2,9,10"};
            //需要显示在excel中的参数对应的值，因为是用map存的，放的都是对应的key
            String[] colName = new String[]{"seatNu