From 55ed9fd6f8654c148fd0d8b504978ee7d39c86ac Mon Sep 17 00:00:00 2001
From: Lius <Lius2225@163.com>
Date: 星期四, 24 四月 2025 14:22:41 +0800
Subject: [PATCH] 设备详细信息页更新

---
 src/views/mdc/base/modules/DeviceBaseInfo/EquipmentDetailModal.vue | 2658 ++++++++++++++++++++++++++++-------------------------------
 1 files changed, 1,261 insertions(+), 1,397 deletions(-)

diff --git a/src/views/mdc/base/modules/DeviceBaseInfo/EquipmentDetailModal.vue b/src/views/mdc/base/modules/DeviceBaseInfo/EquipmentDetailModal.vue
index 524ca0e..3e1b58a 100644
--- a/src/views/mdc/base/modules/DeviceBaseInfo/EquipmentDetailModal.vue
+++ b/src/views/mdc/base/modules/DeviceBaseInfo/EquipmentDetailModal.vue
@@ -1,8 +1,7 @@
 <template>
   <div ref="wrap">
     <a-modal
-      :title="title"
-      width="70%"
+      width="90%"
       :visible="visible"
       :getContainer="() => this.$refs.wrap"
       @cancel="handleCancel"
@@ -74,168 +73,42 @@
               </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.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="IP鍦板潃">{{resultData.equipmentIp}}</a-descriptions-item>
                 <a-descriptions-item label="绔彛鍙�">{{resultData.dataPort}}</a-descriptions-item>
-                <a-descriptions-item label="绯荤粺鐗堟湰鍙�">{{resultData.systemVersion}}</a-descriptions-item>
+                <!--                <a-descriptions-item label="绯荤粺鐗堟湰鍙�">{{resultData.systemVersion}}</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.deviceType}}</a-descriptions-item>
-                <a-descriptions-item label="璁惧鍔熺巼">{{resultData.devicePower}}</a-descriptions-item>
+                <a-descriptions-item label="璁惧绫诲瀷">{{resultData.equipmentType}}</a-descriptions-item>
+                <!--                <a-descriptions-item label="璁惧鍔熺巼">{{resultData.devicePower}}</a-descriptions-item>-->
                 <a-descriptions-item label="鏈夋晥杞存暟">{{resultData.validAxis}}</a-descriptions-item>
                 <a-descriptions-item label="鏈�澶ц酱鏁�">{{resultData.maxAxis}}</a-descriptions-item>
                 <a-descriptions-item label="澶囨敞">{{resultData.remark}}</a-descriptions-item>
 
               </a-descriptions>
 
