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 |  119 ++++++++++++++++++++++++++++++++++++++---------------------
 1 files changed, 76 insertions(+), 43 deletions(-)

diff --git a/PAMapp/pages/agentInfo/_agentNo.vue b/PAMapp/pages/agentInfo/_agentNo.vue
index 330f6c7..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>
@@ -50,14 +54,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">
@@ -67,7 +74,7 @@
               <div class="pam-field__title">
                 <i class="pam-icon icon-puzzle"
                   ></i>���漲
-                  <i class="text--primary icon-information" @click="alertFieldInfo('suitability')"></i>
+                  <i class="pl-5 text--primary icon-information" @click="alertFieldInfo('suitability')"></i>
               </div>
             </div>
             <div class="xsTxt">
@@ -83,7 +90,7 @@
             </el-progress>
           </div>
         </el-col>
-      </el-row>
+      </el-row> -->
 
       <el-row
         type="flex"
@@ -93,7 +100,7 @@
             <div>
               <div class="pam-field__title">
                 <i class="pam-icon icon-thumbs-up"
-                  ></i>隢株岷摨西”� <i class="text--primary icon-information" @click="alertFieldInfo('evaluation')"></i>
+                  ></i>隢株岷摨西”� <i class="pl-5 text--primary icon-information" @click="alertFieldInfo('evaluation')"></i>
               </div>
             </div>
             <div class="xsTxt">
@@ -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>
@@ -144,7 +160,9 @@
         </UiField>
       </el-row>
 
+
       <AddAndReservedBtns
+        v-if="currentRole!==role.ADMIN"
         :cusClass="'pam-paragraph'"
         :agentInfo="agentInfo"
         @openPopUp="alertAddSuccess"
@@ -163,7 +181,6 @@
     </PopUpFrame>
 
     <PopUpFrame
-      drawerSize="40%"
       :isOpen.sync="isAlertFieldInfo"
       >
         <div class="text--center mdTxt fs-18">
@@ -177,42 +194,60 @@
             </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 = '';
-
-  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 = '���漲';
@@ -224,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">
@@ -268,6 +291,8 @@
     .pam-field__title {
       font-size: 16px;
       font-weight: bold;
+      display: flex;
+      align-items: center;
     }
   }
 }
@@ -294,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