hy/vue_mdc_hyjs.git

			@@ -99,8 +99,7 @@

			<a-descriptions
			title="运行数据"
			v-show="runData"
			v-if="resultData.driveType != 'PLC'"
			v-if="runData&&runData.length>0&&resultData.driveType != 'PLC'"
			:column="4"
			class="operationData"
			>
			@@ -155,1259 +154,1269 @@
			</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 {
			runData: [],
			// xyzAliasesList: [],
			//主轴倍率
			spindlebeilv: 0,
			//进给倍率
			feedbeilv: 0,
			// 主轴负荷
			spindleload: 0,
			//快速进给倍率
			rapidfeed: 0,
			visible: false,
			resultData: {},
			url: {
			mdcEquipmentDetailedInfo: '/mdc/mdcEquipment/mdcEquipmentDetailedInfo'
			export default {
			name: 'EquipmentDetailModal',
			components: {},
			props: {},
			data() {
			return {
			runData: [],
			// xyzAliasesList: [],
			//主轴倍率
			spindlebeilv: null,
			//进给倍率
			feedbeilv: null,
			// 主轴负荷
			spindleload: null,
			//快速进给倍率
			rapidfeed: null,
			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)
			}
			},
			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}%'
			},
			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)
			},

			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 // 动态
			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

			}, //刻度标签。
			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]
			}
			]
			// _this.xyzAliasesList = res.result.xyzAliasesList
			this.$nextTick(() => {
			_this.drawLine()
			})
			} else {
			_this.$notification.warning({
			message: '消息',
			description: res.message
			})
			}
			})

			},

			resetData() {
			this.resultData = {}
			this.spindlebeilv = null
			this.feedbeilv = null
			this.spindleload = null
			this.rapidfeed = null
			this.runData = []
			this.xyzList = null
			},

			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 属性用于设置元素是否对鼠标事件做出反应。
			}
			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;
			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 {
			display: flex;
			flex-direction: column;
			background-color: #4a4a48;
			background-color: #312c2c;
			opacity: 0.9;
			}
			.ant-modal-body {
			flex: 1;

			/deep/ .ant-modal-close {
			color: #1191b0;
			font-size: 24px;
			}
			}

			/deep/ .ant-modal-content {
			background-color: #312c2c;
			opacity: 0.9;
			}
			/deep/ .ant-modal-close-x {
			font-size: 24px;
			}

			/deep/ .ant-modal-close {
			color: #1191b0;
			font-size: 24px;
			}
			/deep/ .ant-modal-footer {
			border-top: none;
			}

			/deep/ .ant-modal-close-x {
			font-size: 24px;
			}
			/deep/ .ant-descriptions {
			border: 1px solid #16738d;
			margin: 10px 0;
			}

			/deep/ .ant-modal-footer {
			border-top: none;
			}
			/deep/ .ant-descriptions-title {
			color: #fff;
			padding: 10px;
			margin-bottom: 0;
			}

			/deep/ .ant-descriptions {
			border: 1px solid #16738d;
			margin: 10px 0;
			}
			/deep/ .ant-descriptions-view {
			padding: 0 20px;
			}

			/deep/ .ant-descriptions-title {
			color: #fff;
			padding: 10px;
			margin-bottom: 0;
			}
			/deep/ .ant-descriptions-view .ant-descriptions-row .ant-descriptions-item {
			padding-bottom: 5px;
			}

			/deep/ .ant-descriptions-view {
			padding: 0 20px;
			}
			/deep/ .ant-descriptions-item-colon {
			color: #fff;
			width: 5.1vw;
			}

			/deep/ .ant-descriptions-view .ant-descriptions-row .ant-descriptions-item {
			padding-bottom: 5px;
			}
			/deep/ .ant-descriptions-item-content {
			color: #fff;
			border: 1px solid #4bcfc8;
			padding: 0 10px;
			width: auto;
			min-width: 130px;
			/max-width: 300px;/
			height: 25px;
			}

			/deep/ .ant-descriptions-item-colon {
			color: #fff;
			width: 5.1vw;
			}
			.mdcEquipMon {
			color: #fff;
			}

			/deep/ .ant-descriptions-item-content {
			color: #fff;
			border: 1px solid #4bcfc8;
			padding: 0 10px;
			width: auto;
			min-width: 130px;
			/max-width: 300px;/
			height: 25px;
			}
			fieldset {
			border: 1px solid #16738d;
			padding: 17px;
			margin: 14px;
			}

			.mdcEquipMon {
			color: #fff;
			}
			fieldset legend {
			display: inline;
			width: 88px;
			}

			fieldset {
			border: 1px solid #16738d;
			padding: 17px;
			margin: 14px;
			}
			table tr td {
			text-align: left;
			color: #fff;
			}

			fieldset legend {
			display: inline;
			width: 88px;
			}
			table tr td input {
			border: 1px solid #a6eff9;
			}

			table tr td {
			text-align: left;
			color: #fff;
			}
			.ant-btn {
			padding: 0 10px;
			margin-left: 3px;
			color: #fff !important;
			background-color: #1191b0;
			border: none;
			}

			table tr td input {
			border: 1px solid #a6eff9;
			}
			.ant-form-item-control {
			line-height: 0px;
			}

			.ant-btn {
			padding: 0 10px;
			margin-left: 3px;
			color: #fff !important;
			background-color: #1191b0;
			border: none;
			}
			/** 主表单行间距 */
			.ant-form .ant-form-item {
			margin-bottom: 10px;
			}

			.ant-form-item-control {
			line-height: 0px;
			}
			/** Tab页面行间距 */
			.ant-tabs-content .ant-form-item {
			margin-bottom: 0px;
			}

			/** 主表单行间距 */
			.ant-form .ant-form-item {
			margin-bottom: 10px;
			}
			/deep/ .ant-descriptions-item-label {
			width: 6.7vw;
			text-align: right;
			margin-right: 10px;
			}

			/** Tab页面行间距 */
			.ant-tabs-content .ant-form-item {
			margin-bottom: 0px;
			}
			/deep/ .operationData .ant-descriptions-item-content {
			width: 130px;
			overflow: hidden;
			}

			/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;
			}
			.description-item-class {
			overflow: hidden;
			white-space: nowrap;
			text-overflow: ellipsis;
			}
			</style>