|  |  |  | 
|---|
|  |  |  | :close-on-click-modal="false" | 
|---|
|  |  |  | title="上传图片" | 
|---|
|  |  |  | :visible.sync="updateImg" | 
|---|
|  |  |  | width="800px" | 
|---|
|  |  |  | width="1000px" | 
|---|
|  |  |  | class="icon-dialog-wrapper dialong-com-style"> | 
|---|
|  |  |  | <ImageCropper ref="iconShot" v-if="updateImg" :imgSrc="img" > | 
|---|
|  |  |  | </ImageCropper> | 
|---|
|  |  |  | <span slot="footer" class="dialog-footer"> | 
|---|
|  |  |  | <el-button @click="updateImg = false">取 消</el-button> | 
|---|
|  |  |  | <el-button type="primary" @click="uploadIcon">确 定</el-button> | 
|---|
|  |  |  | <el-button v-if="loading">取 消</el-button> | 
|---|
|  |  |  | <el-button v-else @click="updateImg = false">取 消</el-button> | 
|---|
|  |  |  | <el-button :loading="loading" type="primary" @click="uploadIcon">确 定</el-button> | 
|---|
|  |  |  | </span> | 
|---|
|  |  |  | </el-dialog> | 
|---|
|  |  |  | </div> | 
|---|
|  |  |  | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | data () { | 
|---|
|  |  |  | return { | 
|---|
|  |  |  | loading: false, | 
|---|
|  |  |  | fileInfo:{}, | 
|---|
|  |  |  | img: null, | 
|---|
|  |  |  | updateImg: false, | 
|---|
|  |  |  | 
|---|
|  |  |  | const formData = new FormData() | 
|---|
|  |  |  |  | 
|---|
|  |  |  | formData.append('folder', 'member') | 
|---|
|  |  |  | if(this.uploadData.isFace || this.uploadData.isFace == 0){ | 
|---|
|  |  |  | formData.append('isFace', 0) | 
|---|
|  |  |  | } | 
|---|
|  |  |  | formData.append( | 
|---|
|  |  |  | 'file', | 
|---|
|  |  |  | new File( | 
|---|
|  |  |  | 
|---|
|  |  |  | { type: this.fileInfo.type } // 设置File类型的文件类型 | 
|---|
|  |  |  | ) | 
|---|
|  |  |  | ) | 
|---|
|  |  |  | this.loading = true | 
|---|
|  |  |  | upload(formData).then(res => { | 
|---|
|  |  |  | this.loading = false | 
|---|
|  |  |  | console.log(res) | 
|---|
|  |  |  | this.file.imgurl = res.imgaddr | 
|---|
|  |  |  | this.file.imgurlfull = res.url | 
|---|
|  |  |  | 
|---|
|  |  |  | this.updateImg = false | 
|---|
|  |  |  | this.$emit('uploadSuccess', { imgurl: res.imgaddr, imgurlfull: res.url, name: res.originname }) | 
|---|
|  |  |  | this.$emit('uploadEnd') | 
|---|
|  |  |  | }, () => { | 
|---|
|  |  |  | this.loading = false | 
|---|
|  |  |  | }) | 
|---|
|  |  |  | }) | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | 
|---|
|  |  |  | // 上传图片 | 
|---|
|  |  |  | openUpdateIcon (file, fileList) { | 
|---|
|  |  |  | const isJPG = file.raw.type === 'image/jpeg' || file.raw.type === 'image/png' | 
|---|
|  |  |  | const isLt2M = file.size / 1024 / 1024 < 2 | 
|---|
|  |  |  | const isLt2M = file.size / 1024 / 1024 < 5 | 
|---|
|  |  |  | if (!isJPG) { | 
|---|
|  |  |  | this.$message.error('上传头像图片只能是 JPG/PNG 格式!') | 
|---|
|  |  |  | return false | 
|---|
|  |  |  | } | 
|---|
|  |  |  | if (!isLt2M) { | 
|---|
|  |  |  | this.$message.error('上传头像图片大小不能超过 2MB!') | 
|---|
|  |  |  | this.$message.error('上传头像图片大小不能超过 5MB!') | 
|---|
|  |  |  | return false | 
|---|
|  |  |  | } | 
|---|
|  |  |  | // 上传成功后将图片地址赋值给裁剪框显示图片 | 
|---|