修改界面

ruoyi-admin/src/main/resources/static/css/board/intelligentRefrigeratorInterconnectionFactory.css

@@ -15,95 +15,114 @@ body {
     background-image: url(../../img/board/intelligentRefrigeratorInterconnectionFactory/btnOneClick.png);
     background-size: 100% 100%;
     position: absolute;
-    height: 10%;
+    height: 5%;
     aspect-ratio: 236/204;
     top: 30%;
-    left: 0%;
+    left: 3%;
 }
 .btnOneRight {
     background-image: url(../../img/board/intelligentRefrigeratorInterconnectionFactory/btnOneClick.png);
     background-size: 100% 100%;
     position: absolute;
-    height: 10%;
+    height: 5%;
     aspect-ratio: 236/204;
     top: 30%;
-    right: 0%;
+    right: 5%;
 }
 .btnTwoLeft {
     background-image: url(../../img/board/intelligentRefrigeratorInterconnectionFactory/btnTwo.png);
     background-size: 100% 100%;
     position: absolute;
-    height: 10%;
+    height: 5%;
     aspect-ratio: 236/204;
-    top: 43%;
-    left: 0%;
+    top: 37%;
+    left: 3%;
 }
 .btnTwoRight {
     background-image: url(../../img/board/intelligentRefrigeratorInterconnectionFactory/btnTwo.png);
     background-size: 100% 100%;
     position: absolute;
-    height: 10%;
+    height: 5%;
     aspect-ratio: 236/204;
-    top: 43%;
-    right: 0%;
+    top: 37%;
+    right: 5%;
 }
 .btnThreeLeft {
     background-image: url(../../img/board/intelligentRefrigeratorInterconnectionFactory/btnThree.png);
     background-size: 100% 100%;
     position: absolute;
-    height: 10%;
+    height: 5%;
     aspect-ratio: 236/204;
-    top: 56%;
-    left: 0%;
+    top: 44%;
+    left: 3%;
 }
 .btnThreeRight {
     background-image: url(../../img/board/intelligentRefrigeratorInterconnectionFactory/btnThree.png);
     background-size: 100% 100%;
     position: absolute;
-    height: 10%;
+    height: 5%;
     aspect-ratio: 236/204;
-    top: 56%;
-    right: 0%;
+    top: 44%;
+    right: 5%;
 }
 .btnFourLeft {
     background-image: url(../../img/board/intelligentRefrigeratorInterconnectionFactory/btnFour.png);
     background-size: 100% 100%;
     position: absolute;
-    height: 10%;
+    height: 5%;
     aspect-ratio: 236/204;
-    top: 69%;
-    left: 0%;
+    top: 51%;
+    left: 3%;
 }
 .btnFourRight {
     background-image: url(../../img/board/intelligentRefrigeratorInterconnectionFactory/btnFour.png);
     background-size: 100% 100%;
     position: absolute;
-    height: 10%;
+    height: 5%;
     aspect-ratio: 236/204;
-    top: 69%;
-    right: 0%;
+    top: 51%;
+    right: 5%;
 }
 .btnFiveLeft {
     background-image: url(../../img/board/intelligentRefrigeratorInterconnectionFactory/btnFive.png);
     background-size: 100% 100%;
     position: absolute;
-    height: 10%;
+    height: 5%;
     aspect-ratio: 236/204;
-    top: 82%;
-    left: 0%;
+    top: 58%;
+    left: 3%;
 }
 .btnFiveRight {
     background-image: url(../../img/board/intelligentRefrigeratorInterconnectionFactory/btnFive.png);
     background-size: 100% 100%;
     position: absolute;
-    height: 10%;
+    height: 5%;
     aspect-ratio: 236/204;
-    top: 82%;
-    right: 0%;
+    top: 58%;
+    right: 5%;
 }
 .arrowsOne,.arrowsTwo,.deviceNameOne,.deviceNameTwo{
     display: none;
 }