-              <!-- <a-descriptions
-                title="杩愯鏁版嵁"
-                v-if="driverType != 'LSV2' && driverType != 'ZUOLAN' "
-                :column="4"
-              >
-                <a-descriptions-item label="涓昏酱鍊嶇巼(%)">{{resultData.spindlebeilv}}</a-descriptions-item>
-                <a-descriptions-item label="杩涚粰鍊嶇巼(%)">{{resultData.feedbeilv}}</a-descriptions-item>
-                <a-descriptions-item label="涓昏酱璐熻嵎(%)">{{resultData.spindleload}}</a-descriptions-item>
-                <a-descriptions-item label="涓昏酱杞��(rpm)">{{resultData.spindlespeed}}</a-descriptions-item>
-                <a-descriptions-item label="杩涚粰閫熷害(mm/min)">{{resultData.feedrate}}</a-descriptions-item>
-              </a-descriptions>
-
-              <a-descriptions
-                title="杩愯鏁版嵁 for lsv2"
-                v-if="driverType == 'LSV2'"
-                :column="4"
-              >
-                <a-descriptions-item label="涓昏酱鍊嶇巼(%)">{{resultData.spindlebeilv}}</a-descriptions-item>
-                <a-descriptions-item label="璁惧姝e父杩愯鏃堕棿">{{resultData.equipmentNormalTime}}</a-descriptions-item>
-                <a-descriptions-item label="蹇�熻繘缁欏�嶇巼(%)">{{resultData.rapidfeed}}</a-descriptions-item>
-                <a-descriptions-item label="NC姝e父杩愯鏃堕棿">{{resultData.nCNormalTime}}</a-descriptions-item>
-                <a-descriptions-item label="杩涚粰鍊嶇巼(%)">{{resultData.feedbeilv}}</a-descriptions-item>
-                <a-descriptions-item label="璁惧杩愯鏃堕棿">{{resultData.equipmentTime}}</a-descriptions-item>
-                <a-descriptions-item label="褰撳墠鍒�鍏峰彿">{{resultData.toolNum}}</a-descriptions-item>
-              </a-descriptions> -->
-
-              <!-- <a-descriptions
-                title="绋嬪簭淇℃伅"
-                v-if="driverType != 'LSV2' && driverType != 'ZUOLAN' "
-                :column="4"
-              >
-                <a-descriptions-item label="搴忓垪鍙�">{{resultData.sequencenumber}}</a-descriptions-item>
-                <a-descriptions-item
-                  label="褰撳墠鎵ц浠g爜"
-                  :span="2"
-                >{{resultData.executingcode}}</a-descriptions-item>
-                <a-descriptions-item label="宸ヤ欢鍚嶇О">{{resultData.productName}}</a-descriptions-item>
-              </a-descriptions> -->
-
-              <!-- <a-descriptions
-                title="绋嬪簭淇℃伅  for lsv2"
-                v-if="driverType == 'LSV2'"
-                :column="4"
-              >
-                <a-descriptions-item label="褰撳墠绋嬪簭">{{resultData.program}}</a-descriptions-item>
-                <a-descriptions-item label="绋嬪簭鎵ц鐐�">{{resultData.programPosition}}</a-descriptions-item>
-                <a-descriptions-item label="鎿嶄綔妯″紡">{{resultData.operationType}}</a-descriptions-item>
-                <a-descriptions-item label="閿欒淇℃伅缂栧彿涓�">{{resultData.firstErrorNum}}</a-descriptions-item>
-                <a-descriptions-item label="閿欒淇℃伅涓�">{{resultData.firstError}}</a-descriptions-item>
-                <a-descriptions-item label="閿欒淇℃伅">{{resultData.errorinfo}}</a-descriptions-item>
-                <a-descriptions-item label="閿欒淇℃伅缂栧彿浜�">{{resultData.secondErrorNum}}</a-descriptions-item>
-                <a-descriptions-item label="閿欒淇℃伅浜�">{{resultData.secondError}}</a-descriptions-item>
-              </a-descriptions> -->
-
-              <!--<a-descriptions
-                title="杞寸洃鎺ф暟鎹� fro SIEMENS840DSL"
-                v-if="driverType == 'SIEMENS840DSL'"
-                :column="4"
-              >
-                <a-descriptions-item label="X杞存俯搴�">{{resultData.temperatureX}}</a-descriptions-item>
-                <a-descriptions-item label="Y杞存俯搴�">{{resultData.temperatureY}}</a-descriptions-item>
-                <a-descriptions-item label="Z杞存俯搴�">{{resultData.temperatureZ}}</a-descriptions-item>
-                <a-descriptions-item label="A杞存俯搴�">{{resultData.temperatureA}}</a-descriptions-item>
-                <a-descriptions-item label="B杞存俯搴�">{{resultData.temperatureB}}</a-descriptions-item>
-                <a-descriptions-item label="X杞寸數娴�">{{resultData.equipmentCurrentX}}</a-descriptions-item>
-                <a-descriptions-item label="Y杞寸數娴�">{{resultData.equipmentCurrentY}}</a-descriptions-item>
-                <a-descriptions-item label="Z杞寸數娴�">{{resultData.equipmentCurrentZ}}</a-descriptions-item>
-                <a-descriptions-item label="A杞寸數娴�">{{resultData.equipmentCurrentA}}</a-descriptions-item>
-                <a-descriptions-item label="B杞寸數娴�">{{resultData.equipmentCurrentB}}</a-descriptions-item>
-                <a-descriptions-item label="X杞撮殢鍔ㄨ宸�">{{resultData.equipmentLagErrorX}}</a-descriptions-item>
-                <a-descriptions-item label="Y杞撮殢鍔ㄨ宸�">{{resultData.equipmentLagErrorY}}</a-descriptions-item>
-                <a-descriptions-item label="Z杞撮殢鍔ㄨ宸�">{{resultData.equipmentLagErrorZ}}</a-descriptions-item>
-                <a-descriptions-item label="A杞撮殢鍔ㄨ宸�">{{resultData.equipmentLagErrorA}}</a-descriptions-item>
-                <a-descriptions-item label="B杞撮殢鍔ㄨ宸�">{{resultData.equipmentLagErrorB}}</a-descriptions-item>
-              </a-descriptions>
--->
-              <!-- <a-descriptions
-                title="鍧愭爣淇℃伅 "
-                v-if="driverType == 'FANUC'"
-                :column="3"
-              >
-                <a-descriptions-item label="缁濆鍧愭爣X">{{resultData.xabsolute}}</a-descriptions-item>
-                <a-descriptions-item label="缁濆鍧愭爣Y">{{resultData.yabsolute}}</a-descriptions-item>
-                <a-descriptions-item label="缁濆鍧愭爣Z">{{resultData.zabsolute}}</a-descriptions-item>
-                <a-descriptions-item label="鏈哄簥鍧愭爣X">{{resultData.xmachine}}</a-descriptions-item>
-                <a-descriptions-item label="鏈哄簥鍧愭爣Y">{{resultData.ymachine}}</a-descriptions-item>
-                <a-descriptions-item label="鏈哄簥鍧愭爣Z">{{resultData.zmachine}}</a-descriptions-item>
-              </a-descriptions>
-
-              <a-descriptions
-                title="鍧愭爣淇℃伅 for lsv2"
-                v-if="driverType == 'LSV2'"
-                :column="4"
-              >
-                <a-descriptions-item label="X鍧愭爣">{{resultData.xmachine}}</a-descriptions-item>
-                <a-descriptions-item label="Y鍧愭爣">{{resultData.ymachine}}</a-descriptions-item>
-                <a-descriptions-item label="Z鍧愭爣">{{resultData.zmachine}}</a-descriptions-item>
-                <a-descriptions-item label="A鍧愭爣">{{resultData.amachine}}</a-descriptions-item>
-                <a-descriptions-item label="B鍧愭爣">{{resultData.bmachine}}</a-descriptions-item>
-                <a-descriptions-item label="C鍧愭爣">{{resultData.cmachine}}</a-descriptions-item>
-              </a-descriptions>
-
-              <a-descriptions
-                title="鍧愭爣淇℃伅 for lsv2"
-                v-if="driverType == 'LSV2'"
-                :column="4"
-              >
-                <a-descriptions-item label="X鍧愭爣">{{resultData.xmachine}}</a-descriptions-item>
-                <a-descriptions-item label="Y鍧愭爣">{{resultData.ymachine}}</a-descriptions-item>
-                <a-descriptions-item label="Z鍧愭爣">{{resultData.zmachine}}</a-descriptions-item>
-                <a-descriptions-item label="A鍧愭爣">{{resultData.amachine}}</a-descriptions-item>
-                <a-descriptions-item label="B鍧愭爣">{{resultData.bmachine}}</a-descriptions-item>
-                <a-descriptions-item label="C鍧愭爣">{{resultData.cmachine}}</a-descriptions-item>
-              </a-descriptions>
-
-              <a-descriptions
-                title="鍧愭爣淇℃伅"
-                v-if="driverType == 'LSV2'"
-                :column="4"
-              >
-                <a-descriptions-item label="X鍧愭爣">{{resultData.xmachine}}</a-descriptions-item>
-                <a-descriptions-item label="Y鍧愭爣">{{resultData.ymachine}}</a-descriptions-item>
-                <a-descriptions-item label="Z鍧愭爣">{{resultData.zmachine}}</a-descriptions-item>
-                <a-descriptions-item label="A鍧愭爣">{{resultData.amachine}}</a-descriptions-item>
-                <a-descriptions-item label="B鍧愭爣">{{resultData.bmachine}}</a-descriptions-item>
-                <a-descriptions-item label="C鍧愭爣">{{resultData.cmachine}}</a-descriptions-item>
-              </a-descriptions> -->
               <!---鏁版嵁婧愯皟鏁�  鍔ㄦ�佸睍绀� 杩愯鏁版嵁---->
 
               <a-descriptions
                 title="杩愯鏁版嵁"
