@@ -62,7 +62,32 @@ export default { | |||||
top: "15%", | top: "15%", | ||||
containLabel: true, | containLabel: true, | ||||
}, | }, | ||||
tooltip: {}, | |||||
tooltip: { | |||||
trigger: "axis", | |||||
axisPointer: { | |||||
// type: "cross", | |||||
crossStyle: { | |||||
color: "rgba(237,237,237,0.5)", | |||||
}, | |||||
}, | |||||
extraCssText: 'box-shadow: 0px 4px 8px 0px rgba(0, 0, 0, 0.38); border- radius: 4px;opacity: 0.6;backdrop- filter: blur(6px);', | |||||
backgroundColor: '#001829', | |||||
borderColor: '#001829', | |||||
formatter: params => { | |||||
console.log('params', params) | |||||
var res = `<span style='color:rgba(255,255,255,0.85)'>${params[0].axisValueLabel}</span>`; | |||||
for (var i = 0, l = params.length; i < l; i++) { | |||||
let color = Object.prototype.toString.call(params[i].color) == "[object String]" ? params[i].color : params[i].color.colorStops ? params[i].color.colorStops[0].color : '' | |||||
// console.log(item.color, color); | |||||
res += | |||||
"<br/>" + | |||||
`<span style='display:inline-block;margin-right:4px;width:10px;height:10px;background-color:${color}'></span>` + | |||||
`<span style='display:inline-block;width:150px;color:rgba(255,255,255,.85);font-size:14px;'>${params[i].seriesName}</span>` + | |||||
`<span style='color:rgba(255,255,255,0.65);font-size:14px;'>${params[i].value ? params[i].value + '片' : 0 + '片'}</span>`; | |||||
} | |||||
return res; | |||||
}, | |||||
}, | |||||
xAxis: { | xAxis: { | ||||
axisTick: { | axisTick: { | ||||
show: false, | show: false, | ||||
@@ -188,13 +213,13 @@ export default { | |||||
this.canvasReset() | this.canvasReset() | ||||
}, | }, | ||||
isFullscreen(val) { | isFullscreen(val) { | ||||
this.actualOptions.series.map((item) => { | |||||
this.options.series.map((item) => { | |||||
item.barWidth = val ? 18 : 12; | item.barWidth = val ? 18 : 12; | ||||
}); | }); | ||||
this.actualOptions.xAxis.axisLabel.fontSize = val ? 18 : 12; | |||||
this.actualOptions.yAxis.axisLabel.fontSize = val ? 18 : 12; | |||||
this.actualOptions.yAxis.nameTextStyle.fontSize = val ? 18 : 12; | |||||
this.initChart(this.actualOptions); | |||||
this.options.xAxis.axisLabel.fontSize = val ? 18 : 12; | |||||
this.options.yAxis.axisLabel.fontSize = val ? 18 : 12; | |||||
this.options.yAxis.nameTextStyle.fontSize = val ? 18 : 12; | |||||
this.initChart(this.options); | |||||
// this.actualOptions.series.map((item) => { | // this.actualOptions.series.map((item) => { | ||||
// item.barWidth = val ? 18 : 12; | // item.barWidth = val ? 18 : 12; | ||||
// }); | // }); | ||||
@@ -209,14 +234,14 @@ export default { | |||||
this.initChart(this.options); | this.initChart(this.options); | ||||
return; | return; | ||||
} | } | ||||
const actualOptions = JSON.parse(JSON.stringify(this.options)); | |||||
console.log('actualOptions', this.options) | |||||
actualOptions.series[0].data = val[0].data; | |||||
actualOptions.series[0].name = val[0].name; | |||||
actualOptions.series[1].data = val?.[1]?.data || []; | |||||
actualOptions.series[1].name = val?.[1]?.name || ""; | |||||
this.actualOptions = actualOptions; | |||||
this.initChart(actualOptions); | |||||
// const actualOptions = JSON.parse(JSON.stringify(this.options)); | |||||
// console.log('actualOptions', this.options) | |||||
this.options.series[0].data = val[0].data; | |||||
this.options.series[0].name = val[0].name; | |||||
this.options.series[1].data = val?.[1]?.data || []; | |||||
this.options.series[1].name = val?.[1]?.name || ""; | |||||
// this.actualOptions = actualOptions; | |||||
this.initChart(this.options); | |||||
}, | }, | ||||
}, | }, | ||||
mounted() { | mounted() { | ||||
@@ -225,7 +250,7 @@ export default { | |||||
this.isFullscreen = screenfull.isFullscreen; | this.isFullscreen = screenfull.isFullscreen; | ||||
}); | }); | ||||
} | } | ||||
this.actualOptions = this.options | |||||
// this.actualOptions = this.options | |||||
this.canvasReset(); | this.canvasReset(); | ||||
window.addEventListener("resize", this.canvasReset); | window.addEventListener("resize", this.canvasReset); | ||||
}, | }, | ||||
@@ -249,7 +274,7 @@ export default { | |||||
this.chart.dispose(); | this.chart.dispose(); | ||||
} | } | ||||
this.chart = echarts.init(this.$refs.chart); | this.chart = echarts.init(this.$refs.chart); | ||||
this.chart.setOption(this.actualOptions); | |||||
this.chart.setOption(this.options); | |||||
}, | }, | ||||
}, | }, | ||||
}; | }; | ||||
@@ -1,7 +1,7 @@ | |||||
<!-- | <!-- | ||||
* @Author: zhp | * @Author: zhp | ||||
* @Date: 2024-05-23 15:49:14 | * @Date: 2024-05-23 15:49:14 | ||||
* @LastEditTime: 2024-06-04 08:54:10 | |||||
* @LastEditTime: 2024-07-03 14:08:52 | |||||
* @LastEditors: zhp | * @LastEditors: zhp | ||||
* @Description: | * @Description: | ||||
--> | --> | ||||
@@ -63,7 +63,32 @@ export default { | |||||
top: "15%", | top: "15%", | ||||
containLabel: true, | containLabel: true, | ||||
}, | }, | ||||
tooltip: {}, | |||||
tooltip: { | |||||
trigger: "axis", | |||||
axisPointer: { | |||||
// type: "cross", | |||||
crossStyle: { | |||||
color: "rgba(237,237,237,0.5)", | |||||
}, | |||||
}, | |||||
extraCssText: 'box-shadow: 0px 4px 8px 0px rgba(0, 0, 0, 0.38); border- radius: 4px;opacity: 0.6;backdrop- filter: blur(6px);', | |||||
backgroundColor: '#001829', | |||||
borderColor: '#001829', | |||||
formatter: params => { | |||||
console.log('params', params) | |||||
var res = `<span style='color:rgba(255,255,255,0.85)'>${params[0].axisValueLabel}</span>`; | |||||
for (var i = 0, l = params.length; i < l; i++) { | |||||
let color = Object.prototype.toString.call(params[i].color) == "[object String]" ? params[i].color : params[i].color.colorStops ? params[i].color.colorStops[0].color : '' | |||||
// console.log(item.color, color); | |||||
res += | |||||
"<br/>" + | |||||
`<span style='display:inline-block;margin-right:4px;width:10px;height:10px;background-color:${color}'></span>` + | |||||
`<span style='display:inline-block;width:150px;color:rgba(255,255,255,.85);font-size:14px;'>${params[i].seriesName}</span>` + | |||||
`<span style='color:rgba(255,255,255,0.65);font-size:14px;'>${params[i].value ? params[i].value + '片' : 0 + '片'}</span>`; | |||||
} | |||||
return res; | |||||
}, | |||||
}, | |||||
xAxis: { | xAxis: { | ||||
axisTick: { | axisTick: { | ||||
show: false, | show: false, | ||||
@@ -189,13 +214,13 @@ export default { | |||||
this.canvasReset() | this.canvasReset() | ||||
}, | }, | ||||
isFullscreen(val) { | isFullscreen(val) { | ||||
this.actualOptions.series.map((item) => { | |||||
this.options.series.map((item) => { | |||||
item.barWidth = val ? 18 : 12; | item.barWidth = val ? 18 : 12; | ||||
}); | }); | ||||
this.actualOptions.xAxis.axisLabel.fontSize = val ? 18 : 12; | |||||
this.actualOptions.yAxis.axisLabel.fontSize = val ? 18 : 12; | |||||
this.actualOptions.yAxis.nameTextStyle.fontSize = val ? 18 : 12; | |||||
this.initChart(this.actualOptions); | |||||
this.options.xAxis.axisLabel.fontSize = val ? 18 : 12; | |||||
this.options.yAxis.axisLabel.fontSize = val ? 18 : 12; | |||||
this.options.yAxis.nameTextStyle.fontSize = val ? 18 : 12; | |||||
this.initChart(this.options); | |||||
// this.actualOptions.series.map((item) => { | // this.actualOptions.series.map((item) => { | ||||
// item.barWidth = val ? 18 : 12; | // item.barWidth = val ? 18 : 12; | ||||
// }); | // }); | ||||
@@ -210,14 +235,14 @@ export default { | |||||
this.initChart(this.options); | this.initChart(this.options); | ||||
return; | return; | ||||
} | } | ||||
const actualOptions = JSON.parse(JSON.stringify(this.options)); | |||||
console.log('actualOptions', this.options) | |||||
actualOptions.series[0].data = val[0].data; | |||||
actualOptions.series[0].name = val[0].name; | |||||
actualOptions.series[1].data = val[1].data; | |||||
actualOptions.series[1].name = val[1].name; | |||||
this.actualOptions = actualOptions; | |||||
this.initChart(actualOptions); | |||||
// const actualOptions = JSON.parse(JSON.stringify(this.options)); | |||||
// console.log('actualOptions', this.options) | |||||
this.options.series[0].data = val[0].data; | |||||
this.options.series[0].name = val[0].name; | |||||
this.options.series[1].data = val[1].data; | |||||
this.options.series[1].name = val[1].name; | |||||
// this.actualOptions = actualOptions; | |||||
this.initChart(this.options); | |||||
}, | }, | ||||
}, | }, | ||||
mounted() { | mounted() { | ||||
@@ -226,7 +251,7 @@ export default { | |||||
this.isFullscreen = screenfull.isFullscreen; | this.isFullscreen = screenfull.isFullscreen; | ||||
}); | }); | ||||
} | } | ||||
this.actualOptions = this.options | |||||
// this.actualOptions = this.options | |||||
this.canvasReset(); | this.canvasReset(); | ||||
window.addEventListener("resize", this.canvasReset); | window.addEventListener("resize", this.canvasReset); | ||||
}, | }, | ||||
@@ -250,7 +275,7 @@ export default { | |||||
this.chart.dispose(); | this.chart.dispose(); | ||||
} | } | ||||
this.chart = echarts.init(this.$refs.ftoChart); | this.chart = echarts.init(this.$refs.ftoChart); | ||||
this.chart.setOption(this.actualOptions); | |||||
this.chart.setOption(this.options); | |||||
}, | }, | ||||
}, | }, | ||||
}; | }; | ||||
@@ -1,7 +1,7 @@ | |||||
<!-- | <!-- | ||||
* @Author: zhp | * @Author: zhp | ||||
* @Date: 2024-05-07 13:22:43 | * @Date: 2024-05-07 13:22:43 | ||||
* @LastEditTime: 2024-06-17 09:22:17 | |||||
* @LastEditTime: 2024-07-03 14:08:44 | |||||
* @LastEditors: zhp | * @LastEditors: zhp | ||||
* @Description: | * @Description: | ||||
--> | --> | ||||
@@ -62,7 +62,32 @@ export default { | |||||
top: "15%", | top: "15%", | ||||
containLabel: true, | containLabel: true, | ||||
}, | }, | ||||
tooltip: {}, | |||||
tooltip: { | |||||
trigger: "axis", | |||||
axisPointer: { | |||||
// type: "cross", | |||||
crossStyle: { | |||||
color: "rgba(237,237,237,0.5)", | |||||
}, | |||||
}, | |||||
extraCssText: 'box-shadow: 0px 4px 8px 0px rgba(0, 0, 0, 0.38); border- radius: 4px;opacity: 0.6;backdrop- filter: blur(6px);', | |||||
backgroundColor: '#001829', | |||||
borderColor: '#001829', | |||||
formatter: params => { | |||||
console.log('params', params) | |||||
var res = `<span style='color:rgba(255,255,255,0.85)'>${params[0].axisValueLabel}</span>`; | |||||
for (var i = 0, l = params.length; i < l; i++) { | |||||
let color = Object.prototype.toString.call(params[i].color) == "[object String]" ? params[i].color : params[i].color.colorStops ? params[i].color.colorStops[0].color : '' | |||||
// console.log(item.color, color); | |||||
res += | |||||
"<br/>" + | |||||
`<span style='display:inline-block;margin-right:4px;width:10px;height:10px;background-color:${color}'></span>` + | |||||
`<span style='display:inline-block;width:150px;color:rgba(255,255,255,.85);font-size:14px;'>${params[i].seriesName}</span>` + | |||||
`<span style='color:rgba(255,255,255,0.65);font-size:14px;'>${params[i].value ? params[i].value + '片' : 0 + '片'}</span>`; | |||||
} | |||||
return res; | |||||
}, | |||||
}, | |||||
xAxis: { | xAxis: { | ||||
axisTick: { | axisTick: { | ||||
show: false, | show: false, | ||||
@@ -241,7 +266,7 @@ export default { | |||||
// this.actualOptions.xAxis.axisLabel.fontSize = val ? 18 : 12; | // this.actualOptions.xAxis.axisLabel.fontSize = val ? 18 : 12; | ||||
// this.actualOptions.yAxis.axisLabel.fontSize = val ? 18 : 12; | // this.actualOptions.yAxis.axisLabel.fontSize = val ? 18 : 12; | ||||
// this.actualOptions.yAxis.nameTextStyle.fontSize = val ? 18 : 12; | // this.actualOptions.yAxis.nameTextStyle.fontSize = val ? 18 : 12; | ||||
this.initChart(this.actualOptions) | |||||
this.initChart(this.options) | |||||
this.canvasReset() | this.canvasReset() | ||||
}, | }, | ||||
series(val) { | series(val) { | ||||
@@ -252,14 +277,14 @@ export default { | |||||
// console.log('val', val) | // console.log('val', val) | ||||
const actualOptions = JSON.parse(JSON.stringify(this.options)) | const actualOptions = JSON.parse(JSON.stringify(this.options)) | ||||
console.log(actualOptions) | console.log(actualOptions) | ||||
actualOptions.series[0].data = val[0].data; | |||||
actualOptions.series[0].name = val[0].name; | |||||
actualOptions.series[1].data = val?.[1]?.data; | |||||
actualOptions.series[1].name = val?.[1]?.name; | |||||
actualOptions.series[2].data = val?.[2]?.data || []; | |||||
actualOptions.series[2].name = val?.[2]?.name || ""; | |||||
this.options.series[0].data = val[0].data; | |||||
this.options.series[0].name = val[0].name; | |||||
this.options.series[1].data = val?.[1]?.data; | |||||
this.options.series[1].name = val?.[1]?.name; | |||||
this.options.series[2].data = val?.[2]?.data || []; | |||||
this.options.series[2].name = val?.[2]?.name || ""; | |||||
this.actualOptions = actualOptions; | this.actualOptions = actualOptions; | ||||
this.initChart(actualOptions); | |||||
this.initChart(this.options); | |||||
}, | }, | ||||
}, | }, | ||||
mounted() { | mounted() { | ||||
@@ -273,7 +298,7 @@ export default { | |||||
this.isFullscreen = screenfull.isFullscreen; | this.isFullscreen = screenfull.isFullscreen; | ||||
}); | }); | ||||
} | } | ||||
this.actualOptions = this.options | |||||
// this.actualOptions = this.options | |||||
this.canvasReset(); | this.canvasReset(); | ||||
window.addEventListener("resize", this.canvasReset); | window.addEventListener("resize", this.canvasReset); | ||||
}, | }, | ||||
@@ -296,7 +321,7 @@ export default { | |||||
this.chart.dispose(); | this.chart.dispose(); | ||||
} | } | ||||
this.chart = echarts.init(this.$refs.oeeChart); | this.chart = echarts.init(this.$refs.oeeChart); | ||||
this.chart.setOption(this.actualOptions); | |||||
this.chart.setOption(this.options); | |||||
}, | }, | ||||
}, | }, | ||||
}; | }; | ||||
@@ -1,7 +1,7 @@ | |||||
<!-- | <!-- | ||||
* @Author: zhp | * @Author: zhp | ||||
* @Date: 2024-05-23 15:50:44 | * @Date: 2024-05-23 15:50:44 | ||||
* @LastEditTime: 2024-06-17 09:23:39 | |||||
* @LastEditTime: 2024-07-03 14:08:12 | |||||
* @LastEditors: zhp | * @LastEditors: zhp | ||||
* @Description: | * @Description: | ||||
--> | --> | ||||
@@ -62,7 +62,32 @@ export default { | |||||
top: "15%", | top: "15%", | ||||
containLabel: true, | containLabel: true, | ||||
}, | }, | ||||
tooltip: {}, | |||||
tooltip: { | |||||
trigger: "axis", | |||||
axisPointer: { | |||||
// type: "cross", | |||||
crossStyle: { | |||||
color: "rgba(237,237,237,0.5)", | |||||
}, | |||||
}, | |||||
extraCssText: 'box-shadow: 0px 4px 8px 0px rgba(0, 0, 0, 0.38); border- radius: 4px;opacity: 0.6;backdrop- filter: blur(6px);', | |||||
backgroundColor: '#001829', | |||||
borderColor: '#001829', | |||||
formatter: params => { | |||||
console.log('params', params) | |||||
var res = `<span style='color:rgba(255,255,255,0.85)'>${params[0].axisValueLabel}</span>`; | |||||
for (var i = 0, l = params.length; i < l; i++) { | |||||
let color = Object.prototype.toString.call(params[i].color) == "[object String]" ? params[i].color : params[i].color.colorStops ? params[i].color.colorStops[0].color : '' | |||||
// console.log(item.color, color); | |||||
res += | |||||
"<br/>" + | |||||
`<span style='display:inline-block;margin-right:4px;width:10px;height:10px;background-color:${color}'></span>` + | |||||
`<span style='display:inline-block;width:150px;color:rgba(255,255,255,.85);font-size:14px;'>${params[i].seriesName}</span>` + | |||||
`<span style='color:rgba(255,255,255,0.65);font-size:14px;'>${params[i].value ? params[i].value + '片' : 0 + '片'}</span>`; | |||||
} | |||||
return res; | |||||
}, | |||||
}, | |||||
xAxis: { | xAxis: { | ||||
axisTick: { | axisTick: { | ||||
show: false, | show: false, | ||||
@@ -241,7 +266,7 @@ export default { | |||||
// this.actualOptions.xAxis.axisLabel.fontSize = val ? 18 : 12; | // this.actualOptions.xAxis.axisLabel.fontSize = val ? 18 : 12; | ||||
// this.actualOptions.yAxis.axisLabel.fontSize = val ? 18 : 12; | // this.actualOptions.yAxis.axisLabel.fontSize = val ? 18 : 12; | ||||
// this.actualOptions.yAxis.nameTextStyle.fontSize = val ? 18 : 12; | // this.actualOptions.yAxis.nameTextStyle.fontSize = val ? 18 : 12; | ||||
this.initChart(this.actualOptions) | |||||
this.initChart(this.options) | |||||
this.canvasReset() | this.canvasReset() | ||||
}, | }, | ||||
series(val) { | series(val) { | ||||
@@ -250,15 +275,15 @@ export default { | |||||
return; | return; | ||||
} | } | ||||
console.log(val) | console.log(val) | ||||
const actualOptions = JSON.parse(JSON.stringify(this.options)) | |||||
actualOptions.series[0].data = val[0].data; | |||||
actualOptions.series[0].name = val[0].name; | |||||
actualOptions.series[1].data = val?.[1]?.data || []; | |||||
actualOptions.series[1].name = val?.[1]?.name || ""; | |||||
actualOptions.series[2].data = val?.[2]?.data || []; | |||||
actualOptions.series[2].name = val?.[2]?.name || ""; | |||||
this.actualOptions = actualOptions; | |||||
this.initChart(actualOptions); | |||||
// const actualOptions = JSON.parse(JSON.stringify(this.options)) | |||||
this.options.series[0].data = val[0].data; | |||||
this.options.series[0].name = val[0].name; | |||||
this.options.series[1].data = val?.[1]?.data || []; | |||||
this.options.series[1].name = val?.[1]?.name || ""; | |||||
this.options.series[2].data = val?.[2]?.data || []; | |||||
this.options.series[2].name = val?.[2]?.name || ""; | |||||
// this.actualOptions = actualOptions; | |||||
this.initChart(this.options); | |||||
}, | }, | ||||
}, | }, | ||||
mounted() { | mounted() { | ||||
@@ -272,7 +297,7 @@ export default { | |||||
this.isFullscreen = screenfull.isFullscreen; | this.isFullscreen = screenfull.isFullscreen; | ||||
}); | }); | ||||
} | } | ||||
this.actualOptions = this.options | |||||
// this.actualOptions = this.options | |||||
this.canvasReset(); | this.canvasReset(); | ||||
window.addEventListener("resize", this.canvasReset); | window.addEventListener("resize", this.canvasReset); | ||||
}, | }, | ||||
@@ -295,7 +320,7 @@ export default { | |||||
this.chart.dispose(); | this.chart.dispose(); | ||||
} | } | ||||
this.chart = echarts.init(this.$refs.oeeChart); | this.chart = echarts.init(this.$refs.oeeChart); | ||||
this.chart.setOption(this.actualOptions); | |||||
this.chart.setOption(this.options); | |||||
}, | }, | ||||
}, | }, | ||||
}; | }; | ||||
@@ -318,6 +318,8 @@ export default { | |||||
.legend-item { | .legend-item { | ||||
margin-left: 15px; | margin-left: 15px; | ||||
display: flex; | display: flex; | ||||
font-size: 16px; | |||||
// font-weight: 600; | |||||
flex-direction: column; | flex-direction: column; | ||||
// align-items: center; | // align-items: center; | ||||
align-items: flex-start; | align-items: flex-start; | ||||
@@ -371,8 +373,6 @@ export default { | |||||
background: #003982; | background: #003982; | ||||
} | } | ||||
.legend-item__value { | .legend-item__value { | ||||
font-size: 24px; | |||||
font-weight: 600; | |||||
} | } | ||||
} | } | ||||
</style> | </style> | ||||
@@ -80,7 +80,7 @@ export default { | |||||
res += | res += | ||||
`<span style='display:inline-block;margin-right:4px;width:10px;height:10px;background-color:${color}'></span>` + | `<span style='display:inline-block;margin-right:4px;width:10px;height:10px;background-color:${color}'></span>` + | ||||
`<span style='display:inline-block;width:150px;color:rgba(255,255,255,0855);font-size:14px;'>${params[0].axisValueLabel}</span>` + | `<span style='display:inline-block;width:150px;color:rgba(255,255,255,0855);font-size:14px;'>${params[0].axisValueLabel}</span>` + | ||||
`<span style='color:rgba(255,255,255,0.65);font-size:14px;'>${params[i].value + '片'}</span>`; | |||||
`<span style='color:rgba(255,255,255,0.65);font-size:14px;'>${params[i].value ? params[i].value + '片' : 0 + '片'}</span>`; | |||||
} | } | ||||
return res; | return res; | ||||
}, | }, | ||||
@@ -117,6 +117,7 @@ export default { | |||||
yAxis: { | yAxis: { | ||||
type: "value", | type: "value", | ||||
name: "单位/片", | name: "单位/片", | ||||
position: 'left', | |||||
nameTextStyle: { | nameTextStyle: { | ||||
color: "rgba(255, 255, 255, 0.7)", | color: "rgba(255, 255, 255, 0.7)", | ||||
fontSize: 12, | fontSize: 12, | ||||
@@ -1,7 +1,7 @@ | |||||
<!-- | <!-- | ||||
* @Author: zhp | * @Author: zhp | ||||
* @Date: 2024-05-30 08:58:39 | * @Date: 2024-05-30 08:58:39 | ||||
* @LastEditTime: 2024-07-02 10:53:34 | |||||
* @LastEditTime: 2024-07-03 14:10:06 | |||||
* @LastEditors: zhp | * @LastEditors: zhp | ||||
* @Description: | * @Description: | ||||
--> | --> | ||||
@@ -110,7 +110,7 @@ export default { | |||||
"<br/>" + | "<br/>" + | ||||
`<span style='display:inline-block;margin-right:4px;width:10px;height:10px;background-color:${color}'></span>` + | `<span style='display:inline-block;margin-right:4px;width:10px;height:10px;background-color:${color}'></span>` + | ||||
`<span style='display:inline-block;width:150px;color:rgba(255,255,255,.85);font-size:14px;'>${params[i].seriesName}</span>` + | `<span style='display:inline-block;width:150px;color:rgba(255,255,255,.85);font-size:14px;'>${params[i].seriesName}</span>` + | ||||
`<span style='color:rgba(255,255,255,0.65);font-size:14px;'>${params[i].value + '片'}</span>`; | |||||
`<span style='color:rgba(255,255,255,0.65);font-size:14px;'>${params[i].value ? params[i].value + '片' : 0 + '片'}</span>`; | |||||
} | } | ||||
return res; | return res; | ||||
}, | }, | ||||
@@ -132,6 +132,7 @@ export default { | |||||
}, | }, | ||||
yAxis: { | yAxis: { | ||||
name: "单位/片", | name: "单位/片", | ||||
position: 'left', | |||||
nameTextStyle: { | nameTextStyle: { | ||||
color: "#fff", | color: "#fff", | ||||
fontSize: 12, | fontSize: 12, | ||||
@@ -337,6 +338,7 @@ export default { | |||||
</script> | </script> | ||||
<style scoped lang="scss"> | <style scoped lang="scss"> | ||||
.bar-chart-base { | .bar-chart-base { | ||||
// position: relative; | // position: relative; | ||||
@@ -350,7 +352,7 @@ export default { | |||||
position: relative; | position: relative; | ||||
// font-size: 12px; | // font-size: 12px; | ||||
margin-right:1.2vw; | margin-right:1.2vw; | ||||
color: #DFF1FE; | |||||
&::before { | &::before { | ||||
content: ""; | content: ""; | ||||
display: inline-block; | display: inline-block; | ||||
@@ -40,6 +40,7 @@ export default { | |||||
evenRowBGC: "rgba(rgba(2, 13, 45, 0.18)", | evenRowBGC: "rgba(rgba(2, 13, 45, 0.18)", | ||||
data: [], | data: [], | ||||
rowNum: 12, | rowNum: 12, | ||||
fontSize:14, | |||||
waitTime: 3000, | waitTime: 3000, | ||||
columnWidth: [150], | columnWidth: [150], | ||||
align: ["left"], | align: ["left"], | ||||
@@ -113,19 +114,19 @@ export default { | |||||
`<span title=${this.prodOrder[i].actualProduction || ""}>${this.prodOrder[i].actualProduction || "" | `<span title=${this.prodOrder[i].actualProduction || ""}>${this.prodOrder[i].actualProduction || "" | ||||
}</span>`, | }</span>`, | ||||
`<span style="display:inline-block;width:45px;">${this.prodOrder[i].productionProgress | `<span style="display:inline-block;width:45px;">${this.prodOrder[i].productionProgress | ||||
? this.prodOrder[i].productionProgress.toFixed(0) + "%" | |||||
? this.prodOrder[i].productionProgress.toFixed(0) * 100 + "%" | |||||
: "0%" | : "0%" | ||||
}</span> | }</span> | ||||
<div style="display:inline-block;height:20px;margin-top:-5px;vertical-align:middle;"> | <div style="display:inline-block;height:20px;margin-top:-5px;vertical-align:middle;"> | ||||
<svg xmlns="http://www.w3.org/200/svg" height="20" width="20"> | <svg xmlns="http://www.w3.org/200/svg" height="20" width="20"> | ||||
<circle cx="10" cy="10" r="6" fill="none" stroke="#283851" stroke-width="4" stroke-linecap="round"/> | <circle cx="10" cy="10" r="6" fill="none" stroke="#283851" stroke-width="4" stroke-linecap="round"/> | ||||
<circle style="transform-origin: center;transform: rotate(-90deg);" id="J_progress_bar" cx="10" cy="10" r="6" fill="none" stroke="#47FF27" stroke-width="4" stroke-dasharray="${this.prodOrder[i].productionProgress | <circle style="transform-origin: center;transform: rotate(-90deg);" id="J_progress_bar" cx="10" cy="10" r="6" fill="none" stroke="#47FF27" stroke-width="4" stroke-dasharray="${this.prodOrder[i].productionProgress | ||||
? this.prodOrder[i].productionProgress.toFixed(0) * | |||||
? this.prodOrder[i].productionProgress.toFixed(0) *100 * | |||||
37.68 * | 37.68 * | ||||
0.01 + | 0.01 + | ||||
"," + | "," + | ||||
(1 - | (1 - | ||||
this.prodOrder[i].productionProgress.toFixed(0) * 0.01) * | |||||
this.prodOrder[i].productionProgress.toFixed(0) * 0.01) * 100 * | |||||
37.68 | 37.68 | ||||
: 0 + "," + 37.68 | : 0 + "," + 37.68 | ||||
}"/> | }"/> | ||||
@@ -249,7 +249,7 @@ export default { | |||||
// width: 5vw; | // width: 5vw; | ||||
color: #FFFFFF; | color: #FFFFFF; | ||||
line-height: 24px; | line-height: 24px; | ||||
text-align: left; | |||||
// text-align: left; | |||||
font-style: normal; | font-style: normal; | ||||
display: inline-block; | display: inline-block; | ||||
} | } | ||||
@@ -1,7 +1,7 @@ | |||||
<!-- | <!-- | ||||
* @Author: zhp | * @Author: zhp | ||||
* @Date: 2024-06-06 14:22:56 | * @Date: 2024-06-06 14:22:56 | ||||
* @LastEditTime: 2024-06-07 10:53:39 | |||||
* @LastEditTime: 2024-07-02 13:54:08 | |||||
* @LastEditors: zhp | * @LastEditors: zhp | ||||
* @Description: | * @Description: | ||||
--> | --> | ||||
@@ -62,7 +62,7 @@ button { | |||||
font-size: 16px; | font-size: 16px; | ||||
color: #FFFFFF; | color: #FFFFFF; | ||||
line-height: 22px; | line-height: 22px; | ||||
letter-spacing: 5px; | |||||
/* letter-spacing: 5px; */ | |||||
text-align: center; | text-align: center; | ||||
font-style: normal; | font-style: normal; | ||||
letter-spacing: 10px; | letter-spacing: 10px; | ||||
@@ -116,7 +116,12 @@ export default { | |||||
border-radius: 2px; | border-radius: 2px; | ||||
left: 8%; | left: 8%; | ||||
bottom: 0; | bottom: 0; | ||||
background: linear-gradient(to right, #024798, transparent); | |||||
background: radial-gradient( | |||||
circle at center, | |||||
#024798 2%, | |||||
#024798 30%, | |||||
transparent | |||||
); | |||||
z-index: 0; | z-index: 0; | ||||
} | } | ||||
@@ -79,14 +79,13 @@ export default { | |||||
<style scoped lang="scss"> | <style scoped lang="scss"> | ||||
.copilot-container { | .copilot-container { | ||||
height: 0; | |||||
height: 100%; | |||||
flex: 1; | flex: 1; | ||||
display: flex; | display: flex; | ||||
flex-direction: column; | flex-direction: column; | ||||
position: relative; | position: relative; | ||||
box-shadow: inset 0 0 20px 1px #fff1; | box-shadow: inset 0 0 20px 1px #fff1; | ||||
backdrop-filter: blur(4px); | backdrop-filter: blur(4px); | ||||
&::before { | &::before { | ||||
content: ""; | content: ""; | ||||
position: absolute; | position: absolute; | ||||
@@ -196,7 +196,7 @@ export default { | |||||
gap: 16px; | gap: 16px; | ||||
.flex { | .flex { | ||||
display: flex; | display: flex; | ||||
gap: 20px; | |||||
gap: 16px; | |||||
flex: 1; | flex: 1; | ||||
} | } | ||||
.top > div, | .top > div, | ||||
@@ -1,7 +1,7 @@ | |||||
<!-- | <!-- | ||||
* @Author: zhp | * @Author: zhp | ||||
* @Date: 2024-04-28 13:42:51 | * @Date: 2024-04-28 13:42:51 | ||||
* @LastEditTime: 2024-06-14 09:03:26 | |||||
* @LastEditTime: 2024-07-03 15:56:48 | |||||
* @LastEditors: zhp | * @LastEditors: zhp | ||||
* @Description: | * @Description: | ||||
--> | --> | ||||
@@ -53,7 +53,32 @@ export default { | |||||
top: 0, | top: 0, | ||||
containLabel: true, | containLabel: true, | ||||
}, | }, | ||||
tooltip: {}, | |||||
tooltip: { | |||||
trigger: "item", | |||||
// axisPointer: { | |||||
// // type: "cross", | |||||
// crossStyle: { | |||||
// color: "rgba(237,237,237,0.5)", | |||||
// }, | |||||
// }, | |||||
extraCssText: 'box-shadow: 0px 4px 8px 0px rgba(0, 0, 0, 0.38); border- radius: 4px;opacity: 0.6;backdrop- filter: blur(6px);', | |||||
backgroundColor: '#001829', | |||||
borderColor: '#001829', | |||||
formatter: params => { | |||||
console.log('params', params) | |||||
var res = ``; | |||||
for (var i = 0, l = params.length; i < l; i++) { | |||||
let color = Object.prototype.toString.call(params[i].color) == "[object String]" ? params[i].color : params[i].color.colorStops ? params[i].color.colorStops[0].color : '' | |||||
// console.log(item.color, color); | |||||
res += | |||||
// `<span style='display:inline-block;margin-right:4px;width:10px;height:10px;background-color:${color}'></span>` + | |||||
`<span style='display:inline-block;width:150px;color:rgba(255,255,255,0855);font-size:14px;'>${params[0].axisValueLabel}</span>` + | |||||
`<span style='color:rgba(255,255,255,0.65);font-size:14px;'>${params[i].value ? params[i].value + '片' : 0 + '片'}</span>`; | |||||
} | |||||
console.log('res',res) | |||||
return res; | |||||
}, | |||||
}, | |||||
title: { | title: { | ||||
text: "0%", | text: "0%", | ||||
left: "48%", | left: "48%", | ||||
@@ -223,40 +248,49 @@ export default { | |||||
actualOptions() { | actualOptions() { | ||||
console.log('this.output.current / this.output.target', this.output.current/this.output.target); | console.log('this.output.current / this.output.target', this.output.current/this.output.target); | ||||
const year = new Date().getFullYear() | const year = new Date().getFullYear() | ||||
const options = JSON.parse(JSON.stringify(this.options)); | |||||
const options = this.options | |||||
// console.log('options', options); | // console.log('options', options); | ||||
// 标题 | // 标题 | ||||
if (!this.output.target) options.title.text = "0%"; | |||||
else | |||||
options.title.text = | |||||
((this.output.current / this.output.target).toFixed(2)) * 100 + "%"; | |||||
if (!this.output.target && !this.output.current) options.title.text = "0%"; | |||||
else if (!this.output.target && this.output.current) options.title.text = "100%"; | |||||
else options.title.text = | |||||
((this.output.current / this.output.target).toFixed(2)) * 100 + "%"; | |||||
// 外环 | // 外环 | ||||
if ( | if ( | ||||
this.output.current == this.output.target && | this.output.current == this.output.target && | ||||
this.output.current == 0 | this.output.current == 0 | ||||
) { | ) { | ||||
options.series[1].data[0].value = 0; | |||||
options.series[1].data[1].value = 1; | |||||
options.series[1].data[0].tooltip.formatter = year + '累计完成:0'; | |||||
options.series[1].data[1].tooltip.formatter = year + '累计完成:0'; | |||||
this.options.series[1].data[0].value = 0; | |||||
this.options.series[1].data[1].value = 1; | |||||
this.options.series[1].data[0].tooltip.formatter = | |||||
`<span style='display:inline-block;width:150px;color:rgba(255,255,255,0855);font-size:14px;'>${year + '累计完成'}</span>` + | |||||
`<span style='color:rgba(255,255,255,0.65);font-size:14px;'>${0 + '片'}</span>`; | |||||
this.options.series[1].data[1].tooltip.formatter = `<span style='display:inline-block;width:150px;color:rgba(255,255,255,0855);font-size:14px;'>${year + '累计完成'}</span>` + | |||||
`<span style='color:rgba(255,255,255,0.65);font-size:14px;'>${0 + '片'}</span>`; | |||||
} else { | } else { | ||||
options.series[1].data[0].value = this.output.current; | |||||
options.series[1].data[1].value = | |||||
this.options.series[1].data[0].value = this.output.current; | |||||
this.options.series[1].data[1].value = | |||||
this.output.target - this.output.current; | this.output.target - this.output.current; | ||||
options.series[1].data[0].tooltip.formatter = year + '累计完成:' + this.output.current; | |||||
options.series[1].data[1].tooltip.formatter = year + '累计完成:' + this.output.current; | |||||
this.options.series[1].data[0].tooltip.formatter = `<span style='display:inline-block;width:150px;color:rgba(255,255,255,0855);font-size:14px;'>${year + '累计完成'}</span>` + | |||||
`<span style='color:rgba(255,255,255,0.65);font-size:14px;'>${this.output.current + '片'}</span>`; | |||||
this.options.series[1].data[1].tooltip.formatter = `<span style='display:inline-block;width:150px;color:rgba(255,255,255,0855);font-size:14px;'>${year + '累计完成'}</span>` + | |||||
`<span style='color:rgba(255,255,255,0.65);font-size:14px;'>${this.output.current + '片'}</span>`; | |||||
} | } | ||||
// 内环 | // 内环 | ||||
if (this.output.previous == 0) { | if (this.output.previous == 0) { | ||||
options.series[2].data[0].value = 0; | |||||
options.series[2].data[1].value = 1; | |||||
options.series[2].data[0].tooltip.formatter = year-1 + '累计完成:' + 0; | |||||
options.series[2].data[1].tooltip.formatter = year-1 + '累计完成:' + 0; | |||||
this.options.series[2].data[0].value = 0; | |||||
this.options.series[2].data[1].value = 1; | |||||
this.options.series[2].data[0].tooltip.formatter = `<span style='display:inline-block;width:150px;color:rgba(255,255,255,0855);font-size:14px;'>${year -1 + '累计完成'}</span>` + | |||||
`<span style='color:rgba(255,255,255,0.65);font-size:14px;'>${0 + '片'}</span>`; | |||||
this.options.series[2].data[1].tooltip.formatter = `<span style='display:inline-block;width:150px;color:rgba(255,255,255,0855);font-size:14px;'>${year -1 + '累计完成'}</span>` + | |||||
`<span style='color:rgba(255,255,255,0.65);font-size:14px;'>${0 + '片'}</span>`; | |||||
} else { | } else { | ||||
options.series[2].data[0].value = this.output.previous; | |||||
options.series[2].data[1].value = 0; | |||||
options.series[2].data[0].tooltip.formatter = year - 1 + '累计完成:' + this.output.previous; | |||||
options.series[2].data[1].tooltip.formatter = year - 1 + '累计完成:' + this.output.previous; | |||||
this.options.series[2].data[0].value = this.output.previous; | |||||
this.options.series[2].data[1].value = 0; | |||||
this.options.series[2].data[0].tooltip.formatter = `<span style='display:inline-block;width:150px;color:rgba(255,255,255,0855);font-size:14px;'>${year -1 + '累计完成'}</span>` + | |||||
`<span style='color:rgba(255,255,255,0.65);font-size:14px;'>${this.output.previous + '片'}</span>`; | |||||
this.options.series[2].data[1].tooltip.formatter = `<span style='display:inline-block;width:150px;color:rgba(255,255,255,0855);font-size:14px;'>${year - 1 + '累计完成'}</span>` + | |||||
`<span style='color:rgba(255,255,255,0.65);font-size:14px;'>${this.output.previous + '片'}</span>`; | |||||
} | } | ||||
console.log('options', options); | console.log('options', options); | ||||
return options; | return options; | ||||
@@ -274,6 +308,9 @@ export default { | |||||
factory(val) { | factory(val) { | ||||
this.initOptions(this.actualOptions); | this.initOptions(this.actualOptions); | ||||
}, | }, | ||||
actualOptions() { | |||||
this.initOptions(this.actualOptions); | |||||
} | |||||
}, | }, | ||||
mounted() { | mounted() { | ||||
console.log("mounted", this.actualOptions); | console.log("mounted", this.actualOptions); | ||||
@@ -73,27 +73,23 @@ export default { | |||||
color: "rgba(237,237,237,0.5)", | color: "rgba(237,237,237,0.5)", | ||||
}, | }, | ||||
}, | }, | ||||
// backgroundColor: '#000000', | |||||
// textStyle: { | |||||
// color: '#ffff' | |||||
// } | |||||
extraCssText: 'box-shadow: 0px 4px 8px 0px rgba(0, 0, 0, 0.38); border- radius: 4px;opacity: 0.6;backdrop- filter: blur(6px);', | |||||
backgroundColor: '#001829', | |||||
borderColor: '#001829', | |||||
formatter: params => { | formatter: params => { | ||||
// console.log(params); | |||||
// 获取xAxis data中的数据 | |||||
let dataStr = `<div><p style="font-weight:bold;margin:0 8px 15px;">${params[0].name}</p></div>` | |||||
params.forEach(item => { | |||||
let color = item.color.colorStops ? item.color.colorStops[0].color : '' | |||||
console.log(item.color, color); | |||||
dataStr += `<div> | |||||
<div style="margin: 0 8px;"> | |||||
<span style="display:inline-block;margin-right:5px;width:10px;height:10px;background-color:${item.color.colorStops[0].color};"></span> | |||||
<span>${item.seriesName}</span> | |||||
<span style="float:right;color:#000000;margin-left:20px;">${item.data}</span> | |||||
</div> | |||||
</div>` | |||||
}) | |||||
return dataStr | |||||
} | |||||
console.log('params', params) | |||||
var res = `<span style='color:rgba(255,255,255,0.85)'>${params[0].axisValueLabel}</span>`; | |||||
for (var i = 0, l = params.length; i < l; i++) { | |||||
let color = Object.prototype.toString.call(params[i].color) == "[object String]" ? params[i].color : params[i].color.colorStops ? params[i].color.colorStops[0].color : '' | |||||
// console.log(item.color, color); | |||||
res += | |||||
"<br/>" + | |||||
`<span style='display:inline-block;margin-right:4px;width:10px;height:10px;background-color:${color}'></span>` + | |||||
`<span style='display:inline-block;width:150px;color:rgba(255,255,255,.85);font-size:14px;'>${params[i].seriesName}</span>` + | |||||
`<span style='color:rgba(255,255,255,0.65);font-size:14px;'>${params[i].value ? params[i].value + '片' : 0 + '片'}</span>`; | |||||
} | |||||
return res; | |||||
}, | |||||
}, | }, | ||||
xAxis: { | xAxis: { | ||||
axisTick: { | axisTick: { | ||||
@@ -1,7 +1,7 @@ | |||||
<!-- | <!-- | ||||
* @Author: zhp | * @Author: zhp | ||||
* @Date: 2024-04-28 13:42:51 | * @Date: 2024-04-28 13:42:51 | ||||
* @LastEditTime: 2024-06-28 09:28:56 | |||||
* @LastEditTime: 2024-07-03 14:13:59 | |||||
* @LastEditors: zhp | * @LastEditors: zhp | ||||
* @Description: | * @Description: | ||||
--> | --> | ||||
@@ -79,22 +79,23 @@ export default { | |||||
color: "rgba(237,237,237,0.5)", | color: "rgba(237,237,237,0.5)", | ||||
}, | }, | ||||
}, | }, | ||||
extraCssText: 'box-shadow: 0px 4px 8px 0px rgba(0, 0, 0, 0.38); border- radius: 4px;opacity: 0.6;backdrop- filter: blur(6px);', | |||||
backgroundColor: '#001829', | |||||
borderColor: '#001829', | |||||
formatter: params => { | formatter: params => { | ||||
// 获取xAxis data中的数据 | |||||
let dataStr = `<div><p style="font-weight:bold;margin:0 8px 15px;">${params[0].name}</p></div>` | |||||
params.forEach(item => { | |||||
let color = Object.prototype.toString.call(item.color) == "[object String]" ? item.color : item.color.colorStops ? item.color.colorStops[0].color : '' | |||||
console.log(item.color, color); | |||||
dataStr += `<div> | |||||
<div style="margin: 0 8px;"> | |||||
<span style="display:inline-block;margin-right:5px;width:10px;height:10px;background-color:${color};"></span> | |||||
<span>${item.seriesName}</span> | |||||
<span style="float:right;color:#000000;margin-left:20px;">${item.data}</span> | |||||
</div> | |||||
</div>` | |||||
}) | |||||
return dataStr | |||||
} | |||||
console.log('params', params) | |||||
var res = `<span style='color:rgba(255,255,255,0.85)'>${params[0].axisValueLabel}</span>`; | |||||
for (var i = 0, l = params.length; i < l; i++) { | |||||
let color = Object.prototype.toString.call(params[i].color) == "[object String]" ? params[i].color : params[i].color.colorStops ? params[i].color.colorStops[0].color : '' | |||||
// console.log(item.color, color); | |||||
res += | |||||
"<br/>" + | |||||
`<span style='display:inline-block;margin-right:4px;width:10px;height:10px;background-color:${color}'></span>` + | |||||
`<span style='display:inline-block;width:150px;color:rgba(255,255,255,.85);font-size:14px;'>${params[i].seriesName}</span>` + | |||||
`<span style='color:rgba(255,255,255,0.65);font-size:14px;'>${params[i].value ? params[i].value + '片' : 0 + '片'}</span>`; | |||||
} | |||||
return res; | |||||
}, | |||||
}, | }, | ||||
xAxis: { | xAxis: { | ||||
axisTick: { | axisTick: { | ||||
@@ -1,8 +1,8 @@ | |||||
<!-- | <!-- | ||||
* @Author: zwq | * @Author: zwq | ||||
* @Date: 2022-01-21 14:43:06 | * @Date: 2022-01-21 14:43:06 | ||||
* @LastEditors: DY | |||||
* @LastEditTime: 2024-06-24 11:13:48 | |||||
* @LastEditors: zhp | |||||
* @LastEditTime: 2024-07-03 09:10:05 | |||||
* @Description: | * @Description: | ||||
--> | --> | ||||
<template> | <template> | ||||
@@ -100,7 +100,8 @@ export default { | |||||
}, | }, | ||||
tooltip: { | tooltip: { | ||||
trigger: 'axis', | trigger: 'axis', | ||||
formatter: function(params) { | |||||
formatter: function (params) { | |||||
console.log(params); | |||||
let result = ` | let result = ` | ||||
<div style="width: 270px; display: flex"> | <div style="width: 270px; display: flex"> | ||||
<div style="width: 150px">${params[0].name}</div> | <div style="width: 150px">${params[0].name}</div> | ||||
@@ -108,6 +109,7 @@ export default { | |||||
<div style="width: 60px">${factoryListabbr[1]}</div> | <div style="width: 60px">${factoryListabbr[1]}</div> | ||||
</div>` | </div>` | ||||
const newArray = params.map(p => { | const newArray = params.map(p => { | ||||
console.log(factoryListabbr[p.seriesName.split('-')[1]], p.seriesName.split('-')[0]) | |||||
return { | return { | ||||
glass: p.seriesName.split('-')[0], // 玻璃类型 | glass: p.seriesName.split('-')[0], // 玻璃类型 | ||||
factoryName: factoryListabbr[p.seriesName.split('-')[1]], // 工厂名称 | factoryName: factoryListabbr[p.seriesName.split('-')[1]], // 工厂名称 | ||||
@@ -150,7 +152,7 @@ export default { | |||||
yAxis: [ | yAxis: [ | ||||
{ | { | ||||
type: 'value', | type: 'value', | ||||
name: '单位:个' | |||||
name: '单位:片' | |||||
} | } | ||||
], | ], | ||||
grid: { | grid: { | ||||
@@ -1,7 +1,7 @@ | |||||
<!-- | <!-- | ||||
* @Author: zhp | * @Author: zhp | ||||
* @Date: 2024-06-21 09:05:14 | * @Date: 2024-06-21 09:05:14 | ||||
* @LastEditTime: 2024-07-02 08:33:22 | |||||
* @LastEditTime: 2024-07-03 16:07:42 | |||||
* @LastEditors: zhp | * @LastEditors: zhp | ||||
* @Description: | * @Description: | ||||
--> | --> | ||||
@@ -51,7 +51,7 @@ export default { | |||||
}, | }, | ||||
}, | }, | ||||
formatter: function (params) { | formatter: function (params) { | ||||
// console.log('params', params) | |||||
console.log('params', params) | |||||
let arr = [] | let arr = [] | ||||
var res = ``; | var res = ``; | ||||
// for (var i = 0, l = params.length; i < l; i++) { | // for (var i = 0, l = params.length; i < l; i++) { | ||||
@@ -64,7 +64,7 @@ export default { | |||||
? (params[0].value ? params[0].value.toFixed(2) : 0.0) + "%" | ? (params[0].value ? params[0].value.toFixed(2) : 0.0) + "%" | ||||
: params[0].name === "转化效率" | : params[0].name === "转化效率" | ||||
? (params[0].value ? params[0].value.toFixed(2) : 0.0) + "%" | ? (params[0].value ? params[0].value.toFixed(2) : 0.0) + "%" | ||||
: params[0].seriesName.search('总功率') != -1 | |||||
: params[0].axisValueLabel.search('总功率') != -1 | |||||
? (params[0].value ? params[0].value : 0) + "MW" | ? (params[0].value ? params[0].value : 0) + "MW" | ||||
: (params[0].value ? params[0].value : 0) + "片" | : (params[0].value ? params[0].value : 0) + "片" | ||||
}</span>`; | }</span>`; | ||||
@@ -78,7 +78,7 @@ export default { | |||||
? (params[1].value ? params[1].value.toFixed(2) : 0.0) + "%" | ? (params[1].value ? params[1].value.toFixed(2) : 0.0) + "%" | ||||
: params[1].name === "转化效率" | : params[1].name === "转化效率" | ||||
? (params[1].value ? params[1].value.toFixed(2) : 0.0) + "%" | ? (params[1].value ? params[1].value.toFixed(2) : 0.0) + "%" | ||||
: params[1].seriesName.search('总功率') != -1 | |||||
: params[1].axisValueLabel.search('总功率') != -1 | |||||
? (params[1].value ? params[1].value : 0) + "MW" | ? (params[1].value ? params[1].value : 0) + "MW" | ||||
: (params[1].value ? params[1].value : 0) + "片" | : (params[1].value ? params[1].value : 0) + "片" | ||||
}</span>`; | }</span>`; | ||||
@@ -215,7 +215,7 @@ export default { | |||||
barWidth: 20, | barWidth: 20, | ||||
label: { | label: { | ||||
show: true, | show: true, | ||||
position: [-18, -16], | |||||
position: [0, -16], | |||||
color: "#68C483", | color: "#68C483", | ||||
formatter: function (params) { | formatter: function (params) { | ||||
return params.value | return params.value | ||||
@@ -230,7 +230,7 @@ export default { | |||||
barWidth: 20, | barWidth: 20, | ||||
label: { | label: { | ||||
show: true, | show: true, | ||||
position: [-18, -16], | |||||
position: [0, -16], | |||||
color: "#68C483", | color: "#68C483", | ||||
formatter: function (params) { | formatter: function (params) { | ||||
return params.value | return params.value | ||||
@@ -290,7 +290,7 @@ export default { | |||||
barWidth: 20, | barWidth: 20, | ||||
label: { | label: { | ||||
show: true, | show: true, | ||||
position: [-20, -16], | |||||
position: [-0, -16], | |||||
color: "#68C483", | color: "#68C483", | ||||
formatter: function (params) { | formatter: function (params) { | ||||
return params.value.toFixed(2) | return params.value.toFixed(2) | ||||
@@ -305,7 +305,7 @@ export default { | |||||
barWidth: 20, | barWidth: 20, | ||||
label: { | label: { | ||||
show: true, | show: true, | ||||
position: [10, -16], | |||||
position: [0, -16], | |||||
color: "#288AFF", | color: "#288AFF", | ||||
formatter: function (params) { | formatter: function (params) { | ||||
return params.value.toFixed(2) | return params.value.toFixed(2) | ||||