From bdae23a40c461c2c6b6ee614f661eac731c949c8 Mon Sep 17 00:00:00 2001
From: Mila <Mila@pollex.com.tw>
Date: 星期三, 22 十二月 2021 14:12:05 +0800
Subject: [PATCH] Merge branch 'master' of https://192.168.0.10:8443/r/pcalife/PAM

---
 PAMapp/pages/recommendConsultant/result.vue |  236 +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
 1 files changed, 236 insertions(+), 0 deletions(-)

diff --git a/PAMapp/pages/recommendConsultant/result.vue b/PAMapp/pages/recommendConsultant/result.vue
new file mode 100644
index 0000000..3695bfc
--- /dev/null
+++ b/PAMapp/pages/recommendConsultant/result.vue
@@ -0,0 +1,236 @@
+<template>
+<div>
+    <div class="mdTxt pb-10">��憿批��</div>
+    <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__content-header">
+                    <div class="pam-rec-agent-card__avatar">
+                        <UiAvatar :fileName="info.img" ></UiAvatar>
+                    </div>
+                    <div class="pam-rec-agent-card__main-info">
+                        <div class="text--middle  pt-10 rec-desktop-name">{{ info.name }}</div>
+                        <div class="rec-role">{{ info.role }}</div>
+                        <span class="rec-detail fix-chrome-click--issue"  @click="showAgentDetail(info.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>
+                            <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">
+                            {{ info.seniority }}
+                            </div>
+                        </el-col>
+                        <!-- TODO:���遛��漲 -->
+                        <el-col :span="12" v-if="!hideReviews">
+                            <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">
+                    <AddAndReservedBtns
+                        :cusClass="'pam-rec-btns'"
+                        :agentInfo="info"
+                        @openPopUp="openPopUp"
+                    ></AddAndReservedBtns>
+                </div>
+            </div>
+        </li>
+    </ul>
+
+    <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>
+            <div class="text--center">
+                <el-button
+                    type="primary"
+                    @click="isVisiblePopUp = false"
+                >������</el-button>
+            </div>
+        </div>
+    </PopUpFrame>
+
+</div>
+</template>
+<script lang="ts">
+import {Vue,Component, State, namespace, Action} from 'nuxt-property-decorator';
+import { hideReviews } from '~/shared/const/hide-reviews';
+import { AgentOfStrictQuery } from '~/shared/models/strict-query.model';
+
+const localStorage = namespace('localStorage');
+
+@Component
+export default class Reslut extends Vue{
+    @State('strictQueryList') strictQueryList!: AgentOfStrictQuery[];
+    @Action storeStrictQueryList!: (data: any) => Promise<number>;
+    @localStorage.State recommendConsultantItem!: string;
+
+    pageList: any[] = [];
+    isVisiblePopUp = false;
+    popUpTxt = '';
+    hideReviews = hideReviews;
+    mounted() {
+        if (this.recommendConsultantItem && this.strictQueryList.length === 0) {
+            const strictQueryDto = JSON.parse(this.recommendConsultantItem);
+            this.storeStrictQueryList(strictQueryDto);
+        }
+    }
+
+    changePage(pageList: any[]) {
+        this.pageList = pageList;
+    }
+    showAgentDetail(agentNo: string): void {
+        this.$router.push(`/agentInfo/${agentNo}`);
+    }
+    openPopUp(txt: string) {
+        this.popUpTxt = txt;
+        this.isVisiblePopUp = true;
+    }
+}
+</script>
+
+<style lang="scss" scoped>
+.pam-rec-agent-card {
+    margin-bottom: 10px;
+    border-radius: 10px;
+    border: 1px solid $LIGHT_GREY;
+    padding: 20px 33px;
+
+    .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: 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;
+        }
+    }
+}
+
+.field__label {
+    font-size: 16px;
+    color: $PRUDENTIAL_GREY;
+    font-weight:bold;
+    margin-bottom: 7px;
+}
+.field__content{
+    font-size: 18px;
+}
+.expertieses-container {
+    display: flex;
+    flex-wrap: wrap;
+}
+
+@include desktop{
+    .pam-rec-agent__list{
+        display: flex;
+        flex-wrap: wrap;
+        flex-direction:row;
+        width: 100%;
+    }
+    .pam-paragraph{
+        margin-top: 10px;
+    }
+    .pam-rec-agent-card {
+        border-radius: 10px;
+        border: 1px solid $LIGHT_GREY;
+        padding: 15px 20px 15px 20px;
+        width: 170px;
+        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;
+        flex-wrap: wrap;
+    }
+}
+</style>

--
Gitblit v1.9.3