| | |
| | | <el-row |
| | | type="flex" |
| | | justify="center"> |
| | | <UiAvatar :size="150" :fileName="agentInfo.img"></UiAvatar> |
| | | <UiAvatar |
| | | :size="150" |
| | | :agentNo="agentInfo.agentNo"> |
| | | </UiAvatar> |
| | | </el-row> |
| | | |
| | | <el-row |
| | |
| | | class="pt-10" |
| | | justify="center"> |
| | | <h3 class="mdTxt">{{ agentName }}</h3> |
| | | </el-row> |
| | | |
| | | <el-row |
| | | v-if="currentRole === role.ADMIN" |
| | | type="flex" |
| | | class="pam-paragraph"> |
| | | <UiField :span="12" icon="phone" label="手機號碼"> |
| | | {{ agentInfo.phoneNumber }} |
| | | </UiField> |
| | | </el-row> |
| | | |
| | | <el-row |
| | |
| | | </el-col> |
| | | </el-row> |
| | | |
| | | <div class="consultant-edit-btn"> |
| | | <UiField icon="flag" label="溝通風格"> |
| | | <div class="text--orange bold pr-10 " |
| | | v-for="(communicationStyle, index) in displayCommunicationStyleList" |
| | | :key="index"> |
| | | #{{ communicationStyle }}</div> |
| | | </UiField> |
| | | </div> |
| | | |
| | | <el-row |
| | | type="flex" |
| | | class="pam-paragraph"> |
| | |
| | | <el-row |
| | | type="flex" |
| | | class="pam-paragraph"> |
| | | <UiField icon="comment" label="個人理念"> |
| | | <UiField icon="comment" label="個人理念" class="agent-info-textarea"> |
| | | {{ agentInfo.concept }} |
| | | </UiField> |
| | | </el-row> |
| | |
| | | <el-row |
| | | type="flex" |
| | | class="pam-paragraph"> |
| | | <UiField icon="school" label="個人背景"> |
| | | <span v-for="(experience, index) in agentInfo.experiences" :key="index"> |
| | | {{ experience }}<span v-if="index !== agentInfo.experiences.length - 1">, </span> |
| | | <UiField icon="school" label="個人背景" class="agent-info-textarea"> |
| | | <span> |
| | | {{ agentInfo.experiences }} |
| | | </span> |
| | | </UiField> |
| | | </el-row> |
| | |
| | | <el-row |
| | | type="flex" |
| | | class="pam-paragraph"> |
| | | <UiField icon="trophy" label="得獎經歷"> |
| | | <UiField icon="trophy" label="得獎經歷" class="agent-info-textarea"> |
| | | {{ agentInfo.awards }} |
| | | </UiField> |
| | | </el-row> |
| | |
| | | </div> |
| | | </div> |
| | | </PopUpFrame> |
| | | <div class="consultant-edit-btn" v-if="currentRole === role.ADMIN"> |
| | | <el-button type="primary" @click.native="$router.push(`/agentInfo/edit/${agentInfo.agentNo}`)">編輯帳戶資訊</el-button> |
| | | </div> |
| | | </div> |
| | | </template> |
| | | |
| | |
| | | agentInfo!: AgentInfo; |
| | | role = Role; |
| | | isAlertAddSuccess = false; |
| | | isAlertFieldInfo = false; |
| | | fieldInfoTitle = ''; |
| | | fieldInfoDesc = ''; |
| | | hideReviews = hideReviews ; |
| | | isAlertFieldInfo = false; |
| | | fieldInfoTitle = ''; |
| | | fieldInfoDesc = ''; |
| | | hideReviews = hideReviews ; |
| | | |
| | | ////////////////////////////////////////////////////////////////////// |
| | | ////////////////////////////////////////////////////////////////////// |
| | | |
| | | async asyncData(context: Context) { |
| | | const agentNo = context.route.params.agentNo; |
| | | return { |
| | |
| | | } |
| | | } |
| | | |
| | | ////////////////////////////////////////////////////////////////////// |
| | | ////////////////////////////////////////////////////////////////////// |
| | | |
| | | alertAddSuccess(): void { |
| | | this.isAlertAddSuccess = true; |
| | | } |
| | | |
| | | alertFieldInfo(field: string): void { |
| | | this.isAlertFieldInfo = true; |
| | | switch(field) { |
| | |
| | | } |
| | | } |
| | | |
| | | ////////////////////////////////////////////////////////////////////// |
| | | |
| | | get agentName(): string { |
| | | return `${this.agentInfo.name}(${this.agentInfo.role})`; |
| | | } |
| | | |
| | | |
| | | get displayCommunicationStyleList(): string[] { |
| | | return this.agentInfo.communicationStyle.split('、').filter((item) => item); |
| | | } |
| | | |
| | | } |
| | | |
| | | </script> |
| | |
| | | flex-wrap: wrap; |
| | | line-height: 24px; |
| | | } |
| | | .consultant-edit-btn{ |
| | | display: flex; |
| | | justify-content: center; |
| | | } |
| | | |
| | | .pam-field{ |
| | | display: flex; |
| | | } |
| | | .agent-info-textarea{ |
| | | word-break: break-all; |
| | | word-wrap: break-word; |
| | | } |
| | | </style> |