From e8241decc705f9db3e46aed7b3a3f8b3188cf820 Mon Sep 17 00:00:00 2001
From: wayne <wayne8692wayne8692@gmail.com>
Date: 星期四, 10 三月 2022 15:46:46 +0800
Subject: [PATCH] Merge branch 'Phase3' into pollex-dev
---
PAMapp/pages/agentInfo/_agentNo.vue | 153 +++++++++++++++++++++++++++++++-------------------
1 files changed, 95 insertions(+), 58 deletions(-)
diff --git a/PAMapp/pages/agentInfo/_agentNo.vue b/PAMapp/pages/agentInfo/_agentNo.vue
index 5b1b045..972609c 100644
--- a/PAMapp/pages/agentInfo/_agentNo.vue
+++ b/PAMapp/pages/agentInfo/_agentNo.vue
@@ -1,16 +1,20 @@
<template>
- <div>
+ <div v-if="!!agentInfo">
<el-row
type="flex"
justify="center">
- <UiAvatar :size="150" :fileName="agentInfo.image"></UiAvatar>
+ <UiAvatar
+ :size="150"
+ :agentNo="agentInfo.agentNo">
+ </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>
@@ -20,6 +24,24 @@
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
+ v-if="currentRole === role.ADMIN"
+ type="flex"
+ class="pam-paragraph">
+ <UiField :span="12" icon="comment" label="靽∠拳">
+ {{ agentInfo.email }}
+ </UiField>
</el-row>
<el-row
@@ -34,7 +56,7 @@
type="flex"
class="pam-paragraph">
<UiField icon="company" label="�����">
- {{ agentInfo.serveArea }}
+ {{ agentInfo.serveArea | toServeArea }}
</UiField>
</el-row>
@@ -50,14 +72,17 @@
type="flex"
class="pam-paragraph">
<UiField :span="12" icon="time" label="��敺�����">
- {{ agentInfo.lastestLoginTime | formatDate }}
+ {{ agentInfo.latestLoginTime | formatDate }}
</UiField>
<UiField :span="12" icon="calender" label="����風">
{{ agentInfo.seniority }}
</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">
@@ -83,35 +108,31 @@
</el-progress>
</div>
</el-col>
- </el-row>
+ </el-row> -->
<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"
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>
@@ -121,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>
@@ -129,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>
@@ -139,12 +160,14 @@
<el-row
type="flex"
class="pam-paragraph">
- <UiField icon="trophy" label="敺��風">
+ <UiField icon="trophy" label="敺��風" class="agent-info-textarea">
{{ agentInfo.awards }}
</UiField>
</el-row>
+
<AddAndReservedBtns
+ v-if="currentRole!==role.ADMIN"
:cusClass="'pam-paragraph'"
:agentInfo="agentInfo"
@openPopUp="alertAddSuccess"
@@ -163,7 +186,6 @@
</PopUpFrame>
<PopUpFrame
- drawerSize="40%"
:isOpen.sync="isAlertFieldInfo"
>
<div class="text--center mdTxt fs-18">
@@ -177,42 +199,54 @@
</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>
<script lang="ts">
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 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;
+
agentInfo!: AgentInfo;
+ role = Role;
isAlertAddSuccess = false;
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
+ agentInfo: await myConsultantService.getConsultantDetail(agentNo).then((res) => res)
}
}
- get agentName(): string {
- return `${this.agentInfo.name}(${this.agentInfo.role})`;
- }
+ //////////////////////////////////////////////////////////////////////
- alertAddSuccess() {
+ alertAddSuccess(): void {
this.isAlertAddSuccess = true;
}
alertFieldInfo(field: string): void {
this.isAlertFieldInfo = true;
- console.log(field);
switch(field) {
case 'suitability':
this.fieldInfoTitle = '���漲';
@@ -224,27 +258,19 @@
break;
}
}
+
+ get agentName(): string {
+ if (!this.agentInfo) return '';
+ return `${this.agentInfo?.name}(${this.agentInfo?.role})`;
+ }
+
+ get displayCommunicationStyleList(): string[] {
+ if (!this.agentInfo) return [];
+ return this.agentInfo?.communicationStyle.split('��').filter((item) => item);
+ }
+
}
-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">
@@ -296,5 +322,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