feat：图片轮播组件封装

components/ImageSwiper/index.vue

@@ -0,0 +1,36 @@
+<template>
+  <view class="image-swiper">
+    <swiper class="swiper-box" :indicator-dots="true" :autoplay="false" :interval="3000" :duration="1000">
+      <swiper-item v-for="(item, index) in mainImages" :key="index">
+        <image :src="item.url" mode="aspectFill"></image>
+      </swiper-item>
+    </swiper>
+
+    <view class="thumbnail-box">
+      <view v-for="(thumb, index) in thumbnails" :key="index" class="thumbnail-item">
+        <image :src="thumb.url" mode="aspectFill"></image>
+        <text>{{ thumb.description }}</text>
+      </view>
+    </view>
+  </view>
+</template>
+
+<script setup>
+import { ref } from 'vue';
+
+const mainImages = ref([
+  { url: 'https://example.com/main-image-1.jpg' },
+]);
+
+const thumbnails = ref([
+  { url: 'https://example.com/thumbnail-1.jpg', description: '瑶山古寨' },
+  { url: 'https://example.com/thumbnail-2.jpg', description: '民俗表演' },
+  { url: 'https://example.com/thumbnail-3.jpg', description: '特色美食' },
+  { url: 'https://example.com/thumbnail-4.jpg', description: '传统服饰' },
+  { url: 'https://example.com/thumbnail-5.jpg', description: '其他' },
+]);
+</script>
+
+<style scoped lang="scss">
+@import './styles/index.scss';
+</style>