| | |
| | | class="swiperStyle" |
| | | @click-slide="clkItem" |
| | | > |
| | | <swiper-slide |
| | | <swiper-slide class="fix-chrome-click--issue" |
| | | v-for="(agentInfo, index) in agents" |
| | | :key="index" |
| | | > |
| | | <div class="consultantCardStyle" > |
| | | <el-avatar class="mb-10" :size="80" :src="agentInfo.img"></el-avatar> |
| | | <UiAvatar :size="80" :fileName="agentInfo.img" class="mb-10"></UiAvatar> |
| | | <div class="name">{{agentInfo.name}}</div> |
| | | <div> |
| | | <i class="icon-star pam-icon icon--yellow"></i> |
| | | <span class="satisfaction">{{agentInfo.satisfaction}}</span> |
| | | <span class="satisfaction">{{agentInfo.avgScore}}</span> |
| | | </div> |
| | | </div> |
| | | </swiper-slide> |
| | |
| | | <script lang="ts"> |
| | | import { Vue, Component, Prop } from 'vue-property-decorator'; |
| | | import { SwiperOptions } from 'swiper'; |
| | | import { Agents } from '~/plugins/api/home' |
| | | import { Consultants } from '~/assets/ts/api/consultant' |
| | | |
| | | @Component |
| | | export default class UiSwiper extends Vue { |
| | | @Prop() agents!: Agents[]; |
| | | @Prop() agents!: Consultants[]; |
| | | |
| | | swiperOptions: SwiperOptions = { |
| | | loop: true, |
| | |
| | | } |
| | | |
| | | clkItem(loopIndex: number, realIndex: number) { |
| | | this.$router.push('/agentInfo'); |
| | | const agentNo = this.agents[realIndex].agentNo; |
| | | this.$router.push(`/agentInfo/${agentNo}`); |
| | | console.log(loopIndex, realIndex, 'clkItem') |
| | | } |
| | | |
| | |
| | | } |
| | | |
| | | .swiper-button-next,.swiper-button-prev { |
| | | @extend .fix-chrome-click--issue; |
| | | background-color: $PRIMARY_WHITE; |
| | | top: 0px; |
| | | height: 100%; |