cuijian
2025-07-28 accebdce93486d3b4f26e55ffdea047549cce20c
src/views/mdc/base/modules/DeviceBaseInfo/EquipmentDetailModal.vue
¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,1408 @@
<template>
  <div ref="wrap">
    <a-modal
      width="90%"
      :visible="visible"
      :getContainer="() => this.$refs.wrap"
      @cancel="handleCancel"
      cancelText="关闭"
      wrap-class-name="full-modal"
      centered
    >
      <div
        id="mdcEquiInfo"
        style="padding:1px;"
      >
        <table
          width="100%"
          style="border-collapse: separate;border-spacing:0px; color: #fff"
        >
          <tr>
            <td v-if="this.spindlebeilv != null">
              <div
                class="mdcEquipMon"
                style="width: 250px; height: 200px;margin : 0 auto;padding: 0;"
                align="center"
              >
                ä¸»è½´å€çއ
                <div
                  id="mdcEquiMoniGauge1"
                  ref="chart1"
                  style="width: 100%; height: 95%;"
                ></div>
              </div>
            </td>
            <td v-if="this.feedbeilv != null">
              <div
                class="mdcEquipMon"
                style="width: 210px; height: 180px;margin : 0 auto;"
                align="center"
              >
                è¿›ç»™å€çއ
                <div
                  id="mdcEquiMoniGauge2"
                  ref="chart2"
                  style="width: 100%; height: 95%;"
                ></div>
              </div>
            </td>
            <td v-if="this.spindleload != null">
              <div
                class="mdcEquipMon"
                style="width: 210px; height: 180px;margin : 0 auto;"
                align="center"
              >主轴负荷
                <div
                  id="mdcEquiMoniGauge3"
                  ref="mdcEquiMoniGauge3"
                  style="width: 100%; height: 95%;"
                ></div>
              </div>
            </td>
            <td v-if="this.rapidfeed != null">
              <div
                class="mdcEquipMon"
                style="width: 210px; height: 180px;margin : 0 auto;"
                align="center"
              >快速进给倍率
                <div
                  id="mdcEquiMoniGauge4"
                  ref="mdcEquiMoniGauge4"
                  style="width: 100%; height: 95%;"
                ></div>
              </div>
            </td>
          </tr>
          <tr>
            <td colspan="5">
              <a-descriptions
                title="基础信息"
                :column="4"
              >
                <a-descriptions-item label="设备编号">{{resultData.equipmentId}}</a-descriptions-item>
                <a-descriptions-item label="安装位置">{{resultData.equipmentName}}</a-descriptions-item>
                <a-descriptions-item label="IP地址">{{resultData.equipmentIp}}</a-descriptions-item>
                <a-descriptions-item label="端口号">{{resultData.dataPort}}</a-descriptions-item>
                <a-descriptions-item label="驱动类型">{{resultData.driveType}}</a-descriptions-item>
                <a-descriptions-item label="设备型号">{{resultData.equipmentModel}}</a-descriptions-item>
                <a-descriptions-item label="设备类型">{{resultData.equipmentType}}</a-descriptions-item>
                <a-descriptions-item label="备注">{{resultData.remark}}</a-descriptions-item>
              </a-descriptions>
              <!---数据源调整  åŠ¨æ€å±•ç¤º è¿è¡Œæ•°æ®---->
              <a-descriptions
                title="运行数据"
                v-show="runData"
                v-if="resultData.driveType != 'PLC'"
                :column="4"
                class="operationData"
              >
                <a-descriptions-item
                  v-for="(item,id) in runData"
                  :key="item.id"
                  :label="item.key"
                >
                  <a-tooltip @mouseenter="mouseEnterItem">
                    <template slot="title">
                      {{item.value}}
                    </template>
                    <div class="description-item-class">{{item.value}}</div>
                  </a-tooltip>
                </a-descriptions-item>
              </a-descriptions>
              <a-descriptions
                title="坐标信息"
                v-if="xyzList != null"
                :column="5"
              >
                <a-descriptions-item label="机床坐标X">{{xyzList.xmachine}}</a-descriptions-item>
                <a-descriptions-item label="Y">{{xyzList.ymachine}}</a-descriptions-item>
                <a-descriptions-item label="Z">{{xyzList.zmachine}}</a-descriptions-item>
                <a-descriptions-item label="A">{{xyzList.amachine}}</a-descriptions-item>
                <a-descriptions-item label="B">{{xyzList.bmachine}}</a-descriptions-item>
                <a-descriptions-item label="绝对坐标X">{{xyzList.xabsolute}}</a-descriptions-item>
                <a-descriptions-item label="Y">{{xyzList.yabsolute}}</a-descriptions-item>
                <a-descriptions-item label="Z">{{xyzList.zabsolute}}</a-descriptions-item>
                <a-descriptions-item label="A">{{xyzList.aabsolute}}</a-descriptions-item>
                <a-descriptions-item label="B">{{xyzList.babsolute}}</a-descriptions-item>
              </a-descriptions>
            </td>
          </tr>
        </table>
      </div>
      <template slot="footer">
        <a-button
          :style="{ marginRight: '8px' }"
          @click="handleCancel"
          style="color: #1191b0;"
        >关闭
        </a-button>
      </template>
    </a-modal>
  </div>
