From b8a9ab562c0d87de1d0c1ee2e51c2d8b7883f5b0 Mon Sep 17 00:00:00 2001
From: wayne <wayne8692wayne8692@gmail.com>
Date: 星期一, 24 一月 2022 12:06:32 +0800
Subject: [PATCH] Merge branch 'stmp' into Phase3

---
 PAMapp/components/Consultant/ConsultantCard.vue |  183 +++++++++++++++++++++++++--------------------
 1 files changed, 102 insertions(+), 81 deletions(-)

diff --git a/PAMapp/components/Consultant/ConsultantCard.vue b/PAMapp/components/Consultant/ConsultantCard.vue
index 2c91291..f7198f6 100644
--- a/PAMapp/components/Consultant/ConsultantCard.vue
+++ b/PAMapp/components/Consultant/ConsultantCard.vue
@@ -1,70 +1,64 @@
 <template>
     <div>
         <el-row type="flex" class="rowStyle" :class="{'new': !agentInfo.customerViewTime }">
-
-            <el-col :xs="2" :sm="1"></el-col>
-            <el-col :xs="22" :sm="23">
-                <el-row type="flex">
-                    <el-col class="flex_column" :xs="5" :sm="3">
-                        <UiAvatar
-                            :size="50"
-                            :agentNo="agentInfo.agentNo"
-                            @click.native="showAgentDetail(agentInfo.agentNo)"
-                        ></UiAvatar>
-                        <!-- TODO:���遛��漲 -->
-                        <div v-if="!hideReviews">
-                            <i class="icon-star pam-icon icon--yellow satisfaction"  v-if="notScoreAppointmentYet"></i>
-                            <span v-if="notScoreAppointmentYet">
-                                {{ agentInfo.satisfactionScore }}
-                            </span>
-                            <div class="unfilled text--center "
-                                style="display:flex"
-                                v-if="notScoreAppointmentYet">�憛�<br />皛踵�漲</div>
-                            <span v-if="agentInfo.contactStatus !== 'contacted'">{{ agentInfo.avgScore }}</span>
-                        </div>
-                    </el-col>
-                    <el-col :xs="10" :sm="15">
-                        <div class="smTxt_bold name">{{agentInfo.name}}</div>
-                        <div class="professionals">
-                            <span
-                                class="professionalsTxt"
-                                v-for="(expertise, index) in agentInfo.expertise"
-                                :key="index"
-                            >#{{expertise}}</span>
-                        </div>
-                        <div
-                            class="delete"
-                            v-if="showRemoveBtn"
-                            @click="removeAgent"
-                        >蝘駁</div>
-                    </el-col>
-                    <el-col class="flex_column" :xs="9" :sm="6">
-                        <el-button
-                            class="smTxt_bold outline_btn"
-                            @click="reserveCommunication"
-                            :class="actionBtnStyle"
-                        >{{ actionBtnLabel }}</el-button>
-                        <div
-                          v-if="notScoreAppointmentYet"
-                          class="text--primary mt-10 text--center text--underline cursor--pointer"
-                          @click="reviewsBtn = true">蝯虫�遛��漲閰��</div>
-                        <div class="updateTime mt-10">
-                            {{ agentInfo.updateTime | formatDate }}
-                        </div>
-                    </el-col>
-                </el-row>
+            <el-col class="flex_column pl-5" :xs="5" :sm="3">
+                <UiAvatar
+                    :size="50"
+                    :agentNo="agentInfo.agentNo"
+                    @click.native="showAgentDetail(agentInfo.agentNo)"
+                ></UiAvatar>
+                <!-- TODO:���遛��漲 -->
+                <div v-if="!hideReviews">
+                    <i class="icon-star pam-icon icon--yellow satisfaction"  v-if="notScoreAppointmentYet"></i>
+                    <span v-if="notScoreAppointmentYet">
+                        {{ agentInfo.satisfactionScore }}
+                    </span>
+                    <div class="unfilled text--center "
+                        style="display:flex"
+                        v-if="notScoreAppointmentYet">�憛�<br />皛踵�漲</div>
+                    <span v-if="agentInfo.contactStatus !== 'contacted'">{{ agentInfo.avgScore }}</span>
+                </div>
+            </el-col>
+            <el-col :xs="10" :sm="15">
+                <div class="smTxt_bold name">{{agentInfo.name}}</div>
+                <div class="professionals">
+                    <span
+                        class="professionalsTxt"
+                        v-for="(expertise, index) in agentInfo.expertise"
+                        :key="index"
+                    >#{{expertise}}</span>
+                </div>
+                <div
+                    class="delete"
+                    v-if="showRemoveBtn"
+                    @click="removeAgent"
+                >蝘駁</div>
+                <div
+                    v-if="notScoreAppointmentYet"
+                    class="text--primary text--underline cursor--pointer xsTxt text--bold"
+                    @click="reviewsBtn = true">蝯虫�遛��漲閰��</div>
+            </el-col>
+            <el-col class="flex_column" :xs="9" :sm="6">
+                <el-button
+                    class="smTxt_bold outline_btn"
+                    @click="reservedOrShowAppointmentInfo"
+                    :class="actionBtnStyle"
+                >{{ actionBtnLabel }}</el-button>
+                <div class="updateTime mt-10">
+                    {{ agentInfo.updateTime | formatDate }}
+                </div>
             </el-col>
         </el-row>
 
         <Ui-Dialog
             :isVisible.sync="isVisibleDialog"
             :width="width"
