|
|
@@ -35,7 +35,7 @@
|
|
|
<td style="width: 8%; height: 60px; font-size: 30px; text-align: left" colspan="2"><strong><span id="sj" style="color:white;">0000-00-00 00:00:00</span></strong></td>
|
|
|
</tr>
|
|
|
<tr class="tr_bg_dark_warning">
|
|
|
- <td style="width: 5%; height: 200px; font-size: 35px; text-align: center " class="td, th" rowspan="3"><br />月包装量:<span id="yjyl">加载中...</span><br /></td>
|
|
|
+ <td style="width: 5%; height: 200px; font-size: 35px; text-align: center " class="td, th" rowspan="3"><br />月包装量:<span id="yjyl">0</span><br /></td>
|
|
|
</tr>
|
|
|
</table>
|
|
|
</div>
|
|
|
@@ -46,61 +46,25 @@
|
|
|
<div style="width: 50%;height:530px;padding-right:20px;">
|
|
|
<table cellspacing="0" cellpadding="0" border="0" style="width:100%;">
|
|
|
<tr class="tr_title_warning">
|
|
|
- <td colspan="9" style="color:white;">包装数量:----</td>
|
|
|
+ <td colspan="9" style="color:white;">包装数量:<span id="sum">---</span></td>
|
|
|
</tr>
|
|
|
<tr class="tr_title_warning">
|
|
|
- <td>产品型号</td>
|
|
|
+ <td>产品编码</td>
|
|
|
<td>产品名称</td>
|
|
|
<td>包装数量</td>
|
|
|
</tr>
|
|
|
-
|
|
|
- <tr class="tr_bg_light_warning" style="height:30px;">
|
|
|
- <td style="font-size: 18px; width: 11%">测试员工</td>
|
|
|
- <td style="font-size: 18px; width: 11%">测试编码</td>
|
|
|
- <td style="font-size: 18px; width: 11%">测试名称</td>
|
|
|
- </tr>
|
|
|
- <tr class="tr_bg_light_warning" style="height:30px;">
|
|
|
- <td style="font-size: 18px; width: 11%">测试员工</td>
|
|
|
- <td style="font-size: 18px; width: 11%">测试编码</td>
|
|
|
- <td style="font-size: 18px; width: 11%">测试名称</td>
|
|
|
- </tr>
|
|
|
- <tr class="tr_bg_light_warning" style="height:30px;">
|
|
|
- <td style="font-size: 18px; width: 11%">测试员工</td>
|
|
|
- <td style="font-size: 18px; width: 11%">测试编码</td>
|
|
|
- <td style="font-size: 18px; width: 11%">测试名称</td>
|
|
|
- </tr>
|
|
|
- <tr class="tr_bg_light_warning" style="height:30px;">
|
|
|
- <td style="font-size: 18px; width: 11%">测试员工</td>
|
|
|
- <td style="font-size: 18px; width: 11%">测试编码</td>
|
|
|
- <td style="font-size: 18px; width: 11%">测试名称</td>
|
|
|
-
|
|
|
- </tr>
|
|
|
- <tr class="tr_bg_light_warning" style="height:30px;">
|
|
|
- <td style="font-size: 18px; width: 11%">测试员工</td>
|
|
|
- <td style="font-size: 18px; width: 11%">测试编码</td>
|
|
|
- <td style="font-size: 18px; width: 11%">测试名称</td>
|
|
|
- </tr>
|
|
|
- <tr class="tr_bg_light_warning" style="height:30px;">
|
|
|
- <td style="font-size: 18px; width: 11%">测试员工</td>
|
|
|
- <td style="font-size: 18px; width: 11%">测试编码</td>
|
|
|
- <td style="font-size: 18px; width: 11%">测试名称</td>
|
|
|
- </tr>
|
|
|
- <tr class="tr_bg_light_warning" style="height:30px;">
|
|
|
- <td style="font-size: 18px; width: 11%">测试员工</td>
|
|
|
- <td style="font-size: 18px; width: 11%">测试编码</td>
|
|
|
- <td style="font-size: 18px; width: 11%">测试名称</td>
|
|
|
- </tr>
|
|
|
- <tr class="tr_bg_light_warning" style="height:30px;">
|
|
|
- <td style="font-size: 18px; width: 11%">测试员工</td>
|
|
|
- <td style="font-size: 18px; width: 11%">测试编码</td>
|
|
|
- <td style="font-size: 18px; width: 11%">测试名称</td>
|
|
|
- </tr>
|
|
|
- <tr class="tr_bg_light_warning" style="height:30px;">
|
|
|
- <td style="font-size: 18px; width: 11%">测试员工</td>
|
|
|
- <td style="font-size: 18px; width: 11%">测试编码</td>
|
|
|
- <td style="font-size: 18px; width: 11%">测试名称</td>
|
|
|
- </tr>
|
|
|
</table>
|
|
|
+ <div style=" height:440px;overflow:hidden;">
|
|
|
+ <table id="dayTable_template" style="display:none;">
|
|
|
+ <tr class="tr_bg_light_warning" style="height:30px;">
|
|
|
+ <td style="font-size: 18px; width: 33%; height: 30px; ">{产品编码}</td>
|
|
|
+ <td style="font-size: 18px; width: 34%; height: 30px; ">{产品名称}</td>
|
|
|
+ <td style="font-size: 18px; width: 33%; height: 30px; ">{包装数量}</td>
|
|
|
+ </tr>
|
|
|
+ </table>
|
|
|
+ <table id="dayTable" style="width: 100%; ">
|
|
|
+ </table>
|
|
|
+ </div>
|
|
|
</div>
|
|
|
<div style="width: 50%;height:530px;padding-right:20px;">
|
|
|
<table cellspacing="0" cellpadding="0" border="0" style="width:100%;">
|
|
|
@@ -113,62 +77,19 @@
|
|
|
<td>产品名称</td>
|
|
|
<td>包装数量</td>
|
|
|
</tr>
|
|
|
-
|
|
|
- <tr class="tr_bg_light_warning" style="height:30px;">
|
|
|
- <td style="font-size: 18px; width: 11%">测试员工</td>
|
|
|
- <td style="font-size: 18px; width: 11%">测试编码</td>
|
|
|
- <td style="font-size: 18px; width: 11%">测试名称</td>
|
|
|
- <td style="font-size: 18px; width: 11%">200</td>
|
|
|
- </tr>
|
|
|
- <tr class="tr_bg_light_warning" style="height:30px;">
|
|
|
- <td style="font-size: 18px; width: 11%">测试员工</td>
|
|
|
- <td style="font-size: 18px; width: 11%">测试编码</td>
|
|
|
- <td style="font-size: 18px; width: 11%">测试名称</td>
|
|
|
- <td style="font-size: 18px; width: 11%">200</td>
|
|
|
- </tr>
|
|
|
- <tr class="tr_bg_light_warning" style="height:30px;">
|
|
|
- <td style="font-size: 18px; width: 11%">测试员工</td>
|
|
|
- <td style="font-size: 18px; width: 11%">测试编码</td>
|
|
|
- <td style="font-size: 18px; width: 11%">测试名称</td>
|
|
|
- <td style="font-size: 18px; width: 11%">200</td>
|
|
|
- </tr>
|
|
|
- <tr class="tr_bg_light_warning" style="height:30px;">
|
|
|
- <td style="font-size: 18px; width: 11%">测试员工</td>
|
|
|
- <td style="font-size: 18px; width: 11%">测试编码</td>
|
|
|
- <td style="font-size: 18px; width: 11%">测试名称</td>
|
|
|
- <td style="font-size: 18px; width: 11%">200</td>
|
|
|
- </tr>
|
|
|
- <tr class="tr_bg_light_warning" style="height:30px;">
|
|
|
- <td style="font-size: 18px; width: 11%">测试员工</td>
|
|
|
- <td style="font-size: 18px; width: 11%">测试编码</td>
|
|
|
- <td style="font-size: 18px; width: 11%">测试名称</td>
|
|
|
- <td style="font-size: 18px; width: 11%">200</td>
|
|
|
- </tr>
|
|
|
- <tr class="tr_bg_light_warning" style="height:30px;">
|
|
|
- <td style="font-size: 18px; width: 11%">测试员工</td>
|
|
|
- <td style="font-size: 18px; width: 11%">测试编码</td>
|
|
|
- <td style="font-size: 18px; width: 11%">测试名称</td>
|
|
|
- <td style="font-size: 18px; width: 11%">200</td>
|
|
|
- </tr>
|
|
|
- <tr class="tr_bg_light_warning" style="height:30px;">
|
|
|
- <td style="font-size: 18px; width: 11%">测试员工</td>
|
|
|
- <td style="font-size: 18px; width: 11%">测试编码</td>
|
|
|
- <td style="font-size: 18px; width: 11%">测试名称</td>
|
|
|
- <td style="font-size: 18px; width: 11%">200</td>
|
|
|
- </tr>
|
|
|
- <tr class="tr_bg_light_warning" style="height:30px;">
|
|
|
- <td style="font-size: 18px; width: 11%">测试员工</td>
|
|
|
- <td style="font-size: 18px; width: 11%">测试编码</td>
|
|
|
- <td style="font-size: 18px; width: 11%">测试名称</td>
|
|
|
- <td style="font-size: 18px; width: 11%">200</td>
|
|
|
- </tr>
|
|
|
- <tr class="tr_bg_light_warning" style="height:30px;">
|
|
|
- <td style="font-size: 18px; width: 11%">测试员工</td>
|
|
|
- <td style="font-size: 18px; width: 11%">测试编码</td>
|
|
|
- <td style="font-size: 18px; width: 11%">测试名称</td>
|
|
|
- <td style="font-size: 18px; width: 11%">200</td>
|
|
|
- </tr>
|
|
|
</table>
|
|
|
+
|
|
|
+ <div style=" height:440px;overflow:hidden;">
|
|
|
+ <table id="Table_template" style="display:none;">
|
|
|
+ <tr class="tr_bg_light_warning" style="height:30px;">
|
|
|
+ <td style="font-size: 18px; width: 33%; height: 30px; ">{产品编码}</td>
|
|
|
+ <td style="font-size: 18px; width: 34%; height: 30px; ">{产品名称}</td>
|
|
|
+ <td style="font-size: 18px; width: 33%; height: 30px; ">{包装数量}</td>
|
|
|
+ </tr>
|
|
|
+ </table>
|
|
|
+ <table id="Table" style="width: 100%; ">
|
|
|
+ </table>
|
|
|
+ </div>
|
|
|
</div>
|
|
|
<!--<div style="width: 25%;height:530px;">
|
|
|
<div style="color:white;font-size:20px;font-weight:600; text-align:center">每月产量计划达成</div>
|
|
|
@@ -179,63 +100,125 @@
|
|
|
</div>
|
|
|
|
|
|
<script>
|
|
|
-
|
|
|
+ var refreshTime1 = 80000;
|
|
|
+ var currentTime1 = 0;
|
|
|
+ var doGetData;
|
|
|
+ var doGetTime;
|
|
|
+ //第一表
|
|
|
+ var dayInterval;
|
|
|
+ var dayTableRowCount = 0;
|
|
|
+ //第二表
|
|
|
+ var TableInterval;
|
|
|
+ var TableRowCount = 0;
|
|
|
+ var monthInterval;
|
|
|
+ var monthTableRowCount = 0;
|
|
|
$(document).ready(function () {
|
|
|
+ loadData();
|
|
|
initData();
|
|
|
- doGetData = setInterval(function () { timeUpdate(); }, 2000);
|
|
|
+ Scroll();
|
|
|
+ SumScroll();
|
|
|
+ doGetData = setInterval(function () { SumScroll(); }, 2000);
|
|
|
+ doGetData = setInterval(function () { loadData(); }, 2000);
|
|
|
+ doGetData = setInterval(function () { loadServerTime(); }, 5000);//系统时间
|
|
|
});
|
|
|
-
|
|
|
- function timeUpdate() {
|
|
|
- loadData();
|
|
|
-
|
|
|
+ function Scroll() {
|
|
|
+ loadTable();
|
|
|
+ loadDayTable();
|
|
|
}
|
|
|
-
|
|
|
+ function dayTableScroll() {
|
|
|
+ var scrollHeight = $("#dayTable_template").find("tr").outerHeight();
|
|
|
+ $("#dayTable").animate({ marginTop: -scrollHeight, }, 500,
|
|
|
+ function () {
|
|
|
+ $(this).css({ marginTop: "0px", }).find("tr:first").appendTo(this);
|
|
|
+ if (dayTableRowCount > -1) {
|
|
|
+ dayTableRowCount--;
|
|
|
+ } else {
|
|
|
+ clearInterval(dayInterval);
|
|
|
+ loadDayTable();
|
|
|
+ }
|
|
|
+ }
|
|
|
+ );
|
|
|
+ }
|
|
|
+ function loadDayTable() {
|
|
|
+ $.get("PackagingKanban.ashx?m=MonthTable", function (data) {
|
|
|
+ var json = JSON.parse(data);
|
|
|
+ if (json["success"] == true) {
|
|
|
+ $("#dayTable").html("");
|
|
|
+ for (var i = 0; i < json["rows"].length; i++) {
|
|
|
+ var temp = $("#dayTable_template").html();
|
|
|
+ temp = temp.replace("<tbody>", "").replace("</tbody>", "");
|
|
|
+ temp = temp.replace('{责任工号}', json["rows"][i]['责任工号']);
|
|
|
+ temp = temp.replace('{生产线号}', json["rows"][i]['生产线号']);
|
|
|
+ temp = temp.replace('{缺陷名称}', json["rows"][i]['缺陷名称']);
|
|
|
+ temp = temp.replace('{产品分级}', json["rows"][i]['产品分级']);
|
|
|
+ $("#dayTable").append(temp);
|
|
|
+ }
|
|
|
+ dayTableRowCount = json["rows"].length;
|
|
|
+ dayInterval = setInterval(dayTableScroll, 6000);
|
|
|
+ }
|
|
|
+ });
|
|
|
+ }
|
|
|
+ function TableScroll() {
|
|
|
+ var scrollHeight = $("#Table_template").find("tr").outerHeight();
|
|
|
+ $("#Table").animate({ marginTop: -scrollHeight, }, 500,
|
|
|
+ function () {
|
|
|
+ $(this).css({ marginTop: "0px", }).find("tr:first").appendTo(this);
|
|
|
+ if (TableRowCount > -1) {
|
|
|
+ TableRowCount--;
|
|
|
+ } else {
|
|
|
+ clearInterval(TableInterval);
|
|
|
+ loadTable();
|
|
|
+ }
|
|
|
+ }
|
|
|
+ );
|
|
|
+ }
|
|
|
+ function loadTable() {
|
|
|
+ $.get("PackagingKanban.ashx?m=MonthTable", function (data) {
|
|
|
+ var json = JSON.parse(data);
|
|
|
+ if (json["success"] == true) {
|
|
|
+ $("#dayTable").html("");
|
|
|
+ for (var i = 0; i < json["rows"].length; i++) {
|
|
|
+ var temp = $("#dayTable_template").html();
|
|
|
+ temp = temp.replace("<tbody>", "").replace("</tbody>", "");
|
|
|
+ temp = temp.replace('{责任工号}', json["rows"][i]['责任工号']);
|
|
|
+ temp = temp.replace('{生产线号}', json["rows"][i]['生产线号']);
|
|
|
+ temp = temp.replace('{缺陷名称}', json["rows"][i]['缺陷名称']);
|
|
|
+ temp = temp.replace('{产品分级}', json["rows"][i]['产品分级']);
|
|
|
+ $("#dayTable").append(temp);
|
|
|
+ }
|
|
|
+ TableRowCount = json["rows"].length;
|
|
|
+ TableInterval = setInterval(TableScroll, 6000);
|
|
|
+ }
|
|
|
+ });
|
|
|
+ }
|
|
|
+ function loadServerTime() {
|
|
|
+ $.get('PackagingKanban.ashx?m=fwq', function (data) {
|
|
|
+ var json = JSON.parse(data);
|
|
|
+ if (json["success"] == true) {
|
|
|
+ $('#sj').html(json["sj"]);
|
|
|
+ }
|
|
|
+ });
|
|
|
+ }
|
|
|
function loadData() {
|
|
|
- //31天产量
|
|
|
- window.DayCL.data.datasets[0].data = [
|
|
|
- randomScalingFactor(8) + 5,
|
|
|
- randomScalingFactor(8) + 5,
|
|
|
- randomScalingFactor(8) + 5,
|
|
|
- randomScalingFactor(8) + 5,
|
|
|
- randomScalingFactor(8) + 5,
|
|
|
- randomScalingFactor(8) + 5,
|
|
|
- randomScalingFactor(8) + 5,
|
|
|
- randomScalingFactor(8) + 5,
|
|
|
- randomScalingFactor(8) + 5,
|
|
|
- randomScalingFactor(8) + 5,
|
|
|
- randomScalingFactor(8) + 5,
|
|
|
- randomScalingFactor(8) + 5,
|
|
|
- randomScalingFactor(8) + 5,
|
|
|
- randomScalingFactor(8) + 5,
|
|
|
- randomScalingFactor(8) + 5,
|
|
|
- randomScalingFactor(8) + 5,
|
|
|
- randomScalingFactor(8) + 5,
|
|
|
- randomScalingFactor(8) + 5,
|
|
|
- randomScalingFactor(8) + 5,
|
|
|
- randomScalingFactor(8) + 5,
|
|
|
- randomScalingFactor(8) + 5,
|
|
|
- randomScalingFactor(8) + 5,
|
|
|
- randomScalingFactor(8) + 5,
|
|
|
- randomScalingFactor(8) + 5,
|
|
|
- randomScalingFactor(8) + 5,
|
|
|
- randomScalingFactor(8) + 5,
|
|
|
- randomScalingFactor(8) + 5,
|
|
|
- randomScalingFactor(8) + 5,
|
|
|
- randomScalingFactor(8) + 5,
|
|
|
- randomScalingFactor(8) + 5,
|
|
|
- randomScalingFactor(8) + 5
|
|
|
- ];
|
|
|
-
|
|
|
- window.DayCL.update();
|
|
|
-
|
|
|
- //产量计划达成
|
|
|
- window.MonthCL.data.datasets[0].data = [
|
|
|
- randomScalingFactor(1000),
|
|
|
- randomScalingFactor(1000)
|
|
|
- ];
|
|
|
- window.MonthCL.update();
|
|
|
+ $.get("PackagingKanban.ashx?m=rate", function (data) {
|
|
|
+ clearData();
|
|
|
+ var json = JSON.parse(data);
|
|
|
+ if (json["success"] == true) {
|
|
|
+ for (var n = 0; n < json["rows"].length; n++) {
|
|
|
+ window.DayCL.data.labels.push(json["rows"][n]["SJ"]);
|
|
|
+ window.DayCL.data.datasets[0].data[n] = (json["rows"][n]["包装数量"]);
|
|
|
+ }
|
|
|
+ }
|
|
|
+ window.DayCL.update();
|
|
|
+ });
|
|
|
}
|
|
|
-
|
|
|
+ function clearData() {
|
|
|
+ //清除数据
|
|
|
+ window.DayCL.data.labels = [];
|
|
|
+ //window.DayCL.data.datasets[0].data = [0, 0, 0, 0, 0, 0, 0];
|
|
|
+ window.DayCL.data.datasets[0].data = [];
|
|
|
+ window.DayCL.update();
|
|
|
+ }
|
|
|
function initData() {
|
|
|
window.chartColors = {
|
|
|
red: 'rgb(255, 99, 132)',
|
|
|
@@ -248,7 +231,6 @@
|
|
|
};
|
|
|
|
|
|
var color = Chart.helpers.color;
|
|
|
-
|
|
|
window.randomScalingFactor = function (num) {
|
|
|
return Math.round(Math.random() * num);
|
|
|
}
|
|
|
@@ -260,14 +242,14 @@
|
|
|
//每小时产量=========================================
|
|
|
window.configDayCL = {
|
|
|
data: {
|
|
|
- labels: ["1", "2", "3", "4", "5", "6", "7", "8", "9", "10", "11", "12", "13", "14", "15", "16", "17", "18", "19", "20", "21", "22", "23", "24", "25", "26", "27", "28", "29", "30", "31"],
|
|
|
+ labels: [],
|
|
|
datasets: [{
|
|
|
label: "包装数量",
|
|
|
backgroundColor: color(window.chartColors.orange).alpha(0.6).rgbString(),
|
|
|
borderColor: window.chartColors.orange,
|
|
|
borderWidth: 2,
|
|
|
pointRadius: 15,
|
|
|
- data: [0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0],
|
|
|
+ data: [],
|
|
|
fill: false,
|
|
|
}]
|
|
|
},
|
|
|
@@ -279,7 +261,7 @@
|
|
|
},
|
|
|
title: {
|
|
|
display: false,
|
|
|
- text: '每小时产量'
|
|
|
+ text: '每日产量'
|
|
|
},
|
|
|
tooltips: {
|
|
|
mode: 'index',
|
|
|
@@ -311,9 +293,26 @@
|
|
|
window.DayCL = new Chart(ctxDayCL, configDayCL);
|
|
|
|
|
|
}
|
|
|
-
|
|
|
-
|
|
|
-
|
|
|
+ function DaySum() {
|
|
|
+ $.get('PackagingKanban.ashx?m=MonthSum', function (data) {
|
|
|
+ var json = JSON.parse(data);
|
|
|
+ if (json["success"] == true) {
|
|
|
+ $('#sum').text(json["rows"][0]["数量"]);
|
|
|
+ }
|
|
|
+ });
|
|
|
+ }
|
|
|
+ function MonthSum() {
|
|
|
+ $.get('PackagingKanban.ashx?m=Alltotal', function (data) {
|
|
|
+ var json = JSON.parse(data);
|
|
|
+ if (json["success"] == true) {
|
|
|
+ $('#yjyl').text(json["rows"][0]["数量"]);
|
|
|
+ }
|
|
|
+ });
|
|
|
+ }
|
|
|
+ function SumScroll() {
|
|
|
+ DaySum();
|
|
|
+ MonthSum();
|
|
|
+ }
|
|
|
</script>
|
|
|
|
|
|
<script src="/Plugins/chartjs-2.8.0/chart-2.8.min.js"></script>
|