前后端分离时导入excel
程序员文章站
2024-03-20 20:31:16
...
前端页面:
<article class="page-container">
<form action="" method="post" class="form form-horizontal" enctype="multipart/form-data" id="form-duty-upload">
<div id="tab-category" class="HuiTab">
选择文件:
<span class="btn-upload form-group">
<input class="input-text upload-url radius" type="text" name="uploadfile-1" id="uploadfile-1" readonly><a href="javascript:void();" class="btn btn-primary radius"><i class="Hui-iconfont"></i> 浏览文件</a>
<input type="file" multiple name="file" id="file" class="input-file">
</span>
<p style="color: red;">上传的文件必须解密,不然会出现导入失败</p>
<div class="row cl">
<div class="col-xs-8 col-sm-9 col-xs-offset-4 col-sm-offset-3">
<input class="btn btn-primary radius" type="submit" value=" 提交 ">
</div>
</div>
</div>
</form>
</article>
前端js:
<script type="text/javascript">
$("#form-duty-upload").validate({
onkeyup:false,
focusCleanup:true,
success:"valid",
submitHandler:function(form){
var uploadFile = new FormData($("#form-duty-upload")[0]);
uploadFile.enctype="multipart/form-data";
var controlType = parent.$("#controlType_hide").val()
uploadFile.append("controlType",controlType);
var addDicParam = {
url:ss.urlMapping['UPLOADDATA'],
param: uploadFile,
callback:function(data){
var code = data.returnCode;
if(code == '1'){
var index = parent.layer.getFrameIndex(window.name);
parent.$('#search_btn').click();
parent.layer.close(index);
}else{
$.Huimodalalert(data.data,4000);
}
},
errCallback: function () {
$.Huimodalalert('导 入 信 息 失 败',2000);
}
}
ss.upload(addDicParam);
}
});
</script>
ss.upload方法:
ss.upload = function(params){
console.info(params.param);
return $.ajax({
type: "POST",
url: params.url,
cache: false,
data: params.param,
processData: false,
contentType: false,
dataType:"json",
/*enctype:"multipart/form-data",*/
success: function (data) {
if(data.returnCode == '401' || data.returnCode == '403'){
location.href="/";
return null;
}else{
if (undefined !== params.callback) {
params.callback(data);
}
}
},
error: function (XMLHttpRequest, textStatus, errorThrown) {
if (params.errCallback) {
params.errCallback(XMLHttpRequest, textStatus, errorThrown);
}else{
var errorMsg = "网络异常,请重新进入";
alert(errorMsg);
}
}
});
};
后台java代码:
@RequestMapping(value = "import")
@ResponseBody
public ResultMsg<Object> importDuty(@RequestParam("file") MultipartFile file, HttpServletRequest request){
long createdBy = (long)request.getSession().getAttribute("CURRENT_USER");
ResultMsg<Object> rs = new ResultMsg<Object>();
boolean a = false;
String fileName = file.getOriginalFilename();
try {
a = driverBenefitService.batchImport(fileName, file, createdBy);
rs = ResultMsg.returnMsgSuccess("文件导入成功");
} catch (Exception e) {
e.printStackTrace();
logger.error(e.getMessage());
rs = ResultMsg.returnMsgFail(e.getMessage());
}
return rs;
}
上一篇: java+vue前后端分离:关于excel导入的几种方式
下一篇: Maven和Maven插件