202 lines
7.4 KiB
Plaintext
202 lines
7.4 KiB
Plaintext
<%@ page contentType="text/html;charset=UTF-8" %>
|
|
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
|
|
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions" %>
|
|
<!DOCTYPE html>
|
|
<html>
|
|
<head>
|
|
<%@include file="baseset.jsp" %>
|
|
<%@include file="systemset.jsp" %>
|
|
<link rel="stylesheet" type="text/css" href="${bonuspath}/static/plugins/query-fileupload/jquery.fileupload.css" />
|
|
<script type="text/javascript" src="${bonuspath}/static/plugins/query-fileupload/jquery.xdr-transport.js"></script>
|
|
<script type="text/javascript" src="${bonuspath}/static/plugins/query-fileupload/jquery.iframe-transport.js"></script>
|
|
<script type="text/javascript" src="${bonuspath}/static/plugins/query-fileupload/jquery.ui.widget.js"></script>
|
|
<script type="text/javascript" src="${bonuspath}/static/plugins/query-fileupload/jquery.fileupload.js"></script>
|
|
<%-- <script src="${bonuspath}/static/plugins/layer/2.1/extend/layer.ext.js" ></script> --%>
|
|
|
|
<title></title>
|
|
|
|
<style type="text/css">
|
|
|
|
.del_icon{
|
|
float:right;
|
|
z-index:2;
|
|
width:20px;
|
|
height:20px;
|
|
}
|
|
|
|
.img{
|
|
z-index:1;
|
|
width:100px;
|
|
height:100px;
|
|
border:solid 1px black;
|
|
}
|
|
|
|
.img_div{
|
|
display: inline-block;
|
|
padding:10px;
|
|
}
|
|
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<div>
|
|
<div class="row cl" id="qrCode">
|
|
<div align="center" style="padding-top:20px;" >
|
|
<span class="btn btn-success fileinput-button">
|
|
<i class="glyphicon glyphicon-plus"></i>
|
|
<span>上 传</span>
|
|
<input id="fileupload" type="file" name="file" multiple="multiple"/>
|
|
</span>
|
|
<c:if test="${obj.type.id == 76}"><span>(jpg,png格式图片)</span></c:if>
|
|
<c:if test="${obj.type.id == 77}"><span>(doc,docx,txt文档)</span></c:if>
|
|
<c:if test="${obj.type.id == 78}"><span>(xls,xlsx文档)</span></c:if>
|
|
<c:if test="${obj.type.id == 79}"><span>(pdf文件)</span></c:if>
|
|
<br>
|
|
<c:choose>
|
|
<c:when test="${obj.type.id == 76}">
|
|
<div id="imgC" class="imgView" style="display: inline-block;">
|
|
<c:forEach items="${imgs}" var="img" >
|
|
<div class='img_div' id="img${img.id}" ><img title="点击浏览" onclick="viewImgs(this)" class='img' src="/img${img.folderName}/${img.saveName}${img.suffix}">
|
|
<input type="hidden" name = "imgId" value="${img.id}">
|
|
<img class='del_icon' onclick="deleteImg(${img.id},this)" title='删除' src='${bonuspath}/static/image/delete.png' >
|
|
<br>
|
|
<font>${fn:substringBefore(img.preName,'.')}</font>
|
|
</div>
|
|
</c:forEach>
|
|
</div>
|
|
</c:when>
|
|
<c:otherwise>
|
|
<div id="imgC" class="imgView" style="display: inline-block;">
|
|
<c:forEach items="${imgs}" var="img" >
|
|
<div class='img_div' id="img${img.id}" >
|
|
<a title="点击预览" href="/img${img.folderName}/${img.saveName}${img.suffix}">${img.preName}${img.suffix}</a>
|
|
<img class='del_icon' onclick="download(${img.id},this)" title='下载' src='${bonuspath}/static/image/download.png' >
|
|
<img class='del_icon' onclick="deleteImg(${img.id},this)" title='删除' src='${bonuspath}/static/image/del.png' >
|
|
</div>
|
|
</c:forEach>
|
|
</div>
|
|
</c:otherwise>
|
|
</c:choose>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<script type="text/javascript">
|
|
var ownerId;
|
|
var modelFlag;
|
|
var folderName;
|
|
var filetype;
|
|
var type = {76:/^gif|jpe?g|png$/i,77:/^doc|docx|txt$/i,78:/^xls|xlsx$/i,79:/^pdf$/i}
|
|
$(function(){
|
|
ownerId = '${obj.ownerId}';
|
|
modelFlag = '${obj.modelFlag}';
|
|
folderName = '${obj.folderName}';
|
|
filetype = '${obj.type.id}';
|
|
var url = bonuspath+"/backstage/fileUpload/imgsUpload?folderName="+folderName+"&modelFlag="+modelFlag+"&ownerId="+ownerId+"&type.id="+filetype;
|
|
$('#fileupload').fileupload({
|
|
url: url,
|
|
singleFileUploads: false,
|
|
maxFileCount:10,
|
|
dataType: 'JSON',
|
|
maxNumberOfFiles : 5,
|
|
done: function (e, data) {
|
|
var size = data.result.length;
|
|
console.log("data22",JSON.stringify(data))
|
|
if(filetype == 76){
|
|
for(var i = 0; i < size; i++){
|
|
var json = JSON.parse(data.result[i]);
|
|
var html = "<div class='img_div'><input type='hidden' name = 'imgId' value='"+json.id+"'><img class='img' onclick='viewImgs(this)' src='"+json.url+"'>";
|
|
html += "<img class='del_icon' onclick='deleteImg("+json.id+",this)' title='删除' src='${bonuspath}/static/image/delete.png' >"+
|
|
"<br><font>"+json.preName.substring(0,json.preName.indexOf('.'));+"</font></div>";
|
|
$(".imgView").append(html);
|
|
}
|
|
layer.msg("图片上传成功!",{icon: 1,time:1000});
|
|
}else{
|
|
for(var i = 0; i < size; i++){
|
|
var json = JSON.parse(data.result[i]);
|
|
var html = "<div class='img_div'><a href="+json.url+">"+json.preName+"</a>";
|
|
html += "<img class='del_icon' onclick='download("+json.id+",this)' title='删除' src='${bonuspath}/static/image/download.png' >";
|
|
html += "<img class='del_icon' onclick='deleteImg("+json.id+",this)' title='删除' src='${bonuspath}/static/image/del.png' >";
|
|
$(".imgView").append(html);
|
|
}
|
|
layer.msg("文件上传成功!",{icon: 1,time:1000});
|
|
}
|
|
},
|
|
add:function (e,data){
|
|
//判断文件类型 var acceptFileTypes = /\/(pdf|xml)$/i;
|
|
var fileType = '${obj.type.id}';
|
|
var acceptFileTypes = type[fileType];
|
|
var name = data.originalFiles[0]["name"];
|
|
var index = name.lastIndexOf(".")+1;
|
|
var fileType = name.substring(index,name.length);
|
|
if(!acceptFileTypes.test(fileType)){
|
|
layer.confirm("请选择正确的上传格式!", {btn: ['确定', '取消'], title: "提示"}, function (index) {
|
|
layer.close(index);
|
|
});
|
|
return ;
|
|
}
|
|
var size = data.originalFiles[0]["size"];
|
|
if(size > (1024*10*1024)){
|
|
alert("上传文件超过最大限制！");
|
|
return ;
|
|
}
|
|
data.submit();
|
|
}
|
|
});
|
|
});
|
|
|
|
function getImgId(){
|
|
//var imgId = $("input[name = imgId]").val();
|
|
var imgIds = "";
|
|
$("input[name = imgId]").each(function(){
|
|
if(imgIds == ""){
|
|
imgIds=$(this).val();
|
|
}else{
|
|
imgIds += "," + $(this).val();
|
|
}
|
|
});
|
|
return imgIds;
|
|
}
|
|
/**
|
|
* @author
|
|
* @date 2020-07-15
|
|
* @function 查看资料的图片
|
|
* @returns
|
|
*/
|
|
function viewImgs(that){
|
|
var offset = $('.img').index(that);
|
|
window.parent.viewImgs(ownerId,offset,modelFlag);
|
|
}
|
|
|
|
/**
|
|
* @author 无畏
|
|
* @date 2019-05-31
|
|
* @function 通用删除图片
|
|
* @returns
|
|
*/
|
|
function deleteImg(imgId,that){
|
|
var params={id:imgId};
|
|
layer.confirm('确定删除该文件？', {
|
|
btn: ['确定','取消'] //按钮
|
|
}, function(){
|
|
$.ajax({
|
|
type:'POST',
|
|
url:bonuspath+'/backstage/fileUpload/deleteImg',
|
|
data:JSON.stringify(params),
|
|
contentType: "application/json",
|
|
success:function(data) {
|
|
data = JSON.parse(data);
|
|
if(data.res == 1){
|
|
$(that).parent().remove();
|
|
layer.msg(data.resMsg,{icon: 1,time:1000});
|
|
}else{
|
|
layer.msg(data.resMsg,{icon: 2,time:1000});
|
|
}
|
|
}
|
|
});
|
|
});
|
|
}
|
|
|
|
|
|
</script>
|
|
</body>
|
|
</html> |