diff --git a/src/pages/modules/homepage/one.vue b/src/pages/modules/homepage/one.vue
index 2fd4a58..533a60e 100644
--- a/src/pages/modules/homepage/one.vue
+++ b/src/pages/modules/homepage/one.vue
@@ -75,6 +75,24 @@
+
@@ -92,7 +110,9 @@ export default {
myCharts01: '',
myCharts02: '',
myCharts03: '',
- myCharts04: ''
+ myCharts04: '',
+ myCharts05: '',
+ myCharts06: ''
}
},
mounted () {
@@ -100,6 +120,8 @@ export default {
this.setEchart02()
this.setEchart03()
this.setEchart04()
+ this.setEchart05()
+ this.setEchart06()
},
methods: {
setEchart03 () {
@@ -393,6 +415,297 @@ export default {
})
}
},
+ setEchart05 () {
+ let date = []
+ let data1 = []
+ this.arrL2.map(e => {
+ date.push(e.date)
+ data1.push(e.elbow_qty)
+ })
+ let option = {
+ grid: {
+ top: 50,
+ left: 0,
+ right: 0,
+ bottom: 0,
+ containLabel: true
+ },
+ legend: {
+ icon: 'rect',
+ textStyle: {
+ color: '#fff',
+ fontSize: 14,
+ lineHeight: 14
+ },
+ itemGap: 30.86,
+ itemWidth: 14.16,
+ itemHeight: 7.38,
+ data: [{name: '产量(kg)', itemStyle: {color: '#0E90FD'}}]
+ },
+ xAxis: {
+ type: 'category',
+ axisTick: {
+ show: false
+ },
+ axisLine: {
+ show: true,
+ lineStyle: {
+ width: 2,
+ color: '#8FABBF'
+ }
+ },
+ axisLabel: {
+ interval: 0,
+ textStyle: {
+ color: '#8FABBF',
+ fontSize: 16
+ },
+ rotate: 50
+ },
+ data: date
+ },
+ yAxis: {
+ type: 'value',
+ axisLine: {
+ show: false
+ },
+ splitNumber: 2,
+ axisTick: {
+ show: false
+ },
+ axisLabel: {
+ textStyle: {
+ color: '#8FABBF',
+ fontSize: 14
+ }
+ },
+ splitLine: {
+ show: true,
+ lineStyle: {
+ type: [8, 4],
+ dashOffset: 4,
+ color: '#8FABBF'
+ }
+ }
+ },
+ series: [
+ {
+ name: '产量(kg)',
+ type: 'bar',
+ barWidth: '8',
+ itemStyle: {
+ normal: {
+ color: new this.$echarts.graphic.LinearGradient(0, 0, 0, 1, [
+ {
+ offset: 1,
+ color: 'rgba(96,112,128,0.10)',
+ opacity: 1
+ },
+ {
+ offset: 0,
+ color: '#0E90FD',
+ opacity: 0.1
+ }
+ ])
+ }
+ },
+ data: data1
+ }
+ ]
+ }
+ let echart = document.getElementById('echart_d05')
+ if (this.myCharts05 !== '') {
+ this.myCharts05.dispose()
+ }
+ if (echart !== null) {
+ this.myCharts05 = this.$echarts.init(echart)
+ this.myCharts05.setOption(option)
+ window.addEventListener('resize', () => {
+ this.myCharts05.resize()
+ })
+ }
+ },
+ setEchart06 () {
+ let data1 = []
+ let data2 = []
+ let data3 = []
+ let data4 = []
+ let device = []
+ this.echartData1.map(e => {
+ data1.push(e.data1)
+ data2.push(e.data2)
+ data3.push(e.data3)
+ data4.push(e.data4)
+ device.push(e.device)
+ })
+ let option = {
+ grid: {
+ top: 50,
+ left: 0,
+ right: 0,
+ bottom: 0,
+ containLabel: true
+ },
+ legend: {
+ icon: 'rect',
+ textStyle: {
+ color: '#fff',
+ fontSize: 14,
+ lineHeight: 14
+ },
+ itemGap: 30.86,
+ itemWidth: 14.16,
+ itemHeight: 7.38,
+ data: [{name: '正常运行', itemStyle: {color: '#33CCCC'}}, {name: '故障', itemStyle: {color: '#EAAD24'}}, {name: '待机', itemStyle: {color: '#0E90FD'}}, {name: '关机', itemStyle: {color: '#c9c9c9'}}]
+ },
+ xAxis: {
+ type: 'category',
+ axisTick: {
+ show: false
+ },
+ axisLine: {
+ show: true,
+ lineStyle: {
+ width: 2,
+ color: '#8FABBF'
+ }
+ },
+ axisLabel: {
+ interval: 0,
+ textStyle: {
+ color: '#8FABBF',
+ fontSize: 16
+ }
+ },
+ data: device
+ },
+ yAxis: {
+ type: 'value',
+ axisLine: {
+ show: false
+ },
+ splitNumber: 2,
+ axisTick: {
+ show: false
+ },
+ axisLabel: {
+ textStyle: {
+ color: '#8FABBF',
+ fontSize: 14
+ }
+ },
+ splitLine: {
+ show: true,
+ lineStyle: {
+ type: [8, 4],
+ dashOffset: 4,
+ color: '#8FABBF'
+ }
+ }
+ },
+ series: [
+ {
+ name: '正常运行',
+ type: 'bar',
+ barWidth: '8',
+ itemStyle: {
+ normal: {
+ color: new this.$echarts.graphic.LinearGradient(0, 0, 0, 1, [
+ {
+ offset: 0,
+ color: '#33CCCC',
+ opacity: 1
+ },
+ {
+ offset: 1,
+ color: 'rgba(31,89,89,0.25)',
+ opacity: 0.25
+ }
+ ])
+ }
+ },
+ data: data1
+ },
+ {
+ name: '故障',
+ type: 'bar',
+ barWidth: '8',
+ itemStyle: {
+ normal: {
+ color: new this.$echarts.graphic.LinearGradient(0, 0, 0, 1, [
+ {
+ offset: 0,
+ color: '#B68845',
+ opacity: 1
+ },
+ {
+ offset: 1,
+ color: 'rgba(134,98,45,0.25)',
+ opacity: 0.25
+ }
+ ])
+ }
+ },
+ data: data2
+ },
+ {
+ name: '待机',
+ type: 'bar',
+ barWidth: '8',
+ itemStyle: {
+ normal: {
+ color: new this.$echarts.graphic.LinearGradient(0, 0, 0, 1, [
+ {
+ offset: 1,
+ color: 'rgba(96,112,128,0.10)',
+ opacity: 1
+ },
+ {
+ offset: 0,
+ color: '#0E90FD',
+ opacity: 0.1
+ }
+ ])
+ }
+ },
+ data: data3
+ },
+ {
+ name: '关机',
+ type: 'bar',
+ barWidth: '8',
+ itemStyle: {
+ normal: {
+ color: new this.$echarts.graphic.LinearGradient(0, 0, 0, 1, [
+ {
+ offset: 0,
+ color: '#c9c9c9',
+ opacity: 1
+ },
+ {
+ offset: 1,
+ color: 'rgba(148,145,145,0.25)',
+ opacity: 0.25
+ }
+ ])
+ }
+ },
+ data: data4
+ }
+ ]
+ }
+ let echart = document.getElementById('echart_06')
+ // if (this.myCharts06 !== '') {
+ // this.myCharts06.dispose()
+ // }
+ if (echart !== null) {
+ this.myCharts06 = this.$echarts.init(echart)
+ this.myCharts06.setOption(option)
+ window.addEventListener('resize', () => {
+ this.myCharts06.resize()
+ })
+ }
+ },
setEchart10 () {
let total = [100, 200, 120, 133, 80, 155, 250]
let names = [10, 20, 30, 40, 50, 60, 70]
@@ -712,9 +1025,10 @@ export default {
flex-direction row
.box2
clear both
- _wh(100%, 38%)
+ _wh(100%, 37%)
_fj()
flex-direction row
+ margin-bottom 1%
.item_title
_font(46px, 100%, #fff,,,)
display inline-block