加入业主拍照功能

WebService/src/main/java/com/java110/web/components/machineRecord/MachineVistorPhotoManageComponent.java

@@ -17,7 +17,7 @@ import org.springframework.stereotype.Component;
  *
  * 2019-06-29
  */
-@Component("machineVistorPhotoRecordManage")
+@Component("machineVistorPhotoManage")
 public class MachineVistorPhotoManageComponent {
 
     @Autowired

WebService/src/main/resources/components/ownerPackage/add-owner/addOwner.html

@@ -11,6 +11,10 @@
                             <canvas id="canvas" style="display:none;"></canvas>
                             <div style="margin-top:20px">
                                 <button class="btn btn-primary" type="button" v-on:click="_takePhoto()"><span class="glyphicon glyphicon-camera"></span> 拍照</button>
+                                <span class="btn btn-default btn-file">
+                                    <span class="fileinput-new" >上传照片</span>
+                                </span>
+                                <input type="file" class="file" accept="images/*" name="..." v-on:change="_choosePhoto($event)">
                             </div>
                         </div>
                         <div class="col-sm-6">

WebService/src/main/resources/components/ownerPackage/add-owner/addOwner.js

@@ -189,7 +189,23 @@
                     vc.component.addOwnerInfo.ownerPhoto = data;
                     //document.getElementById('photo').setAttribute('src', data);
                 }
-            }
+            },
+            _choosePhoto:function(event){
+                var photoFiles = event.target.files;
+                if (photoFiles && photoFiles.length > 0) {
+                    // 获取目前上传的文件
+                    var file = photoFiles[0];// 文件大小校验的动作
+                    if(file.size > 1024 * 1024 * 1) {
+                        vc.toast("图片大小不能超过 2MB!")
+                        return false;
+                    }
+                    var reader = new FileReader(); //新建FileReader对象
+                    reader.readAsDataURL(file); //读取为base64
+                    reader.onloadend = function(e) {
+                        vc.component.addOwnerInfo.ownerPhoto = reader.result;
+                    }
+                }
+            },
         }
     });