报告厅模块优化oss

web/src/components/ImagePreview/index.vue

@@ -257,6 +257,8 @@ watch(
 
     try {
       if (props.isOssId) {
+        // console.log('ossid模式');
+        // console.log(newSrc);
         // ossid模式：通过接口获取真实URL，然后转换为认证的blob URL
         const ossIds = newSrc.split(',').filter((id) => id.trim());
 

web/src/views/hq/bgtgl/hallAudit/index.vue

@@ -216,11 +216,12 @@
         <el-form-item label="报告厅图片">
           <div class="view-hall-images">
             <div class="image-gallery" v-if="viewHallImages.length > 0">
-              <div v-for="(image, index) in viewHallImages" :key="index" class="image-item" @click="previewImage(image, index)">
-                <img :src="image" class="gallery-image" @error="handleImageError" />
+              <div v-for="(image, index) in viewHallImages" :key="index" class="image-item">
+                <!-- <img :src="image" class="gallery-image" @error="handleImageError" />
                 <div class="image-overlay">
                   <el-icon class="preview-icon"><ZoomIn /></el-icon>
-                </div>
+                </div> -->
+                <image-preview :src="image" :width="120" :height="90" :isOssId="true" />
               </div>
             </div>
             <div v-else class="no-images-placeholder">
@@ -283,11 +284,12 @@
                 </div>
                 <div class="hall-images" v-if="getHallImagesByName(hallName).length > 0">
                   <div class="image-gallery">
-                    <div v-for="(image, index) in getHallImagesByName(hallName)" :key="index" class="image-item" @click="previewImage(image, index)">
-                      <img :src="image" class="gallery-image" @error="handleImageError" />
+                    <div v-for="(image, index) in getHallImagesByName(hallName)" :key="index" class="image-item">
+                      <!-- <img :src="image" class="gallery-image" @error="handleImageError" />
                       <div class="image-overlay">
                         <el-icon class="preview-icon"><ZoomIn /></el-icon>
-                      </div>
+                      </div> -->
+                      <image-preview :src="image" :width="120" :height="90" :isOssId="true" />
                     </div>
                   </div>
                 </div>
@@ -560,14 +562,14 @@ const getHallImages = async (ossIds: string): Promise<string[]> => {
     console.log('处理OSS ID:', ossIds, 'ID数组:', idArray);
 
     // 调用API获取真实的图片URL
-    const response = await listByIds(idArray.join(','));
-    const ossList: OssVO[] = response.data || [];
+    // const response = await listByIds(idArray.join(','));
+    // const ossList: OssVO[] = response.data || [];
 
-    // 提取URL列表
-    const urls = ossList.map((oss) => oss.url).filter((url) => url);
+    // // 提取URL列表
+    // const urls = ossList.map((oss) => oss.url).filter((url) => url);
 
-    console.log('获取到的图片URL:', urls);
-    return urls;
+    // console.log('获取到的图片URL:', urls);
+    return idArray;
   } catch (error) {
     console.error('获取图片URL失败:', error);
     return [];

web/src/views/hq/bgtgl/hallReservation/index.vue

@@ -210,15 +210,18 @@
                   {{ displayHallDescription(hall.hallDescription) }}
                 </div>
                 <div class="hall-images">
-                  <template v-if="hall.imageUrls && hall.imageUrls.length > 0">
-                    <img
+                  <template v-if="hall.hallImage && hall.hallImage.length > 0">
+                    <!-- <img
                       v-for="(image, index) in hall.imageUrls"
                       :key="index"
                       :src="image"
                       class="hall-image"
                       @error="handleImageError"
                       @load="handleImageLoad"
-                    />
+                    /> -->
+                    <div v-for="(image, index) in hall.hallImage" :key="index">
+                      <image-preview :src="image" :width="40" :height="40" :isOssId="true" />
+                    </div>
                   </template>
                   <span v-else class="no-image-text">暂无图片</span>
                 </div>
@@ -230,11 +233,12 @@
         <el-form-item label="报告厅图片">
           <div class="selected-hall-images">
             <div class="image-gallery" v-if="selectedHallImages.length > 0">
-              <div v-for="(image, index) in selectedHallImages" :key="index" class="image-item" @click="previewImage(image, index)">
-                <img :src="image" class="gallery-image" @error="handleImageError" />
+              <div v-for="(image, index) in selectedHallImages" :key="index">
+                <!-- <img :src="image" class="gallery-image" @error="handleImageError" />
                 <div class="image-overlay">
                   <el-icon class="preview-icon"><ZoomIn /></el-icon>
-                </div>
+                </div> -->
+                <image-preview :src="image" :width="120" :height="90" :isOssId="true" />
               </div>
             </div>
             <div v-else class="no-images-placeholder">
@@ -299,10 +303,11 @@
           <div class="view-hall-images">
             <div class="image-gallery" v-if="viewHallImages.length > 0">
               <div v-for="(image, index) in viewHallImages" :key="index" class="image-item" @click="previewImage(image, index)">
-                <img :src="image" class="gallery-image" @error="handleImageError" />
+                <!-- <img :src="image" class="gallery-image" @error="handleImageError" />
                 <div class="image-overlay">
                   <el-icon class="preview-icon"><ZoomIn /></el-icon>
-                </div>
+                </div> -->
+                <image-preview :src="image" :width="120" :height="90" :isOssId="true" />
               </div>
             </div>
             <div v-else class="no-images-placeholder">
@@ -525,21 +530,29 @@ const getHallList = async () => {
       hallStatus: '1'
     }); // 获取正常状态的报告厅
     hallList.value = res.rows || [];
-
-    // 为每个报告厅获取图片URL
-    for (const hall of hallList.value) {
+    // for (const hall of hallList.value) {
+    //   if (hall.hallImage) {
+    //     try {
+    //       const imageUrls = await getHallImages(hall.hallImage);
+    //       hall.imageUrls = imageUrls;
+    //     } catch (error) {
+    //       console.error(`获取报告厅 ${hall.hallName} 图片失败:`, error);
+    //       hall.imageUrls = [];
+    //     }
+    //   } else {
+    //     hall.imageUrls = [];
+    //   }
+    // }
+    //hall.hallImage.split(',')
+    hallList.value.forEach((hall) => {
+      //加一些判断
       if (hall.hallImage) {
-        try {
-          const imageUrls = await getHallImages(hall.hallImage);
-          hall.imageUrls = imageUrls;
-        } catch (error) {
-          console.error(`获取报告厅 ${hall.hallName} 图片失败:`, error);
-          hall.imageUrls = [];
-        }
+        hall.hallImage = hall.hallImage.split(',');
       } else {
-        hall.imageUrls = [];
+        hall.hallImage = [];
       }
-    }
+    });
+    // 为每个报告厅获取图片URL
 
     // 调试信息：检查每个报告厅的图片信息
     console.log('报告厅列表数据:', hallList.value);
@@ -562,7 +575,7 @@ const handleHallChange = (hallName: string) => {
   if (selectedHall) {
     form.value.hallId = selectedHall.id;
     // 更新选中的报告厅图片
-    selectedHallImages.value = selectedHall.imageUrls || [];
+    selectedHallImages.value = selectedHall.hallImage || [];
   } else {
     selectedHallImages.value = [];
   }
@@ -796,8 +809,8 @@ const handleView = async (row: HallReservationVO) => {
   // 查找对应的报告厅并显示图片
   if (viewForm.value.hallName) {
     const selectedHall = hallList.value.find((hall) => hall.hallName === viewForm.value.hallName);
-    if (selectedHall && selectedHall.imageUrls) {
-      viewHallImages.value = selectedHall.imageUrls;
+    if (selectedHall && selectedHall.hallImage) {
+      viewHallImages.value = selectedHall.hallImage;
     } else {
       viewHallImages.value = [];
     }
@@ -840,8 +853,9 @@ const handleUpdate = async (row?: HallReservationVO) => {
   // 如果有报告厅名称，找到对应的报告厅并显示图片
   if (form.value.hallName) {
     const selectedHall = hallList.value.find((hall) => hall.hallName === form.value.hallName);
-    if (selectedHall && selectedHall.imageUrls) {
-      selectedHallImages.value = selectedHall.imageUrls;
+    console.log('selectedHall', selectedHall);
+    if (selectedHall && selectedHall.hallImage) {
+      selectedHallImages.value = selectedHall.hallImage;
     }
   }