From c99a662edbd0c23e5c88e8a1531f9b10af6539d8 Mon Sep 17 00:00:00 2001
From: HelenHuang <LinHuang@pollex.com.tw>
Date: 星期五, 21 一月 2022 16:47:03 +0800
Subject: [PATCH] Fixed#134576 修正 [ 顧問管理流程 ] 未聯絡預約單資訊明細 : 應只顯示「傳送約訪通知」按鈕,目前畫面顯示結案、約訪紀錄、系統通知紀錄編輯

---
 PAMapp/components/Appointment/AppointmentInterviewList.vue |  141 ++++------------------------------------------
 1 files changed, 14 insertions(+), 127 deletions(-)

diff --git a/PAMapp/components/Appointment/AppointmentInterviewList.vue b/PAMapp/components/Appointment/AppointmentInterviewList.vue
index e7a3325..dc06f5b 100644
--- a/PAMapp/components/Appointment/AppointmentInterviewList.vue
+++ b/PAMapp/components/Appointment/AppointmentInterviewList.vue
@@ -1,82 +1,20 @@
 <template>
     <div>
-      <div class="interview__header">
-          <div class="mdTxt">蝝赤蝝����</div>
-          <div class="pam-link-button--lg"
-          @click="addInterview">+�憓�</div>
-      </div>
-
-      <template v-if="!interviewList.length">
-          <div class="record-card record-card--empty">
-            �蝝赤蝝����
-          </div>
-      </template>
-
-      <template v-if="interviewList.length">
-        <div
-            v-for="(item, index) in futureList"
-            :key="index + 'feature'"
-            class="interview--future"
-            @click="editInterview(item)"
-        >
-
-            <div class="record-card">
-                <div class="record-card-date">
-                    <div>
-                        <UiDateFormat
-                            class="date bold"
-                            :date="item.interviewDate"
-                            onlyShowSection="DAY" />
-                    </div>
-                    <div>
-                        <UiDateFormat
-                            class="time mt-5 line-space"
-                            :date="item.interviewDate"
-                            onlyShowSection="TIME" />
-                    </div>
-                </div>
-                <div class="record-card-content">
-                    <span>{{item.content}}</span>
-                </div>
-            </div>
+        <div class="interview__header">
+            <div class="mdTxt">蝝赤蝝����</div>
+            <div class="pam-link-button--lg"
+            @click="addInterview">+�憓�</div>
         </div>
+        <InterviewCard :interviewList="displayList.slice(0, 3)"></InterviewCard>
 
-        <section
-            class="interview--past"
-            v-for="(item, index) in pastList"
-            :key="index + 'past'"
-            @click="editInterview(item)"
-        >
-            <div class="record-card">
-                <div class="record-card-date">
-                    <div>
-                        <UiDateFormat
-                            class="date bold"
-                            :date="item.interviewDate"
-                            onlyShowSection="DAY" />
-                    </div>
-                    <div>
-                        <UiDateFormat
-                            class="time mt-5 line-space"
-                            :date="item.interviewDate"
-                            onlyShowSection="TIME" />
-                    </div>
-                </div>
-                <div class="record-card-content">
-                    <span>{{item.content}}</span>
-                </div>
-            </div>
+        <section class="text--right mt-30" v-if="interviewList.length > 3">
+                <div class="pam-link-button--lg" @click="readMoreBtn">撅��憭�</div>
         </section>
-
-        <section class="more-log-action">
-                <div class="pam-link-button--lg">撅��憭�</div>
-        </section>
-      </template>
     </div>
 </template>
 
 <script lang="ts">
-import { Vue, Component, Prop, Watch, Mutation } from 'nuxt-property-decorator';
+import { Vue, Component, Prop, Watch } from 'nuxt-property-decorator';
 import { InterviewRecord } from '~/shared/models/appointment.model';
 
 @Component
@@ -84,13 +22,8 @@
   @Prop()
   interviewList!: InterviewRecord[];
 
-  @Mutation
-  updateInterviewRecord!: (data: InterviewRecord) => void;
-
   appointmentId!: string;
-
-  futureList: InterviewRecord[] = [];
-  pastList: InterviewRecord[] = [];
+  displayList: InterviewRecord[] = [];
 
   //////////////////////////////////////////////////////////////////////
 
@@ -103,10 +36,9 @@
   @Watch('interviewList', {immediate: true})
   updateInterviewList() {
       if (this.interviewList && this.interviewList.length > 0) {
-          this.futureList = this.interviewList
-            .filter(item => new Date(item.interviewDate).getTime() >= new Date().getTime())
-          this.pastList = this.interviewList
-            .filter(item =>  new Date(item.interviewDate).getTime() < new Date().getTime());
+          this.displayList = this.interviewList
+            .map((i) => ({ ...i, sortDate: new Date(i.interviewDate)}))
+            .sort((preItem, nextItem) => +nextItem.sortDate - +preItem.sortDate);
       }
   }
 
@@ -116,9 +48,8 @@
     this.$router.push(`/appointment/${this.appointmentId}/interview/new`);
   }
 
-  editInterview(interviewRecord) {
-    this.updateInterviewRecord(interviewRecord);
-    this.$router.push(`/appointment/${this.appointmentId}/interview/${interviewRecord.id}`);
+  readMoreBtn() {
+      this.$router.push(`/appointment/${this.appointmentId}/interviewList`);
   }
 
 }
@@ -129,49 +60,5 @@
   display        : flex;
   justify-content: space-between;
   margin-bottom  : 10px;
-}
-.interview--future{
-    border-bottom: 1px solid #CCCCCC;
-    padding-bottom: 17px;
-    margin-bottom: 17px;
-    .record{
-        display: flex;
-        justify-content: space-between;
-        margin-bottom: 10px;
-    }
-}
-.record-card {
-    height: 62px;
-    border: 1px solid #707070;
-    border-radius: 5px;
-    display: flex;
-    border-bottom: 1px solid #000;
-    .record-card-date{
-        display: flex;
-        flex-direction: column;
-        margin-left: 10px;
-        margin-right: 10px;
-        margin-top: 10px;
-    }
-    .record-card-content{
-        height: 42px;
-        margin-top: 10px;
-        margin-right: 10px;
-        line-height: 1.2;
-    }
-  &.record-card--empty {
-    align-items     : center;
-    background-color: #fff;
-    color           : $MID_GREY;
-    justify-content : center;
-  }
-}
-.line-space{
-    letter-spacing: 1px;
-}
-.more-log-action{
-    margin-top: 30px;
-    display: flex;
-    justify-content:flex-end;
 }
 </style>

--
Gitblit v1.8.0