From accebdce93486d3b4f26e55ffdea047549cce20c Mon Sep 17 00:00:00 2001 From: cuijian <cuijian@xalxzn.com> Date: 星期一, 28 七月 2025 21:12:38 +0800 Subject: [PATCH] Merge branch 'master' of http://125.76.225.53:18448/r/xhj/vue_mdc_xhj --- src/views/mdc/base/modules/DeviceBaseInfo/EquipmentLayout.vue | 176 ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ 1 files changed, 176 insertions(+), 0 deletions(-) diff --git a/src/views/mdc/base/modules/DeviceBaseInfo/EquipmentLayout.vue b/src/views/mdc/base/modules/DeviceBaseInfo/EquipmentLayout.vue new file mode 100644 index 0000000..f8099d1 --- /dev/null +++ b/src/views/mdc/base/modules/DeviceBaseInfo/EquipmentLayout.vue @@ -0,0 +1,176 @@ +<template> + <a-card :bordered="false"> + <div class="containerequip"> + <div class="container_content"> + <div class="contnet" v-for="(item,index) in dataList" :key="index" :class="node == item.equipmentId ? 'addclass' : '' "> + + <div class="content_equipment" @click="openDetail(item)"> + <div class="equipment_box"> + <div> + <img style="width: 11%;" :src="getStatusImgUrl(item.oporation)" alt=""> + <img class="orange" :src="getImgUrl(item.equipmentTypePictures)"> + </div> + </div> + </div> + <p style="margin-top: 5px;"> + <span ref="message">{{item.equipmentName}}({{item.equipmentId}})</span> + </p> + </div> + </div> + </div> + <equipment-detail-modal ref="equipmentDetailModal"></equipment-detail-modal> + </a-card> +</template> + +<script> + import EquipmentDetailModal from './EquipmentDetailModal' + import {getFileAccessHttpUrl} from '@/api/manage'; + import { + getAction + } from '@/api/manage' + + export default { + name: 'EquipmentLayout', + components: { EquipmentDetailModal }, + props: { dataList: { + type: Array, + required: true, + default: [] + }, equipmentId: '' , + node:''}, + data() { + return { + equipMessageTimer:'' + } + }, + created() { + }, + mounted() { + + }, + methods: { + getImgUrl(img){ + if(img == null || img ==''){ + return require("../../../../../assets/default.png"); + } + return getFileAccessHttpUrl(img) + }, + getStatusImgUrl(imgStaus){ + if(imgStaus == 1){ + return require("../../../../../assets/yellow.png"); + }else if(imgStaus == 2){ + return require("../../../../../assets/yellow.png"); + }else if(imgStaus == 3){ + return require("../../../../../assets/green.png"); + }else if(imgStaus ==22){ + return require("../../../../../assets/red.png"); + }else if(imgStaus ==0){ + return require("../../../../../assets/gray.png"); + }else{ + return require("../../../../../assets/gray.png"); + } + }, + getBackgroundUrl(imgurl){ + return require("../../../../../assets/"+imgurl+".gif"); + }, + openDetail(item) { + if(item.oporation == 0){ + // this.$message.warn("璁惧澶勪簬鍏虫満鐘舵�侊紒"); + this.$notification.warning({ + message:'娑堟伅', + description:"璁惧澶勪簬鍏虫満鐘舵�侊紒" + }); + return false; + } + console.log(item); + this.$refs.equipmentDetailModal.initData(item.id); + this.$refs.equipmentDetailModal.timerModel(item.id); + // this.equipMessageTimer = setInterval(() => { + // setTimeout( this.$refs.equmentDetaiModel.initData(item.equipmentId),0) + // },1000*10) + } + }, + beforeDestroy(){ + // clearInterval(this.equipMessageTimer); + // this.equipMessageTimer = null + } + } +</script> +<style scoped> + .gray{ + background-image: url("../../../../../assets/gray.gif"); + -webkit-background-size: 100% 100%; + background-size: 100% 100%; + background-repeat: no-repeat; + } + .green{ + background-image: url("../../../../../assets/green.gif"); + -webkit-background-size: 100% 100%; + background-size: 100% 100%; + background-repeat: no-repeat; + } + .red{ + background-image: url("../../../../../assets/red.gif"); + -webkit-background-size: 100% 100%; + background-size: 100% 100%; + background-repeat: no-repeat; + } + .orange{ + /*background-image: url("../../../../../assets/orange.gif");*/ + -webkit-background-size: 100% 100%; + background-size: 100% 100%; + background-repeat: no-repeat; + } + .equipment_box img{ + width: 45%; + } + + .containerequip{ + overflow: auto; + } + + @media screen and (min-width: 1920px){ + .containerequip{ + height: 640px!important; + } + } + @media screen and (min-width: 1680px) and (max-width: 1920px){ + .containerequip{ + height: 640px!important; + } + } + @media screen and (min-width: 1400px) and (max-width: 1680px){ + .containerequip{ + height: 493px!important; + } + } + @media screen and (min-width: 1280px) and (max-width: 1400px){ + .containerequip{ + height: 493px!important; + } + } + @media screen and (max-width: 1280px){ + .containerequip{ + height: 394px!important; + } + } + .container_content { + width: 100%; + position: relative; + } + + .container_content .contnet { + width: 20%; + display: inline-block; + text-align: center; + margin-bottom: 5%; + } + + .container_content .contnet p { + padding-top: 5%; + } + + .addclass p { + border-bottom: 2px solid #e957ff; + } +</style> \ No newline at end of file -- Gitblit v1.9.3