若依框架中导入excel文件功能的实现

前端代码：

数据导入对话框 

   <!-- 数据导入对话框 -->
   <el-dialog title="数据导入" v-model="excelOpen" width="400px" append-to-body>
     <el-upload ref="uploadRef" class="upload-demo" 
     :action="uploadExcelUrl" 
     :headers="headers"
      :auto-upload="false"
       :on-success="handleUploadSuccess" 
       :on-error="handleUploadError" 
       :before-upload="handleBeforeUpload"
       :limit="1"
       >
       <template #trigger>
         <el-button type="primary" style="margin-right: 15px;">上传文件</el-button>
       </template>
       <el-button type="success" @click="submitUpload">
         上传
       </el-button>
       <template #tip>
         <div class="el-upload__tip">
           上传文件仅支持xls/xlsx格式，文件大小不得超过1M
         </div>
       </template>
     </el-upload>
   </el-dialog>

js

/* 打开数据导入对话框*/
const excelOpen = ref(false);
function handleImport() {
  excelOpen.value = true;
}
/* 上传文件*/
const uploadRef = ref({});
function submitUpload() {
  uploadRef.value.submit();
}
/* 上传地址*/
const uploadExcelUrl = ref("import.meta.env.VITE_APP_BASE_API + '/manage/sku/import");//上传excel文件地址
/* 上传请求头*/
const headers = ref({ Authorization: "Bearer" + getToken() });

// 上传成功回调
function handleUploadSuccess(res, file) {
  if (res.code === 200) {
    proxy.$modal.msgSuccess("上传excel成功");
    excelOpen.value = false;
    getList();
  } else {
    proxy.$modal.msgError(res.msg);
  }
  uploadRef.value.clearFiles();
  proxy.$modal.closeLoading();
}

// 上传失败
function handleUploadError() {
  proxy.$modal.msgError("上传excel失败");
  uploadRef.value.clearFiles();
  proxy.$modal.closeLoading();
}

// 上传前的校验
const props = defineProps({
  modelValue: [String, Object, Array],
  // 大小限制(MB)
  fileSize: {
    type: Number,
    default: 1,
  },
  // 文件类型, 例如['xls', 'xlsx']
  fileType: {
    type: Array,
    default: () => ["xls", "xlsx"],
  }
});

// 上传前loading加载
function handleBeforeUpload(file) {
  let isExcel = false;
  if (props.fileType.length) {
    let fileExtension = "";
    if (file.name.lastIndexOf(".") > -1) {
      fileExtension = file.name.slice(file.name.lastIndexOf(".") + 1);
    }
    isExcel = props.fileType.some(type => {
      if (file.type.indexOf(type) > -1) return true;
      if (fileExtension && fileExtension.indexOf(type) > -1) return true;
      return false;
    });
  }
  if (!isExcel) {
    proxy.$modal.msgError(
      `文件格式不正确, 请上传${props.fileType.join("/")}格式文件!`
    );
    return false;
  }
  if (props.fileSize) {
    const isLt = file.size / 1024 / 1024 < props.fileSize;
    if (!isLt) {
      proxy.$modal.msgError(`上传excel大小不能超过 ${props.fileSize} MB!`);
      return false;
    }
  }
  proxy.$modal.loading("正在上传excel，请稍候...");
}
 

后端代码：

controller层

/**
* 导入商品管理列表
*/
@PreAuthorize("@ss.hasPermi('manage:sku:add')")
@Log(title = "商品管理", businessType = BusinessType.IMPORT)
@PostMapping("/import")
public AjaxResult excelImport(MultipartFile file) throws Exception{
ExcelUtil<Sku>util=new ExcelUtil<Sku>(Sku.class);
List<Sku> skuList = util.importExcel(file.getInputStream());
return toAjax(skuService.insertSkus(skuList));
}

service层

/**
* 批量新增商品管理
* @param skuList
* @return 结果
*/
public int insertSkus(List<Sku> skuList);
}

serviceImpl

/**
* 批量新增商品管理
* @param skuList
* @return 结果
*/
@Override
public int insertSkus(List<Sku> skuList) {
return skuMapper.insertSkus(skuList);
}

mapper层

/**
* 批量新增商品管理
* @param skuList
* @return 结果
*/
public int insertSkus(List<Sku> skuList);
}

mapper.xml

<insert id="insertSkus" parameterType="java.util.List" useGeneratedKeys="true" keyProperty="skuId">
INSERT INTO tb_sku (
sku_name,
sku_image,
brand_Name,
unit,
price,
class_id
)
VALUES
<foreach collection="list" item="sku" index="index" separator=",">
(
#{sku.skuName},
#{sku.skuImage},
#{sku.brandName},
#{sku.unit},
#{sku.price},
#{sku.classId}
)
</foreach>
</insert>

导入----批量新增