</template>
<script>
import {
  getAction,
  postAction
} from '@/api/manage'
import { ajaxGetDictItems, getDictItemsFromCache, duplicateCheck } from '@/api/api'
export default {
  name: 'EquipmentDetailModal',
  components: {},
  props: {},
  data() {
    return {
      runData: [],
      // xyzAliasesList: [],
      //主轴倍率
      spindlebeilv: 0,
      //进给倍率
      feedbeilv: 0,
      // ä¸»è½´è´Ÿè·
      spindleload: 0,
      //快速进给倍率
      rapidfeed: 0,
      visible: false,
      resultData: {},
      url: {
        mdcEquipmentDetailedInfo: '/mdc/mdcEquipment/mdcEquipmentDetailedInfo'
      },
      modalTimer: null,
      xyzList: null
    }
  },
  beforeDestroy() {
    clearInterval(this.modalTimer)
    this.modalTimer = null
  },
  methods: {
    drawLine() {
      let _this = this
      if (_this.spindlebeilv) {
        //基于准备好的dom,初始化echarts实例
        let mdcEquiMoniGauge1 = this.$echarts.init(document.getElementById('mdcEquiMoniGauge1'), 'macarons')
        let mdcEquiMoniGaugeOption1 = {
          tooltip: {
            formatter: '{a} <br/>{b} : {c}%'
          },
          series: [{
            name: '外部线',
            type: 'gauge',
            radius: '65%', // åŠ¨æ€
            startAngle: 225,
            endAngle: -45,
            axisLine: {
              lineStyle: {
                color: [
                  [1, '#31F3FF'] // åŠ¨æ€
                ],
                width: 1
              }
            },
            axisLabel: {
              show: false
            },
            axisTick: {
              show: false
            },
            splitLine: {
              show: false
            },
            detail: {
              show: false
            },
            title: { //标题
              show: false
            }
          },
            {
              name: '外部刻度',
              type: 'gauge',
              radius: '80%',
              min: 0, //最小刻度
              max: 300, //最大刻度
              splitNumber: 10, //刻度数量
              startAngle: 225,
              endAngle: -45,
              axisLine: {
                show: false,
                lineStyle: {
                  color: [
                    [1, 'rgba(0,0,0,0)']
                  ]
                }
              }, //仪表盘轴线
              axisLabel: {
                show: true,
                color: '#31F3FF',
                fontSize: 10, // åŠ¨æ€
                distance: -20 // åŠ¨æ€
              }, //刻度标签。
              axisTick: {
                show: false
              }, //刻度样式
              splitLine: {
                show: false
              }
            },
            {
              name: '内部宽线条',
              type: 'gauge',
              radius: '55%',
              startAngle: 225,
              endAngle: -45,
              axisLine: {
                lineStyle: {
                  color: [
                    [1, '#122B3C']
                  ],
                  width: 4
                }
              },
              axisLabel: {
                show: false
              },
              axisTick: {
                show: false
              },
              splitLine: {
                show: false
              },
              detail: {
                show: false
              },
              title: {
                show: false
              }
            },
            {
              name: '内部细线条',
              type: 'gauge',
              radius: '40%',
              startAngle: 225,
              endAngle: -45,
              axisLine: {
                lineStyle: {
                  color: [
                    [1, '#122B3C']
                  ],
                  width: 3
                }
              },
              axisLabel: {
                show: false
              },
              axisTick: {
                show: false
              },
              splitLine: {
                show: false
              },
              detail: {
                show: false
              },
              title: {
                show: false
              }
            },
            {
              name: '间隔条形',
              type: 'gauge',
              radius: '52.5%',
              z: 4,
              splitNumber: 35,
              startAngle: 225,
              endAngle: -45,
              axisLine: {
                lineStyle: {
                  opacity: 0
                }
              },
              axisLabel: {
                show: false
              },
              axisTick: {
                show: false,
                length: 20,
                splitNumber: 1,
                lineStyle: {
                  color: '#122B3C',
                  width: 1
                }
              },
              splitLine: {
                show: false
              },
              detail: {
                show: false
              },
              title: {
                show: false
              }
            },
            {
              name: '数据',
              type: 'gauge',
              radius: '52.5%',
              z: 3,
              startAngle: 225,
              max: 300,
              endAngle: -45,
              axisLine: {
                lineStyle: {
                  color: [
                    [_this.spindlebeilv / 300, '#31F3FF'], // åŠ¨æ€
                    [1, '#185363']
                  ],
                  width: 4
                }
              },
              tooltip: {
                show: false
              },
              axisLabel: {
                show: false
              },
              axisTick: {
                show: false
              },
              splitLine: {
                show: false
              },
              detail: {
                show: true,
                fontWeight: 'bold',
                fontSize: 12,
                color: '#fff'
              },
              pointer: {
                show: true,
                width: 3,
                itemStyle: {
                  color: '#fff'
                }
              },
              data: [{
                name: '',
                value: _this.spindlebeilv
              }]
            },
            // å†…圆
            {
              'name': '内圆环',
              'type': 'pie',
              'radius': ['4%', '2%'],
              'hoverAnimation': false,
              tooltip: {
                show: false
              },
              cursor: 'default',
              'labelLine': {
                'normal': {
                  'show': false
                }
              },
              itemStyle: {
                color: '#fff'
              },
              animation: false,
              'data': [1]
            },
            // å†…圆
            {
              'name': '内圆环2',
              'type': 'pie',
              'radius': '2%',
              'hoverAnimation': false,
              cursor: 'default',
              tooltip: {
                show: false
              },
              'labelLine': {
                'normal': {
                  'show': false
                }
              },
              itemStyle: {
                color: '#31F3FF'
              },
              animation: false,
              'data': [1]
            }
          ]
        }
        mdcEquiMoniGauge1.setOption(mdcEquiMoniGaugeOption1)
      }
      if (_this.feedbeilv) {
        let mdcEquiMoniGauge2 = this.$echarts.init(document.getElementById('mdcEquiMoniGauge2'), 'macarons')
        let mdcEquiMoniGaugeOption2 = {
          tooltip: {
            formatter: '{a} <br/>{b} : {c}%'
          },
          series: [{
            name: '外部线',
            type: 'gauge',
            radius: '65%', // åŠ¨æ€
            startAngle: 225,
            endAngle: -45,
            axisLine: {
              lineStyle: {
                color: [
                  [1, '#31F3FF'] // åŠ¨æ€
                ],
                width: 1
              }
            },
            axisLabel: {
              show: false
            },
            axisTick: {
              show: false
            },
            splitLine: {
              show: false
            },
            detail: {
              show: false
            },
            title: { //标题
              show: false
            }
          },
            {
              name: '外部刻度',
              type: 'gauge',
              radius: '80%',
              min: 0, //最小刻度
              max: 300, //最大刻度
              splitNumber: 10, //刻度数量
              startAngle: 225,
              endAngle: -45,
              axisLine: {
                show: false,
                lineStyle: {
                  color: [
                    [1, 'rgba(0,0,0,0)']
                  ]
                }
              }, //仪表盘轴线
              axisLabel: {
                show: true,
                color: '#31F3FF',
                fontSize: 10, // åŠ¨æ€
                distance: -20 // åŠ¨æ€
              }, //刻度标签。
              axisTick: {
                show: false
              }, //刻度样式
              splitLine: {
                show: false
              }
            },
            {
              name: '内部宽线条',
              type: 'gauge',
              radius: '55%',
              startAngle: 225,
              endAngle: -45,
              axisLine: {
                lineStyle: {
                  color: [
                    [1, '#122B3C']
                  ],
                  width: 4
                }
              },
              axisLabel: {
                show: false
              },
              axisTick: {
                show: false
              },
              splitLine: {
                show: false
              },
              detail: {
                show: false
              },
              title: {
                show: false
              }
            },
            {
              name: '内部细线条',
              type: 'gauge',
              radius: '40%',
              startAngle: 225,
              endAngle: -45,
              axisLine: {
                lineStyle: {
                  color: [
                    [1, '#122B3C']
                  ],
                  width: 3
                }
              },
              axisLabel: {
                show: false
              },
              axisTick: {
                show: false
              },
              splitLine: {
                show: false
              },
              detail: {
                show: false
              },
              title: {
                show: false
              }
            },
            {
              name: '间隔条形',
              type: 'gauge',
              radius: '52.5%',
              z: 4,
              splitNumber: 35,
              startAngle: 225,
              endAngle: -45,
              axisLine: {
                lineStyle: {
                  opacity: 0
                }
              },
              axisLabel: {
                show: false
              },
              axisTick: {
                show: false,
                length: 20,
                splitNumber: 1,
                lineStyle: {
                  color: '#122B3C',
                  width: 1
                }
              },
              splitLine: {
                show: false
              },
              detail: {
                show: false
              },
              title: {
                show: false
              }
            },
            {
              name: '数据',
              type: 'gauge',
              radius: '52.5%',
              z: 3,
              startAngle: 225,
              max: 300,
              endAngle: -45,
              axisLine: {
                lineStyle: {
                  color: [
                    [_this.feedbeilv / 300, '#31F3FF'], // åŠ¨æ€
                    [1, '#185363']
                  ],
                  width: 4
                }
              },
              tooltip: {
                show: false
              },
              axisLabel: {
                show: false
              },
              axisTick: {
                show: false
              },
              splitLine: {
                show: false
              },
              detail: {
                show: true,
                fontWeight: 'bold',
                fontSize: 12,
                color: '#fff'
              },
              pointer: {
                show: true,
                width: 3,
                itemStyle: {
                  color: '#fff'
                }
              },
              data: [{
                name: '',
                value: _this.feedbeilv
              }]
            },
            // å†…圆
            {
              'name': '内圆环',
              'type': 'pie',
              'radius': ['4%', '2%'],
              'hoverAnimation': false,
              tooltip: {
                show: false
              },
              cursor: 'default',
              'labelLine': {
                'normal': {
                  'show': false
                }
              },
              itemStyle: {
                color: '#fff'
              },
              animation: false,
              'data': [1]
            },
            // å†…圆
            {
              'name': '内圆环2',
              'type': 'pie',
              'radius': '2%',
              'hoverAnimation': false,
              cursor: 'default',
              tooltip: {
                show: false
              },
              'labelLine': {
                'normal': {
                  'show': false
                }
              },
              itemStyle: {
                color: '#31F3FF'
              },
              animation: false,
              'data': [1]
            }
          ]
        }
        mdcEquiMoniGauge2.setOption(mdcEquiMoniGaugeOption2)
      }
      if (_this.spindleload) {
        let mdcEquiMoniGauge3 = this.$echarts.init(document.getElementById('mdcEquiMoniGauge3'), 'macarons')
        let mdcEquiMoniGaugeOption3 = {
          tooltip: {
            formatter: '{a} <br/>{b} : {c}%'
          },
          series: [{
            name: '外部线',
            type: 'gauge',
            radius: '65%', // åŠ¨æ€
            startAngle: 225,
            endAngle: -45,
            axisLine: {
              lineStyle: {
                color: [
                  [1, '#31F3FF'] // åŠ¨æ€
                ],
                width: 1
              }
            },
            axisLabel: {
              show: false
            },
            axisTick: {
              show: false
            },
            splitLine: {
              show: false
            },
            detail: {
              show: false
            },
            title: { //标题
              show: false
            }
          },
            {
              name: '外部刻度',
              type: 'gauge',
              radius: '80%',
              min: 0, //最小刻度
              max: 100, //最大刻度
              splitNumber: 10, //刻度数量
              startAngle: 225,
              endAngle: -45,
              axisLine: {
                show: false,
                lineStyle: {
                  color: [
                    [1, 'rgba(0,0,0,0)']
                  ]
                }
              }, //仪表盘轴线
              axisLabel: {
                show: true,
                color: '#31F3FF',
                fontSize: 10, // åŠ¨æ€
                distance: -20 // åŠ¨æ€
              }, //刻度标签。
              axisTick: {
                show: false
              }, //刻度样式
              splitLine: {
                show: false
              }
            },
            {
              name: '内部宽线条',
              type: 'gauge',
              radius: '55%',
              startAngle: 225,
              endAngle: -45,
              axisLine: {
                lineStyle: {
                  color: [
                    [1, '#122B3C']
                  ],
                  width: 4
                }
              },
              axisLabel: {
                show: false
              },
              axisTick: {
                show: false
              },
              splitLine: {
                show: false
              },
              detail: {
                show: false
              },
              title: {
                show: false
              }
            },
            {
              name: '内部细线条',
              type: 'gauge',
              radius: '40%',
              startAngle: 225,
              endAngle: -45,
              axisLine: {
                lineStyle: {
                  color: [
                    [1, '#122B3C']
                  ],
                  width: 3
                }
              },
              axisLabel: {
                show: false
              },
              axisTick: {
                show: false
              },
              splitLine: {
                show: false
              },
              detail: {
                show: false
              },
              title: {
                show: false
              }
            },
            {
              name: '间隔条形',
              type: 'gauge',
              radius: '52.5%',
              z: 4,
              splitNumber: 35,
              startAngle: 225,
              endAngle: -45,
              axisLine: {
                lineStyle: {
                  opacity: 0
                }
              },
              axisLabel: {
                show: false
              },
              axisTick: {
                show: false,
                length: 20,
                splitNumber: 1,
                lineStyle: {
                  color: '#122B3C',
                  width: 1
                }
              },
              splitLine: {
                show: false
              },
              detail: {
                show: false
              },
              title: {
                show: false
              }
            },
            {
              name: '数据',
              type: 'gauge',
              radius: '52.5%',
              z: 3,
              startAngle: 225,
              max: 100,
              endAngle: -45,
              axisLine: {
                lineStyle: {
                  color: [
                    [_this.spindleload / 100, '#31F3FF'], // åŠ¨æ€
                    [1, '#185363']
                  ],
                  width: 4
                }
              },
              tooltip: {
                show: false
              },
              axisLabel: {
                show: false
              },
              axisTick: {
                show: false
              },
              splitLine: {
                show: false
              },
              detail: {
                show: true,
                fontWeight: 'bold',
                fontSize: 12,
                color: '#fff'
              },
              pointer: {
                show: true,
                width: 3,
                itemStyle: {
                  color: '#fff'
                }
              },
              data: [{
                name: '',
                value: _this.spindleload
              }]
            },
            // å†…圆
            {
              'name': '内圆环',
              'type': 'pie',
              'radius': ['4%', '2%'],
              'hoverAnimation': false,
              tooltip: {
                show: false
              },
              cursor: 'default',
              'labelLine': {
                'normal': {
                  'show': false
                }
              },
              itemStyle: {
                color: '#fff'
              },
              animation: false,
              'data': [1]
            },
            // å†…圆
            {
              'name': '内圆环2',
              'type': 'pie',
              'radius': '2%',
              'hoverAnimation': false,
              cursor: 'default',
              tooltip: {
                show: false
              },
              'labelLine': {
                'normal': {
                  'show': false
                }
              },
              itemStyle: {
                color: '#31F3FF'
              },
              animation: false,
              'data': [1]
            }
          ]
        }
        mdcEquiMoniGauge3.setOption(mdcEquiMoniGaugeOption3)
      }
      if (_this.rapidfeed) {
        let mdcEquiMoniGauge4 = this.$echarts.init(document.getElementById('mdcEquiMoniGauge4'), 'macarons')
        let mdcEquiMoniGaugeOption4 = {
          tooltip: {
            formatter: '{a} <br/>{b} : {c}%'
          },
          series: [{
            name: '外部线',
            type: 'gauge',
            radius: '65%', // åŠ¨æ€
            startAngle: 225,
            endAngle: -45,
            axisLine: {
              lineStyle: {
                color: [
                  [1, '#31F3FF'] // åŠ¨æ€
                ],
                width: 1
              }
            },
            axisLabel: {
              show: false
            },
            axisTick: {
              show: false
            },
            splitLine: {
              show: false
            },
            detail: {
              show: false
            },
            title: { //标题
              show: false
            }
          },
            {
              name: '外部刻度',
              type: 'gauge',
              radius: '80%',
              min: 0, //最小刻度
              max: 300, //最大刻度
              splitNumber: 10, //刻度数量
              startAngle: 225,
              endAngle: -45,
              axisLine: {
                show: false,
                lineStyle: {
                  color: [
                    [1, 'rgba(0,0,0,0)']
                  ]
                }
              }, //仪表盘轴线
              axisLabel: {
                show: true,
                color: '#31F3FF',
                fontSize: 10, // åŠ¨æ€
                distance: -20 // åŠ¨æ€
              }, //刻度标签。
              axisTick: {
                show: false
              }, //刻度样式
              splitLine: {
                show: false
              }
            },
            {
              name: '内部宽线条',
              type: 'gauge',
              radius: '55%',
              startAngle: 225,
              endAngle: -45,
              axisLine: {
                lineStyle: {
                  color: [
                    [1, '#122B3C']
                  ],
                  width: 4
                }
              },
              axisLabel: {
                show: false
              },
              axisTick: {
                show: false
              },
              splitLine: {
                show: false
              },
              detail: {
                show: false
              },
              title: {
                show: false
              }
            },
            {
              name: '内部细线条',
              type: 'gauge',
              radius: '40%',
              startAngle: 225,
              endAngle: -45,
              axisLine: {
                lineStyle: {
                  color: [
                    [1, '#122B3C']
                  ],
                  width: 3
                }
              },
              axisLabel: {
                show: false
              },
              axisTick: {
                show: false
              },
              splitLine: {
                show: false
              },
              detail: {
                show: false
              },
              title: {
                show: false
              }
            },
            {
              name: '间隔条形',
              type: 'gauge',
              radius: '52.5%',
              z: 4,
              splitNumber: 35,
              startAngle: 225,
              endAngle: -45,
              axisLine: {
                lineStyle: {
                  opacity: 0
                }
              },
              axisLabel: {
                show: false
              },
              axisTick: {
                show: false,
                length: 20,
                splitNumber: 1,
                lineStyle: {
                  color: '#122B3C',
                  width: 1
                }
              },
              splitLine: {
                show: false
              },
              detail: {
                show: false
              },
              title: {
                show: false
              }
            },
            {
              name: '数据',
              type: 'gauge',
              radius: '52.5%',
              z: 3,
              startAngle: 225,
              max: 300,
              endAngle: -45,
              axisLine: {
                lineStyle: {
                  color: [
                    [_this.rapidfeed / 300, '#31F3FF'], // åŠ¨æ€
                    [1, '#185363']
                  ],
                  width: 4
                }
              },
              tooltip: {
                show: false
              },
              axisLabel: {
                show: false
              },
              axisTick: {
                show: false
              },
              splitLine: {
                show: false
              },
              detail: {
                show: true,
                fontWeight: 'bold',
                fontSize: 12,
                color: '#fff'
              },
              pointer: {
                show: true,
                width: 3,
                itemStyle: {
                  color: '#fff'
                }
              },
              data: [{
                name: '',
                value: _this.rapidfeed
              }]
            },
            // å†…圆
            {
              'name': '内圆环',
              'type': 'pie',
              'radius': ['4%', '2%'],
              'hoverAnimation': false,
              tooltip: {
                show: false
              },
              cursor: 'default',
              'labelLine': {
                'normal': {
                  'show': false
                }
              },
              itemStyle: {
                color: '#fff'
              },
              animation: false,
              'data': [1]
            },
            // å†…圆
            {
              'name': '内圆环2',
              'type': 'pie',
              'radius': '2%',
              'hoverAnimation': false,
              cursor: 'default',
              tooltip: {
                show: false
              },
              'labelLine': {
                'normal': {
                  'show': false
                }
              },
              itemStyle: {
                color: '#31F3FF'
              },
              animation: false,
              'data': [1]
            }
          ]
        }
        mdcEquiMoniGauge4.setOption(mdcEquiMoniGaugeOption4)
      }
    },
    close() {
      this.$emit('close')
      this.visible = false
      clearInterval(this.modalTimer)
      this.modalTimer = null
    },
    handleCancel() {
      this.close()
      clearInterval(this.modalTimer)
      this.modalTimer = null
    },
    timerModel(id) {
      this.modalTimer = setInterval(() => {
        setTimeout(this.initData(id), 0)
      }, 1000 * 4)
    },
    initData(id) {
      let _this = this
      this.visible = true
      getAction(this.url.mdcEquipmentDetailedInfo, { id: id }).then((res) => {
        if (res.success) {
          _this.resultData = res.result.equipment
          _this.spindlebeilv = res.result.spindlebeilv
          _this.feedbeilv = res.result.feedbeilv
          _this.spindleload = res.result.spindleload
          _this.rapidfeed = res.result.rapidfeed
          _this.runData = res.result.runData
          _this.xyzList = res.result.xyzList
          // _this.xyzAliasesList = res.result.xyzAliasesList
          this.$nextTick(() => {
            _this.drawLine()
          })
        } else {
          _this.$notification.warning({
            message: '消息',
            description: res.message
          })
        }
      })
    },
    mouseEnterItem(e) {
      console.log(e, e.target, e.target.clientWidth, e.target.scrollWidth)
      if (e.target.clientWidth >= e.target.scrollWidth) {
        e.target.style.pointerEvents = 'none' // é˜»æ­¢é¼ æ ‡äº‹ä»¶    pointer-events å±žæ€§ç”¨äºŽè®¾ç½®å…ƒç´ æ˜¯å¦å¯¹é¼ æ ‡äº‹ä»¶åšå‡ºååº”。
      }
    }
  }
}
</script>
<style scoped lang="less">
body {
  overflow-y: hidden !important;
}
.full-modal {
  .ant-modal {
    top: 0;
    padding-bottom: 0;
    margin: 0;
    background-color: #4a4a48 !important;
    opacity: 0.5;
  }
  /deep/ .ant-modal-content {
    display: flex;
    flex-direction: column;
    background-color: #4a4a48;
  }
  .ant-modal-body {
    flex: 1;
  }
}
/deep/ .ant-modal-content {
  background-color: #312c2c;
  opacity: 0.9;
}
/deep/ .ant-modal-close {
  color: #1191b0;
  font-size: 24px;
}
/deep/ .ant-modal-close-x {
  font-size: 24px;
}
/deep/ .ant-modal-footer {
  border-top: none;
}
/deep/ .ant-descriptions {
  border: 1px solid #16738d;
  margin: 10px 0;
}
/deep/ .ant-descriptions-title {
  color: #fff;
  padding: 10px;
  margin-bottom: 0;
}
/deep/ .ant-descriptions-view {
  padding: 0 20px;
}
/deep/ .ant-descriptions-view .ant-descriptions-row .ant-descriptions-item {
  padding-bottom: 5px;
}
/deep/ .ant-descriptions-item-colon {
  color: #fff;
  width: 5.1vw;
}
/deep/ .ant-descriptions-item-content {
  color: #fff;
  border: 1px solid #4bcfc8;
  padding: 0 10px;
  width: auto;
  min-width: 130px;
  /*max-width: 300px;*/
  height: 25px;
}
.mdcEquipMon {
  color: #fff;
}
fieldset {
  border: 1px solid #16738d;
  padding: 17px;
  margin: 14px;
}
fieldset legend {
  display: inline;
  width: 88px;
}
table tr td {
  text-align: left;
  color: #fff;
}
table tr td input {
  border: 1px solid #a6eff9;
}
.ant-btn {
  padding: 0 10px;
  margin-left: 3px;
  color: #fff !important;
  background-color: #1191b0;
  border: none;
}
.ant-form-item-control {
  line-height: 0px;
}
/** ä¸»è¡¨å•行间距 */
.ant-form .ant-form-item {
  margin-bottom: 10px;
}
/** Tab页面行间距 */
.ant-tabs-content .ant-form-item {
  margin-bottom: 0px;
}
/deep/ .ant-descriptions-item-label {
  width: 6.7vw;
  text-align: right;
  margin-right: 10px;
}
/deep/ .operationData .ant-descriptions-item-content {
  width: 130px;
  overflow: hidden;
}
.description-item-class {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
</style>