-                v-show="mdcDriveTypeParamConfigList != null"
-                v-if="driverType != 'PLC'"
+                v-show="runData"
+                v-if="resultData.driveType != 'PLC'"
                 :column="4"
                 class="operationData"
               >
 
                 <a-descriptions-item
-                  v-for="(item,id) in mdcDriveTypeParamConfigList  "
+                  v-for="(item,id) in runData"
                   :key="item.id"
-                  :label="item.chineseName"
+                  :label="item.key"
                 >
                   <a-tooltip @mouseenter="mouseEnterItem">
                     <template slot="title">
@@ -248,6 +121,23 @@
 
               </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>
@@ -257,1293 +147,1267 @@
           :style="{ marginRight: '8px' }"
           @click="handleCancel"
           style="color: #1191b0;"
-        >鍏抽棴</a-button>
+        >鍏抽棴
+        </a-button>
       </template>
     </a-modal>
   </div>
 </template>
 
 <script>
-  import {
-    getAction,
-    postAction
-  } from '@/api/manage'
-  import { ajaxGetDictItems, getDictItemsFromCache, duplicateCheck } from '@/api/api'
+import {
+  getAction,
+  postAction
+} from '@/api/manage'
+import { ajaxGetDictItems, getDictItemsFromCache, duplicateCheck } from '@/api/api'
 
