| | |
| | | ref="upload" |
| | | action="#" |
| | | :auto-upload="false" |
| | | :on-change="handleAvatarSuccess" |
| | | :on-change="handleAvatarUploaded" |
| | | :show-file-list="false" |
| | | accept="image/png, image/jpeg, image/jpg"> |
| | | <el-avatar |
| | |
| | | </template> |
| | | |
| | | <script lang="ts"> |
| | | import { Vue, Component, Prop, PropSync } from 'nuxt-property-decorator'; |
| | | |
| | | import { MessageBox } from 'element-ui'; |
| | | import { MessageBoxData } from 'element-ui/types/message-box'; |
| | | import { Vue, Component, Prop, PropSync } from 'nuxt-property-decorator'; |
| | | import myConsultantService from '~/shared/services/my-consultant.service'; |
| | | import _ from 'lodash'; |
| | | |
| | | import myConsultantService from '~/shared/services/my-consultant.service'; |
| | | |
| | | @Component |
| | | export default class editConsultantAvatar extends Vue { |
| | |
| | | if(this.agentNo) this.initConsultantAvatar() |
| | | } |
| | | |
| | | initConsultantAvatar(): void { |
| | | private initConsultantAvatar(): void { |
| | | myConsultantService.getConsultantAvatar(this.agentNo) |
| | | .then(base64=> |
| | | this.splitBase64WithCommon(base64) |
| | | ) |
| | | } |
| | | |
| | | handleAvatarSuccess(file:any, fileList:any) { |
| | | const isFollowUploadRule =_.includes(file.raw.type,'image/'); |
| | | isFollowUploadRule ? this.getImgSrc(file) : this.showErrorMsg() |
| | | } |
| | | |
| | | getImgSrc(file:any):void{ |
| | | const blob = file.raw; |
| | | this.blobToBase64(blob).then(base64=>{ |
| | | this.splitBase64WithCommon(base64 as string); |
| | | }); |
| | | } |
| | | |
| | | ////////////////////////////////////////////////////////////////////// |
| | | |
| | | resetAvatar(): void { |
| | | this.imgSrc = this._imgSrc; |
| | | } |
| | | |
| | | handleAvatarUploaded(file:any): void { |
| | | const isFollowUploadRule =_.includes(file.raw.type,'image/'); |
| | | isFollowUploadRule ? this.getImgSrc(file) : this.showFileUploadErrorMsg() |
| | | } |
| | | |
| | | private getImgSrc(file:any):void{ |
| | | const blob = file.raw; |
| | | this.blobToBase64(blob).then(base64=>{ |
| | | this.splitBase64WithCommon(base64 as string); |
| | | }); |
| | | } |
| | | |
| | | private blobToBase64(blob:File):Promise<string | ArrayBuffer | null> { |
| | |
| | | this.imgSrc = base64; |
| | | } |
| | | |
| | | private showErrorMsg():Promise<MessageBoxData>{ |
| | | private showFileUploadErrorMsg():Promise<MessageBoxData>{ |
| | | return MessageBox({ |
| | | message:`<div class="message-header">上傳格式有誤</div> |
| | | <div class="message-content">請上傳正確圖檔</div>`, |