¶Ô±ÈÐÂÎļþ |
| | |
| | | <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> |