优化后台UI,修复文件上传组件

This commit is contained in:
2020-04-09 10:36:18 +08:00
parent f42b62738d
commit 9810b08993
7 changed files with 72 additions and 44 deletions

View File

@@ -586,9 +586,21 @@ define(['jquery', 'bootstrap', 'validator'], function ($, undefined, Validator)
setFile: function(fileList, param){
var file = $('#fileList_'+param.name);
var field = $('#field_'+param.name);
var html = '<div class="item"><div class="thumb"><div class="close"><i class="fa fa-close"></i></div><img src="#" /></div></div>';
for(var i = 0; i < 10; i++){
file.append(html);
var value = field.val() ? field.val().split(",") : [];
if(param.limit == 1){
var html = '<div class="item"><div class="thumb" data-id="'+fileList[0].id+'"><div class="close"><i class="fa fa-close"></i></div><img src="'+fileList[0].url+'" /></div></div>';
file.html(html);
field.val(fileList[0].id);
}else{
for(var i = 0; i < fileList.length; i++){
if(!value.includes((fileList[i].id).toString())){
var html = '<div class="item"><div class="thumb" data-id="'+fileList[i].id+'"><div class="close"><i class="fa fa-close"></i></div><img src="'+fileList[i].url+'" /></div></div>';
value.push(fileList[i].id);
file.append(html);
}
}
field.val(value.join(','));
}
if(param.type == 'image'){
Form.events.imageDel();

View File

@@ -125,6 +125,7 @@ define(['jquery', 'bootstrap', 'webupload'], function ($, undefined, WebUploader
switch( type ) {
case 'uploadFinished':
Upload.setState( 'confirm' );
Upload.uploadFinished();
break;
case 'uploadSuccess':
Upload.uploadSuccess(response, file);
@@ -148,7 +149,6 @@ define(['jquery', 'bootstrap', 'webupload'], function ($, undefined, WebUploader
if ( $(this).hasClass( 'disabled' ) ) {
return false;
}
if ( state === 'ready' ) {
uploader.upload();
} else if ( state === 'paused' ) {
@@ -285,25 +285,7 @@ define(['jquery', 'bootstrap', 'webupload'], function ($, undefined, WebUploader
});
} else {
$wrap.css( 'filter', 'progid:DXImageTransform.Microsoft.BasicImage(rotation='+ (~~((file.rotation/90)%4 + 4)%4) +')');
// use jquery animate to rotation
// $({
// rotation: rotation
// }).animate({
// rotation: file.rotation
// }, {
// easing: 'linear',
// step: function( now ) {
// now = now * Math.PI / 180;
// var cos = Math.cos( now ),
// sin = Math.sin( now );
// $wrap.css( 'filter', "progid:DXImageTransform.Microsoft.Matrix(M11=" + cos + ",M12=" + (-sin) + ",M21=" + sin + ",M22=" + cos + ",SizingMethod='auto expand')");
// }
// });
}
});
$li.appendTo( $queue );
@@ -425,19 +407,40 @@ define(['jquery', 'bootstrap', 'webupload'], function ($, undefined, WebUploader
},
uploadSuccess: function(res, file){
if (res.code == 1) {
var query = sent.parseUrl(window.location.href);
Upload.config.upList.push(res.info);
if(Upload.config.upList.length > 0){
parent.Form.api.setFile(Upload.config.upList, query);
}else{
sent.msg('未上传数据或上传失败!', 'error')
}
},
uploadFinished: function(){
var query = sent.parseUrl(window.location.href);
if(Upload.config.upList.length > 0){
if(query.limit == 1 && Upload.config.upList.length > 1){
sent.msg('请单选图片或文件', 'error');
return false;
}
parent.Form.api.setFile(Upload.config.upList, query);
}else{
sent.msg('未选择数据!', 'error')
}
},
server: function(){
var query = sent.parseUrl(window.location.href);
if($('.img-list .item .thumb').length > 0){
$('.img-list .item .thumb').on('click', function(){
if($(this).hasClass('selected')){
Upload.config.upList = Upload.config.upList.filter(item => !sent.utils.isObjEqual(item, $(this).data()));
$(this).removeClass('selected');
}else{
Upload.config.upList.push($(this).data());
$(this).addClass('selected');
}
})
}
$('button.btn-select').click(function(){
var query = sent.parseUrl(window.location.href);
if(Upload.config.upList.length > 0){
if(query.limit == 1 && Upload.config.upList.length > 1){
sent.msg('请单选图片或文件', 'error');
return false;
}
parent.Form.api.setFile(Upload.config.upList, query);
}else{
sent.msg('未选择数据!', 'error')

View File

@@ -225,6 +225,23 @@ define(['jquery', 'layer', 'message'], function ($, layer) {
}
},
utils: {
//比较2个对象是否相同
isObjEqual:function(o1,o2){
var props1 = Object.getOwnPropertyNames(o1);
var props2 = Object.getOwnPropertyNames(o2);
if (props1.length != props2.length) {
return false;
}
for (var i = 0,max = props1.length; i < max; i++) {
var propName = props1[i];
if (o1[propName] !== o2[propName]) {
return false;
}
}
return true;
}
},
validatenull: function (val) {
if (typeof val == 'boolean') {
return false;