1、终端程序呼叫页面呼叫原因组件由输入框改为多行文本域 2、设备管理页面新增设备图片字段同时在新增和编辑设备时添加设备图片 3、设备监控以及设备看板页...

zhaowei

2025-06-18 3432c3100ccb4c3b78dc0a5f7f242bdcda503a63

1、终端程序呼叫页面呼叫原因组件由输入框改为多行文本域
2、设备管理页面新增设备图片字段同时在新增和编辑设备时添加设备图片
3、设备监控以及设备看板页面新增故障状态同时替换设备图片为设备管理页面中维护的设备图片而不再是设备所属设备类型图片以及三色灯增加故障状态灯

 src/assets/orange.png

 src/views/dnc/base/modules/TerminalIndex/ProcedureCall.vue

@@ -20,7 +20,7 @@
        <a-row>
          <a-col :span="24">
            <a-form-model-item label="呼叫原因" prop="callReason">
              <a-input placeholder="请输入呼叫原因" v-model="model.callReason" allowClear/>
              <a-textarea placeholder="请输入呼叫原因" v-model="model.callReason" allowClear/>
            </a-form-model-item>
          </a-col>
        </a-row>

 src/views/mdc/base/DeviceBaseInfo.vue

@@ -7,39 +7,29 @@
      <a-col :md="24-5" :sm="24">
        <div class="device-status-info">
          <a-space v-for="item in deviceStatusList" :key="item.value" class="single-status-info">
            <template v-if="item.value!=99">
              <div>{{ item.label }}</div>
              <div class="status-square" :style="{ backgroundColor: item.color }"></div>
              <div>{{getDeviceNumberByStatus(item.value) }}</div>
            </template>
            <template v-else>
              <div>{{ item.label }}</div>
              <div>{{getDeviceNumberByStatus(item.value) }}</div>
            </template>
            <div>{{ item.label }}</div>
            <div v-if="item.value!=99" class="status-square" :style="{ backgroundColor: item.color }"></div>
            <div>{{getDeviceNumberByStatus(item.value) }}</div>
          </a-space>
        </div>

        <div>
          <a-tabs default-active-key="1">
            <a-tab-pane key="1" tab="布局图">
              <equipment-layout :dataList="dataList" :equipmentId="selectEquipmentId"
                                :node="selectEquipment"></equipment-layout>
              <equipment-layout :dataList="dataList" :equipmentId="selectEquipmentId" :node="selectEquipment"/>
            </a-tab-pane>
            <a-tab-pane key="2" tab="列表" force-render>
              <equipment-list :dataSource="dataList" @editEquipmentStatus="editEquipmentStatus"></equipment-list>
              <equipment-list :dataSource="dataList"/>
            </a-tab-pane>
          </a-tabs>
        </div>
      </a-col>
    </a-row>


  </a-card>
</template>

<script>
  import { putAction, getAction } from '@/api/manage'
  import { JeecgListMixin } from '@/mixins/JeecgListMixin'
  import { getAction } from '@/api/manage'
  import BaseTree from '../common/BaseTree'
  import EquipmentLayout from './modules/DeviceBaseInfo/EquipmentLayout'
  import EquipmentList from './modules/DeviceBaseInfo/EquipmentList'
@@ -58,14 +48,8 @@
        selectEquipment: {},
        equipmentStatisticsInfo: {},
        dataList: [],
        standbyNumber: 0,
        offNumber: 0,
        warningNumber: 0,
        workNumber: 0,
        allNumber: 0,
        url: {
          list: '/mdc/mdcEquipment/queryEquipmentMonitorList',
          updateEquipmentStatus: '/mdc/mdcEquipment/updateEquipmentStatus'
          list: '/mdc/mdcEquipment/queryEquipmentMonitorList'
        },
        param: {},
        timer: null,
