|
|
@@ -505,8 +505,8 @@ var app = new Vue({
|
|
|
width: iWidth,
|
|
|
dragMode: 'move',
|
|
|
height: iHeight,
|
|
|
- autoCropArea: 1,
|
|
|
- cropBoxMovable: false,
|
|
|
+ // autoCropArea: 1,
|
|
|
+ // cropBoxMovable: false,
|
|
|
cropBoxResizable: false,
|
|
|
minContainerWidth: iWidth,
|
|
|
minContainerHeight: iHeight,
|
|
|
@@ -535,11 +535,17 @@ var app = new Vue({
|
|
|
// imageSmoothingQuality: 'high',
|
|
|
fillColor: '#fff',
|
|
|
};*/
|
|
|
+ var rate = 1;
|
|
|
+ if(data.height >2000 || data.width>2000){
|
|
|
+ rate = 0.8;
|
|
|
+ }else if( data.height < 1000 || data.width<1000){
|
|
|
+ rate = 1.5;
|
|
|
+ }
|
|
|
|
|
|
_this.cropParams.cropData = {
|
|
|
- width: data.width,
|
|
|
- height: data.height,
|
|
|
- // rotate: data.rotate,
|
|
|
+ width: data.width * rate,
|
|
|
+ height: data.height * rate,
|
|
|
+ rotate: data.rotate,
|
|
|
imageSmoothingQuality: 'high',
|
|
|
fillColor: '#fff',
|
|
|
};
|
|
|
@@ -634,6 +640,7 @@ var app = new Vue({
|
|
|
|
|
|
if(data.height<data.width){
|
|
|
$("#cropImg").cropper("rotate", 90);
|
|
|
+ _this.cropParams.cropData.rotate = 90;
|
|
|
}
|
|
|
var cwidth = $(".cropper-canvas").outerWidth();
|
|
|
|
|
|
@@ -651,8 +658,11 @@ var app = new Vue({
|
|
|
$("#cropImg").cropper("zoom", rate);
|
|
|
}
|
|
|
|
|
|
- $("#cropImg").cropper('setCropBoxData',{width: iWidth, height: iHeight});
|
|
|
-
|
|
|
+ $("#cropImg").cropper(_this.options);
|
|
|
+ $("#cropImg").cropper('setData', {
|
|
|
+ width: iWidth,
|
|
|
+ height: height
|
|
|
+ });
|
|
|
},
|
|
|
// 确定剪切
|
|
|
cropConfirm: function () {
|
|
|
@@ -664,65 +674,25 @@ var app = new Vue({
|
|
|
$.showLoading('图片处理中...');
|
|
|
var id = _this.cropParams.id;
|
|
|
$image = $("#cropImg");
|
|
|
- alert(32)
|
|
|
- // var canvas = $image.cropper('getCroppedCanvas');
|
|
|
- alert(JSON.stringify(_this.cropParams.cropData))
|
|
|
var canvas = $image.cropper('getCroppedCanvas',_this.cropParams.cropData);
|
|
|
-
|
|
|
- /*var url = canvas.toDataURL('image/jpeg');
|
|
|
- var timestamp = Date.parse(new Date());
|
|
|
- var name = timestamp + ".jpg";
|
|
|
-
|
|
|
- if(_this.cropParams.type>0 && id>=0){
|
|
|
- alert(34)
|
|
|
- _this.picList[id] = _this.cropParams;
|
|
|
- _this.picList[id].url = url;
|
|
|
- _this.picList[id].preview = url;
|
|
|
-
|
|
|
- var blob = _this.dataURLtoBlob(url);
|
|
|
- _this.picList[id].fileData = _this.dataBlobtoFile(blob, name);
|
|
|
- // _this.picList[id].fileData = _this.dataURLtoFile(url, name);
|
|
|
- }else{
|
|
|
- alert(341)
|
|
|
- var data = _this.cropParams;
|
|
|
- data.url = url;
|
|
|
- data.preview = url;
|
|
|
- var blob = _this.dataURLtoBlob(url);
|
|
|
- _this.picList[id].fileData = _this.dataBlobtoFile(blob, name);
|
|
|
- // data.fileData = _this.dataURLtoFile(url, name);
|
|
|
- _this.picList.push(data);
|
|
|
- }
|
|
|
- alert(35)
|
|
|
- setTimeout(function () { alert(36)
|
|
|
- $.hideLoading();
|
|
|
- $.closePopup();
|
|
|
- _this.cropParams = {};
|
|
|
- $("#cropImg").cropper('destroy');
|
|
|
- _this.jc = null;
|
|
|
- }, 500);*/
|
|
|
var blob = canvas.toBlob(function (blob) {
|
|
|
//生成Blob的图片格式
|
|
|
if (blob != null) {
|
|
|
var timestamp = Date.parse(new Date());
|
|
|
blob.name = timestamp + ".png";
|
|
|
url = URL.createObjectURL(blob);
|
|
|
- alert(55);
|
|
|
if(_this.cropParams.type && id>=0){
|
|
|
_this.picList[id] = _this.cropParams;
|
|
|
_this.picList[id].url = url;
|
|
|
_this.picList[id].preview = url;
|
|
|
- alert(56);
|
|
|
+ _this.picList[id].fileData = _this.dataBlobtoFile(e, e.name);
|
|
|
}else{
|
|
|
- // _this.picList[id].fileData = _this.dataBlobtoFile(e, e.name);
|
|
|
- alert(57);
|
|
|
var data = _this.cropParams;
|
|
|
data.url = url;
|
|
|
data.preview = url;
|
|
|
- // data.fileData = _this.dataBlobtoFile(e, e.name);
|
|
|
+ data.fileData = _this.dataBlobtoFile(e, e.name);
|
|
|
_this.picList.push(data);
|
|
|
}
|
|
|
- alert(58);
|
|
|
-
|
|
|
setTimeout(function () {
|
|
|
$.closePopup();
|
|
|
$.hideLoading();
|
