From e02d6534d2dba4b8adcbb80e37cc77bf8bddd26c Mon Sep 17 00:00:00 2001 From: Tomas <tomasysh@gmail.com> Date: 星期三, 09 三月 2022 16:50:48 +0800 Subject: [PATCH] update#136137: [諮詢度表現] 顧問詳細資訊API 前端調整串接 --- PAMapp/pages/agentInfo/_agentNo.vue | 98 ++++++++++++++++++++++++++++++++++-------------- 1 files changed, 69 insertions(+), 29 deletions(-) diff --git a/PAMapp/pages/agentInfo/_agentNo.vue b/PAMapp/pages/agentInfo/_agentNo.vue index de479db..6602a21 100644 --- a/PAMapp/pages/agentInfo/_agentNo.vue +++ b/PAMapp/pages/agentInfo/_agentNo.vue @@ -3,7 +3,10 @@ <el-row type="flex" justify="center"> - <UiAvatar :size="150" :fileName="agentInfo.img"></UiAvatar> + <UiAvatar + :size="150" + :agentNo="agentInfo.agentNo"> + </UiAvatar> </el-row> <el-row @@ -24,6 +27,24 @@ </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 + v-if="currentRole === role.ADMIN" + type="flex" + class="pam-paragraph"> + <UiField :span="12" icon="comment" label="靽∠拳"> + {{ agentInfo.email }} + </UiField> + </el-row> + + <el-row type="flex" class="pam-paragraph"> <UiField :span="12" icon="agent" label="����"> @@ -35,7 +56,7 @@ type="flex" class="pam-paragraph"> <UiField icon="company" label="�����"> - {{ agentInfo.serveArea }} + {{ agentInfo.serveArea | toServeArea }} </UiField> </el-row> @@ -92,23 +113,19 @@ <el-row type="flex" class="pam-paragraph"> - <el-col :span="24" class="pam-field"> - <div class="pam-field__label pam-progress__label"> - <div> - <div class="pam-field__title"> - <i class="pam-icon icon-thumbs-up" - ></i>隢株岷摨西”� <i class="pl-5 text--primary icon-information" @click="alertFieldInfo('evaluation')"></i> - </div> - </div> - <div class="xsTxt"> - {{ agentInfo.evaluation }}/50 (餈����/蝝航��) - </div> - </div> - <div class="pam-field__content pam-field-evaluation pt-10"> - <el-progress :show-text="false" :stroke-width="15" :percentage="agentInfo.evaluation * 2"></el-progress> - </div> - </el-col> + <UiField icon="thumbs-up" label="隢株岷摨西”�"> + {{ agentInfo.nearlyMonthAppointmentCount || 0 }} / {{ agentInfo.allAppointmentCount || 0 }} (餈����/蝝航��) + </UiField> </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" @@ -125,7 +142,7 @@ <el-row type="flex" class="pam-paragraph"> - <UiField icon="comment" label="�犖��艙"> + <UiField icon="comment" label="�犖��艙" class="agent-info-textarea"> {{ agentInfo.concept }} </UiField> </el-row> @@ -133,9 +150,9 @@ <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> @@ -143,7 +160,7 @@ <el-row type="flex" class="pam-paragraph"> - <UiField icon="trophy" label="敺��風"> + <UiField icon="trophy" label="敺��風" class="agent-info-textarea"> {{ agentInfo.awards }} </UiField> </el-row> @@ -182,6 +199,9 @@ </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> @@ -193,15 +213,17 @@ import myConsultantService from '~/shared/services/my-consultant.service'; import { AgentInfo } from '~/shared/models/agent-info.model'; import { hideReviews } from '~/shared/const/hide-reviews'; -import { Role } from '~/shared/models/enum/role'; +import { Role } from '~/shared/models/enum/Role'; const roleStorage = namespace('localStorage'); @Component export default class AgentInfoComponent extends Vue { + @roleStorage.Getter currentRole!:string|null; - role = Role; + agentInfo!: AgentInfo; + role = Role; isAlertAddSuccess = false; isAlertFieldInfo = false; fieldInfoTitle = ''; @@ -210,16 +232,14 @@ ////////////////////////////////////////////////////////////////////// - get agentName(): string { - return `${this.agentInfo.name}(${this.agentInfo.role})`; - } - async asyncData(context: Context) { const agentNo = context.route.params.agentNo; return { agentInfo: await myConsultantService.getConsultantDetail(agentNo).then((res) => res) } } + + ////////////////////////////////////////////////////////////////////// alertAddSuccess(): void { this.isAlertAddSuccess = true; @@ -238,6 +258,15 @@ break; } } + + get agentName(): string { + return `${this.agentInfo.name}(${this.agentInfo.role})`; + } + + get displayCommunicationStyleList(): string[] { + return this.agentInfo.communicationStyle.split('��').filter((item) => item); + } + } </script> @@ -291,5 +320,16 @@ 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> -- Gitblit v1.8.0