-            class="pam-myDemand-dialog"
+            class="pam-myDemand-dialog pam-dialog-reserved"
         >
             <div v-if="appointmentDetail">
                 <h5 class="subTitle text--center mb-30">������</h5>
                 <p class="smTxt">{{appointmentDetail.appointmentDate | formatDate}}</p>
-                <div class="dialogInfo">
+                <div class="reserved-info">
                     <p>憪��{appointmentDetail.name}}</p>
                     <p>�閰梧�{appointmentDetail.phone}}</p>
                     <p>Email嚗{appointmentDetail.email}}</p>
@@ -86,7 +80,7 @@
                     </div>
                 </div>
 
-                <div v-if="notScoreAppointmentYet" class="dialogInfo-btn">
+                <div v-if="notScoreAppointmentYet" class="reserved-btn">
                     <el-button type="primary"
                         @click.native="reviewsBtn = true">蝯虫�遛��漲閰��</el-button>
                 </div>
@@ -97,14 +91,24 @@
                 </div>
             </div>
         </Ui-Dialog>
-        <PopUpFrame :isOpen.sync="reviewsBtn">
-            <div class="mdTxt">
+
+        <PopUpFrame :isOpen.sync="reviewsBtn" class="reviewDialog-content">
+            <div class="mdTxt pam-dialog-review">
                 靽憿批�遛��漲
                 <span class="hint">������</span>
-                <div class="dialogInfo-score">
-                    <el-rate v-model="inputScore" class="pam-quickFilter-rate"></el-rate>
+                <div class="mt-30 review-content">
+                    <UiAvatar :size="80" :agentNo="agentInfo.agentNo"></UiAvatar>
+                    <div class="review-text">撠憿批��
+                        <span class="text--primary">{{agentInfo.name}}</span>
+                        ��擃���蝯虫�嗾憿��嚗�
+                    </div>
                 </div>
-                <div class="dialogInfo-btn">
+
+                <div class="review-score">
+                    <el-rate v-model="inputScore" class="pam-rate mt-30"></el-rate>
+                </div>
+
+                <div class="review-btn">
                     <el-button
                         type="primary"
                         :disabled="!inputScore"
@@ -178,7 +182,6 @@
     hideReviews = hideReviews;
     isConfirmPopup = false;
 
-
     appointmentDetail: any = {
         age               : '',
         agentNo           : '',
@@ -205,16 +208,16 @@
     get notScoreAppointmentYet(): boolean {
       const isAppointment = !!this.agentInfo['appointmentStatus'];
       if (!isAppointment) return false;
-      return !this.agentInfo['appointmentScore'];
+      return this.agentInfo['appointmentStatus'] !== 'contacted' ? !this.agentInfo['appointmentScore'] : false;
     }
 
     get isAppointment(): boolean {
-      return !!this.agentInfo['appointmentStatus'];;
+      return !!this.agentInfo['appointmentStatus'];
     }
 
     get latestReservedAppointment(): Appointment {
         return this.agentInfo.appointments!
-                .filter((appointment) => appointment.communicateStatus !== 'contacted')
+                .filter((appointment) => appointment.communicateStatus === 'reserved')
                 .map((reversedAppointment) => {
                     return {
                     ...reversedAppointment,
@@ -252,6 +255,12 @@
         if (this.agentInfo['appointmentStatus'] === 'reserved') {
             return '撌脤���';
         }
+        if (this.agentInfo['appointmentStatus'] === 'done') {
+            return '撌脫�漱';
+        }
+        if (this.agentInfo['appointmentStatus'] === 'closed') {
+            return '���漱';
+        }
       } else {
         if (this.agentInfo.contactStatus === 'contacted') {
             return '撌脰蝯�';
@@ -271,6 +280,12 @@
         }
         if (this.agentInfo['appointmentStatus'] === 'reserved') {
             return 'reservedBtn';
+        }
+        if (this.agentInfo['appointmentStatus'] === 'done') {
+            return 'doneBtn';
+        }
+        if (this.agentInfo['appointmentStatus'] === 'closed') {
+            return 'closedBtn';
         }
       } else {
         if (this.agentInfo.contactStatus === 'contacted') {
@@ -296,7 +311,7 @@
     @Action
     storeConsultantList!: () => void;
 
-    reserveCommunication() {
+    reservedOrShowAppointmentInfo() {
       const isAppointment = !!this.agentInfo['appointmentStatus'];
       const contactStatus = this.agentInfo.contactStatus;
         if (!isAppointment && (!contactStatus || contactStatus === 'picked')) {
@@ -435,6 +450,28 @@
             }
         }
 
+        .doneBtn {
+            color: $BEIGE;
+            border-color: $BEIGE;
+
+            &:focus {
+                color: $PRIMARY_WHITE;
+                background-color: $BEIGE;
+                opacity: 0.5;
+            }
+        }
+
+        .closedBtn {
+            color: $PRUDENTIAL_GREY;
+            border-color: $PRUDENTIAL_GREY;
+
+            &:focus {
+                color: $PRIMARY_WHITE;
+                background-color: $PRUDENTIAL_GREY;
+                opacity: 0.5;
+            }
+        }
+
         .updateTime {
             font-size: 12px;
             font-weight: bold;
@@ -448,20 +485,4 @@
         flex-direction: column;
         justify-content: space-between;
     }
-
-    .dialogInfo {
-        font-size: 20px;
-        overflow-y:scroll;
-        height: 400px;
-    }
-    .dialogInfo-btn{
-        display: flex;
-        justify-content: center;
-    }
-    .dialogInfo-score{
-        display: flex;
-        justify-content: center;
-        margin-bottom: 50px;
-    }
-
 </style>

--
Gitblit v1.8.0