fix(record): 优化图片和视频加载机制

- 在图片对话框中添加 key 属性，确保每次更新图片 URL 时重新渲染图片元素，避免缓存问题
- 在加载图片清除缓存，确保显示最新的媒体文件
- 更新图片和视频的加载逻辑，使用生产环境接口地址

ruoyi-ui/src/views/record/recordBusbarTemp/index.vue

@@ -351,13 +351,14 @@
 
 <!-- 图片显示对话框 -->
 <!--    上面的图像是 2688x1520，下面的图像是 1920x1080。-->
+<!-- 通过增加key属性来确保每次图片URL更新时，Vue都会重新渲染图片元素，从而避免显示旧的缓存图片。 -->
     <el-dialog :title="photoTitle" :visible.sync="photoOpen" width="800px" append-to-body>
       <div class="dialog-content">
-        <div class="image-container">
+        <div class="image-container" v-if="visiblePhoto">
-          <img :src="visiblePhoto" alt="显示图片" />
+          <img :src="visiblePhoto" alt="显示可见光图片" v-show="photoOpen" :key="visiblePhotoKey" />
         </div>
-        <div class="image-container">
+        <div class="image-container"  v-if="thermalPhoto">
-          <img :src="thermalPhoto" alt="显示图片" />
+          <img :src="thermalPhoto" alt="显示热成像图片"  v-show="photoOpen" :key="thermalPhotoKey" />
         </div>
       </div>
     </el-dialog>
@@ -455,6 +456,8 @@ export default {
       },
       visiblePhoto: '',
       thermalPhoto: '',
+      thermalPhotoKey: 0,//在图片对话框中使用，更新图片时增加key值，防止缓存
+      visiblePhotoKey: 0,//在图片对话框中使用，更新图片时增加key值，防止缓存
     };
   },
   created() {
@@ -563,20 +566,27 @@ export default {
       if(row.filePath){
         const filePath = row.filePath ;
 
-        //TODO:修改为实际接口地址
+        // 清除缓存
-        const thermalResponse = `/dev-api/record/recordBusbarTemp/getVisiblePhoto/${filePath}`;
+        this.thermalPhoto = null;
+        this.visiblePhoto = null;
+
+        //TODO:修改为实际接口地
+/*        const thermalResponse = `/dev-api/record/recordBusbarTemp/getVisiblePhoto/${filePath}`;
         this.thermalPhoto = thermalResponse;
         const visibleResponse = `/dev-api/record/recordBusbarTemp/getThermalPhoto/${filePath}`;
-        this.visiblePhoto = visibleResponse;
+        this.visiblePhoto = visibleResponse;*/
-/*        const thermalResponse = `/prod-api/record/recordBusbarTemp/getVisiblePhoto/${filePath}`
+        const thermalResponse = `/prod-api/record/recordBusbarTemp/getVisiblePhoto/${filePath}`
         this.thermalPhoto = thermalResponse;
         const visibleResponse = `/prod-api/record/recordBusbarTemp/getThermalPhoto/${filePath}`
-        this.visiblePhoto = visibleResponse;*/
+        this.visiblePhoto = visibleResponse;
 /*        const thermalResponse = getVisiblePhoto(filePath);
         this.thermalPhoto = thermalResponse;
         const visibleResponse = getThermalPhoto(filePath);
         this.visiblePhoto = visibleResponse;*/
 
+        this.thermalPhotoKey++; // 更新 key 以重新渲染图片
+        this.visiblePhotoKey++; // 更新 key 以重新渲染图片
+
         this.photoOpen = true;
         this.photoTitle = row.filePath + "图片显示";
       }else {

ruoyi-ui/src/views/record/recordInspectionCabinet/VideoPlayer.vue

@@ -27,15 +27,15 @@ export default {
       const filePath = this.$route.query.filePath;
       try {
 
-        //TODO:修改为实际接口地址
+/*        TODO:修改为实际接口地址
         const thermalResponse = `/dev-api/record/recordInspectionCabinet/getThermalVideo/${filePath}`;
         this.thermalVideoUrl = thermalResponse;
         const visibleResponse = `/dev-api/record/recordInspectionCabinet/getVisibleVideo/${filePath}`;
-        this.visibleVideoUrl = visibleResponse;
+        this.visibleVideoUrl = visibleResponse;*/
-        /*                const thermalResponse = `/prod-api/record/recordInspectionCabinet/getThermalVideo/${filePath}`;
+                        const thermalResponse = `/prod-api/record/recordInspectionCabinet/getThermalVideo/${filePath}`;
                         this.thermalVideoUrl = thermalResponse;
                         const visibleResponse = `/prod-api/record/recordInspectionCabinet/getVisibleVideo/${filePath}`;
-                        this.visibleVideoUrl = visibleResponse;*/
+                        this.visibleVideoUrl = visibleResponse;
         /*        const thermalResponse =  getThermalVideo(filePath);
                 this.thermalVideoUrl = thermalResponse;
                 const visibleResponse=  getVisibleVideo(filePath);