From 74e563da7fa6886449fd2be5933e2d4ca5c85f48 Mon Sep 17 00:00:00 2001 From: jack <jack.su@pollex.com.tw> Date: 星期二, 12 九月 2023 11:25:52 +0800 Subject: [PATCH] [UPDATE] 解決弱點Se: Incorrect definition of Serializable class [UPDATE] 解決弱點Information exposure to log file [UPDATE] 解決弱點Use of hard-coded password --- PAMapp/components/QuickFilter/QuickFilterConsultantList.vue | 163 +++++++++++++++++++++++++++++------------------------- 1 files changed, 88 insertions(+), 75 deletions(-) diff --git a/PAMapp/components/QuickFilter/QuickFilterConsultantList.vue b/PAMapp/components/QuickFilter/QuickFilterConsultantList.vue index d213f80..7daefd9 100644 --- a/PAMapp/components/QuickFilter/QuickFilterConsultantList.vue +++ b/PAMapp/components/QuickFilter/QuickFilterConsultantList.vue @@ -5,110 +5,129 @@ :autoplay="false" indicator-position="none" arrow="never" - class="pam-consultant-carousel" + class="pam-quickFilter-carousel" ref="carouselRef" > <el-carousel-item - v-for="(item, index) in 5" + v-for="(item, index) in consultantList" :key="index" > <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="" - /> - <div class="mdTxt mt-30 mb-10 text--center">�蝢��(隡舀��蝬�鈭�)</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">銝�撟�12���</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"></i> - 4.8</div> + <i class="icon-star pam-icon icon--yellow "></i> + {{item.avgScore}}</div> </el-col> </el-row> - <div class="smTxt_bold mb-10 text--prudential_grey">撠����</div> - <div class="p bold">#鞎∪����</div> - </div> - <div class="fixedBtn text--center"> - <el-button @click="addConsultant"> - <i class="icon-add smTxt"></i> - <span>憿批��</span> - </el-button> - <el-button - @click="$router.push('/communication/myDemand')" - type="primary" - >�脰����</el-button> + <div class="smTxt_bold mt-10 mb-10 text--prudential_grey">撠����</div> + <div> + <span + v-for="(i, index) in item.expertise" + :key="index" + class="p bold mr-30 mb-10 inline-block" + >#{{i}}</span> + </div> + <AddAndReservedBtns + :cusClass="'fixedBtn'" + :agentInfo="item" + @openPopUp="openPopUp" + ></AddAndReservedBtns> </div> </el-carousel-item> </el-carousel> - <div class="absolute arrow-left-position" @click="nextCard"> + <div class="absolute arrow-left-position" @click="prevCard"> <i class="icon-left pam-left-arrow"></i> </div> <div class="absolute arrow-right-position" @click="nextCard"> <i class="icon-right pam-right-arrow"></i> </div> - <Ui-Drawer - :isVisible.sync="isVisibleDrawer" + <PopUpFrame :isOpen.sync="isVisiblePopUp" > <div class="text--center mdTxt"> - <p class="mb-50">����憿批��</p> - <p class="text--primary cursor--pointer" - @click="isVisibleDrawer = false">������</p> + <p class="mb-50">{{popUpTxt}}</p> + <div class="text--center"> + <el-button + type="primary" + @click="isVisiblePopUp = false" + >������</el-button> + </div> </div> - </Ui-Drawer> - - <Ui-Dialog - :isVisible.sync="isVisibleDialog" - > - <div class="text--center mdTxt"> - <p class="mb-50">����憿批��</p> - <p class="text--primary cursor--pointer" - @click="isVisibleDialog = false">������</p> - </div> - </Ui-Dialog> + </PopUpFrame> </div> </template> <script lang="ts"> +import { Consultant } from '~/shared/models/consultant.model'; import { ElCarousel } from 'element-ui/types/carousel'; -import { Vue, Component } from 'vue-property-decorator'; -import { isMobileDevice } from '~/assets/ts/device'; +import { hideReviews } from '~/shared/const/hide-reviews'; +import { Vue, Component, Prop } from 'vue-property-decorator'; @Component export default class QuickFilterConsultantList extends Vue { - isVisibleDrawer = false; - isVisibleDialog = false; + @Prop() + consultantList!: Consultant[]; + + isVisiblePopUp = false; + popUpTxt = '����憿批��'; startPosition = 0; endPosition = 0; + 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(); - return; - } + 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(); - return; + 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() { @@ -117,12 +136,6 @@ prevCard() { (this.$refs.carouselRef as ElCarousel).prev(); - } - - addConsultant() { - isMobileDevice() - ? this.isVisibleDrawer = true - : this.isVisibleDialog = true; } } @@ -146,7 +159,6 @@ bottom: 30px; left: 50%; transform: translateX(-50%); - width: 100%; } .pam-left-arrow,.pam-right-arrow { @@ -156,7 +168,6 @@ border-radius: 50px; background-color: $LIGHT_GREY; color: $CORAL; - z-index: 2; cursor: pointer; &:before { @@ -165,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 { @@ -195,6 +204,10 @@ .absolute { position: absolute; + } + + .inline-block { + display: inline-block; } @media (min-width: 768px) { @@ -211,4 +224,4 @@ } } -</style> \ No newline at end of file +</style> -- Gitblit v1.8.0