From 628ee4dccd7041c5e6e8ece593c1719358a82665 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E5=A4=9C=E7=AC=99=E6=AD=8C?= <2277317060@qq.com> Date: Tue, 26 Mar 2024 16:49:41 +0800 Subject: [PATCH] =?UTF-8?q?=E4=BF=AE=E6=94=B9=E6=8E=A5=E5=8F=A3?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/views/board/pourInto/index2.vue | 2260 ++++++++++++++++++- src/views/report/repairRateReport/index.vue | 149 +- 2 files changed, 2398 insertions(+), 11 deletions(-) diff --git a/src/views/board/pourInto/index2.vue b/src/views/board/pourInto/index2.vue index ad6f8ca..5010674 100644 --- a/src/views/board/pourInto/index2.vue +++ b/src/views/board/pourInto/index2.vue @@ -5,6 +5,13 @@ :style="'top:'+(titlePosition[k]&&titlePosition[k].top||0)+'%;left:'+(titlePosition[k]&&titlePosition[k].left||0)+'%'"> {{ i }} + +
+ 产线1 + 产线2 + 合并 + +
@@ -419,6 +426,7 @@ export default { name: "Liner", data() { return { + nowLine: 2, title: [ '灌注', '电检', @@ -504,14 +512,14 @@ export default { e: 'zzgx-02', i: "scada_zz_up_dj_01('CX_02')", f: (e) => { - this.dj =e[0] || {} + this.dj = e[0] || {} } }, { e: 'zzgx-03', i: "scada_zz_up_xn_01('CX_02')", f: (e) => { - this.zl =e[0] || {} + this.zl = e[0] || {} } }, { @@ -695,7 +703,7 @@ export default { formatter: function (params) { return ( "{a|" + - parseFloat(data.Y_VALUE_TWO) + + parseFloat(data.Y_VALUE_TWO) + "}" + "\n{b|合格数}" ); @@ -774,7 +782,7 @@ export default { formatter: function (params) { return ( "{a|" + - parseFloat(data.X_VALUE) + + parseFloat(data.X_VALUE) + "%}" + "\n{b|合格率}" ); @@ -1099,7 +1107,7 @@ export default { center: ["50%", "50%"], data: [ { - value:(parseFloat(data.Y_VALUE_ONE) === 0 ? 0.01 : parseFloat(data.Y_VALUE_ONE)), + value: (parseFloat(data.Y_VALUE_ONE) === 0 ? 0.01 : parseFloat(data.Y_VALUE_ONE)), label: { normal: { rich: { @@ -1350,7 +1358,2173 @@ export default { center: ["50%", "50%"], data: [ { - value:(parseFloat(data.Y_VALUE_ONE) === 0 ? 0.01 : parseFloat(data.Y_VALUE_ONE)), + value: (parseFloat(data.Y_VALUE_ONE) === 0 ? 0.01 : parseFloat(data.Y_VALUE_ONE)), + label: { + normal: { + rich: { + a: { + color: "#389af4", + align: "center", + fontSize: 0.9 * vw, + fontWeight: "bold", + }, + b: { + color: "#fff", + align: "center", + fontSize: 0.9 * vw, + }, + }, + formatter: function (params) { + return ( + "{a|" + + parseFloat(data.Y_VALUE_ONE) + + "}" + + "\n{b|总数}" + ); + }, + position: "center", + show: true, + textStyle: { + fontSize: "14", + fontWeight: "normal", + color: "#fff", + }, + }, + }, + itemStyle: { + normal: { + color: "#389af4", + shadowColor: "#389af4", + shadowBlur: 0, + }, + }, + }, + { + value: 0, + name: "invisible", + itemStyle: { + normal: { + color: "#412a4e", + }, + emphasis: { + color: "#412a4e", + }, + }, + }, + ], + }, + ], + }) + this.$refs.chart42.setData({ + series: [ + { + type: "pie", + clockWise: false, + radius: ['60%', '75%'], + itemStyle: { + normal: { + label: { + show: false, + }, + labelLine: { + show: false, + }, + shadowBlur: 0, + shadowColor: "#99d708", + }, + }, + hoverAnimation: false, + center: ["50%", "50%"], + data: [ + { + value: (parseFloat(data.Y_VALUE_TWO) === 0 ? 0.01 : parseFloat(data.Y_VALUE_TWO)), + label: { + normal: { + rich: { + a: { + color: "#99d708", + align: "center", + fontSize: 0.9 * vw, + fontWeight: "bold", + }, + b: { + color: "#fff", + align: "center", + fontSize: 0.8 * vw, + }, + }, + formatter: function (params) { + return ( + "{a|" + + parseFloat(data.Y_VALUE_TWO) + + "}" + + "\n{b|合格数}" + ); + }, + position: "center", + show: true, + textStyle: { + fontSize: "14", + fontWeight: "normal", + color: "#fff", + }, + }, + }, + itemStyle: { + normal: { + color: "#99d708", + shadowColor: "#99d708", + shadowBlur: 0, + }, + }, + }, + { + value: 0, + name: "invisible", + itemStyle: { + normal: { + color: "#412a4e", + }, + emphasis: { + color: "#412a4e", + }, + }, + }, + ], + }, + ], + }) + this.$refs.chart43.setData({ + series: [ + { + type: "pie", + clockWise: false, + radius: ['60%', '75%'], + itemStyle: { + normal: { + label: { + show: false, + }, + labelLine: { + show: false, + }, + shadowBlur: 0, + shadowColor: "#7dd9c2", + }, + }, + hoverAnimation: false, + center: ["50%", "50%"], + data: [ + { + value: (parseFloat(data.X_VALUE) === 0 ? 0.01 : parseFloat(data.X_VALUE)), + label: { + normal: { + rich: { + a: { + color: "#7dd9c2", + align: "center", + fontSize: 0.9 * vw, + fontWeight: "bold", + }, + b: { + color: "#fff", + align: "center", + fontSize: 0.8 * vw, + }, + }, + formatter: function (params) { + return ( + "{a|" + + parseFloat(data.X_VALUE) + + "%}" + + "\n{b|合格率}" + ); + }, + position: "center", + show: true, + textStyle: { + fontSize: "14", + fontWeight: "normal", + color: "#fff", + }, + }, + }, + itemStyle: { + normal: { + color: "#7dd9c2", + shadowColor: "#7dd9c2", + shadowBlur: 0, + }, + }, + }, + { + value: parseFloat((100 - parseFloat(data.X_VALUE)).toFixed(2)), + name: "invisible", + itemStyle: { + normal: { + color: "#412a4e", + }, + emphasis: { + color: "#412a4e", + }, + }, + }, + ], + }, + ], + }) + } + }, + { + e: 'zzgx-14', + i: "scada_zz_up_jl_03('CX_02')", + f: (e) => { + this.scrollTableData4 = e + } + }, + ], + RequestDataSet1: [ + { + e: 'zzgx-01', + i: "scada_zz_up_gz_01('CX_02')", + f: (e) => { + this.gz = e[0] || {} + } + }, + { + e: 'zzgx-02', + i: "scada_zz_up_dj_01('CX_02')", + f: (e) => { + this.dj = e[0] || {} + } + }, + { + e: 'zzgx-03', + i: "scada_zz_up_xn_01('CX_02')", + f: (e) => { + this.zl = e[0] || {} + } + }, + { + e: 'zzgx-04', + i: "scada_zz_up_jl_01('CX_02')", + f: (e) => { + this.gdy = e[0] || {} + } + }, + { + e: 'zzgx-05', + i: "scada_zz_up_tj_01('CX_02')", + f: (e) => { + this.scrollTableData = e + } + }, + { + e: 'zzgx-06', + i: "scada_zz_up_fb_01('CX_02')", + f: (e) => { + this.$refs.chart1.setData({ + tooltip: { + trigger: "item", + formatter: "{a}
{b} : {c} ({d}%)", + }, + series: [ + { + name: "异常比例", + type: "pie", + radius: "70%", + center: ["50%", "50%"], + data: e.map(val => { + return { + name: val.X_VALUE, + value: val.Y_VALUE + } + }), + itemStyle: { + emphasis: { + shadowBlur: 10, + shadowOffsetX: 0, + shadowColor: "rgba(0, 0, 0, 0.5)", + }, + normal: { + label: { + show: true, + // position:'inside', + formatter: "{b} : {c} ({d}%)", + color: '#fff' + }, + }, + labelLine: {show: true}, + }, + }, + ], + }) + } + }, + { + e: 'zzgx-07', + i: "scada_zz_up_gz_02('CX_02')", + f: (e) => { + let data = e[0] + this.$refs.chart11.setData({ + series: [ + { + type: "pie", + clockWise: false, + radius: ['60%', '75%'], + itemStyle: { + normal: { + label: { + show: false, + }, + labelLine: { + show: false, + }, + shadowBlur: 0, + shadowColor: "#389af4", + }, + }, + hoverAnimation: false, + center: ["50%", "50%"], + data: [ + { + value: (parseFloat(data.Y_VALUE_ONE) === 0 ? 0.01 : parseFloat(data.Y_VALUE_ONE)), + label: { + normal: { + rich: { + a: { + color: "#389af4", + align: "center", + fontSize: 0.9 * vw, + fontWeight: "bold", + }, + b: { + color: "#fff", + align: "center", + fontSize: 0.9 * vw, + }, + }, + formatter: function (params) { + return ( + "{a|" + + parseFloat(data.Y_VALUE_ONE) + + "}" + + "\n{b|总数}" + ); + }, + position: "center", + show: true, + textStyle: { + fontSize: "14", + fontWeight: "normal", + color: "#fff", + }, + }, + }, + itemStyle: { + normal: { + color: "#389af4", + shadowColor: "#389af4", + shadowBlur: 0, + }, + }, + }, + { + value: 0, + name: "invisible", + itemStyle: { + normal: { + color: "#412a4e", + }, + emphasis: { + color: "#412a4e", + }, + }, + }, + ], + }, + ], + }) + this.$refs.chart12.setData({ + series: [ + { + type: "pie", + clockWise: false, + radius: ['60%', '75%'], + itemStyle: { + normal: { + label: { + show: false, + }, + labelLine: { + show: false, + }, + shadowBlur: 0, + shadowColor: "#99d708", + }, + }, + hoverAnimation: false, + center: ["50%", "50%"], + data: [ + { + value: (parseFloat(data.Y_VALUE_TWO) === 0 ? 0.01 : parseFloat(data.Y_VALUE_TWO)), + label: { + normal: { + rich: { + a: { + color: "#99d708", + align: "center", + fontSize: 0.9 * vw, + fontWeight: "bold", + }, + b: { + color: "#fff", + align: "center", + fontSize: 0.8 * vw, + }, + }, + formatter: function (params) { + return ( + "{a|" + + parseFloat(data.Y_VALUE_TWO) + + "}" + + "\n{b|合格数}" + ); + }, + position: "center", + show: true, + textStyle: { + fontSize: "14", + fontWeight: "normal", + color: "#fff", + }, + }, + }, + itemStyle: { + normal: { + color: "#99d708", + shadowColor: "#99d708", + shadowBlur: 0, + }, + }, + }, + { + value: 0, + name: "invisible", + itemStyle: { + normal: { + color: "#412a4e", + }, + emphasis: { + color: "#412a4e", + }, + }, + }, + ], + }, + ], + }) + this.$refs.chart13.setData({ + series: [ + { + type: "pie", + clockWise: false, + radius: ['60%', '75%'], + itemStyle: { + normal: { + label: { + show: false, + }, + labelLine: { + show: false, + }, + shadowBlur: 0, + shadowColor: "#7dd9c2", + }, + }, + hoverAnimation: false, + center: ["50%", "50%"], + data: [ + { + value: (parseFloat(data.X_VALUE) === 0 ? 0.01 : parseFloat(data.X_VALUE)), + label: { + normal: { + rich: { + a: { + color: "#7dd9c2", + align: "center", + fontSize: 0.9 * vw, + fontWeight: "bold", + }, + b: { + color: "#fff", + align: "center", + fontSize: 0.8 * vw, + }, + }, + formatter: function (params) { + return ( + "{a|" + + parseFloat(data.X_VALUE) + + "%}" + + "\n{b|合格率}" + ); + }, + position: "center", + show: true, + textStyle: { + fontSize: "14", + fontWeight: "normal", + color: "#fff", + }, + }, + }, + itemStyle: { + normal: { + color: "#7dd9c2", + shadowColor: "#7dd9c2", + shadowBlur: 0, + }, + }, + }, + { + value: parseFloat((100 - parseFloat(data.X_VALUE)).toFixed(2)), + name: "invisible", + itemStyle: { + normal: { + color: "#412a4e", + }, + emphasis: { + color: "#412a4e", + }, + }, + }, + ], + }, + ], + }) + } + }, + { + e: 'zzgx-08', + i: "scada_zz_up_gz_03('CX_02')", + f: (e) => { + this.scrollTableData1 = e + } + }, + { + e: 'zzgx-09', + i: "scada_zz_up_dj_02('CX_02')", + f: (e) => { + let data = e[0] + this.$refs.chart21.setData({ + series: [ + { + type: "pie", + clockWise: false, + radius: ['60%', '75%'], + itemStyle: { + normal: { + label: { + show: false, + }, + labelLine: { + show: false, + }, + shadowBlur: 0, + shadowColor: "#389af4", + }, + }, + hoverAnimation: false, + center: ["50%", "50%"], + data: [ + { + value: (parseFloat(data.Y_VALUE_ONE) === 0 ? 0.01 : parseFloat(data.Y_VALUE_ONE)), + label: { + normal: { + rich: { + a: { + color: "#389af4", + align: "center", + fontSize: 0.9 * vw, + fontWeight: "bold", + }, + b: { + color: "#fff", + align: "center", + fontSize: 0.9 * vw, + }, + }, + formatter: function (params) { + return ( + "{a|" + + parseFloat(data.Y_VALUE_ONE) + + "}" + + "\n{b|总数}" + ); + }, + position: "center", + show: true, + textStyle: { + fontSize: "14", + fontWeight: "normal", + color: "#fff", + }, + }, + }, + itemStyle: { + normal: { + color: "#389af4", + shadowColor: "#389af4", + shadowBlur: 0, + }, + }, + }, + { + value: 0, + name: "invisible", + itemStyle: { + normal: { + color: "#412a4e", + }, + emphasis: { + color: "#412a4e", + }, + }, + }, + ], + }, + ], + }) + this.$refs.chart22.setData({ + series: [ + { + type: "pie", + clockWise: false, + radius: ['60%', '75%'], + itemStyle: { + normal: { + label: { + show: false, + }, + labelLine: { + show: false, + }, + shadowBlur: 0, + shadowColor: "#99d708", + }, + }, + hoverAnimation: false, + center: ["50%", "50%"], + data: [ + { + value: (parseFloat(data.Y_VALUE_TWO) === 0 ? 0.01 : parseFloat(data.Y_VALUE_TWO)), + label: { + normal: { + rich: { + a: { + color: "#99d708", + align: "center", + fontSize: 0.9 * vw, + fontWeight: "bold", + }, + b: { + color: "#fff", + align: "center", + fontSize: 0.8 * vw, + }, + }, + formatter: function (params) { + return ( + "{a|" + + parseFloat(data.Y_VALUE_TWO) + + "}" + + "\n{b|合格数}" + ); + }, + position: "center", + show: true, + textStyle: { + fontSize: "14", + fontWeight: "normal", + color: "#fff", + }, + }, + }, + itemStyle: { + normal: { + color: "#99d708", + shadowColor: "#99d708", + shadowBlur: 0, + }, + }, + }, + { + value: 0, + name: "invisible", + itemStyle: { + normal: { + color: "#412a4e", + }, + emphasis: { + color: "#412a4e", + }, + }, + }, + ], + }, + ], + }) + this.$refs.chart23.setData({ + series: [ + { + type: "pie", + clockWise: false, + radius: ['60%', '75%'], + itemStyle: { + normal: { + label: { + show: false, + }, + labelLine: { + show: false, + }, + shadowBlur: 0, + shadowColor: "#7dd9c2", + }, + }, + hoverAnimation: false, + center: ["50%", "50%"], + data: [ + { + value: (parseFloat(data.X_VALUE) === 0 ? 0.01 : parseFloat(data.X_VALUE)), + label: { + normal: { + rich: { + a: { + color: "#7dd9c2", + align: "center", + fontSize: 0.9 * vw, + fontWeight: "bold", + }, + b: { + color: "#fff", + align: "center", + fontSize: 0.8 * vw, + }, + }, + formatter: function (params) { + return ( + "{a|" + + parseFloat(data.X_VALUE) + + "%}" + + "\n{b|合格率}" + ); + }, + position: "center", + show: true, + textStyle: { + fontSize: "14", + fontWeight: "normal", + color: "#fff", + }, + }, + }, + itemStyle: { + normal: { + color: "#7dd9c2", + shadowColor: "#7dd9c2", + shadowBlur: 0, + }, + }, + }, + { + value: parseFloat((100 - parseFloat(data.X_VALUE)).toFixed(2)), + name: "invisible", + itemStyle: { + normal: { + color: "#412a4e", + }, + emphasis: { + color: "#412a4e", + }, + }, + }, + ], + }, + ], + }) + } + }, + { + e: 'zzgx-10', + i: "scada_zz_up_dj_03('CX_02')", + f: (e) => { + this.scrollTableData2 = e + } + }, + { + e: 'zzgx-11', + i: "scada_zz_up_xn_02('CX_02')", + f: (e) => { + let data = e[0] + this.$refs.chart31.setData({ + series: [ + { + type: "pie", + clockWise: false, + radius: ['60%', '75%'], + itemStyle: { + normal: { + label: { + show: false, + }, + labelLine: { + show: false, + }, + shadowBlur: 0, + shadowColor: "#389af4", + }, + }, + hoverAnimation: false, + center: ["50%", "50%"], + data: [ + { + value: (parseFloat(data.Y_VALUE_ONE) === 0 ? 0.01 : parseFloat(data.Y_VALUE_ONE)), + label: { + normal: { + rich: { + a: { + color: "#389af4", + align: "center", + fontSize: 0.9 * vw, + fontWeight: "bold", + }, + b: { + color: "#fff", + align: "center", + fontSize: 0.9 * vw, + }, + }, + formatter: function (params) { + return ( + "{a|" + + parseFloat(data.Y_VALUE_ONE) + + "}" + + "\n{b|总数}" + ); + }, + position: "center", + show: true, + textStyle: { + fontSize: "14", + fontWeight: "normal", + color: "#fff", + }, + }, + }, + itemStyle: { + normal: { + color: "#389af4", + shadowColor: "#389af4", + shadowBlur: 0, + }, + }, + }, + { + value: 0, + name: "invisible", + itemStyle: { + normal: { + color: "#412a4e", + }, + emphasis: { + color: "#412a4e", + }, + }, + }, + ], + }, + ], + }) + this.$refs.chart32.setData({ + series: [ + { + type: "pie", + clockWise: false, + radius: ['60%', '75%'], + itemStyle: { + normal: { + label: { + show: false, + }, + labelLine: { + show: false, + }, + shadowBlur: 0, + shadowColor: "#99d708", + }, + }, + hoverAnimation: false, + center: ["50%", "50%"], + data: [ + { + value: (parseFloat(data.Y_VALUE_TWO) === 0 ? 0.01 : parseFloat(data.Y_VALUE_TWO)), + label: { + normal: { + rich: { + a: { + color: "#99d708", + align: "center", + fontSize: 0.9 * vw, + fontWeight: "bold", + }, + b: { + color: "#fff", + align: "center", + fontSize: 0.8 * vw, + }, + }, + formatter: function (params) { + return ( + "{a|" + + parseFloat(data.Y_VALUE_TWO) + + "}" + + "\n{b|合格数}" + ); + }, + position: "center", + show: true, + textStyle: { + fontSize: "14", + fontWeight: "normal", + color: "#fff", + }, + }, + }, + itemStyle: { + normal: { + color: "#99d708", + shadowColor: "#99d708", + shadowBlur: 0, + }, + }, + }, + { + value: 0, + name: "invisible", + itemStyle: { + normal: { + color: "#412a4e", + }, + emphasis: { + color: "#412a4e", + }, + }, + }, + ], + }, + ], + }) + this.$refs.chart33.setData({ + series: [ + { + type: "pie", + clockWise: false, + radius: ['60%', '75%'], + itemStyle: { + normal: { + label: { + show: false, + }, + labelLine: { + show: false, + }, + shadowBlur: 0, + shadowColor: "#7dd9c2", + }, + }, + hoverAnimation: false, + center: ["50%", "50%"], + data: [ + { + value: (parseFloat(data.X_VALUE) === 0 ? 0.01 : parseFloat(data.X_VALUE)), + label: { + normal: { + rich: { + a: { + color: "#7dd9c2", + align: "center", + fontSize: 0.9 * vw, + fontWeight: "bold", + }, + b: { + color: "#fff", + align: "center", + fontSize: 0.8 * vw, + }, + }, + formatter: function (params) { + return ( + "{a|" + + parseFloat(data.X_VALUE) + + "%}" + + "\n{b|合格率}" + ); + }, + position: "center", + show: true, + textStyle: { + fontSize: "14", + fontWeight: "normal", + color: "#fff", + }, + }, + }, + itemStyle: { + normal: { + color: "#7dd9c2", + shadowColor: "#7dd9c2", + shadowBlur: 0, + }, + }, + }, + { + value: parseFloat((100 - parseFloat(data.X_VALUE)).toFixed(2)), + name: "invisible", + itemStyle: { + normal: { + color: "#412a4e", + }, + emphasis: { + color: "#412a4e", + }, + }, + }, + ], + }, + ], + }) + } + }, + { + e: 'zzgx-12', + i: "scada_zz_up_xn_03('CX_02')", + f: (e) => { + this.scrollTableData3 = e + } + }, + { + e: 'zzgx-13', + i: "scada_zz_up_jl_02('CX_02')", + f: (e) => { + let data = e[0] + this.$refs.chart41.setData({ + series: [ + { + type: "pie", + clockWise: false, + radius: ['60%', '75%'], + itemStyle: { + normal: { + label: { + show: false, + }, + labelLine: { + show: false, + }, + shadowBlur: 0, + shadowColor: "#389af4", + }, + }, + hoverAnimation: false, + center: ["50%", "50%"], + data: [ + { + value: (parseFloat(data.Y_VALUE_ONE) === 0 ? 0.01 : parseFloat(data.Y_VALUE_ONE)), + label: { + normal: { + rich: { + a: { + color: "#389af4", + align: "center", + fontSize: 0.9 * vw, + fontWeight: "bold", + }, + b: { + color: "#fff", + align: "center", + fontSize: 0.9 * vw, + }, + }, + formatter: function (params) { + return ( + "{a|" + + parseFloat(data.Y_VALUE_ONE) + + "}" + + "\n{b|总数}" + ); + }, + position: "center", + show: true, + textStyle: { + fontSize: "14", + fontWeight: "normal", + color: "#fff", + }, + }, + }, + itemStyle: { + normal: { + color: "#389af4", + shadowColor: "#389af4", + shadowBlur: 0, + }, + }, + }, + { + value: 0, + name: "invisible", + itemStyle: { + normal: { + color: "#412a4e", + }, + emphasis: { + color: "#412a4e", + }, + }, + }, + ], + }, + ], + }) + this.$refs.chart42.setData({ + series: [ + { + type: "pie", + clockWise: false, + radius: ['60%', '75%'], + itemStyle: { + normal: { + label: { + show: false, + }, + labelLine: { + show: false, + }, + shadowBlur: 0, + shadowColor: "#99d708", + }, + }, + hoverAnimation: false, + center: ["50%", "50%"], + data: [ + { + value: (parseFloat(data.Y_VALUE_TWO) === 0 ? 0.01 : parseFloat(data.Y_VALUE_TWO)), + label: { + normal: { + rich: { + a: { + color: "#99d708", + align: "center", + fontSize: 0.9 * vw, + fontWeight: "bold", + }, + b: { + color: "#fff", + align: "center", + fontSize: 0.8 * vw, + }, + }, + formatter: function (params) { + return ( + "{a|" + + parseFloat(data.Y_VALUE_TWO) + + "}" + + "\n{b|合格数}" + ); + }, + position: "center", + show: true, + textStyle: { + fontSize: "14", + fontWeight: "normal", + color: "#fff", + }, + }, + }, + itemStyle: { + normal: { + color: "#99d708", + shadowColor: "#99d708", + shadowBlur: 0, + }, + }, + }, + { + value: 0, + name: "invisible", + itemStyle: { + normal: { + color: "#412a4e", + }, + emphasis: { + color: "#412a4e", + }, + }, + }, + ], + }, + ], + }) + this.$refs.chart43.setData({ + series: [ + { + type: "pie", + clockWise: false, + radius: ['60%', '75%'], + itemStyle: { + normal: { + label: { + show: false, + }, + labelLine: { + show: false, + }, + shadowBlur: 0, + shadowColor: "#7dd9c2", + }, + }, + hoverAnimation: false, + center: ["50%", "50%"], + data: [ + { + value: (parseFloat(data.X_VALUE) === 0 ? 0.01 : parseFloat(data.X_VALUE)), + label: { + normal: { + rich: { + a: { + color: "#7dd9c2", + align: "center", + fontSize: 0.9 * vw, + fontWeight: "bold", + }, + b: { + color: "#fff", + align: "center", + fontSize: 0.8 * vw, + }, + }, + formatter: function (params) { + return ( + "{a|" + + parseFloat(data.X_VALUE) + + "%}" + + "\n{b|合格率}" + ); + }, + position: "center", + show: true, + textStyle: { + fontSize: "14", + fontWeight: "normal", + color: "#fff", + }, + }, + }, + itemStyle: { + normal: { + color: "#7dd9c2", + shadowColor: "#7dd9c2", + shadowBlur: 0, + }, + }, + }, + { + value: parseFloat((100 - parseFloat(data.X_VALUE)).toFixed(2)), + name: "invisible", + itemStyle: { + normal: { + color: "#412a4e", + }, + emphasis: { + color: "#412a4e", + }, + }, + }, + ], + }, + ], + }) + } + }, + { + e: 'zzgx-14', + i: "scada_zz_up_jl_03('CX_02')", + f: (e) => { + this.scrollTableData4 = e + } + }, + ], + RequestDataSet2: [ + { + e: 'zzgx-01', + i: "scada_zz_up_gz_01('CX_02')", + f: (e) => { + this.gz = e[0] || {} + } + }, + { + e: 'zzgx-02', + i: "scada_zz_up_dj_01('CX_02')", + f: (e) => { + this.dj = e[0] || {} + } + }, + { + e: 'zzgx-03', + i: "scada_zz_up_xn_01('CX_02')", + f: (e) => { + this.zl = e[0] || {} + } + }, + { + e: 'zzgx-04', + i: "scada_zz_up_jl_01('CX_02')", + f: (e) => { + this.gdy = e[0] || {} + } + }, + { + e: 'zzgx-05', + i: "scada_zz_up_tj_01('CX_02')", + f: (e) => { + this.scrollTableData = e + } + }, + { + e: 'zzgx-06', + i: "scada_zz_up_fb_01('CX_02')", + f: (e) => { + this.$refs.chart1.setData({ + tooltip: { + trigger: "item", + formatter: "{a}
{b} : {c} ({d}%)", + }, + series: [ + { + name: "异常比例", + type: "pie", + radius: "70%", + center: ["50%", "50%"], + data: e.map(val => { + return { + name: val.X_VALUE, + value: val.Y_VALUE + } + }), + itemStyle: { + emphasis: { + shadowBlur: 10, + shadowOffsetX: 0, + shadowColor: "rgba(0, 0, 0, 0.5)", + }, + normal: { + label: { + show: true, + // position:'inside', + formatter: "{b} : {c} ({d}%)", + color: '#fff' + }, + }, + labelLine: {show: true}, + }, + }, + ], + }) + } + }, + { + e: 'zzgx-07', + i: "scada_zz_up_gz_02('CX_02')", + f: (e) => { + let data = e[0] + this.$refs.chart11.setData({ + series: [ + { + type: "pie", + clockWise: false, + radius: ['60%', '75%'], + itemStyle: { + normal: { + label: { + show: false, + }, + labelLine: { + show: false, + }, + shadowBlur: 0, + shadowColor: "#389af4", + }, + }, + hoverAnimation: false, + center: ["50%", "50%"], + data: [ + { + value: (parseFloat(data.Y_VALUE_ONE) === 0 ? 0.01 : parseFloat(data.Y_VALUE_ONE)), + label: { + normal: { + rich: { + a: { + color: "#389af4", + align: "center", + fontSize: 0.9 * vw, + fontWeight: "bold", + }, + b: { + color: "#fff", + align: "center", + fontSize: 0.9 * vw, + }, + }, + formatter: function (params) { + return ( + "{a|" + + parseFloat(data.Y_VALUE_ONE) + + "}" + + "\n{b|总数}" + ); + }, + position: "center", + show: true, + textStyle: { + fontSize: "14", + fontWeight: "normal", + color: "#fff", + }, + }, + }, + itemStyle: { + normal: { + color: "#389af4", + shadowColor: "#389af4", + shadowBlur: 0, + }, + }, + }, + { + value: 0, + name: "invisible", + itemStyle: { + normal: { + color: "#412a4e", + }, + emphasis: { + color: "#412a4e", + }, + }, + }, + ], + }, + ], + }) + this.$refs.chart12.setData({ + series: [ + { + type: "pie", + clockWise: false, + radius: ['60%', '75%'], + itemStyle: { + normal: { + label: { + show: false, + }, + labelLine: { + show: false, + }, + shadowBlur: 0, + shadowColor: "#99d708", + }, + }, + hoverAnimation: false, + center: ["50%", "50%"], + data: [ + { + value: (parseFloat(data.Y_VALUE_TWO) === 0 ? 0.01 : parseFloat(data.Y_VALUE_TWO)), + label: { + normal: { + rich: { + a: { + color: "#99d708", + align: "center", + fontSize: 0.9 * vw, + fontWeight: "bold", + }, + b: { + color: "#fff", + align: "center", + fontSize: 0.8 * vw, + }, + }, + formatter: function (params) { + return ( + "{a|" + + parseFloat(data.Y_VALUE_TWO) + + "}" + + "\n{b|合格数}" + ); + }, + position: "center", + show: true, + textStyle: { + fontSize: "14", + fontWeight: "normal", + color: "#fff", + }, + }, + }, + itemStyle: { + normal: { + color: "#99d708", + shadowColor: "#99d708", + shadowBlur: 0, + }, + }, + }, + { + value: 0, + name: "invisible", + itemStyle: { + normal: { + color: "#412a4e", + }, + emphasis: { + color: "#412a4e", + }, + }, + }, + ], + }, + ], + }) + this.$refs.chart13.setData({ + series: [ + { + type: "pie", + clockWise: false, + radius: ['60%', '75%'], + itemStyle: { + normal: { + label: { + show: false, + }, + labelLine: { + show: false, + }, + shadowBlur: 0, + shadowColor: "#7dd9c2", + }, + }, + hoverAnimation: false, + center: ["50%", "50%"], + data: [ + { + value: (parseFloat(data.X_VALUE) === 0 ? 0.01 : parseFloat(data.X_VALUE)), + label: { + normal: { + rich: { + a: { + color: "#7dd9c2", + align: "center", + fontSize: 0.9 * vw, + fontWeight: "bold", + }, + b: { + color: "#fff", + align: "center", + fontSize: 0.8 * vw, + }, + }, + formatter: function (params) { + return ( + "{a|" + + parseFloat(data.X_VALUE) + + "%}" + + "\n{b|合格率}" + ); + }, + position: "center", + show: true, + textStyle: { + fontSize: "14", + fontWeight: "normal", + color: "#fff", + }, + }, + }, + itemStyle: { + normal: { + color: "#7dd9c2", + shadowColor: "#7dd9c2", + shadowBlur: 0, + }, + }, + }, + { + value: parseFloat((100 - parseFloat(data.X_VALUE)).toFixed(2)), + name: "invisible", + itemStyle: { + normal: { + color: "#412a4e", + }, + emphasis: { + color: "#412a4e", + }, + }, + }, + ], + }, + ], + }) + } + }, + { + e: 'zzgx-08', + i: "scada_zz_up_gz_03('CX_02')", + f: (e) => { + this.scrollTableData1 = e + } + }, + { + e: 'zzgx-09', + i: "scada_zz_up_dj_02('CX_02')", + f: (e) => { + let data = e[0] + this.$refs.chart21.setData({ + series: [ + { + type: "pie", + clockWise: false, + radius: ['60%', '75%'], + itemStyle: { + normal: { + label: { + show: false, + }, + labelLine: { + show: false, + }, + shadowBlur: 0, + shadowColor: "#389af4", + }, + }, + hoverAnimation: false, + center: ["50%", "50%"], + data: [ + { + value: (parseFloat(data.Y_VALUE_ONE) === 0 ? 0.01 : parseFloat(data.Y_VALUE_ONE)), + label: { + normal: { + rich: { + a: { + color: "#389af4", + align: "center", + fontSize: 0.9 * vw, + fontWeight: "bold", + }, + b: { + color: "#fff", + align: "center", + fontSize: 0.9 * vw, + }, + }, + formatter: function (params) { + return ( + "{a|" + + parseFloat(data.Y_VALUE_ONE) + + "}" + + "\n{b|总数}" + ); + }, + position: "center", + show: true, + textStyle: { + fontSize: "14", + fontWeight: "normal", + color: "#fff", + }, + }, + }, + itemStyle: { + normal: { + color: "#389af4", + shadowColor: "#389af4", + shadowBlur: 0, + }, + }, + }, + { + value: 0, + name: "invisible", + itemStyle: { + normal: { + color: "#412a4e", + }, + emphasis: { + color: "#412a4e", + }, + }, + }, + ], + }, + ], + }) + this.$refs.chart22.setData({ + series: [ + { + type: "pie", + clockWise: false, + radius: ['60%', '75%'], + itemStyle: { + normal: { + label: { + show: false, + }, + labelLine: { + show: false, + }, + shadowBlur: 0, + shadowColor: "#99d708", + }, + }, + hoverAnimation: false, + center: ["50%", "50%"], + data: [ + { + value: (parseFloat(data.Y_VALUE_TWO) === 0 ? 0.01 : parseFloat(data.Y_VALUE_TWO)), + label: { + normal: { + rich: { + a: { + color: "#99d708", + align: "center", + fontSize: 0.9 * vw, + fontWeight: "bold", + }, + b: { + color: "#fff", + align: "center", + fontSize: 0.8 * vw, + }, + }, + formatter: function (params) { + return ( + "{a|" + + parseFloat(data.Y_VALUE_TWO) + + "}" + + "\n{b|合格数}" + ); + }, + position: "center", + show: true, + textStyle: { + fontSize: "14", + fontWeight: "normal", + color: "#fff", + }, + }, + }, + itemStyle: { + normal: { + color: "#99d708", + shadowColor: "#99d708", + shadowBlur: 0, + }, + }, + }, + { + value: 0, + name: "invisible", + itemStyle: { + normal: { + color: "#412a4e", + }, + emphasis: { + color: "#412a4e", + }, + }, + }, + ], + }, + ], + }) + this.$refs.chart23.setData({ + series: [ + { + type: "pie", + clockWise: false, + radius: ['60%', '75%'], + itemStyle: { + normal: { + label: { + show: false, + }, + labelLine: { + show: false, + }, + shadowBlur: 0, + shadowColor: "#7dd9c2", + }, + }, + hoverAnimation: false, + center: ["50%", "50%"], + data: [ + { + value: (parseFloat(data.X_VALUE) === 0 ? 0.01 : parseFloat(data.X_VALUE)), + label: { + normal: { + rich: { + a: { + color: "#7dd9c2", + align: "center", + fontSize: 0.9 * vw, + fontWeight: "bold", + }, + b: { + color: "#fff", + align: "center", + fontSize: 0.8 * vw, + }, + }, + formatter: function (params) { + return ( + "{a|" + + parseFloat(data.X_VALUE) + + "%}" + + "\n{b|合格率}" + ); + }, + position: "center", + show: true, + textStyle: { + fontSize: "14", + fontWeight: "normal", + color: "#fff", + }, + }, + }, + itemStyle: { + normal: { + color: "#7dd9c2", + shadowColor: "#7dd9c2", + shadowBlur: 0, + }, + }, + }, + { + value: parseFloat((100 - parseFloat(data.X_VALUE)).toFixed(2)), + name: "invisible", + itemStyle: { + normal: { + color: "#412a4e", + }, + emphasis: { + color: "#412a4e", + }, + }, + }, + ], + }, + ], + }) + } + }, + { + e: 'zzgx-10', + i: "scada_zz_up_dj_03('CX_02')", + f: (e) => { + this.scrollTableData2 = e + } + }, + { + e: 'zzgx-11', + i: "scada_zz_up_xn_02('CX_02')", + f: (e) => { + let data = e[0] + this.$refs.chart31.setData({ + series: [ + { + type: "pie", + clockWise: false, + radius: ['60%', '75%'], + itemStyle: { + normal: { + label: { + show: false, + }, + labelLine: { + show: false, + }, + shadowBlur: 0, + shadowColor: "#389af4", + }, + }, + hoverAnimation: false, + center: ["50%", "50%"], + data: [ + { + value: (parseFloat(data.Y_VALUE_ONE) === 0 ? 0.01 : parseFloat(data.Y_VALUE_ONE)), + label: { + normal: { + rich: { + a: { + color: "#389af4", + align: "center", + fontSize: 0.9 * vw, + fontWeight: "bold", + }, + b: { + color: "#fff", + align: "center", + fontSize: 0.9 * vw, + }, + }, + formatter: function (params) { + return ( + "{a|" + + parseFloat(data.Y_VALUE_ONE) + + "}" + + "\n{b|总数}" + ); + }, + position: "center", + show: true, + textStyle: { + fontSize: "14", + fontWeight: "normal", + color: "#fff", + }, + }, + }, + itemStyle: { + normal: { + color: "#389af4", + shadowColor: "#389af4", + shadowBlur: 0, + }, + }, + }, + { + value: 0, + name: "invisible", + itemStyle: { + normal: { + color: "#412a4e", + }, + emphasis: { + color: "#412a4e", + }, + }, + }, + ], + }, + ], + }) + this.$refs.chart32.setData({ + series: [ + { + type: "pie", + clockWise: false, + radius: ['60%', '75%'], + itemStyle: { + normal: { + label: { + show: false, + }, + labelLine: { + show: false, + }, + shadowBlur: 0, + shadowColor: "#99d708", + }, + }, + hoverAnimation: false, + center: ["50%", "50%"], + data: [ + { + value: (parseFloat(data.Y_VALUE_TWO) === 0 ? 0.01 : parseFloat(data.Y_VALUE_TWO)), + label: { + normal: { + rich: { + a: { + color: "#99d708", + align: "center", + fontSize: 0.9 * vw, + fontWeight: "bold", + }, + b: { + color: "#fff", + align: "center", + fontSize: 0.8 * vw, + }, + }, + formatter: function (params) { + return ( + "{a|" + + parseFloat(data.Y_VALUE_TWO) + + "}" + + "\n{b|合格数}" + ); + }, + position: "center", + show: true, + textStyle: { + fontSize: "14", + fontWeight: "normal", + color: "#fff", + }, + }, + }, + itemStyle: { + normal: { + color: "#99d708", + shadowColor: "#99d708", + shadowBlur: 0, + }, + }, + }, + { + value: 0, + name: "invisible", + itemStyle: { + normal: { + color: "#412a4e", + }, + emphasis: { + color: "#412a4e", + }, + }, + }, + ], + }, + ], + }) + this.$refs.chart33.setData({ + series: [ + { + type: "pie", + clockWise: false, + radius: ['60%', '75%'], + itemStyle: { + normal: { + label: { + show: false, + }, + labelLine: { + show: false, + }, + shadowBlur: 0, + shadowColor: "#7dd9c2", + }, + }, + hoverAnimation: false, + center: ["50%", "50%"], + data: [ + { + value: (parseFloat(data.X_VALUE) === 0 ? 0.01 : parseFloat(data.X_VALUE)), + label: { + normal: { + rich: { + a: { + color: "#7dd9c2", + align: "center", + fontSize: 0.9 * vw, + fontWeight: "bold", + }, + b: { + color: "#fff", + align: "center", + fontSize: 0.8 * vw, + }, + }, + formatter: function (params) { + return ( + "{a|" + + parseFloat(data.X_VALUE) + + "%}" + + "\n{b|合格率}" + ); + }, + position: "center", + show: true, + textStyle: { + fontSize: "14", + fontWeight: "normal", + color: "#fff", + }, + }, + }, + itemStyle: { + normal: { + color: "#7dd9c2", + shadowColor: "#7dd9c2", + shadowBlur: 0, + }, + }, + }, + { + value: parseFloat((100 - parseFloat(data.X_VALUE)).toFixed(2)), + name: "invisible", + itemStyle: { + normal: { + color: "#412a4e", + }, + emphasis: { + color: "#412a4e", + }, + }, + }, + ], + }, + ], + }) + } + }, + { + e: 'zzgx-12', + i: "scada_zz_up_xn_03('CX_02')", + f: (e) => { + this.scrollTableData3 = e + } + }, + { + e: 'zzgx-13', + i: "scada_zz_up_jl_02('CX_02')", + f: (e) => { + let data = e[0] + this.$refs.chart41.setData({ + series: [ + { + type: "pie", + clockWise: false, + radius: ['60%', '75%'], + itemStyle: { + normal: { + label: { + show: false, + }, + labelLine: { + show: false, + }, + shadowBlur: 0, + shadowColor: "#389af4", + }, + }, + hoverAnimation: false, + center: ["50%", "50%"], + data: [ + { + value: (parseFloat(data.Y_VALUE_ONE) === 0 ? 0.01 : parseFloat(data.Y_VALUE_ONE)), label: { normal: { rich: { @@ -1579,16 +3753,62 @@ export default { } }, mounted() { - this.RequestDataSet.forEach(val => { - mixData(val) - }) - intervalFun = setInterval(() => { + if (this.nowLine === 1) { this.RequestDataSet.forEach(val => { mixData(val) }) + } + if (this.nowLine === 2) { + this.RequestDataSet1.forEach(val => { + mixData(val) + }) + } + if (this.nowLine === 3) { + this.RequestDataSet2.forEach(val => { + mixData(val) + }) + } + + intervalFun = setInterval(() => { + + if (this.nowLine === 1) { + this.RequestDataSet.forEach(val => { + mixData(val) + }) + } + if (this.nowLine === 2) { + this.RequestDataSet1.forEach(val => { + mixData(val) + }) + } + if (this.nowLine === 3) { + this.RequestDataSet2.forEach(val => { + mixData(val) + }) + } }, 1000 * 10) }, methods: { + setLine(e) { + this.nowLine = e + if (e === 1) { + this.RequestDataSet.forEach(val => { + mixData(val) + }) + } + if (e === 2) { + + this.RequestDataSet1.forEach(val => { + mixData(val) + }) + } + if (e === 3) { + + this.RequestDataSet2.forEach(val => { + mixData(val) + }) + } + }, option(name, val) { return { tooltip: { @@ -2033,4 +4253,24 @@ export default { vertical-align: top } } + + +.classSelect { + position: absolute; + top: 6.5%; + left: 4%; +} + +.el-radio { + color: #fff !important; +} + +.el-button { + background: #00000000 !important; + color: #fff !important; +} + +.clickLine { + color: #1890ff !important; +} diff --git a/src/views/report/repairRateReport/index.vue b/src/views/report/repairRateReport/index.vue index 572fc23..60bf1cd 100644 --- a/src/views/report/repairRateReport/index.vue +++ b/src/views/report/repairRateReport/index.vue @@ -37,6 +37,9 @@ 重置 +
+ +
@@ -66,7 +69,11 @@ - + + + @@ -87,10 +94,15 @@ import { } from '@/api/report/reportAPI' import { findProductLineList } from '@//api/base/productLine' import { parseTime } from '@//utils/ruoyi' +import Chart from "@/components/board/Chart"; +const vw = (document.documentElement.clientWidth || document.body.clientWidth) / 100 export default { name: 'RepairRateReport', dicts: ['is_flag'], + components: { + Chart + }, data() { return { // 遮罩层 @@ -191,6 +203,135 @@ export default { }) this.total = response.total this.loading = false + + let e= response.data + this.$refs.chart1.setData({ + grid: { + top: "15%", + left: "1%", + right: "1%", + bottom: "2%", + containLabel: true, + }, + tooltip: { + trigger: 'axis', + axisPointer: { + type: 'cross', + crossStyle: { + color: '#000', + }, + }, + }, + legend: { + itemWidth: 3 * vw, + data: ['不良数', '一次不合格率', '目标'], + textStyle: { + color: "#000", + margin: 15, + fontSize: 0.75 * vw + }, + }, + xAxis: [ + { + axisLabel: { + //坐标轴刻度标签的相关设置 + textStyle: { + color: "#000", + margin: 15, + fontSize: 0.75 * vw + }, + }, + type: 'category', + data: e.map(val => val.INSPECTOR_TIME), + axisPointer: { + type: 'shadow' + } + } + ], + yAxis: [ + { + type: 'value', + splitLine: { + lineStyle: { + color: "rgba(255,255,255,0.1)", + }, + }, + axisLabel: { + //坐标轴刻度标签的相关设置 + textStyle: { + color: "#000", + margin: 15, + fontSize: 0.75 * vw + }, + formatter: '{value}' + } + }, + { + type: 'value', + splitLine: { + show: false, + }, + axisLabel: { + //坐标轴刻度标签的相关设置 + textStyle: { + color: "#000", + margin: 15, + fontSize: 0.75 * vw + }, + formatter: '{value}% ' + } + } + ], + series: [ + { + name: '不良数', + type: 'bar', + itemStyle: { + normal: { + color: function (val) { + if (parseFloat(e[val.dataIndex].REPAIR_RATE) < 10) { + return '#30e391' + } else { + return '#FE70A6' + } + // return "#0D81ED" + }, + }, + }, + data: e.map(val => val.QUALITY_SUM), + label: { + show: true, + position: 'top', + textStyle: { + color: "rgba(255,255,255,0.5)", + fontSize: 0.75 * vw + }, + }, + }, + { + name: '返修率', + type: 'line', + yAxisIndex: 1, + data: e.map(val => parseFloat(val.REPAIR_RATE)), + itemStyle: { + normal: { + color: '#F9A25B', + }, + }, + }, + { + name: '目标', + type: 'line', + yAxisIndex: 1, + data: e.map(val => 10), + itemStyle: { + normal: { + color: '#0DB99D', + }, + }, + } + ] + }) }) }, // 取消按钮 @@ -244,3 +385,9 @@ export default { } } +