Browse Source

多图上传

lipengtao 6 years ago
parent
commit
f43e0e8ea6
2 changed files with 29 additions and 40 deletions
  1. 6 0
      js/ueditor/dialogs/image/image.css
  2. 23 40
      js/ueditor/dialogs/image/image.js

+ 6 - 0
js/ueditor/dialogs/image/image.css

@ -316,6 +316,7 @@
316 316
#upload .filelist li {
317 317
    width: 113px;
318 318
    height: 113px;
319
    box-sizing:border-box;
319 320
    background: url(./images/bg.png);
320 321
    text-align: center;
321 322
    margin: 9px 0 0 9px;
@ -327,6 +328,11 @@
327 328
    font-size: 12px;
328 329
}
329 330

331
#upload .filelist .move {
332
   border: 2px dashed green;
333
   opacity: 0.7
334
}
335

330 336
#upload .filelist li p.log {
331 337
    position: relative;
332 338
    top: -45px;

+ 23 - 40
js/ueditor/dialogs/image/image.js

@ -400,11 +400,18 @@
400 400

401 401
            setState('pedding');
402 402
            $('.filelist').on('dragstart','li', function(ev){
403
            	$(this).addClass('move')
403 404
				ev.originalEvent.dataTransfer.setData("Text",ev.currentTarget.id);
404 405
            })
405
             $('.filelist').on('drop','li', function(ev){
406
             $('.filelist').on('dragend','li', function(ev){
407
            	$('.filelist').find('li').removeClass('move')
408
            })
409
             $('.filelist').on('drop','li', function(ev){ 
406 410
             	var currendId = ev.currentTarget.id;
407 411
             	var moveId = ev.originalEvent.dataTransfer.getData("Text");
412
             	if(currendId == 'filePickerBlock' || moveId == 'filePickerBlock') {
413
             		return;
414
             	}
408 415
             	var arr = [];
409 416
             	var $s = $('.filelist').children();
410 417
             	for(var i = 0; i < $s.length-1; i++) {
@ -414,38 +421,11 @@
414 421
             	var moveIndex = arr.indexOf(moveId)
415 422
             	var chang1 = $('#'+ currendId);
416 423
             	var chang2 = $('#'+ moveId);
417
             	
418
             	if(moveIndex == 0 && currendIndex == $s.length-2) {
419
             		$('#'+moveId).insertBefore($('#filePickerBlock'));
420
             		$('.filelist').prepend($('#'+currendId))
421
             	}
422
             	if(moveIndex == $s.length-2 && currendIndex == 0) {
423
             		 $('#'+currendId).insertBefore($('#filePickerBlock'));
424
             		 $('.filelist').prepend($('#'+moveId))
425
             	}
426
             	if(moveIndex == 0 && currendIndex < $s.length-2) {
427
             		$('.filelist').prepend($('#'+currendId))
428
             		$('#'+moveId).insertBefore($('#'+arr[currendIndex+1]));
429
             	}
430
             	if(moveIndex < $s.length-2 && currendIndex ==0) {
431
             		$('.filelist').prepend($('#'+moveId))
432
             		$('#'+currendId).insertBefore($('#'+arr[moveIndex+1]));
433
             	}
434
             	if(moveIndex == $s.length-2 && 0 < currendIndex < $s.length-2) {
435
             		$('#'+currendId).insertBefore($('#filePickerBlock'));
436
             		$('#'+moveId).insertAfter($('#'+arr[currendIndex-1]));
437
             	}
438
             	if(currendIndex == $s.length-2 && 0 < moveIndex < $s.length-2) {
439
             		$('#'+moveId).insertBefore($('#filePickerBlock'));
440
             		$('#'+currendId).insertAfter($('#'+arr[moveIndex-1]));
441
             	}
442
             	if(0 < currendIndex < $s.length-2 && 0 < moveIndex < $s.length-2 && moveIndex < currendIndex) {
443
             		$('#'+moveId).insertBefore($('#'+arr[currendIndex+1]));
444
             		$('#'+currendId).insertAfter($('#'+arr[moveIndex-1]));
445
             	}
446
             	if(0 < currendIndex < $s.length-2 && 0 < moveIndex < $s.length-2 && moveIndex > currendIndex) {
447
             		$('#'+moveId).insertAfter($('#'+arr[currendIndex-1]));
448
             		$('#'+currendId).insertBefore($('#'+arr[moveIndex+1]));
424
             	if (moveIndex < currendIndex) {
425
             		chang2.insertAfter(chang1);
426
             	} 
427
             	if (moveIndex > currendIndex) {
428
             		chang2.insertBefore(chang1);
449 429
             	}
450 430
            })
451 431
             $('.filelist').on('dragover','li', function(ev){
@ -453,7 +433,7 @@
453 433
            })
454 434
            // 当有文件添加进来时执行,负责view的创建
455 435
            function addFile(file) {
456
                var $li = $('<li id="' + file.id + '" draggable="true">' +
436
                var $li = $('<li id="' + file.id + '" draggable="true" style="cursor:move">' +
457 437
                        '<p class="title">' + file.name + '</p>' +
458 438
                        '<p class="imgWrap"></p>' +
459 439
                        '<p class="progress"><span></span></p>' +
@ -767,17 +747,12 @@
767 747
            });
768 748

769 749
            uploader.on('uploadSuccess', function (file, ret) {
770
            	var $s = $('.filelist').children();
771
            	var arr = []
772
             	for(var i = 0; i < $s.length-1; i++) {
773
             		arr.push($s[i].id)
774
             	}
775 750
                var $file = $('#' + file.id);
776 751
                try {
777 752
                    var responseText = (ret._raw || ret),
778 753
                        json = utils.str2json(responseText);
779 754
                    if (json.state == 'SUCCESS') {
780
                    	json.index = arr.indexOf(file.id);
755
                    	json.index = file.id;
781 756
                        _this.imageList.push(json);
782 757
                        $file.append('<span class="success"></span>');
783 758
                    } else {
@ -827,6 +802,14 @@
827 802
            this.$wrap.remove();
828 803
        },
829 804
        getInsertList: function () {
805
            var $s = $('.filelist').children();
806
            var arr = []
807
            for(var i = 0; i < $s.length-1; i++) {
808
             	arr.push($s[i].id)
809
             }
810
            this.imageList.forEach(function(item) {
811
            	item.index = arr.indexOf(item.index);
812
            })
830 813
            var i, data, list = [],
831 814
                align = getAlign(),
832 815
                prefix = editor.getOpt('imageUrlPrefix');