新增界面
parent
969c408024
commit
a2b931d578
@ -0,0 +1,32 @@
|
||||
package com.ruoyi.web.controller.broad;
|
||||
|
||||
import com.alibaba.fastjson.JSONArray;
|
||||
import com.alibaba.fastjson.JSONObject;
|
||||
import com.ruoyi.system.domain.BoxOutput;
|
||||
import com.ruoyi.system.service.IBroadDataService;
|
||||
import io.swagger.annotations.ApiOperation;
|
||||
import org.springframework.beans.factory.annotation.Autowired;
|
||||
import org.springframework.stereotype.Controller;
|
||||
import org.springframework.web.bind.annotation.*;
|
||||
|
||||
import java.text.SimpleDateFormat;
|
||||
import java.util.ArrayList;
|
||||
import java.util.List;
|
||||
|
||||
/**
|
||||
* @author wanghao
|
||||
* @date 2022/7/7 13:31
|
||||
*/
|
||||
@Controller
|
||||
@RequestMapping("/broad/beforeLibrary")
|
||||
public class BeforeLibraryController {
|
||||
|
||||
@Autowired
|
||||
private IBroadDataService service;
|
||||
|
||||
@GetMapping()
|
||||
public String box() {
|
||||
return "broad/beforeLibrary";
|
||||
}
|
||||
|
||||
}
|
||||
@ -0,0 +1,25 @@
|
||||
package com.ruoyi.web.controller.broad;
|
||||
|
||||
import com.ruoyi.system.service.IBroadDataService;
|
||||
import org.springframework.beans.factory.annotation.Autowired;
|
||||
import org.springframework.stereotype.Controller;
|
||||
import org.springframework.web.bind.annotation.GetMapping;
|
||||
import org.springframework.web.bind.annotation.RequestMapping;
|
||||
|
||||
/**
|
||||
* @author wanghao
|
||||
* @date 2022/7/7 13:31
|
||||
*/
|
||||
@Controller
|
||||
@RequestMapping("/broad/finalAssemblyProductionData")
|
||||
public class FinalAssemblyProductionDataController {
|
||||
|
||||
@Autowired
|
||||
private IBroadDataService service;
|
||||
|
||||
@GetMapping()
|
||||
public String box() {
|
||||
return "broad/finalAssemblyProductionData";
|
||||
}
|
||||
|
||||
}
|
||||
@ -0,0 +1,52 @@
|
||||
body {
|
||||
height: auto;
|
||||
width: auto;
|
||||
background: url(../../img/board/beforeLibrary/backgroundImg.jpg) no-repeat center fixed;
|
||||
-webkit-background-size: cover;
|
||||
-moz-background-size: cover;
|
||||
-o-background-size: cover;
|
||||
background-size: 100% 100%;
|
||||
color: rgba(255, 255, 255, .95);
|
||||
font: normal 100% Arial, sans-serif;
|
||||
}
|
||||
|
||||
.orderDetails {
|
||||
position: absolute;
|
||||
width: 30.2%;
|
||||
height: 20%;
|
||||
top: 15%;
|
||||
left: 3.4%;
|
||||
}
|
||||
|
||||
.orderQuantityFulfillmentRateOfTheDay {
|
||||
position: absolute;
|
||||
width: 30%;
|
||||
height: 20%;
|
||||
top: 15%;
|
||||
left: 35%;
|
||||
}
|
||||
|
||||
.FinishedGoodsWarehousingStatisticsByHour{
|
||||
position: absolute;
|
||||
width: 93%;
|
||||
height: 21.5%;
|
||||
top: 44%;
|
||||
left: 3.3%;
|
||||
}
|
||||
|
||||
.PropertyInsuranceOneDayOrderInfo {
|
||||
position: absolute;
|
||||
width: 61.8%;
|
||||
height: 21%;
|
||||
top: 74%;
|
||||
left: 3.4%;
|
||||
}
|
||||
|
||||
.distributionOfBadTypesInProductionLineByDay{
|
||||
position: absolute;
|
||||
width: 30%;
|
||||
height: 20%;
|
||||
top: 74%;
|
||||
left: 66.6%;
|
||||
|
||||
}
|
||||
@ -0,0 +1,11 @@
|
||||
body {
|
||||
height: auto;
|
||||
width: auto;
|
||||
background: url(../../img/board/finalAssemblyProductionData/backgroundImg.jpg) no-repeat center fixed;
|
||||
-webkit-background-size: cover;
|
||||
-moz-background-size: cover;
|
||||
-o-background-size: cover;
|
||||
background-size: 100% 100%;
|
||||
color: rgba(255, 255, 255, .95);
|
||||
font: normal 100% Arial, sans-serif;
|
||||
}
|
||||
Binary file not shown.
|
After Width: | Height: | Size: 851 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 790 KiB |
@ -0,0 +1,37 @@
|
||||
$(() => {
|
||||
// 公共请求地址
|
||||
let url = '/broad/box'
|
||||
|
||||
// 表格头
|
||||
const planWorkOrderColumns = [
|
||||
"编号", "计划数量", "完成数量", "差异值", "时间",
|
||||
]
|
||||
|
||||
// 订单详情
|
||||
const orderDetailsTable = new AutoScrollTable(document.getElementById("orderDetails"), planWorkOrderColumns, {width: ['30%', null, null, null, '17%']})
|
||||
|
||||
// 产线当日订单信息
|
||||
const PropertyInsuranceOneDayOrderInfoTable = new AutoScrollTable(document.getElementById("PropertyInsuranceOneDayOrderInfo"), planWorkOrderColumns, {width: ['30%', null, null, null, '17%']})
|
||||
|
||||
// 当日订单数量达成率
|
||||
horizontalRoundedBarChartWithBackground(null, document.getElementById("orderQuantityFulfillmentRateOfTheDay"));
|
||||
|
||||
// 成品入库统计
|
||||
barChartAndLineChart(null, document.getElementById("FinishedGoodsWarehousingStatisticsByHour"));
|
||||
|
||||
// 产线不良类型分布
|
||||
pieChart(null, document.getElementById("distributionOfBadTypesInProductionLineByDay"));
|
||||
|
||||
//订单详情轮询
|
||||
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))
|
||||
})
|
||||
|
||||
//产线当日订单信息轮询
|
||||
autoUpdate(url+"/getProductPlanInfo ", INTERVAL, data => {
|
||||
PropertyInsuranceOneDayOrderInfoTable.loadData(data.map(value => [value.plan_code, value.plan_number, value.actual_number, value.plan_number-value.actual_number, value.day]), Object.keys(planWorkOrderColumns))
|
||||
})
|
||||
|
||||
})
|
||||
|
||||
|
||||
File diff suppressed because it is too large
Load Diff
@ -0,0 +1,49 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="zh" xmlns:th="http://www.thymeleaf.org">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta content="width=device-width,initial-scale=1.0,maximum-scale=1.0,minimum-scale=1.0,user-scalable=no"
|
||||
name="viewport">
|
||||
<title>箱壳成型数据监控平台</title>
|
||||
<meta content="箱壳成型数据监控平台" name="description">
|
||||
<link href="../../static/css/board/beforeLibrary.css" rel="stylesheet" th:href="@{/css/board/beforeLibrary.css}"/>
|
||||
<link href="../../static/css/materialdesignicons.min.css" rel="stylesheet"
|
||||
th:href="@{/css/materialdesignicons.min.css}"/>
|
||||
<link href="../../static/css/autoscroll-table.css" rel="stylesheet" th:href="@{/css/autoscroll-table.css}">
|
||||
<!-- 360浏览器急速模式 -->
|
||||
<meta content="webkit" name="renderer">
|
||||
<!-- 避免IE使用兼容模式 -->
|
||||
<meta content="IE=edge" http-equiv="X-UA-Compatible">
|
||||
<script src="../../static/js/jquery.min.js" th:src="@{/js/jquery.min.js}"></script>
|
||||
<th:block th:include="include :: footer"/>
|
||||
<th:block th:include="include :: echarts-js"/>
|
||||
<script src="../../static/js/date-time-common.js" th:src="@{/js/date-time-common.js}"></script>
|
||||
<script src="../../static/js/autoscroll-table.js" th:src="@{/js/autoscroll-table.js}"></script>
|
||||
<script src="../../static/js/echartsCommon.js" th:src="@{/js/echartsCommon.js}"></script>
|
||||
<script src="../../static/js/update-split-blocks.js" th:src="@{/js/update-split-blocks.js}"></script>
|
||||
<script src="../../static/js/auto-update.js" th:src="@{/js/auto-update.js}"></script>
|
||||
<script src="../../static/js/data-merger.js" th:src="@{/js/data-merger.js}"></script>
|
||||
|
||||
</head>
|
||||
<body style="display:flex;">
|
||||
|
||||
<!--订单详情-->
|
||||
<div class="orderDetails" id="orderDetails"></div>
|
||||
|
||||
<!--当日订单数量达成率-->
|
||||
<div class="orderQuantityFulfillmentRateOfTheDay" id="orderQuantityFulfillmentRateOfTheDay"></div>
|
||||
|
||||
<!--成品入库统计-->
|
||||
<div class="FinishedGoodsWarehousingStatisticsByHour" id="FinishedGoodsWarehousingStatisticsByHour"></div>
|
||||
|
||||
<!--产线当日订单信息-->
|
||||
<div class="PropertyInsuranceOneDayOrderInfo" id="PropertyInsuranceOneDayOrderInfo"></div>
|
||||
|
||||
<!--产线不良类型分布-->
|
||||
<div class="distributionOfBadTypesInProductionLineByDay" id="distributionOfBadTypesInProductionLineByDay"></div>
|
||||
|
||||
</body>
|
||||
<script src="../../static/js/board/beforeLibrary.js" th:src="@{/js/board/beforeLibrary.js}"></script>
|
||||
<script>
|
||||
</script>
|
||||
</html>
|
||||
@ -0,0 +1,49 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="zh" xmlns:th="http://www.thymeleaf.org">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta content="width=device-width,initial-scale=1.0,maximum-scale=1.0,minimum-scale=1.0,user-scalable=no"
|
||||
name="viewport">
|
||||
<title>箱壳成型数据监控平台</title>
|
||||
<meta content="箱壳成型数据监控平台" name="description">
|
||||
<link href="../../static/css/board/finalAssemblyProductionData.css" rel="stylesheet" th:href="@{/css/board/finalAssemblyProductionData.css}"/>
|
||||
<link href="../../static/css/materialdesignicons.min.css" rel="stylesheet"
|
||||
th:href="@{/css/materialdesignicons.min.css}"/>
|
||||
<link href="../../static/css/autoscroll-table.css" rel="stylesheet" th:href="@{/css/autoscroll-table.css}">
|
||||
<!-- 360浏览器急速模式 -->
|
||||
<meta content="webkit" name="renderer">
|
||||
<!-- 避免IE使用兼容模式 -->
|
||||
<meta content="IE=edge" http-equiv="X-UA-Compatible">
|
||||
<script src="../../static/js/jquery.min.js" th:src="@{/js/jquery.min.js}"></script>
|
||||
<th:block th:include="include :: footer"/>
|
||||
<th:block th:include="include :: echarts-js"/>
|
||||
<script src="../../static/js/date-time-common.js" th:src="@{/js/date-time-common.js}"></script>
|
||||
<script src="../../static/js/autoscroll-table.js" th:src="@{/js/autoscroll-table.js}"></script>
|
||||
<script src="../../static/js/echartsCommon.js" th:src="@{/js/echartsCommon.js}"></script>
|
||||
<script src="../../static/js/update-split-blocks.js" th:src="@{/js/update-split-blocks.js}"></script>
|
||||
<script src="../../static/js/auto-update.js" th:src="@{/js/auto-update.js}"></script>
|
||||
<script src="../../static/js/data-merger.js" th:src="@{/js/data-merger.js}"></script>
|
||||
|
||||
</head>
|
||||
<body style="display:flex;">
|
||||
|
||||
<!--订单详情-->
|
||||
<div class="orderDetails" id="orderDetails"></div>
|
||||
|
||||
<!--当日订单数量达成率-->
|
||||
<div class="orderQuantityFulfillmentRateOfTheDay" id="orderQuantityFulfillmentRateOfTheDay"></div>
|
||||
|
||||
<!--成品入库统计-->
|
||||
<div class="FinishedGoodsWarehousingStatisticsByHour" id="FinishedGoodsWarehousingStatisticsByHour"></div>
|
||||
|
||||
<!--产线当日订单信息-->
|
||||
<div class="PropertyInsuranceOneDayOrderInfo" id="PropertyInsuranceOneDayOrderInfo"></div>
|
||||
|
||||
<!--产线不良类型分布-->
|
||||
<div class="distributionOfBadTypesInProductionLineByDay" id="distributionOfBadTypesInProductionLineByDay"></div>
|
||||
|
||||
</body>
|
||||
<script src="../../static/js/board/finalAssemblyProductionData.js" th:src="@{/js/board/finalAssemblyProductionData.js}"></script>
|
||||
<script>
|
||||
</script>
|
||||
</html>
|
||||
Loading…
Reference in New Issue