From df439775f9806bac93b39051382e658d92c6c04e Mon Sep 17 00:00:00 2001
From: HelenHuang <LinHuang@pollex.com.tw>
Date: 星期二, 15 二月 2022 12:20:26 +0800
Subject: [PATCH] ADD:#135212 [嚴選配對] 結果頁面顯示匹配度資訊(前端)

---
 PAMapp/pages/recommendConsultant/result.vue |   43 ++++++++++++++++++++++++++++++++++++++++---
 1 files changed, 40 insertions(+), 3 deletions(-)

diff --git a/PAMapp/pages/recommendConsultant/result.vue b/PAMapp/pages/recommendConsultant/result.vue
index b9c8889..36fb73f 100644
--- a/PAMapp/pages/recommendConsultant/result.vue
+++ b/PAMapp/pages/recommendConsultant/result.vue
@@ -4,6 +4,14 @@
     <ul class="pam-rec-agent__list">
         <li class="pam-rec-agent-card" v-for="(info,index) in pageList" :key="index">
             <div class="pam-rec-agent-card__content">
+
+              <div class="pam-rec-agent-card-suitability">
+                </div>
+
+                <div class="pam-rec-agent-card-suitability-text">
+                  <div class="label">���漲</div>
+                  <div class="value">{{info.suitability}}%</div>
+                </div>
                 <div class="pam-rec-agent-card__content-header">
                     <div class="pam-rec-agent-card__avatar">
                         <UiAvatar
@@ -62,7 +70,7 @@
 
     <UiPagination
         class="mb-30"
-        :totalList="strictQueryList"
+        :totalList="strictResultList"
         @changePage="changePage"
         :pageSize = 6
     ></UiPagination>
@@ -85,7 +93,7 @@
 <script lang="ts">
 import { AgentOfStrictQuery } from '~/shared/models/strict-query.model';
 import { hideReviews } from '~/shared/const/hide-reviews';
-import { Vue,Component, State, namespace, Action} from 'nuxt-property-decorator';
+import { Vue,Component, State, namespace, Action, Getter} from 'nuxt-property-decorator';
 
 const localStorage = namespace('localStorage');
 
@@ -96,6 +104,9 @@
 
     @Action
     storeStrictQueryList!: (data: any) => Promise<number>;
+
+    @Getter('strictResultList')
+    strictResultList!: AgentOfStrictQuery[];
 
     @localStorage.State
     recommendConsultantItem!: string;
@@ -111,6 +122,7 @@
             const strictQueryDto = JSON.parse(this.recommendConsultantItem);
             this.storeStrictQueryList(strictQueryDto);
         }
+
     }
 
     //////////////////////////////////////////////////////////////////////
@@ -123,7 +135,6 @@
     }
 
     openPopUp(txt: string) {
-        this.popUpTxt = txt;
         this.isVisiblePopUp = true;
     }
 }
@@ -135,8 +146,34 @@
     border-radius: 10px;
     border: 1px solid $LIGHT_GREY;
     padding: 20px 33px;
+    overflow: hidden;
 
     .pam-rec-agent-card__content {
+      position: relative;
+        .pam-rec-agent-card-suitability{
+          left: -125px;
+          top: -108px;
+          width: 150px;
+          height: 150px;
+          background-color: #F2C75C;
+          transform: rotate(45deg);
+          position:absolute;
+        }
+        .pam-rec-agent-card-suitability-text{
+          position: absolute;
+          left: -25px;
+          top: -10px;
+          z-index: 5;
+          line-height: 1.3;
+          .label {
+            font-size: 10px;
+            color: #68737A;
+          }
+          .value {
+            font-size: 12px;
+            color: #222222;
+          }
+        }
         .pam-rec-agent-card__content-header {
             display: flex;
             .pam-rec-agent-card__avatar {

--
Gitblit v1.8.0