@@ -91,9 +75,9 @@
            color: '#FF0000'
          },
          {
            label: '异常',
            value: 33,
            color: '#FFA200'
            label: '故障',
            value: 5,
            color: '#C11900'
          },
          {
            label: '总数',
@@ -109,67 +93,44 @@
    },
    methods: {
      equipmentStatistics(param, resopnse = { key: false }) {
        getAction(this.url.list, param).then((res) => {
          this.dataList = []
          if (res.success) {
            if (res.result.length != 0) {
              this.standbyNumber = 0
              this.offNumber = 0
              this.warningNumber = 0
              this.workNumber = 0
              this.allNumber = 0
              this.dataList = res.result
              this.allNumber = this.dataList.length
              if (resopnse.key) {
                this.$notification.success({
                  key: 'equipmentStatus',
        getAction(this.url.list, param)
          .then((res) => {
            this.dataList = []
            if (res.success) {
              if (res.result.length != 0) {
                this.dataList = res.result
                if (resopnse.key) {
                  this.$notification.success({
                    key: 'equipmentStatus',
                    message: '消息',
                    description: resopnse.message
                  })
                }

                // 筛选从车板跳转过来的需求数据
                const { signageData } = this.$route.params
                console.log('signageData', signageData)
                if (!signageData) return
                else this.filterDataList(signageData)
              } else {
                this.$notification.warning({
                  message: '消息',
                  description: resopnse.message
                  description: '此车间下面无设备！！'
                })
              }
              for (let i = 0; i < this.dataList.length; i++) {
                let item = this.dataList[i]
                switch (item.oporationDict) {
                  case '待机' :
                    this.standbyNumber = this.standbyNumber + 1
                    break
                  case '运行' :
                    this.workNumber = this.workNumber + 1
                    break
                  case '关机' :
                    this.offNumber = this.offNumber + 1
                    break
                  case '报警' :
                    this.warningNumber = this.warningNumber + 1
                    break
                  default:
                    break
                }
              }

              // 筛选从车板跳转过来的需求数据
              const { signageData } = this.$route.params
              console.log('signageData', signageData)
              if (!signageData) return
              else this.filterDataList(signageData)
            } else {
            }
            else {
              this.$notification.warning({
                message: '消息',
                description: '此车间下面无设备！！'
                description: res.message
              })
            }
          } else {
            this.$notification.warning({
              message: '消息',
              description: res.message
            })
          }
        })
          })
      },

      /**
       * 筛选满足从看板跳转过来时的条件的数据
       * @param record
       * @param signageData
       */
      filterDataList(signageData) {
        this.dataList = this.dataList.filter(item => item.oporationDict === signageData.name)
@@ -182,49 +143,12 @@
        this.selectEquipment = val.equipmentId
        clearInterval(this.timer)
        this.timer = null
        if (!val.equipmentId) {
          this.param.key = val.key
          this.equipmentStatistics(this.param)
          this.timer = setInterval(() => {
            setTimeout(this.equipmentStatistics(this.param), 0)
          }, 1000 * 10)
        } else {
          this.param.key = val.parentId
          this.equipmentStatistics(this.param)
          this.timer = setInterval(() => {
            setTimeout(this.equipmentStatistics(this.param), 0)
          }, 1000 * 10)
        }
      },

      /**
       * 单击状态反馈后触发
       * @param record
       */
      editEquipmentStatus(record) {
        const _this = this
        this.$notification.info({
          key: 'equipmentStatus',
          message: '消息',
          description: '反馈中...'
        })
        getAction(this.url.updateEquipmentStatus, { id: record.id })
          .then(res => {
            if (res.success) {
              _this.equipmentStatistics(this.param, { key: true, message: res.message })
            } else {
              this.$notification.warning({
                message: '消息',
                description: res.message
              })
            }
          })
          .catch(err => {
            this.$notification.error({
              message: '消息',
              description: err.message
            })
          })
        if (!val.equipmentId) this.param.key = val.key
        else this.param.key = val.parentId
        this.equipmentStatistics(this.param)
        this.timer = setInterval(() => {
          setTimeout(this.equipmentStatistics(this.param), 0)
        }, 1000 * 10)
      },

      /**
@@ -269,22 +193,6 @@
    display: inline-block;
    width: 15px;
    height: 15px;
  }

  .equipMessage table td .equipShutdown {
    background-color: #808080;
  }

  .equipMessage table td .standbyNumber {
    background-color: #ffbf37;
  }

  .equipMessage table td .equipRun {
    background-color: #19FE01;
  }

  .equipMessage table td .equipAlarm {
    background-color: #FD0008;
  }

  .device-status-info {

 src/views/mdc/base/GroupUtilizationRateChart.vue

@@ -129,7 +129,7 @@
     * @param shiftDataList 班次数据列表
     */
    initChart({ dataList, dateList, shiftSubList, shiftDataList }) {
      const defaultLegendData = ['24小时', '24小时（去除故障设备）', '班次', '累计运行时间(h)']
      const defaultLegendData = ['24小时', '24小时（去除故障时间）', '班次', '累计运行时间(h)']
      const defaultSeries = [
        {
          type: 'line',
@@ -139,7 +139,7 @@
        },
        {
          type: 'line',
          name: '24小时（去除故障设备）',
          name: '24小时（去除故障时间）',
          yAxisIndex: 0,
          data: dataList ? dataList.map(item => item.amendUtilizationRate) : []
        },

 src/views/mdc/base/MdcWorkshopSignage.vue

@@ -6,8 +6,7 @@
        <a-row style="height: 100%">
          <a-col :span="7" class="header-left">
            <a-space>
              <span v-if="!isSwitchChecked">开启功能</span>
              <span v-else>关闭功能</span>
              <span>功能开关</span>
              <a-switch
                checked-children="开"
                un-checked-children="关"
@@ -22,17 +21,9 @@
          <a-col :span="10" class="workshop-name">{{ workshopDetails.workshopName }}</a-col>

          <a-col :span="7" class="device-status-info">
            <!--<a-space v-for="item in deviceStatusList" :key="item.value" class="single-status-info"-->
            <!--@click="handleScreenDevive(item)">-->
            <!--<div :style="{color:item.checked?'#1890FF':'#fff'}">{{ item.label }}</div>-->
            <!--<div class="status-square" :style="{ backgroundColor: item.color }"></div>-->
            <!--&lt;!&ndash;<a-checkbox :checked="item.checked" @change="checkboxChange(item)"></a-checkbox>&ndash;&gt;-->
            <!--<div>{{getDeviceNumberByStatus(item.value) }}</div>-->
            <!--</a-space>-->
            <a-space v-for="item in deviceStatusList" :key="item.value" class="single-status-info">
              <div :style="{color:item.checked?'#1890FF':'#fff'}">{{ item.label }}</div>
              <div class="status-square" :style="{ backgroundColor: item.color }"></div>
              <!--<a-checkbox :checked="item.checked" @change="checkboxChange(item)"></a-checkbox>-->
              <div>{{getDeviceNumberByStatus(item.value) }}</div>
            </a-space>
          </a-col>
@@ -67,23 +58,7 @@
               @click="openDetail(item)">
            <div class="device-status">
              <div
                v-if="item.equipmentStatus == 2 || item.equipmentStatus == 1"
                :style="{ backgroundImage: `url(${require('@/assets/yellow.png')})` }"
                class="status-image"
              ></div>
              <div
                v-if="item.equipmentStatus == 22"
                :style="{ backgroundImage: `url(${require('@/assets/red.png')})` }"
                class="status-image"
              ></div>
              <div
                v-if="item.equipmentStatus == 0"
                :style="{ backgroundImage: `url(${require('@/assets/gray.png')})` }"
                class="status-image"
              ></div>
              <div
                v-if="item.equipmentStatus == 3"
                :style="{ backgroundImage: `url(${require('@/assets/green.png')})` }"
                :style="{ backgroundImage: `url(${getStatusImgUrl(item.equipmentStatus)})` }"
                class="status-image"
              ></div>
              <div
@@ -91,8 +66,7 @@
                class="device-image"
              ></div>
            </div>
            <div class="device-id" id="deviceId"
                 :style="{ color:workshopDetails.equipmentIdColor }">
            <div :style="{ color:workshopDetails.equipmentIdColor }">
              {{ item.equipmentId }}
            </div>
          </div>
@@ -133,48 +107,32 @@
        showGuideline: 'none',
        guidelineXTop: 0,
        guidelineYLeft: 0,
        deviceList: [
          // {
          //   equipmentId: '123213213123232',// 设备ID
          //   equipmentImage: require('@/assets/8.png'), // 设备图片
          //   coordinateTop: 200, // 拖拽元素距盒子顶距离
          //   coordinateLeft: 100, // 拖拽元素距盒子左侧距离
          //   vw: 100,  // 缩放元素宽度
          //   vh: 100, // 缩放元素高度
          //   equipmentStatus: 1 // 设备状态 0:关机 22:报警 2:待机 3:运行 开机:1（没有四色灯标识归为待机）
          // }
        ], // 设备信息列表
        deviceList_copy: [],
        deviceList: [], // 设备信息列表
        deviceStatusList: [
          // {
          //   label: '全部',
          //   value: 99,
          //   color: '#fff',
          //   checked: true
          // },
          {
            label: '关机',
            value: 0,
            color: '#A8A8A8',
            checked: false
            color: '#A8A8A8'
          },
          {
            label: '待机',
            value: 2,
            color: '#FFFF00',
            checked: false
            color: '#FFFF00'
          },
          {
            label: '运行',
            value: 3,
            color: '#00EE00',
            checked: false
            color: '#00EE00'
          },
          {
            label: '报警',
            value: 22,
            color: '#FF0000',
            checked: false
            color: '#FF0000'
          },
          {
            label: '故障',
            value: 5,
            color: '#C11900'
          }
        ],// 设备状态指示灯列表，
        windowHeight: null,// 当前浏览器可视区域高度（（不包括工具栏、书签、底部任务栏）
@@ -207,11 +165,9 @@
       * @param id 车间Id
       */
      getDeviceListByApi(id) {
        console.log('重新刷新')
        api.getDeviceListInWorkshopSignagePageApi(id).then((res) => {
          if (res.result && res.result.length > 0) {
            this.deviceList = res.result
            this.deviceList_copy = res.result
          }
        })
      },
@@ -223,12 +179,8 @@
      getWorkshopDetailsByApi(id) {
        api.getWorkshopDetailByWorkshopIdApi(id).then((res) => {
          this.workshopDetails = res.result
          // this.$refs.deviceContainerRef.style.backgroundImage = `url(${this.getImgView(
          //   this.workshopDetails.backgroundImage
          // )})`
          this.imgSrc = this.getImgView(this.workshopDetails.backgroundImage)
          this.$refs.deviceContainerRef.style.height = (this.windowHeight - this.pageHeaderHeight) + 'px'
          // this.parentH = this.windowHeight - this.pageHeaderHeight
          this.parentH = 900
          this.parentLimitation = true // 在父元素高度设置后再设置限制拖拽区域，不这样有概率导致父元素高度未设置就限制拖拽
        })
@@ -280,15 +232,6 @@
       * @param index 拖拽设备在数组中的下标
       */
      resize(newRect, index) {
        // if (newRect.width > 100) {
        //   if (newRect.width / newRect.height < 2) {
        //     this.deviceList[index].fontSize = newRect.width / 10
        //   } else {
        //     this.deviceList[index].fontSize = newRect.height / 5
        //   }
        // } else {
        //   this.deviceList[index].fontSize = 12
        // }
        this.showGuideline = 'block'
        this.deviceList[index].vw = newRect.width
        this.deviceList[index].vh = newRect.height
@@ -304,8 +247,8 @@
       * @returns {number} 设备数量
       */
      getDeviceNumberByStatus(value) {
        if (value === 99) return this.deviceList_copy.length
        return this.deviceList_copy.filter((item) => item.equipmentStatus === value).length
        if (value === 99) return this.deviceList.length
        return this.deviceList.filter((item) => item.equipmentStatus === value).length
      },

      /**
@@ -318,19 +261,38 @@
        this.isDraggable = !this.isDraggable
      },

      openDetail(item) {
      /**
       * 开启功能触发事件
       * @param record 点击的设备信息
       */
      openDetail(record) {
        if (!this.isSwitchChecked) {
          if (item.equipmentStatus == 0) {
          if (record.equipmentStatus == 0) {
            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)
          this.$refs.EquipmentDetailModal.initData(record.equId)
          this.$refs.EquipmentDetailModal.timerModel(record.equId)
        }
      },

      /**
       * 根据设备状态值获取对应三色灯图片地址
       * @param imgStatus 设备状态值
       */
      getStatusImgUrl(imgStatus) {
        switch (imgStatus) {
          case 1:
          case 2:
            return require('@/assets/yellow.png')
          case 3:
            return require('@/assets/green.png')
          case 22:
            return require('@/assets/red.png')
          case 5:
            return require('@/assets/orange.png')
          default:
            return require('@/assets/gray.png')
        }
      },

@@ -338,87 +300,11 @@
       * 浏览器尺寸发生改变时触发
       */
      handleWindowSizeChange() {
        // this.isFullScreen = !this.isFullScreen
        // if (!this.isFullScreen) location.reload() // 如果为全屏模式，则在切换模式时重新加载页面以重新获取浏览器可视区域高度
        const windowHeight =
          window.innerHeight ||
          document.documentElement.clientHeight ||
          document.body.clientHeight
        // this.parentH = 99999
        // const scaleRate = windowHeight / this.windowHeight
        // this.windowHeight = windowHeight
        this.$refs.deviceContainerRef.style.height = (windowHeight - this.pageHeaderHeight) + 'px'
        // const timer = setTimeout(() => {
        //   this.deviceList.forEach(item => {
        //     item.coordinateTop = item.coordinateTop * scaleRate
        //     item.vh = item.vh * scaleRate
        //     console.log('vh', item.vh)
        //   })
        //   this.parentH = windowHeight - this.pageHeaderHeight
        //   console.log('changeDeviceList', this.deviceList)
        // }, 500)
        // console.log('scaleRate', scaleRate)
      },

      checkboxChange(obj) {
        //需要判断是否开启功能，目的是为了关闭定时器避免筛选后设备被定时刷新的新设备覆盖
        if (this.isOperatingDevice) {
          obj.checked = !obj.checked
          if (obj.value !== 99) {
            if (obj.checked) this.checkedStatusCount++
            else this.checkedStatusCount--
          }

          if (obj.value == 99) {
            this.deviceStatusList.forEach(item => {
              if (item.value !== obj.value) item.checked = obj.checked
            })
            if (obj.checked) {
              this.deviceList = this.deviceList_copy
              this.checkedStatusCount = this.deviceStatusList.length - 1
            } else {
              this.deviceList = []
              this.checkedStatusCount = 0
            }
          } else {
            this.deviceStatusList.forEach(item => {
              if (item.value === 99) {
                if (this.checkedStatusCount !== this.deviceStatusList.length - 1 || this.checkedStatusCount === 0) item.checked = false
                if (this.checkedStatusCount === this.deviceStatusList.length - 1) item.checked = true
              }
            })
            if (obj.checked) {
              this.deviceList.push(...this.deviceList_copy.filter(item => item.equipmentStatus === obj.value))
            } else {
              this.deviceList = this.deviceList.filter(item => item.equipmentStatus !== obj.value)
            }
          }
        } else {
          this.$notification.warning({
            message: '消息',
            description: '请开启功能后再进行筛选'
          })
        }
      },

      handleScreenDevive(obj) {
        //需要判断是否开启功能，目的是为了关闭定时器避免筛选后设备被定时刷新的新设备覆盖
        if (this.isOperatingDevice) {
          obj.checked = true
          this.deviceList = this.deviceList_copy
          this.deviceStatusList.forEach(item => {
            if (item.value !== obj.value) item.checked = false
          })

          if (obj.value == 99) this.deviceList = this.deviceList_copy
          else this.deviceList = this.deviceList.filter(item => item.equipmentStatus === obj.value)

        } else {
          this.$notification.warning({
            message: '消息',
            description: '请开启功能后再进行筛选'
          })
        }
      }
    },
    created() {
@@ -437,9 +323,6 @@
        document.documentElement.clientHeight ||
        document.body.clientHeight

      // 判断浏览器可视区域高度是否等于分辨率，若相等则表示进入时浏览器为全屏模式
      // if (this.windowHeight === screen.height) this.isFullScreen = true

      window.addEventListener('resize', this.handleWindowSizeChange)
    },
    beforeDestroy() {
@@ -457,10 +340,6 @@
    color: #fff;

    .page-header {
      /*font-size: 50px;*/
      /*text-align: center;*/
      /*position: relative;*/

      .header-left {
        height: 100%;
        display: flex;
@@ -485,7 +364,6 @@

        .single-status-info {
          margin: 10px;
          cursor: pointer;

          .status-square {
            width: 14px;
@@ -526,11 +404,7 @@
        flex-direction: column;
        align-items: center;
        justify-content: space-between;
        cursor: default;

        &:active {
          border: 1px solid #1890ff;
        }
        cursor: pointer;

        .device-status {
          width: 100%;
@@ -557,10 +431,5 @@
        }
      }
    }
  }

  /deep/ .ant-checkbox-inner {
    background-color: transparent;
    border-color: #fff;
  }
</style>

 src/views/mdc/base/modules/DeviceBaseInfo/EquipmentLayout.vue

@@ -2,13 +2,14 @@
  <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="contnet" v-for="(item,index) in dataList" :key="index"
             :class="node == item.equipmentId ? 'addClass' : '' ">

          <div class="content_equipment" @click="openDetail(item)">
          <div style="cursor: pointer" @click="openDetail(item)">
            <div class="equipment_box">
              <div>
                <img style="width: 11%;" :src="getStatusImgUrl(item.oporation)" alt="">
                <img  class="orange" :src="getImgUrl(item.equipmentTypePictures)">
                <img class="deviceImage" :src="getImgUrl(item.equipmentTypePictures)">
              </div>
            </div>
          </div>
@@ -24,7 +25,7 @@

<script>
  import EquipmentDetailModal from './EquipmentDetailModal'
  import {getFileAccessHttpUrl} from '@/api/manage';
  import { getFileAccessHttpUrl } from '@/api/manage'
  import {
    getAction
  } from '@/api/manage'
@@ -32,128 +33,95 @@
  export default {
    name: 'EquipmentLayout',
    components: { EquipmentDetailModal },
    props: { dataList: {
    props: {
      dataList: {
        type: Array,
        required: true,
        default: []
      }, equipmentId: '' ,
    node:''},
    data() {
      return {
        equipMessageTimer:''
      }
    },
    created() {
    },
    mounted() {

      },
      node: ''
    },
    methods: {
      getImgUrl(img){
        if(img == null || img ==''){
          return require("../../../../../assets/default.png");
      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");
      getStatusImgUrl(imgStatus) {
        switch (imgStatus) {
          case 1:
          case 2:
            return require('@/assets/yellow.png')
          case 3:
            return require('@/assets/green.png')
          case 22:
            return require('@/assets/red.png')
          case 5:
            return require('@/assets/orange.png')
          default:
            return require('@/assets/gray.png')
        }
      },
      getBackgroundUrl(imgurl){
        return require("../../../../../assets/"+imgurl+".gif");
      },
      openDetail(item) {
        if(item.oporation == 0){
          // this.$message.warn("设备处于关机状态！");
        if (item.oporation == 0) {
          this.$notification.warning({
            message:'消息',
            description:"设备处于关机状态！"
          });
          return false;
            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)
        this.$refs.equipmentDetailModal.initData(item.id)
        this.$refs.equipmentDetailModal.timerModel(item.id)
      }
    },
    beforeDestroy(){
      // clearInterval(this.equipMessageTimer);
      // this.equipMessageTimer = null
    }
  }
</script>
<style scoped>
  .gray{
    background-image: url("../../../../../assets/gray.gif");
  .deviceImage {
    -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{

  .equipment_box img {
    width: 45%;
  }

  .containerequip{
  .containerequip {
    overflow: auto;
  }

  @media screen and (min-width: 1920px){
    .containerequip{
      height: 640px!important;
  @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: 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: 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 (min-width: 1280px) and (max-width: 1400px) {
    .containerequip {
      height: 493px !important;
    }
  }
  @media screen and (max-width: 1280px){
    .containerequip{
      height: 394px!important;

  @media screen and (max-width: 1280px) {
    .containerequip {
      height: 394px !important;
    }
  }

  .container_content {
    width: 100%;
    position: relative;
@@ -170,7 +138,7 @@
    padding-top: 5%;
  }

  .addclass p {
  .addClass p {
    border-bottom: 2px solid #e957ff;
  }
</style>

 src/views/mdc/base/modules/DeviceBaseInfo/EquipmentList.vue

@@ -1,84 +1,9 @@
<template>
  <a-card :bordered="false" style="display: flex;flex-direction: column">

    <!-- 查询区域 -->
    <!--<div class="table-page-search-wrapper">-->
    <!--<a-form layout="inline" @keyup.enter.native="searchQuery">-->
    <!--<a-row :gutter="24">-->
    <!--<a-col :md="7" :sm="7">-->
    <!--<a-form-item label="设备名称">-->
    <!--<a-input placeholder="输入设备名称查询" v-model="queryParam.equipmentName"></a-input>-->
    <!--</a-form-item>-->
    <!--</a-col>-->
    <!--<a-col :md="7" :sm="7">-->
    <!--<a-form-item label="状态">-->
    <!--<a-select v-model="queryParam.status" placeholder="请选择">-->
    <!--<a-select-option value="">请选择</a-select-option>-->
    <!--<a-select-option value="0">关机</a-select-option>-->
    <!--<a-select-option value="2">待机</a-select-option>-->
    <!--<a-select-option value="3">运行</a-select-option>-->
    <!--<a-select-option value="22">报警</a-select-option>-->
    <!--</a-select>-->
    <!--</a-form-item>-->
    <!--</a-col>-->
    <!--<a-col :md="3" :sm="3">-->
    <!--<span style="float: left;overflow: hidden;" class="table-page-search-submitButtons">-->
    <!--<a @click="handleToggleSearch" style="margin-left: 8px">-->
    <!--{{ toggleSearchStatus ? '收起' : '展开' }}-->
    <!--<a-icon :type="toggleSearchStatus ? 'up' : 'down'"/>-->
    <!--</a>-->
    <!--</span>-->
    <!--</a-col>-->
    <!--</a-row>-->
    <!--<a-row :gutter="24">-->
    <!--<template v-if="toggleSearchStatus">-->
    <!--<a-col :md="12" :sm="12">-->
    <!--<a-form-item label="采集时间">-->
    <!--<a-range-picker @change="dateParamChange" v-model="dates"/>-->
    <!--</a-form-item>-->
    <!--</a-col>-->
    <!--</template>-->

    <!--</a-row>-->
    <!--</a-form>-->
    <!--</div>-->
    <!-- 操作按钮区域 -->
    <!--<div class="table-operator" style="border-top: 5px">-->
    <!--<a-button type="primary" @click="searchQuery" icon="search">查询</a-button>-->
    <!--<a-button type="primary" @click="searchReset" icon="reload" style="margin-left: 8px">重置</a-button>-->
    <!--</div>-->

    <div class="equipmentList" id="DeviceList">
      <!--<div class="ant-alert ant-alert-info" style="margin-bottom: 16px;">-->
      <!--<i class="anticon anticon-info-circle ant-alert-icon"></i>已选择&nbsp;<a style="font-weight: 600">{{-->
      <!--selectedRowKeys.length }}</a>项&nbsp;&nbsp;-->
      <!--<a style="margin-left: 24px" @click="onClearSelected">清空</a>-->
      <!--</div>-->

      <a-table ref="table" bordered size="middle" rowKey="equipmentId" :columns="columns" :dataSource="dataSource"
               :pagination="false" :loading="loading" :scroll="{x:'max-content',y:scrollY}">
        <!--<template slot="equipmentId" slot-scope="text, record">-->
        <!--<div :style="{color:record.equipmentStatus!==0?'#f00':null}">{{text}}</div>-->
        <!--</template>-->
        <!--<template slot="equipmentName" slot-scope="text, record">-->
        <!--<div :style="{color:record.equipmentStatus!==0?'#f00':null}">{{text}}</div>-->
        <!--</template>-->
        <!--<template slot="oporationDict" slot-scope="text, record">-->
        <!--<div :style="{color:record.equipmentStatus!==0?'#f00':null}">{{text}}</div>-->
        <!--</template>-->
        <template slot="equipmentStatus" slot-scope="text">
          <div>{{text===0?'正常':'异常'}}</div>
        </template>
        <!--<template slot="collecttime" slot-scope="text, record">-->
        <!--<div :style="{color:record.equipmentStatus!==0?'#f00':null}">{{text}}</div>-->
        <!--</template>-->
        <!--<template slot="action" slot-scope="text, record">-->
        <!--<a-popconfirm title="确定反馈吗?" @confirm="$emit('editEquipmentStatus',record)" v-has="'deiveBaseInfo:responseStatus'">-->
        <!--<a>状态反馈</a>-->
        <!--</a-popconfirm>-->
        <!--</template>-->
      </a-table>

               :pagination="false" :loading="loading" :scroll="{x:'max-content',y:scrollY}"/>
    </div>
  </a-card>
</template>
@@ -113,13 +38,6 @@
            width: 200
          },
          {
            title: '设备异常',
            align: 'center',
            dataIndex: 'equipmentStatus',
            scopedSlots: { customRender: 'equipmentStatus' },
            width: 200
          },
          {
            title: '采集时间',
            align: 'center',
            dataIndex: 'collecttime',
@@ -129,14 +47,6 @@
            },
            width: 350
          }
          // {
          //   title: '操作',
          //   dataIndex: 'action',
          //   scopedSlots: {customRender: 'action'},
          //   align: "center",
          //   width: 150,
          //   fixed:'right'
          // }
        ],
        scrollY: 465
      }

 src/views/mdc/base/modules/EquipmentList/UserModal.vue

@@ -6,6 +6,7 @@
    @cancel="visible=false"
    :visible="visible"
    :footer="null"
    centered
    style="height: 100%;overflow: auto;padding-bottom: 53px;">

    <template slot="title">
@@ -93,7 +94,7 @@
        <a-row :gutter="24">
          <a-col :span="12">
            <a-form-model-item label="机床IP" :labelCol="labelCol" :wrapperCol="wrapperCol">
              <a-input :disabled="true"  placeholder="请输入机床IP"
              <a-input :disabled="true" placeholder="请输入机床IP"
                       v-model="model.equipmentIp"/>
            </a-form-model-item>
          </a-col>
@@ -115,7 +116,7 @@
          </a-col>
          <a-col :span="12">
            <a-form-model-item label="设备型号" :labelCol="labelCol" :wrapperCol="wrapperCol">
              <a-input :disabled="true"  allow-clear placeholder="请输入设备型号"
              <a-input :disabled="true" allow-clear placeholder="请输入设备型号"
                       v-model="model.equipmentModel"/>
            </a-form-model-item>
          </a-col>
@@ -124,13 +125,15 @@
        <a-row :gutter="24">
          <a-col :span="12">
            <a-form-model-item label="系统类型" :labelCol="labelCol" :wrapperCol="wrapperCol">
              <j-dict-select-tag placeholder="请选择系统类型" :triggerChange="true" dictCode="system_type" :disabled="disableSubmit"
              <j-dict-select-tag placeholder="请选择系统类型" :triggerChange="true" dictCode="system_type"
                                 :disabled="disableSubmit"
                                 v-model="model.systemType" allow-clear/>
            </a-form-model-item>
          </a-col>
          <a-col :span="12">
            <a-form-model-item label="设备级别" :labelCol="labelCol" :wrapperCol="wrapperCol">
              <j-dict-select-tag placeholder="请选择设备级别" dictCode="device_level" v-model="model.deviceLevel" :disabled="disableSubmit" allow-clear/>
              <j-dict-select-tag placeholder="请选择设备级别" dictCode="device_level" v-model="model.deviceLevel"
                                 :disabled="disableSubmit" allow-clear/>
            </a-form-model-item>
          </a-col>
        </a-row>
@@ -138,7 +141,8 @@
        <a-row :gutter="24">
          <a-col :span="12">
            <a-form-model-item label="设备种类" :labelCol="labelCol" :wrapperCol="wrapperCol">
              <j-dict-select-tag placeholder="请选择设备种类" dictCode="device_category" v-model="model.deviceCategory" :disabled="disableSubmit"
              <j-dict-select-tag placeholder="请选择设备种类" dictCode="device_category" v-model="model.deviceCategory"
                                 :disabled="disableSubmit"
                                 allow-clear/>
            </a-form-model-item>
          </a-col>
@@ -146,6 +150,14 @@
            <a-form-model-item label="排序" :labelCol="labelCol" :wrapperCol="wrapperCol">
              <a-input :disabled="disableSubmit" :readOnly="disableSubmit" placeholder="请输入排序"
                       v-model="model.sortNo" style="width: 100%"/>
            </a-form-model-item>
          </a-col>
        </a-row>

        <a-row :gutter="24">
          <a-col :span='24'>
            <a-form-model-item label="设备图片" :labelCol="labelColLong" :wrapperCol="wrapperColLong">
              <j-image-upload v-model="model.equipmentImage" :disabled="disableSubmit"/>
            </a-form-model-item>
          </a-col>
        </a-row>
@@ -538,20 +550,20 @@
            // if(this.model.userIdentity!==2){
            //   this.model.departIds="";
            // }
            if (this.systemValue==null){
              this.$message.warning('请选择系统类型!');
              return false;
            if (this.systemValue == null) {
              this.$message.warning('请选择系统类型!')
              return false
            }
            let obj;
            if(!this.model.id){
              this.model.id = this.userId;
              this.model.systemValue=this.systemValue;
              obj=addEquipment(this.model);
            }else{
              this.model.systemValue=this.systemValue;
              obj=editEquipment(this.model,{
                        id: this.model.id
                      });
            let obj
            if (!this.model.id) {
              this.model.id = this.userId
              this.model.systemValue = this.systemValue
              obj = addEquipment(this.model)
            } else {
              this.model.systemValue = this.systemValue
              obj = editEquipment(this.model, {
                id: this.model.id
              })
            }
            obj.then((res) => {
              if (res.success) {