DK-MES-2.0
/
HEGII.ss.mes.dashboard


			
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241
							<!doctype html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <link rel="shortcut icon" href="/img/logo.png" />
    <link rel="bookmark" href="/img/logo.png" />
    <link rel="stylesheet" href="../DashBoard.css?v3" />
    <script src="/Plugins/jquery-3.4.1/jquery-3.4.1.min.js"></script>
    <script src="/Plugins/xrequest/xrequest.min.js"></script>
    <script src="/Plugins/xcountto/xcountTo.min.js"></script>
    <title>东科软件</title>
</head>
<body>
    <div class="m4_box_1920_1080">
        <div class="m4_box_title" onclick="showHelp()" style="cursor:pointer">
            <div class="m4_box_title_arrow"></div><div class="m4_box_title_arrow2"></div> <div>包装日计划</div><span class="m4_box_title_loading" id="报表加载"></span>
        </div>
        <div class="m4_box_body" style="padding-right: 20px;width:1720px;">
            <div style="width: 1720px; height: 230px;">
                <!--流量-->
                <table cellspacing="0" cellpadding="0" border="0" style="width:100%;">
                    <tr class="tr_title_warning" style="height:50px;">
                        <td colspan="2">成型产量</td>
                        <td colspan="2">半检产量</td>
                        <td colspan="2">施釉产量</td>
                        <td colspan="2">烧成产量</td>
                        <td colspan="2">成检产量</td>
                    </tr>
                    <tr class="tr_title_warning">
                        <td>大件</td>
                        <td>小件</td>
                        <td>大件</td>
                        <td>小件</td>
                        <td>大件</td>
                        <td>小件</td>
                        <td>大件</td>
                        <td>小件</td>
                        <td>大件</td>
                        <td>小件</td>
                    </tr>
                    <tr class="tr_bg_light_warning" style="height:120px;">
                        <td id="agv1" data-decimals="2" data-speed="2000" style="font-size: 40px; width: 10%"></td>
                        <td id="agv11" data-decimals="2" data-speed="2000" style="font-size: 40px; width: 10%"></td>
                        <td id="agv2" data-decimals="2" data-speed="2000" style="font-size: 40px; width: 10%"></td>
                        <td id="agv22" data-decimals="2" data-speed="2000" style="font-size: 40px; width: 10%"></td>
                        <td id="agv3" data-decimals="2" data-speed="2000" style="font-size: 40px; width: 10%"></td>
                        <td id="agv33" data-decimals="2" data-speed="2000" style="font-size: 40px; width: 10%"></td>
                        <td id="agv4" data-decimals="2" data-speed="2000" style="font-size: 40px; width: 10%"></td>
                        <td id="agv44" data-decimals="2" data-speed="2000" style="font-size: 40px; width: 10%"></td>
                        <td id="agv5" data-decimals="2" data-speed="2000" style="font-size: 40px; width: 10%"></td>
                        <td id="agv55" data-decimals="2" data-speed="2000" style="font-size: 40px; width: 10%"></td>
                    </tr>
                </table>
            </div>
            <div style="width:100%;height:620px;display:flex;flex-direction:row;">
                <div style="width: 100%; height: 620px; ">
                    <!--月计划达成率表格-->
                    <table cellspacing="0" cellpadding="0" border="0" style="width:99.9%;">
                        <tr class="tr_title">
                            <td colspan="6" style="color:white">产成品包装日计划</td>
                        </tr>
                        <tr class="tr_title">
                            <td style="width: 25%; font-size: 20px;">产品名称</td>
                            <td style="width: 25%; font-size: 20px;">物料编码</td>
                            <td style="width: 10%; font-size: 20px;">计划包装数</td>
                            <td style="width: 10%; font-size: 20px;">实际生产数量</td>
                            <td style="width: 15%; font-size: 20px;">完成率</td>
                            <td style="width: 15%; font-size: 20px;">车间</td>
                        </tr>
                    </table>
                    <div style="height: 620px; overflow: hidden; width: 100%; ">
                        <div>
                            <table id="dayTable_template" style="display:none;">
                                <tr class="tr_title_warning" style="height: 60px;">
                                    <!--<td style="width: 7.1%;  font-size: 14px;">{成型线}</td>-->
                                    <td style="width: 25%; font-size: 18px;">{产品名称}</td>
                                    <td style="width: 25%; font-size: 18px;">{物料编码}</td>
                                    <td style="width: 10%; font-size: 18px;">{计划包装数}</td>
                                    <td style="width: 10%; font-size: 18px;">{实际生产数量}</td>
                                    <td style="width: 15%; font-size: 18px;">{完成率}</td>
                                    <td style="width: 15%; font-size: 18px;">{车间}</td>
                                </tr>
                            </table>
                        </div>
                        <table id="dayTable" style="width: 100%;height:560px;">
                        </table>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <script>
        //页面刷新刷新时间
        var refreshTime1 = 60000;
        var currentTime1 = 0;

        var doGetData;
        var doGetTime;

        var mainInterval;
        var mainRowCount = 0;

        $(document).ready(function (){
            initData();
            doGetData = setInterval(function () { timeUpdate(); }, 1000);
            PlanData();
            setInterval(function () { PlanData(); }, 60000);
            ProcedureCount()
            setInterval(function () { ProcedureCount(); }, 60000);
        });

        function ProcedureCount() {
            $.get("rpt.ashx?m=count", function (data) {
                var jsondata = JSON.parse(data);
                if (jsondata["success"] == true) {
                    $("#agv1").attr('data-to', jsondata["rows"][0]["成型产量"]);
                    $("#agv1").countTo();
                    $("#agv11").attr('data-to', jsondata["rows"][1]["成型产量"]);
                    $("#agv11").countTo();
                    $("#agv2").attr('data-to', jsondata["rows"][0]["半检产量"]);
                    $("#agv2").countTo();
                    $("#agv22").attr('data-to', jsondata["rows"][1]["半检产量"]);
                    $("#agv22").countTo();
                    $("#agv3").attr('data-to', jsondata["rows"][0]["施釉产量"]);
                    $("#agv3").countTo();
                    $("#agv33").attr('data-to', jsondata["rows"][1]["施釉产量"]);
                    $("#agv33").countTo();
                    $("#agv4").attr('data-to', jsondata["rows"][0]["烧成产量"]);
                    $("#agv4").countTo();
                    $("#agv44").attr('data-to', jsondata["rows"][1]["烧成产量"]);
                    $("#agv44").countTo();
                    $("#agv5").attr('data-to', jsondata["rows"][0]["成检产量"]);
                    $("#agv5").countTo();
                    $("#agv55").attr('data-to', jsondata["rows"][1]["成检产量"]);
                    $("#agv55").countTo();
                }
            });
        }

        function PlanData() {
            if (mainInterval) {
                clearInterval(mainInterval);
                console.log("Interval Stop!");
            }
            $.get("rpt.ashx?m=table", function (data){
                var json = JSON.parse(data);
                if (json["success"] == true) {
                    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]['实际生产数量']);
                        temp = temp.replace('{完成率}', json["rows"][i]['完成率']);
                        temp = temp.replace('{车间}', json["rows"][i]['车间']);
                        $("#dayTable").append(temp);
                    }
                    mainRowCount = json["rows"].length;
                    mainInterval = setInterval(mainScroll, 3000);
                }
            });
        }

        function mainScroll() {
            var scrollHeight = $("#dayTable").find("tr").outerHeight();
            $("#dayTable").animate({ marginTop: -scrollHeight, }, 500,
                function () {
                    $(this).css({ marginTop: "0px", }).find("tr:first").appendTo(this);
                    if (--mainRowCount == -1) loadMainTable();
                }
            );
        }
        //帮助说明
        function showHelp() {
            var message = "统计说明：" + "\n";
            message += "型号滚动计划数: web端看板配置-产品产量计划; 计划数 * (本月已过天数 / 本月天数);" + "\n";
            message += "工序计划数: web端看板配置-看板工序产量计划; 计划数  * (本月已过天数 / 本月天数);" + "\n";
            message += "智能马桶型号实际产量: 对应型号的产成品交接数,不区分车间" + "\n";
            message += "成型工序完工产量: 三车间型号的注浆数" + "\n";
            message += "一检工序完工产量: 三车间型号的2#-3#交坯数和3#交坯数" + "\n";
            message += "改洗工序完工产量: 三车间型号的3#上水数" + "\n";
            message += "施釉工序完工产量: 三车间型号的3#施釉数" + "\n";
            message += "烧成工序完工产量: 全部车间的3#入窑数" + "\n";
            message += "成检工序完工产量: 全部车间的3#成检交接数" + "\n";
            alert(message);
        }

        function timeUpdate() {

            if (currentTime1 <= 0) {
                //clearData();
                setTimeout(loadData(), 1000);
                //loadData();
                currentTime1 = refreshTime1;
            }
            else {
                if (currentTime1 > 0) {
                    $('#报表加载').html('刷新：' + currentTime1 / 1000 + ' 秒');
                    currentTime1 = currentTime1 - 1000;
                }
            }
        }

        function loadData(callback) {
        }

        function initData() {
            window.chartColors = {
                red: 'rgb(255, 99, 132)',
                orange: 'rgb(255, 159, 64)',
                yellow: 'rgb(255, 250, 86)',
                green: 'rgb(75, 192, 192)',
                blue: 'rgb(54, 162, 250)',
                purple: 'rgb(153, 102, 255)',
                grey: 'rgb(231,233,237)'
            };

            var color = Chart.helpers.color;

            window.randomScalingFactor = function (num) {
                return Math.round(Math.random() * num);
            }

            Chart.defaults.global.defaultFontColor = 'white';
            Chart.defaults.global.defaultFontSize = 24;
            Chart.defaults.global.legend.display = false;
        }


    </script>

    <script src="/Plugins/chartjs-2.8.0/chart-2.8.min.js"></script>
    <script src="/Plugins/chartjs-2.8.0/chartjs-plugin-datalabels.js"></script>
    <script src="/Plugins/chartjs-2.8.0/utils.js"></script>
    <script src="/Plugins/circleChart/circleChart.min.js"></script>
</body>
</html>