From 8b822da7e688aa31e4600f9ea17a0e85f9985c06 Mon Sep 17 00:00:00 2001
From: wayne <wayne8692wayne8692@gmail.com>
Date: 星期二, 16 十一月 2021 10:20:30 +0800
Subject: [PATCH] Merge remote-tracking branch 'origin/master'

---
 PAMapp/pages/recommendConsultant/result.vue |  315 ++++++++++++++++++++++------------------------------
 1 files changed, 132 insertions(+), 183 deletions(-)

diff --git a/PAMapp/pages/recommendConsultant/result.vue b/PAMapp/pages/recommendConsultant/result.vue
index 25a5e55..98f9c98 100644
--- a/PAMapp/pages/recommendConsultant/result.vue
+++ b/PAMapp/pages/recommendConsultant/result.vue
@@ -2,76 +2,77 @@
 <div>
     <div class="mdTxt pb-10">��憿批��</div>
     <ul class="pam-rec-agent__list">
-        <li class="pam-rec-agent-card" v-for="(strictQueryList,index) in pageList" :key="index">
+        <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__content-header">
-                <div class="pam-rec-agent-card__avatar">
-                    
-                    
-                    <UiAvatar :size="120" :fileName="strictQueryList.img" ></UiAvatar>
-                </div>
-                <div class="pam-rec-agent-card__main-info">
-                    <div class="fz-20 pt-10 rec-desktop-name">{{ strictQueryList.name }}</div>
-                    <div class="rec-role">{{ strictQueryList.role }}</div>
-                    <span class="rec-detail"  @click="showAgentDetail(strictQueryList.agentNo)">閰喟敦鞈��</span>
-                </div>
-            </div>
-            <div class="pam-rec-agent-card__content-body">
-                <el-row type="flex" class="pam-paragraph">
-                    <div class="field">
-                    <div class="field__label">
-                    撠����
+                    <div class="pam-rec-agent-card__avatar">
+                        <UiAvatar :fileName="info.img" ></UiAvatar>
                     </div>
-                    <div class="field__content expertieses-container">
-                    <div class="pr-10 pb-10" v-for="(expert, index) in strictQueryList.expertise" :key="index">
-                        #{{ expert }}
-                    </div>
+                    <div class="pam-rec-agent-card__main-info">
+                        <div class="fz-20 pt-10 rec-desktop-name">{{ info.name }}</div>
+                        <div class="rec-role">{{ info.role }}</div>
+                        <span class="rec-detail"  @click="showAgentDetail(info.agentNo)">閰喟敦鞈��</span>
                     </div>
                 </div>
-                </el-row>
+                <div class="pam-rec-agent-card__content-body">
+                    <el-row type="flex" class="pam-paragraph">
+                        <div class="field">
+                            <div class="field__label">撠����</div>
+                            <div class="field__content expertieses-container">
+                                <div class="pr-10 pb-10" v-for="(expert, index) in info.expertise" :key="index">
+                                    #{{ expert }}
+                                </div>
+                            </div>
+                        </div>
+                    </el-row>
 
-                <el-row type="flex" class="pam-paragraph">
-                <el-col :span="12">
-                    <div class="field__label">
-                    ����風
-                    </div>
-                    <div class="field__content">
-                    {{ strictQueryList.seniority }}
-                    </div>
-                </el-col>
-                <el-col :span="12">
-                    <div class="field__label">
-                    摰X皛踵�漲
-                    </div>
-                    <div class="field__content">
-                        <i class="icon-star" style="color:#F2C75C"></i>
-                    {{ strictQueryList.avgScore }}
-                    </div>
-                    </el-col>
-                </el-row>
+                    <el-row type="flex" class="pam-paragraph">
+                        <el-col :span="12">
+                            <div class="field__label">
+                            ����風
+                            </div>
+                            <div class="field__content">
+                            {{ info.seniority }}
+                            </div>
+                        </el-col>
+                        <el-col :span="12">
+                            <div class="field__label">
+                            摰X皛踵�漲
+                            </div>
+                            <div class="field__content">
+                                <i class="icon-star" style="color:#F2C75C"></i>
+                            {{ info.avgScore }}
+                            </div>
+                        </el-col>
+                    </el-row>
 
                 </div>
                 <div class="pam-rec-agent-card__content-footer">
