|  |  | @@ -1,24 +1,8 @@ | 
		
	
		
			
			|  |  |  | <template> | 
		
	
		
			
			|  |  |  | <div class="uploder"> | 
		
	
		
			
			|  |  |  | <div class="change-photo-setter"> | 
		
	
		
			
			|  |  |  | <van-uploader | 
		
	
		
			
			|  |  |  | class="sett-item" | 
		
	
		
			
			|  |  |  | :before-read="beforeRead" | 
		
	
		
			
			|  |  |  | accept="image/*" | 
		
	
		
			
			|  |  |  | > | 
		
	
		
			
			|  |  |  | <div>照片图库</div> | 
		
	
		
			
			|  |  |  | <img src="https://img01.yzcdn.cn/vant/leaf.jpg" alt="" /> | 
		
	
		
			
			|  |  |  | </van-uploader> | 
		
	
		
			
			|  |  |  | <van-uploader | 
		
	
		
			
			|  |  |  | class="sett-item" | 
		
	
		
			
			|  |  |  | :before-read="beforeRead" | 
		
	
		
			
			|  |  |  | capture="camera" | 
		
	
		
			
			|  |  |  | > | 
		
	
		
			
			|  |  |  | <div>拍照</div> | 
		
	
		
			
			|  |  |  | <img src="https://img01.yzcdn.cn/vant/leaf.jpg" alt="" /> | 
		
	
		
			
			|  |  |  | </van-uploader> | 
		
	
		
			
			|  |  |  | <van-uploader class="sett-item" :before-read="beforeRead"> | 
		
	
		
			
			|  |  |  | <div>选取文件</div> | 
		
	
		
			
			|  |  |  | <div style="height: 100%"></div> | 
		
	
		
			
			|  |  |  | <img src="https://img01.yzcdn.cn/vant/leaf.jpg" alt="" /> | 
		
	
		
			
			|  |  |  | </van-uploader> | 
		
	
		
			
			|  |  |  | </div> | 
		
	
	
		
			
				|  |  | @@ -71,6 +55,8 @@ | 
		
	
		
			
			|  |  |  | </div> | 
		
	
		
			
			|  |  |  | </template> | 
		
	
		
			
			|  |  |  | <script> | 
		
	
		
			
			|  |  |  | import { awsImgUpload } from '@/api/editModel' | 
		
	
		
			
			|  |  |  | import { Toast } from 'vant' | 
		
	
		
			
			|  |  |  | import { VueCropper } from 'vue-cropper' | 
		
	
		
			
			|  |  |  | export default { | 
		
	
		
			
			|  |  |  | name: 'uploadAva', | 
		
	
	
		
			
				|  |  | @@ -117,6 +103,7 @@ export default { | 
		
	
		
			
			|  |  |  | }, | 
		
	
		
			
			|  |  |  | methods: { | 
		
	
		
			
			|  |  |  | beforeRead(file) { | 
		
	
		
			
			|  |  |  | console.log(1) | 
		
	
		
			
			|  |  |  | if (file.type !== 'image/jpeg' && file.type !== 'image/png') { | 
		
	
		
			
			|  |  |  | this.$toast('请上传 jpg/png 格式图片') | 
		
	
		
			
			|  |  |  | return false | 
		
	
	
		
			
				|  |  | @@ -138,25 +125,43 @@ export default { | 
		
	
		
			
			|  |  |  | // let formData = new FormData() | 
		
	
		
			
			|  |  |  | this.loadingShow = true | 
		
	
		
			
			|  |  |  | console.log(this.option) | 
		
	
		
			
			|  |  |  | this.$refs.cropper.getCropBlob((data) => { | 
		
	
		
			
			|  |  |  | // formData.append('headFile', data, this.imageFileName) | 
		
	
		
			
			|  |  |  | // formData.append('id', this.$store.getters.user.userId) | 
		
	
		
			
			|  |  |  | console.log(data) | 
		
	
		
			
			|  |  |  | // uploadAva(formData).then((res) => { | 
		
	
		
			
			|  |  |  | // this.showCropper = false | 
		
	
		
			
			|  |  |  | this.$emit('update:showAta', false) | 
		
	
		
			
			|  |  |  | // this.$emit('update:avaUrl', res.data) | 
		
	
		
			
			|  |  |  | // }) | 
		
	
		
			
			|  |  |  | }) | 
		
	
		
			
			|  |  |  | this.pushImg({ file: this.option.img }) | 
		
	
		
			
			|  |  |  | 
 | 
		
	
		
			
			|  |  |  | // this.$refs.cropper.getCropBlob((data) => { | 
		
	
		
			
			|  |  |  | //   // formData.append('headFile', data, this.imageFileName) | 
		
	
		
			
			|  |  |  | //   // formData.append('id', this.$store.getters.user.userId) | 
		
	
		
			
			|  |  |  | //   console.log(data) | 
		
	
		
			
			|  |  |  | //   // uploadAva(formData).then((res) => { | 
		
	
		
			
			|  |  |  | //   // this.showCropper = false | 
		
	
		
			
			|  |  |  | //   // this.$emit('update:showAta', false) | 
		
	
		
			
			|  |  |  | //   // this.$emit('update:avaUrl', res.data) | 
		
	
		
			
			|  |  |  | //   // }) | 
		
	
		
			
			|  |  |  | //   this.pushImg({ file: data }) | 
		
	
		
			
			|  |  |  | // }) | 
		
	
		
			
			|  |  |  | }, | 
		
	
		
			
			|  |  |  | onClickLeft() { | 
		
	
		
			
			|  |  |  | this.loadingShow = false | 
		
	
		
			
			|  |  |  | this.showCropper = false | 
		
	
		
			
			|  |  |  | this.$parent.showPhotoUploader = false | 
		
	
		
			
			|  |  |  | }, | 
		
	
		
			
			|  |  |  | // 上传图片 | 
		
	
		
			
			|  |  |  | async pushImg(data) { | 
		
	
		
			
			|  |  |  | try { | 
		
	
		
			
			|  |  |  | console.log(data) | 
		
	
		
			
			|  |  |  | const res = await awsImgUpload(data) | 
		
	
		
			
			|  |  |  | 
 | 
		
	
		
			
			|  |  |  | this.loadingShow = false | 
		
	
		
			
			|  |  |  | this.showCropper = false | 
		
	
		
			
			|  |  |  | Toast.success('上传成功') | 
		
	
		
			
			|  |  |  | } catch (error) { | 
		
	
		
			
			|  |  |  | console.log(error, 'error') | 
		
	
		
			
			|  |  |  | Toast.fail(error.message) | 
		
	
		
			
			|  |  |  | } | 
		
	
		
			
			|  |  |  | } | 
		
	
		
			
			|  |  |  | } | 
		
	
		
			
			|  |  |  | } | 
		
	
		
			
			|  |  |  | </script> | 
		
	
		
			
			|  |  |  | 
 | 
		
	
		
			
			|  |  |  | <style lang="scss" scoped> | 
		
	
		
			
			|  |  |  | //  .uploder{ | 
		
	
		
			
			|  |  |  | //    overflow: hidden; | 
		
	
	
		
			
				|  |  | @@ -179,33 +184,7 @@ export default { | 
		
	
		
			
			|  |  |  | padding: 10px 30px; | 
		
	
		
			
			|  |  |  | border-radius: 25px; | 
		
	
		
			
			|  |  |  | } | 
		
	
		
			
			|  |  |  | .change-photo-setter { | 
		
	
		
			
			|  |  |  | width: 400px; | 
		
	
		
			
			|  |  |  | background: #fff; | 
		
	
		
			
			|  |  |  | position: absolute; | 
		
	
		
			
			|  |  |  | top: 11%; | 
		
	
		
			
			|  |  |  | left: 40px; | 
		
	
		
			
			|  |  |  | z-index: 300; | 
		
	
		
			
			|  |  |  | .sett-item { | 
		
	
		
			
			|  |  |  | width: 100%; | 
		
	
		
			
			|  |  |  | } | 
		
	
		
			
			|  |  |  | /deep/.van-uploader__input-wrapper { | 
		
	
		
			
			|  |  |  | width: 100%; | 
		
	
		
			
			|  |  |  | display: flex; | 
		
	
		
			
			|  |  |  | flex-direction: row; | 
		
	
		
			
			|  |  |  | align-items: center; | 
		
	
		
			
			|  |  |  | justify-content: space-between; | 
		
	
		
			
			|  |  |  | padding: 15px; | 
		
	
		
			
			|  |  |  | img { | 
		
	
		
			
			|  |  |  | width: 40px; | 
		
	
		
			
			|  |  |  | height: 40px; | 
		
	
		
			
			|  |  |  | display: block; | 
		
	
		
			
			|  |  |  | } | 
		
	
		
			
			|  |  |  | } | 
		
	
		
			
			|  |  |  | .sett-item:first-child { | 
		
	
		
			
			|  |  |  | border-bottom: 2px solid #ccc; | 
		
	
		
			
			|  |  |  | } | 
		
	
		
			
			|  |  |  | } | 
		
	
		
			
			|  |  |  | 
 | 
		
	
		
			
			|  |  |  | .uploadava { | 
		
	
		
			
			|  |  |  | .update-avatar { | 
		
	
		
			
			|  |  |  | height: 100%; | 
		
	
	
		
			
				|  |  | 
 |