From 4c8c206207873073865bd2715ffb11fe139641b4 Mon Sep 17 00:00:00 2001
From: Mila <Mila@pollex.com.tw>
Date: 星期一, 17 一月 2022 10:08:59 +0800
Subject: [PATCH] Merge branch 'Phase3' of https://192.168.0.10:8443/r/pcalife/PAM into Phase3

---
 PAMapp/components/Client/ClientCard.vue |  119 +++++++++++++++++++++++++++++++++++++++++++----------------
 1 files changed, 87 insertions(+), 32 deletions(-)

diff --git a/PAMapp/components/Client/ClientCard.vue b/PAMapp/components/Client/ClientCard.vue
index 25c5423..8d3d7fd 100644
--- a/PAMapp/components/Client/ClientCard.vue
+++ b/PAMapp/components/Client/ClientCard.vue
@@ -6,29 +6,16 @@
             class="rowStyle cursor--pointer"
             justify="space-between"
             :class="{'new': newAppointment }"
-            @click.native="openDetail"
+            @click.native="viewDetail"
         >
-            <el-col :xs="1" :sm="1" class="unread" align="middle" v-if="isReserved">
+        <div class="test">
+            <div class="unread" v-if="isReserved">
                 <div class="circle" v-if="!isRead"></div>
-            </el-col>
-            <el-col :xs="5" :sm="3" align="middle">
-                <el-avatar
-                    :size="50"
-                ></el-avatar>
-                <div class="satisfaction" v-if="!hideReviews">
-                    <template v-if="client.satisfactionScore">
-                        TODO:���遛��漲
-                        <i class="icon-star pam-icon icon--yellow satisfaction"></i>
-                        <span>{{client.satisfactionScore}}</span>
-                    </template>
-                    <template v-else>
-                        <div class="unfilled">�憛急遛��漲</div>
-                    </template>
-                </div>
-            </el-col>
-            <el-col :xs="14" :sm="14" class="pl-10">
+            </div>
+
+            <div class="pl-10">
                 <div class="smTxt_bold name">{{ client.name }}</div>
-                <div class="my-10">������</div>
+                <div class="my-10 xsTxt">������</div>
                 <div class="professionals">
                     <template v-if="client.requirement">
                         <span
@@ -42,19 +29,55 @@
                         >(摰X�����瘙�)</span>
                     </template>
                 </div>
-            </el-col>
-            <el-col class="flex-column contactInfo" :xs="4" :sm="6">
+                <AppointmentProgress
+                  :currentStep="client.communicateStatus"
+                ></AppointmentProgress>
+            </div>
+        </div>
+            <!-- <el-col :xs="5" :sm="3" align="middle">
+                <el-avatar
+                    :size="50"
+                ></el-avatar>
+                <div class="satisfaction" v-if="!hideReviews">
+                    <template v-if="client.satisfactionScore">
+                        TODO:���遛��漲
+                        <i class="icon-star pam-icon icon--yellow satisfaction"></i>
+                        <span>{{client.satisfactionScore}}</span>
+                    </template>
+                    <template v-else>
+                        <div class="unfilled">�憛急遛��漲</div>
+                    </template>
+                </div>
+            </el-col> -->
+
+            <div class="flex-column contactInfo" :xs="4" :sm="6">
+
                 <div
-                    class="smTxt_bold fix-chrome-click--issue"
-                    :class="{'unread-txt': reservedTxt === '�霈�', 'read-txt': reservedTxt !== '�霈�'}"
-                >{{ reservedTxt }}</div>
+                  class="invite-msg smTxt_bold"
+                  @click.stop="makeInterview"
+                  v-if="client.communicateStatus === contactStatus.RESERVED">
+                  ���赤�
+                </div>
                 <div
