From 1c87fc91195ae116d7e491530137d0be01ce7f95 Mon Sep 17 00:00:00 2001 From: yangfeng <wanwan926_4@163.com> Date: 星期三, 06 十二月 2023 15:44:34 +0800 Subject: [PATCH] 人员生产效率、设备负荷对比、物料需求、车间正品率样式修改及文字显示处理 --- src/views/cockpitPage/components/PerSonnelProductivity.vue | 50 +++++++++++++++++++++++++++++++++++++++++++------- 1 files changed, 43 insertions(+), 7 deletions(-) diff --git a/src/views/cockpitPage/components/PerSonnelProductivity.vue b/src/views/cockpitPage/components/PerSonnelProductivity.vue index 27a0c8b..54a1eb7 100644 --- a/src/views/cockpitPage/components/PerSonnelProductivity.vue +++ b/src/views/cockpitPage/components/PerSonnelProductivity.vue @@ -17,6 +17,7 @@ //寮曞叆echart import * as echarts from "echarts"; let myChart; +let myRightChart; export default { components: { ChartTitle, @@ -73,7 +74,7 @@ grid: { right: "80px", bottom: "60px", - left: "60px", + left: "70px", top: "30px", }, dataZoom: [ @@ -83,6 +84,9 @@ show: false, startValue: this.startValue, // 浠庡ご寮�濮� endValue: this.endValue, // 涓�娆℃�у睍绀哄嚑涓� + zoomOnMouseWheel: false, + moveOnMouseWheel: true, + moveOnMouseMove: true, }, ], legend: { @@ -108,6 +112,7 @@ // rotate:45, margin: 10, show: true, + fontSize: 12, textStyle: { color: function (params, index) { let colorList = ["#dcb018", "#00FFFF"]; @@ -117,6 +122,12 @@ return colorList[1]; } }, + }, + formatter: function (value) { + if (value.length > 5) { + return `${value.slice(0, 4)}...`; + } + return value; }, }, data: data.datax ? data.datax : [], @@ -155,6 +166,9 @@ textStyle: { color: "#00FFFF", }, + formatter: function (value) { + return `${value}%`; + }, }, }, ], @@ -166,7 +180,21 @@ label: { show: true, position: "right", - color: "#00FFFF", + formatter: function (params) { + if (params.dataIndex % 2 == 0) { + return `{a|${params.value}%}`; + } else { + return `{b|${params.value}%}`; + } + }, + rich: { + a: { + color: "#00FFFF", + }, + b: { + color: "#dcb018", + }, + }, }, itemStyle: { normal: { @@ -208,7 +236,15 @@ }, getChartRight(chartName, data) { let chartDom = this.$refs[chartName]; - let myChart = echarts.init(chartDom); + // let myRightChart = echarts.init(chartDom); + if ( + myRightChart != null && + myRightChart != "" && + myRightChart != undefined + ) { + myRightChart.dispose(); //閿�姣� + } + myRightChart = echarts.init(chartDom); let img = "/cockpitPage/dotted-circle.png"; let option; if (data) { @@ -224,8 +260,8 @@ z: 3, style: { image: img, - width: 238, - height: 238, + width: 240, + height: 240, }, left: "center", top: "center", @@ -288,10 +324,10 @@ ], }; - option && myChart.setOption(option); + option && myRightChart.setOption(option); } else { option = {}; - myChart.setOption(option, true); + myRightChart.setOption(option, true); } }, }, -- Gitblit v1.8.0