Merge remote-tracking branch 'gitee/master'

master
wangh 3 years ago
commit 3188ad2298

@ -1,80 +1,126 @@
$(() => {
moduleTitle()
LOSS()
yieldTabs()
Tips()
// 公共请求地址
let url = '/broad/box'
let url = '/broad/zz'
const INTERVAL = 30000
// LOSS(分类)
autoUpdate(url + "/getProductPlanInfo ", INTERVAL, data => {
verticalBarChart(null, document.getElementById("LOSSClassify"));
})
const request = () => {
// 目标
$.post(url + "/selectProductInByTeam/0", {}, data => {
data = JSON.parse(data)
if (isFirst) {
// target.top = data.map(val => val.val)
// target.bottom = data.val
// request()
// isFirst = false
}
})
// LOSS(分类)
$.post(url + "/selectLossInfo", {}, data => {
data = JSON.parse(data)
LOSS(data.find(val => val.name == '1').qty)
verticalBarChart({
xName: ["0-3分钟", "3-10分钟", ">10分钟"],
yData: [data.find(val => val.name == '2').qty, data.find(val => val.name == '3').qty, data.find(val => val.name == '4').qty],
}, document.getElementById("LOSSClassify"));
})
// 产量
$.post(url + `/selectProductInByTeam/${yieldType}`, {}, data => {
data = JSON.parse(data)
barChartAndLineChartThree({
xName: data.map(val => val.name),
yDataOne: data.map(val => val.qty),
yDataOneName: "实际产量",
yDataTwo: target.top,
yDataTwoName: "目标产量",
}, document.getElementById("yield"));
})
// 产量
autoUpdate(url + "/getProductPlanInfo ", INTERVAL, data => {
barChartAndLineChartThree(null, document.getElementById("yield"));
})
// 一次装配不合格率
$.post(url + `/selectProductInByTeam/${yieldType}`, {}, data => {
data = JSON.parse(data)
barChartAndLineChartFour({
xName: data.map(val => val.name),
yDataOne: data.map(val => val.qty),
yDataOneName: "不良数",
yDataTwo: [9, 3, 7, 7, 7, 2, 7, 1, 6, 7, 2, 1, 5],
yDataTwoName: "一次装配不合格率",
yDataThree: target.bottom,
yDataThreeName: "目标",
}, document.getElementById("fractionDefective"));
})
// 一次装配不合格率
autoUpdate(url + "/getProductPlanInfo ", INTERVAL, data => {
barChartAndLineChartFour(null, document.getElementById("fractionDefective"));
})
//追踪事件轮询
autoUpdate(url + "/getProductPlanInfo ", INTERVAL, data => {
$('#trackEvents').remove()
$('.trackEventsScrollTable').html('<div class="trackEvents" id="trackEvents"></div>')
dynamicTable({
el: '#trackEvents',
rowNum: 5,
timeout: 0,
header: [ "编号", "计划数量", "完成数量", "差异值", "时间"],
data: data.map(value => [value.plan_code, value.plan_number, value.actual_number, value.plan_number - value.actual_number, value.day]),
index: false,
fontColor: '#B4B7BF ',
indexBGC: '#86F3FF',
headerBGC: 'rgba(8,36,75,0.2)',
oddRowBGC: 'rgba(8,36,75,0.2)',
evenRowBGC: 'rgba(8,36,75,0.2)',
colWidth: ['30%', '13%', '13%', '14%', '30%']
});
})
//追踪事件轮询
$.post("/broad/beforeLibrary/selectOrderInfo", {}, data => {
data = JSON.parse(data)
console.log(data)
$('#trackEvents').remove()
$('.trackEventsScrollTable').html('<div class="trackEvents" id="trackEvents"></div>')
dynamicTable({
el: '#trackEvents',
rowNum: 5,
timeout: 0,
header: ["编号", "计划数量", "完成数量", "差异值", "时间"],
data: data.map(value => [value.plan_code.slice(4, value.plan_code.length), value.plan_number, value.actual_number, value.plan_number - value.actual_number, value.day]),
index: false,
fontColor: '#B4B7BF ',
indexBGC: '#86F3FF',
headerBGC: 'rgba(8,36,75,0.2)',
oddRowBGC: 'rgba(8,36,75,0.2)',
evenRowBGC: 'rgba(8,36,75,0.2)',
colWidth: ['30%', '13%', '13%', '14%', '30%']
});
})
}
const yieldTabs = () => {
$('#yieldTabs div').click(function () {
yieldType = $(this).attr('type')
$(this).css({backgroundColor: '#2C95FD', color: '#C2D8FF'})
$(this).siblings().css({backgroundColor: '#C2D8FF', color: '#2C95FD'})
request()
})
}
request()
yieldTabs()
tableAnimation('#trackEvents')
setInterval(request, INTERVAL)
})
let yieldType = '1'
const LOSS = () => {
let yieldType = '0'
let isFirst = true
let target = {
top: [382, 102, 186, 200, 102, 186, 315, 1, 1, 1, 1],
bottom: [3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3],
topTips: '2000',
bottomTips: '3.05',
}
const LOSS = (val1=0,val2=24) => {
const html = `
<span style="position: absolute;top: 15.7%;left: 61.8%;color: #CFD2D0;font-size: 2vw;transform: translateX(-50%)">123.32</span>
<span style="position: absolute;top: 15.7%;left: 85.5%;color: #CFD2D0;font-size: 2vw;transform: translateX(-50%)">123</span>
<span style="position: absolute;top: 15.7%;left: 61.8%;color: #CFD2D0;font-size: 2vw;transform: translateX(-50%)">${val1}</span>
<span style="position: absolute;top: 15.7%;left: 85.5%;color: #CFD2D0;font-size: 2vw;transform: translateX(-50%)">${val2}</span>
`
$('body').append(html)
$('#LOSS').html(html)
}
const moduleTitle = () => {
const html = `
<span style="position: absolute;top: 0.9%;left: 50%;color: #fff;font-size: 1.3vw;transform: translateX(-50%);letter-spacing: 0.3vw">总装生产数据及质量数据</span>
<span style="position: absolute;top: 10%;left: 53%;color: #CFD2D0;font-size: 1.0vw">LOSS分钟</span>
<span style="position: absolute;top: 10%;left: 76.5%;color: #CFD2D0;font-size: 1.0vw">标准节拍</span>
<span style="position: absolute;top: 10%;left: 5.5%;color: #CFD2D0;font-size: 1.0vw">入库</span>
<span style="position: absolute;top: 54.3%;left: 5.5%;color: #CFD2D0;font-size: 1.0vw">外观检测</span>
<span style="position: absolute;top: 10%;left: 5.5%;color: #CFD2D0;font-size: 1.0vw">成品产</span>
<span style="position: absolute;top: 54.3%;left: 5.5%;color: #CFD2D0;font-size: 1.0vw">一次装配不合格率</span>
<span style="position: absolute;top: 24.8%;left: 53%;color: #CFD2D0;font-size: 1.0vw">LOSS分类</span>
<span style="position: absolute;top: 54.3%;left: 53%;color: #CFD2D0;font-size: 1.0vw">外观质量问题</span>
<span style="position: absolute;top: 54.3%;left: 53%;color: #CFD2D0;font-size: 1.0vw">入库订单</span>
`
$('body').append(html)
}
const yieldTabs = () => {
$('#yieldTabs div').click(function () {
yieldType = $(this).attr('type')
$(this).css({backgroundColor: '#2C95FD', color: '#C2D8FF'})
$(this).siblings().css({backgroundColor: '#C2D8FF', color: '#2C95FD'})
})
}
const Tips = () => {
const Tips = (top={target:target.topTips,progress:0,reality:0,gap:0,rate:0},bottom={target:target.bottomTips,reality:0,total:0}) => {
const html = `
<span style="position: absolute;top: 10%;left: 19%;color: #fff;font-size: 1vw;">目标2000 进度目标1500 实际1000 差异500 达成率66% </span>
<span style="position: absolute;top: 54.3%;left: 19%;color: #fff;font-size: 1vw">目标3.05% 实际2.16% 累计不良数40</span>
<span style="position: absolute;top: 10%;left: 19%;color: #fff;font-size: 1vw;">目标${top.target} 进度目标${top.progress} 实际${top.reality} 差异${top.gap} 达成率${top.rate}% </span>
<span style="position: absolute;top: 54.3%;left: 19%;color: #fff;font-size: 1vw">目标${bottom.target}% 实际${bottom.reality}% 累计不良数${bottom.total}</span>
`
$('body').append(html)
}
}

@ -714,9 +714,14 @@ const barChartAndLineChartThree = function (data, id) {
itemStyle: {
normal: {
barBorderRadius: 5,
color: function (data) {
console.log(data.dataIndex)
return "#0D81ED"
color: function (val) {
console.log()
if (data.yDataOne[val.dataIndex] >=data.yDataTwo[val.dataIndex]){
return '#30e391'
}else{
return '#FE70A6'
}
// return "#0D81ED"
},
},
},
@ -732,16 +737,8 @@ const barChartAndLineChartThree = function (data, id) {
symbolSize: 6,
lineStyle: {
normal: {
color: new echarts.graphic.LinearGradient(0, 0, 1, 0, [
{
offset: 0,
color: "#8fb9d7",
},
{
offset: 1,
color: "#0F59E6",
},
]),
width:3,
color: '#fff',
},
borderColor: "#f0f",
},
@ -760,31 +757,6 @@ const barChartAndLineChartThree = function (data, id) {
// tooltip: {
// show: false
// },
areaStyle: {
//区域填充样式
normal: {
//线性渐变前4个参数分别是x0,y0,x2,y2(范围0~1);相当于图形包围盒中的百分比。如果最后一个参数是true则该四个值是绝对像素位置。
color: new echarts.graphic.LinearGradient(
0,
0,
0,
1,
[
{
offset: 0,
color: "rgba(12,120,249,0.4)",
},
{
offset: 1,
color: "rgba(0,0,0, 0)",
},
],
false
),
shadowColor: "rgba(53,142,215, 0.9)", //阴影颜色
shadowBlur: 20, //shadowBlur设图形阴影的模糊大小。配合shadowColor,shadowOffsetX/Y, 设置图形的阴影效果。
},
},
data: data.yDataTwo || [],
},
],
@ -905,7 +877,15 @@ const barChartAndLineChartFour = function (data, id) {
},
itemStyle: {
normal: {
color: '#0BB5FB',
color: function (val) {
console.log()
if (data.yDataTwo[val.dataIndex] < data.yDataThree[val.dataIndex]){
return '#30e391'
}else{
return '#FE70A6'
}
// return "#0D81ED"
},
},
},
},
@ -1030,7 +1010,7 @@ const verticalBarChart = function (data, id) {
let charts = echarts.init(id);
if (!data) {
data = {
xName: [">10分钟", "3-10分钟", "0-3分钟"],
xName: ["0-3分钟", "3-10分钟", ">10分钟"],
yData: [254, 3254, 1654],
}
}
@ -1041,7 +1021,7 @@ const verticalBarChart = function (data, id) {
}
},
grid: {
top: "5%",
top: "10%",
left: "1%",
right: "1%",
bottom: "1%",
@ -1091,7 +1071,8 @@ const verticalBarChart = function (data, id) {
textStyle: {
fontSize: 0.8 * vw,
color: '#fff'
}
},
formatter:`{c}次`
},
itemStyle: {
normal: {

@ -34,12 +34,13 @@
<!--产量-->
<div class="yield" id="yield"></div>
<div class="yieldTabs" id="yieldTabs">
<div class="typeOne" id="typeOne" type="1">当班</div>
<div class="typeTwo" id="typeTwo" type="2">当日</div>
<div class="typeOne" id="typeOne" type="0">当班</div>
<div class="typeTwo" id="typeTwo" type="1">当日</div>
</div>
<!--LOSS(分类)-->
<div class="LOSSClassify" id="LOSSClassify"></div>
<div class="LOSS" id="LOSS"></div>
<!--一次装配不合格率-->
<div class="fractionDefective" id="fractionDefective"></div>
@ -51,6 +52,7 @@
</div>
</body>
<script src="../../static/js/board/finalAssemblyProductionData.js"
th:src="@{/js/board/finalAssemblyProductionData.js}"></script>

@ -490,7 +490,10 @@
})
// 获取班次
autoUpdate('/broad/fp/selectTeamGroups', INTERVAL, data => {
classes = data
console.log(data)
console.log(classes)
classes = data[`班组`]
console.log(classes)
})
// 生产统计数据
autoUpdate('/broad/fp/selectStationHourInfo', INTERVAL, data => {

Loading…
Cancel
Save