fixed: TODO#130845 推薦保險顧問: 伍夠勇跟左邊左右滑動疊到

Mila

2021-11-30 84efab848d77c44a7b46e06a12cbfee64e13e9c5

 PAMapp/components/Consultant/ConsultantSwiper.vue

@@ -5,12 +5,12 @@
      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>
@@ -35,7 +35,7 @@
    @Prop() agents!: Consultants[];

    swiperOptions: SwiperOptions = {
        loop: true,
      loop: false,
        slideToClickedSlide: false,
        navigation: {
          nextEl: '.swiper-button-next',
@@ -44,21 +44,18 @@
        breakpoints: {
          320: {
            slidesPerView: 3,
            slidesPerGroup: 3,
            spaceBetween: 3
            spaceBetween: -20
          },
          768: {
            slidesPerView: 6,
            slidesPerGroup: 6,
            spaceBetween: 3
            spaceBetween: -20
          }
        }
    }

    clkItem(loopIndex: number, realIndex: number) {
      const agentNo = this.agents[realIndex].agentNo;
      const agentNo = this.agents[loopIndex].agentNo;
      this.$router.push(`/agentInfo/${agentNo}`);
      console.log(loopIndex, realIndex, 'clkItem')
    }

}
@@ -78,6 +75,7 @@
  }

  .swiper-button-next,.swiper-button-prev {
    @extend .fix-chrome-click--issue;
    background-color: $PRIMARY_WHITE;
    top: 0px;
    height: 100%;
@@ -87,6 +85,10 @@
      font-weight: bold;
      color: #707A81;
    }

    &.swiper-button-disabled {
      pointer-events: auto;
    }
  }

  .swiper-button-prev {