修改图片显示

ruoyi-ui/src/views/board/equipment/index.vue

@@ -91,17 +91,32 @@
           <div class="index">{{ k + 1 }}</div>
           <div class="title">{{ i.deviceName }}</div>
           <div style="position: absolute;left: 27%;top: 0px;width: 45%;height: 100%;">
-            <div
-              v-for="val in Object.keys(i.deviceDataMap).slice(0,4).filter(e=> !(i.deviceDataMap[e].toString().includes('http')))"
-              :style="'width:'+(Object.keys(i.deviceDataMap).length<=2 ? '100%':'50%')" class="infoItem">
-              <div class="span">{{ val }}:</div>
-              <div class="spanBg"></div>
-              <div class="num">{{ i.deviceDataMap[val] }}</div>
+            <div style="width: 100%; height: 100%" v-if="Object.keys(i.deviceDataMap).find(e=>(i.deviceDataMap[e].toString().includes('http')))">
+              <el-image
+                  fit="contain"
+                  style="width: 100%; height: calc(100% - 20px)"
+                  :src="i.deviceDataMap[Object.keys(i.deviceDataMap).find(e => (i.deviceDataMap[e].toString().includes('http')))]"
+                  :preview-src-list="[i.deviceDataMap[Object.keys(i.deviceDataMap).find(e => (i.deviceDataMap[e].toString().includes('http')))]]">
+              </el-image>
+              <div class="infoItem" style="width: 100%;height: 20px">
+                <div class="span" style="line-height: 20px"> 时间 :</div>
+                <div class="spanBg" style="line-height: 20px;height: 20px"></div>
+                <div class="num" style="line-height: 20px">{{ i.updateTime }}</div>
+              </div>
             </div>
-            <div class="infoItem" style="width: 100%">
-              <div class="span"> 时间 :</div>
-              <div class="spanBg"></div>
-              <div class="num">{{ i.updateTime }}</div>
+            <div v-if="!Object.keys(i.deviceDataMap).find(e=>(i.deviceDataMap[e].toString().includes('http')))">
+              <div
+                  v-for="val in Object.keys(i.deviceDataMap).slice(0,4).filter(e=> !(i.deviceDataMap[e].toString().includes('http')))"
+                  :style="'width:'+(Object.keys(i.deviceDataMap).length<=2 ? '100%':'50%')" class="infoItem">
+                <div class="span">{{ val }}:</div>
+                <div class="spanBg"></div>
+                <div class="num">{{ i.deviceDataMap[val] }}</div>
+              </div>
+              <div class="infoItem" style="width: 100%">
+                <div class="span"> 时间 :</div>
+                <div class="spanBg"></div>
+                <div class="num">{{ i.updateTime }}</div>
+              </div>
             </div>
 
           </div>
@@ -153,9 +168,18 @@
           v-if="historyTh[i]"
           :prop="i"
           :label="historyTh[i]"
-          width="180">
+          >
           <template slot-scope="scope">
-            <div v-if="historyTh[i] === '时间'">{{ parseTime(scope.row['ts']) }}</div>
+            <div v-if="scope.row[i].includes('http')">
+              <el-image
+                  fit="contain"
+                  style="width: 100%; height: 100%"
+                  :src="scope.row[i]"
+                  :preview-src-list="[scope.row[i]]">
+              </el-image>
+
+            </div>
+            <div v-else-if="historyTh[i] === '时间'">{{ parseTime(scope.row['ts']) }}</div>
             <div v-else>{{ scope.row[i] }}</div>
           </template>
         </el-table-column>