https://www.eeb.gov.hk/themes/enb_theme/components/index_promo_logos_block/script.js?tkob30

1"use strict";
2
3; (function ($) {
4
5
6  Vue.component('logoSlider', {
7    props: ['wrapperClass', 'sliderId', 'contentData'],
8    template:
9    '<div :class="\'swiper-container-wrapper \' + wrapperClass">'+
10    '<div class="swiper-container" :id="sliderId">'+
11    '  <div class="swiper-wrapper">'+
12//    '    <div class="swiper-slide" v-for="item of contentData">'+
13//    '      <a :href="item.link" target="_blank" class="stretched-link"><img :src="item.banner_image" :alt="item.title" :title="item.title"></a>'+
14	'    <div class="swiper-slide" v-for="item of contentData" v-html="item.url_tag">'+
15    '    </div>'+
16    '  </div>'+
17    '</div>'+
18    '  <div class="swiper-pagination"></div>'+
19    '  <div class="swiper-button-next" role="button" tabindex="0"></div>'+
20    '  <div class="swiper-button-prev" role="button" tabindex="0"></div>'+
21    '</div>'
22  })
23
24  let indexPromoLogosBlock = new Vue({
25    el: '.index-promo-logos-block',
26    mixins: [common],
27    data:{
28      promoLogoData : {},
29      promoSliderClass:'promo-logos-wrapper',
30      promoSliderId:'promo-logos'
31    },
32    created: function(){
33      let self = this
34      self.promoLogoData = self.getApiData('front-page/banner-1.json')
35    },
36    mounted: function(){
37      new Swiper('#promo-logos', {
38        slidesPerView: 1,
39        slidesPerGroup: 1,
40        spaceBetween: 15,
41        loop: true,
42        a11y: {
43          paginationBulletMessage: t(dataSrc.translation.toSlideTxt1)+ '{{index}}'+ t(dataSrc.translation.toSlideTxt2),
44          prevSlideMessage: t(dataSrc.translation.prevSlideTitle),
45          nextSlideMessage: t(dataSrc.translation.nextSlideTitle)
46        },
47        pagination: {
48          el: '.promo-logos-wrapper .swiper-pagination',
49          clickable: true,
50        },
51        navigation: {
52          nextEl: '.promo-logos-wrapper .swiper-button-next',
53          prevEl: '.promo-logos-wrapper .swiper-button-prev',
54        },
55        breakpoints: {
56          992: {
57            slidesPerView: 5,
58            slidesPerGroup: 5
59          },
60          768:{
61            slidesPerView: 4,
62            slidesPerGroup: 4
63          },
64          576:{
65            slidesPerView: 2,
66            slidesPerGroup: 2
67          }
68        }
69      });
70    }
71  })
72
73})(jQuery);