-                    class="date xsTxt text--mid_grey"
+                  class="invite-msg smTxt_bold"
+                  @click.stop="closeAppointment"
+                  v-else-if="client.communicateStatus === contactStatus.CONTACTED">
+                  蝯��
+                </div>
+                <div
+                  class="invite-msg smTxt_bold"
+                  @click.stop="inviteReview"
+                  v-else>
+                  ��遛��漲
+                </div>
+
+                <div
+                    class="date xsTxt text--black"
                 >{{ date }}</div>
                 <div
                     class="xsTxt text--mid_grey"
                 >{{ time }}</div>
-            </el-col>
+            </div>
         </el-row>
 
         <Ui-Dialog
@@ -118,6 +141,8 @@
                 <el-button @click="markAppointment">璅酉�撌脤��蝯�</el-button>
             </div>
         </Ui-Dialog>
+
+        <InterviewMsg :isVisible.sync="isMsgDialog"></InterviewMsg>
     </div>
 </template>
 
@@ -127,9 +152,10 @@
 import appointmentService from '~/shared/services/appointment.service';
 import UtilsService from '~/shared/services/utils.service';
 import { hideReviews } from '~/shared/const/hide-reviews';
-import { AppointmentMemoInfo, ClientInfo } from '~/shared/models/client.model';
 import myConsultantService from '~/shared/services/my-consultant.service';
 import { ElRow } from 'element-ui/types/row';
+import { Appointment, AppointmentMemoInfo } from '~/shared/models/appointment.model';
+import { ContactStatus } from '~/shared/models/enum/contact-status';
 
 const localStorage = namespace('localStorage');
 @Component({
@@ -153,17 +179,21 @@
 })
 export default class ClientList extends Vue {
     @Action
-    updateMyAppointment!: (data: ClientInfo) => void;
+    updateMyAppointment!: (data: Appointment) => void;
 
     @Prop()
-    client!: ClientInfo;
+    client!: Appointment;
 
     @localStorage.Mutation
     storageClearAppointmentIdFromMsg!: () => void;
 
     isVisibleDialog = false;
+    isMsgDialog = false;
     dialogWidth = '';
     hideReviews = hideReviews;
+
+    contactStatus = ContactStatus;
+    // currentAppointmentStatus = this.contactStatus.RESERVED;
 
     isEdit = false;
     memoInfo: AppointmentMemoInfo = {
@@ -190,6 +220,24 @@
             ? JSON.parse(JSON.stringify(this.client.appointmentMemoList[0]))
             : {appointmentId: 0, content: '', id: 0};
         this.memo = this.memoInfo.content;
+    }
+
+    //////////////////////////////////////////////////////////////////////
+
+    viewDetail(): void {
+      this.$router.push(`/appointment/${this.client.id}`);
+    }
+
+    makeInterview(): void {
+      this.isMsgDialog = true;
+    }
+
+    closeAppointment(): void {
+      this.$router.push(`/appointment/${this.client.id}/close`);
+    }
+
+    makeAppointment(): void {
+      alert('MAKE AN APPOINTMENT!');
     }
 
     get newAppointment(): boolean {
@@ -339,6 +387,7 @@
         margin-bottom: 10px;
         display: flex;
         justify-content: space-between;
+
         transition: background-color 0.5s;
         &.new {
             border-left: solid 4px $YELLOW;
@@ -352,7 +401,7 @@
             .circle {
                 width: 10px;
                 height: 10px;
-                border-radius: 50px;
+                border-radius: 50%;
                 background-color: $PRIMARY_RED;
                 margin: auto;
             }
@@ -372,7 +421,6 @@
             text-overflow: ellipsis;
             .professionalsTxt {
                 font-size: 12px;
-                font-weight: bold;
                 margin-right: 5px;
             }
             .noProfessionalsTxt {
@@ -418,4 +466,11 @@
     .fixed-Height {
         height: 16px;
     }
+    .test{
+        display: flex;
+    }
+    .invite-msg{
+      color: $PRIMARY_RED;
+        @extend .text--underline;
+    }
 </style>

--
Gitblit v1.8.0