渲染详情

src/components/Image.vue

@@ -8,23 +8,24 @@
     <div class="box"></div>
   </div>
   <div class="image_container" v-else>
-    <!-- <img :src="I1" alt="图像" class="img" /> -->
+    <img :src="imageStore?.coreInfo?.resultImg" alt="图像" class="img" />
     <div class="top_info">
-      <p class="title">北京昌平核电站3号核反应堆</p>
+      <p class="title">{{ imageStore.nuclearCoreName }}</p>
       <div class="title_left">
-        <p class="sign">A-8</p>
+        <p class="sign">{{ imageStore?.coreInfo?.serialNumber }}</p>
         <div class="tag_wrap">
-          <p>T0DB</p>
-          <p>0T1U</p>
+          <p>{{ imageStore?.coreInfo?.firstSign?.substr(-4) }}</p>
+          <p>{{ imageStore?.coreInfo?.secondSign?.substr(-4) }}</p>
         </div>
       </div>
     </div>
-    <div class="identify_info">
+    <div :class="getIdentifyClass()">
       <div class="left_wrap">
         <svg
           xmlns="http://www.w3.org/2000/svg"
           xmlns:xlink="http://www.w3.org/1999/xlink"
           fill="none"
+          v-if="imageStore?.coreInfo?.result == 2"
           version="1.1"
           width="30"
           height="29.999998092651367"
@@ -38,6 +39,24 @@
             />
           </g>
         </svg>
+        <svg
+          v-else
+          xmlns="http://www.w3.org/2000/svg"
+          xmlns:xlink="http://www.w3.org/1999/xlink"
+          fill="none"
+          version="1.1"
+          width="30"
+          height="30.000120162963867"
+          viewBox="0 0 30 30.000120162963867"
+        >
+          <g>
+            <path
+              d="M15,30.0001C6.71625,30.0001,0,23.2838,0,15.0001C0,6.71628,6.71625,0,15,0C23.2838,0,30,6.71628,30,15.0001C30,23.2838,23.2838,30.0001,15,30.0001ZM11.655,20.8901C12.2652,21.5005,13.2548,21.5005,13.865,20.8901L23.3375,11.4175C23.9478,10.8073,23.9478,9.81781,23.3375,9.20754C22.7272,8.59726,21.7378,8.59726,21.1275,9.20754L12.6925,17.5076L8.9175,13.7326C8.30736,13.1215,7.31725,13.1211,6.70665,13.7317C6.09604,14.3423,6.09642,15.3324,6.7075,15.9426L11.655,20.8901Z"
+              fill="#FFFFFF"
+              fill-opacity="1"
+            />
+          </g>
+        </svg>
         <!-- <p>A-8</p> -->
       </div>
       <div class="tag_wrap">
@@ -49,9 +68,20 @@
 </template>
 
 <script setup>
-import I1 from '@/static/img/login/back.png'
-import { useTaskStore } from '@/store'
+import { useTaskStore, useImageStore } from '@/store'
 const taskStore = useTaskStore()
+const imageStore = useImageStore()
+
+const getIdentifyClass = () => {
+  const res = imageStore?.coreInfo?.result
+  if (res == 1) {
+    return 'identify_info success'
+  } else {
+    return 'identify_info'
+  }
+}
+
+// 从store中获取数据并渲染
 </script>
 
 <style lang="scss" scoped>
@@ -145,6 +175,9 @@ const taskStore = useTaskStore()
       justify-content: space-between;
     }
   }
+  .success {
+    background: #01ff82;
+  }
   .img {
   }
 }

src/components/Task.vue

@@ -156,6 +156,10 @@ export default {
       taskStore.updateCurrentDetailTaskId(taskId)
       accountStore.changePage(0)
       taskStore.getExcelList(taskId)
+      const arr = taskStore.excelData.filter(item => item.serialNumber == '1-6')
+      if (arr && arr.length > 0) {
+        imageStore.updateCoreInfo(arr[0])
+      }
     },
     handleSuccess({ response }) {
       console.log(response)