导入的文件

前端点击上传得到文件（MultipartFile file 【这里是存放的临时文件】）

• 本人前端用的vue3，elementui,
• 导入按钮代码

<!--导入文件 -->
      <el-col :span="1.5">
        <el-button type="info"
                   plain
                   icon="el-icon-upload"
                   size="mini"
                   @click="handleImport"
                   v-hasPermi="['production:monthly_production_plan:import']"
        >导入</el-button>
      </el-col>

• 弹出框代码

<!-- 月度焊接计划导入对话框 -->
    <el-dialog :title="upload.title"
               :visible.sync="upload.open"
               width="400px"
               append-to-body
               :close-on-click-modal="false">
      <el-upload ref="upload"
                 :limit="1"
                 accept=".xlsx, .xls"
                 :headers="upload.headers"
                 :action="upload.url + '?updateSupport=' + upload.updateSupport"
                 :disabled="upload.isUploading"
                 :on-progress="handleFileUploadProgress"
                 :on-success="handleFileSuccess"
                 :auto-upload="false"
                 drag>
        <i class="el-icon-upload"></i>
        <div class="el-upload__text">
          将文件拖到此处，或
          <em>点击上传</em>
        </div>
        <div class="el-upload__tip"
             style="color:red"
             slot="tip">提示：仅允许导入“xls”或“xlsx”格式文件！</div>
      </el-upload>
      <div slot="footer"
           class="dialog-footer">
        <el-button type="primary"
                   @click="submitFileForm">确 定</el-button>
        <el-button @click="upload.open = false">取 消</el-button>
      </div>
    </el-dialog>

• js代码 return{}层（upload参数）前端不清楚的请先看一下vue 框架官方文档

return {
      //导入
      upload: {
        // 是否显示弹出层（导入）
        open: false,
        // 弹出层标题（导入）
        title: "",
        // 是否禁用上传
        isUploading: false,
        // 是否更新已经存在的数据
        updateSupport: 0,
        // 设置上传的请求头部
        headers: { Authorization: "Bearer " + getToken() },
        // 上传的地址（后台接口）
        url: process.env.VUE_APP_BASE_API + "/production/monthly_production_plan/importData"
      },
    }; 

• js代码 methods: {}中使用方法

methods: {
    /** 导入按钮操作 */
    handleImport() {
      console.log(this)
      this.upload.title = "焊接月度生产计划导入";
      this.upload.open = true;
    },
    /** 下载模板操作 */
    importTemplate() {
      this.download('production/monthly_production_plan/importTemplate', {
      }, `焊接月度生产计划_${new Date().getTime()}.xlsx`)
    },
     // 文件上传中处理
    handleFileUploadProgress(event, file, fileList) {
      this.upload.isUploading = true;
    },
    // 文件上传成功处理
    handleFileSuccess(response, file, fileList) {
      this.upload.open = false;
      this.upload.isUploading = false;
      this.$refs.upload.clearFiles();
      this.$alert("<div style='overflow: auto;overflow-x: hidden;max-height: 70vh;padding: 10px 20px 0;'>" + response.msg + "</div>", "导入结果", { dangerouslyUseHTMLString: true });
      this.getList();
    },
    // 提交上传文件
    submitFileForm() {
      this.$refs.upload.submit();
    }
}

mysql数据表

drop table if exists iot_dos_welding_monthly_production_plan;
CREATE TABLE `iot_dos_welding_monthly_production_plan` (
  `id` bigint unsigned NOT NULL AUTO_INCREMENT COMMENT '主键id',
  `planned_time` date DEFAULT NULL COMMENT '计划时间',
  `planned_output` Double DEFAULT NULL COMMENT '计划产量',
    `updated_by` varchar(100) CHARACTER SET utf8mb4 COLLATE utf8mb4_0900_ai