Selaa lähdekoodia

fix: 修改案例详情 回显的问题

sgc 2 kuukautta sitten
vanhempi
commit
d5ce6f090a

+ 3 - 1
src/views/operationManagement/activityDetail.vue

@@ -83,7 +83,9 @@
             <!-- 活动限制人数 -->
             <div class="detail-item">
               <div class="detail-label">活动限制人数</div>
-              <div class="detail-value">{{ activityModel.activityLimitPeople || "0" }}人</div>
+              <div class="detail-value">
+                {{ activityModel.activityLimitPeople + "人" || "无限制" }}
+              </div>
             </div>
             <!-- 活动详情 -->
             <div class="detail-item">

+ 65 - 14
src/views/operationManagement/caseDetail.vue

@@ -24,21 +24,22 @@
           </div>
         </div>
         <div v-if="detail.achievementList">
-          <div class="result-section" v-for="(item, index) in detail.achievementList" :key="index">
+          <div class="result-section" v-for="(items, resultIndex) in detail.achievementList" :key="resultIndex">
             <div class="result-title">成果展示</div>
             <div class="detail-list">
               <div class="detail-item">
-                <div class="detail-label">更新时间 : {{ formatTime(item.updatedTime) }}</div>
+                <div class="detail-label">更新时间 : {{ formatTime(items.updatedTime) }}</div>
               </div>
               <div class="detail-item">
-                <div class="detail-label">成果描述 : {{ item.achievementDesc || "-" }}</div>
+                <div class="detail-label">成果描述 : {{ items.achievementDesc || "-" }}</div>
               </div>
-              <div class="detail-item" v-if="mediaList.length > 0">
+              <div class="detail-item" v-if="items.mediaUrlList && items.mediaUrlList.length > 0">
                 <div class="detail-label">图片与视频 :</div>
                 <div class="media-grid">
-                  <template v-for="(item, index) in mediaList" :key="index">
-                    <div v-if="item.type === 'video'" class="media-item video-item" @click="playVideo(item.url)">
-                      <el-image v-if="item.coverUrl" :src="item.coverUrl" fit="cover" class="media-image">
+                  <template v-for="(item, mediaIndex) in items.mediaUrlList" :key="mediaIndex">
+                    <!-- 视频:包含 | 分隔符 -->
+                    <div v-if="isVideoUrl(item)" class="media-item video-item" @click="playVideo(getVideoUrl(item))">
+                      <el-image v-if="getVideoCoverUrl(item)" :src="getVideoCoverUrl(item)" fit="cover" class="media-image">
                         <template #error>
                           <div class="media-placeholder">
                             <el-icon class="play-icon">
@@ -59,13 +60,14 @@
                         </el-icon>
                       </div>
                     </div>
-                    <div v-else class="media-item image-item" @click="previewImage(item.url, index)">
+                    <!-- 图片:不包含 | 分隔符 -->
+                    <div v-else class="media-item image-item" @click="previewImage(item, items.mediaUrlList, mediaIndex)">
                       <el-image
-                        :src="item.url"
+                        :src="item"
                         fit="cover"
                         class="media-image"
-                        :preview-src-list="imageList"
-                        :initial-index="getImageIndex(item.url)"
+                        :preview-src-list="getImageListForItem(items.mediaUrlList)"
+                        :initial-index="getImageIndex(item, items.mediaUrlList)"
                       >
                         <template #error>
                           <div class="image-slot">
@@ -216,11 +218,60 @@ const mediaList = computed<MediaItem[]>(() => {
 
 const imageList = computed(() => mediaList.value.filter(m => m.type === "image").map(m => m.url));
 
-const getImageIndex = (url: string) => {
-  return imageList.value.indexOf(url);
+// 判断是否为视频URL(包含 | 分隔符)
+const isVideoUrl = (url: string) => {
+  if (typeof url !== "string") return false;
+  return url.includes("|");
 };
 
-const previewImage = (url: string, index: any) => {
+// 获取视频URL(从 "视频链接|封面链接" 中提取视频链接)
+const getVideoUrl = (url: string) => {
+  if (typeof url !== "string") return "";
+  if (url.includes("|")) {
+    return url.split("|")[0].trim();
+  }
+  return url;
+};
+
+// 获取视频封面URL(从 "视频链接|封面链接" 中提取封面链接)
+const getVideoCoverUrl = (url: string) => {
+  if (typeof url !== "string") return "";
+  if (url.includes("|")) {
+    const parts = url.split("|");
+    if (parts.length >= 2) {
+      return parts[1].trim();
+    }
+  }
+  return "";
+};
+
+// 获取指定 mediaUrlList 中的图片列表(用于预览)
+const getImageListForItem = (mediaUrlList: any[]) => {
+  if (!mediaUrlList || !Array.isArray(mediaUrlList)) return [];
+  return mediaUrlList
+    .filter(item => {
+      // 过滤出图片类型(不包含 | 分隔符的)
+      if (typeof item === "string") {
+        return !item.includes("|");
+      }
+      return false;
+    })
+    .map(item => {
+      if (typeof item === "string") {
+        return item.trim();
+      }
+      return "";
+    })
+    .filter(url => url);
+};
+
+// 获取图片在指定 mediaUrlList 中的索引
+const getImageIndex = (url: string, mediaUrlList: any[]) => {
+  const imageList = getImageListForItem(mediaUrlList);
+  return imageList.indexOf(url);
+};
+
+const previewImage = (url: string, mediaUrlList: any[], index: any) => {
   // el-image 的 preview-src-list 会自动处理预览
 };