$(function () {
  var galleryThumbs = new Swiper('.gallery-thumbs', {
    spaceBetween: 10,
    slidesPerView: 10,
    freeMode: true,
    watchSlidesVisibility: true,
    watchSlidesProgress: true,
    noSwiping: true

  });
  var galleryTop = new Swiper('.gallery-top', {
    spaceBetween: 10,
    thumbs: {
      swiper: galleryThumbs
    },
    navigation: {
      nextEl: '.swiper-button-next',
      prevEl: '.swiper-button-prev',
    },
  });
  const mySwiper = new Swiper(".banner-cont", {
    loop: true, // 循环模式选项
    autoplay: {
      delay: 5000, // 5秒自动切换
      disableOnInteraction: false, // 用户操作后继续自动播放
    },
    speed: 800, // 切换速度
    // 分页器配置
    pagination: {
      el: ".swiper-pagination",
      clickable: true,
      type: 'bullets',
    },
    // 监听切换事件，重置进度条动画
    on: {
      slideChange: function () {
        // 移除所有进度条动画
        document.querySelectorAll('.swiper-pagination-bullet').forEach(function(bullet) {
          bullet.classList.remove('progress-active');
        });
        // 给当前激活的添加进度动画
        const activeBullet = document.querySelector('.swiper-pagination-bullet-active');
        if (activeBullet) {
          activeBullet.classList.add('progress-active');
        }
      },
      init: function () {
        // 初始化时给第一个添加进度动画
        setTimeout(function() {
          const activeBullet = document.querySelector('.swiper-pagination-bullet-active');
          if (activeBullet) {
            activeBullet.classList.add('progress-active');
          }
        }, 100);
      }
    }
  });
})