From f8858063c1daa9f9255206759bd11a30ee19980a Mon Sep 17 00:00:00 2001
From: Benson <benson@pollex.com>
Date: 星期四, 30 十二月 2021 17:53:51 +0800
Subject: [PATCH] [Update] : 顧問頭像編輯 測試

---
 PAMapp/components/Client/ClientCard.vue |   90 +++++++++++++++++++++++++-------------------
 1 files changed, 51 insertions(+), 39 deletions(-)

diff --git a/PAMapp/components/Client/ClientCard.vue b/PAMapp/components/Client/ClientCard.vue
index 44a5316..b600629 100644
--- a/PAMapp/components/Client/ClientCard.vue
+++ b/PAMapp/components/Client/ClientCard.vue
@@ -4,7 +4,7 @@
             type="flex"
             class="rowStyle cursor--pointer"
             justify="space-between"
-            :class="{'new': !isView && isReserved}"
+            :class="{'new': newAppointment }"
             @click.native="openDetail"
         >
             <el-col :xs="1" :sm="1" class="unread" align="middle" v-if="isReserved">
@@ -13,10 +13,10 @@
             <el-col :xs="5" :sm="3" align="middle">
                 <el-avatar
                     :size="50"
-                    src=""
                 ></el-avatar>
-                <div class="satisfaction">
+                <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>
@@ -26,7 +26,7 @@
                 </div>
             </el-col>
             <el-col :xs="14" :sm="14" class="pl-10">
-                <div class="smTxt_bold name">{{client.name}}</div>
+                <div class="smTxt_bold name">{{ client.name }}</div>
                 <div class="message">������</div>
                 <div class="professionals">
                     <template v-if="client.requirement">
@@ -46,20 +46,20 @@
                 <div
                     class="smTxt_bold fix-chrome-click--issue"
                     :class="{'unread-txt': reservedTxt === '�霈�', 'read-txt': reservedTxt !== '�霈�'}"
-                >{{reservedTxt}}</div>
+                >{{ reservedTxt }}</div>
                 <div
                     class="date xsTxt text--mid_grey"
-                >{{date}}</div>
+                >{{ date }}</div>
                 <div
                     class="xsTxt text--mid_grey"
-                >{{time}}</div>
+                >{{ time }}</div>
             </el-col>
         </el-row>
 
         <Ui-Dialog
             :isVisible.sync="isVisibleDialog"
-            :width="width"
-            @closeDialog="close"
+            :width="dialogWidth"
+            @closeDialog="closeDialog"
             class="pam-myDemand-dialog"
         >
             <h5 class="subTitle text--center mb-30"
@@ -95,8 +95,13 @@
 
 <script lang="ts">
 import { Vue, Component, Prop, Action } from 'nuxt-property-decorator';
-import { isMobileDevice } from '~/assets/ts/device';
-import { ClientInfo, markAsContact, recordRead } from '~/assets/ts/api/appointment';
+
+import appointmentService from '~/shared/services/appointment.service';
+import { isMobileDevice } from '~/shared/device';
+import { hideReviews } from '~/shared/const/hide-reviews';
+import { ClientInfo } from '~/shared/models/client.model';
+import myConsultantService from '~/shared/services/my-consultant.service';
+
 
 @Component({
     filters: {
@@ -118,12 +123,33 @@
     }
 })
 export default class ClientList extends Vue {
-    @Action updateMyAppointment!: (data: ClientInfo) => void
-    @Action storeConsultantList!: () => void;
+    @Action
+    updateMyAppointment!: (data: ClientInfo) => void
 
-    @Prop() client!: ClientInfo;
+    @Action
+    storeConsultantList!: () => void;
+
+    @Prop()
+    client!: ClientInfo;
+
     isVisibleDialog = false;
-    width = '';
+    dialogWidth = '';
+    hideReviews = hideReviews;
+
+    //////////////////////////////////////////////////////////////////////
+
+    get newAppointment(): boolean {
+      return !this.client.consultantViewTime
+            && this.client.communicateStatus === 'reserved';
+    }
+
+    get isReserved() {
+      return this.client.communicateStatus === 'reserved';
+    }
+
+    get isRead() {
+      return !!this.client.consultantReadTime;
+    }
 
     get requirements() {
         return this.client.requirement.split(',');
@@ -133,7 +159,7 @@
         if (this.client.gender) {
             return this.client.gender === 'male' ? '���' : '憟單��';
         }
-        return ''
+        return '';
     }
 
     get hopeContactTime() {
@@ -141,19 +167,7 @@
         return contactList.filter(item => !!item && item !== ",")
     }
 
-    get isReserved() {
-        return this.client.communicateStatus === 'reserved';
-    }
-
-    get isRead() {
-        return !!this.client.consultantReadTime;
-    }
-
-    get isView() {
-        return !!this.client.consultantViewTime;
-    }
-
-    get reservedTxt() {
+    get reservedTxt(): string {
         if (this.isReserved) {
             return this.client.consultantReadTime ? '撌脰�' : '�霈�';
         } else {
@@ -180,30 +194,28 @@
     }
 
     openDetail() {
-        this.width = isMobileDevice() ? '80%' : '';
+        this.dialogWidth = isMobileDevice() ? '80%' : '';
         this.isVisibleDialog = true;
     }
 
     markAppointment() {
-        markAsContact(this.client.id).then(data => {
+        myConsultantService.markAsContact(this.client.id).then(data => {
             // TODO: 閬敺����� updated client 鞈�� - Ben 2021/11/16
-
             const updatedClient = {...this.client};
             updatedClient.communicateStatus = 'contacted';
-            updatedClient.contactTime = new Date();
+            updatedClient.contactTime = new Date().toString();
 
             this.updateMyAppointment(updatedClient);
             this.isVisibleDialog = false;
-
         })
     }
 
-    close() {
-        if (!this.client.consultantReadTime) {
-            recordRead(this.client.id).then(res => {
+    closeDialog(): void {
+      const unread = !this.client.consultantReadTime;
+        if (unread) {
+            appointmentService.recordRead(this.client.id).then((_) => {
                 const updatedClient = {...this.client};
-                updatedClient.consultantReadTime = new Date();
-
+                updatedClient.consultantReadTime = new Date().toString();
                 this.updateMyAppointment(updatedClient);
             });
         }

--
Gitblit v1.8.0