Merge branch 'Phase2'

HelenHuang

2021-12-30 ac594e4efb30ba28776d74b0fb08ab34d7c32023

 PAMapp/components/Consultant/ConsultantSwiper.vue

@@ -10,9 +10,15 @@
          :key="index"
        >
            <div class="consultantCardStyle" >
              <UiAvatar :size="80" :fileName="agentInfo.img" class="mb-10"></UiAvatar>
              <UiAvatar
                class="mb-10"
                :size="80"
                :agentNo="agentInfo.agentNo"
              >
              </UiAvatar>
              <div class="name">{{agentInfo.name}}</div>
              <div>
              <div v-if="!hideReviews">
                <!-- TODO:隱藏滿意度 -->
                <i class="icon-star pam-icon icon--yellow"></i>
                <span class="satisfaction">{{agentInfo.avgScore}}</span>
              </div>
@@ -28,14 +34,18 @@
<script lang="ts">
import { Vue, Component, Prop } from 'vue-property-decorator';
import { SwiperOptions } from 'swiper';
import { Consultants } from '~/assets/ts/api/consultant'
import { Consultant } from '~/shared/models/consultant.model';
import { hideReviews } from '~/shared/const/hide-reviews';

@Component
export default class UiSwiper extends Vue {
    @Prop() agents!: Consultants[];

    @Prop()
    agents!: Consultant[];

    hideReviews = hideReviews ;
    swiperOptions: SwiperOptions = {
        loop: true,
      loop: false,
        slideToClickedSlide: false,
        navigation: {
          nextEl: '.swiper-button-next',
@@ -44,21 +54,20 @@
        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')
    }

}
@@ -88,6 +97,10 @@
      font-weight: bold;
      color: #707A81;
    }

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

  .swiper-button-prev {