$(document).ready(function () { QueryWorkshop(); //车间 var $height = parseInt($(window).height()); console.log($height); $('.row').css('height',($height-90)*0.5+'px') var $width = parseInt($(window).width()); console.log($width + '宽'); var swidth = parseInt($('.content').width()); //if (swidth<) { //} console.log('swidth = ' + swidth); $('.box-title').click(); }) //自适应高度 $(window).resize(function () { var $height = parseInt($(window).height()); console.log($height); var $width = parseInt($(window).width()); console.log($width + '宽'); var swidth = parseInt($('.content').width()); $('.row').css('height', ($height - 90) * 0.5 + 'px') }) //防止刷新页面跳转到顶部 function showInfo(type, code) { window.location.href = "__URL__/show" + type + "/id/" + code; } function Trim(strValue) { return strValue.replace(/^s*|s*$/g, ""); } function SetCookie(sName, sValue) { document.cookie = sName + "=" + escape(sValue); } function GetCookie(sName) { var aCookie = document.cookie.split(";"); for (var i = 0; i < aCookie.length; i++) { var aCrumb = aCookie[i].split("="); if (sName == Trim(aCrumb[0])) { return unescape(aCrumb[1]); } } return null; } function scrollback() { if (GetCookie("scroll") != null) { document.body.scrollTop = GetCookie("scroll") } } var content = document.getElementsByClassName('content')[0] content.onscroll = SetCookie("scroll", content.scrollTop); content.onload = scrollback(); $('#save').click(function () { var workshop = /\d*$/.exec($('#cbxWorkshop').val())[0] workshop = workshop.replace(/\b0*/, ''); $('#wotitle').text(workshop); //siteCapaCity(workshop); ////setInterval(siteCapaCity(workshop),300000); //poorlyFinishedPlato(workshop); ////setInterval(poorlyFinishedPlato(workshop),300000); //bunchReturn(workshop); ////setInterval(bunchReturn(workshop),300000); //foldReturn(workshop); //setInterval(foldReturn(workshop),300000); setTimeout(function () { siteCapaCity(workshop).then( function () { poorlyFinishedPlato(workshop); bunchReturn(workshop); foldReturn(workshop); } ); }, 1000); setInterval(function () { siteCapaCity(workshop); poorlyFinishedPlato(workshop); bunchReturn(workshop); foldReturn(workshop); }, 600000); //300000 }) var finishedProducts, weldReturns, foldReturns; //站点产能 async function siteCapaCity(workshop) { let capaCity = await FetchApi("ComprehensiveYield/ComprehensiveYield", { "workshop":workshop }) capaCity = await capaCity.json(); console.log(capaCity); var capacity = new Array(); finishedProducts = ''; weldReturns = ''; foldReturns = ''; var stations = ['叠层', '装框', '清洗']; if (capaCity.length == 0) { for (var i = 0; i < stations.length; i++) { capacity[i] = '0'; weldReturns = '0.00'; foldReturns = '0.00'; finishedProducts = '0.00'; } } else { for (let i = 0; i < capaCity.length; i++) { if (capaCity[i].descriptions == '焊接') { weldReturns = capaCity[i].ok; } if (capaCity[i].descriptions == '叠层') { capacity[0] = capaCity[i].cnt; foldReturns = capaCity[i].ok; } if (capaCity[i].descriptions == '装框') { capacity[1] = capaCity[i].cnt; } if (capaCity[i].descriptions == '清洗') { capacity[2] = capaCity[i].cnt; finishedProducts = capaCity[i].ok; } } } console.log(capacity); var siteCapaCityChart = { credits: { enabled: false // 禁用版权信息 }, chart: { backgroundColor: '#0d1950', //renderTo: 'rptweld', // type: 'column' }, title: { text: '当班站点实时产能', //标题 style: { color: '#0f76ce', fontSize: '18px', fontWeight: '600', letterSpacing: '1px' } }, //副标题 //subtitle: { // text: 'JK' // //}, xAxis: [{ categories: stations, //X轴参数显示 crosshair: true, labels: { style: { color: '#fff', fontSize: '12px' } } }], yAxis: { labels: { style: { color: '#fff', fontSize: '10px' } }, gridLineColor: '#91e8e1', //图标里面的行线颜色 gridLineDashStyle: 'Dash', //图标里面的行线(Solid、Dot、Dash) title: { //categories: capacity, //Y轴参数显示 text: '产能', style: { //color: Highcharts.getOptions().colors[1] color: '#ffffff', fontSize: '14px' }, min: 95 } }, tooltip: { shared: true }, //plotOptions是整个图形的色彩属性:图表的颜色、阴影都在这里设置 plotOptions: { column: { pointPadding: 0.2, borderWidth: 3, colorByPoint: true, //随机分配柱状图的颜色 dataLabels: //显示柱状图数值 { enabled: true, style: { fontSize: '12px', fontWeight:'400' }, crop: false, overflow:'none' } }, showAxes: true }, legend: { enabled: false, itemStyle: { cursor: 'pointer', color: '#ffffff' }, itemHoverStyle: { color: '#91e8e1' } }, series: [{ yAxis: 0, //Y轴设置两个坐标轴的时候,必须从0开始。 name: '产能', type: 'column', //图形(柱状图)折线图 data: capacity, style: { color: '#fff' } }], exporting: { enabled: false } }; var chart = Highcharts.chart('siteCapacity', siteCapaCityChart); } //成品不良柏拉图 async function poorlyFinishedPlato(workshop) { let poorlyFinished = await FetchApi("ComprehensiveYieldFinalYield/ComprehensiveYieldFinalYield", { "workshop": workshop }) poorlyFinished = await poorlyFinished.json(); console.log(poorlyFinished); console.log(finishedProducts); if (finishedProducts == null) { finishedProducts = '0.00'} $('#finishedProduct').text(finishedProducts + '%'); var badType = new Array(); //存放不良类型 var badTypeQty = new Array(); //存放不良类型的数量(柱形图) var badTypeProp = new Array(); //存放不良类型的数量(柏拉图) if (poorlyFinished.length == 0) { badType = ["其它", "密封不良", "接线盒不良", "组件外观脏污", "EL不良", "电池片不良", "系统信息不良", "异物", "背板不良", "玻璃不良", "叠层不良", "间距不良", "铭牌不良", "装框不良"]; for (let i = 0; i < badType.length; i++) { badTypeQty[i] = 0; badTypeProp[i] = 0; } } else { for (let i = 0; i < poorlyFinished.length;i++) { badType.push(poorlyFinished[i].defect_type); badTypeQty.push(poorlyFinished[i].cnt); badTypeProp.push(poorlyFinished[i].b) } console.log(badType); console.log(badTypeQty); console.log(badTypeProp); badTypeProp[badTypeProp.length - 1] = 100; } console.log(badType); var siteCapaCityChart = { credits: { enabled: false // 禁用版权信息 }, chart: { backgroundColor: '#0d1950', //renderTo: 'rptweld', // type: 'column' }, title: { text: '成品不良柏拉图', //标题 style: { color: '#0f76ce', fontSize: '18px', fontWeight: '600', letterSpacing: '1px' } }, //副标题 //subtitle: { // text: 'JK' // //}, xAxis: [{ categories: badType, //X轴参数显示 crosshair: true, labels: { style: { color: '#fff', fontSize: '12px' } } }], yAxis: [{ labels: { style: { color: '#fff', fontSize: '10px' }, enabled: true, //不显示坐标轴数字 tickWidth: 0 // }, gridLineColor: '#91e8e1', //图标里面的行线颜色 gridLineDashStyle: 'Dash', //图标里面的行线(Solid、Dot、Dash) //gridLineWidth: 0, //去掉图表里面的行线 title: { //categories: capacity, //Y轴参数显示 text: '数量', style: { //color: Highcharts.getOptions().colors[1] color: '#ffffff', fontSize: '14px' }, min: 95 } }, { tickPositions: [0, 25,50, 75, 100], labels: { style: { color: '#fff', fontSize: '10px' }, format: '{value}%', enabled:false }, gridLineColor: '#91e8e1', //图标里面的行线颜色 gridLineDashStyle: 'Dash', //图标里面的行线(Solid、Dot、Dash) gridLineWidth: 0, //去掉图表里面的行线 title: { //categories: capacity, //Y轴参数显示 text: '', style: { //color: Highcharts.getOptions().colors[1] color: '#ffffff', fontSize: '14px' }, min: 95 }, //opposite: true //把坐标轴显示到反面去 }], tooltip: { shared: true }, //plotOptions是整个图形的色彩属性:图表的颜色、阴影都在这里设置 plotOptions: { column: { pointPadding: 0.2, borderWidth: 3, colorByPoint: true, //随机分配柱状图的颜色 dataLabels: //显示柱状图数值 { enabled: true, style: { fontSize: '12px', fontWeight: '400' }, crop: false, overflow: 'none' } }, spline: { dataLabels: //显示柱状图数值 { enabled: true, color: '#c51a1a', crop: false, overflow: 'none' } }, showAxes: true }, legend: { enabled: false, itemStyle: { cursor: 'pointer', color: '#ffffff' }, itemHoverStyle: { color: '#91e8e1' } }, series: [{ yAxis: 0, //Y轴设置两个坐标轴的时候,必须从0开始。 //name: '产能', type: 'column', //图形(柱状图)折线图 data: badTypeQty, style: { color: '#fff' } }, { yAxis: 1, //Y轴设置两个坐标轴的时候,必须从0开始。 //name: '产能', type: 'spline', //图形(柱状图)折线图 data: badTypeProp, style: { color: '#fff' }, color: '#c51a1a', tooltip: { valueSuffix: '%' } }], exporting: { enabled: false } }; var chart = Highcharts.chart('yield', siteCapaCityChart); } //串返不良柏拉图 async function bunchReturn(workshop) { let bunchReturnData = await FetchApi("ComprehensiveYieldWeldBack/ComprehensiveYieldWeldBack", { "workshop": workshop }) bunchReturnData = await bunchReturnData.json(); console.log(bunchReturnData); console.log(weldReturns); if (weldReturns == null) { weldReturns = '0.00' } $('#weldReturn').text(weldReturns + '%'); var bunchBadType = new Array(); //存放不良类型 var bunchBadTypeQty = new Array(); //存放不良类型的数量(柱形图) var bunchBadTypeProp = new Array(); //存放不良类型的数量(柏拉图) if (bunchReturnData.length == 0) { bunchBadType = ["缺角", "短路", "间距", "并片", "破片", "混档", "错位", "隐裂", "黑斑", "露白", "虚焊", "低效", "未焊", "助焊剂残留"]; for (let i = 0; i < bunchBadType.length;i++) { bunchBadTypeQty[i] = 0; bunchBadTypeProp[i] = 0; } } else { for (let i = 0; i < bunchReturnData.length; i++) { bunchBadType.push(bunchReturnData[i].defect_type_desc); bunchBadTypeQty.push(bunchReturnData[i].cnt); bunchBadTypeProp.push(bunchReturnData[i].b) } console.log(bunchBadType); console.log(bunchBadTypeQty); console.log(bunchBadTypeProp); bunchBadTypeProp[bunchBadTypeProp.length - 1] = 100; } var siteCapaCityChart = { credits: { enabled: false // 禁用版权信息 }, chart: { backgroundColor: '#0d1950', //renderTo: 'rptweld', // type: 'column' }, title: { text: '串返修柏拉图', //标题 style: { color: '#0f76ce', fontSize: '18px', fontWeight: '600', letterSpacing: '1px' } }, //副标题 //subtitle: { // text: 'JK' // //}, xAxis: [{ categories: bunchBadType, //X轴参数显示 crosshair: true, labels: { style: { color: '#fff', fontSize: '12px' } } }], yAxis: [{ labels: { style: { color: '#fff', fontSize: '10px' }, enabled: true }, gridLineColor: '#91e8e1', //图标里面的行线颜色 gridLineDashStyle: 'Dash', //图标里面的行线(Solid、Dot、Dash) //gridLineWidth: 0, //去掉图表里面的行线 title: { //categories: capacity, //Y轴参数显示 text: '数量', style: { //color: Highcharts.getOptions().colors[1] color: '#ffffff', fontSize: '14px' }, min: 95 } }, { tickPositions: [0, 25, 50, 75, 100], labels: { style: { color: '#fff', fontSize: '10px' }, format: '{value}%', enabled:false }, gridLineColor: '#91e8e1', //图标里面的行线颜色 gridLineDashStyle: 'Dash', //图标里面的行线(Solid、Dot、Dash) gridLineWidth: 0, //去掉图表里面的行线 title: { //categories: capacity, //Y轴参数显示 text: '', style: { //color: Highcharts.getOptions().colors[1] color: '#ffffff', fontSize: '14px' }, min: 95 }, //opposite: true //把坐标轴显示到反面去 }], tooltip: { shared: true }, //plotOptions是整个图形的色彩属性:图表的颜色、阴影都在这里设置 plotOptions: { column: { pointPadding: 0.2, borderWidth: 3, colorByPoint: true, //随机分配柱状图的颜色 dataLabels: //显示柱状图数值 { enabled: true, style: { fontSize: '12px', fontWeight: '400' } } }, spline: { dataLabels: //显示柱状图数值 { enabled: true, color: '#c51a1a', crop: false, overflow: 'none' } }, showAxes: true }, legend: { enabled: false, itemStyle: { cursor: 'pointer', color: '#ffffff' }, itemHoverStyle: { color: '#91e8e1' } }, series: [{ yAxis: 0, //Y轴设置两个坐标轴的时候,必须从0开始。 //name: '产能', type: 'column', //图形(柱状图)折线图 data: bunchBadTypeQty, style: { color: '#fff' } }, { yAxis: 1, //Y轴设置两个坐标轴的时候,必须从0开始。 //name: '产能', type: 'spline', //图形(柱状图)折线图 data: bunchBadTypeProp, style: { color: '#fff' }, color: '#c51a1a', tooltip: { valueSuffix: '%' } }], exporting: { enabled: false } }; var chart = Highcharts.chart('bunchReturn', siteCapaCityChart); } //叠返不良柏拉图 async function foldReturn(workshop) { let foldReturnData = await FetchApi("ComprehensiveYieldFoldBack/ComprehensiveYieldFoldBack", { "workshop": workshop }) foldReturnData = await foldReturnData.json(); console.log(foldReturnData); console.log(foldReturns); if (foldReturns == null) { foldReturns = '0.00' } $('#foldReturn').text(foldReturns + '%'); var foldBadType = new Array(); //存放不良类型 var foldBadTypeQty = new Array(); //存放不良类型的数量(柱形图) var foldBadTypeProp = new Array(); //存放不良类型的数量(柏拉图) if (foldReturnData.length == 0) { foldBadType = ["隐裂", "并片", "错位", "间距", "短路", "混档", "露白", "破片", "缺角", "虚焊", "未焊"]; for (let i = 0; i < foldBadType.length;i++) { foldBadTypeQty[i] = 0; foldBadTypeProp[i] = 0; } } else { for (let i = 0; i < foldReturnData.length; i++) { foldBadType.push(foldReturnData[i].defect_type_desc); foldBadTypeQty.push(foldReturnData[i].cnt); foldBadTypeProp.push(foldReturnData[i].b) } console.log(foldBadType); console.log(foldBadTypeQty); console.log(foldBadTypeProp); foldBadTypeProp[foldBadTypeProp.length - 1] = 100; } var siteCapaCityChart = { credits: { enabled: false // 禁用版权信息 }, chart: { backgroundColor: '#0d1950', //renderTo: 'rptweld', // type: 'column' }, title: { text: '叠返修柏拉图', //标题 style: { color: '#0f76ce', fontSize: '18px', fontWeight: '600', letterSpacing: '1px' } }, //副标题 //subtitle: { // text: 'JK' // //}, xAxis: [{ categories: foldBadType, //X轴参数显示 crosshair: true, labels: { style: { color: '#fff', fontSize: '12px' } }, y:10 }], yAxis: [{ labels: { style: { color: '#fff', fontSize: '10px' }, enabled: true }, gridLineColor: '#91e8e1', //图标里面的行线颜色 gridLineDashStyle: 'Dash', //图标里面的行线(Solid、Dot、Dash) //gridLineWidth: 0, //去掉图表里面的行线 title: { //categories: capacity, //Y轴参数显示 text: '数量', style: { //color: Highcharts.getOptions().colors[1] color: '#ffffff', fontSize: '14px' }, min: 95 } }, { tickPositions: [0, 25, 50, 75, 100], labels: { style: { color: '#fff', fontSize: '10px' }, format: '{value}%', enabled:false }, gridLineColor: '#91e8e1', //图标里面的行线颜色 gridLineDashStyle: 'Dash', //图标里面的行线(Solid、Dot、Dash) gridLineWidth: 0, //去掉图表里面的行线 title: { //categories: capacity, //Y轴参数显示 text: '', style: { //color: Highcharts.getOptions().colors[1] color: '#ffffff', fontSize: '14px' }, min: 95 }, //opposite: true //把坐标轴显示到反面去 }], tooltip: { shared: true }, //plotOptions是整个图形的色彩属性:图表的颜色、阴影都在这里设置 plotOptions: { column: { pointPadding: 0.2, borderWidth: 3, colorByPoint: true, //随机分配柱状图的颜色 dataLabels: //显示柱状图数值 { enabled: true, style: { fontSize: '12px', fontWeight: '400' } } }, spline: { dataLabels: //显示柱状图数值 { enabled: true, color: '#c51a1a', crop: false, overflow: 'none' } }, showAxes: true }, legend: { enabled: false, itemStyle: { cursor: 'pointer', color: '#ffffff' }, itemHoverStyle: { color: '#91e8e1' } }, series: [{ yAxis: 0, //Y轴设置两个坐标轴的时候,必须从0开始。 //name: '产能', type: 'column', //图形(柱状图)折线图 data: foldBadTypeQty, style: { color: '#fff' } }, { yAxis: 1, //Y轴设置两个坐标轴的时候,必须从0开始。 //name: '产能', type: 'spline', //图形(柱状图)折线图 data: foldBadTypeProp, style: { color: '#fff' }, color: '#c51a1a', tooltip: { valueSuffix: '%' } }], exporting: { enabled: false } }; var chart = Highcharts.chart('foldBack', siteCapaCityChart); } //fetchApi方法 function FetchApi(funname, para) { return fetch("/api/" + funname + "", { method: "post", headers: { "Accept": "application/json, text/plain, */*", "Content-Type": "application/json" }, body: JSON.stringify(para) }) } //车间替换 async function QueryWorkshop() { let workshop = await FetchApi("Orders/QueryWorkshop", {}) workshop = await workshop.json(); console.log(workshop); $('#cbxWorkshop').empty() _.each(workshop.info, function (ele, index, list) { $('#cbxWorkshop').append("") }) console.log(workshop) console.log('query workshop end') var title = /\d*$/.exec($('#cbxWorkshop').val())[0] title = title.replace(/\b0*/, '') $('#wotitle').text(title); }