From ac594e4efb30ba28776d74b0fb08ab34d7c32023 Mon Sep 17 00:00:00 2001
From: HelenHuang <LinHuang@pollex.com.tw>
Date: 星期四, 30 十二月 2021 15:20:08 +0800
Subject: [PATCH] Merge branch 'Phase2'

---
 PAMapp/pages/agentInfo/_agentNo.vue |  109 +++++++++++++++++++++++++++++++++---------------------
 1 files changed, 67 insertions(+), 42 deletions(-)

diff --git a/PAMapp/pages/agentInfo/_agentNo.vue b/PAMapp/pages/agentInfo/_agentNo.vue
index 9a75eec..05f879a 100644
--- a/PAMapp/pages/agentInfo/_agentNo.vue
+++ b/PAMapp/pages/agentInfo/_agentNo.vue
@@ -3,14 +3,18 @@
       <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>
@@ -57,7 +61,10 @@
         </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,7 +90,7 @@
             </el-progress>
           </div>
         </el-col>
-      </el-row>
+      </el-row> -->
 
       <el-row
         type="flex"
@@ -106,12 +113,21 @@
         </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">
         <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>
@@ -130,8 +146,8 @@
         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>
+          <span>
+            {{ agentInfo.experiences }}
           </span>
         </UiField>
       </el-row>
@@ -165,7 +181,6 @@
     </PopUpFrame>
 
     <PopUpFrame
-      drawerSize="40%"
       :isOpen.sync="isAlertFieldInfo"
       >
         <div class="text--center mdTxt fs-18">
@@ -179,6 +194,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>
 
@@ -186,39 +204,50 @@
 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;
-  role = Role;
+
   agentInfo!: AgentInfo;
+  role = Role;
   isAlertAddSuccess = false;
   isAlertFieldInfo = false;
   fieldInfoTitle = '';
   fieldInfoDesc = '';
-
-  async asyncData(context: Context) {
-    const agentNo = context.route.params.agentNo;
-    let agentInfo = {};
-    await getConsultantDetail(agentNo).then((res) => agentInfo = res.data )
-    return {
-      agentInfo
-    }
-  }
+  hideReviews = hideReviews ;
+  //////////////////////////////////////////////////////////////////////
 
   get agentName(): string {
     return `${this.agentInfo.name}(${this.agentInfo.role})`;
   }
 
-  alertAddSuccess() {
-      this.isAlertAddSuccess = true;
+  get displayCommunicationStyleList(): string[] {
+    return this.agentInfo.communicationStyle.split('��').filter((item) => item);
   }
 
+  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 = '���漲';
@@ -230,27 +259,15 @@
         break;
     }
   }
+
+//////////////////////////////////////////////////////////////////////
+
+  get agentName(): string {
+    return `${this.agentInfo.name}(${this.agentInfo.role})`;
+  }
+  
 }
 
-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">
@@ -302,5 +319,13 @@
   flex-wrap: wrap;
   line-height: 24px;
 }
+.consultant-edit-btn{
+  display: flex;
+  justify-content: center;
+}
+
+.pam-field{
+  display: flex;
+}
 
 </style>

--
Gitblit v1.8.0