-                <el-row
-                    type="flex"
-                    justify="center"
-                    >
-                    <el-button class="btn">+ 憿批��</el-button>
-                    <el-button class="btn2" type="primary" style="margin-left: 10px" @click="$router.push('/questionnaire')"
-                    >�脰����</el-button>
-                </el-row>
-
-                <!-- <AddAndReservedBtns :cusClass=""></AddAndReservedBtns> -->
+                    <AddAndReservedBtns
+                        :cusClass="'pam-rec-btns'"
+                        :agentInfo="info"
+                        @openPopUp="openPopUp"
+                    ></AddAndReservedBtns>
                 </div>
             </div>
         </li>
     </ul>
-    
+
     <UiPagination
-            :totalList="strictQueryList"
-            @changePage="changePage"
-            :pageSize = 6
-        ></UiPagination>
+        class="mb-30"
+        :totalList="strictQueryList"
+        @changePage="changePage"
+        :pageSize = 6
+    ></UiPagination>
+
+    <PopUpFrame :isOpen.sync="isVisiblePopUp"
+      >
+        <div class="text--center mdTxt">
+            <p class="mb-50">{{popUpTxt}}</p>
+            <p class="text--primary cursor--pointer"
+                @click="isVisiblePopUp = false">������</p>
+        </div>
+    </PopUpFrame>
 
 </div>
 </template>
@@ -84,6 +85,8 @@
     @State('strictQueryList') strictQueryList!: AgentOfStrictQuery;
 
     pageList: any[] = [];
+    isVisiblePopUp = false;
+    popUpTxt = '';
 
     changePage(pageList: any[]) {
         this.pageList = pageList;
@@ -91,57 +94,49 @@
     showAgentDetail(agentNo: string): void {
         this.$router.push(`/agentInfo/${agentNo}`);
     }
-
-
+    openPopUp(txt: string) {
+        this.popUpTxt = txt;
+        this.isVisiblePopUp = true;
+    }
 }
 </script>
 
 <style lang="scss" scoped>
