当前位置:   article > 正文

SpringBoot+Vue+EasyExcel实现Excel的导入导出_"使用vue+springboot+easyexcel response.setheader(\"c

"使用vue+springboot+easyexcel response.setheader(\"content-disposition\", \"atta"

导入EasyExcel的依赖:

  1. <dependency>
  2. <groupId>com.alibaba</groupId>
  3. <artifactId>easyexcel</artifactId>
  4. </dependency>

准备好实体类和VO:

  1. import com.baomidou.mybatisplus.annotation.*;
  2. import com.fasterxml.jackson.annotation.JsonFormat;
  3. import com.fasterxml.jackson.annotation.JsonIgnore;
  4. import io.swagger.annotations.ApiModel;
  5. import io.swagger.annotations.ApiModelProperty;
  6. import lombok.Data;
  7. import java.util.Date;
  8. import java.util.HashMap;
  9. import java.util.Map;
  10. @Data
  11. @ApiModel(description = "Subject")
  12. @TableName("subject")
  13. public class Subject {
  14. private static final long serialVersionUID = 1L;
  15. @ApiModelProperty(value = "id")
  16. private Long id;
  17. @ApiModelProperty(value = "创建时间")
  18. @JsonFormat(pattern = "yyyy-MM-dd HH:mm:ss")
  19. @TableField("create_time")
  20. private Date createTime;
  21. @ApiModelProperty(value = "更新时间")
  22. @JsonFormat(pattern = "yyyy-MM-dd HH:mm:ss")
  23. @TableField("update_time")
  24. private Date updateTime;
  25. @ApiModelProperty(value = "逻辑删除(1:已删除,0:未删除)")
  26. @JsonIgnore
  27. @TableLogic
  28. @TableField("is_deleted")
  29. private Integer isDeleted;
  30. @ApiModelProperty(value = "其他参数")
  31. @TableField(exist = false)
  32. private Map<String,Object> param = new HashMap<>();
  33. @ApiModelProperty(value = "类别名称")
  34. @TableField("title")
  35. private String title;
  36. @ApiModelProperty(value = "父ID")
  37. @TableField("parent_id")
  38. private Long parentId;
  39. @ApiModelProperty(value = "排序字段")
  40. @TableField("sort")
  41. private Integer sort;
  42. @ApiModelProperty(value = "是否包含子节点")
  43. @TableField(exist = false)
  44. private boolean hasChildren;
  45. }
  1. import com.alibaba.excel.annotation.ExcelProperty;
  2. import lombok.Data;
  3. /**
  4. * <p>
  5. * Dict
  6. * </p>
  7. *
  8. * @author qy
  9. */
  10. @Data
  11. public class SubjectEeVo {
  12. @ExcelProperty(value = "id" ,index = 0)
  13. private Long id;
  14. @ExcelProperty(value = "课程分类名称" ,index = 1)
  15. private String title;
  16. @ExcelProperty(value = "上级id" ,index = 2)
  17. private Long parentId;
  18. @ExcelProperty(value = "排序" ,index = 3)
  19. private Integer sort;
  20. }

导出:

 后端:

service:

  1. @Override
  2. public void exportData(HttpServletResponse response) {
  3. try {
  4. response.setContentType("application/vnd.ms-excel");
  5. response.setCharacterEncoding("utf-8");
  6. String fileName = URLEncoder.encode("课程分类","utf-8");
  7. response.setHeader("Content-disposition", "attachment;filename="+ fileName + ".xlsx");
  8. List<Subject> list = this.list();
  9. List<SubjectEeVo> listE = new ArrayList<>();
  10. for(Subject s:list){
  11. SubjectEeVo e = new SubjectEeVo();
  12. BeanUtils.copyProperties(s,e);
  13. listE.add(e);
  14. }
  15. EasyExcel.write(response.getOutputStream(),SubjectEeVo.class).sheet("课程分类").doWrite(listE);
  16. } catch (IOException e) {
  17. e.printStackTrace();
  18. }
  19. }