-  export default {
-    name: 'EquipmentDetailModal',
-    components: {},
-    props: {},
-    data() {
-      return {
-        mdcDriveTypeParamConfigList: [],
-        xyzAliasesList: [],
-        title: '',
-        //涓昏酱鍊嶇巼
-        spindlebeilv: 1,
-        //杩涚粰鍊嶇巼
-        feedbeilv: 1,
-        // 涓昏酱璐熻嵎
-        spindleload: 1,
-        //蹇�熻繘缁欏�嶇巼
-        rapidfeed: 1,
-        visible: false,
-        resultData: {},
-        driverType: '',
-        deviceTypeDict: '',
-        url: {
-          mdcEquipmentDetailedInfo: '/mdc/mdcEquipment/mdcEquipmentDetailedInfo'
-        },
-        modalTimer:null,
-        ee:" "
+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)
       }
     },
-    mounted() {
-    },
-    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
-      },
-      // initDeviceType(deviceTypeId) {
-      //   let dictCode = 'mdc_equipmentType'
-      //   let items = []
-      //   items = getDictItemsFromCache(dictCode)
-      //   if (items && items.length > 0) {
-      //     for (let i = 0; i < items.length; i++) {
-      //       if (deviceTypeId == items[i].value) {
-      //         this.deviceTypeDict = items[i].title
-      //       }
-      //     }
-      //   } else {
-      //     ajaxGetDictItems(dictCode, null).then((res) => {
-      //       if (res.success) {
-      //         let items = res.result
-      //         for (let i = 0; i < items.length; i++) {
-      //           if (deviceTypeId == items[i].value) {
-      //             this.deviceTypeDict = items[i].title
-      //           }
-      //         }
-      //       }
-      //     })
-      //   }
-      // },
-      timerModel(id){
-        this.ee = id
-        this.modalTimer = setInterval(() => {
-          setTimeout( this.initData(this.ee),0)
-        },1000*4)
-      },
-
-      initData(id) {
-        let _this = this
-        this.visible = true
-        // _this.drawLine()
-        getAction(this.url.mdcEquipmentDetailedInfo, { id: id }).then((res) => {
-          if (res.success) {
-            _this.resultData = res.result
-            _this.driverType = res.result.deviceType
-            _this.spindlebeilv = res.result.spindlebeilv
-            _this.feedbeilv = res.result.feedbeilv
-            _this.spindleload = res.result.spindleload
-            _this.rapidfeed = res.result.rapidfeed;
-            _this.mdcDriveTypeParamConfigList = res.result.mdcDriveTypeParamConfigList;
-            _this.xyzAliasesList = res.result.xyzAliasesList;
-            this.$nextTick(() => {
-              _this.drawLine()
-            })
-            // _this.initDeviceType(_this.resultData.deviceType)
-          } else {
-            // _this.$message.warn(res.message)
-            _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 灞炴�х敤浜庤缃厓绱犳槸鍚﹀榧犳爣浜嬩欢鍋氬嚭鍙嶅簲銆�
-        }
-      }
-    },
-    beforeDestroy(){
-      clearInterval(this.modalTimer);
+    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;
-      /*height: calc(100vh);*/
-      background-color: #4a4a48;
-    }
-    .ant-modal-body {
-      flex: 1;
-    }
+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 {
-    /*background: -moz-linear-gradient(left, rgba(0, 0, 0, 0.66) 0%, rgba(0, 0, 0, 0.27) 100%);*/
-    /*background: -webkit-gradient(linear, left left, right right, color-stop(0%, rgba(0, 0, 0, 0.66)), color-stop(100%, rgba(0, 0, 0, 0.4)));*/
-    /*background: -webkit-linear-gradient(left, rgba(0, 0, 0, 0.66) 0%, rgba(0, 0, 0, 0.4) 100%);*/
-    /*background: -o-linear-gradient(left, rgba(0, 0, 0, 0.66) 0%, rgba(0, 0, 0, 0.4) 100%);*/
-    /*background: -ms-linear-gradient(left, rgba(0, 0, 0, 0.66) 0%, rgba(0, 0, 0, 0.4) 100%);*/
-    /*background: linear-gradient(to right, rgba(0, 0, 0, 0.66) 0%, rgba(0, 0, 0, 0.4) 100%);*/
-    background-color: #312c2c;
-    opacity: 0.9;
+    display: flex;
+    flex-direction: column;
+    background-color: #4a4a48;
   }
-  /deep/ .ant-modal-close {
-    color: #1191b0;
-    font-size: 24px;
+  .ant-modal-body {
+    flex: 1;
   }
-  /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;
-  }
+/deep/ .ant-modal-content {
+  background-color: #312c2c;
+  opacity: 0.9;
+}
 
-  fieldset legend {
-    display: inline;
-    width: 88px;
-  }
+/deep/ .ant-modal-close {
+  color: #1191b0;
+  font-size: 24px;
+}
 
-  table tr td {
-    text-align: left;
-    color: #fff;
-  }
+/deep/ .ant-modal-close-x {
+  font-size: 24px;
+}
 
-  table tr td input {
-    border: 1px solid #a6eff9;
-  }
+/deep/ .ant-modal-footer {
+  border-top: none;
+}
 
-  .ant-btn {
-    padding: 0 10px;
-    margin-left: 3px;
-    color: #fff !important;
-    background-color: #1191b0;
-    border: none;
-  }
+/deep/ .ant-descriptions {
+  border: 1px solid #16738d;
+  margin: 10px 0;
+}
 
-  .ant-form-item-control {
-    line-height: 0px;
-  }
+/deep/ .ant-descriptions-title {
+  color: #fff;
+  padding: 10px;
+  margin-bottom: 0;
+}
 
-  /** 涓昏〃鍗曡闂磋窛 */
-  .ant-form .ant-form-item {
-    margin-bottom: 10px;
-  }
+/deep/ .ant-descriptions-view {
+  padding: 0 20px;
+}
 
-  /** Tab椤甸潰琛岄棿璺� */
-  .ant-tabs-content .ant-form-item {
-    margin-bottom: 0px;
-  }
+/deep/ .ant-descriptions-view .ant-descriptions-row .ant-descriptions-item {
+  padding-bottom: 5px;
+}
 
-  /deep/ .ant-descriptions-item-label{
-    width: 6.7vw;
-    text-align: right;
-    margin-right: 10px;
-  }
+/deep/ .ant-descriptions-item-colon {
+  color: #fff;
+  width: 5.1vw;
+}
 
-  /deep/ .operationData .ant-descriptions-item-content
-  {
-    width: 130px;
-    overflow: hidden;
-  }
+/deep/ .ant-descriptions-item-content {
+  color: #fff;
+  border: 1px solid #4bcfc8;
+  padding: 0 10px;
+  width: auto;
+  min-width: 130px;
+  /*max-width: 300px;*/
+  height: 25px;
+}
 
-  .description-item-class{
-    overflow: hidden;
-    white-space: nowrap;
-    text-overflow: ellipsis;
-  }
+.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>

--
Gitblit v1.9.3