From eb78b6c018ee56260eacc33cafd8d25036a64abc Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E5=A4=9C=E7=AC=99=E6=AD=8C?= <2277317060@qq.com>
Date: Wed, 13 Jul 2022 17:40:34 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BF=AE=E6=94=B9=E7=95=8C=E9=9D=A2?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
---
.../css/board/finalAssemblyProductionData.css | 31 +++++
.../js/board/finalAssemblyProductionData.js | 28 ++++
.../main/resources/static/js/echartsCommon.js | 122 +++++++++++++++++-
.../broad/finalAssemblyProductionData.html | 19 ++-
4 files changed, 188 insertions(+), 12 deletions(-)
diff --git a/ruoyi-admin/src/main/resources/static/css/board/finalAssemblyProductionData.css b/ruoyi-admin/src/main/resources/static/css/board/finalAssemblyProductionData.css
index 3bdc01c..774b942 100644
--- a/ruoyi-admin/src/main/resources/static/css/board/finalAssemblyProductionData.css
+++ b/ruoyi-admin/src/main/resources/static/css/board/finalAssemblyProductionData.css
@@ -8,4 +8,35 @@ body {
background-size: 100% 100%;
color: rgba(255, 255, 255, .95);
font: normal 100% Arial, sans-serif;
+}
+
+.yield {
+ position: absolute;
+ width: 45%;
+ height: 35%;
+ top: 15%;
+ left: 3.4%;
+}
+.LOSSClassify{
+ position: absolute;
+ width: 45%;
+ height: 20%;
+ top: 30%;
+ left: 51%;
+
+}
+.fractionDefective {
+ position: absolute;
+ width: 45%;
+ height: 35%;
+ top: 60%;
+ left: 3.4%;
+}
+
+.trackEvents {
+ position: absolute;
+ width: 45.2%;
+ height: 35%;
+ top: 60%;
+ left: 51%;
}
\ No newline at end of file
diff --git a/ruoyi-admin/src/main/resources/static/js/board/finalAssemblyProductionData.js b/ruoyi-admin/src/main/resources/static/js/board/finalAssemblyProductionData.js
index e69de29..751e3d1 100644
--- a/ruoyi-admin/src/main/resources/static/js/board/finalAssemblyProductionData.js
+++ b/ruoyi-admin/src/main/resources/static/js/board/finalAssemblyProductionData.js
@@ -0,0 +1,28 @@
+$(() => {
+
+ // 公共请求地址
+ let url = '/broad/box'
+
+ // 表格头
+ const planWorkOrderColumns = [
+ "编号", "计划数量", "完成数量", "差异值", "时间",
+ ]
+
+ // 追踪事件
+ const orderDetailsTable = new AutoScrollTable(document.getElementById("trackEvents"), planWorkOrderColumns, {width: ['30%', null, null, null, '17%']})
+
+ // LOSS(分类)
+ verticalBarChart(null, document.getElementById("LOSSClassify"));
+
+ // 产量
+ barChartAndLineChart(null, document.getElementById("yield"));
+
+ // 一次装配不合格率
+ barChartAndLineChart(null, document.getElementById("fractionDefective"));
+
+
+ //追踪事件轮询
+ autoUpdate(url+"/getProductPlanInfo ", INTERVAL, data => {
+ orderDetailsTable.loadData(data.map(value => [value.plan_code, value.plan_number, value.actual_number, value.plan_number-value.actual_number, value.day]), Object.keys(planWorkOrderColumns))
+ })
+})
\ No newline at end of file
diff --git a/ruoyi-admin/src/main/resources/static/js/echartsCommon.js b/ruoyi-admin/src/main/resources/static/js/echartsCommon.js
index efd5643..b2213a8 100644
--- a/ruoyi-admin/src/main/resources/static/js/echartsCommon.js
+++ b/ruoyi-admin/src/main/resources/static/js/echartsCommon.js
@@ -32,6 +32,9 @@ const horizontalRoundedBarChartWithBackground = function (data, id) {
axisPointer: {
type: "none",
},
+ textStyle:{
+ fontSize:0.8*vw
+ },
formatter: function (params) {
return (
params[0].name +
@@ -139,7 +142,11 @@ const barChartAndLineChart = function (data, id) {
}
}
let option = {
- tooltip: {},
+ tooltip: {
+ textStyle:{
+ fontSize:0.8*vw
+ }
+ },
grid: {
top: "15%",
left: "1%",
@@ -352,6 +359,9 @@ const pieChart = function (data, id) {
tooltip: {
trigger: "item",
formatter: "{b} : {c} ({d}%)",
+ textStyle:{
+ fontSize:0.8*vw
+ }
},
series: [
@@ -404,6 +414,116 @@ const pieChart = function (data, id) {
charts.setOption(option);
$(window).resize(charts.resize);
}
+
+// 垂直柱状图
+const verticalBarChart = function (data, id) {
+ let charts = echarts.init(id);
+ if (!data) {
+ data = [
+ {
+ value: 285,
+ name: "类型1",
+ },
+ {
+ value: 410,
+ name: "类型2",
+ },
+ {
+ value: 274,
+ name: "类型3",
+ },
+ {
+ value: 235,
+ name: "类型4",
+ },
+ ]
+ }
+ let option = {
+ tooltip: {
+ textStyle:{
+ fontSize:0.8*vw
+ }
+ },
+ grid: {
+ top: "5%",
+ left: "1%",
+ right: "1%",
+ bottom: "1%",
+ containLabel: true,
+ },
+ xAxis: {
+ data: [
+ ">10分钟",
+ "3-10分钟",
+ "0-3分钟",
+ ],
+ axisLine: {
+ lineStyle: {
+ color: "#0177d4",
+ },
+ },
+ axisLabel: {
+ color: "#fff",
+ fontSize: 0.8* vw,
+ interval: 0,
+ },
+ },
+ yAxis: {
+ nameTextStyle: {
+ color: "#fff",
+ fontSize: 0.8*vw,
+ },
+ axisLine: {
+ lineStyle: {
+ color: "#0177d4",
+ },
+ },
+ axisLabel: {
+ color: "#fff",
+ fontSize: 0.8*vw,
+ },
+ splitLine: {
+ show: false,
+ lineStyle: {
+ color: "#0177d4",
+ },
+ },
+ },
+ series: [
+ {
+ type: "bar",
+ barWidth: vw,
+ itemStyle: {
+ normal: {
+ color: new echarts.graphic.LinearGradient(
+ 0,
+ 0,
+ 0,
+ 1,
+ [
+ {
+ offset: 0,
+ color: "#00b0ff",
+ },
+ {
+ offset: 0.8,
+ color: "#7052f4",
+ },
+ ],
+ false
+ ),
+ },
+ },
+ data: [254, 3254, 1654],
+ },
+ ],
+ };
+
+ charts.setOption(option);
+ $(window).resize(charts.resize);
+
+}
+
// 水平圆角柱状图
const horizontalBarChart = function (data, id) {
let charts = echarts.init(id);
diff --git a/ruoyi-admin/src/main/resources/templates/broad/finalAssemblyProductionData.html b/ruoyi-admin/src/main/resources/templates/broad/finalAssemblyProductionData.html
index 76b63a4..35f9ebc 100644
--- a/ruoyi-admin/src/main/resources/templates/broad/finalAssemblyProductionData.html
+++ b/ruoyi-admin/src/main/resources/templates/broad/finalAssemblyProductionData.html
@@ -27,20 +27,17 @@
-
-
+
+
-
-
+
+
-
-
+
+
-
-
-
-
-
+
+