$(function(){
initImageList();
initCS1File1Img();
initCS1File2Img();
initCS1File3Img();
initCS1File4Img();
initCS1File5Img();
syncBaseinfoImg();
clickradio();
});
//定义回显图片数组
var Image1List = [];
var Image2List = [];
var Image3List = [];
var Image4List = [];
var Image5List = [];
/**
* 初始化回显图片数组
*/
function initImageList(){
if ($("#downUrl").val()) {
Image1List.push(getImageByDownUrl($("#downUrl").val()));
// $("#initCS1File1").fileinput("refresh",{initialPreview: Image1List});
}
if ($("#downUrl2").val()) {
Image2List.push(getImageByDownUrl($("#downUrl2").val()));
// $("#initCS1File2").fileinput("refresh",{initialPreview: Image2List});
}
if ($("#downUrl3").val()) {
Image3List.push(getImageByDownUrl($("#downUrl3").val()));
// $("#initCS1File3").fileinput("refresh",{initialPreview: Image3List});
}
if ($("#downUrl4").val()) {
Image4List.push(getImageByDownUrl($("#downUrl4").val()));
// $("#initCS1File4").fileinput("refresh",{initialPreview: Image4List});
}
if ($("#downUrl5").val()) {
Image5List.push(getImageByDownUrl($("#downUrl5").val()));
// $("#initCS1File5").fileinput("refresh",{initialPreview: Image5List});
}
}
/**
* 根据下载路径获取回显图片数组中的图片
*/
function getImageByDownUrl(downUrl){
url = boot + '/common/downloadfilebyDownUrl.do?downUrl=' + downUrl;
return '<img src="'+url+'" class="col-sm-12 kv-preview-data file-preview-image" style="width:200px">';
}
function initCS1File1Img() {
$("#initCS1File1").fileinput({
uploadUrl: boot + '/common/upload.do',
maxFileCount: 1,
maxFileSize: 100000,
autoReplace: true,
showClose: false, //右上角小×
showRemove: false,
initialPreview: Image1List, //回显图片
layoutTemplates:{
footer: '<div class="file-thumbnail-footer">\n' +
' <div class="file-footer-caption" title="{caption}"></div>\n' +
' {progress} {actions}\n' +
'</div>',
actions: '<div class="file-actions">\n' +
' <div class="file-footer-buttons">\n' +
' {delete} {zoom} {other}' +
' </div>\n' +
' {drag}\n' +
' <div class="file-upload-indicator" title="{indicatorTitle}">{indicator}</div>\n' +
' <div class="clearfix"></div>\n' +
'</div>',
},
initialPreviewConfig:[{url:boot+'/common/deleteImage.do',key: $("#image1Id").val()}], //原图片点击删除图标后的请求路径 参数为附件id
}).on("fileclear",function(event, data, msg){ //点击右上角小×或者Remove删除前
}).on("filecleared",function(event, data, msg){ //点击右上角小×或者Remove删除后
}).on('filepredelete', function(event, key, jqXHR, data) { //原图片点击删除图标前
}).on("filepreajax",function(previewId, index){ //点击Upload上传图片前
}).on("filebatchselected", function(event, files) { //选择文件后处理事件
//var oldCout = Image1List.length; //原图数量
//var currentCount = $("#initCS1File1").fileinput('getFilesCount'); //当前数量
//var newCount = $("#initCS1File1").fileinput('getFileStack').length; //新图数量
//debugger
}).on('filedeleted', function(vKey, jqXHR, extraData){ //原图片点击删除图标后
clearImgId($("#image1Id").val()); //删除数据库中图片id的引用
$("#image1Id").val(""); //删除图片id
$("#downUrl").val(""); //删除图片downUrl
}).on('filepreremove', function(event, id, index) { //重新选择图片点击删除图标
if ($("#downUrl").val()) { //如果原来有图片则还原回原来的图片
//先获取图片然后刷新,否则刷新时可能图片还未成功获取
var img = getImageByDownUrl($("#downUrl").val());
setTimeout(function(){
$("#initCS1File1").fileinput("refresh",{initialPreview: img});
},1000);
}
}).on('fileuploaded', function (event, data, id, index) { //点击Upload上传图片后
//图片上传后点击删除图标无法真正将图片删除,因此上传后将删除图标隐藏
$("#initCS1File1").fileinput("refresh",{layoutTemplates:{
footer: '<div class="file-thumbnail-footer">\n' +
' <div class="file-footer-caption" title="{caption}"></div>\n' +
' {progress} {actions}\n' +
'</div>',
actions: '<div class="file-actions">\n' +
' <div class="file-footer-buttons">\n' +
' {zoom} {other}' +
' </div>\n' +
' {drag}\n' +
' <div class="file-upload-indicator" title="{indicatorTitle}">{indicator}</div>\n' +
' <div class="clearfix"></div>\n' +
'</div>',
}});
var oldImgId = $("#image1Id").val();
var newImgId = data.response.id;
$("#image1Id").val(newImgId); //更新图片id
updateImgId(oldImgId,newImgId); //更新数据库中图片id的引用
deleteImageByid(oldImgId); //'最后'删除原图片
});
}
function initCS1File2Img() {
$("#initCS1File2").fileinput({
uploadUrl: boot + '/common/upload.do',
maxFileCount: 1,
maxFileSize: 100000,
autoReplace: true,
showClose: false,
showRemove: false,
initialPreview: Image2List,
layoutTemplates:{
footer: '<div class="file-thumbnail-footer">\n' +
' <div class="file-footer-caption" title="{caption}"></div>\n' +
' {progress} {actions}\n' +
'</div>',
actions: '<div class="file-actions">\n' +
' <div class="file-footer-buttons">\n' +
' {delete} {zoom} {other}' +
' </div>\n' +
' {drag}\n' +
' <div class="file-upload-indicator" title="{indicatorTitle}">{indicator}</div>\n' +
' <div class="clearfix"></div>\n' +
'</div>',
},
initialPreviewConfig:[{url:boot+'/common/deleteImage.do',key: $("#image2Id").val()}],
}).on('filedeleted', function(vKey, jqXHR, extraData){
clearImgId($("#image2Id").val());
$("#image2Id").val("");
$("#downUrl2").val("");
}).on('filepreremove', function(event, id, index) {
if ($("#downUrl2").val()) {
var img = getImageByDownUrl($("#downUrl2").val());
setTimeout(function(){
$("#initCS1File2").fileinput("refresh",{initialPreview: img});
},1000);
}
}).on('fileuploaded', function (event, data, id, index) {
$("#initCS1File2").fileinput("refresh",{layoutTemplates:{
footer: '<div class="file-thumbnail-footer">\n' +
' <div class="file-footer-caption" title="{caption}"></div>\n' +
' {progress} {actions}\n' +
'</div>',
actions: '<div class="file-actions">\n' +
' <div class="file-footer-buttons">\n' +
' {zoom} {other}' +
' </div>\n' +
' {drag}\n' +
' <div class="file-upload-indicator" title="{indicatorTitle}">{indicator}</div>\n' +
' <div class="clearfix"></div>\n' +
'</div>',
}});
var oldImgId = $("#image2Id").val();
var newImgId = data.response.id;
$("#image2Id").val(newImgId);
updateImgId(oldImgId,newImgId);
deleteImageByid(oldImgId);
});
}
function initCS1File3Img() {
$("#initCS1File3").fileinput({
uploadUrl: boot + '/common/upload.do',
maxFileCount: 1,
maxFileSize: 100000,
autoReplace: true,
showClose: false,
showRemove: false,
initialPreview: Image3List,
layoutTemplates:{
footer: '<div class="file-thumbnail-footer">\n' +
' <div class="file-footer-caption" title="{caption}"></div>\n' +
' {progress} {actions}\n' +
'</div>',
actions: '<div class="file-actions">\n' +
' <div class="file-footer-buttons">\n' +
' {delete} {zoom} {other}' +
' </div>\n' +
' {drag}\n' +
' <div class="file-upload-indicator" title="{indicatorTitle}">{indicator}</div>\n' +
' <div class="clearfix"></div>\n' +
'</div>',
},
initialPreviewConfig:[{url:boot+'/common/deleteImage.do',key: $("#image3Id").val()}],
}).on('filedeleted', function(vKey, jqXHR, extraData){
clearImgId($("#image3Id").val());
$("#image3Id").val("");
$("#downUrl3").val("");
}).on('filepreremove', function(event, id, index) {
if ($("#downUrl3").val()) {
var img = getImageByDownUrl($("#downUrl3").val());
setTimeout(function(){
$("#initCS1File3").fileinput("refresh",{initialPreview: img});
},1000);
}
}).on('fileuploaded', function (event, data, id, index) {
$("#initCS1File3").fileinput("refresh",{layoutTemplates:{
footer: '<div class="file-thumbnail-footer">\n' +
' <div class="file-footer-caption" title="{caption}"></div>\n' +
' {progress} {actions}\n' +
'</div>',
actions: '<div class="file-actions">\n' +
' <div class="file-footer-buttons">\n' +
' {zoom} {other}' +
' </div>\n' +
' {drag}\n' +
' <div class="file-upload-indicator" title="{indicatorTitle}">{indicator}</div>\n' +
' <div class="clearfix"></div>\n' +
'</div>',
}});
var oldImgId = $("#image3Id").val();
var newImgId = data.response.id;
$("#image3Id").val(newImgId);
updateImgId(oldImgId,newImgId);
deleteImageByid(oldImgId);
});
}
function initCS1File4Img() {
$("#initCS1File4").fileinput({
uploadUrl: boot + '/common/upload.do',
maxFileCount: 1,
maxFileSize: 100000,
autoReplace: true,
showClose: false,
showRemove: false,
initialPreview: Image4List,
layoutTemplates:{
footer: '<div class="file-thumbnail-footer">\n' +
' <div class="file-footer-caption" title="{caption}"></div>\n' +
' {progress} {actions}\n' +
'</div>',
actions: '<div class="file-actions">\n' +
' <div class="file-footer-buttons">\n' +
' {delete} {zoom} {other}' +
' </div>\n' +
' {drag}\n' +
' <div class="file-upload-indicator" title="{indicatorTitle}">{indicator}</div>\n' +
' <div class="clearfix"></div>\n' +
'</div>',
},
initialPreviewConfig:[{url:boot+'/common/deleteImage.do',key: $("#image4Id").val()}],
}).on('filedeleted', function(vKey, jqXHR, extraData){
clearImgId($("#image4Id").val());
$("#image4Id").val("");
$("#downUrl4").val("");
}).on('filepreremove', function(event, id, index) {
if ($("#downUrl4").val()) {
var img = getImageByDownUrl($("#downUrl4").val());
setTimeout(function(){
$("#initCS1File4").fileinput("refresh",{initialPreview: img});
},1000);
}
}).on('fileuploaded', function (event, data, id, index) {
$("#initCS1File4").fileinput("refresh",{layoutTemplates:{
footer: '<div class="file-thumbnail-footer">\n' +
' <div class="file-footer-caption" title="{caption}"></div>\n' +
' {progress} {actions}\n' +
'</div>',
actions: '<div class="file-actions">\n' +
' <div class="file-footer-buttons">\n' +
' {zoom} {other}' +
' </div>\n' +
' {drag}\n' +
' <div class="file-upload-indicator" title="{indicatorTitle}">{indicator}</div>\n' +
' <div class="clearfix"></div>\n' +
'</div>',
}});
var oldImgId = $("#image4Id").val();
var newImgId = data.response.id;
$("#image4Id").val(newImgId);
updateImgId(oldImgId,newImgId);
deleteImageByid(oldImgId);
});
}
function initCS1File5Img() {
$("#initCS1File5").fileinput({
uploadUrl: boot + '/common/upload.do',
maxFileCount: 1,
maxFileSize: 100000,
autoReplace: true,
showClose: false,
showRemove: false,
initialPreview: Image5List,
layoutTemplates:{
footer: '<div class="file-thumbnail-footer">\n' +
' <div class="file-footer-caption" title="{caption}"></div>\n' +
' {progress} {actions}\n' +
'</div>',
actions: '<div class="file-actions">\n' +
' <div class="file-footer-buttons">\n' +
' {delete} {zoom} {other}' +
' </div>\n' +
' {drag}\n' +
' <div class="file-upload-indicator" title="{indicatorTitle}">{indicator}</div>\n' +
' <div class="clearfix"></div>\n' +
'</div>',
},
initialPreviewConfig:[{url:boot+'/common/deleteImage.do',key: $("#image5Id").val()}],
}).on('filedeleted', function(vKey, jqXHR, extraData){
clearImgId($("#image5Id").val());
$("#image5Id").val("");
$("#downUrl5").val("");
}).on('filepreremove', function(event, id, index) {
if ($("#downUrl5").val()) {
var img = getImageByDownUrl($("#downUrl5").val());
setTimeout(function(){
$("#initCS1File5").fileinput("refresh",{initialPreview: img});
},1000);
}
}).on('fileuploaded', function (event, data, id, index) {
$("#initCS1File5").fileinput("refresh",{layoutTemplates:{
footer: '<div class="file-thumbnail-footer">\n' +
' <div class="file-footer-caption" title="{caption}"></div>\n' +
' {progress} {actions}\n' +
'</div>',
actions: '<div class="file-actions">\n' +
' <div class="file-footer-buttons">\n' +
' {zoom} {other}' +
' </div>\n' +
' {drag}\n' +
' <div class="file-upload-indicator" title="{indicatorTitle}">{indicator}</div>\n' +
' <div class="clearfix"></div>\n' +
'</div>',
}});
var oldImgId = $("#image5Id").val();
var newImgId = data.response.id;
$("#image5Id").val(newImgId);
updateImgId(oldImgId,newImgId);
deleteImageByid(oldImgId);
});
}
/**
* 将名义值对应的图片映射到baseinfo
*/
function syncBaseinfoImg(){
var cchm=$("#cchLength").val();
var cscch1height=$("#cscch1height").val();
var cscch2height=$("#cscch2height").val();
var cscch3height=$("#cscch3height").val();
var cscch4height=$("#cscch4height").val();
var cscch5height=$("#cscch5height").val();
if(parseFloat(cscch1height)==parseFloat(cchm)&&$("#downUrl").val()){
$("#crossSectionImg").attr("src",boot + '/common/downloadfilebyDownUrl.do?downUrl=' + $("#downUrl").val());
$("#imgDiv").css('display','block');
}else if(parseFloat(cscch2height)==parseFloat(cchm)&&$("#downUrl2").val()){
$("#crossSectionImg").attr("src",boot + '/common/downloadfilebyDownUrl.do?downUrl=' + $("#downUrl2").val());
$("#imgDiv").css('display','block');
}else if(parseFloat(cscch3height)==parseFloat(cchm)&&$("#downUrl3").val()){
$("#crossSectionImg").attr("src",boot + '/common/downloadfilebyDownUrl.do?downUrl=' + $("#downUrl3").val());
$("#imgDiv").css('display','block');
}else if(parseFloat(cscch4height)==parseFloat(cchm)&&$("#downUrl4").val()){
$("#crossSectionImg").attr("src",boot + '/common/downloadfilebyDownUrl.do?downUrl=' + $("#downUrl4").val());
$("#imgDiv").css('display','block');
}else if(parseFloat(cscch5height)==parseFloat(cchm)&&$("#downUrl5").val()){
$("#crossSectionImg").attr("src",boot + '/common/downloadfilebyDownUrl.do?downUrl=' + $("#downUrl5").val());
$("#imgDiv").css('display','block');
}else {
$("#imgDiv").css('display','none');
}
}
/**
* 设定单选框点击事件
*/
function clickradio(){
$(":radio").click(function(){
for(var i=1;i<6;i++){
if($("input[name='cscch"+i+".conclusion']:checked").val()=="1"){
$("#baseInfocch"+i+"Conclusion_cs1").val("OK");
$("#baseInfocch"+i+"Conclusion_cs1").css("color","green");
}else if($("input[name='cscch"+i+".conclusion']:checked").val()=="2"){
$("#baseInfocch"+i+"Conclusion_cs1").val("NG");
$("#baseInfocch"+i+"Conclusion_cs1").css("color","red");
}
}
})
}
/**
* 保存截面积数据
*/
function saveCrossSection1(){
$.ajax({
url: boot + "/crossSection/saveCrossSection1",
data: formUrl($("#crossSectionForm").serialize()),
type: "post",
async:false,
success: function (result) {
if (result.success) {
//window.location.reload();
//helper.alertDialog(result.message, "success");
} else {
helper.alertDialog(result.message, "danger");
}
}
});
}
/*
* 当原图片被删除时将数据表中对该图片id的引用设置为null
*/
function clearImgId(imgId){
$.ajax({
url: boot + "/crossSection/clearImgId",
data: {imgId:imgId},
type: "post",
async:false,
success: function (result) {
if (result.success) {
//window.location.reload();
//helper.alertDialog(result.message, "success");
} else {
//helper.alertDialog(result.message, "danger");
}
}
});
}
/*
* 更新数据库中图片id的引用
*/
function updateImgId(oldImgId,newImgId){
$.ajax({
url: boot + "/crossSection/updateImgId",
data: {oldImgId:oldImgId,newImgId:newImgId},
type: "post",
async:false,
success: function (result) {
if (result.success) {
//window.location.reload();
//helper.alertDialog(result.message, "success");
} else {
//helper.alertDialog(result.message, "danger");
}
}
});
}
/**
* 根据图片id删除附件表中的记录
*/
function deleteImageByid(id){
$.ajax({
url: boot + "/common/deleteImage.do",
data:{key:id},
type:"get",
success:function(result){
}
});
}
FileInput
猜你喜欢
转载自blog.csdn.net/tongxin_tongmeng/article/details/81431621
今日推荐
周排行