CREATE TABLE `photo` ( `id` bigint(10) unsigned NOT NULL AUTO_INCREMENT, `bizid` bigint(11) NOT NULL DEFAULT ‘-1‘ COMMENT ‘业务id，比如项目的id‘, `cover` int(11) DEFAULT ‘0‘ COMMENT ‘1：是，0：不是‘, `sort` int(11) DEFAULT ‘0‘ COMMENT ‘越小越靠前‘, `url` varchar(200) DEFAULT NULL, `name` varchar(255) DEFAULT NULL COMMENT ‘图片的原文件名‘, `remark` varchar(255) DEFAULT NULL COMMENT ‘图片备注‘, `status` int(11) DEFAULT ‘0‘ COMMENT ‘0:正常，1：已删除,2:临时的‘, `type` int(11) DEFAULT ‘1‘ COMMENT ‘1:项目资料 2：待续‘, `addtime` datetime DEFAULT NULL, `uptime` datetime DEFAULT NULL, PRIMARY KEY (`id`) ) ENGINE=InnoDB AUTO_INCREMENT=102 DEFAULT CHARSET=utf8 COMMENT=‘用户上传的图片‘;
@RequestMapping("uploadImg")
public void uploadImg(MultipartHttpServletRequest request,
HttpServletResponse response, Long bizid,Integer type) {
MultipartFile file = request.getFile("file");
MultipartFileValidator validator = new MultipartFileValidator();
validator.setAllowedContentTypes(new String[] { "image/jpeg",
"image/pjpeg", "image/png", "image/x-png" });
String path = null;
String name = null;
try {
if (null != file && !file.isEmpty()) {
name = file.getOriginalFilename();
validator.validate(file);
path = storeFile(file);
storeSlaveFile(file, path);
} else {
throw new Exception("file is empty");
}
} catch (Exception e) {
e.printStackTrace();
super.jsonFail(response, "图片格式不正确或大小超过1M");
return;
}
Long id = null;
if (bizid != null) {
// 临时图片存起来
Photo photo = new Photo();
photo.setName(name);
photo.setUrl(path);
photo.setBizid(bizid);
photo.setStatus(2);
photo.setType(type);
id = photoService.add(photo);
}
JSONObject jsonObject = new JSONObject();
jsonObject.put("code", ErrorCode.OK.getCode());
jsonObject.put("path", path);
jsonObject.put("name", name);
if (id != null) {
jsonObject.put("id", id);
}
super.returnJsonObject(response, jsonObject);
}function bindSaveEvent(){
console.log("bindSaveEvent");
$("#save").on("click", function() {
var trs=$(".tr");
var photos = new Array();
$.each(trs,function(i,n){
var tr = $(trs[i]);
var photo ={};
//newid是数据库中的id
var id=tr.attr("id");
var newid=tr.attr("newid");
photo.id=newid;
photo.cover=$("#"+id+"-cover").val();
photo.sort=$("#"+id+"-sort").val();
photo.remark=$("#"+id+"-remark").val();
photo.url=$("#"+id+"-img").attr("path");
photo.name=$("#"+id+"-name").val();
console.log("id="+id);
photos[i]=photo;
});
var json=JSON.stringify(photos);
console.log("id=${photoVo.project.id}"+",photos="+json);
$.ajax( {
url:‘project/savePhoto‘,
data:{
id : ${photoVo.project.id},
photos: json
},
type:‘post‘,
cache:false,
async: true,
dataType:‘json‘,
success:function(data) {
//alert(data.itemName);
//nameStr = data.itemName;
console.log("data="+data);
},
error : function() {
alert("保存图片失败！");
}
});
});
}function bindAddEvent(){
console.log("bindAddEvent");
$("#add").on("click", function() {
var strTemplate=
‘<tr id="{photo.id}" newid="" class="tr">‘+
‘<td><input id="{photo.id}-name" type="text" value="" /></td>‘+
‘<td><select id="{photo.id}-sort" class="sort">‘+
‘<option value="1">1</option>‘+
‘<option value="2">2</option>‘+
‘<option value="3">3</option>‘+
‘<option value="4">4</option>‘+
‘<option value="5">5</option>‘+
‘<option value="6">6</option>‘+
‘<option value="7">7</option>‘+
‘<option value="8">8</option>‘+
‘<option value="9">9</option>‘+
‘<option value="10">10</option>‘+
‘<option value="0">0</option>‘+
‘</select></td>‘+
‘<td><select id="{photo.id}-cover" owner="{photo.id}"‘+
‘class="cover">‘+
‘<option value="0">否</option>‘+
‘<option value="1">是</option>‘+
‘</select></td>‘+
‘<td><input type="text" id="{photo.id}-remark" value="" /></td>‘+
‘<td><input type="file" id="{photo.id}-file" name="file"‘+
‘style="width: 264px" onchange="uploadImg({photo.id});"><img‘+
‘ id="{photo.id}-img" src="" path=""‘+
‘ width="80%"></td>‘+
‘<td><a id="{photo.id}-del" owner="{photo.id}"‘+
‘href="javascript:;" class="del">删除</a></td>‘+
‘</tr>‘;
var photoId = new Date().getTime();
var html = strTemplate.replace(/{photo.id}/g,photoId);
var tbody = $("#tbody");
tbody.append(html);
console.log(html);
//必须为新生成的对象，重新绑定事件
bindDelEvent();
bindCoverChangeEvent();
});
}public void savePhoto(HttpServletResponse response, @RequestParam Long id,String photos) {
List<Photo> list=JSONArray.parseArray(photos, Photo.class);
projectService.savePhoto(id,list);
super.jsonSucceed(response);
}public void savePhoto(Long id, List<Photo> list) {
if (CollectionUtils.isEmpty(list)) {
logger.error("The photo list is empty~");
return;
}
// 这个项目数据库中的图片，包括所有的状态
List<Photo> dbList = photoDao.getPhotoListByProjectIdAllStatus(id);
PhotoBean photoBean = handlePhoto(list, dbList);
//理论上，不再存在add doAdd(id, photoBean.toAdd);
doUpdate(id, photoBean.toUpdate);
doDelete(id, photoBean.toDelete);
}
doUpdate和doDelete批量更新和批量删除方法，很清晰，不再赘述。
//PhotoBean的结构
class PhotoBean {
//将要删除的，通常是数据库中的
public List<Photo> toDelete;
//将要更新的，都在数据库中，部分最新内容来源于web前端
public List<Photo> toUpdate;
//将要增加的，由于上传图片的时候都已经插入了，这个时候可以忽略了
//public List<Photo> toAdd;
}
//根据前端photo集合和数据库photo集合，得到需要更新和需要删除的photo集合，不存在需要增加的photo集合
private PhotoBean handlePhoto(List<Photo> list, List<Photo> dbList) {
PhotoBean bean = new PhotoBean();
// 全部删除，什么图片都没有上传
if (CollectionUtils.isEmpty(list)) {
bean.toDelete = dbList;
}
// 全部增加，一般在第1次
/* if (CollectionUtils.isEmpty(dbList)) {
bean.toAdd = list;
}*/
// 都不为null
if (list != null && dbList != null) {
// 交集，肯定不为null，最多是empty,id相同就是共同存在
List<Photo> commonList = ListUtils.retainAll(list, dbList);
// 2者交集
List<Photo> toUpdate = commonList;
//数据库中的临时图片，状态需要改为“正常”
if(CollectionUtils.isNotEmpty(toUpdate)){
for(Photo p:toUpdate){
p.setStatus(0);
}
}
// 在list，不再dbList中的
/* List<Photo> toAdd = new ArrayList<Photo>();
for (Photo p : list) {
if (!dbList.contains(p)) {
toAdd.add(p);
}
}*/
// 在dbList，不在list中的
List<Photo> toDelete = new ArrayList<Photo>();
for (Photo p : dbList) {
if (!list.contains(p)) {
toDelete.add(p);
}
}
//bean.toAdd=toAdd;
bean.toUpdate=toUpdate;
bean.toDelete=toDelete;
}
return bean;
}版权声明：本文为博主原创文章，未经博主允许不得转载。
图片上传-下载-删除等图片管理的若干经验总结3-单一业务场景的完整解决方案
原文地址：http://blog.csdn.net/fansunion/article/details/49446331
