wenjy
/
aucma-scada-visual-board-new
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

添加轮询

Browse Source
master
夜笙歌 2 years ago
parent a2b8eeb4ab
commit d7bbea4dcb
57 changed files with 1586 additions and 1495 deletions
Show Stats Download Patch File Download Diff File

9
productionboard/src/main/resources/static/css/adsorptionTank/style.css
Unescape Escape View File

@ -7,7 +7,7 @@ body {
background-size: 100% 100%;
}
.statisticalOutputByModel{
.statisticalOutputByModel {
border: 0px solid red;;
position: absolute;
width: 45.5%;
@ -16,7 +16,7 @@ body {
left: 3.5%;
}
.inventoryStatistics{
.inventoryStatistics {
border: 0px solid red;;
position: absolute;
width: 45.5%;
@ -25,7 +25,7 @@ body {
right: 3.5%;
}
.hourlyOutputStatistics{
.hourlyOutputStatistics {
border: 0px solid red;;
position: absolute;
width: 93%;
@ -33,7 +33,8 @@ body {
top: 23%;
left: 3.5%;
}
.span_c{
.span_c {
margin-left: 5%;
margin-right: 10% !important;
}

8
productionboard/src/main/resources/static/css/aluminumLiner/style.css
Unescape Escape View File

@ -4,7 +4,7 @@ body {
}
.dataInformation{
.dataInformation {
border: 0px solid red;
position: absolute;
width: 24%;
@ -13,7 +13,8 @@ body {
left: 3.3%;
font-size: 10% !important;
}
.synthetic{
.synthetic {
font-size: 10% !important;
}
@ -63,6 +64,7 @@ body {
left: 3.5%;
font-size: 9%;
}
.productionPlan .tbody .tr .td:first-child{
.productionPlan .tbody .tr .td:first-child {
font-size: 12px;
}

9
productionboard/src/main/resources/static/css/aluminumTank/style.css
Unescape Escape View File

@ -7,7 +7,7 @@ body {
background-size: 100% 100%;
}
.statisticalOutputByModel{
.statisticalOutputByModel {
border: 0px solid red;
position: absolute;
width: 45.5%;
@ -16,7 +16,7 @@ body {
left: 3.5%;
}
.inventoryStatistics{
.inventoryStatistics {
border: 0px solid red;
position: absolute;
width: 45.5%;
@ -25,7 +25,7 @@ body {
right: 3.5%;
}
.hourlyOutputStatistics{
.hourlyOutputStatistics {
border: 0px solid red;
position: absolute;
width: 93%;
@ -33,7 +33,8 @@ body {
bottom: 4.5%;
left: 3.5%;
}
.span_c{
.span_c {
margin-left: 5%;
margin-right: 10% !important;
}

12
productionboard/src/main/resources/static/css/common/ondutyplan.css
Unescape Escape View File

@ -1,4 +1,4 @@
.onDutyPlan{
.onDutyPlan {
width: 13%;
height: 5.6%;
position: absolute;
@ -22,22 +22,22 @@
margin-right: 0;
}
.theCurrentTeam{
.theCurrentTeam {
left: 9.8%;
color: #6ACBFE;
}
.scheduledProduction{
.scheduledProduction {
left: 34.4%;
color: #FFAE00;
}
.actualOutPut{
.actualOutPut {
left: 59%;
color:#A0FF00;
color: #A0FF00;
}
.differenceValue{
.differenceValue {
left: 83.6%;
color: #F51F1E;
}

9
productionboard/src/main/resources/static/css/preassemble/style.css
Unescape Escape View File

@ -7,7 +7,7 @@ body {
background-size: 100% 100%;
}
.statisticalOutputByModel{
.statisticalOutputByModel {
border: 0px solid red;
position: absolute;
width: 45.5%;
@ -16,7 +16,7 @@ body {
left: 3.5%;
}
.inventoryStatistics{
.inventoryStatistics {
border: 0px solid red;
position: absolute;
width: 45.5%;
@ -25,7 +25,7 @@ body {
right: 3.5%;
}
.hourlyOutputStatistics{
.hourlyOutputStatistics {
border: 0px solid red;
position: absolute;
width: 93%;
@ -33,7 +33,8 @@ body {
top: 23%;
left: 3.5%;
}
.span_c{
.span_c {
margin-left: 5%;
margin-right: 10% !important;
}

28
productionboard/src/main/resources/static/css/storage/style.css
Unescape Escape View File

@ -23,9 +23,9 @@ body {
}
.scheduledProduction {
left: 55.2%;
color:#A0FF00;
}
left: 55.2%;
color: #A0FF00;
}
.actualOutPut {
left: 69.7%;
@ -34,10 +34,10 @@ body {
.differenceValue {
left: 82.9%;
color:#A0FF00;
color: #A0FF00;
}
.productionPlan{
.productionPlan {
position: absolute;
border: 0px solid red;
width: 33%;
@ -47,7 +47,7 @@ body {
font-size: 12%;
}
.theCurrentInventory{
.theCurrentInventory {
position: absolute;
border: 0px solid red;
width: 33%;
@ -57,52 +57,52 @@ body {
font-size: 12%;
}
.emptyLocation{
.emptyLocation {
position: absolute;
border: 0px solid red;
width: 4%;
height: 4%;
top: 48.3%;
color:#6BFF71;
color: #6BFF71;
font-size: 14%;
display: flex;
align-items: center;
justify-content: center;
}
.haveUsedLocation{
.haveUsedLocation {
position: absolute;
border: 0px solid red;
width: 4%;
height: 4%;
top: 65%;
color:#FF9768;
color: #FF9768;
font-size: 14%;
display: flex;
align-items: center;
justify-content: center;
}
.emptyLocationRatio{
.emptyLocationRatio {
position: absolute;
border: 0px solid red;
width: 4%;
height: 4%;
bottom: 10%;
color:#FF9768;
color: #FF9768;
font-size: 14%;
display: flex;
align-items: center;
justify-content: center;
}
.haveUsedLocationRatio{
.haveUsedLocationRatio {
position: absolute;
border: 0px solid red;
width: 4%;
height: 4%;
bottom: 10%;
color:#FF9768;
color: #FF9768;
font-size: 14%;
display: flex;
align-items: center;

8
productionboard/src/main/resources/static/css/tankShell/style.css
Unescape Escape View File

@ -7,7 +7,7 @@ body {
background-size: 100% 100%;
}
.statisticalOutputByModel{
.statisticalOutputByModel {
border: 0px solid red;
position: absolute;
width: 45.5%;
@ -16,7 +16,7 @@ body {
left: 3.5%;
}
.inventoryStatistics{
.inventoryStatistics {
border: 0px solid red;
position: absolute;
width: 45.5%;
@ -25,7 +25,7 @@ body {
right: 3.5%;
}
.hourlyOutputStatistics{
.hourlyOutputStatistics {
border: 0px solid red;
position: absolute;
width: 93%;
@ -34,7 +34,7 @@ body {
left: 3.5%;
}
.span_c{
.span_c {
margin-left: 5%;
margin-right: 10% !important;
}

37
productionboard/src/main/resources/static/js/adsorptionTank/index.js
Unescape Escape View File

@ -1,25 +1,28 @@
$(() => {
// onDutyPlan(1234,1202,33);
$.getJSON('/adsorptionTank/getTeamStatisticsJson', function (result) {
// alert(result.actualAmount+"\t"+ result.differenceAmount)
storageStatistics(result.className, result.planAmount, result.actualAmount, result.differenceAmount,)
});
let fun = () => {
$.getJSON('/adsorptionTank/getTeamStatisticsJson', function (result) {
// alert(result.actualAmount+"\t"+ result.differenceAmount)
storageStatistics(result.className, result.planAmount, result.actualAmount, result.differenceAmount,)
});
//按型号统计产量
$.getJSON('/adsorptionTank/getMaterialProdutionJson', function (result) {
horizontalBarChart(result, document.getElementById("statisticalOutputByModel"));
});
//按型号统计产量
$.getJSON('/adsorptionTank/getMaterialProdutionJson', function (result) {
horizontalBarChart(result, document.getElementById("statisticalOutputByModel"));
});
//小时产量
$.getJSON('/adsorptionTank/getHourProdutionJson', function (result) {
brokenLineAreaDiagram(result, document.getElementById("hourlyOutputStatistics"));
});
//小时产量
$.getJSON('/adsorptionTank/getHourProdutionJson', function (result) {
brokenLineAreaDiagram(result, document.getElementById("hourlyOutputStatistics"));
});
//库存统计
$.getJSON('/adsorptionTank/getMaterialStoreJson', function (result) {
threeDimensionalCylindrical(result, document.getElementById("inventoryStatistics"));
});
//库存统计
$.getJSON('/adsorptionTank/getMaterialStoreJson', function (result) {
threeDimensionalCylindrical(result, document.getElementById("inventoryStatistics"));
});
setTimeout(fun, 10000)
}
fun()
})

131
productionboard/src/main/resources/static/js/aluminumLiner/index.js
Unescape Escape View File

@ -1,75 +1,80 @@
$(() => {
let fun = () => {
//数据信息
$.getJSON('/aluminumLiner/getDataInformation', function (result) {
const statusArray = [1, 0, 0, 0, 0];
if (result.length > 0) {
statusArray[0] = result[0].deviceStatus;
statusArray[1] = result[0].devicePower;
statusArray[2] = result[0].deviceEnergy;
}
dataInformationFunction(statusArray);
});
$.getJSON('/aluminumLiner/getRunParameters', function (result) {
synthetic(result,{a:1,b:1})
});
//数据信息
$.getJSON('/aluminumLiner/getDataInformation', function (result) {
const statusArray = [1, 0, 0, 0, 0];
if (result.length > 0) {
statusArray[0] = result[0].deviceStatus;
statusArray[1] = result[0].devicePower;
statusArray[2] = result[0].deviceEnergy;
}
dataInformationFunction(statusArray);
});
$.getJSON('/aluminumLiner/getRunParameters', function (result) {
synthetic(result, {a: 1, b: 1})
});
//loss/aluminumLiner/getLossStatistics
$.getJSON('/aluminumLiner/getLossStatistics', function (result) {
loss(result, document.getElementById("loss"));
});
//loss/aluminumLiner/getLossStatistics
$.getJSON('/aluminumLiner/getLossStatistics', function (result) {
loss(result, document.getElementById("loss"));
});
//设备OEE统计
$.getJSON('/aluminumLiner/getOeeStatistics', function (result) {
OEEStatistics(result, document.getElementById("OEEStatistics"));
});
//设备OEE统计
$.getJSON('/aluminumLiner/getOeeStatistics', function (result) {
OEEStatistics(result, document.getElementById("OEEStatistics"));
});
//库存情况
$.getJSON('/aluminumLiner/getInventoryStatistics', function (result) {
inventory(result, document.getElementById("inventory"));
});
//库存情况
$.getJSON('/aluminumLiner/getInventoryStatistics', function (result) {
inventory(result, document.getElementById("inventory"));
});
//生产计划
$.ajax({
url: '/aluminumLiner/getProductionPlan',
type: 'get',
dataType: 'JSON',
success: function (res) {
let Res = {}
Res.data=res.map(val => {
return [val["spe"],val["oq"],val["aq"],val["cha"],val.round,]
})
Res.header = ['型号', '计划数', '完成数', '差异数', '执行进度']
dynamicTable({
el: '#productionPlan',
rowNum: 5,
timeout: 0,
header: Res.header,
data: Res.data,
index: false,
fontColor: '#B4B7BF',
indexBGC: '#86F3FF',
headerBGC: 'rgba(8,36,75,0.2)',
oddRowBGC: 'rgba(8,36,75,0.2)',
evenRowBGC: 'rgba(6,25,57,0.2)',
colWidth: ['20%', '20%', '20%', '20%', '20%']
});
},
error: function (e) {
}
});
tableAnimation('#productionPlan')
//设备故障排名
$.getJSON('/aluminumLiner/getStatisticalOutputByModel', function (result) {
equipmentFailure(result, document.getElementById("equipmentFailure"));
});
setTimeout(fun, 10000)
}
fun()
let fun2 = () => {
//生产计划
$.ajax({
url: '/aluminumLiner/getProductionPlan',
type: 'get',
dataType: 'JSON',
success: function (res) {
$('#productionPlan').empty()
let Res = {}
//设备故障排名
$.getJSON('/aluminumLiner/getStatisticalOutputByModel', function (result) {
equipmentFailure(result, document.getElementById("equipmentFailure"));
});
Res.data = res.map(val => {
return [val["spe"], val["oq"], val["aq"], val["cha"], val.round,]
})
Res.header = ['型号', '计划数', '完成数', '差异数', '执行进度']
dynamicTable({
el: '#productionPlan',
rowNum: 5,
timeout: 0,
header: Res.header,
data: Res.data,
index: false,
fontColor: '#B4B7BF',
indexBGC: '#86F3FF',
headerBGC: 'rgba(8,36,75,0.2)',
oddRowBGC: 'rgba(8,36,75,0.2)',
evenRowBGC: 'rgba(6,25,57,0.2)',
colWidth: ['20%', '20%', '20%', '20%', '20%']
});
},
error: function (e) {
}
});
return setTimeout(fun2, 100000)
}
fun2()
tableAnimation('#productionPlan')
})

42
productionboard/src/main/resources/static/js/aluminumTank/index.js
Unescape Escape View File

@ -1,24 +1,28 @@
$(()=>{
//班组统计
$.getJSON('/aluminumTank/getTeamStatisticsJson', function (result) {
console.log(result.planAmount+' 数据'+ result.actualAmount, result.differenceAmount)
storageStatistics('白班', result.planAmount, result.actualAmount, result.differenceAmount,)
});
$(() => {
let fun = () => {
//班组统计
$.getJSON('/aluminumTank/getTeamStatisticsJson', function (result) {
console.log(result.planAmount + ' 数据' + result.actualAmount, result.differenceAmount)
storageStatistics('白班', result.planAmount, result.actualAmount, result.differenceAmount,)
});
//按型号统计产量
$.getJSON('/aluminumTank/getMaterialProdutionJson', function (result) {
horizontalBarChart(result,document.getElementById("statisticalOutputByModel"));
});
//按型号统计产量
$.getJSON('/aluminumTank/getMaterialProdutionJson', function (result) {
horizontalBarChart(result, document.getElementById("statisticalOutputByModel"));
});
//小时产量
$.getJSON('/aluminumTank/getHourProdutionJson', function (result) {
bluePolygonHistogram(result, document.getElementById("hourlyOutputStatistics"));
});
//小时产量
$.getJSON('/aluminumTank/getHourProdutionJson', function (result) {
bluePolygonHistogram(result, document.getElementById("hourlyOutputStatistics"));
});
//库存统计
$.getJSON('/aluminumTank/getMaterialStoreJson', function (result) {
console.log(result)
multipleThreeDimensionalCylindrical(result,document.getElementById("inventoryStatistics"));
});
//库存统计
$.getJSON('/aluminumTank/getMaterialStoreJson', function (result) {
console.log(result)
multipleThreeDimensionalCylindrical(result, document.getElementById("inventoryStatistics"));
});
setTimeout(fun, 10000)
}
fun()
})

43
productionboard/src/main/resources/static/js/common/date-time-common.js
Unescape Escape View File

@ -13,55 +13,56 @@ let rootWidth = document.documentElement.clientWidth || document.body.clientWidt
let rootDom = document.querySelector('html');
rootDom.style.fontSize = rootWidth / 10 + 'px';
getnow();
function getnow(){
function getnow() {
//1、获得当前时间，格式化时间
var now=new Date();
var now = new Date();
var year=now.getFullYear();
var year = now.getFullYear();
var month=now.getMonth()+1;
var month = now.getMonth() + 1;
if(month<10){
if (month < 10) {
month="0"+month;
month = "0" + month;
}
var date=now.getDate();
var date = now.getDate();
if(date<10){
if (date < 10) {
date="0"+date;
date = "0" + date;
}
var hour=now.getHours();
var hour = now.getHours();
if(hour<10){
if (hour < 10) {
hour="0"+hour;
hour = "0" + hour;
}
var minute=now.getMinutes();
var minute = now.getMinutes();
if(minute<10){
if (minute < 10) {
minute="0"+minute;
minute = "0" + minute;
}
var second=now.getSeconds();
var second = now.getSeconds();
if(second<10){
if (second < 10) {
second="0"+second;
second = "0" + second;
}
var nowstr=year+"-"+month+"-"+date+" "+hour+":"+minute+":"+second;
var nowstr = year + "-" + month + "-" + date + " " + hour + ":" + minute + ":" + second;
//alert(nowstr);
//alert(nowstr);
@ -70,8 +71,8 @@ function getnow(){
/*var nowspan=document.getElementById("nowspan");
nowspan.innerHTML=nowstr;*/
//2021-09-30 12:00:00
$("#dateinfo").html(nowstr.slice(0,10));
$("#timeinfo").html(nowstr.slice(11,19));
$("#dateinfo").html(nowstr.slice(0, 10));
$("#timeinfo").html(nowstr.slice(11, 19));
//3、使时间动起来
setTimeout("getnow()", 1000);
}

61
productionboard/src/main/resources/static/js/common/echarts.common.js
Unescape Escape View File

@ -8,7 +8,7 @@
* 蓝色多边形柱状图：bluePolygonHistogram(res, ids)T
* 多个立体柱状图：multipleThreeDimensionalCylindrical(res, ids)
* */
var timeout1 = ''
//横向柱状图
const horizontalBarChart = (res, ids) => {
@ -1167,24 +1167,34 @@ const bluePolygonHistogram = (res, ids) => {
}
//多个立体柱状图
const multipleThreeDimensionalCylindrical = (res, ids) => {
const multipleThreeDimensionalCylindrical = (res, ids, type = 1) => {
let mycharts = echarts.init(ids);
const value = []
res.forEach(e=>{
if(!(value.includes(e.materialName))){
value.push(e.materialName)
}
})
const data = value.map(e => {
return {
materialName:e,
lineStoreAmount:res.filter( val => val.materialName === e).filter(val => val.hullStoreAmount === 'L001')?.[0]?.lineStoreAmount || 0,
hullStoreAmount:res.filter( val => val.materialName === e).filter(val => val.hullStoreAmount === 'U001')?.[0]?.lineStoreAmount || 0
}
})
const xValue = data.map(val => val.materialName)
const lineStoreAmount = data.map(val => val.lineStoreAmount)
const hullStoreAmount = data.map(val => val.hullStoreAmount)
let xValue
let lineStoreAmount
let hullStoreAmount
if (type === 1) {
const value = []
res.forEach(e => {
if (!(value.includes(e.materialName))) {
value.push(e.materialName)
}
})
const data = value.map(e => {
return {
materialName: e,
lineStoreAmount: res.filter(val => val.materialName === e).filter(val => val.hullStoreAmount === 'L001')?.[0]?.lineStoreAmount || 0,
hullStoreAmount: res.filter(val => val.materialName === e).filter(val => val.hullStoreAmount === 'U001')?.[0]?.lineStoreAmount || 0
}
})
xValue = data.map(val => val.materialName)
lineStoreAmount = data.map(val => val.lineStoreAmount)
hullStoreAmount = data.map(val => val.hullStoreAmount)
} else {
xValue = res.map(val => val.materialName)
lineStoreAmount = res.map(val => val.lineStoreAmount)
hullStoreAmount = res.map(val => val.hullStoreAmount)
}
let lineColor = "#406A92";
let labelColor = "#fff";
let fontSize = "12";
@ -1238,7 +1248,7 @@ const multipleThreeDimensionalCylindrical = (res, ids) => {
lineHeight: 20,
},
axisLabel: {
interval:0,
interval: 0,
color: labelColor,
fontSize: fontSize,
margin: 30,
@ -1538,12 +1548,12 @@ const multipleThreeDimensionalCylindrical = (res, ids) => {
option.grid.bottom = '20%'
}
const aaa = () => {
setInterval(() => {
timeout1 && clearTimeout(timeout1)
timeout1 = setInterval(() => {
option.dataZoom[0].start += stepSize
option.dataZoom[0].start = option.dataZoom[0].start % 100
option.dataZoom[0].end = option.dataZoom[0].start + stepSize
mycharts.setOption(option);
$(window).resize(mycharts.resize);
}, 3000)
}
aaa()
@ -1721,9 +1731,9 @@ const inventory = (res, ids) => {
let barBottomColor = [
"rgba(2,195,241,0.1)",
];
const xAxisData = res.map(val => val.materialName?.split(',')[0] )
const seriesData1 = res.map(val => val.lineStoreAmount)
console.log(xAxisData,seriesData1)
const xAxisData = res.map(val => val.materialName?.split(',')[0])
const seriesData1 = res.map(val => val.lineStoreAmount != 0 ? val.lineStoreAmount : 0.00001)
console.log(xAxisData, seriesData1)
// Res.forEach((item) => {
// xAxisData.push(item.name);
// seriesData1.push(item.value);
@ -1799,6 +1809,9 @@ const inventory = (res, ids) => {
textStyle: {
color: "#02C3F1",
},
formatter: function (params) {
return seriesData1[params.dataIndex] === 0.00001 ? 0 : seriesData1[params.dataIndex]
}
},
symbolPosition: "end",
data: seriesData1,

22
productionboard/src/main/resources/static/js/common/ondutyplan.js
Unescape Escape View File

@ -1,5 +1,5 @@
/*当前班组统计封装*/
$(() =>{
$(() => {
let html = `<div id="theCurrentTeam" class="onDutyPlan display-blocks theCurrentTeam">
<span>-</span>
<span>-</span>
@ -31,10 +31,10 @@ $(() =>{
$('body').append(html);
})
let onDutyPlan = (scheduledProductionNumber,actualOutPutNumber,differenceValueNumber) =>{
let onDutyPlan = (scheduledProductionNumber, actualOutPutNumber, differenceValueNumber) => {
const scheduledProduction = [];
const actualOutPut = [];
const differenceValue = [];
const actualOutPut = [];
const differenceValue = [];
for (let i = 1; i <= 4; i++) {
scheduledProduction.push(`#scheduledProduction :nth-child(${i})`);
@ -47,11 +47,11 @@ let onDutyPlan = (scheduledProductionNumber,actualOutPutNumber,differenceValueNu
updateSplitBlocks(differenceValueNumber, differenceValue);
}
let storageStatistics = (leftInStoreNumber,leftOutStoreNumber,rightInStoreNumber,rightOutStoreNumber) =>{
let storageStatistics = (leftInStoreNumber, leftOutStoreNumber, rightInStoreNumber, rightOutStoreNumber) => {
const leftInStore = [];
const leftOutStore = [];
const rightInStore = [];
const rightOutStore = [];
const rightInStore = [];
const rightOutStore = [];
for (let i = 1; i <= 4; i++) {
leftInStore.push(`#theCurrentTeam :nth-child(${i})`);
@ -59,8 +59,8 @@ let storageStatistics = (leftInStoreNumber,leftOutStoreNumber,rightInStoreNumber
rightInStore.push(`#actualOutPut :nth-child(${i})`);
rightOutStore.push(`#differenceValue :nth-child(${i})`);
}
updateSplitBlocks(leftInStoreNumber, leftInStore);
updateSplitBlocks(leftOutStoreNumber, leftOutStore);
updateSplitBlocks(rightInStoreNumber, rightInStore);
updateSplitBlocks(rightOutStoreNumber, rightOutStore);
updateSplitBlocks(leftInStoreNumber || 0, leftInStore);
updateSplitBlocks(leftOutStoreNumber || 0, leftOutStore);
updateSplitBlocks(rightInStoreNumber || 0, rightInStore);
updateSplitBlocks(rightOutStoreNumber || 0, rightOutStore);
}

432
productionboard/src/main/resources/static/js/common/scrollTable.js
Unescape Escape View File

@ -1,6 +1,6 @@
/**
* dynamicTable 动态表格
* @param { Object } resource
* @param { Object } resource
* @param { String } el : 指定元素
* @param { Array } header : 表头
* @param { Array } data : 数据行
@ -15,47 +15,47 @@
* @param { Array } colWidth : 每列的宽度
*/
let dynamicTable = resource => {
'use strict';
'use strict';
//检查参数类型
if (typeof resource !== 'object') {
console.error('未传入参数,或者参数不是Object类型');
return
}
//检查参数类型
if (typeof resource !== 'object') {
console.error('未传入参数,或者参数不是Object类型');
return
}
// 检查是否传入元素
const ele = resource.el;
if (!ele) {
console.error('元素获取不正确！');
return
}
/**
* 检查是否传入动画触发时长
* 当时间小于 10 计算为秒级单位，
* 大于 10 计算为毫秒级单位
*/
let timeout = resource.timeout;
if (!timeout) {
timeout = 2000
} else if (timeout < 10) {
timeout = timeout * 1000
}
// 检查是否传入元素
const ele = resource.el;
if (!ele) {
console.error('元素获取不正确！');
return
}
/**
* 检查是否传入动画触发时长
* 当时间小于 10 计算为秒级单位，
* 大于 10 计算为毫秒级单位
*/
let timeout = resource.timeout;
if (!timeout) {
timeout = 2000
} else if (timeout < 10) {
timeout = timeout * 1000
}
// 检查 配置元素是否传入数据
const colName = resource.header === undefined ? '' : resource.header;
const rowData = resource.data === undefined ? '' : resource.data;
const rowNum = resource.rowNum === undefined ? '20%' : 100 / resource.rowNum + '%';
const headerBGC = resource.headerBGC === undefined ? '#999' : resource.headerBGC;
const oddRowBGC = resource.oddRowBGC === undefined ? '#bbb' : resource.oddRowBGC;
const evenRowBGC = resource.evenRowBGC === undefined ? '#ddd' : resource.evenRowBGC;
const fontColor = resource.fontColor === undefined ? 'black' : resource.fontColor;
const indexBGC = resource.indexBGC === undefined ? '#555' : resource.indexBGC;
const colIndex = resource.index === undefined ? true : resource.index;
const colWidth = resource.colWidth === undefined ? false : resource.colWidth;
const indexColor = fontColor.search(/('black')|(0{3,6})/) ? "white" : fontColor;
// 检查 配置元素是否传入数据
const colName = resource.header === undefined ? '' : resource.header;
const rowData = resource.data === undefined ? '' : resource.data;
const rowNum = resource.rowNum === undefined ? '20%' : 100 / resource.rowNum + '%';
const headerBGC = resource.headerBGC === undefined ? '#999' : resource.headerBGC;
const oddRowBGC = resource.oddRowBGC === undefined ? '#bbb' : resource.oddRowBGC;
const evenRowBGC = resource.evenRowBGC === undefined ? '#ddd' : resource.evenRowBGC;
const fontColor = resource.fontColor === undefined ? 'black' : resource.fontColor;
const indexBGC = resource.indexBGC === undefined ? '#555' : resource.indexBGC;
const colIndex = resource.index === undefined ? true : resource.index;
const colWidth = resource.colWidth === undefined ? false : resource.colWidth;
const indexColor = fontColor.search(/('black')|(0{3,6})/) ? "white" : fontColor;
//基本table html
const html = `
//基本table html
const html = `
<div class="table">
<div class="thead">
<div class="tr"></div>
@ -63,195 +63,195 @@ let dynamicTable = resource => {
<div class="tbody"></div>
</div>
`;
//Css样式集
const boxCSS = {
overflow: 'hidden',
background: headerBGC
};
const tableCSS = {
color: fontColor,
width: '100%',
height: '100%'
};
const theadCSS = {
width: '100%',
height: '20%'
};
const thead_trCSS = {
display: "flex",
flexWrap: "nowrap",
width: "100%",
height: "100%",
background: headerBGC,
justifyContent: "space-around"
};
const thCSS = {
justifyContent: "space-around",
fontWeight: "bold"
};
const tbodyCSS = {
width: "100%",
height: '80%',
boxSizing: 'border-box'
};
const tbody_trCSS = {
flexWrap: "nowrap",
width: "100%",
height: rowNum,
justifyContent: "space-around"
};
const trOddCSS = {
display: "flex",
background: oddRowBGC
};
const trEvenCSS = {
display: "flex",
background: evenRowBGC
};
const th_tdCSS = {
color:'#59B2F6',
margin: 'auto 0',
whiteSpace: 'nowrap',
overflow: "hidden",
textOverflow: 'ellipsis',
textAlign: 'center',
padding: '0 4px 0 4px'
};
const indexCSS = {
display: 'inline-block',
width: '90%',
height: "90%",
background: indexBGC,
color: indexColor,
borderRadius: '20%',
margin: 'auto'
};
//插入table元素
$(ele).append(html);
//Css样式集
const boxCSS = {
overflow: 'hidden',
background: headerBGC
};
const tableCSS = {
color: fontColor,
width: '100%',
height: '100%'
};
const theadCSS = {
width: '100%',
height: '20%'
};
const thead_trCSS = {
display: "flex",
flexWrap: "nowrap",
width: "100%",
height: "100%",
background: headerBGC,
justifyContent: "space-around"
};
const thCSS = {
justifyContent: "space-around",
fontWeight: "bold"
};
const tbodyCSS = {
width: "100%",
height: '80%',
boxSizing: 'border-box'
};
const tbody_trCSS = {
flexWrap: "nowrap",
width: "100%",
height: rowNum,
justifyContent: "space-around"
};
const trOddCSS = {
display: "flex",
background: oddRowBGC
};
const trEvenCSS = {
display: "flex",
background: evenRowBGC
};
const th_tdCSS = {
color: '#59B2F6',
margin: 'auto 0',
whiteSpace: 'nowrap',
overflow: "hidden",
textOverflow: 'ellipsis',
textAlign: 'center',
padding: '0 4px 0 4px'
};
const indexCSS = {
display: 'inline-block',
width: '90%',
height: "90%",
background: indexBGC,
color: indexColor,
borderRadius: '20%',
margin: 'auto'
};
//插入table元素
$(ele).append(html);
//核心代码
//遍历插入数据 表头
if (colIndex) {
$(ele + '>.table>.thead>.tr').append('<div class="th"><span class="index">#</span></div>')
}
colName.forEach(element => {
$(ele + '>.table>.thead>.tr').append(`<div class="th">${element}</div>`)
});
//核心代码
//遍历插入数据 表头
if (colIndex) {
$(ele + '>.table>.thead>.tr').append('<div class="th"><span class="index">#</span></div>')
}
colName.forEach(element => {
$(ele + '>.table>.thead>.tr').append(`<div class="th">${element}</div>`)
});
//遍历插入数据 数据行
for (let i = 0; i < rowData.length; i++) {
//遍历插入数据 数据行
for (let i = 0; i < rowData.length; i++) {
$(ele + '>.table>.tbody').append('<div class="tr"></div>');
if (colIndex) {
$(ele + '>.table>.tbody>.tr:eq(' + i + ')').append(
`<div class="td"><span class="index">${i+1}</span></div>`)
}
rowData[i].forEach(element => {
if (element == "一级") {
$(ele + '>.table>.tbody>.tr:eq(' + i + ')').append(
`<div class="td" ><img src="img/firstAlarm.png" alt="一级报警" width="30%" height="30%" /></div>`
)
} else if (element == "二级") {
$(ele + '>.table>.tbody>.tr:eq(' + i + ')').append(
`<div class="td" ><img src="img/secondAlarm.png" alt="二级报警" width="30%" height="30%" /></div>`
)
} else if (element == "三级") {
$(ele + '>.table>.tbody>.tr:eq(' + i + ')').append(
`<div class="td" ><img src="img/thirdlyAlarm.png" alt="三级报警" width="30%" height="30%" /></div>`
)
} else if (element == "未处理") {
$(ele + '>.table>.tbody>.tr:eq(' + i + ')').append(
`<div class="td" Style="border:1px solid #D81F29;border-radius: 6px;background-color:#941D3B;color:white">${element}</div>`
)
} else if (element == "处理中") {
$(ele + '>.table>.tbody>.tr:eq(' + i + ')').append(
`<div class="td" Style="border:1px solid #E08018;border-radius: 6px;background-color:#935A2F;color:white">${element}</div>`
)
} else if (element == "已结束") {
$(ele + '>.table>.tbody>.tr:eq(' + i + ')').append(
`<div class="td" Style="border:1px solid #0FF4D5;border-radius: 6px;background-color:#0B9EA9;color:white">${element}</div>`
)
} else {
$(ele + '>.table>.tbody>.tr:eq(' + i + ')').append(`<div class="td">${element}</div>`)
}
$(ele + '>.table>.tbody').append('<div class="tr"></div>');
if (colIndex) {
$(ele + '>.table>.tbody>.tr:eq(' + i + ')').append(
`<div class="td"><span class="index">${i + 1}</span></div>`)
}
rowData[i].forEach(element => {
if (element == "一级") {
$(ele + '>.table>.tbody>.tr:eq(' + i + ')').append(
`<div class="td" ><img src="img/firstAlarm.png" alt="一级报警" width="30%" height="30%" /></div>`
)
} else if (element == "二级") {
$(ele + '>.table>.tbody>.tr:eq(' + i + ')').append(
`<div class="td" ><img src="img/secondAlarm.png" alt="二级报警" width="30%" height="30%" /></div>`
)
} else if (element == "三级") {
$(ele + '>.table>.tbody>.tr:eq(' + i + ')').append(
`<div class="td" ><img src="img/thirdlyAlarm.png" alt="三级报警" width="30%" height="30%" /></div>`
)
} else if (element == "未处理") {
$(ele + '>.table>.tbody>.tr:eq(' + i + ')').append(
`<div class="td" Style="border:1px solid #D81F29;border-radius: 6px;background-color:#941D3B;color:white">${element}</div>`
)
} else if (element == "处理中") {
$(ele + '>.table>.tbody>.tr:eq(' + i + ')').append(
`<div class="td" Style="border:1px solid #E08018;border-radius: 6px;background-color:#935A2F;color:white">${element}</div>`
)
} else if (element == "已结束") {
$(ele + '>.table>.tbody>.tr:eq(' + i + ')').append(
`<div class="td" Style="border:1px solid #0FF4D5;border-radius: 6px;background-color:#0B9EA9;color:white">${element}</div>`
)
} else {
$(ele + '>.table>.tbody>.tr:eq(' + i + ')').append(`<div class="td">${element}</div>`)
}
})
})
}
}
//设置CSS样式
$(ele).css(boxCSS);
$(ele + '>.table').css(tableCSS);
$(ele + '>.table>.thead').css(theadCSS);
$(ele + '>.table>.thead>.tr').css(thead_trCSS);
$(ele + '>.table>.thead>.tr>.th').css(th_tdCSS).css(thCSS);
$(ele + '>.table>.tbody').css(tbodyCSS);
$(ele + '>.table>.tbody>.tr').css(tbody_trCSS);
$(ele + '>.table>.tbody>.tr:odd').css(trOddCSS);
$(ele + '>.table>.tbody>.tr:even').css(trEvenCSS);
$(ele + '>.table>.tbody>.tr>.td').css(th_tdCSS);
$(ele + '>.table span.index').css(indexCSS)
//设置CSS样式
$(ele).css(boxCSS);
$(ele + '>.table').css(tableCSS);
$(ele + '>.table>.thead').css(theadCSS);
$(ele + '>.table>.thead>.tr').css(thead_trCSS);
$(ele + '>.table>.thead>.tr>.th').css(th_tdCSS).css(thCSS);
$(ele + '>.table>.tbody').css(tbodyCSS);
$(ele + '>.table>.tbody>.tr').css(tbody_trCSS);
$(ele + '>.table>.tbody>.tr:odd').css(trOddCSS);
$(ele + '>.table>.tbody>.tr:even').css(trEvenCSS);
$(ele + '>.table>.tbody>.tr>.td').css(th_tdCSS);
$(ele + '>.table span.index').css(indexCSS)
//统一计量单位
const emptyUnit = element => element.replace(/[^0-9]/g, '');
const hendlen = $(`${ele}>.table>.thead>.tr>.th`).length;
const bodylen = $(`${ele}>.table>.tbody>.tr:nth-child(1)>.td`).length;
const ceil = Math.ceil;
//统一计量单位
const emptyUnit = element => element.replace(/[^0-9]/g, '');
const hendlen = $(`${ele}>.table>.thead>.tr>.th`).length;
const bodylen = $(`${ele}>.table>.tbody>.tr:nth-child(1)>.td`).length;
const ceil = Math.ceil;
/**
* 设置每列的宽度
* eq() 是在匹配的元素中取下标为n的元素
* nth-child() 是在匹配元素的父元素中选择第n个元素
*/
if (!colWidth) {
$(`${ele}>.table>.thead>.tr>.th`).css({
width: ceil(100 / hendlen) + '%'
});
$(`${ele}>.table>.tbody>.tr>.td`).css({
width: ceil(100 / bodylen) + '%'
});
} else {
for (let i = 0; i < colWidth.length; i++) {
let emptyUnitColWidth = emptyUnit(colWidth[i]);
$(`${ele}>.table>.thead>.tr>.th:nth-child(${i+1})`).width(`${emptyUnitColWidth}%`);
$(`${ele}>.table>.tbody>.tr>.td:nth-child(${i+1})`).width(`${emptyUnitColWidth}%`);
}
}
/**
* 设置每列的宽度
* eq() 是在匹配的元素中取下标为n的元素
* nth-child() 是在匹配元素的父元素中选择第n个元素
*/
if (!colWidth) {
$(`${ele}>.table>.thead>.tr>.th`).css({
width: ceil(100 / hendlen) + '%'
});
$(`${ele}>.table>.tbody>.tr>.td`).css({
width: ceil(100 / bodylen) + '%'
});
} else {
for (let i = 0; i < colWidth.length; i++) {
let emptyUnitColWidth = emptyUnit(colWidth[i]);
$(`${ele}>.table>.thead>.tr>.th:nth-child(${i + 1})`).width(`${emptyUnitColWidth}%`);
$(`${ele}>.table>.tbody>.tr>.td:nth-child(${i + 1})`).width(`${emptyUnitColWidth}%`);
}
}
// 组件销毁钩子
$(`${ele}`).bind('DOMNodeRemoved', (e) => {
if (e.target.classList[0] === 'asit-table') {
clearInterval(animation);
}
});
// 组件销毁钩子
$(`${ele}`).bind('DOMNodeRemoved', (e) => {
if (e.target.classList[0] === 'asit-table') {
clearInterval(animation);
}
});
}
const tableAnimation = (el) => {
const evenRowBGC = 'rgba(6,25,57,0.2)' === undefined ? '#ddd' : 'rgba(6,25,57,0.2)';
const oddRowBGC = 'rgba(8,36,75,0.2)' === undefined ? '#bbb' : 'rgba(8,36,75,0.2)';
const trEvenCSS = {
display: "flex",
background: evenRowBGC
};
const trOddCSS = {
display: "flex",
background: oddRowBGC
};
let oddORevenCheck = $(`${el}>.table>.tbody>.tr`).length % 2 == 0 ? 'even' : 'odd';
setInterval(function () {
$(el + '>.table>.tbody>.tr:eq(0)').slideToggle(100, function () {
switch (oddORevenCheck) {
case 'even':
$(this).clone().css(trEvenCSS).appendTo(el + '>.table>.tbody');
oddORevenCheck = 'odd';
break;
case 'odd':
$(this).clone().css(trOddCSS).appendTo(el + '>.table>.tbody');
oddORevenCheck = 'even';
break;
}
$(this).remove();
});
}, 2000);
const evenRowBGC = 'rgba(6,25,57,0.2)' === undefined ? '#ddd' : 'rgba(6,25,57,0.2)';
const oddRowBGC = 'rgba(8,36,75,0.2)' === undefined ? '#bbb' : 'rgba(8,36,75,0.2)';
const trEvenCSS = {
display: "flex",
background: evenRowBGC
};
const trOddCSS = {
display: "flex",
background: oddRowBGC
};
let oddORevenCheck = $(`${el}>.table>.tbody>.tr`).length % 2 == 0 ? 'even' : 'odd';
setInterval(function () {
$(el + '>.table>.tbody>.tr:eq(0)').slideToggle(100, function () {
switch (oddORevenCheck) {
case 'even':
$(this).clone().css(trEvenCSS).appendTo(el + '>.table>.tbody');
oddORevenCheck = 'odd';
break;
case 'odd':
$(this).clone().css(trOddCSS).appendTo(el + '>.table>.tbody');
oddORevenCheck = 'even';
break;
}
$(this).remove();
});
}, 2000);
}

11
productionboard/src/main/resources/static/js/common/synthetic.js
Unescape Escape View File

@ -1,4 +1,3 @@
const dataInformationFunction = (statusArray) => {
let info = `<table style="position: absolute;top: 8%;width: 100%;height:100%;">
<tr style="width: 100%; height: 50%;">
@ -10,9 +9,9 @@ const dataInformationFunction = (statusArray) => {
<td style="font-size:150%;border:0px solid red;text-align:center;width: 50%;color: red;">${statusArray[3]}</td>
</tr>
</table>`;
$("#dataInformation").append(info);
$("#dataInformation").html(info);
}
const synthetic = (statusArray,param={a:0,b:0}) => {
const synthetic = (statusArray, param = {a: 0, b: 0}) => {
let info = `<table style="position: absolute;top: 9%;left: 30%;width: 40%;height:7%;">
<tr style="width: 100%; height: 50%;">
<td style="border:0px solid red;font-size:175%;text-align:center;width: 23%;color: #59B2F6;">${statusArray[0] || 0}</td>
@ -35,8 +34,8 @@ const synthetic = (statusArray,param={a:0,b:0}) => {
<td style="border:0px solid red;text-align:center;width: 0%;"></td>
</tr>
</table>
<span style="position: absolute;font-size:175%;top: ${12+param.a}%;left: 85%;width: 9%; height: 6%; text-align: center;color: red;display:inline-block;-webkit-background-clip: text;">${statusArray[8] || 0}</span>
<span style="position: absolute;font-size:175%;top:${26.7+param.b}%;left: 85%;width: 9%; height: 6%; text-align: center;color: #63F659;display:inline-block;-webkit-background-clip: text;">${statusArray[9] || 0}</span>
<span style="position: absolute;font-size:175%;top: ${12 + param.a}%;left: 85%;width: 9%; height: 6%; text-align: center;color: red;display:inline-block;-webkit-background-clip: text;">${statusArray[8] || 0}</span>
<span style="position: absolute;font-size:175%;top:${26.7 + param.b}%;left: 85%;width: 9%; height: 6%; text-align: center;color: #63F659;display:inline-block;-webkit-background-clip: text;">${statusArray[9] || 0}</span>
`;
$("#synthetic").append(info);
$("#synthetic").html(info);
}

230
productionboard/src/main/resources/static/js/foamBox/index.js
Unescape Escape View File

@ -1,123 +1,127 @@
$(() => {
//班组计划统计
$.getJSON(`/foamBox/getTeamStatisticsJson?ids=${ids}`, function (result) {
onDutyPlan(result.planAmount, result.actualAmount, result.planAmount- result.actualAmount)
});
//设备运行状态
$.getJSON(`/foamBox/getRunStatusJson?ids=${ids}`, function (result) {
deviceStatus(result);
});
// deviceStatus([1,1,1,1,1,1]);
//库存统计
$.getJSON(`/foamBox/getMaterialStoreJson`, function (result) {
threeDimensionalCylindrical(result, document.getElementById("inventoryStatistics"));
});
//按型号统计产量
$.getJSON(`/foamBox/getMaterialProdutionJson?ids=${ids}`, function (result) {
horizontalBarChart(result, document.getElementById("statisticalOutputByModel"));
});
//小时产量
$.getJSON(`/foamBox/getHourProdutionJson?ids=${ids}`, function (result) {
brokenLineAreaDiagram(result, document.getElementById("hourlyOutputStatistics"));
});
//发泡参数
$.getJSON(`/foamBox/getParamTemperature?ids=${ids}`, function (result) {
multipleBrokenLineAreaDiagram(result, document.getElementById("foamingParameters"));
});
// 模具温度1
const temperature = (res, ids) => {
let mycharts = echarts.init(ids);
console.log(res);
let option = {
grid: {
top: '15%',
left: '6%',
right: '6%',
bottom: '3%',
containLabel: true
},
tooltip: {
// trigger: "axis",
},
xAxis: [
{
interval: 0,
type: 'category',
data: res.xValueList,
axisPointer: {
type: 'shadow'
},
axisLabel:{
show: true,
rotate:30,
interval:0
}
}
],
yAxis: [
{
splitLine: {
show: false,
},
type: 'value',
name: '温度',
min: 0,
// max: 50,
interval: 10,
axisLabel: {
formatter: '{value} °C '
}
},
],
series: [
{
name: '内膜温度',
type: 'bar',
tooltip: {
valueFormatter: function (value) {
return value + ' ml';
}
},
data: res.interiorList
},
{
name: '外膜温度',
type: 'bar',
tooltip: {
valueFormatter: function (value) {
return value + ' ml';
}
},
data: res.lateralList
},
]
};
mycharts.setOption(option);
$(window).resize(mycharts.resize);
let fun = () => {
//班组计划统计
$.getJSON(`/foamBox/getTeamStatisticsJson?ids=${ids}`, function (result) {
onDutyPlan(result.planAmount, result.actualAmount, result.planAmount - result.actualAmount)
});
//设备运行状态
$.getJSON(`/foamBox/getRunStatusJson?ids=${ids}`, function (result) {
deviceStatus(result);
});
// deviceStatus([1,1,1,1,1,1]);
//库存统计
$.getJSON(`/foamBox/getMaterialStoreJson`, function (result) {
threeDimensionalCylindrical(result, document.getElementById("inventoryStatistics"));
});
//按型号统计产量
$.getJSON(`/foamBox/getMaterialProdutionJson?ids=${ids}`, function (result) {
horizontalBarChart(result, document.getElementById("statisticalOutputByModel"));
});
//小时产量
$.getJSON(`/foamBox/getHourProdutionJson?ids=${ids}`, function (result) {
brokenLineAreaDiagram(result, document.getElementById("hourlyOutputStatistics"));
});
//发泡参数
$.getJSON(`/foamBox/getParamTemperature?ids=${ids}`, function (result) {
multipleBrokenLineAreaDiagram(result, document.getElementById("foamingParameters"));
});
// 模具温度1
$.getJSON(`/foamBox/getMouldTemperature?ids=${ids}`, function (result) {
temperature(result, document.getElementById("temperatureOne"));
});
$.getJSON(`/foamBox/getMouldTemperature2?ids=${ids}`, function (result) {
temperature(result, document.getElementById("temperatureTwo"));
});
setTimeout(fun, 10000)
}
$.getJSON(`/foamBox/getMouldTemperature?ids=${ids}`, function (result) {
temperature(result, document.getElementById("temperatureOne"));
});
$.getJSON(`/foamBox/getMouldTemperature2?ids=${ids}`, function (result) {
temperature(result, document.getElementById("temperatureTwo"));
});
fun()
})
const temperature = (res, ids) => {
let mycharts = echarts.init(ids);
console.log(res);
let option = {
grid: {
top: '15%',
left: '6%',
right: '6%',
bottom: '3%',
containLabel: true
},
tooltip: {
// trigger: "axis",
},
xAxis: [
{
interval: 0,
type: 'category',
data: res.xValueList,
axisPointer: {
type: 'shadow'
},
axisLabel: {
show: true,
rotate: 30,
interval: 0
}
}
],
yAxis: [
{
splitLine: {
show: false,
},
type: 'value',
name: '温度',
min: 0,
// max: 50,
interval: 10,
axisLabel: {
formatter: '{value} °C '
}
},
],
series: [
{
name: '内膜温度',
type: 'bar',
tooltip: {
valueFormatter: function (value) {
return value + ' ml';
}
},
data: res.interiorList
},
{
name: '外膜温度',
type: 'bar',
tooltip: {
valueFormatter: function (value) {
return value + ' ml';
}
},
data: res.lateralList
},
]
};
mycharts.setOption(option);
$(window).resize(mycharts.resize);
}
const deviceStatus = (statusArray) => {
let info = `
<img src="../../img/foamBox/${statusArray[0] == 1 ? "deviceopen.png" : "deviceclose.png"}" style="position: absolute;transform: translate(-50%,-50%);top:30%;left:34%;width: 2vw;"/>

38
productionboard/src/main/resources/static/js/preassemble/index.js
Unescape Escape View File

@ -1,22 +1,26 @@
$(()=>{
// onDutyPlan(1234,1202,33);
$.getJSON('/preassemble/getTeamStatisticsJson', function (result) {
storageStatistics(result.className, result.planAmount, result.actualAmount, result.differenceAmount,)
});
//按型号统计产量
$.getJSON('/preassemble/getMaterialProdutionJson', function (result) {
horizontalBarChart(result,document.getElementById("statisticalOutputByModel"));
});
$(() => {
let fun = () => {
// onDutyPlan(1234,1202,33);
$.getJSON('/preassemble/getTeamStatisticsJson', function (result) {
storageStatistics(result.className, result.planAmount, result.actualAmount, result.differenceAmount,)
});
//按型号统计产量
$.getJSON('/preassemble/getMaterialProdutionJson', function (result) {
horizontalBarChart(result, document.getElementById("statisticalOutputByModel"));
});
//小时产量
$.getJSON('/preassemble/getHourProdutionJson', function (result) {
greenPolygonalHistogram(result, document.getElementById("hourlyOutputStatistics"));
});
//小时产量
$.getJSON('/preassemble/getHourProdutionJson', function (result) {
greenPolygonalHistogram(result, document.getElementById("hourlyOutputStatistics"));
});
//库存统计
$.getJSON('/preassemble/getMaterialStoreJson', function (result) {
threeDimensionalCylindrical(result,document.getElementById("inventoryStatistics"));
});
//库存统计
$.getJSON('/preassemble/getMaterialStoreJson', function (result) {
threeDimensionalCylindrical(result, document.getElementById("inventoryStatistics"));
});
setTimeout(fun, 10000)
}
fun()
})

99
productionboard/src/main/resources/static/js/storage/index.js
Unescape Escape View File

@ -1,50 +1,59 @@
$(()=>{
//生产计划
$.ajax({
url: '/storage/getProductionPlan',
type: 'GET',
dataType: 'JSON',
success: function(res) {
dynamicTable({
el: '#productionPlan',
rowNum: 5,
timeout: 0,
header: res.header,
data: res.data,
index: false,
fontColor: '#B4B7BF ',
indexBGC: '#86F3FF',
headerBGC: 'rgba(8,36,75,0.2)',
oddRowBGC: 'rgba(8,36,75,0.2)',
evenRowBGC: 'rgba(6,25,57,0.2)',
colWidth: ['20%', '20%', '20%', '20%','20%']
});
},
error: function(e) {
console.log(e)
}
});
$(() => {
let fun2 = () => {
//生产计划
$.ajax({
url: '/storage/getProductionPlan',
type: 'GET',
dataType: 'JSON',
success: function (res) {
$('#productionPlan').empty()
dynamicTable({
el: '#productionPlan',
rowNum: 5,
timeout: 0,
header: res.header,
data: res.data,
index: false,
fontColor: '#B4B7BF ',
indexBGC: '#86F3FF',
headerBGC: 'rgba(8,36,75,0.2)',
oddRowBGC: 'rgba(8,36,75,0.2)',
evenRowBGC: 'rgba(6,25,57,0.2)',
colWidth: ['20%', '20%', '20%', '20%', '20%']
});
},
error: function (e) {
console.log(e)
}
});
return setTimeout(fun2, 100000)
}
fun2()
tableAnimation('#productionPlan')
//当前库存统计
$.getJSON(`/storage/getStoreStatistics?ids=${ids}`, function (result) {
multipleThreeDimensionalCylindrical(result, document.getElementById("theCurrentInventory"));
});
//库位参数
$.getJSON(`/storage/getParamJson?ids=${ids}`, function (result) {
//单日出入库统计
storageStatistics(result[0] == null ? 0 : result[0],result[1] == null ? 0 : result[1],result[2] == null ? 0 : result[2],result[3] == null ? 0 : result[3]);
let fun = () => {
//当前库存统计
$.getJSON(`/storage/getStoreStatistics?ids=${ids}`, function (result) {
multipleThreeDimensionalCylindrical(result, document.getElementById("theCurrentInventory"), 2);
});
//库位参数
$.getJSON(`/storage/getParamJson?ids=${ids}`, function (result) {
//单日出入库统计
storageStatistics(result[0] == null ? 0 : result[0], result[1] == null ? 0 : result[1], result[2] == null ? 0 : result[2], result[3] == null ? 0 : result[3]);
//库存统计
$("#emptyLocation-left").text(result[4] == null ? 0 : result[4]);
$("#haveUsedLocation-left").text(result[6] == null ? 0 : result[5]);
$("#emptyLocation-right").text(result[5] == null ? 0 : result[6]);
$("#haveUsedLocation-right").text(result[7] == null ? 0 : result[7]);
//库存统计
$("#emptyLocation-left").text(result[4] == null ? 0 : result[4]);
$("#haveUsedLocation-left").text(result[6] == null ? 0 : result[5]);
$("#emptyLocation-right").text(result[5] == null ? 0 : result[6]);
$("#haveUsedLocation-right").text(result[7] == null ? 0 : result[7]);
//库位占比
$("#emptyLocationNumber").text(result[8] == null ? 0 : result[8]);
$("#emptyLocationRatio").text(result[9] == null ? 0 : result[9]);
$("#haveUsedLocationNumber").text(result[10] == null ? 0 : result[10]);
$("#haveUsedLocationRatio").text(result[11] == null ? 0 : result[11]);
});
//库位占比
$("#emptyLocationNumber").text(result[8] == null ? 0 : result[8]);
$("#emptyLocationRatio").text(result[9] == null ? 0 : result[9]);
$("#haveUsedLocationNumber").text(result[10] == null ? 0 : result[10]);
$("#haveUsedLocationRatio").text(result[11] == null ? 0 : result[11]);
});
setTimeout(fun, 10000)
}
fun()
})

73
productionboard/src/main/resources/static/js/tankShell/device.js
Unescape Escape View File

@ -1,27 +1,43 @@
$(() => {
let fun = () => {
//设备OEE统计
$.getJSON('/tankShellDevice/getOeeStatistics', function (result) {
OEEStatistics(result, document.getElementById("OEEStatistics"));
});
//设备OEE统计
$.getJSON('/tankShellDevice/getOeeStatistics', function (result) {
OEEStatistics(result, document.getElementById("OEEStatistics"));
});
setInterval(() => {
// OEEStatistics(result, document.getElementById("OEEStatistics"));
}, 1000);
//设备故障排名
$.getJSON('/tankShellDevice/getStatisticalOutputByModel', function (result) {
equipmentFailure(result, document.getElementById("equipmentFailure"));
});
//设备故障排名
$.getJSON('/tankShellDevice/getStatisticalOutputByModel', function (result) {
equipmentFailure(result, document.getElementById("equipmentFailure"));
});
//loss
$.getJSON('/tankShellDevice/getLossStatistics', function (result) {
loss(result, document.getElementById("loss"));
});
//loss
$.getJSON('/tankShellDevice/getLossStatistics', function (result) {
loss(result, document.getElementById("loss"));
});
//设备产量能耗对比
$.getJSON('/tankShellDevice/getEnergyConsumption', function (result) {
energyConsumption(result, document.getElementById("energyConsumption"));
});
//设备产量能耗对比
$.getJSON('/tankShellDevice/getEnergyConsumption', function (result) {
energyConsumption(result, document.getElementById("energyConsumption"));
});
/*数据信息*/
$.getJSON('/tankShellDevice/getDataInformation', function (result) {
dataInformationFunction(result)
});
$.getJSON('/tankShellDevice/getRunParameters', function (result) {
console.log(result);
energyProductionStatisticsFunction(result)
runParamStatisticsFunction(result)
$("#lossParam").text(result[8]);
$("#meterParam").text(result[9]);
});
$.getJSON('/tankShellDevice/getRunParameters', function (result) {
runParamStatisticsFunction(result)
});
return setTimeout(fun,10000)
}
fun()
const tableRes = {}
//设备信息
@ -61,21 +77,6 @@ $(() => {
getTable()
}, 10000);
tableAnimation('#productionPlan')
/*数据信息*/
$.getJSON('/tankShellDevice/getDataInformation', function (result) {
dataInformationFunction(result)
});
$.getJSON('/tankShellDevice/getRunParameters', function (result) {
console.log(result);
energyProductionStatisticsFunction(result)
runParamStatisticsFunction(result)
$("#lossParam").text(result[8]);
$("#meterParam").text(result[9]);
});
$.getJSON('/tankShellDevice/getRunParameters', function (result) {
runParamStatisticsFunction(result)
});
})
/*数据信息*/
@ -94,7 +95,7 @@ const dataInformationFunction = (statusArray) => {
</tr>
</table>`;
$("#dataInformation").append(info);
$("#dataInformation").html(info);
}
/*能耗产量统计*/
@ -108,7 +109,7 @@ const energyProductionStatisticsFunction = (statusArray) => {
</tr>
</table>`;
$("#energyProductionStatistics").append(info);
$("#energyProductionStatistics").html(info);
}
const runParamStatisticsFunction = (statusArray) => {

40
productionboard/src/main/resources/static/js/tankShell/index.js
Unescape Escape View File

@ -1,23 +1,27 @@
$(()=>{
//班组统计
// onDutyPlan(1234,1202,33);
$.getJSON('/tankShell/getTeamStatisticsJson', function (result) {
storageStatistics('白班', result.planAmount, result.actualAmount, result.differenceAmount,)
});
$(() => {
let fun = () => {
//班组统计
// onDutyPlan(1234,1202,33);
$.getJSON('/tankShell/getTeamStatisticsJson', function (result) {
storageStatistics('白班', result.planAmount, result.actualAmount, result.differenceAmount,)
});
//按型号统计产量
$.getJSON('/tankShell/getMaterialProdutionJson', function (result) {
horizontalBarChart(result,document.getElementById("statisticalOutputByModel"));
});
//按型号统计产量
$.getJSON('/tankShell/getMaterialProdutionJson', function (result) {
horizontalBarChart(result, document.getElementById("statisticalOutputByModel"));
});
//小时产量
$.getJSON('/tankShell/getHourProdutionJson', function (result) {
brokenLineAreaDiagram(result, document.getElementById("hourlyOutputStatistics"));
});
//小时产量
$.getJSON('/tankShell/getHourProdutionJson', function (result) {
brokenLineAreaDiagram(result, document.getElementById("hourlyOutputStatistics"));
});
//库存统计
$.getJSON('/tankShell/getMaterialStoreJson', function (result) {
multipleThreeDimensionalCylindrical(result,document.getElementById("inventoryStatistics"));
});
//库存统计
$.getJSON('/tankShell/getMaterialStoreJson', function (result) {
multipleThreeDimensionalCylindrical(result, document.getElementById("inventoryStatistics"));
});
setTimeout(fun, 10000)
}
fun()
})

12
productionboard/src/main/resources/templates/adsorptionTank/index.html
Unescape Escape View File

@ -14,14 +14,14 @@
</head>
<body>
<!--小时产量统计-->
<div class="hourlyOutputStatistics" id="hourlyOutputStatistics"></div>
<!--小时产量统计-->
<div class="hourlyOutputStatistics" id="hourlyOutputStatistics"></div>
<!--型号产量统计-->
<div class="statisticalOutputByModel" id="statisticalOutputByModel"></div>
<!--型号产量统计-->
<div class="statisticalOutputByModel" id="statisticalOutputByModel"></div>
<!--库存统计-->
<div class="inventoryStatistics" id="inventoryStatistics"></div>
<!--库存统计-->
<div class="inventoryStatistics" id="inventoryStatistics"></div>
</body>
<script src="../../../js/adsorptionTank/index.js"></script>
</html>

32
productionboard/src/main/resources/templates/aluminumLiner/index.html
Unescape Escape View File

@ -16,28 +16,28 @@
</head>
<body>
<!--数据信息-->
<div class="dataInformation" id="dataInformation"></div>
<!--数据信息-->
<div class="dataInformation" id="dataInformation"></div>
<!--能耗产量统计-->
<div class="synthetic" id="synthetic"></div>
<!--能耗产量统计-->
<div class="synthetic" id="synthetic"></div>
<!--设备OEE统计-->
<div class="OEEStatistics" id="OEEStatistics"></div>
<!--设备OEE统计-->
<div class="OEEStatistics" id="OEEStatistics"></div>
<!--库存情况-->
<div class="inventory" id="inventory"></div>
<!--库存情况-->
<div class="inventory" id="inventory"></div>
<!--生产计划-->
<div class="productionPlan" id="productionPlan"></div>
<!--loss-->
<div class="loss" id="loss"></div>
<!--生产计划-->
<div class="productionPlan" id="productionPlan"></div>
<!--设备故障排名-->
<div class="equipmentFailure" id="equipmentFailure"></div>
<!--loss-->
<div class="loss" id="loss"></div>
<!--设备故障排名-->
<div class="equipmentFailure" id="equipmentFailure"></div>
</body>
<script src="../../../js/common/synthetic.js"></script>

14
productionboard/src/main/resources/templates/aluminumTank/index.html
Unescape Escape View File

@ -14,16 +14,16 @@
</head>
<body>
<!--按型号统计产量-->
<div class="statisticalOutputByModel" id="statisticalOutputByModel"></div>
<!--按型号统计产量-->
<div class="statisticalOutputByModel" id="statisticalOutputByModel"></div>
<!--库存统计-->
<div class="inventoryStatistics" id="inventoryStatistics"></div>
<!--库存统计-->
<div class="inventoryStatistics" id="inventoryStatistics"></div>
<!--小时产量-->
<div class="hourlyOutputStatistics" id="hourlyOutputStatistics"></div>
<!--小时产量-->
<div class="hourlyOutputStatistics" id="hourlyOutputStatistics"></div>
</body>
<script src="../../../js/aluminumTank/index.js"></script>
<script src="../../../js/aluminumTank/index.js"></script>
</html>

52
productionboard/src/main/resources/templates/foamBox/index.html
Unescape Escape View File

@ -17,39 +17,39 @@
</head>
<body>
<!--库存统计-->
<div class="inventoryStatistics" id="inventoryStatistics"></div>
<!--库存统计-->
<div class="inventoryStatistics" id="inventoryStatistics"></div>
<!--型号产量统计-->
<div class="statisticalOutputByModel" id="statisticalOutputByModel"></div>
<!--型号产量统计-->
<div class="statisticalOutputByModel" id="statisticalOutputByModel"></div>
<!--小时产量统计-->
<div class="hourlyOutputStatistics" id="hourlyOutputStatistics"></div>
<!--小时产量统计-->
<div class="hourlyOutputStatistics" id="hourlyOutputStatistics"></div>
<!--发泡参数-->
<div class="foamingParameters" id="foamingParameters"></div>
<!--发泡参数-->
<div class="foamingParameters" id="foamingParameters"></div>
<!--设备运行状态-->
<div class="foamingLineRunStatus">
<table style="width: 100%;height:100%;">
<tr style="width: 100%;">
</tr>
</table>
</div>
<!--设备运行状态-->
<div class="foamingLineRunStatus">
<table style="width: 100%;height:100%;">
<tr style="width: 100%;">
</tr>
</table>
</div>
<!-- 轮播 -->
<div class="swiperModule">
<div class="swiper mySwiper">
<div class="swiper-wrapper">
<div class="swiper-slide">
<div class="temperatureOne" id="temperatureOne"></div>
</div>
<div class="swiper-slide">
<div class="temperatureTwo" id="temperatureTwo"></div>
</div>
<!-- 轮播 -->
<div class="swiperModule">
<div class="swiper mySwiper">
<div class="swiper-wrapper">
<div class="swiper-slide">
<div class="temperatureOne" id="temperatureOne"></div>
</div>
<div class="swiper-slide">
<div class="temperatureTwo" id="temperatureTwo"></div>
</div>
</div>
</div>
</div>
</div>
</body>
<script src="../../../js/foamBox/index.js"></script>
<script>

22
productionboard/src/main/resources/templates/index.html
Unescape Escape View File

@ -5,17 +5,17 @@
<title>澳柯玛可视化看板</title>
</head>
<body>
<p> <a href="/adsorptionTank">吸附内胆</a></p>
<p> <a href="/aluminumTank">铝内胆生产数据监控</a></p>
<p><a href="/aluminumLiner">铝内胆成型线设备看板</a></p>
<p> <a href="/preassemble">吸附内胆预装</a></p>
<p> <a href="/tankShell">箱壳自动成型线生产看板</a></p>
<p> <a href="/tankShellDevice">箱壳自动成型线设备看板</a></p>
<p><a href="/adsorptionTank">吸附内胆</a></p>
<p><a href="/aluminumTank">铝内胆生产数据监控</a></p>
<p><a href="/aluminumLiner">铝内胆成型线设备看板</a></p>
<p><a href="/preassemble">吸附内胆预装</a></p>
<p><a href="/tankShell">箱壳自动成型线生产看板</a></p>
<p><a href="/tankShellDevice">箱壳自动成型线设备看板</a></p>
<p> <a href="/foamBox?id=0">发泡南线</a></p>
<p> <a href="/foamBox?id=1">发泡北线</a></p>
<p> <a href="/storage?id=0">门体库南线</a></p>
<p> <a href="/storage?id=1">门体库北线</a></p>
<p> <a href="/aluminumLiner">铝内胆成型线</a></p>
<p><a href="/foamBox?id=0">发泡南线</a></p>
<p><a href="/foamBox?id=1">发泡北线</a></p>
<p><a href="/storage?id=0">门体库南线</a></p>
<p><a href="/storage?id=1">门体库北线</a></p>
<p><a href="/aluminumLiner">铝内胆成型线</a></p>
</body>
</html>

12
productionboard/src/main/resources/templates/preassemble/index.html
Unescape Escape View File

@ -14,14 +14,14 @@
</head>
<body>
<!--小时产量统计-->
<div class="hourlyOutputStatistics" id="hourlyOutputStatistics"></div>
<!--小时产量统计-->
<div class="hourlyOutputStatistics" id="hourlyOutputStatistics"></div>
<!--型号产量统计-->
<div class="statisticalOutputByModel" id="statisticalOutputByModel"></div>
<!--型号产量统计-->
<div class="statisticalOutputByModel" id="statisticalOutputByModel"></div>
<!--库存统计-->
<div class="inventoryStatistics" id="inventoryStatistics"></div>
<!--库存统计-->
<div class="inventoryStatistics" id="inventoryStatistics"></div>
</body>
<script src="../../../js/preassemble/index.js"></script>
</html>

32
productionboard/src/main/resources/templates/storage/index.html
Unescape Escape View File

@ -15,31 +15,31 @@
</head>
<body>
<!--生产计划-->
<div class="productionPlan" id="productionPlan"></div>
<!--生产计划-->
<div class="productionPlan" id="productionPlan"></div>
<!--当前库存-->
<div class="theCurrentInventory" id="theCurrentInventory"></div>
<!--当前库存-->
<div class="theCurrentInventory" id="theCurrentInventory"></div>
<!--库位统计-左库-->
<div class="emptyLocation" style="left:43%" id="emptyLocation-left"></div>
<div class="haveUsedLocation" style="left:43%" id="haveUsedLocation-left"></div>
<!--库位统计-左库-->
<div class="emptyLocation" style="left:43%" id="emptyLocation-left"></div>
<div class="haveUsedLocation" style="left:43%" id="haveUsedLocation-left"></div>
<!--库位统计-右库-->
<div class="emptyLocation" style="right:8%" id="emptyLocation-right"></div>
<div class="haveUsedLocation" style="right:8%" id="haveUsedLocation-right"></div>
<!--库位统计-右库-->
<div class="emptyLocation" style="right:8%" id="emptyLocation-right"></div>
<div class="haveUsedLocation" style="right:8%" id="haveUsedLocation-right"></div>
<!--库位占比-->
<div class="emptyLocationRatio" style="left: 55.5%;" id="emptyLocationNumber"></div>
<div class="emptyLocationRatio" style="left: 60.7%;" id="emptyLocationRatio"></div>
<!--库位占比-->
<div class="emptyLocationRatio" style="left: 55.5%;" id="emptyLocationNumber"></div>
<div class="emptyLocationRatio" style="left: 60.7%;" id="emptyLocationRatio"></div>
<div class="haveUsedLocationRatio" style="right: 20.8%;" id="haveUsedLocationNumber"></div>
<div class="haveUsedLocationRatio" style="right: 15.5%;" id="haveUsedLocationRatio"></div>
<div class="haveUsedLocationRatio" style="right: 20.8%;" id="haveUsedLocationNumber"></div>
<div class="haveUsedLocationRatio" style="right: 15.5%;" id="haveUsedLocationRatio"></div>
</body>
<script src="../../../js/storage/index.js"></script>
<script>
const ids = [[${positionId}]];
</script>

49
productionboard/src/main/resources/templates/tankShell/device.html
Unescape Escape View File

@ -16,38 +16,37 @@
</head>
<body>
<!--数据信息-->
<div class="dataInformation" id="dataInformation"></div>
<!--能耗产量统计-->
<div class="energyProductionStatistics" id="energyProductionStatistics"></div>
<!--运行参数统计-->
<div class="runParamStatistics" id="runParamStatistics"></div>
<div >
<!--loss参数-->
<span class="lossParam" id="lossParam"></span>
<!--数据信息-->
<div class="dataInformation" id="dataInformation"></div>
<!--能耗产量统计-->
<div class="energyProductionStatistics" id="energyProductionStatistics"></div>
<!--运行参数统计-->
<div class="runParamStatistics" id="runParamStatistics"></div>
<div>
<!--loss参数-->
<span class="lossParam" id="lossParam"></span>
<!--节拍参数-->
<span class="meterParam" id="meterParam"></span>
</div>
<!--节拍参数-->
<span class="meterParam" id="meterParam"></span>
</div>
<!--设备OEE统计-->
<div class="OEEStatistics" id="OEEStatistics"></div>
<!--设备OEE统计-->
<div class="OEEStatistics" id="OEEStatistics"></div>
<!--设备故障排名-->
<div class="equipmentFailure" id="equipmentFailure"></div>
<!--设备故障排名-->
<div class="equipmentFailure" id="equipmentFailure"></div>
<!--loss-->
<div class="loss" id="loss"></div>
<!--loss-->
<div class="loss" id="loss"></div>
<!--设备信息-->
<div class="scrollTable">
<div class="productionPlan" id="productionPlan"></div>
</div>
<!--设备信息-->
<div class="scrollTable">
<div class="productionPlan" id="productionPlan"></div>
</div>
<!--设备产量能耗对比-->
<div class="energyConsumption" id="energyConsumption"></div>
<!--设备产量能耗对比-->
<div class="energyConsumption" id="energyConsumption"></div>
</body>
<script src="../../../js/tankShell/device.js"></script>

14
productionboard/src/main/resources/templates/tankShell/index.html
Unescape Escape View File

@ -14,16 +14,16 @@
</head>
<body>
<!--按型号统计产量-->
<div class="statisticalOutputByModel" id="statisticalOutputByModel"></div>
<!--按型号统计产量-->
<div class="statisticalOutputByModel" id="statisticalOutputByModel"></div>
<!--库存统计-->
<div class="inventoryStatistics" id="inventoryStatistics"></div>
<!--库存统计-->
<div class="inventoryStatistics" id="inventoryStatistics"></div>
<!--小时产量-->
<div class="hourlyOutputStatistics" id="hourlyOutputStatistics"></div>
<!--小时产量-->
<div class="hourlyOutputStatistics" id="hourlyOutputStatistics"></div>
</body>
<script src="../../../js/tankShell/index.js"></script>
<script src="../../../js/tankShell/index.js"></script>
</html>

9
productionboard/target/classes/static/css/adsorptionTank/style.css
Unescape Escape View File

@ -7,7 +7,7 @@ body {
background-size: 100% 100%;
}
.statisticalOutputByModel{
.statisticalOutputByModel {
border: 0px solid red;;
position: absolute;
width: 45.5%;
@ -16,7 +16,7 @@ body {
left: 3.5%;
}
.inventoryStatistics{
.inventoryStatistics {
border: 0px solid red;;
position: absolute;
width: 45.5%;
@ -25,7 +25,7 @@ body {
right: 3.5%;
}
.hourlyOutputStatistics{
.hourlyOutputStatistics {
border: 0px solid red;;
position: absolute;
width: 93%;
@ -33,7 +33,8 @@ body {
top: 23%;
left: 3.5%;
}
.span_c{
.span_c {
margin-left: 5%;
margin-right: 10% !important;
}

8
productionboard/target/classes/static/css/aluminumLiner/style.css
Unescape Escape View File

@ -4,7 +4,7 @@ body {
}
.dataInformation{
.dataInformation {
border: 0px solid red;
position: absolute;
width: 24%;
@ -13,7 +13,8 @@ body {
left: 3.3%;
font-size: 10% !important;
}
.synthetic{
.synthetic {
font-size: 10% !important;
}
@ -63,6 +64,7 @@ body {
left: 3.5%;
font-size: 9%;
}
.productionPlan .tbody .tr .td:first-child{
.productionPlan .tbody .tr .td:first-child {
font-size: 12px;
}

9
productionboard/target/classes/static/css/aluminumTank/style.css
Unescape Escape View File

@ -7,7 +7,7 @@ body {
background-size: 100% 100%;
}
.statisticalOutputByModel{
.statisticalOutputByModel {
border: 0px solid red;
position: absolute;
width: 45.5%;
@ -16,7 +16,7 @@ body {
left: 3.5%;
}
.inventoryStatistics{
.inventoryStatistics {
border: 0px solid red;
position: absolute;
width: 45.5%;
@ -25,7 +25,7 @@ body {
right: 3.5%;
}
.hourlyOutputStatistics{
.hourlyOutputStatistics {
border: 0px solid red;
position: absolute;
width: 93%;
@ -33,7 +33,8 @@ body {
bottom: 4.5%;
left: 3.5%;
}
.span_c{
.span_c {
margin-left: 5%;
margin-right: 10% !important;
}

12
productionboard/target/classes/static/css/common/ondutyplan.css
Unescape Escape View File

@ -1,4 +1,4 @@
.onDutyPlan{
.onDutyPlan {
width: 13%;
height: 5.6%;
position: absolute;
@ -22,22 +22,22 @@
margin-right: 0;
}
.theCurrentTeam{
.theCurrentTeam {
left: 9.8%;
color: #6ACBFE;
}
.scheduledProduction{
.scheduledProduction {
left: 34.4%;
color: #FFAE00;
}
.actualOutPut{
.actualOutPut {
left: 59%;
color:#A0FF00;
color: #A0FF00;
}
.differenceValue{
.differenceValue {
left: 83.6%;
color: #F51F1E;
}

5
productionboard/target/classes/static/css/foamBox/style.css
Unescape Escape View File

@ -33,11 +33,6 @@ body {
}
.foamingLineRunStatus {
position: absolute;
width: 40%;
height: 27%;
top: 12%;
left: 30%;
}
.inventoryStatistics {

9
productionboard/target/classes/static/css/preassemble/style.css
Unescape Escape View File

@ -7,7 +7,7 @@ body {
background-size: 100% 100%;
}
.statisticalOutputByModel{
.statisticalOutputByModel {
border: 0px solid red;
position: absolute;
width: 45.5%;
@ -16,7 +16,7 @@ body {
left: 3.5%;
}
.inventoryStatistics{
.inventoryStatistics {
border: 0px solid red;
position: absolute;
width: 45.5%;
@ -25,7 +25,7 @@ body {
right: 3.5%;
}
.hourlyOutputStatistics{
.hourlyOutputStatistics {
border: 0px solid red;
position: absolute;
width: 93%;
@ -33,7 +33,8 @@ body {
top: 23%;
left: 3.5%;
}
.span_c{
.span_c {
margin-left: 5%;
margin-right: 10% !important;
}

28
productionboard/target/classes/static/css/storage/style.css
Unescape Escape View File

@ -23,9 +23,9 @@ body {
}
.scheduledProduction {
left: 55.2%;
color:#A0FF00;
}
left: 55.2%;
color: #A0FF00;
}
.actualOutPut {
left: 69.7%;
@ -34,10 +34,10 @@ body {
.differenceValue {
left: 82.9%;
color:#A0FF00;
color: #A0FF00;
}
.productionPlan{
.productionPlan {
position: absolute;
border: 0px solid red;
width: 33%;
@ -47,7 +47,7 @@ body {
font-size: 12%;
}
.theCurrentInventory{
.theCurrentInventory {
position: absolute;
border: 0px solid red;
width: 33%;
@ -57,52 +57,52 @@ body {
font-size: 12%;
}
.emptyLocation{
.emptyLocation {
position: absolute;
border: 0px solid red;
width: 4%;
height: 4%;
top: 48.3%;
color:#6BFF71;
color: #6BFF71;
font-size: 14%;
display: flex;
align-items: center;
justify-content: center;
}
.haveUsedLocation{
.haveUsedLocation {
position: absolute;
border: 0px solid red;
width: 4%;
height: 4%;
top: 65%;
color:#FF9768;
color: #FF9768;
font-size: 14%;
display: flex;
align-items: center;
justify-content: center;
}
.emptyLocationRatio{
.emptyLocationRatio {
position: absolute;
border: 0px solid red;
width: 4%;
height: 4%;
bottom: 10%;
color:#FF9768;
color: #FF9768;
font-size: 14%;
display: flex;
align-items: center;
justify-content: center;
}
.haveUsedLocationRatio{
.haveUsedLocationRatio {
position: absolute;
border: 0px solid red;
width: 4%;
height: 4%;
bottom: 10%;
color:#FF9768;
color: #FF9768;
font-size: 14%;
display: flex;
align-items: center;

8
productionboard/target/classes/static/css/tankShell/style.css
Unescape Escape View File

@ -7,7 +7,7 @@ body {
background-size: 100% 100%;
}
.statisticalOutputByModel{
.statisticalOutputByModel {
border: 0px solid red;
position: absolute;
width: 45.5%;
@ -16,7 +16,7 @@ body {
left: 3.5%;
}
.inventoryStatistics{
.inventoryStatistics {
border: 0px solid red;
position: absolute;
width: 45.5%;
@ -25,7 +25,7 @@ body {
right: 3.5%;
}
.hourlyOutputStatistics{
.hourlyOutputStatistics {
border: 0px solid red;
position: absolute;
width: 93%;
@ -34,7 +34,7 @@ body {
left: 3.5%;
}
.span_c{
.span_c {
margin-left: 5%;
margin-right: 10% !important;
}

131
productionboard/target/classes/static/js/aluminumLiner/index.js
Unescape Escape View File

@ -1,75 +1,80 @@
$(() => {
let fun = () => {
//数据信息
$.getJSON('/aluminumLiner/getDataInformation', function (result) {
const statusArray = [1, 0, 0, 0, 0];
if (result.length > 0) {
statusArray[0] = result[0].deviceStatus;
statusArray[1] = result[0].devicePower;
statusArray[2] = result[0].deviceEnergy;
}
dataInformationFunction(statusArray);
});
$.getJSON('/aluminumLiner/getRunParameters', function (result) {
synthetic(result,{a:1,b:1})
});
//数据信息
$.getJSON('/aluminumLiner/getDataInformation', function (result) {
const statusArray = [1, 0, 0, 0, 0];
if (result.length > 0) {
statusArray[0] = result[0].deviceStatus;
statusArray[1] = result[0].devicePower;
statusArray[2] = result[0].deviceEnergy;
}
dataInformationFunction(statusArray);
});
$.getJSON('/aluminumLiner/getRunParameters', function (result) {
synthetic(result, {a: 1, b: 1})
});
//loss/aluminumLiner/getLossStatistics
$.getJSON('/aluminumLiner/getLossStatistics', function (result) {
loss(result, document.getElementById("loss"));
});
//loss/aluminumLiner/getLossStatistics
$.getJSON('/aluminumLiner/getLossStatistics', function (result) {
loss(result, document.getElementById("loss"));
});
//设备OEE统计
$.getJSON('/aluminumLiner/getOeeStatistics', function (result) {
OEEStatistics(result, document.getElementById("OEEStatistics"));
});
//设备OEE统计
$.getJSON('/aluminumLiner/getOeeStatistics', function (result) {
OEEStatistics(result, document.getElementById("OEEStatistics"));
});
//库存情况
$.getJSON('/aluminumLiner/getInventoryStatistics', function (result) {
inventory(result, document.getElementById("inventory"));
});
//库存情况
$.getJSON('/aluminumLiner/getInventoryStatistics', function (result) {
inventory(result, document.getElementById("inventory"));
});
//生产计划
$.ajax({
url: '/aluminumLiner/getProductionPlan',
type: 'get',
dataType: 'JSON',
success: function (res) {
let Res = {}
Res.data=res.map(val => {
return [val.spe,val.oq,val.aq,val.cha,val.round,]
})
Res.header = ['型号', '计划数', '完成数', '差异数', '执行进度']
dynamicTable({
el: '#productionPlan',
rowNum: 5,
timeout: 0,
header: Res.header,
data: Res.data,
index: false,
fontColor: '#B4B7BF ',
indexBGC: '#86F3FF',
headerBGC: 'rgba(8,36,75,0.2)',
oddRowBGC: 'rgba(8,36,75,0.2)',
evenRowBGC: 'rgba(6,25,57,0.2)',
colWidth: ['20%', '20%', '20%', '20%', '20%']
});
},
error: function (e) {
}
});
tableAnimation('#productionPlan')
//设备故障排名
$.getJSON('/aluminumLiner/getStatisticalOutputByModel', function (result) {
equipmentFailure(result, document.getElementById("equipmentFailure"));
});
setTimeout(fun, 10000)
}
fun()
let fun2 = () => {
//生产计划
$.ajax({
url: '/aluminumLiner/getProductionPlan',
type: 'get',
dataType: 'JSON',
success: function (res) {
$('#productionPlan').empty()
let Res = {}
//设备故障排名
$.getJSON('/aluminumLiner/getStatisticalOutputByModel', function (result) {
equipmentFailure(result, document.getElementById("equipmentFailure"));
});
Res.data = res.map(val => {
return [val["spe"], val["oq"], val["aq"], val["cha"], val.round,]
})
Res.header = ['型号', '计划数', '完成数', '差异数', '执行进度']
dynamicTable({
el: '#productionPlan',
rowNum: 5,
timeout: 0,
header: Res.header,
data: Res.data,
index: false,
fontColor: '#B4B7BF',
indexBGC: '#86F3FF',
headerBGC: 'rgba(8,36,75,0.2)',
oddRowBGC: 'rgba(8,36,75,0.2)',
evenRowBGC: 'rgba(6,25,57,0.2)',
colWidth: ['20%', '20%', '20%', '20%', '20%']
});
},
error: function (e) {
}
});
return setTimeout(fun2, 100000)
}
fun2()
tableAnimation('#productionPlan')
})

42
productionboard/target/classes/static/js/aluminumTank/index.js
Unescape Escape View File

@ -1,24 +1,28 @@
$(()=>{
//班组统计
$.getJSON('/aluminumTank/getTeamStatisticsJson', function (result) {
console.log(result.planAmount+' 数据'+ result.actualAmount, result.differenceAmount)
storageStatistics('白班', result.planAmount, result.actualAmount, result.differenceAmount,)
});
$(() => {
let fun = () => {
//班组统计
$.getJSON('/aluminumTank/getTeamStatisticsJson', function (result) {
console.log(result.planAmount + ' 数据' + result.actualAmount, result.differenceAmount)
storageStatistics('白班', result.planAmount, result.actualAmount, result.differenceAmount,)
});
//按型号统计产量
$.getJSON('/aluminumTank/getMaterialProdutionJson', function (result) {
horizontalBarChart(result,document.getElementById("statisticalOutputByModel"));
});
//按型号统计产量
$.getJSON('/aluminumTank/getMaterialProdutionJson', function (result) {
horizontalBarChart(result, document.getElementById("statisticalOutputByModel"));
});
//小时产量
$.getJSON('/aluminumTank/getHourProdutionJson', function (result) {
bluePolygonHistogram(result, document.getElementById("hourlyOutputStatistics"));
});
//小时产量
$.getJSON('/aluminumTank/getHourProdutionJson', function (result) {
bluePolygonHistogram(result, document.getElementById("hourlyOutputStatistics"));
});
//库存统计
$.getJSON('/aluminumTank/getMaterialStoreJson', function (result) {
console.log(result)
multipleThreeDimensionalCylindrical(result,document.getElementById("inventoryStatistics"));
});
//库存统计
$.getJSON('/aluminumTank/getMaterialStoreJson', function (result) {
console.log(result)
multipleThreeDimensionalCylindrical(result, document.getElementById("inventoryStatistics"));
});
setTimeout(fun, 10000)
}
fun()
})

43
productionboard/target/classes/static/js/common/date-time-common.js
Unescape Escape View File

@ -13,55 +13,56 @@ let rootWidth = document.documentElement.clientWidth || document.body.clientWidt
let rootDom = document.querySelector('html');
rootDom.style.fontSize = rootWidth / 10 + 'px';
getnow();
function getnow(){
function getnow() {
//1、获得当前时间，格式化时间
var now=new Date();
var now = new Date();
var year=now.getFullYear();
var year = now.getFullYear();
var month=now.getMonth()+1;
var month = now.getMonth() + 1;
if(month<10){
if (month < 10) {
month="0"+month;
month = "0" + month;
}
var date=now.getDate();
var date = now.getDate();
if(date<10){
if (date < 10) {
date="0"+date;
date = "0" + date;
}
var hour=now.getHours();
var hour = now.getHours();
if(hour<10){
if (hour < 10) {
hour="0"+hour;
hour = "0" + hour;
}
var minute=now.getMinutes();
var minute = now.getMinutes();
if(minute<10){
if (minute < 10) {
minute="0"+minute;
minute = "0" + minute;
}
var second=now.getSeconds();
var second = now.getSeconds();
if(second<10){
if (second < 10) {
second="0"+second;
second = "0" + second;
}
var nowstr=year+"-"+month+"-"+date+" "+hour+":"+minute+":"+second;
var nowstr = year + "-" + month + "-" + date + " " + hour + ":" + minute + ":" + second;
//alert(nowstr);
//alert(nowstr);
@ -70,8 +71,8 @@ function getnow(){
/*var nowspan=document.getElementById("nowspan");
nowspan.innerHTML=nowstr;*/
//2021-09-30 12:00:00
$("#dateinfo").html(nowstr.slice(0,10));
$("#timeinfo").html(nowstr.slice(11,19));
$("#dateinfo").html(nowstr.slice(0, 10));
$("#timeinfo").html(nowstr.slice(11, 19));
//3、使时间动起来
setTimeout("getnow()", 1000);
}

67
productionboard/target/classes/static/js/common/echarts.common.js
Unescape Escape View File

@ -8,7 +8,7 @@
* 蓝色多边形柱状图：bluePolygonHistogram(res, ids)T
* 多个立体柱状图：multipleThreeDimensionalCylindrical(res, ids)
* */
var timeout1 = ''
//横向柱状图
const horizontalBarChart = (res, ids) => {
@ -365,7 +365,7 @@ const threeDimensionalCylindrical = (res, ids) => {
axisLabel: {
show: true,
margin: 25,
// align: "center",
align: "center",
textStyle: {
fontSize: 14,
color: "#A8A6AB",
@ -382,7 +382,7 @@ const threeDimensionalCylindrical = (res, ids) => {
},
},
},
interval: 3,
interval: 0,
},
yAxis: {
splitLine: {
@ -1167,24 +1167,34 @@ const bluePolygonHistogram = (res, ids) => {
}
//多个立体柱状图
const multipleThreeDimensionalCylindrical = (res, ids) => {
const multipleThreeDimensionalCylindrical = (res, ids, type = 1) => {
let mycharts = echarts.init(ids);
const value = []
res.forEach(e=>{
if(!(value.includes(e.materialName))){
value.push(e.materialName)
}
})
const data = value.map(e => {
return {
materialName:e,
lineStoreAmount:res.filter( val => val.materialName === e).filter(val => val.hullStoreAmount === 'L001')?.[0]?.lineStoreAmount || 0,
hullStoreAmount:res.filter( val => val.materialName === e).filter(val => val.hullStoreAmount === 'U001')?.[0]?.lineStoreAmount || 0
}
})
const xValue = data.map(val => val.materialName)
const lineStoreAmount = data.map(val => val.lineStoreAmount)
const hullStoreAmount = data.map(val => val.hullStoreAmount)
let xValue
let lineStoreAmount
let hullStoreAmount
if (type === 1) {
const value = []
res.forEach(e => {
if (!(value.includes(e.materialName))) {
value.push(e.materialName)
}
})
const data = value.map(e => {
return {
materialName: e,
lineStoreAmount: res.filter(val => val.materialName === e).filter(val => val.hullStoreAmount === 'L001')?.[0]?.lineStoreAmount || 0,
hullStoreAmount: res.filter(val => val.materialName === e).filter(val => val.hullStoreAmount === 'U001')?.[0]?.lineStoreAmount || 0
}
})
xValue = data.map(val => val.materialName)
lineStoreAmount = data.map(val => val.lineStoreAmount)
hullStoreAmount = data.map(val => val.hullStoreAmount)
} else {
xValue = res.map(val => val.materialName)
lineStoreAmount = res.map(val => val.lineStoreAmount)
hullStoreAmount = res.map(val => val.hullStoreAmount)
}
let lineColor = "#406A92";
let labelColor = "#fff";
let fontSize = "12";
@ -1226,7 +1236,7 @@ const multipleThreeDimensionalCylindrical = (res, ids) => {
color: "#fff",
fontSize: fontSize,
},
data: ["内胆库", "箱壳库"],
data: ["箱壳库", "内胆库"],
},
xAxis: [
{
@ -1238,7 +1248,7 @@ const multipleThreeDimensionalCylindrical = (res, ids) => {
lineHeight: 20,
},
axisLabel: {
interval:0,
interval: 0,
color: labelColor,
fontSize: fontSize,
margin: 30,
@ -1538,12 +1548,12 @@ const multipleThreeDimensionalCylindrical = (res, ids) => {
option.grid.bottom = '20%'
}
const aaa = () => {
setInterval(() => {
timeout1 && clearTimeout(timeout1)
timeout1 = setInterval(() => {
option.dataZoom[0].start += stepSize
option.dataZoom[0].start = option.dataZoom[0].start % 100
option.dataZoom[0].end = option.dataZoom[0].start + stepSize
mycharts.setOption(option);
$(window).resize(mycharts.resize);
}, 3000)
}
aaa()
@ -1721,9 +1731,9 @@ const inventory = (res, ids) => {
let barBottomColor = [
"rgba(2,195,241,0.1)",
];
const xAxisData = res.map(val => val.materialName?.split(',')[0] )
const seriesData1 = res.map(val => val.lineStoreAmount)
console.log(xAxisData,seriesData1)
const xAxisData = res.map(val => val.materialName?.split(',')[0])
const seriesData1 = res.map(val => val.lineStoreAmount != 0 ? val.lineStoreAmount : 0.00001)
console.log(xAxisData, seriesData1)
// Res.forEach((item) => {
// xAxisData.push(item.name);
// seriesData1.push(item.value);
@ -1799,6 +1809,9 @@ const inventory = (res, ids) => {
textStyle: {
color: "#02C3F1",
},
formatter: function (params) {
return seriesData1[params.dataIndex] === 0.00001 ? 0 : seriesData1[params.dataIndex]
}
},
symbolPosition: "end",
data: seriesData1,

22
productionboard/target/classes/static/js/common/ondutyplan.js
Unescape Escape View File

@ -1,5 +1,5 @@
/*当前班组统计封装*/
$(() =>{
$(() => {
let html = `<div id="theCurrentTeam" class="onDutyPlan display-blocks theCurrentTeam">
<span>-</span>
<span>-</span>
@ -31,10 +31,10 @@ $(() =>{
$('body').append(html);
})
let onDutyPlan = (scheduledProductionNumber,actualOutPutNumber,differenceValueNumber) =>{
let onDutyPlan = (scheduledProductionNumber, actualOutPutNumber, differenceValueNumber) => {
const scheduledProduction = [];
const actualOutPut = [];
const differenceValue = [];
const actualOutPut = [];
const differenceValue = [];
for (let i = 1; i <= 4; i++) {
scheduledProduction.push(`#scheduledProduction :nth-child(${i})`);
@ -47,11 +47,11 @@ let onDutyPlan = (scheduledProductionNumber,actualOutPutNumber,differenceValueNu
updateSplitBlocks(differenceValueNumber, differenceValue);
}
let storageStatistics = (leftInStoreNumber,leftOutStoreNumber,rightInStoreNumber,rightOutStoreNumber) =>{
let storageStatistics = (leftInStoreNumber, leftOutStoreNumber, rightInStoreNumber, rightOutStoreNumber) => {
const leftInStore = [];
const leftOutStore = [];
const rightInStore = [];
const rightOutStore = [];
const rightInStore = [];
const rightOutStore = [];
for (let i = 1; i <= 4; i++) {
leftInStore.push(`#theCurrentTeam :nth-child(${i})`);
@ -59,8 +59,8 @@ let storageStatistics = (leftInStoreNumber,leftOutStoreNumber,rightInStoreNumber
rightInStore.push(`#actualOutPut :nth-child(${i})`);
rightOutStore.push(`#differenceValue :nth-child(${i})`);
}
updateSplitBlocks(leftInStoreNumber, leftInStore);
updateSplitBlocks(leftOutStoreNumber, leftOutStore);
updateSplitBlocks(rightInStoreNumber, rightInStore);
updateSplitBlocks(rightOutStoreNumber, rightOutStore);
updateSplitBlocks(leftInStoreNumber || 0, leftInStore);
updateSplitBlocks(leftOutStoreNumber || 0, leftOutStore);
updateSplitBlocks(rightInStoreNumber || 0, rightInStore);
updateSplitBlocks(rightOutStoreNumber || 0, rightOutStore);
}

432
productionboard/target/classes/static/js/common/scrollTable.js
Unescape Escape View File

@ -1,6 +1,6 @@
/**
* dynamicTable 动态表格
* @param { Object } resource
* @param { Object } resource
* @param { String } el : 指定元素
* @param { Array } header : 表头
* @param { Array } data : 数据行
@ -15,47 +15,47 @@
* @param { Array } colWidth : 每列的宽度
*/
let dynamicTable = resource => {
'use strict';
'use strict';
//检查参数类型
if (typeof resource !== 'object') {
console.error('未传入参数,或者参数不是Object类型');
return
}
//检查参数类型
if (typeof resource !== 'object') {
console.error('未传入参数,或者参数不是Object类型');
return
}
// 检查是否传入元素
const ele = resource.el;
if (!ele) {
console.error('元素获取不正确！');
return
}
/**
* 检查是否传入动画触发时长
* 当时间小于 10 计算为秒级单位，
* 大于 10 计算为毫秒级单位
*/
let timeout = resource.timeout;
if (!timeout) {
timeout = 2000
} else if (timeout < 10) {
timeout = timeout * 1000
}
// 检查是否传入元素
const ele = resource.el;
if (!ele) {
console.error('元素获取不正确！');
return
}
/**
* 检查是否传入动画触发时长
* 当时间小于 10 计算为秒级单位，
* 大于 10 计算为毫秒级单位
*/
let timeout = resource.timeout;
if (!timeout) {
timeout = 2000
} else if (timeout < 10) {
timeout = timeout * 1000
}
// 检查 配置元素是否传入数据
const colName = resource.header === undefined ? '' : resource.header;
const rowData = resource.data === undefined ? '' : resource.data;
const rowNum = resource.rowNum === undefined ? '20%' : 100 / resource.rowNum + '%';
const headerBGC = resource.headerBGC === undefined ? '#999' : resource.headerBGC;
const oddRowBGC = resource.oddRowBGC === undefined ? '#bbb' : resource.oddRowBGC;
const evenRowBGC = resource.evenRowBGC === undefined ? '#ddd' : resource.evenRowBGC;
const fontColor = resource.fontColor === undefined ? 'black' : resource.fontColor;
const indexBGC = resource.indexBGC === undefined ? '#555' : resource.indexBGC;
const colIndex = resource.index === undefined ? true : resource.index;
const colWidth = resource.colWidth === undefined ? false : resource.colWidth;
const indexColor = fontColor.search(/('black')|(0{3,6})/) ? "white" : fontColor;
// 检查 配置元素是否传入数据
const colName = resource.header === undefined ? '' : resource.header;
const rowData = resource.data === undefined ? '' : resource.data;
const rowNum = resource.rowNum === undefined ? '20%' : 100 / resource.rowNum + '%';
const headerBGC = resource.headerBGC === undefined ? '#999' : resource.headerBGC;
const oddRowBGC = resource.oddRowBGC === undefined ? '#bbb' : resource.oddRowBGC;
const evenRowBGC = resource.evenRowBGC === undefined ? '#ddd' : resource.evenRowBGC;
const fontColor = resource.fontColor === undefined ? 'black' : resource.fontColor;
const indexBGC = resource.indexBGC === undefined ? '#555' : resource.indexBGC;
const colIndex = resource.index === undefined ? true : resource.index;
const colWidth = resource.colWidth === undefined ? false : resource.colWidth;
const indexColor = fontColor.search(/('black')|(0{3,6})/) ? "white" : fontColor;
//基本table html
const html = `
//基本table html
const html = `
<div class="table">
<div class="thead">
<div class="tr"></div>
@ -63,195 +63,195 @@ let dynamicTable = resource => {
<div class="tbody"></div>
</div>
`;
//Css样式集
const boxCSS = {
overflow: 'hidden',
background: headerBGC
};
const tableCSS = {
color: fontColor,
width: '100%',
height: '100%'
};
const theadCSS = {
width: '100%',
height: '20%'
};
const thead_trCSS = {
display: "flex",
flexWrap: "nowrap",
width: "100%",
height: "100%",
background: headerBGC,
justifyContent: "space-around"
};
const thCSS = {
justifyContent: "space-around",
fontWeight: "bold"
};
const tbodyCSS = {
width: "100%",
height: '80%',
boxSizing: 'border-box'
};
const tbody_trCSS = {
flexWrap: "nowrap",
width: "100%",
height: rowNum,
justifyContent: "space-around"
};
const trOddCSS = {
display: "flex",
background: oddRowBGC
};
const trEvenCSS = {
display: "flex",
background: evenRowBGC
};
const th_tdCSS = {
color:'#59B2F6',
margin: 'auto 0',
whiteSpace: 'nowrap',
overflow: "hidden",
textOverflow: 'ellipsis',
textAlign: 'center',
padding: '0 4px 0 4px'
};
const indexCSS = {
display: 'inline-block',
width: '90%',
height: "90%",
background: indexBGC,
color: indexColor,
borderRadius: '20%',
margin: 'auto'
};
//插入table元素
$(ele).append(html);
//Css样式集
const boxCSS = {
overflow: 'hidden',
background: headerBGC
};
const tableCSS = {
color: fontColor,
width: '100%',
height: '100%'
};
const theadCSS = {
width: '100%',
height: '20%'
};
const thead_trCSS = {
display: "flex",
flexWrap: "nowrap",
width: "100%",
height: "100%",
background: headerBGC,
justifyContent: "space-around"
};
const thCSS = {
justifyContent: "space-around",
fontWeight: "bold"
};
const tbodyCSS = {
width: "100%",
height: '80%',
boxSizing: 'border-box'
};
const tbody_trCSS = {
flexWrap: "nowrap",
width: "100%",
height: rowNum,
justifyContent: "space-around"
};
const trOddCSS = {
display: "flex",
background: oddRowBGC
};
const trEvenCSS = {
display: "flex",
background: evenRowBGC
};
const th_tdCSS = {
color: '#59B2F6',
margin: 'auto 0',
whiteSpace: 'nowrap',
overflow: "hidden",
textOverflow: 'ellipsis',
textAlign: 'center',
padding: '0 4px 0 4px'
};
const indexCSS = {
display: 'inline-block',
width: '90%',
height: "90%",
background: indexBGC,
color: indexColor,
borderRadius: '20%',
margin: 'auto'
};
//插入table元素
$(ele).append(html);
//核心代码
//遍历插入数据 表头
if (colIndex) {
$(ele + '>.table>.thead>.tr').append('<div class="th"><span class="index">#</span></div>')
}
colName.forEach(element => {
$(ele + '>.table>.thead>.tr').append(`<div class="th">${element}</div>`)
});
//核心代码
//遍历插入数据 表头
if (colIndex) {
$(ele + '>.table>.thead>.tr').append('<div class="th"><span class="index">#</span></div>')
}
colName.forEach(element => {
$(ele + '>.table>.thead>.tr').append(`<div class="th">${element}</div>`)
});
//遍历插入数据 数据行
for (let i = 0; i < rowData.length; i++) {
//遍历插入数据 数据行
for (let i = 0; i < rowData.length; i++) {
$(ele + '>.table>.tbody').append('<div class="tr"></div>');
if (colIndex) {
$(ele + '>.table>.tbody>.tr:eq(' + i + ')').append(
`<div class="td"><span class="index">${i+1}</span></div>`)
}
rowData[i].forEach(element => {
if (element == "一级") {
$(ele + '>.table>.tbody>.tr:eq(' + i + ')').append(
`<div class="td" ><img src="img/firstAlarm.png" alt="一级报警" width="30%" height="30%" /></div>`
)
} else if (element == "二级") {
$(ele + '>.table>.tbody>.tr:eq(' + i + ')').append(
`<div class="td" ><img src="img/secondAlarm.png" alt="二级报警" width="30%" height="30%" /></div>`
)
} else if (element == "三级") {
$(ele + '>.table>.tbody>.tr:eq(' + i + ')').append(
`<div class="td" ><img src="img/thirdlyAlarm.png" alt="三级报警" width="30%" height="30%" /></div>`
)
} else if (element == "未处理") {
$(ele + '>.table>.tbody>.tr:eq(' + i + ')').append(
`<div class="td" Style="border:1px solid #D81F29;border-radius: 6px;background-color:#941D3B;color:white">${element}</div>`
)
} else if (element == "处理中") {
$(ele + '>.table>.tbody>.tr:eq(' + i + ')').append(
`<div class="td" Style="border:1px solid #E08018;border-radius: 6px;background-color:#935A2F;color:white">${element}</div>`
)
} else if (element == "已结束") {
$(ele + '>.table>.tbody>.tr:eq(' + i + ')').append(
`<div class="td" Style="border:1px solid #0FF4D5;border-radius: 6px;background-color:#0B9EA9;color:white">${element}</div>`
)
} else {
$(ele + '>.table>.tbody>.tr:eq(' + i + ')').append(`<div class="td">${element}</div>`)
}
$(ele + '>.table>.tbody').append('<div class="tr"></div>');
if (colIndex) {
$(ele + '>.table>.tbody>.tr:eq(' + i + ')').append(
`<div class="td"><span class="index">${i + 1}</span></div>`)
}
rowData[i].forEach(element => {
if (element == "一级") {
$(ele + '>.table>.tbody>.tr:eq(' + i + ')').append(
`<div class="td" ><img src="img/firstAlarm.png" alt="一级报警" width="30%" height="30%" /></div>`
)
} else if (element == "二级") {
$(ele + '>.table>.tbody>.tr:eq(' + i + ')').append(
`<div class="td" ><img src="img/secondAlarm.png" alt="二级报警" width="30%" height="30%" /></div>`
)
} else if (element == "三级") {
$(ele + '>.table>.tbody>.tr:eq(' + i + ')').append(
`<div class="td" ><img src="img/thirdlyAlarm.png" alt="三级报警" width="30%" height="30%" /></div>`
)
} else if (element == "未处理") {
$(ele + '>.table>.tbody>.tr:eq(' + i + ')').append(
`<div class="td" Style="border:1px solid #D81F29;border-radius: 6px;background-color:#941D3B;color:white">${element}</div>`
)
} else if (element == "处理中") {
$(ele + '>.table>.tbody>.tr:eq(' + i + ')').append(
`<div class="td" Style="border:1px solid #E08018;border-radius: 6px;background-color:#935A2F;color:white">${element}</div>`
)
} else if (element == "已结束") {
$(ele + '>.table>.tbody>.tr:eq(' + i + ')').append(
`<div class="td" Style="border:1px solid #0FF4D5;border-radius: 6px;background-color:#0B9EA9;color:white">${element}</div>`
)
} else {
$(ele + '>.table>.tbody>.tr:eq(' + i + ')').append(`<div class="td">${element}</div>`)
}
})
})
}
}
//设置CSS样式
$(ele).css(boxCSS);
$(ele + '>.table').css(tableCSS);
$(ele + '>.table>.thead').css(theadCSS);
$(ele + '>.table>.thead>.tr').css(thead_trCSS);
$(ele + '>.table>.thead>.tr>.th').css(th_tdCSS).css(thCSS);
$(ele + '>.table>.tbody').css(tbodyCSS);
$(ele + '>.table>.tbody>.tr').css(tbody_trCSS);
$(ele + '>.table>.tbody>.tr:odd').css(trOddCSS);
$(ele + '>.table>.tbody>.tr:even').css(trEvenCSS);
$(ele + '>.table>.tbody>.tr>.td').css(th_tdCSS);
$(ele + '>.table span.index').css(indexCSS)
//设置CSS样式
$(ele).css(boxCSS);
$(ele + '>.table').css(tableCSS);
$(ele + '>.table>.thead').css(theadCSS);
$(ele + '>.table>.thead>.tr').css(thead_trCSS);
$(ele + '>.table>.thead>.tr>.th').css(th_tdCSS).css(thCSS);
$(ele + '>.table>.tbody').css(tbodyCSS);
$(ele + '>.table>.tbody>.tr').css(tbody_trCSS);
$(ele + '>.table>.tbody>.tr:odd').css(trOddCSS);
$(ele + '>.table>.tbody>.tr:even').css(trEvenCSS);
$(ele + '>.table>.tbody>.tr>.td').css(th_tdCSS);
$(ele + '>.table span.index').css(indexCSS)
//统一计量单位
const emptyUnit = element => element.replace(/[^0-9]/g, '');
const hendlen = $(`${ele}>.table>.thead>.tr>.th`).length;
const bodylen = $(`${ele}>.table>.tbody>.tr:nth-child(1)>.td`).length;
const ceil = Math.ceil;
//统一计量单位
const emptyUnit = element => element.replace(/[^0-9]/g, '');
const hendlen = $(`${ele}>.table>.thead>.tr>.th`).length;
const bodylen = $(`${ele}>.table>.tbody>.tr:nth-child(1)>.td`).length;
const ceil = Math.ceil;
/**
* 设置每列的宽度
* eq() 是在匹配的元素中取下标为n的元素
* nth-child() 是在匹配元素的父元素中选择第n个元素
*/
if (!colWidth) {
$(`${ele}>.table>.thead>.tr>.th`).css({
width: ceil(100 / hendlen) + '%'
});
$(`${ele}>.table>.tbody>.tr>.td`).css({
width: ceil(100 / bodylen) + '%'
});
} else {
for (let i = 0; i < colWidth.length; i++) {
let emptyUnitColWidth = emptyUnit(colWidth[i]);
$(`${ele}>.table>.thead>.tr>.th:nth-child(${i+1})`).width(`${emptyUnitColWidth}%`);
$(`${ele}>.table>.tbody>.tr>.td:nth-child(${i+1})`).width(`${emptyUnitColWidth}%`);
}
}
/**
* 设置每列的宽度
* eq() 是在匹配的元素中取下标为n的元素
* nth-child() 是在匹配元素的父元素中选择第n个元素
*/
if (!colWidth) {
$(`${ele}>.table>.thead>.tr>.th`).css({
width: ceil(100 / hendlen) + '%'
});
$(`${ele}>.table>.tbody>.tr>.td`).css({
width: ceil(100 / bodylen) + '%'
});
} else {
for (let i = 0; i < colWidth.length; i++) {
let emptyUnitColWidth = emptyUnit(colWidth[i]);
$(`${ele}>.table>.thead>.tr>.th:nth-child(${i + 1})`).width(`${emptyUnitColWidth}%`);
$(`${ele}>.table>.tbody>.tr>.td:nth-child(${i + 1})`).width(`${emptyUnitColWidth}%`);
}
}
// 组件销毁钩子
$(`${ele}`).bind('DOMNodeRemoved', (e) => {
if (e.target.classList[0] === 'asit-table') {
clearInterval(animation);
}
});
// 组件销毁钩子
$(`${ele}`).bind('DOMNodeRemoved', (e) => {
if (e.target.classList[0] === 'asit-table') {
clearInterval(animation);
}
});
}
const tableAnimation = (el) => {
const evenRowBGC = 'rgba(6,25,57,0.2)' === undefined ? '#ddd' : 'rgba(6,25,57,0.2)';
const oddRowBGC = 'rgba(8,36,75,0.2)' === undefined ? '#bbb' : 'rgba(8,36,75,0.2)';
const trEvenCSS = {
display: "flex",
background: evenRowBGC
};
const trOddCSS = {
display: "flex",
background: oddRowBGC
};
let oddORevenCheck = $(`${el}>.table>.tbody>.tr`).length % 2 == 0 ? 'even' : 'odd';
setInterval(function () {
$(el + '>.table>.tbody>.tr:eq(0)').slideToggle(100, function () {
switch (oddORevenCheck) {
case 'even':
$(this).clone().css(trEvenCSS).appendTo(el + '>.table>.tbody');
oddORevenCheck = 'odd';
break;
case 'odd':
$(this).clone().css(trOddCSS).appendTo(el + '>.table>.tbody');
oddORevenCheck = 'even';
break;
}
$(this).remove();
});
}, 2000);
const evenRowBGC = 'rgba(6,25,57,0.2)' === undefined ? '#ddd' : 'rgba(6,25,57,0.2)';
const oddRowBGC = 'rgba(8,36,75,0.2)' === undefined ? '#bbb' : 'rgba(8,36,75,0.2)';
const trEvenCSS = {
display: "flex",
background: evenRowBGC
};
const trOddCSS = {
display: "flex",
background: oddRowBGC
};
let oddORevenCheck = $(`${el}>.table>.tbody>.tr`).length % 2 == 0 ? 'even' : 'odd';
setInterval(function () {
$(el + '>.table>.tbody>.tr:eq(0)').slideToggle(100, function () {
switch (oddORevenCheck) {
case 'even':
$(this).clone().css(trEvenCSS).appendTo(el + '>.table>.tbody');
oddORevenCheck = 'odd';
break;
case 'odd':
$(this).clone().css(trOddCSS).appendTo(el + '>.table>.tbody');
oddORevenCheck = 'even';
break;
}
$(this).remove();
});
}, 2000);
}

11
productionboard/target/classes/static/js/common/synthetic.js
Unescape Escape View File

@ -1,4 +1,3 @@
const dataInformationFunction = (statusArray) => {
let info = `<table style="position: absolute;top: 8%;width: 100%;height:100%;">
<tr style="width: 100%; height: 50%;">
@ -10,9 +9,9 @@ const dataInformationFunction = (statusArray) => {
<td style="font-size:150%;border:0px solid red;text-align:center;width: 50%;color: red;">${statusArray[3]}</td>
</tr>
</table>`;
$("#dataInformation").append(info);
$("#dataInformation").html(info);
}
const synthetic = (statusArray,param={a:0,b:0}) => {
const synthetic = (statusArray, param = {a: 0, b: 0}) => {
let info = `<table style="position: absolute;top: 9%;left: 30%;width: 40%;height:7%;">
<tr style="width: 100%; height: 50%;">
<td style="border:0px solid red;font-size:175%;text-align:center;width: 23%;color: #59B2F6;">${statusArray[0] || 0}</td>
@ -35,8 +34,8 @@ const synthetic = (statusArray,param={a:0,b:0}) => {
<td style="border:0px solid red;text-align:center;width: 0%;"></td>
</tr>
</table>
<span style="position: absolute;font-size:175%;top: ${12+param.a}%;left: 85%;width: 9%; height: 6%; text-align: center;color: red;display:inline-block;-webkit-background-clip: text;">${statusArray[8] || 0}</span>
<span style="position: absolute;font-size:175%;top:${26.7+param.b}%;left: 85%;width: 9%; height: 6%; text-align: center;color: #63F659;display:inline-block;-webkit-background-clip: text;">${statusArray[9] || 0}</span>
<span style="position: absolute;font-size:175%;top: ${12 + param.a}%;left: 85%;width: 9%; height: 6%; text-align: center;color: red;display:inline-block;-webkit-background-clip: text;">${statusArray[8] || 0}</span>
<span style="position: absolute;font-size:175%;top:${26.7 + param.b}%;left: 85%;width: 9%; height: 6%; text-align: center;color: #63F659;display:inline-block;-webkit-background-clip: text;">${statusArray[9] || 0}</span>
`;
$("#synthetic").append(info);
$("#synthetic").html(info);
}

248
productionboard/target/classes/static/js/foamBox/index.js
Unescape Escape View File

@ -1,134 +1,136 @@
$(() => {
//班组计划统计
$.getJSON(`/foamBox/getTeamStatisticsJson?ids=${ids}`, function (result) {
onDutyPlan(result.planAmount, result.actualAmount, result.planAmount- result.actualAmount)
});
//设备运行状态
$.getJSON(`/foamBox/getRunStatusJson?ids=${ids}`, function (result) {
deviceStatus(result);
});
// deviceStatus([1,1,1,1,1,1]);
//库存统计
$.getJSON(`/foamBox/getMaterialStoreJson`, function (result) {
threeDimensionalCylindrical(result, document.getElementById("inventoryStatistics"));
});
//按型号统计产量
$.getJSON(`/foamBox/getMaterialProdutionJson?ids=${ids}`, function (result) {
horizontalBarChart(result, document.getElementById("statisticalOutputByModel"));
});
//小时产量
$.getJSON(`/foamBox/getHourProdutionJson?ids=${ids}`, function (result) {
brokenLineAreaDiagram(result, document.getElementById("hourlyOutputStatistics"));
});
//发泡参数
$.getJSON(`/foamBox/getParamTemperature?ids=${ids}`, function (result) {
multipleBrokenLineAreaDiagram(result, document.getElementById("foamingParameters"));
});
// 模具温度1
const temperature = (res, ids) => {
let mycharts = echarts.init(ids);
console.log(res);
let option = {
grid: {
top: '15%',
left: '6%',
right: '6%',
bottom: '3%',
containLabel: true
},
tooltip: {
// trigger: "axis",
},
xAxis: [
{
interval: 0,
type: 'category',
data: res.xValueList,
axisPointer: {
type: 'shadow'
},
axisLabel:{
show: true,
rotate:30,
interval:0
}
}
],
yAxis: [
{
splitLine: {
show: false,
},
type: 'value',
name: '温度',
min: 0,
// max: 50,
interval: 10,
axisLabel: {
formatter: '{value} °C '
}
},
],
series: [
{
name: '内膜温度',
type: 'bar',
tooltip: {
valueFormatter: function (value) {
return value + ' ml';
}
},
data: res.interiorList
},
{
name: '外膜温度',
type: 'bar',
tooltip: {
valueFormatter: function (value) {
return value + ' ml';
}
},
data: res.lateralList
},
]
};
mycharts.setOption(option);
$(window).resize(mycharts.resize);
let fun = () => {
//班组计划统计
$.getJSON(`/foamBox/getTeamStatisticsJson?ids=${ids}`, function (result) {
onDutyPlan(result.planAmount, result.actualAmount, result.planAmount - result.actualAmount)
});
//设备运行状态
$.getJSON(`/foamBox/getRunStatusJson?ids=${ids}`, function (result) {
deviceStatus(result);
});
// deviceStatus([1,1,1,1,1,1]);
//库存统计
$.getJSON(`/foamBox/getMaterialStoreJson`, function (result) {
threeDimensionalCylindrical(result, document.getElementById("inventoryStatistics"));
});
//按型号统计产量
$.getJSON(`/foamBox/getMaterialProdutionJson?ids=${ids}`, function (result) {
horizontalBarChart(result, document.getElementById("statisticalOutputByModel"));
});
//小时产量
$.getJSON(`/foamBox/getHourProdutionJson?ids=${ids}`, function (result) {
brokenLineAreaDiagram(result, document.getElementById("hourlyOutputStatistics"));
});
//发泡参数
$.getJSON(`/foamBox/getParamTemperature?ids=${ids}`, function (result) {
multipleBrokenLineAreaDiagram(result, document.getElementById("foamingParameters"));
});
// 模具温度1
$.getJSON(`/foamBox/getMouldTemperature?ids=${ids}`, function (result) {
temperature(result, document.getElementById("temperatureOne"));
});
$.getJSON(`/foamBox/getMouldTemperature2?ids=${ids}`, function (result) {
temperature(result, document.getElementById("temperatureTwo"));
});
setTimeout(fun, 10000)
}
$.getJSON(`/foamBox/getMouldTemperature?ids=${ids}`, function (result) {
temperature(result, document.getElementById("temperatureOne"));
});
$.getJSON(`/foamBox/getMouldTemperature2?ids=${ids}`, function (result) {
temperature(result, document.getElementById("temperatureTwo"));
});
fun()
})
const temperature = (res, ids) => {
let mycharts = echarts.init(ids);
console.log(res);
let option = {
grid: {
top: '15%',
left: '6%',
right: '6%',
bottom: '3%',
containLabel: true
},
tooltip: {
// trigger: "axis",
},
xAxis: [
{
interval: 0,
type: 'category',
data: res.xValueList,
axisPointer: {
type: 'shadow'
},
axisLabel: {
show: true,
rotate: 30,
interval: 0
}
}
],
yAxis: [
{
splitLine: {
show: false,
},
type: 'value',
name: '温度',
min: 0,
// max: 50,
interval: 10,
axisLabel: {
formatter: '{value} °C '
}
},
],
series: [
{
name: '内膜温度',
type: 'bar',
tooltip: {
valueFormatter: function (value) {
return value + ' ml';
}
},
data: res.interiorList
},
{
name: '外膜温度',
type: 'bar',
tooltip: {
valueFormatter: function (value) {
return value + ' ml';
}
},
data: res.lateralList
},
]
};
mycharts.setOption(option);
$(window).resize(mycharts.resize);
}
const deviceStatus = (statusArray) => {
let info = `<table style="width: 100%;height:100%;">
<tr style="width: 100%;">
<td style="position:absolute;top:-7%;left:8%;height:50%;width:10%;border:0px solid red;text-align:left;"><img src="../../img/foamBox/${statusArray[0] == 1 ? "deviceopen.png" : "deviceclose.png"}" style="width: 2vw;"/></td>
<td style="position:absolute;top:-7%;left:23%;height:50%;width:10%;border:0px solid red;text-align:left;"><img src="../../img/foamBox/${statusArray[1] == 1 ? "deviceopen.png" : "deviceclose.png"}" style="width: 2vw;"/></td>
<td style="position:absolute;top:-7%;left:38%;height:50%;width:10%;border:0px solid red;text-align:left;"><img src="../../img/foamBox/${statusArray[2] == 1 ? "deviceopen.png" : "deviceclose.png"}" style="width: 2vw;"/></td>
<td style="position:absolute;top:-7%;left:52%;height:50%;width:10%;border:0px solid red;text-align:left;"><img src="../../img/foamBox/${statusArray[3] == 1 ? "deviceopen.png" : "deviceclose.png"}" style="width: 2vw;"/></td>
<td style="position:absolute;top:-7%;left:75%;height:50%;width:10%;border:0px solid red;text-align:left;"><img src="../../img/foamBox/${statusArray[4] == 1 ? "deviceopen.png" : "deviceclose.png"}" style="width: 2vw;"/></td>
<td style="position:absolute;top:-7%;left:93%;height:50%;width:10%;border:0px solid red;text-align:left;"><img src="../../img/foamBox/${statusArray[5] == 1 ? "deviceopen.png" : "deviceclose.png"}" style="width: 2vw;"/></td>
</tr>
</table>`;
let info = `
<img src="../../img/foamBox/${statusArray[0] == 1 ? "deviceopen.png" : "deviceclose.png"}" style="position: absolute;transform: translate(-50%,-50%);top:30%;left:34%;width: 2vw;"/>
<img src="../../img/foamBox/${statusArray[1] == 1 ? "deviceopen.png" : "deviceclose.png"}" style="position: absolute;transform: translate(-50%,-50%);top:30%;left:40%;width: 2vw;"/>
<img src="../../img/foamBox/${statusArray[2] == 1 ? "deviceopen.png" : "deviceclose.png"}" style="position: absolute;transform: translate(-50%,-50%);top:30%;left:45%;width: 2vw;"/>
<img src="../../img/foamBox/${statusArray[3] == 1 ? "deviceopen.png" : "deviceclose.png"}" style="position: absolute;transform: translate(-50%,-50%);top:30%;left:51%;width: 2vw;"/>
<img src="../../img/foamBox/${statusArray[4] == 1 ? "deviceopen.png" : "deviceclose.png"}" style="position: absolute;transform: translate(-50%,-50%);top:30%;left:60%;width: 2vw;"/>
<img src="../../img/foamBox/${statusArray[5] == 1 ? "deviceopen.png" : "deviceclose.png"}" style="position: absolute;transform: translate(-50%,-50%);top:30%;left:68%;width: 2vw;"/>
`;
$(".foamingLineRunStatus table tr").append(info);

38
productionboard/target/classes/static/js/preassemble/index.js
Unescape Escape View File

@ -1,22 +1,26 @@
$(()=>{
// onDutyPlan(1234,1202,33);
$.getJSON('/preassemble/getTeamStatisticsJson', function (result) {
storageStatistics(result.className, result.planAmount, result.actualAmount, result.differenceAmount,)
});
//按型号统计产量
$.getJSON('/preassemble/getMaterialProdutionJson', function (result) {
horizontalBarChart(result,document.getElementById("statisticalOutputByModel"));
});
$(() => {
let fun = () => {
// onDutyPlan(1234,1202,33);
$.getJSON('/preassemble/getTeamStatisticsJson', function (result) {
storageStatistics(result.className, result.planAmount, result.actualAmount, result.differenceAmount,)
});
//按型号统计产量
$.getJSON('/preassemble/getMaterialProdutionJson', function (result) {
horizontalBarChart(result, document.getElementById("statisticalOutputByModel"));
});
//小时产量
$.getJSON('/preassemble/getHourProdutionJson', function (result) {
greenPolygonalHistogram(result, document.getElementById("hourlyOutputStatistics"));
});
//小时产量
$.getJSON('/preassemble/getHourProdutionJson', function (result) {
greenPolygonalHistogram(result, document.getElementById("hourlyOutputStatistics"));
});
//库存统计
$.getJSON('/preassemble/getMaterialStoreJson', function (result) {
threeDimensionalCylindrical(result,document.getElementById("inventoryStatistics"));
});
//库存统计
$.getJSON('/preassemble/getMaterialStoreJson', function (result) {
threeDimensionalCylindrical(result, document.getElementById("inventoryStatistics"));
});
setTimeout(fun, 10000)
}
fun()
})

99
productionboard/target/classes/static/js/storage/index.js
Unescape Escape View File

@ -1,50 +1,59 @@
$(()=>{
//生产计划
$.ajax({
url: '/storage/getProductionPlan',
type: 'GET',
dataType: 'JSON',
success: function(res) {
dynamicTable({
el: '#productionPlan',
rowNum: 5,
timeout: 0,
header: res.header,
data: res.data,
index: false,
fontColor: '#B4B7BF ',
indexBGC: '#86F3FF',
headerBGC: 'rgba(8,36,75,0.2)',
oddRowBGC: 'rgba(8,36,75,0.2)',
evenRowBGC: 'rgba(6,25,57,0.2)',
colWidth: ['20%', '20%', '20%', '20%','20%']
});
},
error: function(e) {
console.log(e)
}
});
$(() => {
let fun2 = () => {
//生产计划
$.ajax({
url: '/storage/getProductionPlan',
type: 'GET',
dataType: 'JSON',
success: function (res) {
$('#productionPlan').empty()
dynamicTable({
el: '#productionPlan',
rowNum: 5,
timeout: 0,
header: res.header,
data: res.data,
index: false,
fontColor: '#B4B7BF ',
indexBGC: '#86F3FF',
headerBGC: 'rgba(8,36,75,0.2)',
oddRowBGC: 'rgba(8,36,75,0.2)',
evenRowBGC: 'rgba(6,25,57,0.2)',
colWidth: ['20%', '20%', '20%', '20%', '20%']
});
},
error: function (e) {
console.log(e)
}
});
return setTimeout(fun2, 100000)
}
fun2()
tableAnimation('#productionPlan')
//当前库存统计
$.getJSON(`/storage/getStoreStatistics?ids=${ids}`, function (result) {
multipleThreeDimensionalCylindrical(result, document.getElementById("theCurrentInventory"));
});
//库位参数
$.getJSON(`/storage/getParamJson?ids=${ids}`, function (result) {
//单日出入库统计
storageStatistics(result[0] == null ? 0 : result[0],result[1] == null ? 0 : result[1],result[2] == null ? 0 : result[2],result[3] == null ? 0 : result[3]);
let fun = () => {
//当前库存统计
$.getJSON(`/storage/getStoreStatistics?ids=${ids}`, function (result) {
multipleThreeDimensionalCylindrical(result, document.getElementById("theCurrentInventory"), 2);
});
//库位参数
$.getJSON(`/storage/getParamJson?ids=${ids}`, function (result) {
//单日出入库统计
storageStatistics(result[0] == null ? 0 : result[0], result[1] == null ? 0 : result[1], result[2] == null ? 0 : result[2], result[3] == null ? 0 : result[3]);
//库存统计
$("#emptyLocation-left").text(result[4] == null ? 0 : result[4]);
$("#haveUsedLocation-left").text(result[6] == null ? 0 : result[5]);
$("#emptyLocation-right").text(result[5] == null ? 0 : result[6]);
$("#haveUsedLocation-right").text(result[7] == null ? 0 : result[7]);
//库存统计
$("#emptyLocation-left").text(result[4] == null ? 0 : result[4]);
$("#haveUsedLocation-left").text(result[6] == null ? 0 : result[5]);
$("#emptyLocation-right").text(result[5] == null ? 0 : result[6]);
$("#haveUsedLocation-right").text(result[7] == null ? 0 : result[7]);
//库位占比
$("#emptyLocationNumber").text(result[8] == null ? 0 : result[8]);
$("#emptyLocationRatio").text(result[9] == null ? 0 : result[9]);
$("#haveUsedLocationNumber").text(result[10] == null ? 0 : result[10]);
$("#haveUsedLocationRatio").text(result[11] == null ? 0 : result[11]);
});
//库位占比
$("#emptyLocationNumber").text(result[8] == null ? 0 : result[8]);
$("#emptyLocationRatio").text(result[9] == null ? 0 : result[9]);
$("#haveUsedLocationNumber").text(result[10] == null ? 0 : result[10]);
$("#haveUsedLocationRatio").text(result[11] == null ? 0 : result[11]);
});
setTimeout(fun, 10000)
}
fun()
})

40
productionboard/target/classes/static/js/tankShell/index.js
Unescape Escape View File

@ -1,23 +1,27 @@
$(()=>{
//班组统计
// onDutyPlan(1234,1202,33);
$.getJSON('/tankShell/getTeamStatisticsJson', function (result) {
storageStatistics('白班', result.planAmount, result.actualAmount, result.differenceAmount,)
});
$(() => {
let fun = () => {
//班组统计
// onDutyPlan(1234,1202,33);
$.getJSON('/tankShell/getTeamStatisticsJson', function (result) {
storageStatistics('白班', result.planAmount, result.actualAmount, result.differenceAmount,)
});
//按型号统计产量
$.getJSON('/tankShell/getMaterialProdutionJson', function (result) {
horizontalBarChart(result,document.getElementById("statisticalOutputByModel"));
});
//按型号统计产量
$.getJSON('/tankShell/getMaterialProdutionJson', function (result) {
horizontalBarChart(result, document.getElementById("statisticalOutputByModel"));
});
//小时产量
$.getJSON('/tankShell/getHourProdutionJson', function (result) {
brokenLineAreaDiagram(result, document.getElementById("hourlyOutputStatistics"));
});
//小时产量
$.getJSON('/tankShell/getHourProdutionJson', function (result) {
brokenLineAreaDiagram(result, document.getElementById("hourlyOutputStatistics"));
});
//库存统计
$.getJSON('/tankShell/getMaterialStoreJson', function (result) {
multipleThreeDimensionalCylindrical(result,document.getElementById("inventoryStatistics"));
});
//库存统计
$.getJSON('/tankShell/getMaterialStoreJson', function (result) {
multipleThreeDimensionalCylindrical(result, document.getElementById("inventoryStatistics"));
});
setTimeout(fun, 10000)
}
fun()
})

12
productionboard/target/classes/templates/adsorptionTank/index.html
Unescape Escape View File

@ -14,14 +14,14 @@
</head>
<body>
<!--小时产量统计-->
<div class="hourlyOutputStatistics" id="hourlyOutputStatistics"></div>
<!--小时产量统计-->
<div class="hourlyOutputStatistics" id="hourlyOutputStatistics"></div>
<!--型号产量统计-->
<div class="statisticalOutputByModel" id="statisticalOutputByModel"></div>
<!--型号产量统计-->
<div class="statisticalOutputByModel" id="statisticalOutputByModel"></div>
<!--库存统计-->
<div class="inventoryStatistics" id="inventoryStatistics"></div>
<!--库存统计-->
<div class="inventoryStatistics" id="inventoryStatistics"></div>
</body>
<script src="../../../js/adsorptionTank/index.js"></script>
</html>

32
productionboard/target/classes/templates/aluminumLiner/index.html
Unescape Escape View File

@ -16,28 +16,28 @@
</head>
<body>
<!--数据信息-->
<div class="dataInformation" id="dataInformation"></div>
<!--数据信息-->
<div class="dataInformation" id="dataInformation"></div>
<!--能耗产量统计-->
<div class="synthetic" id="synthetic"></div>
<!--能耗产量统计-->
<div class="synthetic" id="synthetic"></div>
<!--设备OEE统计-->
<div class="OEEStatistics" id="OEEStatistics"></div>
<!--设备OEE统计-->
<div class="OEEStatistics" id="OEEStatistics"></div>
<!--库存情况-->
<div class="inventory" id="inventory"></div>
<!--库存情况-->
<div class="inventory" id="inventory"></div>
<!--生产计划-->
<div class="productionPlan" id="productionPlan"></div>
<!--loss-->
<div class="loss" id="loss"></div>
<!--生产计划-->
<div class="productionPlan" id="productionPlan"></div>
<!--设备故障排名-->
<div class="equipmentFailure" id="equipmentFailure"></div>
<!--loss-->
<div class="loss" id="loss"></div>
<!--设备故障排名-->
<div class="equipmentFailure" id="equipmentFailure"></div>
</body>
<script src="../../../js/common/synthetic.js"></script>

14
productionboard/target/classes/templates/aluminumTank/index.html
Unescape Escape View File

@ -14,16 +14,16 @@
</head>
<body>
<!--按型号统计产量-->
<div class="statisticalOutputByModel" id="statisticalOutputByModel"></div>
<!--按型号统计产量-->
<div class="statisticalOutputByModel" id="statisticalOutputByModel"></div>
<!--库存统计-->
<div class="inventoryStatistics" id="inventoryStatistics"></div>
<!--库存统计-->
<div class="inventoryStatistics" id="inventoryStatistics"></div>
<!--小时产量-->
<div class="hourlyOutputStatistics" id="hourlyOutputStatistics"></div>
<!--小时产量-->
<div class="hourlyOutputStatistics" id="hourlyOutputStatistics"></div>
</body>
<script src="../../../js/aluminumTank/index.js"></script>
<script src="../../../js/aluminumTank/index.js"></script>
</html>

52
productionboard/target/classes/templates/foamBox/index.html
Unescape Escape View File

@ -17,39 +17,39 @@
</head>
<body>
<!--库存统计-->
<div class="inventoryStatistics" id="inventoryStatistics"></div>
<!--库存统计-->
<div class="inventoryStatistics" id="inventoryStatistics"></div>
<!--型号产量统计-->
<div class="statisticalOutputByModel" id="statisticalOutputByModel"></div>
<!--型号产量统计-->
<div class="statisticalOutputByModel" id="statisticalOutputByModel"></div>
<!--小时产量统计-->
<div class="hourlyOutputStatistics" id="hourlyOutputStatistics"></div>
<!--小时产量统计-->
<div class="hourlyOutputStatistics" id="hourlyOutputStatistics"></div>
<!--发泡参数-->
<div class="foamingParameters" id="foamingParameters"></div>
<!--发泡参数-->
<div class="foamingParameters" id="foamingParameters"></div>
<!--设备运行状态-->
<div class="foamingLineRunStatus">
<table style="width: 100%;height:100%;">
<tr style="width: 100%;">
</tr>
</table>
</div>
<!--设备运行状态-->
<div class="foamingLineRunStatus">
<table style="width: 100%;height:100%;">
<tr style="width: 100%;">
</tr>
</table>
</div>
<!-- 轮播 -->
<div class="swiperModule">
<div class="swiper mySwiper">
<div class="swiper-wrapper">
<div class="swiper-slide">
<div class="temperatureOne" id="temperatureOne"></div>
</div>
<div class="swiper-slide">
<div class="temperatureTwo" id="temperatureTwo"></div>
</div>
<!-- 轮播 -->
<div class="swiperModule">
<div class="swiper mySwiper">
<div class="swiper-wrapper">
<div class="swiper-slide">
<div class="temperatureOne" id="temperatureOne"></div>
</div>
<div class="swiper-slide">
<div class="temperatureTwo" id="temperatureTwo"></div>
</div>
</div>
</div>
</div>
</div>
</body>
<script src="../../../js/foamBox/index.js"></script>
<script>

22
productionboard/target/classes/templates/index.html
Unescape Escape View File

@ -5,17 +5,17 @@
<title>澳柯玛可视化看板</title>
</head>
<body>
<p> <a href="/adsorptionTank">吸附内胆</a></p>
<p> <a href="/aluminumTank">铝内胆生产数据监控</a></p>
<p><a href="/aluminumLiner">铝内胆成型线设备看板</a></p>
<p> <a href="/preassemble">吸附内胆预装</a></p>
<p> <a href="/tankShell">箱壳自动成型线生产看板</a></p>
<p> <a href="/tankShellDevice">箱壳自动成型线设备看板</a></p>
<p><a href="/adsorptionTank">吸附内胆</a></p>
<p><a href="/aluminumTank">铝内胆生产数据监控</a></p>
<p><a href="/aluminumLiner">铝内胆成型线设备看板</a></p>
<p><a href="/preassemble">吸附内胆预装</a></p>
<p><a href="/tankShell">箱壳自动成型线生产看板</a></p>
<p><a href="/tankShellDevice">箱壳自动成型线设备看板</a></p>
<p> <a href="/foamBox?id=0">发泡南线</a></p>
<p> <a href="/foamBox?id=1">发泡北线</a></p>
<p> <a href="/storage?id=0">门体库南线</a></p>
<p> <a href="/storage?id=1">门体库北线</a></p>
<p> <a href="/aluminumLiner">铝内胆成型线</a></p>
<p><a href="/foamBox?id=0">发泡南线</a></p>
<p><a href="/foamBox?id=1">发泡北线</a></p>
<p><a href="/storage?id=0">门体库南线</a></p>
<p><a href="/storage?id=1">门体库北线</a></p>
<p><a href="/aluminumLiner">铝内胆成型线</a></p>
</body>
</html>

12
productionboard/target/classes/templates/preassemble/index.html
Unescape Escape View File

@ -14,14 +14,14 @@
</head>
<body>
<!--小时产量统计-->
<div class="hourlyOutputStatistics" id="hourlyOutputStatistics"></div>
<!--小时产量统计-->
<div class="hourlyOutputStatistics" id="hourlyOutputStatistics"></div>
<!--型号产量统计-->
<div class="statisticalOutputByModel" id="statisticalOutputByModel"></div>
<!--型号产量统计-->
<div class="statisticalOutputByModel" id="statisticalOutputByModel"></div>
<!--库存统计-->
<div class="inventoryStatistics" id="inventoryStatistics"></div>
<!--库存统计-->
<div class="inventoryStatistics" id="inventoryStatistics"></div>
</body>
<script src="../../../js/preassemble/index.js"></script>
</html>

32
productionboard/target/classes/templates/storage/index.html
Unescape Escape View File

@ -15,31 +15,31 @@
</head>
<body>
<!--生产计划-->
<div class="productionPlan" id="productionPlan"></div>
<!--生产计划-->
<div class="productionPlan" id="productionPlan"></div>
<!--当前库存-->
<div class="theCurrentInventory" id="theCurrentInventory"></div>
<!--当前库存-->
<div class="theCurrentInventory" id="theCurrentInventory"></div>
<!--库位统计-左库-->
<div class="emptyLocation" style="left:43%" id="emptyLocation-left"></div>
<div class="haveUsedLocation" style="left:43%" id="haveUsedLocation-left"></div>
<!--库位统计-左库-->
<div class="emptyLocation" style="left:43%" id="emptyLocation-left"></div>
<div class="haveUsedLocation" style="left:43%" id="haveUsedLocation-left"></div>
<!--库位统计-右库-->
<div class="emptyLocation" style="right:8%" id="emptyLocation-right"></div>
<div class="haveUsedLocation" style="right:8%" id="haveUsedLocation-right"></div>
<!--库位统计-右库-->
<div class="emptyLocation" style="right:8%" id="emptyLocation-right"></div>
<div class="haveUsedLocation" style="right:8%" id="haveUsedLocation-right"></div>
<!--库位占比-->
<div class="emptyLocationRatio" style="left: 55.5%;" id="emptyLocationNumber"></div>
<div class="emptyLocationRatio" style="left: 60.7%;" id="emptyLocationRatio"></div>
<!--库位占比-->
<div class="emptyLocationRatio" style="left: 55.5%;" id="emptyLocationNumber"></div>
<div class="emptyLocationRatio" style="left: 60.7%;" id="emptyLocationRatio"></div>
<div class="haveUsedLocationRatio" style="right: 20.8%;" id="haveUsedLocationNumber"></div>
<div class="haveUsedLocationRatio" style="right: 15.5%;" id="haveUsedLocationRatio"></div>
<div class="haveUsedLocationRatio" style="right: 20.8%;" id="haveUsedLocationNumber"></div>
<div class="haveUsedLocationRatio" style="right: 15.5%;" id="haveUsedLocationRatio"></div>
</body>
<script src="../../../js/storage/index.js"></script>
<script>
const ids = [[${positionId}]];
</script>

49
productionboard/target/classes/templates/tankShell/device.html
Unescape Escape View File

@ -16,38 +16,37 @@
</head>
<body>
<!--数据信息-->
<div class="dataInformation" id="dataInformation"></div>
<!--能耗产量统计-->
<div class="energyProductionStatistics" id="energyProductionStatistics"></div>
<!--运行参数统计-->
<div class="runParamStatistics" id="runParamStatistics"></div>
<div >
<!--loss参数-->
<span class="lossParam" id="lossParam"></span>
<!--数据信息-->
<div class="dataInformation" id="dataInformation"></div>
<!--能耗产量统计-->
<div class="energyProductionStatistics" id="energyProductionStatistics"></div>
<!--运行参数统计-->
<div class="runParamStatistics" id="runParamStatistics"></div>
<div>
<!--loss参数-->
<span class="lossParam" id="lossParam"></span>
<!--节拍参数-->
<span class="meterParam" id="meterParam"></span>
</div>
<!--节拍参数-->
<span class="meterParam" id="meterParam"></span>
</div>
<!--设备OEE统计-->
<div class="OEEStatistics" id="OEEStatistics"></div>
<!--设备OEE统计-->
<div class="OEEStatistics" id="OEEStatistics"></div>
<!--设备故障排名-->
<div class="equipmentFailure" id="equipmentFailure"></div>
<!--设备故障排名-->
<div class="equipmentFailure" id="equipmentFailure"></div>
<!--loss-->
<div class="loss" id="loss"></div>
<!--loss-->
<div class="loss" id="loss"></div>
<!--设备信息-->
<div class="scrollTable">
<div class="productionPlan" id="productionPlan"></div>
</div>
<!--设备信息-->
<div class="scrollTable">
<div class="productionPlan" id="productionPlan"></div>
</div>
<!--设备产量能耗对比-->
<div class="energyConsumption" id="energyConsumption"></div>
<!--设备产量能耗对比-->
<div class="energyConsumption" id="energyConsumption"></div>
</body>
<script src="../../../js/tankShell/device.js"></script>

14
productionboard/target/classes/templates/tankShell/index.html
Unescape Escape View File

@ -14,16 +14,16 @@
</head>
<body>
<!--按型号统计产量-->
<div class="statisticalOutputByModel" id="statisticalOutputByModel"></div>
<!--按型号统计产量-->
<div class="statisticalOutputByModel" id="statisticalOutputByModel"></div>
<!--库存统计-->
<div class="inventoryStatistics" id="inventoryStatistics"></div>
<!--库存统计-->
<div class="inventoryStatistics" id="inventoryStatistics"></div>
<!--小时产量-->
<div class="hourlyOutputStatistics" id="hourlyOutputStatistics"></div>
<!--小时产量-->
<div class="hourlyOutputStatistics" id="hourlyOutputStatistics"></div>
</body>
<script src="../../../js/tankShell/index.js"></script>
<script src="../../../js/tankShell/index.js"></script>
</html>
Write Preview
Loading…
Cancel
Save