+.currentPosition{
+    background-image: url(../../img/board/intelligentRefrigeratorInterconnectionFactory/currentPosition.png);
+    background-size: 100% 100%;
+    position: absolute;
+    aspect-ratio: 211/200;
+    width: 3%;
+    top: 34%;
+    left: 74%;
+    display: block;
+    z-index: -1;
+}
+.currentPositionSpan{
+    position: absolute;
+    top: 6.5%;
+    left: 50%;
+    transform: translateX(-50%);
+    font-size: 0.5vw;
+    white-space: nowrap
+}
 .layerOne{
     background-image: url(../../img/board/intelligentRefrigeratorInterconnectionFactory/layerOne.png);
     background-size: 100% 100%;

ruoyi-admin/src/main/resources/static/css/board/month.css

@@ -38,41 +38,50 @@ body {
     width: 23%;
     height: 35%;
     top: 15%;
-    left: 26.5%;
+    left: 75%;
+}
+.scene{
+    background: url(../../img/board/month/two.jpg) no-repeat;
+    background-size: 100% 100%;
+    position: absolute;
+    width: 23%;
+    height: 35%;
+    top: 15%;
+    left: 50.5%;
 }
 .HighlightOne{
     background-repeat: no-repeat;
     background-size: 100% 100%;
     position: absolute;
     width: 10%;
-    height: 17.5%;
-    top: 15%;
-    left: 50.5%;
+    height: 16.5%;
+    top: 16%;
+    left: 27.5%;
 }
 .HighlightTwo{
     background-repeat: no-repeat;
     background-size: 100% 100%;
     position: absolute;
     width: 10%;
-    height: 17.5%;
-    top: 15%;
-    left: 63.5%;
+    height: 16.5%;
+    top: 16%;
+    left: 38.5%;
 }
 .HighlightThree{
     background-repeat: no-repeat;
     background-size: 100% 100%;
     position: absolute;
     width: 10%;
-    height: 17.5%;
-    top: 33.5%;
-    left: 50.5%;
+    height: 16.5%;
+    top: 34.5%;
+    left: 27.5%;
 }
 .HighlightFour{
     background-repeat: no-repeat;
     background-size: 100% 100%;
     position: absolute;
     width: 10%;
-    height: 17.5%;
-    top: 33.5%;
-    left: 63.5%;
+    height: 16.5%;
+    top: 34.5%;
+    left: 38.5%
 }

ruoyi-admin/src/main/resources/static/css/board/week.css

@@ -72,4 +72,25 @@ body {
     height: 16%;
     top: 76%;
     left: 49.5%;
+}
+.back{
+    display: none;
+}
+.backLeft {
+    background-image: url(../../img/board/week/back.png);
+    background-size: 100% 100%;
+    position: absolute;
+    height: 5%;
+    aspect-ratio: 236/204;
+    top: 53.5%;
+    left: 2%;
+}
+.backRight {
+    background-image: url(../../img/board/week/back.png);
+    background-size: 100% 100%;
+    position: absolute;
+    height: 5%;
+    aspect-ratio: 236/204;
+    top: 53.5%;
+    right: 2%;
 }

ruoyi-admin/src/main/resources/static/js/board/finalAssemblyProductionData.js

@@ -21,24 +21,10 @@ $(() => {
         // LOSS(分类)
         $.post(url + "/selectLossInfo", {}, data => {
             data = JSON.parse(data)
-            let date = new Date()
-            let hour = date.getHours()
-            let minutes = date.getMinutes()
-            let LOSSOne = data.find(val => val.name == '1').qty
-            let LOSSTwo = data.find(val => val.name == '4').qty
-            // if (Number(`${hour}.${minutes}`)>15.3) {
-            //     console.log(1)
-            //     LOSSOne -= 60
-            //     LOSSTwo -= 2
-            // } else if (Number(`${hour}.${minutes}`)>9.3) {
-            //     console.log(2)
-            //     LOSSOne -= 30
-            //     LOSSTwo -= 1
-            // }
-            LOSS(LOSSOne)
+            LOSS(data.find(val => val.name == '1').qty)
             verticalBarChart({
                 xName: ["0-3分钟", "3-10分钟", ">10分钟"],
-                yData: [data.find(val => val.name == '2').qty, data.find(val => val.name == '3').qty, LOSSTwo],
+                yData: [data.find(val => val.name == '2').qty, data.find(val => val.name == '3').qty, data.find(val => val.name == '4').qty],
             }, document.getElementById("LOSSClassify"));
         })
         // 标准节拍
@@ -65,7 +51,6 @@ $(() => {
                 arr[8] = Math.ceil(targetTop.tips / 22)
                 arr[0] = arr[0] - (arr.reduce((val1, val2) => val1 + val2, 0) - targetTop.tips)
                 targetTop.targetArr = arr
-                // targetTop.progress = arr.slice(0, data.length).reduce((val1, val2) => val1 + val2, 0)
                 let num = 0
                 arr.forEach((val,index) => {
                     if(data[index].qty){

ruoyi-admin/src/main/resources/static/js/board/intelligentRefrigeratorInterconnectionFactory.js

@@ -1,31 +1,31 @@
 $(() => {
     deviceNameOne('机器人生产车间', 13, 44)
-    deviceNameOne('门壳成型线', 18, 35)
-    deviceNameOne('26工位门体发泡线', 17, 50)
-    deviceNameOne('门体集存库', 18, 70)
-    deviceNameOne('澳柯玛直播间', 25, 25)
-    deviceNameOne('箱体发泡集存库', 26, 36)
-    deviceNameOne('28工位箱体发泡线', 37, 63)
-    deviceNameOne('箱壳自动成型线', 43, 51)
-    deviceNameOne('成品分垛入库', 37, 18)
-    deviceNameOne('内胆库生产线', 51, 47)
+    deviceNameOne('门壳成型线', 18, 25)
+    deviceNameOne('26工位门体发泡线', 18, 59)
+    deviceNameOne('门体集存库', 17, 70)
+    deviceNameOne('澳柯玛直播间', 28, 22)
+    deviceNameOne('预装箱体集存库', 26, 36)
+    deviceNameOne('28工位箱体发泡线', 25, 59)
+    deviceNameOne('箱壳自动成型线', 37, 48)
+    deviceNameOne('成品分垛入库', 44, 18)
+    deviceNameOne('内胆底生产线', 52, 43)
     deviceNameOne('压合区', 57, 61)
-    deviceNameOne('展厅', 45, 80)
-    deviceNameOne('内胆预装线', 60, 50)
+    deviceNameOne('展厅', 49, 80)
+    deviceNameOne('蒸发器绕管机', 60, 43.5)
     deviceNameOne('内胆壁生产线', 58, 84)
 
     deviceNameTwo('发泡箱体集存库', 13, 72)
     deviceNameTwo('总装线', 11, 62)
     deviceNameTwo('抽空线', 11, 30)
-    deviceNameTwo('灌注机', 12, 43)
-    deviceNameTwo('安全检测', 13, 64)
-    deviceNameTwo('成品检漏', 13, 52)
+    deviceNameTwo('灌注机', 13, 43)
+    deviceNameTwo('安全检测', 13, 55)
+    deviceNameTwo('成品检漏', 13, 49)
     deviceNameTwo('测温性能检测', 24, 55)
     deviceNameTwo('终检', 25, 29)
-    deviceNameTwo('自动装箱', 29, 18)
-    deviceNameTwo('自动打包', 34, 17)
-    deviceNameTwo('成品库', 40, 17)
-    deviceNameTwo('壳箱组装', 37, 35)
+    deviceNameTwo('自动装箱', 28, 20)
+    deviceNameTwo('自动打包', 35.2, 18.3)
+    deviceNameTwo('成品下线', 40, 18)
+    deviceNameTwo('壳胆组装', 37, 35)
     deviceNameTwo('箱壳集存库', 35, 75)
     deviceNameTwo('内胆集存库', 45, 60)
     deviceNameTwo('内胆检漏',  47,  34)
@@ -38,7 +38,7 @@ $(() => {
         data.now = 2
     })
     btnThree.click(() => {
-        location.href='http://localhost:9090/broad/week'
+        location.href=`${window.location.protocol}//${window.location.host}/broad/week?type=1`
     })
     btnFour.click(() => {
         data.four = !(data.four)
@@ -65,6 +65,7 @@ const arrowsOne = $('#arrowsOne')
 const arrowsTwo = $('#arrowsTwo')
 const deviceNameOneDiv = $('#deviceNameOne')
 const deviceNameTwoDiv = $('#deviceNameTwo')
+const currentPosition = $('.currentPosition')
 
 const deviceNameOne = (val = '', top = 0, left = 0) => {
     const html = `
@@ -102,12 +103,14 @@ const flash = () => {
     if (data.now === 1){
         btnOne.css({backgroundImage: 'url(../../img/board/intelligentRefrigeratorInterconnectionFactory/btnOneClick.png)'})
         btnTwo.css({backgroundImage: 'url(../../img/board/intelligentRefrigeratorInterconnectionFactory/btnTwo.png)'})
+        currentPosition.css({display: 'block'})
         layerOne.css({display: 'block'})
         layerTwo.css({display: 'none'})
     }
     if (data.now === 2){
         btnOne.css({backgroundImage: 'url(../../img/board/intelligentRefrigeratorInterconnectionFactory/btnOne.png)'})
         btnTwo.css({backgroundImage: 'url(../../img/board/intelligentRefrigeratorInterconnectionFactory/btnTwoClick.png)'})
+        currentPosition.css({display: 'none'})
         layerOne.css({display: 'none'})
         layerTwo.css({display: 'block'})
     }

ruoyi-admin/src/main/resources/static/js/board/month.js

@@ -6,28 +6,25 @@ $(() => {
     // 轮询间隔时间
     const INTERVAL = 30000
 
-
     autoUpdate(url + "/selectUserSatisfaction", INTERVAL, data => {
-        multipleVerticalBarChartThree({
-            xName: data.map(val => val.yearName),
-            yDataOne: data.map(val => val.productRate),
-            yDataOneName: '产品体验',
-            yDataTwo: data.map(val => val.shoppingRate),
-            yDataTwoName: "购物体验",
-            yDataThree: data.map(val => val.serviceRate),
-            yDataThreeName: "服务体验",
-            yDataFour: data.map(val => val.orderRate),
-            yDataFourName: "订单履行率",
-        }, document.getElementById("satisfaction"), )
+        console.log(data)
+        multipleVerticalBarChartTwo({
+            xName: ['产品体验', "购物体验","服务体验","订单履行率"],
+            yDataOne: [data[0].productRate, data[0].shoppingRate,data[0].serviceRate,data[0].orderRate],
+            yDataOneName: ''+data.map(val => val.yearName)[0],
+            yDataTwo: [data[1].productRate, data[1].shoppingRate,data[1].serviceRate,data[1].orderRate],
+            yDataTwoName: ''+data.map(val => val.yearName)[1],
+        }, document.getElementById("satisfaction"),undefined,'%')
     })
     autoUpdate(url + "/selectProductInStoreGroupMonth", INTERVAL, data => {
+
+        total(data.map(val => val.qty).reduce((val1,val2) => val1 + val2,0),'#total')
         verticalBarChart({
             xName: data.map(val => `${val.name}月`),
             yData: data.map(val => val.qty),
         }, document.getElementById("outputStatistics"), '')
     })
     autoUpdate(url + "/selectHighlightProducts", INTERVAL, data => {
-        console.log(data)
         let url = data.map(val =>val.picturePath)
         $('#HighlightOne').css({backgroundImage:`url("http://10.100.70.5:9090/${url[0]}")`})
         $('#HighlightTwo').css({backgroundImage:`url("http://10.100.70.5:9090/${url[1]}")`})
@@ -54,11 +51,11 @@ const curWeek = () => {
 
 const moduleTitle = () => {
     const html = `
-    <span style="position: absolute;top: 0.9%;left: 50%;color: #fff;font-size: 1.3vw;transform: translateX(-50%);letter-spacing: 0.3vw">第${(new Date().getMonth()+1).toString()}月 生产数据分析平台</span>
+    <span style="position: absolute;top: 0.9%;left: 50%;color: #fff;font-size: 1.3vw;transform: translateX(-50%);letter-spacing: 0.3vw">智能冷柜集成控制中心</span>
     <span style="position: absolute;top: 10%;left: 3.3%;color: #CFD2D0;font-size: 1.0vw">用户满意度</span>
-    <span style="position: absolute;top: 10%;left: 27.6%;color: #CFD2D0;font-size: 1.0vw">工业互联网生态圈</span>
-    <span style="position: absolute;top: 10%;left: 51.5%;color: #CFD2D0;font-size: 1.0vw">亮点产品</span>
-    <span style="position: absolute;top: 10%;left: 76%;color: #CFD2D0;font-size: 1.0vw">周生产型号统计</span>
+    <span style="position: absolute;top: 10%;left: 27.6%;color: #CFD2D0;font-size: 1.0vw">产品升级</span>
+    <span style="position: absolute;top: 10%;left: 51.5%;color: #CFD2D0;font-size: 1.0vw">场景升级</span>
+    <span style="position: absolute;top: 10%;left: 76%;color: #CFD2D0;font-size: 1.0vw">全价值链</span>
     <span style="position: absolute;top: 54.5%;left: 3.3%;color: #CFD2D0;font-size: 1.0vw">产量统计</span>
     <span style="position: absolute;top: 54.5%;left: 27.6%;color: #CFD2D0;font-size: 1.0vw">品质提升</span>
     <span style="position: absolute;top: 54.5%;left: 51.5%;color: #CFD2D0;font-size: 1.0vw">周质量分析</span>
@@ -69,7 +66,7 @@ const moduleTitle = () => {
 
 const total = (val1 = 0, el) => {
     const html = `
-    <span style="position: absolute;top: 10%;left: 17.7%;color: #fff;font-size: 1vw;">合计：${val1} 台</span>
+    <span style="position: absolute;top: 54.2%;left: 10.7%;color: #fff;font-size: 1vw;">${new Date().getFullYear()}年 合计：${val1} 台</span>
     `
     $(el).html(html)
 }

ruoyi-admin/src/main/resources/static/js/board/week.js

@@ -8,6 +8,15 @@ $(() => {
     const INTERVAL = 30000
     const orderDetailsTable = new AutoScrollTable(document.getElementById("IQC"), ["编号", "型号", "计划数量", "完成数量", "差异值"], {width: ['13%', '40%', null, null, '9%']}, 8)
 
+    const back = $('#backLeft')
+    back.push($('#backRight')[0])
+    const backDiv = $('#back')
+    if (location.href.split('?')[1]?.split('=')[1] == '1'){
+        backDiv.css({display:'block'})
+    }
+    back.click(() => {
+        location.href=`${window.location.protocol}//${window.location.host}/broad/factory`
+    })
     //每日人力出勤轮询
     autoUpdate("/broad/mtk/team6s ", INTERVAL, data => {
         data.sort((a, b) => {
@@ -66,7 +75,7 @@ $(() => {
 
     // 周质量分析
     autoUpdate(url + "/zhou_selectQaItemInfo", INTERVAL, data => {
-        let arr = [0, 0, 0, 0, 0, 0]
+        let arr = [100, 100, 100, 100, 100, 100]
         let yDataOne = [...(data.find(val => val.code == '内胆检漏')?.list.map(val => val.rate) || []), ...arr]
         let yDataTwo = [...(data.find(val => val.code == '安全检测')?.list.map(val => val.rate) || []), ...arr]
         let yDataThree = [...(data.find(val => val.code == '成品检漏')?.list.map(val => val.rate) || []), ...arr]
@@ -149,8 +158,8 @@ const curWeek = () => {
 
 const moduleTitle = () => {
     const html = `
-    <span style="position: absolute;top: 0.9%;left: 50%;color: #fff;font-size: 1.3vw;transform: translateX(-50%);letter-spacing: 0.3vw">第${curWeek()}周 生产数据分析平台</span>
-    <span style="position: absolute;top: 10%;left: 5.5%;color: #CFD2D0;font-size: 1.0vw">第${curWeek()}周 产量统计 </span>
+    <span style="position: absolute;top: 0.9%;left: 50%;color: #fff;font-size: 1.3vw;transform: translateX(-50%);letter-spacing: 0.3vw">第${curWeek()}周 生产数据管控平台</span>
+    <span style="position: absolute;top: 10%;left: 5.5%;color: #CFD2D0;font-size: 1.0vw">产量统计 </span>
     <span style="position: absolute;top: 10%;left: 32%;color: #CFD2D0;font-size: 1.0vw">周订单执行情况</span>
     <span style="position: absolute;top: 10%;left: 73.5%;color: #CFD2D0;font-size: 1.0vw">班组 6s 排行榜</span>
     <span style="position: absolute;top: 54.5%;left: 5.5%;color: #CFD2D0;font-size: 1.0vw">周生产型号统计</span>

ruoyi-admin/src/main/resources/static/js/echartsCommon.js

@@ -952,6 +952,7 @@ const lineChart = function (data, id) {
             yDataName: "提升百分比"
         }
     }
+    let min = Math.ceil(Math.min(...data.yData))
     let option = {
         grid: {
             top: '34%',
@@ -994,6 +995,8 @@ const lineChart = function (data, id) {
         },
         yAxis: [
             {
+                min:min - 2,
+                max:100,
                 type: 'value',
                 nameTextStyle: {
                     color: '#393939',
@@ -1508,7 +1511,7 @@ const multipleVerticalBarChart = function (data, id) {
     charts.setOption(option);
     $(window).resize(charts.resize);
 }
-const multipleVerticalBarChartTwo = function (data, id, rotate = 0) {
+const multipleVerticalBarChartTwo = function (data, id, rotate = 0,unit='') {
     let charts = echarts.init(id);
     if (!data) {
         data = {
@@ -1579,15 +1582,17 @@ const multipleVerticalBarChartTwo = function (data, id, rotate = 0) {
                 emphasis: {
                     focus: 'series'
                 },
+                barWidth:'30%',
                 itemStyle: {
                     //图形样式
                     normal: {
-                        color: "#1FEDCA",
+                        color: "#64BCEC",
                     },
                 },
                 label: {
                     show: true,
                     position: "top",
+                    formatter: `{c}${unit}`,
                     textStyle: {
                         color: "rgba(255,255,255,0.5)",
                         fontSize: 0.75 * vw
@@ -1601,9 +1606,12 @@ const multipleVerticalBarChartTwo = function (data, id, rotate = 0) {
                 emphasis: {
                     focus: 'series'
                 },
+                barWidth:'30%',
+                barGap:'40%',
                 label: {
                     show: true,
                     position: "top",
+                    formatter: `{c}${unit}`,
                     textStyle: {
                         color: "rgba(255,255,255,0.5)",
                         fontSize: 0.75 * vw
@@ -1612,7 +1620,7 @@ const multipleVerticalBarChartTwo = function (data, id, rotate = 0) {
                 itemStyle: {
                     //图形样式
                     normal: {
-                        color: "#E65454",
+                        color: "#4FD3B9",
                     },
                 },
                 data: data.yDataTwo

ruoyi-admin/src/main/resources/templates/broad/box.html

@@ -411,7 +411,7 @@
             location.reload()
         }
 
-        setCronTak(flash, "* 30 7,19 * * * *");
+        setCronTak(flash, "30 30,35 7,19 * * * *");
 
         let url = '/broad/box'
         //生产计划工单

ruoyi-admin/src/main/resources/templates/broad/intelligentRefrigeratorInterconnectionFactory.html

@@ -51,6 +51,10 @@
 <!--工厂图-->
 <div class="layerOne" id="layerOne"></div>
 <div class="layerTwo" id="layerTwo"></div>
+<!--当前位置-->
+<div id="currentPosition" class="currentPosition">
+    <span class="currentPositionSpan">当前位置</span>
+</div>
 <!--介绍窗口-->
 <div class='infoOne' id='infoOne'>
     <span style="position: absolute;top: 10%;left: 6%;width:90%;color: red;font-size: 0.9vw;font-weight: 600">智能制造</span>

ruoyi-admin/src/main/resources/templates/broad/month.html

@@ -27,6 +27,7 @@
 </head>
 <body style="display:flex;">
 <div id="Tips"></div>
+<div id="total"></div>
 
 <!--用户满意度-->
 <div class="satisfaction" id="satisfaction"></div>
@@ -37,6 +38,9 @@
 <!--品质提升-->
 <div class="quality" id="quality"></div>
 
+<!--场景升级-->
+<div class="scene" id="scene"></div>
+
 <!--工业互联网生态圈-->
 <div class="ecosphere" id="ecosphere"></div>
 

ruoyi-admin/src/main/resources/templates/broad/week.html

@@ -52,6 +52,11 @@
 <!--设备功率-->
 <div class="topLeft" id="topLeft"></div>
 
+<!--返回-->
+<div class="back" id="back">
+<div class="backLeft" id="backLeft"></div>
+<div class="backRight" id="backRight"></div>
+</div>
 </body>
 <script src="../../static/js/board/week.js" th:src="@{/js/board/week.js}"></script>
 <script>