index页面动态轮播图

api/banner/banner.js

@@ -0,0 +1,18 @@
+import request from '@/utils/request'
+
+/**
+ * 获取轮播图列表
+ * @param {Object} params - 查询参数
+ * @param {string} params.appId - 应用ID，默认为1
+ * @returns {Promise} 返回轮播图数据
+ */
+export function getBannerList(params = {}) {
+  return request({
+    url: '/app/banner',
+    method: 'GET',
+    params: {
+      appId: '1',
+      ...params,
+    },
+  })
+} 

pages/index/index.vue

@@ -40,6 +40,7 @@ import AnnouncementBar from '../../components/announcement-bar/announcement-bar.
 import BannerSwiper from '../../components/banner-swiper/banner-swiper.vue'
 import EquipmentList from '../../components/equipment-list/equipment-list.vue'
 import { getNewAnnouncement } from '../../api/article/article.js'
+import { getBannerList } from '../../api/banner/banner.js'
 
 export default {
   components: {
@@ -66,20 +67,7 @@ export default {
 
       // 轮播图数据
       currentBannerIndex: 0,
-      bannerList: [
-        {
-          image: commonEnum.TEMP1,
-        },
-        {
-          image: commonEnum.TEMP1,
-        },
-        {
-          image: commonEnum.TEMP2,
-        },
-        {
-          image: commonEnum.TEMP1,
-        },
-      ],
+      bannerList: [],
 
       // 设备列表数据
       equipmentList: [
@@ -106,6 +94,7 @@ export default {
   // 生命周期钩子
   onLoad() {
     this.fetchAnnouncement()
+    this.fetchBannerList()
   },
 
   methods: {
@@ -126,6 +115,42 @@ export default {
       }
     },
 
+    // 获取轮播图列表
+    async fetchBannerList() {
+      try {
+        const response = await getBannerList()
+        if (response.code === 200 && response.data && Array.isArray(response.data)) {
+          // 按orderNum排序，确保轮播图顺序正确
+          const sortedBanners = response.data
+            .filter(banner => banner.state === '1') // 只显示启用的轮播图
+            .sort((a, b) => parseInt(a.orderNum) - parseInt(b.orderNum))
+            .map(banner => ({
+              id: banner.id,
+              image: banner.imgUrl,
+              link: banner.link,
+              name: `轮播图${banner.id}`
+            }))
+          
+          this.bannerList = sortedBanners
+        }
+      } catch (error) {
+        console.error('获取轮播图失败:', error)
+        // 如果获取失败，使用默认轮播图
+        this.bannerList = [
+          {
+            id: 'default1',
+            image: commonEnum.TEMP1,
+            name: '默认轮播图1'
+          },
+          {
+            id: 'default2', 
+            image: commonEnum.TEMP2,
+            name: '默认轮播图2'
+          }
+        ]
+      }
+    },
+
     // 头部点击事件
     onLocationClick() {
       uni.showToast({
@@ -161,10 +186,12 @@ export default {
 
     // 轮播图点击事件
     onBannerClick({ item, index }) {
-      uni.showToast({
-        title: `查看${item.name}详情`,
-        icon: 'none',
-      })
+      if (item.link) {
+        // 如果有链接，跳转到对应页面
+        uni.navigateTo({
+          url: item.link
+        })
+      } 
     },
 
     // 设备点击事件