controller:

  1. @ApiOperation(value="导出")
  2. @GetMapping(value = "/exportData")
  3. public void exportData(HttpServletResponse response) {
  4. subjectService.exportData(response);
  5. }

前端:

导出按钮:

<el-button type="text" @click="exportData"><i class="fa fa-plus" /> 导出</el-button>

方法:

  1. exportData() {
  2. window.open('http://localhost:8301/admin/vod/subject/exportData')
  3. },

导入:

后端:

先创建一个监听器

  1. import com.alibaba.excel.context.AnalysisContext;
  2. import com.alibaba.excel.event.AnalysisEventListener;
  3. import com.atguigu.ggkt.model.vod.Subject;
  4. import com.atguigu.ggkt.vo.vod.SubjectEeVo;
  5. import com.atguigu.ggkt.vod.service.SubjectService;
  6. import org.springframework.beans.BeanUtils;
  7. import org.springframework.beans.factory.annotation.Autowired;
  8. import org.springframework.stereotype.Component;
  9. @Component
  10. public class SubjectListener extends AnalysisEventListener<SubjectEeVo> {
  11. @Autowired
  12. private SubjectService service;
  13. //一行一行读取
  14. @Override
  15. public void invoke(SubjectEeVo subjectEeVo, AnalysisContext analysisContext) {
  16. //调用方法添加数据库
  17. Subject subject = new Subject();
  18. BeanUtils.copyProperties(subjectEeVo,subject);
  19. service.save(subject);
  20. }
  21. @Override
  22. public void doAfterAllAnalysed(AnalysisContext analysisContext) {
  23. }
  24. }

接着在service中使用:

  1. @Autowired
  2. private SubjectListener subjectListener;
  3. @Override
  4. public void importDictData(MultipartFile file) {
  5. try {
  6. EasyExcel.read(file.getInputStream(),SubjectEeVo.class,subjectListener).sheet().doRead();
  7. } catch (IOException e) {
  8. e.printStackTrace();
  9. }
  10. }

controller:

  1. @ApiOperation(value = "导入")
  2. @PostMapping("importData")
  3. public Result importData(MultipartFile file) {
  4. subjectService.importDictData(file);
  5. return Result.ok(null);
  6. }

前端:

按钮:

<el-button type="text" @click="importData"><i class="fa fa-plus"/> 导入</el-button>

上传模块:

  1. <el-dialog title="导入" :visible.sync="dialogImportVisible" width="480px">
  2. <el-form label-position="right" label-width="170px">
  3. <el-form-item label="文件">
  4. <el-upload
  5. :multiple="false"
  6. :on-success="onUploadSuccess"
  7. :action="'http://localhost:8301/admin/vod/subject/importData'"
  8. class="upload-demo"
  9. >
  10. <el-button size="small" type="primary">点击上传</el-button>
  11. <div slot="tip" class="el-upload__tip">只能上传xls文件,且不超过500kb</div>
  12. </el-upload>
  13. </el-form-item>
  14. </el-form>
  15. <div slot="footer" class="dialog-footer">
  16. <el-button @click="dialogImportVisible = false">取消</el-button>
  17. </div>
  18. </el-dialog>

return中加入:

  1. return {
  2. dialogImportVisible: false
  3. }

方法中加入:

  1. importData() {
  2. this.dialogImportVisible = true
  3. },
  4. onUploadSuccess(response, file) {
  5. this.$message.info('上传成功')
  6. this.dialogImportVisible = false
  7. this.getSubList(0)
  8. }

声明:本文内容由网友自发贡献,不代表【wpsshop博客】立场,版权归原作者所有,本站不承担相应法律责任。如您发现有侵权的内容,请联系我们。转载请注明出处:https://www.wpsshop.cn/w/繁依Fanyi0/article/detail/283716?site
推荐阅读
相关标签
  

闽ICP备14008679号