yituo/vue_mdc_yituo.git

			@@ -30,7 +30,7 @@
			</div>
			<div class="workshop-bg">
			<div class="navigate-container" style="top:0;left: 5%;">
			<div @click="navigateTo(item)" v-for="item in productionLineList" :key="item.id"
			<div @click="navigateToSubWorkshopSignage(item)" v-for="item in productionLineList" :key="item.id"
			class="navigate-item">
			<template v-if="item.productionOrder<5">
			<div :style="{backgroundColor:productionLineBackgroundColorList[item.productionOrder%4]}"
			@@ -45,7 +45,7 @@
			</div>
			</div>
			<div class="navigate-container" style="bottom:0;right: 5%;">
			<div @click="navigateTo(item)" v-for="item in productionLineList" :key="item.id"
			<div @click="navigateToSubWorkshopSignage(item)" v-for="item in productionLineList" :key="item.id"
			class="navigate-item">
			<template v-if="item.productionOrder>=5">
			<div :style="{backgroundColor:productionLineBackgroundColorList[item.productionOrder%4]}"
			@@ -61,7 +61,7 @@
			</div>
			</div>
			<div class="switch-container">
			<div @click="activeIndex=index" class="switch-item" v-for="(item,index) in switchList" :key="index"
			<div class="switch-item" v-for="(item,index) in switchList" :key="index" @click="navigateToOthers(item,index)"
			:style="{backgroundColor:activeIndex===index?'#848284':'#6B6D6B',color:activeIndex==index?'#27A2DB':'#000'}">
			{{item.label}}
			</div>
			@@ -113,29 +113,46 @@
			switchList: [
			{
			label: 'MES',
			index: 0
			index: 0,
			isNavigateToWeb: true,
			webUrl: 'http://172.16.52.71:8081',
			batPath: ''
			},
			{
			label: '刀具管理',
			index: 1
			index: 1,
			isNavigateToWeb: true,
			webUrl: 'http://172.16.52.99/tms',
			batPath: ''
			},
			{
			label: '故障',
			index: 2
			label: '设备诊断',
			index: 2,
			isNavigateToWeb: false,
			webUrl: '',
			batPath: 'yituoSBZD://'
			},
			{
			label: '3D',
			index: 3
			label: '三维监控',
			index: 3,
			isNavigateToWeb: false,
			webUrl: '',
			batPath: 'yituoVR://'
			},
			{
			label: '安防',
			index: 4
			index: 4,
			isNavigateToWeb: false,
			webUrl: '',
			batPath: 'yituoAF://'
			}
			],
			rightColChart1: '',
			rightColChart2: '',
			rightColChart3: '',
			rightColChart2And3Data: '',
			rightColChart2CarouselTime: null,
			rightColChart3CarouselTime: null,
			rightColChart4: '',
			rightColChart4Data: '',
			rightColChart4CarouselTime: null
			@@ -149,6 +166,8 @@
			},
			beforeDestroy() {
			window.removeEventListener('resize', this.handleWindowResize)
			if (this.rightColChart2CarouselTime) clearInterval(this.rightColChart2CarouselTime)
			if (this.rightColChart3CarouselTime) clearInterval(this.rightColChart3CarouselTime)
			if (this.rightColChart4CarouselTime) clearInterval(this.rightColChart4CarouselTime)
			},
			methods: {
			@@ -1250,6 +1269,95 @@
			]
			const xAxisData = []
			const seriesData = []
			const colorList = [
			new echarts.graphic.LinearGradient(
			0, 0, 1, 0,
			[

			{ offset: 0, color: '#4A7DBD' },
			{ offset: 1, color: '#31557B' }
			]
			),
			new echarts.graphic.LinearGradient(
			0, 0, 1, 0,
			[
			{ offset: 0, color: '#BD4D4A' },
			{ offset: 1, color: '#7B3031' }
			]
			),
			new echarts.graphic.LinearGradient(
			0, 0, 1, 0,
			[
			{ offset: 0, color: '#94AF52' },
			{ offset: 1, color: '#637A39' }
			]
			),
			new echarts.graphic.LinearGradient(
			0, 0, 1, 0,
			[
			{ offset: 0, color: '#7B61A4' },
			{ offset: 1, color: '#52416B' }
			]
			),
			new echarts.graphic.LinearGradient(
			0, 0, 1, 0,
			[
			{ offset: 0, color: '#4AAAC6' },
			{ offset: 1, color: '#29697B' }
			]
			),
			new echarts.graphic.LinearGradient(
			0, 0, 1, 0,
			[
			{ offset: 0, color: '#F79642' },
			{ offset: 1, color: '#9C5D29' }
			]
			),
			new echarts.graphic.LinearGradient(
			0, 0, 1, 0,
			[

			{ offset: 0, color: '#4A7DBD' },
			{ offset: 1, color: '#31557B' }
			]
			),
			new echarts.graphic.LinearGradient(
			0, 0, 1, 0,
			[
			{ offset: 0, color: '#BD4D4A' },
			{ offset: 1, color: '#7B3031' }
			]
			),
			new echarts.graphic.LinearGradient(
			0, 0, 1, 0,
			[
			{ offset: 0, color: '#94AF52' },
			{ offset: 1, color: '#637A39' }
			]
			),
			new echarts.graphic.LinearGradient(
			0, 0, 1, 0,
			[
			{ offset: 0, color: '#7B61A4' },
			{ offset: 1, color: '#52416B' }
			]
			),
			new echarts.graphic.LinearGradient(
			0, 0, 1, 0,
			[
			{ offset: 0, color: '#4AAAC6' },
			{ offset: 1, color: '#29697B' }
			]
			),
			new echarts.graphic.LinearGradient(
			0, 0, 1, 0,
			[
			{ offset: 0, color: '#F79642' },
			{ offset: 1, color: '#9C5D29' }
			]
			)
			]

			this.rightColChart2And3Data.forEach(item => {
			xAxisData.push(item.equipmentName == null ? '' : item.equipmentName)
			seriesData.push({ value: item.openRate })
			@@ -1289,6 +1397,7 @@
			color: '#fff',
			// rotate: 45,
			margin: 15,
			interval: 0,
			fontSize: '55%',
			formatter(value) {
			const data = xAxisData
			@@ -1347,94 +1456,6 @@
			itemStyle: {
			barBorderRadius: '',
			color: function(params) {
			const colorList = [
			new echarts.graphic.LinearGradient(
			0, 0, 1, 0,
			[

			{ offset: 0, color: '#4A7DBD' },
			{ offset: 1, color: '#31557B' }
			]
			),
			new echarts.graphic.LinearGradient(
			0, 0, 1, 0,
			[
			{ offset: 0, color: '#BD4D4A' },
			{ offset: 1, color: '#7B3031' }
			]
			),
			new echarts.graphic.LinearGradient(
			0, 0, 1, 0,
			[
			{ offset: 0, color: '#94AF52' },
			{ offset: 1, color: '#637A39' }
			]
			),
			new echarts.graphic.LinearGradient(
			0, 0, 1, 0,
			[
			{ offset: 0, color: '#7B61A4' },
			{ offset: 1, color: '#52416B' }
			]
			),
			new echarts.graphic.LinearGradient(
			0, 0, 1, 0,
			[
			{ offset: 0, color: '#4AAAC6' },
			{ offset: 1, color: '#29697B' }
			]
			),
			new echarts.graphic.LinearGradient(
			0, 0, 1, 0,
			[
			{ offset: 0, color: '#F79642' },
			{ offset: 1, color: '#9C5D29' }
			]
			),
			new echarts.graphic.LinearGradient(
			0, 0, 1, 0,
			[

			{ offset: 0, color: '#4A7DBD' },
			{ offset: 1, color: '#31557B' }
			]
			),
			new echarts.graphic.LinearGradient(
			0, 0, 1, 0,
			[
			{ offset: 0, color: '#BD4D4A' },
			{ offset: 1, color: '#7B3031' }
			]
			),
			new echarts.graphic.LinearGradient(
			0, 0, 1, 0,
			[
			{ offset: 0, color: '#94AF52' },
			{ offset: 1, color: '#637A39' }
			]
			),
			new echarts.graphic.LinearGradient(
			0, 0, 1, 0,
			[
			{ offset: 0, color: '#7B61A4' },
			{ offset: 1, color: '#52416B' }
			]
			),
			new echarts.graphic.LinearGradient(
			0, 0, 1, 0,
			[
			{ offset: 0, color: '#4AAAC6' },
			{ offset: 1, color: '#29697B' }
			]
			),
			new echarts.graphic.LinearGradient(
			0, 0, 1, 0,
			[
			{ offset: 0, color: '#F79642' },
			{ offset: 1, color: '#9C5D29' }
			]
			)
			]
			return colorList[params.dataIndex]
			// build a color map as your need.

			@@ -1447,11 +1468,27 @@
			}
			}
			}
			],
			dataZoom: [
			{
			show: false,
			startValue: 0, // 从头开始。
			endValue: 9 // 一次性展示几个
			}
			]
			}
			option.xAxis.data = xAxisData
			option.series[0].data = seriesData
			this.rightColChart2.setOption(option, true)

			this.rightColChart2CarouselTime = setInterval(() => {
			xAxisData.push(xAxisData.shift())
			seriesData.push(seriesData.shift())
			colorList.push(colorList.shift())
			this.$nextTick(() => {
			this.rightColChart2.setOption(option, true)
			})
			}, 3000)
			},

			/* 绘制右侧第三个图表 */
			@@ -1530,6 +1567,94 @@
			]
			const xAxisData = []
			const seriesData = []
			const colorList = [
			new echarts.graphic.LinearGradient(
			0, 0, 1, 0,
			[

			{ offset: 0, color: '#4A7DBD' },
			{ offset: 1, color: '#31557B' }
			]
			),
			new echarts.graphic.LinearGradient(
			0, 0, 1, 0,
			[
			{ offset: 0, color: '#BD4D4A' },
			{ offset: 1, color: '#7B3031' }
			]
			),
			new echarts.graphic.LinearGradient(
			0, 0, 1, 0,
			[
			{ offset: 0, color: '#94AF52' },
			{ offset: 1, color: '#637A39' }
			]
			),
			new echarts.graphic.LinearGradient(
			0, 0, 1, 0,
			[
			{ offset: 0, color: '#7B61A4' },
			{ offset: 1, color: '#52416B' }
			]
			),
			new echarts.graphic.LinearGradient(
			0, 0, 1, 0,
			[
			{ offset: 0, color: '#4AAAC6' },
			{ offset: 1, color: '#29697B' }
			]
			),
			new echarts.graphic.LinearGradient(
			0, 0, 1, 0,
			[
			{ offset: 0, color: '#F79642' },
			{ offset: 1, color: '#9C5D29' }
			]
			),
			new echarts.graphic.LinearGradient(
			0, 0, 1, 0,
			[

			{ offset: 0, color: '#4A7DBD' },
			{ offset: 1, color: '#31557B' }
			]
			),
			new echarts.graphic.LinearGradient(
			0, 0, 1, 0,
			[
			{ offset: 0, color: '#BD4D4A' },
			{ offset: 1, color: '#7B3031' }
			]
			),
			new echarts.graphic.LinearGradient(
			0, 0, 1, 0,
			[
			{ offset: 0, color: '#94AF52' },
			{ offset: 1, color: '#637A39' }
			]
			),
			new echarts.graphic.LinearGradient(
			0, 0, 1, 0,
			[
			{ offset: 0, color: '#7B61A4' },
			{ offset: 1, color: '#52416B' }
			]
			),
			new echarts.graphic.LinearGradient(
			0, 0, 1, 0,
			[
			{ offset: 0, color: '#4AAAC6' },
			{ offset: 1, color: '#29697B' }
			]
			),
			new echarts.graphic.LinearGradient(
			0, 0, 1, 0,
			[
			{ offset: 0, color: '#F79642' },
			{ offset: 1, color: '#9C5D29' }
			]
			)
			]
			this.rightColChart2And3Data.forEach(item => {
			xAxisData.push(item.equipmentName == null ? '' : item.equipmentName)
			seriesData.push({ value: item.utilizationRate })
			@@ -1568,6 +1693,7 @@
			axisLabel: {
			color: '#fff',
			// rotate: 45,
			interval: 0,
			margin: 15,
			fontSize: '55%',
			formatter(value) {
			@@ -1603,7 +1729,6 @@
			show: false
			}
			},

			series: [
			{
			name: '利用率',
			@@ -1628,94 +1753,6 @@
			itemStyle: {
			barBorderRadius: '',
			color: function(params) {
			const colorList = [
			new echarts.graphic.LinearGradient(
			0, 0, 1, 0,
			[

			{ offset: 0, color: '#4A7DBD' },
			{ offset: 1, color: '#31557B' }
			]
			),
			new echarts.graphic.LinearGradient(
			0, 0, 1, 0,
			[
			{ offset: 0, color: '#BD4D4A' },
			{ offset: 1, color: '#7B3031' }
			]
			),
			new echarts.graphic.LinearGradient(
			0, 0, 1, 0,
			[
			{ offset: 0, color: '#94AF52' },
			{ offset: 1, color: '#637A39' }
			]
			),
			new echarts.graphic.LinearGradient(
			0, 0, 1, 0,
			[
			{ offset: 0, color: '#7B61A4' },
			{ offset: 1, color: '#52416B' }
			]
			),
			new echarts.graphic.LinearGradient(
			0, 0, 1, 0,
			[
			{ offset: 0, color: '#4AAAC6' },
			{ offset: 1, color: '#29697B' }
			]
			),
			new echarts.graphic.LinearGradient(
			0, 0, 1, 0,
			[
			{ offset: 0, color: '#F79642' },
			{ offset: 1, color: '#9C5D29' }
			]
			),
			new echarts.graphic.LinearGradient(
			0, 0, 1, 0,
			[

			{ offset: 0, color: '#4A7DBD' },
			{ offset: 1, color: '#31557B' }
			]
			),
			new echarts.graphic.LinearGradient(
			0, 0, 1, 0,
			[
			{ offset: 0, color: '#BD4D4A' },
			{ offset: 1, color: '#7B3031' }
			]
			),
			new echarts.graphic.LinearGradient(
			0, 0, 1, 0,
			[
			{ offset: 0, color: '#94AF52' },
			{ offset: 1, color: '#637A39' }
			]
			),
			new echarts.graphic.LinearGradient(
			0, 0, 1, 0,
			[
			{ offset: 0, color: '#7B61A4' },
			{ offset: 1, color: '#52416B' }
			]
			),
			new echarts.graphic.LinearGradient(
			0, 0, 1, 0,
			[
			{ offset: 0, color: '#4AAAC6' },
			{ offset: 1, color: '#29697B' }
			]
			),
			new echarts.graphic.LinearGradient(
			0, 0, 1, 0,
			[
			{ offset: 0, color: '#F79642' },
			{ offset: 1, color: '#9C5D29' }
			]
			)
			]
			return colorList[params.dataIndex]
			// build a color map as your need.

			@@ -1728,11 +1765,27 @@
			}
			}
			}
			],
			dataZoom: [
			{
			show: false,
			startValue: 0, // 从头开始。
			endValue: 9 // 一次性展示几个
			}
			]
			}
			option.xAxis.data = xAxisData
			option.series[0].data = seriesData
			this.rightColChart3.setOption(option, true)

			this.rightColChart3CarouselTime = setInterval(() => {
			xAxisData.push(xAxisData.shift())
			seriesData.push(seriesData.shift())
			colorList.push(colorList.shift())
			this.$nextTick(() => {
			this.rightColChart3.setOption(option, true)
			})
			}, 3000)
			},

			/* 绘制右侧第四个图表 */
			@@ -2110,7 +2163,7 @@
			return s
			},

			navigateTo(record) {
			navigateToSubWorkshopSignage(record) {
			const url = this.$router.resolve({
			path: '/SubControlWorkshopSignage',
			query: {
			@@ -2122,6 +2175,15 @@
			window.open(url, '_blank')
			},

			navigateToOthers(record, index) {
			this.activeIndex = index
			if (record.isNavigateToWeb && record.webUrl) {
			window.open(record.webUrl, '_blank')
			} else {
			window.location.href = record.batPath
			}
			},

			/**
			* 窗口尺寸变化时触发
			* 调整图表尺寸以适应分辨率