From 9bdb95c9e34cef640534e5e5a1e2225a80442000 Mon Sep 17 00:00:00 2001 From: HelenHuang <LinHuang@pollex.com.tw> Date: 星期四, 09 六月 2022 15:48:15 +0800 Subject: [PATCH] TODO#139894 [ footer -最下方說明與保經代合作 ] 文案修改 --- PAMapp/components/QuickFilter/QuickFilterConsultantList.vue | 101 ++++++++++++++++++++++++++++++-------------------- 1 files changed, 61 insertions(+), 40 deletions(-) diff --git a/PAMapp/components/QuickFilter/QuickFilterConsultantList.vue b/PAMapp/components/QuickFilter/QuickFilterConsultantList.vue index cebf8c7..7daefd9 100644 --- a/PAMapp/components/QuickFilter/QuickFilterConsultantList.vue +++ b/PAMapp/components/QuickFilter/QuickFilterConsultantList.vue @@ -5,7 +5,7 @@ :autoplay="false" indicator-position="none" arrow="never" - class="pam-consultant-carousel" + class="pam-quickFilter-carousel" ref="carouselRef" > <el-carousel-item @@ -14,22 +14,24 @@ > <div class="fill" - @touchstart="touchStart" - @touchend="moveCard" + @touchstart="moveStart" + @touchend="moveEnd" > - <el-avatar + <UiAvatar :size="200" - class="mx-auto cursor--pointer" - @click="$router.push('/agentInfo')" - :src="item.img" - /> - <div class="mdTxt mt-30 mb-30 text--center">{{item.name}}(隡舀��蝬�鈭�)</div> + :agentNo="item.agentNo" + class="mx-auto" + @click.native="showAgentDetail(item.agentNo)" + ></UiAvatar> + <div class="mdTxt mt-30 mb-30 text--center" + >{{item.name}}<span v-if="item.role">({{item.role}})</span> + </div> <el-row> <el-col :span="12"> <div class="smTxt_bold mb-10 text--prudential_grey">����風</div> <div class="mb-10">{{item.seniority}}</div> </el-col> - <el-col :span="12"> + <el-col :span="12" v-if="!hideReviews"> <div class="smTxt_bold mb-10 text--prudential_grey">摰X皛踵�漲</div> <div> <i class="icon-star pam-icon icon--yellow "></i> @@ -64,8 +66,12 @@ > <div class="text--center mdTxt"> <p class="mb-50">{{popUpTxt}}</p> - <p class="text--primary cursor--pointer" - @click="isVisiblePopUp = false">������</p> + <div class="text--center"> + <el-button + type="primary" + @click="isVisiblePopUp = false" + >������</el-button> + </div> </div> </PopUpFrame> @@ -73,31 +79,55 @@ </template> <script lang="ts"> +import { Consultant } from '~/shared/models/consultant.model'; import { ElCarousel } from 'element-ui/types/carousel'; +import { hideReviews } from '~/shared/const/hide-reviews'; import { Vue, Component, Prop } from 'vue-property-decorator'; -import { Consultants } from '~/assets/ts/api/consultant'; @Component export default class QuickFilterConsultantList extends Vue { - @Prop() consultantList!: Consultants[]; + @Prop() + consultantList!: Consultant[]; + isVisiblePopUp = false; + popUpTxt = '����憿批��'; startPosition = 0; endPosition = 0; - popUpTxt = '����憿批��'; + startYPosition = 0; + endYPosition = 0; + hideReviews = hideReviews ; - touchStart(event: TouchEvent) { + ////////////////////////////////////////////////////////////////// + + moveStart(event: TouchEvent) { this.startPosition = event.changedTouches[0].clientX; + this.startYPosition = event.changedTouches[0].clientY; } - moveCard(event: any) { + moveEnd(event: TouchEvent) { this.endPosition = event.changedTouches[0].clientX; - if (this.endPosition < this.startPosition) { - this.nextCard(); - } + this.endYPosition = event.changedTouches[0].clientY; + if (Math.abs(this.endYPosition - this.startYPosition) < 50) { + if (this.endPosition < this.startPosition) { + this.nextCard(); + return; + } - if (this.endPosition > this.startPosition) { - this.prevCard(); + if (this.endPosition > this.startPosition) { + this.prevCard(); + } } + } + + ////////////////////////////////////////////////////////////////// + + openPopUp(txt: string) { + this.popUpTxt = txt; + this.isVisiblePopUp = true; + } + + showAgentDetail(agentNo: string): void { + this.$router.push(`/agentInfo/${agentNo}`); } nextCard() { @@ -107,12 +137,6 @@ prevCard() { (this.$refs.carouselRef as ElCarousel).prev(); } - - openPopUp(txt: string) { - this.popUpTxt = txt; - this.isVisiblePopUp = true; - } - } </script> @@ -144,7 +168,6 @@ border-radius: 50px; background-color: $LIGHT_GREY; color: $CORAL; - z-index: 2; cursor: pointer; &:before { @@ -153,28 +176,26 @@ } } - .pam-right-arrow { - &:before { - margin-left: 15px; - } + .pam-left-arrow:before { + margin-left: 25px; } - .pam-left-arrow { - &:before { - margin-left: 25px; - } + .pam-right-arrow:before { + margin-left: 15px; } .arrow-right-position { top: 50%; - right: -60px; + right: -40px; transform: translateY(-50%); + z-index: 3; } .arrow-left-position { top: 50%; - left: -60px; + left: -40px; transform: translateY(-50%); + z-index: 3; } .relative { @@ -203,4 +224,4 @@ } } -</style> \ No newline at end of file +</style> -- Gitblit v1.8.0