From dc0e7366e96ce773ae1690f6db28e03a684bb45e Mon Sep 17 00:00:00 2001
From: Jack <jack.su@pollex.com.tw>
Date: 星期二, 18 一月 2022 19:50:12 +0800
Subject: [PATCH] Merge branch 'Phase3' of ssh://dev.pollex.com.tw:29418/pcalife/PAM into Phase3

---
 PAMapp/pages/appointment/_appointmentId/index.vue |   48 ++++++++++++++++++++++++++++++++++--------------
 1 files changed, 34 insertions(+), 14 deletions(-)

diff --git a/PAMapp/pages/appointment/_appointmentId/index.vue b/PAMapp/pages/appointment/_appointmentId/index.vue
index b6b5981..c507db4 100644
--- a/PAMapp/pages/appointment/_appointmentId/index.vue
+++ b/PAMapp/pages/appointment/_appointmentId/index.vue
@@ -1,10 +1,10 @@
 <template>
   <div class="appointment-client-detail-page">
     <div class="date-detail">
-      <!-- TODO: 閬����� step 憿舐內銝�� Date [Tomas, 2022/1/11] -->
-      <div>{{ appointmentDetail.appointmentDate }}</div>
-      <div>{{ appointmentDetail.consultantReadTime }}</div>
+      <div>{{ appointmentDetail.appointmentDate | formatDate }}</div>
+      <div>{{ appointmentDetail.consultantReadTime | formatDate }}</div>
     </div>
+    <!-- TODO: re-send api to update progress [Tomas, 2022/1/17 17:02] -->
     <AppointmentProgress
       class="mt-10"
       :currentStep="appointmentDetail.communicateStatus"
@@ -22,7 +22,7 @@
           </div>
         </div>
         <div class="client-detail-info__information">
-          <div>{{ appointmentDetail.age || '--' }}甇�</div>
+          <div>{{ appointmentDetail.age | toAgeLabel }}</div>
           <div>{{ appointmentDetail.phone }}</div>
           <div class="text--underline">
             {{ appointmentDetail.email }}
@@ -43,18 +43,22 @@
         </div>
       </div>
 
-      <div class="client-detail-action">
+      <div class="client-detail-action" v-if="showWhenAppointmentHasClosed">
+        <el-button >��遛��漲</el-button>
+      </div>
+
+      <div class="client-detail-action" v-else>
         <el-button @click="closeAppointment" >蝯��</el-button>
         <el-button @click="sendMsg" style="margin-left: 0px">�/蝝赤</el-button>
-        <!-- <el-button>��遛��漲</el-button> -->
       </div>
 
     </section>
 
-    <section class="close-appointment-detail">
+    <section class="close-appointment-detail" v-if="showWhenAppointmentHasClosed">
+
         <div class="close-appointment-detail-nav">
           <div class="mdTxt">蝯�撘�</div>
-          <div class="mdTxt text--primary text--underline">蝺刻摩</div>
+          <div class="mdTxt text--primary text--underline cursor--pointer" @click="editAppointmentHasClosed">蝺刻摩</div>
         </div>
         <span class="mt-10 mb-30">��漱</span>
 
@@ -69,15 +73,18 @@
 
     </section>
 
-    <InterviewMsg :isVisible.sync="isVisibleDialog"></InterviewMsg>
+    <InterviewMsg
+      :isVisible.sync="isVisibleDialog"
+      :client="appointmentDetail">
+    </InterviewMsg>
 
 
     <section class="mt-30">
-      <AppointmentInterviewList />
+      <AppointmentInterviewList :interviewList="appointmentDetail.interviewRecordDTOs" />
     </section>
 
     <section class="mt-30">
-      <AppointmentRecordList />
+      <AppointmentRecordList :noticeLogs="appointmentDetail.appointmentNoticeLogs" />
     </section>
 
   </div>
@@ -89,14 +96,17 @@
 import { Vue, Component } from 'vue-property-decorator';
 
 import appointmentService from '~/shared/services/appointment.service';
-import { AppointmentDetail } from '~/shared/models/appointment.model';
+import { Appointment } from '~/shared/models/appointment.model';
+import { ContactStatus } from '~/shared/models/enum/contact-status';
 
 @Component
 export default class AppointmentDetailComponent extends Vue {
 
-  appointmentDetail!: AppointmentDetail;
+  appointmentDetail!: Appointment;
   isVisibleDialog = false;
   interviewTxt = "";
+  contactStatus = ContactStatus;
+
   //////////////////////////////////////////////////////////////////////
 
   async asyncData(context: Context) {
@@ -112,9 +122,19 @@
     this.$router.push(`/appointment/${this.appointmentDetail.id}/close`);
   }
 
-  sendMsg():void{
+  sendMsg():void {
     this.isVisibleDialog = true;
   }
+
+  editAppointmentHasClosed(): void{
+    this.$router.push(`/appointment/${this.appointmentDetail.id}/close`);
+  }
+
+  get showWhenAppointmentHasClosed(): boolean {
+    return this.appointmentDetail.communicateStatus === this.contactStatus.DONE
+        || this.appointmentDetail.communicateStatus === this.contactStatus.CLOSE
+        || this.appointmentDetail.communicateStatus === this.contactStatus.CANCEL;
+  }
 }
 </script>
 

--
Gitblit v1.8.0