| | |
| | | <el-row |
| | | type="flex" |
| | | justify="center"> |
| | | <UiAvatar :size="150" :fileName="agentInfo.image"></UiAvatar> |
| | | <UiAvatar :size="150" :fileName="agentInfo.img"></UiAvatar> |
| | | </el-row> |
| | | |
| | | <el-row |
| | | type="flex" |
| | | class="pt-10" |
| | | justify="center" |
| | | align="middle"> |
| | | align="middle" v-if="!hideReviews"> |
| | | <!-- TODO:隱藏滿意度 --> |
| | | <i class="pam-icon icon--primary icon-star"></i> |
| | | <h3 class="mdTxt">{{ agentInfo.avgScore }}</h3> |
| | | </el-row> |
| | |
| | | </UiField> |
| | | </el-row> |
| | | |
| | | <el-row |
| | | <!-- TODO: 依據 2021/12/10 10:30 與 Charles 的討論,先隱藏匹配度欄位的顯示 [Tomas, 2021/12/10] --> |
| | | <!-- REF: https://reurl.cc/OkO6Q9--> |
| | | |
| | | <!-- <el-row |
| | | type="flex" |
| | | v-if="agentInfo.suitability" |
| | | class="pam-paragraph"> |
| | |
| | | </el-progress> |
| | | </div> |
| | | </el-col> |
| | | </el-row> |
| | | </el-row> --> |
| | | |
| | | <el-row |
| | | type="flex" |
| | |
| | | class="pam-paragraph"> |
| | | <UiField icon="flag" label="專長領域"> |
| | | <div class="pam-field-experts"> |
| | | <div class="text--orange bold pr-10" v-for="(expert, index) in agentInfo.expertises" :key="index"> |
| | | <div class="text--orange bold pr-10" v-for="(expert, index) in agentInfo.expertise" :key="index"> |
| | | #{{ expert }} |
| | | </div> |
| | | </div> |
| | |
| | | </PopUpFrame> |
| | | |
| | | <PopUpFrame |
| | | drawerSize="40%" |
| | | :isOpen.sync="isAlertFieldInfo" |
| | | > |
| | | <div class="text--center mdTxt fs-18"> |
| | |
| | | import { Context } from '@nuxt/types'; |
| | | import { namespace } from 'nuxt-property-decorator'; |
| | | import { Vue, Component } from 'vue-property-decorator'; |
| | | import { getConsultantDetail } from '~/assets/ts/api/consultant'; |
| | | import { Role } from '~/assets/ts//models/enum/Role'; |
| | | |
| | | 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'; |
| | | |
| | | const roleStorage = namespace('localStorage'); |
| | | |
| | | @Component |
| | | export default class AgentInfoComponent extends Vue { |
| | | @roleStorage.Getter currentRole!:string|null; |
| | |
| | | isAlertFieldInfo = false; |
| | | fieldInfoTitle = ''; |
| | | fieldInfoDesc = ''; |
| | | hideReviews = hideReviews ; |
| | | |
| | | async asyncData(context: Context) { |
| | | const agentNo = context.route.params.agentNo; |
| | | let agentInfo = {}; |
| | | await getConsultantDetail(agentNo).then((res) => agentInfo = res.data ) |
| | | return { |
| | | agentInfo |
| | | } |
| | | } |
| | | ////////////////////////////////////////////////////////////////////// |
| | | |
| | | get agentName(): string { |
| | | return `${this.agentInfo.name}(${this.agentInfo.role})`; |
| | | } |
| | | |
| | | alertAddSuccess() { |
| | | async asyncData(context: Context) { |
| | | const agentNo = context.route.params.agentNo; |
| | | return { |
| | | agentInfo: await myConsultantService.getConsultantDetail(agentNo).then((res) => res) |
| | | } |
| | | } |
| | | |
| | | alertAddSuccess(): void { |
| | | this.isAlertAddSuccess = true; |
| | | } |
| | | |
| | | alertFieldInfo(field: string): void { |
| | | this.isAlertFieldInfo = true; |
| | | console.log(field); |
| | | switch(field) { |
| | | case 'suitability': |
| | | this.fieldInfoTitle = '匹配度'; |
| | |
| | | } |
| | | } |
| | | |
| | | interface AgentInfo { |
| | | name: string; |
| | | agentNo:string; |
| | | role: string; |
| | | image: string; |
| | | avgScore: number; |
| | | title: string; |
| | | phoneNumber: string; |
| | | serveArea: string; |
| | | companyAddress: string; |
| | | lastestLoginTime: Date | null; |
| | | seniority: string; |
| | | suitability: number; |
| | | evaluation: number; |
| | | expertises: string[]; |
| | | concept: string; |
| | | experiences: string[]; |
| | | awards: string; |
| | | } |
| | | </script> |
| | | |
| | | <style lang="scss"> |