-.btn{
-    width: 139px;
-    height: 47px;
-}
-.btn2{
-    width: 120px;
-    height: 47px;
-}
-
 .pam-rec-agent-card {
     margin-bottom: 10px;
     border-radius: 10px;
     border: 1px solid $LIGHT_GREY;
     padding: 20px 33px;
-    margin-right:-20px;
-    margin-left:-20px;
-    
+
     .pam-rec-agent-card__content {
-        width: 270px;
         .pam-rec-agent-card__content-header {
-        display: flex;
-        .pam-rec-agent-card__avatar {
             display: flex;
-            flex-direction: row;
-            margin-right: 20px;
-        
-        }
-        .pam-rec-agent-card__main-info {
-            display: flex;
-            flex-direction: column;
-            justify-content: flex-end;
-            .rec-role {
-                font-size: 16px;
-                color: $PRUDENTIAL_GREY;
-                font-weight: bold;
-                margin-top: 4px;
+            .pam-rec-agent-card__avatar {
+                display: flex;
+                flex-direction: row;
+                margin-right: 20px;
             }
-            .rec-detail{
-                font-size: 20px;
-                color:$PRIMARY_RED;
-                font-weight: bold;
-                padding-top: 30px;
-                cursor: pointer;
+            .pam-rec-agent-card__main-info {
+                display: flex;
+                flex-direction: column;
+                justify-content: flex-end;
+                .rec-role {
+                    font-size: 16px;
+                    color: $PRUDENTIAL_GREY;
+                    font-weight: bold;
+                    margin-top: 4px;
+                }
+                .rec-detail{
+                    font-size: 20px;
+                    color:$PRIMARY_RED;
+                    font-weight: bold;
+                    padding-top: 30px;
+                    cursor: pointer;
+                }
             }
         }
+        .pam-rec-agent-card__content-body {
+            height: 200px;
         }
     }
 }
@@ -161,110 +156,64 @@
 }
 
 @include desktop{
-.btn{
-    width: 90px;
-    height: 43px;
-    margin-left: 29px;
-    margin-right: 0px
-}
-.btn2{
-    width: 90px;
-    height: 43px;
-}
-    .page-container{}
     .pam-rec-agent__list{
         display: flex;
         flex-wrap: wrap;
         flex-direction:row;
-        width: auto;
+        width: 100%;
     }
     .pam-paragraph{
         margin-top: 10px;
     }
     .pam-rec-agent-card {
-        margin-right: 20px;
-        margin-bottom: 10px;
         border-radius: 10px;
         border: 1px solid $LIGHT_GREY;
-        padding-top: 15px;
-        padding-bottom: 15px;
-        padding-left: 28px;
-        padding-right: 20px;
-        width: 30%;
-        margin-left: 10px;
-    
-    .pam-rec-agent-card__content {
+        padding: 15px 20px 15px 20px;
         width: 170px;
-        .pam-rec-agent-card__content-header {
+        margin: 0 10px 10px 10px;
+
+        .pam-rec-agent-card__content {
+            .pam-rec-agent-card__content-header {
+                display: flex;
+                .pam-rec-agent-card__avatar {
+                    display: flex;
+                    flex-direction: row;
+                    margin-right: 20px;
+                }
+                .pam-rec-agent-card__main-info {
+                    display: flex;
+                    flex-direction: column;
+                    justify-content: center;
+                    .rec-desktop-name{
+                        font-size: 12px;
+                        font-weight: bold;
+                    }
+                    .rec-role {
+                        font-size: 12px;
+                        color:$PRUDENTIAL_GREY;
+                    }
+                    .rec-detail{
+                        font-size: 12px;
+                        color:$PRIMARY_RED;
+                        font-weight: bold;
+                        padding-top: 10px;
+                    }
+                }
+            }
+        }
+    }
+    .field__label {
+        font-size: 12px;
+        color: $PRUDENTIAL_GREY;
+        font-weight:bold;
+        margin-bottom: 7px;
+    }
+    .field__content{
+        font-size: 12px;
+    }
+    .expertieses-container {
         display: flex;
-        .pam-rec-agent-card__avatar {
-            display: flex;
-            flex-direction: row;
-            margin-right: 20px;
-            .avatar{
-                width: 80px;
-                height: 80px;
-                border-radius: 50%;
-                margin-bottom: 10px;
-            }
-        }
-        .pam-rec-agent-card__main-info {
-            display: flex;
-            flex-direction: column;
-            justify-content: center;
-            .rec-desktop-name{
-                font-size: 12px;
-                font-weight: bold;
-            }
-            .rec-role {
-                font-size: 12px;
-                color:$PRUDENTIAL_GREY;
-            }
-            .rec-detail{
-                font-size: 12px;
-                color:$PRIMARY_RED;
-                font-weight: bold;
-                padding-top: 10px;
-            }
-        }
-        }
+        flex-wrap: wrap;
     }
-    
-    }
-.field__label {
-    font-size: 12px;
-    color: $PRUDENTIAL_GREY;
-    font-weight:bold;
-    margin-bottom: 7px;
-}
-.field__content{
-    font-size: 12px;
-}
-.expertieses-container {
-    display: flex;
-    flex-wrap: wrap;
-    
-}
-.btn{
-    width: 90px;
-    height: 43px;
-    font-size: 14px;
-    display: flex;
-    justify-content: center;
-    padding-top: 12px;
-    margin-right: 20px;
-}
-.btn2{
-    width: 90px;
-    height: 43px;
-    font-size: 14px;
-    display: flex;
-    justify-content: center;
-    padding-top: 12px;
-    margin-right: -10px;
-}
-.el-row--flex.is-justify-center{
-    justify-content:none;
-}
 }
 </style>

--
Gitblit v1.8.0