修改图片

src/projects/business/views/Guest/To/Info.vue

@@ -199,7 +199,9 @@
         <img src="~$project/assets/img/logo_02.png" width="100"/>
       </div>
     </div>
-
+    <!--图片裁剪-->
+    <cropper :cwidth="cropperWidth" :cheight="cropperHeight" :visible="cropperVisible" :field="cropperField" :cropper="cropper"
+             @cropperFinish="cropperFinish" @cropperCancel="cropperCancel"></cropper>
     <loading :visible="isLoading"></loading>
 
   </div>
@@ -250,6 +252,29 @@
         },
         isLoading: false,
         qrCodeImg: '',
+        //隐藏裁剪图片
+        cropperCancel() {
+          this.cropperVisible = false;
+        },
+        cropperVisible: '',
+        cropperField: '',
+        cropperWidth: 250,
+        cropperHeight: 350,
+        cropper: {
+          img: '',
+          info: true,
+          size: 1,
+          outputType: 'jpeg',
+          canScale: false,
+          autoCrop: false,
+          // 只有自动截图开启 宽度高度才生效
+          autoCropWidth: 250,
+          autoCropHeight: 350,
+          fixed: true,
+          // 真实的输出宽高
+          infoTrue: true,
+          fixedNumber: [5, 7]
+        },
       }
     },
     created() {
@@ -289,8 +314,51 @@
         return sz;
       },
       //微信选择图片
-      chooseImage(mod) {
+      uploadPicture(event,mod) {
         this.indexModel=mod;
+
+        var files =  event.target.files;
+
+         // var localData =  event.target.files[0];
+
+       var  reader = new FileReader();
+       var _this=this;
+        if(files && files[0]) {
+          reader.onload = function (ev) {
+
+
+            var localData=ev.target.result;
+            if (localData.indexOf('data:image') != 0) {
+              //判断是否有这样的头部
+              localData = 'data:image/jpeg;base64,' + localData
+            }
+            localData = localData.replace(/\r|\n/g, '').replace('data:image/jgp', 'data:image/jpeg')
+            _this.imgBase64 = localData;
+            //显示裁剪图片
+            _this.showCropper('photo');
+            _this.uploadpic();
+          }
+          reader.readAsDataURL(files[0]);
+
+        }
+
+      },	//显示裁剪图片
+      showCropper(field) {
+        this.cropper.img = this.imgBase64;
+        this.cropperField = field;
+        this.cropperVisible = true;
+      },
+      //裁剪图片
+      cropperFinish(obj) {
+        console.log(obj);
+        this.imgBase64 = obj.data;
+        this.uploadpic(obj.field);
+        this.cropperVisible = false;
+      },
+      //微信选择图片
+      chooseImageWx(mod) {
+        this.indexModel=mod;
+
         WxJsApi.chooseImage().then(res => {
           var localData = res.localData;
 
@@ -374,7 +442,7 @@
     },
     mounted() {
       //获取微信配置
-      WxJsApi.getWxConfig();
+     // WxJsApi.getWxConfig();
       this.getDetail();
 
     },
@@ -388,5 +456,7 @@
 </script>
 
 <style scoped src="$project/assets/css/xpwyfyy.css"></style>
+<style src="$project/assets/css/iconfont.css"></style>
+
 <style>
 </style>