1、车间看板页面实现鼠标悬浮于设备上出现设备详细信息弹窗，鼠标移出弹窗消失 2、设备参数阈值管理页面新增至mdc模块设备基础配置菜单下并完成所有布局及...

zhuzhuanzhuan

2023-11-10 14e6fca4c624e161dae9b7e905f9fccb03ba0177

 src/views/WorkshopSignage.vue

@@ -36,7 +36,8 @@
          :isResizable="isResizable"
          :stickSize="6"
        >
          <div class="single-device" :style="{ width: item.vw + 'px', height: item.vh + 'px' }">
          <div class="single-device" :style="{ width: item.vw + 'px', height: item.vh + 'px' }"
               @mouseenter="openDetail(item)">
            <div class="device-status">
              <div
                v-if="item.equipmentStatus == 2 || item.equipmentStatus == 1"
@@ -77,6 +78,8 @@
        </div>
      </div>
    </dv-border-box-8>

    <EquipmentDetailModal ref="EquipmentDetailModal"></EquipmentDetailModal>
  </dv-full-screen-container>
</template>

@@ -84,10 +87,17 @@
import VueDragResize from 'vue-drag-resize'
import api from '@/api/mdc'
import { getFileAccessHttpUrl } from '@/api/manage'
  import EquipmentDetailModal from './mdc/base/modules/WorkshopSignage/EquipmentDetailModal'
  import { message } from 'ant-design-vue'

  message.config({
    maxCount: 3
  })

export default {
  components: {
    VueDragResize,
      EquipmentDetailModal
  },
  data() {
    return {
@@ -112,24 +122,24 @@
        {
          label: '关机',
          value: 0,
          color: '#A8A8A8',
            color: '#A8A8A8'
        },
        {
          label: '待机',
          value: 2,
          color: '#FFFF00',
            color: '#FFFF00'
        },
        {
          label: '运行',
          value: 3,
          color: '#00EE00',
            color: '#00EE00'
        },
        {
          label: '报警',
          value: 22,
          color: '#FF0000',
        },
      ], // 设备状态指示灯列表
            color: '#FF0000'
          }
        ] // 设备状态指示灯列表
    }
  },
  watch: {
@@ -146,8 +156,8 @@
          this.timingAcquisition = null
        }
      },
      immediate: true,
    },
        immediate: true
      }
  },
  methods: {
    /**
@@ -197,7 +207,7 @@
          if (res.code === 200) {
            this.$notification.success({
              message: '消息',
              description: res.message,
                description: res.message
            })
            this.isOperatingDevice = false
            if (this.isSwitchChecked) {
@@ -211,7 +221,7 @@
      } else {
        this.$notification.warning({
          message: '消息',
          description: '请开启功能后再进行保存',
            description: '请开启功能后再进行保存'
        })
      }
    },
@@ -255,6 +265,22 @@
      this.isResizable = !this.isResizable
      this.isDraggable = !this.isDraggable
    },

      openDetail(item) {
        if (item.equipmentStatus == 0) {
          // this.$message.warn("设备处于关机状态！");
          this.$message.warning('设备处于关机状态！')
          return false
        }
        console.log(item)
        console.log(this.$refs.EquipmentDetailModal)
        this.$refs.EquipmentDetailModal.initData(item.equId)
        this.$refs.EquipmentDetailModal.timerModel(item.equId)
        // this.equipMessageTimer = setInterval(() => {
        //   setTimeout( this.$refs.equmentDetaiModel.initData(item.equipmentId),0)
        // },1000*10)
      },

  },
  created() {
    if (this.$route.params.id) {
@@ -270,7 +296,7 @@
    // 确保销毁定时器及回收资源
    clearInterval(this.timingAcquisition)
    this.timingAcquisition = null
  },
    }
}
</script>