feat: 钩机监测模块图片展示

src/views/dashboard/DiggerMonitor.vue

@@ -5,7 +5,7 @@
         <div class="flex items-center justify-center h-full monitor-left-top">
           <div class="file-preview-screen">
             <!-- // TODO 暂时不渲染 -->
-            <img :src="currFileList?.[0]?.image_url" v-if="false" />
+            <img :src="currFileList?.[0]?.image_url" v-if="currFileList?.[0]?.image_url" />
             <div v-else class="w-full h-full bg_error_picture"></div>
           </div>
         </div>
@@ -99,6 +99,7 @@
     <DiggerAlarmModal
       v-model:value="isAlarmOpen"
       :info="currentRow"
+      :fileList="currFileList"
       @close="isAlarmOpen = false"
     />
     <BaseDelete
@@ -355,6 +356,7 @@ const getBeforeFileList = async () => {
 
 function loadDetail() {
   currentRow.value = listData.value[0];
+  console.log(currentRow.value, "currentRow");
   getFileList();
   getBeforeFileList();
 }

src/views/dashboard/components/DiggerAlarmModal.vue

@@ -22,7 +22,7 @@
         class="cursor-pointer"
         v-if="file?.image_url"
       /> -->
-      <img :src="file?.image_url" v-if="false" />
+      <img :src="fileList?.[0]?.image_url" v-if="fileList?.[0]?.image_url" />
       <div v-else class="w-full h-full bg_error_picture"></div>
     </div>
   </el-dialog>
@@ -36,6 +36,7 @@ interface Props {
   /** 弹窗显隐 */
   value: boolean;
   info: Record<string, any>;
+  fileList: any[];
 }
 interface Emits {
   (e: "update:value", val: boolean): void;
@@ -44,6 +45,7 @@ interface Emits {
 const props = withDefaults(defineProps<Props>(), {
   value: false,
   info: {},
+  fileList: []
 });
 
 const emit = defineEmits<Emits>();
@@ -117,6 +119,10 @@ const show = computed({
     padding: 0 24px;
     width: 100%;
     height: 500px;
+    img{
+      width: 100%;
+      height: 100%;
+    }
   }
 }
 </style>