优化主页图片和健康档案里的调养详情图片显示 没显示之前显示加载中

miniprogram/components/media-carousel/media-carousel.js

@@ -14,6 +14,11 @@ Component({
         });
       }
     },
+    // 项目ID，用于标识轮播图属于哪个项目
+    itemId: {
+      type: String,
+      value: ''
+    },
     // 是否显示指示器
     showIndicator: {
       type: Boolean,
@@ -48,7 +53,7 @@ Component({
     circular: {
       type: Boolean,
       value: true
-    },
+    }
   },
 
   /**
@@ -59,75 +64,40 @@ Component({
     totalCount: 0
   },
 
+
   /**
    * 组件的方法列表
    */
   methods: {
-    // 轮播切换事件
-    onChange(e) {
-      const { current } = e.detail;
-      this.setData({
-        currentIndex: current
-      });
-      
-      // 触发自定义事件
-      this.triggerEvent('change', {
-        current: current,
-        total: this.data.totalCount
-      });
-    },
-
     // 图片加载成功
     onImageLoad(e) {
       const { index } = e.currentTarget.dataset;
       this.triggerEvent('imageload', {
         index: index,
-        item: this.data.mediaList[index]
+        item: this.data.mediaList[index],
+        itemId: this.properties.itemId
       });
     },
 
     // 图片加载失败
     onImageError(e) {
       const { index } = e.currentTarget.dataset;
+  
       this.triggerEvent('imageerror', {
         index: index,
-        item: this.data.mediaList[index]
+        item: this.data.mediaList[index],
+        itemId: this.properties.itemId
       });
     },
 
-    // 视频开始播放
-    onVideoPlay(e) {
-      const { index } = e.currentTarget.dataset;
-      this.triggerEvent('videoplay', {
-        index: index,
-        item: this.data.mediaList[index]
-      });
-    },
-
-    // 视频暂停
-    onVideoPause(e) {
-      const { index } = e.currentTarget.dataset;
-      this.triggerEvent('videopause', {
-        index: index,
-        item: this.data.mediaList[index]
-      });
-    },
-
-    // 视频播放结束
-    onVideoEnded(e) {
-      const { index } = e.currentTarget.dataset;
-      this.triggerEvent('videoended', {
-        index: index,
-        item: this.data.mediaList[index]
-      });
-    },
 
     // 视频播放错误
     onVideoError(e) {
       const { index } = e.currentTarget.dataset;
       this.triggerEvent('videoerror', {
         index: index,
-        item: this.data.mediaList[index]
+        item: this.data.mediaList[index],
+        itemId: this.properties.itemId
       });
     }
   }

miniprogram/components/media-carousel/media-carousel.wxml

@@ -9,7 +9,6 @@
     interval="{{interval}}" 
     duration="{{duration}}"
     circular="{{circular}}"
-    bind:change="onChange"
   >
     <swiper-item wx:for="{{mediaList}}" wx:key="index" class="carousel-item">
       <!-- 图片轮播 -->
@@ -38,9 +37,6 @@
           autoplay="{{true}}"
           loop="{{true}}"
           muted="{{true}}"
-          bind:play="onVideoPlay"
-          bind:pause="onVideoPause"
-          bind:ended="onVideoEnded"
           bind:error="onVideoError"
           data-index="{{index}}"
         />

miniprogram/module/care/pages/careDetail/careDetail.json

@@ -17,6 +17,7 @@
     "t-drawer": "tdesign-miniprogram/drawer/drawer",
     "t-skeleton": "tdesign-miniprogram/skeleton/skeleton",
     "t-empty": "tdesign-miniprogram/empty/empty",
+    "t-loading": "tdesign-miniprogram/loading/loading",
     "media-carousel": "../../../../components/media-carousel/media-carousel"
   },
   "componentPlaceholder": {

miniprogram/module/care/pages/careDetail/careDetail.scss

@@ -567,6 +567,18 @@ ec-canvas {
     height: 100%;
   }
 }
+
+// 轮播图加载状态样式
+.carousel-loading {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  height: 100%;
+  background-color: #f5f5f5;
+  border: 1px dashed #ddd;
+  border-radius: 16rpx;
+}
+
 .carousel-box{
   width: 100%;
   height: 200rpx;
@@ -576,4 +588,5 @@ ec-canvas {
   justify-content: center;
   align-items: center;
   margin: 20rpx;
-}
+}
+

miniprogram/module/care/pages/careDetail/careDetail.ts

