EasyUI的filebox组件实现多文件上传的步骤
新增回款记录详情里面有个添加回款记录文件的按钮,点击选择文件,文件既可以选择一个也可以选择多个
![a77fa55cfbc18a1dc5498deda1ac9d41.png](https://i-blog.csdnimg.cn/blog_migrate/558684ae2220df54069d986c5c9cc8cb.png)
<tr height="35px">
<td width="25%" height="20px" align="right">添加回款记录:td>
<td width="75%" height="20px" align="left">
<input class="easyui-filebox" data-options=" buttonText: '选择文件',prompt:'浏览'" multiple="true" id="addFfile" name="file" style="width:90%" onchange="checkFile()" />
td>
tr>
通过添加回款记录文件的id
,如下js的写法是根据官网来写的,先在前台把添加回款记录记录的一个改成多个,把multiple:true
的注释给去掉
//easyui 文件框
$('#addFfile').filebox({
buttonText: '选择文件', //按钮文本
buttonAlign: 'right', //按钮对齐
multiple: true, //是否多文件方式
onChange: function (e) {
checkFile();
}
});
//控制上传文件格式
function checkFile(){
var fileTypes = ['.jpg', '.jpeg', '.bmp', '.png', '.gif','.pdf'];
var filePath = $('#addFfile').textbox('getValue');
/* if (filePath != '') */
{
var flag = false;
var fileType = filePath.substring(filePath.lastIndexOf("."));
var beginIndex = fileType
if(fileTypes && fileTypes.length>0){
for (var i = 0; i if(fileTypes[i]==fileType){
flag = true;
break;
}
}
}
if (!flag) {
alert('不接受'+fileType+'文件类型上传');
$('#addFfile').textbox('setValue', '');
return;
}
}
}
新增销售合同详情信息SalesDetailsController
在新增销售合同详情信息SalesDetailsController
类的addSalesDetails
方法里面加个MultipartFile[] files
参数,然后获取到properties
配置文件里的上传路径,给salesDetails
设置随机ID
,循环传过来的文件,在循环的过程中。先判断文件里面是否有文件名,有的话就上传,给上传的附件设置随机ID,把合同详情的id
赋值给附件的parentId
,再通过attachmentdao.insertAtt(att)
;保存上传的附件
/**
* 新增销售合同详情信息
* @param person
* @param request
* @return
* @throws IOException
*/
@RequestMapping(value="/addSalesDetails",method= RequestMethod.POST)
@ResponseBody
public Map addSalesDetails(SalesDetails salesDetails,HttpServletRequest request,@RequestParam("file") MultipartFile[] files) throws IOException{
//获取登录人信息
User user= (User) request.getSession().getAttribute("user");
//日志类型,操作人,操作内容,操作人IP,操作方法
//financeSalesDetailsService.insertSysLog("新增",user.getTrueName(),"新增人员信息: "+financeSalesDetailsService.getName(),user.getLoginIp(),"/person/addPerson");
Map map = new HashMap();
String uploadDir = ConfigUtil.getConfig("upload.dir");
salesDetails.setId(UUID.randomUUID().toString().replaceAll("-", ""));for (MultipartFile file : files) {if (StringUtils.isNotBlank(file.getOriginalFilename())) {
Attachment att = FileUpload.upload(file, uploadDir, "salesDetails");
att.setId(UUID.randomUUID().toString().replaceAll("-", ""));
att.setParentId(salesDetails.getId());
attachmentdao.insertAtt(att);
}else {continue;
}
}
salesDetailsService.addSalesDetails(salesDetails, user);//新增人员信息return map;
}
新增销售合同详情信息SalesDetailsServiceImpl
@Override
public Map addSalesDetails(SalesDetails salesDetails, User user) {
// salesDetails.setId(UUID.randomUUID().toString().replace("-", ""));
salesDetails.setCreateName(user.getCreateName());
salesDetails.setCreateDate(new Date());
salesDetails.setDeleteFlag(CoreConst.NO_DEL);//删除标识
Map map = new HashMap();// String uploadDir = ConfigUtil.getConfig("upload.dir");try {
salesDetailsDao.insSalesDetails(salesDetails);
map.put("status", "200");
map.put("msg", "保存成功");
} catch (Exception e) {
map.put("status", "400");
map.put("msg", "保存失败");
e.printStackTrace();
}return map;
}
新增销售合同详情信息SalesDetailsDao
/**
* 添加一条销售合同详情记录
*/
int insSalesDetails(SalesDetails salesDetails);
思路:本来新增之后SalesDetailsMapper.xml
中的查询方法是销售合同表,销售合同详情表,附件表三张表联查,然后再从里面拿单个字段的,发现和附件表联查的时候,假如上传了两个或者三个文件,那么就会有两个或者三个一摸一样的数据,原因就在于附件表的路径名称和文件名称不同,销售合同详情的id
是赋值给附件表的parentId
新增销售合同详情信息SalesDetailsMapper.xml的insSalesDetails方法
<insert id="insSalesDetails" parameterType="com.yhzn.model.finance.SalesDetails">
insert into FINANCIAL_SALES_DETALL
<trim prefix="(" suffix=")" suffixOverrides=",">
<if test="id != null">
ID,
if>
<if test="acceptId != null">
ACCEPT_ID,
if>
<if test="money != null">
MONEY,
if>
<if test="acceptMoney != null">
ACCEPT_MONEY,
if>
<if test="createName != null">
CREATE_NAME,
if>
<if test="createDate != null">
CREATE_DATE,
if>
<if test="modifyName != null">
MODIFY_NAME,
if>
<if test="modifyDate != null">
MODIFY_DATE,
if>
<if test="deleteFlag != null">
DELETE_FLAG,
if>
<if test="rev1 != null">
REV1,
if>
<if test="rev2 != null">
REV2,
if>
<if test="rev3 != null">
REV3,
if>
<if test="acceptDate != null">
ACCEPT_DATE,
if>
<if test="remark != null">
REMARK,
if>
trim>
<trim prefix="values (" suffix=")" suffixOverrides=",">
<if test="id != null">
#{id,jdbcType=VARCHAR},
if>
<if test="acceptId != null">
#{acceptId,jdbcType=VARCHAR},
if>
<if test="money != null">
#{money,jdbcType=DECIMAL},
if>
<if test="acceptMoney != null">
#{acceptMoney,jdbcType=DECIMAL},
if>
<if test="createName != null">
#{createName,jdbcType=VARCHAR},
if>
<if test="createDate != null">
#{createDate,jdbcType=DATE},
if>
<if test="modifyName != null">
#{modifyName,jdbcType=VARCHAR},
if>
<if test="modifyDate != null">
#{modifyDate,jdbcType=DATE},
if>
<if test="deleteFlag != null">
#{deleteFlag,jdbcType=DECIMAL},
if>
<if test="rev1 != null">
#{rev1,jdbcType=VARCHAR},
if>
<if test="rev2 != null">
#{rev2,jdbcType=VARCHAR},
if>
<if test="rev3 != null">
#{rev3,jdbcType=VARCHAR},
if>
<if test="acceptDate != null">
#{acceptDate,jdbcType=DATE},
if>
<if test="remark != null">
#{remark,jdbcType=VARCHAR},
if>
trim>
insert>