From ca2d65b285ac77c1a16605be38f88c6fe10c820a Mon Sep 17 00:00:00 2001
From: Tomas <tomasysh@gmail.com>
Date: 星期四, 10 三月 2022 12:38:08 +0800
Subject: [PATCH] update#136639: [前端] 調整為顧問不支援發送滿意度功能(移除發送滿意度功能連結)

---
 PAMapp/pages/appointment/_appointmentId/index.vue |   67 +++++++++++++++++++++++++--------
 1 files changed, 50 insertions(+), 17 deletions(-)

diff --git a/PAMapp/pages/appointment/_appointmentId/index.vue b/PAMapp/pages/appointment/_appointmentId/index.vue
index d96baa5..7b49df1 100644
--- a/PAMapp/pages/appointment/_appointmentId/index.vue
+++ b/PAMapp/pages/appointment/_appointmentId/index.vue
@@ -1,5 +1,5 @@
 <template>
-  <div class="appointment-client-detail-page">
+  <div class="appointment-client-detail-page" v-if="!!appointmentDetail">
     <div class="date-detail">
       <div>{{ appointmentDetail.appointmentDate | formatDate }}����</div>
       <div>{{ appointmentDetail.consultantReadTime | formatDate }}
@@ -14,19 +14,22 @@
 
     <section class="client-detail">
 
-      <div class="client-detail-info">
+      <div class="client-detail-info mb-30">
         <div class="client-detail-info__avatar">
           <div class="circle">
             {{ appointmentDetail.name || 'NO NAME' }}
-            <div class="sm-circle">
-              {{ appointmentDetail.gender === 'male' ? '�' : '憟�'}}
+            <div class="sm-circle sm-circle-male" v-if="appointmentDetail.gender === 'male'">
+              <i class="icon-sex-male sex-icon"></i>
+            </div>
+            <div class="sm-circle sm-circle-female" v-if="appointmentDetail.gender === 'female'">
+              <i class="icon-sex-female sex-icon"></i>
             </div>
           </div>
         </div>
         <div class="client-detail-info__information">
           <div>{{ appointmentDetail.age | toAgeLabel }}</div>
           <div>{{ appointmentDetail.phone }}</div>
-          <div class="text--underline">
+          <div class="text--underline text--break-all">
             {{ appointmentDetail.email }}
           </div>
         </div>
@@ -52,20 +55,20 @@
         </div>
       </div>
 
-      <div class="client-detail-action" v-if="showWhenAppointmentHasClosed">
+      <!-- <div class=" btn-center" v-if="showWhenAppointmentHasClosed">
         <el-button @click="inviteReview">��遛��漲</el-button>
-      </div>
+      </div> -->
 
       <div class="client-detail-action" v-if="showWhenAppointmentHasContacted">
-        <el-button @click="closeAppointment" >蝯��</el-button>
-        <el-button @click="sendMsg" style="margin-left: 0px">�/蝝赤</el-button>
+        <el-button @click="closeAppointment" class="desktop-client-detail-action-btn" >蝯��</el-button>
+        <el-button @click="sendMsg" style="margin-left: 0px">�蝝赤</el-button>
       </div>
 
-      <div class="client-detail-action" v-if="showWhenAppointmentHasCreate">
+     <div class=" btn-center" v-if="showWhenAppointmentHasCreate">
         <el-button @click="sendMsg">���赤�</el-button>
       </div>
-
     </section>
+
 
     <template v-if="showWhenAppointmentHasClosed">
       <AppointmentClosedInfo :appointmentDetail="appointmentDetail" />
@@ -156,13 +159,14 @@
   }
 
   getHopeContactTimeContent(hopeContactTimeString: string): string[] {
-    const result = hopeContactTimeString.replace("'", '').split('��');
+    const result = hopeContactTimeString.replaceAll("'", '').split('��');
     return result;
   }
 
   inviteReview(): void {
-    reviewsService.sendSatisfactionToClient(this.appointmentDetail.id).then(res => res);
-    this.isShowInviteReviewDialog = true ;
+    reviewsService.sendSatisfactionToClient(this.appointmentDetail.id).then(res => {
+        this.isShowInviteReviewDialog = true;
+    });
   }
 }
 </script>
@@ -189,8 +193,7 @@
           height: 100px;
           width: 100px;
           border-radius: 50%;
-          background-color: #fff;
-          border: 1px solid $PRIMARY_BLACK;
+          background-image: url('~/assets/images/appointment/avatar_bg.svg');
           position: relative;
           display: flex;
           justify-content: center;
@@ -201,12 +204,26 @@
             width: 30px;
             border-radius: 50%;
             background-color: #fff;
-            border: 1px solid $PRIMARY_BLACK;
             bottom: 0;
             right: 0;
             display: flex;
             justify-content: center;
             align-items: center;
+            .sex-icon {
+              font-size: 20px;
+              &.icon-sex-male{
+                color: $SKY_BLUE;
+              }
+              &.icon-sex-female{
+                color: $CORAL;
+              }
+            }
+            &-male {
+              border: 1px solid $SKY_BLUE;
+            }
+            &-female {
+              border: 1px solid $LIGHT_RED;
+            }
           }
         }
       }
@@ -230,12 +247,14 @@
         @extend .mb-10;
         @extend .mdTxt;
         @extend .mr-10;
+        line-height: 1.3;
         color     : $DARK_BLUE;
         flex-basis: auto;
         min-width : 40px;
       }
       .client-detail-demand__demand-list-content {
         text-align: justify;
+        line-height: 1.3;
         text-justify: auto;
         word-break: break-all;
       }
@@ -267,5 +286,19 @@
 .hope-contact-time__line {
   border-bottom: 1px solid #CCCCCC;
 }
+.btn-center{
+    display: flex;
+    justify-content: center;
+  }
+
+  @include desktop {
+    .client-detail-action {
+    display: flex;
+    justify-content: center;
+    }
+    .desktop-client-detail-action-btn{
+      margin-right: 10px;
+    }
+  }
 
 </style>

--
Gitblit v1.8.0