@@ -2,26 +2,26 @@ import { Post } from "../../../../lib/request/method";
 import { fromHealthReportSymptom } from "../../../../utils/util";
 Page({
   onLoad(options) {
-    // console.log("options", options);
     if (options.id) {
       wx.setStorageSync("careId", Number(options.id));
       this.getCareDetail(Number(options.id));
     }
-    const patientName = wx.getStorageSync("patientName");
-    if (patientName) {
-      this.setData({
-        patientName,
-      });
-    }
-  },
 
+    // const patientName = wx.getStorageSync("patientName");
+    // if (patientName) {
+    //   this.setData({
+    //     patientName,
+    //   });
+    // }
+  },
   data: {
-    patientName: "",
+    // patientName: "",
     careDetail: {},
     healthReports: [],
     statusText: "未知状态",
     loading: true,
     isShowDelivery: false,
+    carouselLoading: {} as Record<string | number, boolean>, // 用于跟踪每个轮播图的加载状态
   },
   onCardRecord(e: any) {
     const id = e.currentTarget.dataset.id;
@@ -29,12 +29,69 @@ Page({
       url: `/module/article/pages/punch-card/punch-card?id=${id}`,
     });
   },
+
+  // 轮播图加载完成
+  onCarouselLoaded(e: any) {
+    const { itemId } = e.detail;
+    if (itemId) {
+      this.setData({
+        [`carouselLoading.${itemId}`]: false,
+      });
+    }
+  },
+  // 图片加载失败
+  onImageError(e: any) {
+    const { itemId } = e.detail;
+    // 图片加载失败时也要隐藏加载状态
+    if (itemId) {
+      this.setData({
+        [`carouselLoading.${itemId}`]: false,
+      });
+    }
+  },
+
+  // 视频播放错误
+  onVideoError(e: any) {
+    const { itemId } = e.detail;
+    // 视频播放错误时也要隐藏加载状态
+    if (itemId) {
+      this.setData({
+        [`carouselLoading.${itemId}`]: false,
+      });
+    }
+  },
+
+  // 测试图片加载
+  testImageLoading(mediaList: any[], itemId: string | number) {
+    mediaList.forEach((media) => {
+      if (media.type === "image") {
+        wx.getImageInfo({
+          src: media.src,
+          success: () => {
+            // 图片加载成功，隐藏加载状态
+            this.setData({
+              [`carouselLoading.${itemId}`]: false,
+            });
+          },
+          fail: () => {
+            // 图片加载失败，也要隐藏加载状态
+            this.setData({
+              [`carouselLoading.${itemId}`]: false,
+            });
+          },
+        });
+      } else if (media.type === "video") {
+        // 视频不进行预加载测试
+      }
+    });
+  },
   // 获取调理详情
   async getCareDetail(id: number) {
     wx.showLoading({
       title: "加载中",
       mask: true,
     });
+    // 获取调理详情
     try {
       const res = await Post(
         `/patientCrManage/getPcrProcessById/${id}`,
@@ -57,74 +114,91 @@ Page({
           "5": "已完结",
         };
         const statusText = statusMap[res.progress] || "未知状态";
-        if (res.items.length > 0) {
-          isShowDelivery = res.items.some((item: any) => {
-            return item.conditioningProgramDetail?.isDelivery === "Y";
-          });
+        
+        let isShowDelivery = false;
+        if (res && res.items && res.items.length > 0) {
           res.items.forEach((item: any) => {
             item.carouselMediaList = [];
+            // 添加photo
+            if (item.conditioningProgramDetail?.photo) {
+              item.carouselMediaList.push({
+                type: "image",
+                src: item.conditioningProgramDetail?.photo,
+                title: "商品图片",
+              });
+            }
+            // 添加itemImgFirst
+            if (item?.conditioningProgramDetail?.itemImgFirst) {
+              item.carouselMediaList.push({
+                type: "image",
+                src: item.conditioningProgramDetail?.itemImgFirst,
+                title: "操作图片",
+              });
+            }
 
-           // 添加photo
-           if (item.conditioningProgramDetail?.photo) {
-             item.carouselMediaList.push({
-               type: 'image',
-               src: item.conditioningProgramDetail?.photo,
-               title: '商品图片'
-             });
-           }
+            // 添加itemVideoFirst
+            if (item?.conditioningProgramDetail?.itemVideoFirst) {
+              item.carouselMediaList.push({
+                type: "video",
+                src: item.conditioningProgramDetail?.itemVideoFirst,
+                title: "操作视频",
+              });
+            }
 
-           // 添加itemImgFirst
-           if (item?.conditioningProgramDetail?.itemImgFirst) {
-             item.carouselMediaList.push({
-               type: 'image',
-               src: item.conditioningProgramDetail?.itemImgFirst,
-               title: '操作图片'
-             });
-           }
+            // 如果有轮播图内容，设置加载状态
+            if (item.carouselMediaList.length > 0) {
+              this.setData({
+                [`carouselLoading.${item.id}`]: true,
+              });
 
-           // 添加itemVideoFirst
-           if (item?.conditioningProgramDetail?.itemVideoFirst) {
-             item.carouselMediaList.push({
-               type: 'video',
-               src: item.conditioningProgramDetail?.itemVideoFirst,
-               title: '操作视频'
-             });
-           }
+              // 测试图片是否可以正常加载
+              this.testImageLoading(item.carouselMediaList, item.id);
 
-           });
-        }
-        this.setData({
-          loading: false,
-          careDetail: res,
-          statusText,
-        });
-        console.log(res, "服务包详情数据");
-        let isShowDelivery = false;
-        console.log(res.items, "服务包详情数据");
-        if (res.items.length > 0) {
+              // 设置超时，防止一直显示加载中
+              setTimeout(() => {
+                // 检查是否还在加载状态，如果是则自动隐藏
+                const currentLoading = this.data.carouselLoading;
+                if (currentLoading && currentLoading[item.id]) {
+                  this.setData({
+                    [`carouselLoading.${item.id}`]: false,
+                  });
+                }
+              }, 10000); // 10秒后自动隐藏加载状态
+            } else {
+              // 如果没有轮播图内容，确保不显示加载状态
+              this.setData({
+                [`carouselLoading.${item.id}`]: false,
+              });
+            }
+          });
+          // 是否显示配送
           isShowDelivery = res.items.some((item: any) => {
             return item.conditioningProgramDetail?.isDelivery === "Y";
           });
+          var data = res.items.find(
+            (item: any) =>
+              Array.isArray(item.healthAnalysisReports) &&
+              item.healthAnalysisReports.length > 0
+          );
+          if (data) {
+            const items = data.healthAnalysisReports.map((report: any) => {
+              return {
+                ...report,
+                symptoms: fromHealthReportSymptom(report).items,
+              };
+            });
+            this.setData({
+              healthReports: items,
+            });
+          }
         }
         this.setData({
+          loading: false,
+          careDetail: res,
+          statusText,
           isShowDelivery,
         });
-        var data = res.items.find(
-          (item: any) =>
-            Array.isArray(item.healthAnalysisReports) &&
-            item.healthAnalysisReports.length > 0
-        );
-        if (data) {
-          const items = data.healthAnalysisReports.map((report: any) => {
-            return {
-              ...report,
-              symptoms: fromHealthReportSymptom(report).items,
-            };
-          });
-          this.setData({
-            healthReports: items,
-          });
-        }
+
         // 设置页面标题
         if (res.conditioningWrapName) {
           wx.setNavigationBarTitle({
@@ -156,9 +230,7 @@ Page({
     // 跳转核销记录
     wx.navigateTo({
       url: `/module/care/pages/care/verifyRecord?id=${id}`,
-      success: () => {
-        // console.log("跳转成功");
-      },
+      success: () => {},
       fail: (error) => {
         console.error("跳转失败:", error);
       },

miniprogram/module/care/pages/careDetail/careDetail.wxml

@@ -24,13 +24,12 @@
                  {{careDetail.provinceName}}{{careDetail.cityName}}{{careDetail.areaName}}{{careDetail.detailAddress}}
                   </view>
                   <view>
-                  <text style="margin-right:10px"> {{patientName}}</text>
-                  <text>{{careDetail.phone}}</text>
-                  
+                  <text style="margin-right:10px" wx:if="{{careDetail.patientName}}"> {{careDetail.patientName}}</text>
+                  <text wx:if="{{careDetail.phone}}">{{careDetail.phone}}</text>
                   </view>
                 </view>
               </view>
-              <view class="row"><text class="label">价格：</text>{{careDetail.cost}}元</view>
+              <view class="row"><text class="label" wx:if="{{careDetail.cost}}">价格：</text>{{careDetail.cost}}元</view>
             </view>
           </view>
         </view>
@@ -59,9 +58,25 @@
             <view class="scheme-card" wx:if="{{item.conditioningProgramDetail.isOffline && item.conditioningProgramDetail.isOffline==='Y'}}">
               <view class="scheme-title" wx:if="{{item.conditioningProgramDetail && item.conditioningProgramDetail.name && item.conditioningProgramDetail.name!=='null'}}">{{item.conditioningProgramDetail.name}}</view>
               <view class="divider"></view>
-                  <view class="carousel-box" wx:if="{{item.carouselMediaList && item.carouselMediaList.length > 0}}">
+            <view class="carousel-box" wx:if="{{item.carouselMediaList && item.carouselMediaList.length > 0}}">
                <view class="carousel-container" >
-                  <media-carousel mediaList="{{item.carouselMediaList}}" showIndicator="{{true}}" autoplay="{{true}}" interval="{{4000}}" circular="{{true}}" bind:change="onCarouselChange" bind:imageload="onImageLoad" bind:imageerror="onImageError" bind:videoplay="onVideoPlay" bind:videopause="onVideoPause" bind:videoended="onVideoEnded" bind:videoerror="onVideoError" />
+                  <!-- 加载状态 -->
+                  <view wx:if="{{carouselLoading[item.id]}}" class="carousel-loading">
+                    <t-loading size="40rpx" text="加载中..." />
+                  </view>
+                  <!-- 轮播图 -->
+                  <media-carousel 
+                    wx:else 
+                    mediaList="{{item.carouselMediaList}}"
+                    showIndicator="{{true}}" 
+                    autoplay="{{true}}"
+                    interval="{{4000}}" 
+                    circular="{{true}}" 
+                    bind:imageload="onCarouselLoaded" 
+                    bind:imageerror="onImageError" 
+                    bind:videoerror="onVideoError" 
+                    itemId="{{item.id}}" 
+                  />
                 </view>
                 </view>
               <view class="scheme-row light"><text class="text-gray" wx:if="{{item.arrangeDate || item.arrangeDate!==null}}">下次时间：</text>{{item.arrangeDate}}</view>
@@ -98,7 +113,23 @@
               <view class="divider"></view>
                  <view class="carousel-box" wx:if="{{item.carouselMediaList && item.carouselMediaList.length > 0}}">
                <view class="carousel-container">
-                  <media-carousel mediaList="{{item.carouselMediaList}}" showIndicator="{{true}}" autoplay="{{true}}" interval="{{4000}}" circular="{{true}}" bind:change="onCarouselChange" bind:imageload="onImageLoad" bind:imageerror="onImageError" bind:videoplay="onVideoPlay" bind:videopause="onVideoPause" bind:videoended="onVideoEnded" bind:videoerror="onVideoError" />
+                  <!-- 加载状态 -->
+                  <view wx:if="{{carouselLoading[item.id]}}" class="carousel-loading">
+                    <t-loading size="40rpx" text="加载中..." />
+                  </view>
+                  <!-- 轮播图 -->
+                  <media-carousel 
+                    wx:else 
+                    mediaList="{{item.carouselMediaList}}" 
+                    showIndicator="{{true}}" 
+                    autoplay="{{true}}" 
+                    interval="{{4000}}" 
+                    circular="{{true}}" 
+                    bind:imageload="onCarouselLoaded"   
+                    bind:imageerror="onImageError" 
+                    bind:videoerror="onVideoError" 
+                    itemId="{{item.id}}" 
+                  />
                 </view>
                 </view>
               <view class="scheme-row light">
@@ -123,7 +154,27 @@
               <view class="divider"></view>
              <view class="carousel-box" wx:if="{{item.carouselMediaList && item.carouselMediaList.length > 0}}">
                <view class="carousel-container">
-                  <media-carousel mediaList="{{item.carouselMediaList}}" showIndicator="{{true}}" autoplay="{{true}}" interval="{{4000}}" circular="{{true}}" bind:change="onCarouselChange" bind:imageload="onImageLoad" bind:imageerror="onImageError" bind:videoplay="onVideoPlay" bind:videopause="onVideoPause" bind:videoended="onVideoEnded" bind:videoerror="onVideoError" />
+                  <!-- 加载状态 -->
+                  <view wx:if="{{carouselLoading[item.id]}}" class="carousel-loading">
+                    <t-loading size="40rpx" text="加载中..." />
+                  </view>
+                  <!-- 轮播图 -->
+                  <media-carousel 
+                    wx:else 
+                    mediaList="{{item.carouselMediaList}}" 
+                    showIndicator="{{true}}" 
+                    autoplay="{{true}}" 
+                    interval="{{4000}}" 
+                    circular="{{true}}" 
+                    bind:change="onCarouselChange" 
+                    bind:imageload="onCarouselLoaded" 
+                    bind:imageerror="onImageError" 
+                    bind:videoplay="onVideoPlay" 
+                    bind:videopause="onVideoPause" 
+                    bind:videoended="onVideoEnded" 
+                    bind:videoerror="onVideoError" 
+                    itemId="{{item.id}}" 
+                  />
                 </view>
                 </view>
               <view class="scheme-row between" style="margin-top:15px">
@@ -145,7 +196,7 @@
                 </view>
               
               </view>
-              <view class="desc-row" wx-if="{{item.remark}}">
+              <view class="desc-row" wx:if="{{item.remark && item.remark !== ''}}">
                 <text class="text-gray">操作指南：</text>
                 <text class="desc-label">{{item.remark}}</text>
               </view>

miniprogram/pages/home/home.scss

@@ -557,9 +557,47 @@ $scale: 0.5;
   overflow: hidden;
   height: 200rpx;
   width: 50%;
+  position: relative;
   
   .media-carousel {
     height: 100%;
   }
+
+  // 加载状态覆盖层
+  .loading-overlay {
+    position: absolute;
+    top: 0;
+    left: 0;
+    right: 0;
+    bottom: 0;
+    display: flex;
+    flex-direction: column;
+    justify-content: center;
+    align-items: center;
+    background-color: rgba(248, 249, 250, 0.95);
+    border-radius: 16rpx;
+    z-index: 10;
+
+    .loading-spinner {
+      width: 40rpx;
+      height: 40rpx;
+      border: 4rpx solid #e9ecef;
+      border-top: 4rpx solid #2ec4b6;
+      border-radius: 50%;
+      animation: spin 1s linear infinite;
+      margin-bottom: 16rpx;
+    }
+
+    .loading-text {
+      font-size: 24rpx;
+      color: #6c757d;
+    }
+  }
+}
+
+// 加载动画
+@keyframes spin {
+  0% { transform: rotate(0deg); }
+  100% { transform: rotate(360deg); }
 }
 

miniprogram/pages/home/home.ts

@@ -70,23 +70,23 @@ Page({
 
     // 轮播媒体列表
     carouselMediaList: [
-      {
-        type: 'image',
-        src: "https://wx.hzliuzhi.com:4433/manager/file/statics/2025/08/07/222_20250807164536A813.jpg",
-        title: '操作图片'
-      },  
-      {
-        type: 'image',
-        src: "https://wx.hzliuzhi.com:4433/manager/file/statics/2025/08/07/111_20250807164533A812.jpg",
-        title: '商品图片'
-      },
-      {
-        type: 'video',
-        src: 'https://wx.hzliuzhi.com:4433/manager/file/statics/2025/08/07/song_20250807164546A814.mp4',
-        title: '操作视频'
-      },
+      // {
+      //   type: 'image',
+      //   src: "https://wx.hzliuzhi.com:4433/manager/file/statics/2025/08/07/222_20250807164536A813.jpg",
+      //   title: '操作图片'
+      // },
+      // {
+      //   type: 'image',
+      //   src: "https://wx.hzliuzhi.com:4433/manager/file/statics/2025/08/07/111_20250807164533A812.jpg",
+      //   title: '商品图片'
+      // },
+      // {
+      //   type: 'video',
+      //   src: 'https://wx.hzliuzhi.com:4433/manager/file/statics/2025/08/07/song_20250807164546A814.mp4',
+      //   title: '操作视频'
+      // },
     ] as Array<{
-      type: 'image' | 'video';
+      type: "image" | "video";
       src: string;
       poster?: string;
       title?: string;
@@ -100,48 +100,76 @@ Page({
   // 获取调养计划
   async getCareLists() {
     const res = await getCareList();
-    console.log(res, "res==careList");
     if (res && res.length > 0) {
-      res.forEach((item: any) => {
-       item.carouselMediaList = [];
-      
-      // 添加photo
-      if (item.photo) {
-        item.carouselMediaList.push({
-          type: 'image',
-          src: item.photo,
-          title: '商品图片'
-        });
-      }
-      
-      // 添加itemImgFirst
-      if (item?.itemImgFirst) {
-        item.carouselMediaList.push({
-          type: 'image',
-          src: item.itemImgFirst,
-          title: '操作图片'
-        });
-      }
-      
-      // 添加itemVideoFirst
-      if (item?.itemVideoFirst) {
-        item.carouselMediaList.push({
-          type: 'video',
-          src: item.itemVideoFirst,
-          poster: item.photo || item.itemImgFirst, // 使用photo或itemImgFirst作为视频封面
-          title: '操作视频'
-        });
-      }
-      
-      // 添加调试信息
-      console.log(`调养计划 ${item.conditioningProgramName} 的轮播数据:`, {
-        photo: item.photo,
-        itemImgFirst: item.itemImgFirst,
-        itemVideoFirst: item.itemVideoFirst,
-        carouselMediaList: item.carouselMediaList
-      });
+      res.forEach((item: any, index: number) => {
+        item.carouselMediaList = [];
+        item._mediaLoaded = false; // 添加媒体加载状态
+
+        // 确保 item.id 存在且为数字类型
+        if (!item.id && item.id !== 0) {
+          item.id = index;
+        }
+
+        // 确保 id 是数字类型
+        item.id = Number(item.id);
+
+       
+
+        // 添加photo
+        if (item.photo) {
+          item.carouselMediaList.push({
+            type: "image",
+            src: item.photo,
+            title: "商品图片",
+          });
+        }
+
+        // 添加itemImgFirst
+        if (item?.itemImgFirst) {
+          item.carouselMediaList.push({
+            type: "image",
+            src: item.itemImgFirst,
+            title: "操作图片",
+          });
+        }
+
+        // 添加itemVideoFirst
+        if (item?.itemVideoFirst) {
+          item.carouselMediaList.push({
+            type: "video",
+            src: item.itemVideoFirst,
+            poster: item.photo || item.itemImgFirst, // 使用photo或itemImgFirst作为视频封面
+            title: "操作视频",
+          });
+        }
+
+        // 如果没有媒体内容，直接标记为已加载，避免一直显示加载状态
+        if (item.carouselMediaList.length === 0) {
+          item._mediaLoaded = true;
+        
+        } else {
+        
+          // 模拟加载过程，3秒后自动标记为已加载（防止一直显示加载状态）
+          setTimeout(() => {
+            if (!item._mediaLoaded) {
+           
+              this.setData({
+                [`careList[${index}]._mediaLoaded`]: true,
+              });
+              // 同时更新 displayList
+              const displayIndex = this.data.displayList.findIndex(
+                (displayItem: any) => displayItem.id === item.id
+              );
+              if (displayIndex !== -1) {
+                this.setData({
+                  [`displayList[${displayIndex}]._mediaLoaded`]: true,
+                });
+              }
+            }
+          }, 3000);
+        }
       });
-      
+
       this.setData({
         careList: res,
       });
@@ -155,17 +183,10 @@ Page({
     if (query.ys) wx.setStorageSync("doctorId", query.ys);
 
     this.initFabAnimated();
-
-    // this.calculatePageHeight();
   },
   async onShow() {
     wx.showShareMenu({ withShareTicket: true, menus }).then();
     this.load();
-    // // 获取未处理随访列表
-    // this.getNotDealList();
-    // // 获取调养计划
-    // await this.getCareLists();
-    // await this.updateDisplayList();
   },
   onHide() {
     wx.hideShareMenu({ menus }).then();
@@ -178,7 +199,6 @@ Page({
     );
   },
   onShareAppMessage(opts): WechatMiniprogram.Page.ICustomShareContent {
-    // console.log(opts.target);
     return {
       title: `健康为基，从容赏生活之美`,
       imageUrl: `https://wx.hzliuzhi.com/media/healthManager/wx/share.jpg`,
@@ -197,7 +217,6 @@ Page({
       displayList:
         allExpanded || careList.length <= 4 ? careList : careList.slice(0, 4),
     });
-    console.log(this.data.displayList, "展示的调养计划");
   },
   toggleAll() {
     this.setData(
@@ -213,7 +232,6 @@ Page({
   // 核销记录
   onRecord(e: any) {
     const id = e.currentTarget.dataset.id;
-    // console.log(id, "id");
     if (id) {
       wx.navigateTo({
         url: `/module/care/pages/care/verifyRecord?id=${id}`,
@@ -233,8 +251,9 @@ Page({
   // 打卡
   pushCard(e: any) {
     const id = e.currentTarget.dataset.id;
-    console.log("pushCard",id);
-    wx.navigateTo({ url: `/module/article/pages/punch-card/punch-card?id=${id}` });
+    wx.navigateTo({
+      url: `/module/article/pages/punch-card/punch-card?id=${id}`,
+    });
   },
   calculatePageHeight() {
     const systemInfo = wx.getSystemInfoSync();
@@ -280,24 +299,25 @@ Page({
     });
   },
   // 诊疗随访提醒
-  goComplete(e: { currentTarget: { dataset: { page: string; id: number; title: string } } }) {
+  goComplete(e: {
+    currentTarget: { dataset: { page: string; id: number; title: string } };
+  }) {
     const { title } = e.currentTarget.dataset;
     let page = e.currentTarget.dataset.page;
     let id = e.currentTarget.dataset.id;
     // let page = '/module/chats/pages/index/index';
     // let id = 1;
     if (page === "/module/chats/pages/index/index") {
-      if(title === "健康评估"){
+      if (title === "健康评估") {
         wx.setStorageSync("isAnalysis", 4);
-        toChats('questionnaire',2)
-      }else{
+        toChats("questionnaire", 2);
+      } else {
         wx.setStorageSync("isAnalysis", 2);
         wx.setStorageSync("workId", id);
         wx.navigateTo({
           url: `${page}?component=questionnaire&messageType=1&id=${id}`,
         });
       }
-     
     } else {
       wx.navigateTo({ url: `${page}?id=${id}` });
       // wx.navigateTo({ url: `/module/follow/pages/evaluation/report?id=${id}` });
@@ -314,11 +334,10 @@ Page({
       const { patient } = await getPatients(/*this.data.patientId*/);
       // if (!patient) await toCertificationPage();
       if (!patient) {
-        console.log("没有患者");
-        if(wx.getStorageSync("doctorId")){
+        if (wx.getStorageSync("doctorId")) {
           toCertificationPage();
         }
-      }else {
+      } else {
         this.setData({ patient });
         this.observerPatient(patient);
       }
@@ -364,11 +383,29 @@ Page({
       });
       let arr2 = [
         [
-          { title: "健康状态", value: data?.willillStateName?`${data?.willillStateName}`:"" },
-          { title: "程度", value: data?.willillDegreeName?`${data?.willillDegreeName}`:"" },
+          {
+            title: "健康状态",
+            value: data?.willillStateName ? `${data?.willillStateName}` : "",
+          },
+          {
+            title: "程度",
+            value: data?.willillDegreeName ? `${data?.willillDegreeName}` : "",
+          },
+        ],
+        [
+          {
+            title: "中医证素",
+            value: data?.factorItemSummary ? `${data?.factorItemSummary}` : "",
+          },
+        ],
+        [
+          {
+            title: "体质",
+            value: data?.constitutionGroupName
+              ? `${data?.constitutionGroupName}`
+              : "",
+          },
         ],
-        [{ title: "中医证素", value: data?.factorItemSummary?`${data?.factorItemSummary}`:"" }],
-        [{ title: "体质", value: data?.constitutionGroupName?`${data?.constitutionGroupName}`:"" }],
       ];
       this.setData({
         statusList: arr2,
@@ -378,7 +415,6 @@ Page({
       // this.setData({
       //   statusList: arr,
       // });
-      // console.log("获取健康报告", data);
     } catch (error) {
       this.setData({
         "healthReport.data": [],
@@ -393,7 +429,6 @@ Page({
     this.setData({ "healthIndex.loading": true });
     try {
       const data = await healthIndexMethod();
-      // console.log(data, "heindex");
       this.setData({
         "healthIndex.data": data
           .map((item: AnyObject) => item.abnormalDesc)
@@ -409,7 +444,6 @@ Page({
     }
   },
   onBodyModel(event: WechatMiniprogram.TouchEvent) {
-    // console.log(event, "获取数据");
     if (event.detail?.position === "LB") {
       this.toReportPage();
     } else if (event.detail?.position === "item0") {
@@ -463,7 +497,6 @@ Page({
       });
       this.showDraggableSheet();
     } else if (event.detail?.position === "CT") {
-      // console.log(this.data.healthIndex, "heaindex");
       this.setData({
         position: {
           CT: this.data.healthIndex.data.map(
@@ -475,7 +508,6 @@ Page({
     }
   },
   tabValue() {
-    // console.log(this.data.healthIndex, "heaindex111111");
     this.setData({
       position: {
         CT: this.data.healthIndex.data.map(
@@ -631,51 +663,98 @@ Page({
     // 获取调养计划
     this.getCareLists();
   },
-
-
-
-
-  // 轮播相关事件处理方法
-  onCarouselChange(e: any) {
-    const { current, total } = e.detail;
-    console.log('轮播切换:', current, total);
-  },
-
+  // 图片加载成功
   onImageLoad(e: any) {
-    const { index, item } = e.detail;
-    console.log('图片加载成功:', index, item);
+    const { item, itemId } = e.detail;
+    // 如果有itemId，直接更新对应项的状态
+    if (itemId) {
+      this.updateMediaLoadedStateById(itemId);
+    } else {
+      // 兼容旧版本，通过查找来匹配
+      this.updateMediaLoadedState(item);
+    }
   },
-
+  // 图片加载失败
   onImageError(e: any) {
-    const { index, item } = e.detail;
-    console.log('图片加载失败:', index, item);
+    const { item, itemId } = e.detail;
     wx.showToast({
-      title: '图片加载失败',
-      icon: 'none'
+      title: "图片加载失败",
+      icon: "none",
     });
+    // 即使加载失败也要标记为已加载，避免一直显示加载状态
+    if (itemId) {
+      this.updateMediaLoadedStateById(itemId);
+    } else {
+      this.updateMediaLoadedState(item);
+    }
   },
 
-  onVideoPlay(e: any) {
-    const { index, item } = e.detail;
-    console.log('视频开始播放:', index, item);
-  },
+  // 通过ID更新媒体加载状态的辅助方法
+  updateMediaLoadedStateById(itemId: string | number) {
+    const { careList, displayList } = this.data;
+
+    // 查找对应的 careList 项
+    const careListIndex = careList.findIndex((item: any) => item.id == itemId);
 
-  onVideoPause(e: any) {
-    const { index, item } = e.detail;
-    console.log('视频暂停:', index, item);
+    // 查找对应的 displayList 项
+    const displayListIndex = displayList.findIndex(
+      (item: any) => item.id == itemId
+    );
+
+    if (careListIndex !== -1) {
+      this.setData({
+        [`careList[${careListIndex}]._mediaLoaded`]: true,
+      });
+    }
+
+    if (displayListIndex !== -1) {
+      this.setData({
+        [`displayList[${displayListIndex}]._mediaLoaded`]: true,
+      });
+    }
   },
 
-  onVideoEnded(e: any) {
-    const { index, item } = e.detail;
-    console.log('视频播放结束:', index, item);
+  // 更新媒体加载状态的辅助方法（兼容旧版本）
+  updateMediaLoadedState(mediaItem: any) {
+    const { careList, displayList } = this.data;
+    // 查找对应的 careList 项
+    const careListIndex = careList.findIndex(
+      (item: any) =>
+        item.carouselMediaList &&
+        item.carouselMediaList.some((media: any) => media.src === mediaItem.src)
+    );
+    // 查找对应的 displayList 项
+    const displayListIndex = displayList.findIndex(
+      (item: any) =>
+        item.carouselMediaList &&
+        item.carouselMediaList.some((media: any) => media.src === mediaItem.src)
+    );
+
+    if (careListIndex !== -1) {
+      this.setData({
+        [`careList[${careListIndex}]._mediaLoaded`]: true,
+      });
+    }
+
+    if (displayListIndex !== -1) {
+      this.setData({
+        [`displayList[${displayListIndex}]._mediaLoaded`]: true,
+      });
+    }
   },
 
+  // 视频播放失败
   onVideoError(e: any) {
-    const { index, item } = e.detail;
-    console.log('视频播放错误:', index, item);
+    const { item, itemId } = e.detail;
     wx.showToast({
-      title: '视频播放失败',
-      icon: 'none'
+      title: "视频播放失败",
+      icon: "none",
     });
+    // 视频播放错误时也要标记为已加载，避免一直显示加载状态
+    if (itemId) {
+      this.updateMediaLoadedStateById(itemId);
+    } else {
+      this.updateMediaLoadedState(item);
+    }
   },
 });

miniprogram/pages/home/home.wxml

@@ -77,8 +77,27 @@ v
               </view>
               <!-- 这里放详细内容 -->
               <view class="item-detail" wx:if="{{item.expanded}}">
+                <!-- 轮播媒体容器 -->
                 <view class="carousel-container" wx:if="{{item.carouselMediaList && item.carouselMediaList.length > 0}}">
-                  <media-carousel mediaList="{{item.carouselMediaList}}" showIndicator="{{true}}" autoplay="{{true}}" interval="{{4000}}" circular="{{true}}" bind:change="onCarouselChange" bind:imageload="onImageLoad" bind:imageerror="onImageError" bind:videoplay="onVideoPlay" bind:videopause="onVideoPause" bind:videoended="onVideoEnded" bind:videoerror="onVideoError" />
+                   <!-- 加载状态覆盖层 -->
+                  <view class="loading-overlay" wx:if="{{!item._mediaLoaded}}">
+                    <view class="loading-spinner"></view>
+                    <text class="loading-text">加载中...</text>
+                  </view>
+                  <!-- 轮播组件 -->
+                  <media-carousel 
+                   wx:else
+                    mediaList="{{item.carouselMediaList}}" 
+                    showIndicator="{{true}}" 
+                    autoplay="{{true}}" 
+                    interval="{{4000}}" 
+                    circular="{{true}}" 
+                    bind:imageload="onImageLoad" 
+                    bind:imageerror="onImageError" 
+                    bind:videoerror="onVideoError" 
+                    itemId="{{item.id}}"
+                  />
+                 
                 </view>
                  <!--   <image src="{{item.photo}}" class="detail-image" wx:if="{{item.photo}}" /> -->
                 <view class="item-box">