vue-element 文件上传 + java 从服务器读取excel文件并解析

2 篇文章 0 订阅

vue-element 文件上传

<template>
<div style="padding-left:200px;width:400px" >
  <el-upload style="width:100px;"
  class="upload-demo"
  ref="upload"
  :limit="1"
  :before-upload="beforeUpload"
  :on-success="handleSuccess"
  :on-error="handleError"
  action="https://test.qunhongyun.com:8500/file/upload" >
  <el-button size="primary" type="primary">导入号码</el-button> 
 
  </el-upload>
    <div style="font-size: 13px;margin-top: 10px;margin-bottom: 10px;" v-if="this.isUploadSuccess===1">
          <i class="el-icon-info" style="color: #3bd10a;"></i>
          <span style="color: #3bd10a; padding-left:10px">导入成功</span>
    </div>
    <div style="font-size: 13px;margin-top: 10px;margin-bottom: 10px;" v-if="this.isUploadSuccess===2">
          <i class="el-icon-info" style="color: red;"></i>
          <span style="color: red; padding-left:10px">导入失败,请重新上传</span>
    </div>
</div>
</template>

<script>

export default {
  name: 'upload',
  data() {
    return {
      isUploadSuccess:0,
    }
  },
  methods: {
    // 上传文件
    beforeUpload(file) {
      let isLt2M = true
      isLt2M = file.size / 1024 / 1024 < 3
      if (!isLt2M) {
        this.loading = false
        this.$message.error('上传文件大小不能超过 3MB!')
        this.isUploadSuccess = 2;
        return;
      }

      let fileName = file.name;
      let pos = fileName.lastIndexOf(".");
      let lastName = fileName.substring(pos, fileName.length);
      console.log(lastName,lastName.toLowerCase());
      if (
        lastName.toLowerCase() !== ".xls"&&
        lastName.toLowerCase() !== ".xlsx"
      ) {
        this.$message.error("文件必须为.xls .xlsx类型");
        this.$refs.upload.clearFiles()
        this.isUploadSuccess = 2;
        return false;
      }

      return isLt2M;

    },
    handleSuccess(response, file, fileList) {
      this.isUploadSuccess = 1;
      this.$refs.upload.clearFiles()
      this.$message({
        message: '上传成功',
        type: 'success'
      })
      console.log(response);
      this.formData.fileId = response.content.id;
    },
    // 监听上传失败
    handleError(e, file, fileList) {
      const msg = JSON.parse(e.message)
      this.isUploadSuccess = 2;
       this.$message.error(msg.message);

      this.loading = false
    },
  }
}
</script>

java 从服务器读取excel文件并解析

MAVEN

 <!--解析表格用的 -->
        <dependency>
            <groupId>org.apache.poi</groupId>
            <artifactId>poi</artifactId>
            <version>3.15</version>
        </dependency>
        <dependency>
            <groupId>org.apache.poi</groupId>
            <artifactId>poi-ooxml</artifactId>
            <version>3.15</version>
        </dependency>

代码

//excel文件路径
public static void main(String[] args){

		try {
		     Workbook wb =getWorkbook(path);
		
		     //开始解析
		     //读取sheet 0
		     Sheet sheet = wb.getSheetAt(0);
		     //第一行是列名,所以不读
		     int firstRowIndex = sheet.getFirstRowNum() + 1;
		     int lastRowIndex = sheet.getLastRowNum();
		
		     //遍历行
		     for (int rIndex = firstRowIndex; rIndex <= lastRowIndex; rIndex++) {
		         Row row = sheet.getRow(rIndex);
		
		         if (row != null) {
		             int indexMin=row.getFirstCellNum();
		             int indexMax=row.getLastCellNum();
		             for (int i = indexMin; i < indexMax; i++) {
		
		                 Cell cell=row.getCell(i);
		                 String cellValue = getCellValue(cell);
		                 if(cellValue!=null){
		                     System.out.println(cellValue);
		                 }
		             }
		         }
		     }
		
		 } catch (Exception e) {
		     e.printStackTrace();
		 }
	 }
    public static Workbook getWorkbook(String path) throws Exception{
        String type = path.substring(path.lastIndexOf(".") + 1);
        Workbook wb;
        //根据文件后缀(xls/xlsx)进行判断
        InputStream input = new URL(path).openStream();
        if ("xls".equals(type)) {

            //文件流对象
            wb = new HSSFWorkbook(input);
        } else if ("xlsx".equals(type)) {
            wb = new XSSFWorkbook(input);
        } else {
            throw new Exception("文件 类型错误");
        }
        return wb;
    }


    public static   String getCellValue(Cell cell) {
        String cellValue = "";
        // 以下是判断数据的类型
        switch (cell.getCellTypeEnum()) {
            case NUMERIC: // 数字
                if (org.apache.poi.ss.usermodel.DateUtil.isCellDateFormatted(cell)) {
                    SimpleDateFormat sdf = new SimpleDateFormat("yyyy-MM-dd");
                    cellValue = sdf.format(org.apache.poi.ss.usermodel.DateUtil.getJavaDate(cell.getNumericCellValue())).toString();
                } else {
                    DataFormatter dataFormatter = new DataFormatter();
                    cellValue = dataFormatter.formatCellValue(cell);
                }
                break;
            case STRING: // 字符串
                cellValue = cell.getStringCellValue();
                break;
            case BOOLEAN: // Boolean
                cellValue = cell.getBooleanCellValue() + "";
                break;
            case FORMULA: // 公式
                cellValue = cell.getCellFormula() + "";
                break;
            case BLANK: // 空值
                cellValue = "";
                break;
            case ERROR: // 故障
                cellValue = "非法字符";
                break;
            default:
                cellValue = "未知类型";
                break;
        }
        return cellValue;
    }
  • 0
    点赞
  • 4
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
Spring Boot、Vue-Element-Admin和MyBatis是一种常见的技术组合,用于构建现代化的Web应用程序。下面是一个简要的入门教程。 1. 首先,我们需要设置Spring Boot项目。可以使用Spring Initializr(https://start.spring.io/)来初始化一个基本的Spring Boot项目。在依赖项中添加Spring Web、Spring Data JPA和MyBatis等必要的依赖项。 2. 在Spring Boot项目中,我们需要创建实体类和数据库表的映射。使用JPA注解来定义实体类,并使用MyBatis注解来指定数据库表的映射。 3. 接下来,我们需要创建一个数据访问层(DAO)来处理与数据库的交互。使用MyBatis的注解或XML映射文件来定义SQL查询和操作。 4. 在Service层,编写业务逻辑代码来处理DAO返回的数据,并与其他组件进行交互。 5. 在Controller层,处理HTTP请求和响应,将数据传递给前端页面或接收前端发送的数据。使用Spring MVC注解来定义请求映射和参数解析。 6. 在前端方面,可以使用Vue-Element-Admin来构建用户界面。Vue是一种流行的JavaScript框架,用于构建灵活的单页面应用程序。Element-Admin是一个基于Vue的组件库,提供了丰富的UI组件和布局。 7. 在Vue-Element-Admin中,我们可以使用Vue Router来实现页面之间的导航和路由。使用axios来发送HTTP请求与后端进行数据交互。 8. 在Vue组件中,我们可以通过调用后端的API来获取数据并渲染到前端页面上。使用Element-Admin提供的布局和UI组件来美化页面。 通过上述步骤,我们可以实现一个基本的Spring Boot、Vue-Element-Admin和MyBatis的入门教程。这个教程可以帮助初学者了解如何搭建和使用这个技术组合来构建现代化的Web应用程序。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值