| <template> | 
|   <GlobalWindow title="设备运维详情" :showConfirm="false" :visible.sync="visible" width="800px"> | 
|     <div class="model_wrap"> | 
|       <div class="list"> | 
|         <div class="item"> | 
|           <div class="la">设备名称</div> | 
|           <div class="val">{{ info.deviceName }}</div> | 
|         </div> | 
|         <div class="item"> | 
|           <div class="la">设备编号</div> | 
|           <div class="val">{{ info.deviceCode }}</div> | 
|         </div> | 
|         <div class="item"> | 
|           <div class="la">设备状态</div> | 
|           <div class="val" v-if="info.status == 0">正常</div> | 
|           <div class="val" v-if="info.status == 1">损坏</div> | 
|           <div class="val" v-if="info.status == 2">报废</div> | 
|         </div> | 
|         <div class="item"> | 
|           <div class="la">运维人</div> | 
|           <div class="val">{{ info.realName }}-{{ info.companyName }}</div> | 
|         </div> | 
|         <div class="item"> | 
|           <div class="la">运维人电话</div> | 
|           <div class="val">{{ info.mobile }}</div> | 
|         </div> | 
|         <div class="item"> | 
|           <div class="la">运维时间</div> | 
|           <div class="val">{{ info.dealDate }}</div> | 
|         </div> | 
|         <div class="item max"> | 
|           <div class="la">运维备注</div> | 
|           <div class="val">{{ info.content }}</div> | 
|         </div> | 
|         <div class="item max"> | 
|           <div class="la">现场照片</div> | 
|           <div class="value" v-if="info.multifileList == null || !info.multifileList.length">无</div> | 
|           <div class="value" v-if="info.multifileList != null && info.multifileList.length"> | 
|             <div v-for="item in info.multifileList" :key="item.id" style="display: inline;margin-right: 20px"> | 
|               <video v-if="item.fileurlFull && item.fileurlFull.endsWith('.mp4')" ref="videoRef" controls preload="auto" | 
|                 style="width: 80px;height: 80px;object-fit: contain;" :src="item.fileurlFull" /> | 
|               <el-image v-else-if="item.fileurlFull" style="width:80px; height: 80px" :src="item.fileurlFull" | 
|                 :preview-src-list="[item.fileurlFull]"> | 
|               </el-image> | 
|             </div> | 
|           </div> | 
|         </div> | 
|       </div> | 
|     </div> | 
|   </GlobalWindow> | 
| </template> | 
|   | 
| <script> | 
| import BaseOpera from '@/components/base/BaseOpera' | 
| import GlobalWindow from '@/components/common/GlobalWindow' | 
| import { detailById } from '@/api/Inspection/deviceRecord' | 
| export default { | 
|   extends: BaseOpera, | 
|   components: { GlobalWindow }, | 
|   data() { | 
|     return { | 
|       // 表单数据 | 
|       info: {}, | 
|     } | 
|   }, | 
|   created() { | 
|   | 
|   }, | 
|   methods: { | 
|     getDetail(id) { | 
|       detailById(id).then(res => { | 
|         this.info = res | 
|       }) | 
|     } | 
|   } | 
| } | 
| </script> | 
| <style lang="scss" scoped> | 
| .model_wrap { | 
|   padding-top: 20px; | 
|   .title { | 
|     font-size: 18px; | 
|     font-weight: 600; | 
|     margin-bottom: 16px; | 
|   } | 
|   | 
|   .list { | 
|     display: flex; | 
|     flex-wrap: wrap; | 
|   | 
|     .item { | 
|       width: 33.33%; | 
|       margin-bottom: 14px; | 
|   | 
|       .la { | 
|         color: #7f7f7f; | 
|         margin-bottom: 6px; | 
|       } | 
|     } | 
|     .max{ | 
|       width: 100%; | 
|     } | 
|   } | 
| } | 
| </style> |