From e227e1308ff2dc472750e72a9c44e29e5f592fdb Mon Sep 17 00:00:00 2001
From: yangle <admin@YINMOU>
Date: 星期三, 14 九月 2022 11:06:56 +0800
Subject: [PATCH] 生产设备产量分析看板

---
 KB_EquipmentUtilizationRate.html          |  736 ++++++++++++++++++++++++
 KB_ProductionEquipmentOutputAnalysis.html | 1009 +++++++++++++++++++++++++++++++++
 2 files changed, 1,745 insertions(+), 0 deletions(-)

diff --git a/KB_EquipmentUtilizationRate.html b/KB_EquipmentUtilizationRate.html
new file mode 100644
index 0000000..f042b49
--- /dev/null
+++ b/KB_EquipmentUtilizationRate.html
@@ -0,0 +1,736 @@
+锘�<!DOCTYPE html>
+
+<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
+<head>
+    <meta charset="utf-8" />
+    <title>璁惧绋煎姩鐜囩湅鏉�</title>
+    <link rel="stylesheet" type="text/css" href="css/bootstrap.min.css">
+    <link rel="stylesheet" type="text/css" href="css/bootstrap-table.min.css">
+    <link rel="stylesheet" type="text/css" href="css/index.css">
+    <script src="js/jquery.min.js"></script>
+    <script src='js/echarts.min.js'></script>
+    <script src="js/bootstrap.min.js"></script>
+    <script src='js/bootstrap-table.min.js'></script>
+    <script src='js/bootstrap-table-zh-CN.min.js'></script>
+    <script src="js/jquery.SuperSlide.2.1.3.js"></script>
+    <script src='js/template.js'></script>
+    <script src="js/jquery.qrcode.min.js"></script>
+    <style>
+        .clock {
+            font-family: 'BebasNeueRegular', Arial, Helvetica, sans-serif;
+            font-size: 20px;
+            width: 450px;
+            float: right;
+            color: #fff;
+            margin-top: -75px;
+            margin-right: 5px;
+            color: #09d1ea;
+        }
+
+            .clock #Date {
+                text-align: center;
+                text-shadow: 0 0 0px #00c6ff;
+            }
+
+            .clock ul {
+                width: 450px;
+                margin: 0 auto;
+                padding: 0px;
+                list-style: none;
+                text-align: right;
+                margin-left: 15px;
+                position: relative;
+            }
+
+                .clock ul li {
+                    display: inline;
+                    font-size: 24px;
+                    text-align: left;
+                    font-family: 'BebasNeueRegular', Arial, Helvetica, sans-serif;
+                    text-shadow: 0 0 0px #00c6ff;
+                }
+
+        body {
+            padding-left: 50px;
+            padding-right: 50px;
+        }
+
+        .title {
+            font-size: 44px;
+            font-family: PingFangSC;
+            font-weight: 500;
+            color: rgba(9, 209, 234, 1);
+            text-align: center;
+            background: url(img/img_little_new.png) center no-repeat;
+            margin-bottom: 30px;
+        }
+
+        .col-sm-12 {
+            position: relative;
+            min-height: 1px;
+            padding-right: 0px;
+            padding-left: 0px;
+        }
+
+        .left {
+            /* border: 1px solid #00c6ff; */
+            height: 900px;
+        }
+
+        .right {
+            /* border: 1px solid #00c6ff; */
+            height: 250px;
+        }
+
+
+
+        .col-sm-12,
+        .col-sm-2,
+        .col-sm-3,
+        .col-sm-4,
+        .col-sm-6,
+        .col-sm-8 {
+            position: relative;
+            min-height: 1px;
+            padding-right: 0px;
+            padding-left: 0px;
+        }
+
+        #mychart1,
+        #mychart2,
+        #mychart3 {
+            width: 100%;
+            border: none;
+            height: 300px;
+        }
+
+        #cList {
+            margin: 0% auto;
+            color: #00c6ff;
+        }
+
+            #cList li {
+                margin: 20px 0px;
+                text-align: left;
+                font-size: 18px;
+                margin-left: 25%;
+            }
+
+        #cList1 {
+            float: left;
+        }
+
+            #cList1 li {
+                float: left;
+                height: 450px;
+                color: #00c6ff;
+                font-size: 20px;
+                /*鏂囧瓧灞呬腑*/
+                text-align: center;
+                /*display: flex;*/
+            }
+
+                #cList1 li span {
+                    /*鏂囧瓧灞呬腑*/
+                    display: inline-block;
+                    height: 100%;
+                    /*鏂囧瓧灞呬腑*/
+                    /*鏂囧瓧绔栨帓*/
+                    writing-mode: vertical-lr;
+                    /*浠庡乏鍚戝彸 浠庡彸鍚戝乏鏄� writing-mode: vertical-rl;*/
+                    writing-mode: tb-lr;
+                    /*IE娴忚鍣ㄧ殑浠庡乏鍚戝彸 浠庡彸鍚戝乏鏄� writing-mode: tb-rl锛�*/
+                }
+
+        table tr td {
+            text-align: center;
+            vertical-align: middle !important;
+            /*border: 1px solid #464646;*/
+            border-right: 0px;
+            height: 40px;
+            font-size: 16px;
+            font-family: '榛戜綋';
+            font-family: Arial;
+            border: none;
+        }
+
+        .table > caption + thead > tr:first-child > td,
+        .table > caption + thead > tr:first-child > th,
+        .table > colgroup + thead > tr:first-child > td,
+        .table > colgroup + thead > tr:first-child > th,
+        .table > thead:first-child > tr:first-child > td,
+        .table > thead:first-child > tr:first-child > th {
+            background-color: #000;
+            color: #3bff72;
+        }
+
+        .fixed-table-container tbody td .th-inner,
+        .fixed-table-container thead th .th-inner {
+            font-size: 15px;
+            color: #09d1ea;
+            padding: 20px 0 15px 0;
+        }
+
+        #tb_order tr td {
+            text-align: center;
+            height: 32px;
+            line-height: 32px;
+            font-size: 14px;
+            /* font-family: '榛戜綋'; */
+            color: #a6a8ae;
+            font-family: Arial;
+            /* border: 1px solid #464646; */
+            border: none;
+        }
+
+        .bootstrap-table .table {
+            border-radius: none
+        }
+
+        th {
+            background-color: transparent !important;
+        }
+
+        td {
+            background-color: transparent;
+        }
+
+        tr {
+            background-color: transparent
+        }
+
+        #tb_order tr:nth-child(even) {
+            background: #080c1c;
+        }
+
+        .fixed-table-container tbody td .th-inner,
+        .fixed-table-container thead th .th-inner {
+            text-align: left;
+        }
+
+        .progress {
+            background-color: darkblue;
+        }
+
+        #tb_order tr:nth-child(even) {
+            background: #000000;
+        }
+
+        .pull-right, .fixed-table-pagination .pagination-detail, .fixed-table-pagination div.pagination {
+            display: none;
+        }
+    </style>
+    <script type="text/javascript">
+        //鍙傛暟閰嶇疆
+        var HouseCode = '509'; //浠撳簱缂栫爜
+
+
+        var interval;//璁℃椂鍣�
+        var interval1;//璁℃椂鍣�
+        var num = 0;
+        var LackMastProgress = [];     //缂烘枡鐜囨暟鎹暟缁�
+        var BadProgress = [];          //鏉ユ枡涓嶈壇鐜囨暟鎹暟缁�
+        var ToDayDt = [];              //浠婃棩涓嶈壇瀵规瘮鏃堕棿鏁扮粍
+        var GoodQty = [];              //浠婃棩涓嶈壇瀵规瘮鍚堟牸鏁版暟缁�
+        var BadQty = [];               //浠婃棩涓嶈壇瀵规瘮涓嶈壇鏁版暟缁�
+        $(document).ready(function () {
+            // 鍒涘缓涓や釜鍙橀噺锛屼竴涓暟缁勪腑鐨勬湀鍜屾棩鐨勫悕绉�
+            var monthNames = ["1 鏈�", "2 鏈�", "3 鏈�", "4 鏈�", "5 鏈�", "6 鏈�", "7 鏈�", "8 鏈�", "9 鏈�", "10 鏈�", "11 鏈�", "12 鏈�"];
+            setInterval(function () {
+                var date1 = new Date;
+                var year = date1.getFullYear();
+                var month = date1.getMonth();
+                var day = date1.getDate();
+                var hh = date1.getHours();
+                var mm = date1.getMinutes();
+                var ss = date1.getSeconds();
+                var dayNames = new Array("鏄熸湡鏃�", "鏄熸湡涓�", "鏄熸湡浜�", "鏄熸湡涓�", "鏄熸湡鍥�", "鏄熸湡浜�", "鏄熸湡鍏�");
+                var Stamp = new Date();
+
+
+                $('#Date').html(year + "&nbsp;骞�" + " " + monthNames[month] + ' ' + day + "&nbsp;鏃�&nbsp;&nbsp;" + ' ' + dayNames[Stamp.getDay()]);
+                $("#hours").html((hh < 10 ? ("0" + hh) : hh));
+                $("#min").html((mm < 10 ? ("0" + mm) : mm));
+                $("#sec").html((ss < 10 ? ("0" + ss) : ss));
+
+            }, 1000);
+
+        });
+        $(function () {
+            var mychart1 = echarts.init(document.getElementById('mychart1'));
+            var mychart2 = echarts.init(document.getElementById('mychart2'));
+            var mychart3 = echarts.init(document.getElementById('mychart3'));
+
+            Chart(mychart1, mychart2, mychart3);
+            DataTable();
+            // 瀹氭椂鍣�
+            interval = setInterval(function () {
+                num = 0;
+                LackMastProgress = [];     //缂烘枡鐜囨暟鎹暟缁�
+                BadProgress = [];          //鏉ユ枡涓嶈壇鐜囨暟鎹暟缁�
+                ToDayDt = [];              //浠婃棩涓嶈壇瀵规瘮鏃堕棿鏁扮粍
+                GoodQty = [];              //浠婃棩涓嶈壇瀵规瘮鍚堟牸鏁版暟缁�
+                BadQty = [];               //浠婃棩涓嶈壇瀵规瘮涓嶈壇鏁版暟缁�
+                Chart(mychart1, mychart2, mychart3);
+            }, 20000);
+            interval1 = setInterval(function () {
+                $("#tb_order").bootstrapTable('refresh');
+            }, 10000);
+            //鏍规嵁娴忚鍣ㄥぇ灏忔敼鍙樺ぇ灏�
+            window.onresize = () => {
+                mychart1.resize();
+                mychart2.resize();
+                mychart3.resize();
+            }
+        })
+
+        function Chart(mychart1, mychart2, mychart3) {
+            $.ajax({
+                url: "http://122.227.199.62:5058/HDKanBanApi/api/loaddata/LackMatsData",
+                dataType: "JSON",
+                async: false,//浣跨敤鍚屾鐨勬柟寮�,true涓哄紓姝ユ柟寮�
+                type: "Get",
+                data: { "HouseCode": HouseCode },
+                success: function (data) {
+                    //璁㈠崟淇℃伅
+                    switch (data.data[0][0].Statu) {
+                        case '1':
+                            $("#Stus").html("璁″垝");
+                            break;
+                        case '2':
+                            $("#Stus").html("璁″垝纭");
+                            break;
+                        case '3':
+                            $("#Stus").html("涓嬭揪");
+                            break;
+                        case '4':
+                            $("#Stus").html("寮�宸�");
+                            break;
+                        case '5':
+                            $("#Stus").html("瀹屽伐");
+                            break;
+                        case '6':
+                            $("#Stus").html("缁撴");
+                            break;
+                        case '7':
+                            $("#Stus").html("缁撶畻");
+                        default:
+                    }
+                    $("#OrderQty").html(parseFloat(data.data[0][0].ZQty).toFixed(0));
+                    $("#NetQty").html(parseFloat(data.data[0][0].EmptQty).toFixed(0));
+                    $("#SumQty").html(parseFloat(data.data[0][0].ZKQty).toFixed(0));
+                    $("#MatsQty").html(parseFloat(data.data[0][0].LackMastQty).toFixed(0));
+                    $("#WayQty").html(parseFloat(data.data[0][0].PuchQty).toFixed(0));
+
+                    //缂烘枡鐜�
+                    LackMastProgress.push(data.data[1][0].LackMastProgress);
+                    //鏉ユ枡涓嶈壇鐜�
+                    BadProgress.push(data.data[2][0].BadProgress);
+                    //浠婃棩涓嶈壇瀵规瘮
+                    $.each(data.data[3], function (index, val) {
+                        ToDayDt.push(val.hour.substring(5));
+                        GoodQty.push(parseFloat(val.GoodQty).toFixed(0));
+                        BadQty.push(parseFloat(val.BadQty).toFixed(0));
+                    });
+                },
+                error: function (data) {
+
+                }
+            })
+
+            const colorList = ['#47A2FF', '#ff9900']
+            option1 = {
+                title: [
+                    {
+                        text: '',
+                        subtext: LackMastProgress + '%',
+                        textStyle: {
+                            fontSize: 16,
+                            color: '#999',
+                            lineHeight: 20
+                        },
+                        subtextStyle: {
+                            fontSize: 28,
+                            color: '#00c6ff'
+                        },
+                        textAlign: 'center',
+                        left: '50%',
+                        top: '85%'
+                    },
+                    {
+                        show: true,
+                        text: '鎬荤鍔ㄧ巼鍒嗘瀽',
+                        textStyle: {
+                            color: '#00c6ff',
+                            fontSize: '16',
+                        },
+                        textAlign: 'center',
+                        left: '50%',
+                        top: '0%'
+                    }
+                ],
+                tooltip: {
+                    trigger: 'item',
+                },
+                legend: {
+                    type: 'scroll',
+                    icon: 'pin',
+                    show: false
+                },
+                color: colorList,
+                series: [
+                    {
+                        name: '鍗犳瘮',
+                        type: 'pie',
+                        radius: [50, 80],
+                        center: ['50%', '50%'],
+                        center: ['50%', '60%'],
+                        avoidLabelOverlap: false,
+                        label: {
+                            show: false
+                        },
+                        labelLine: {
+                            show: false
+                        },
+                        itemStyle: {
+                            borderWidth: 3,
+                            borderColor: '#000000'
+                        },
+                        data: [
+                            { name: '', value: LackMastProgress },
+                            { name: '', value: 100 - LackMastProgress }
+                        ],
+                    }
+                ]
+            };
+
+            option2 = {
+                title: [
+                    {
+                        text: '',
+                        subtext: BadProgress + '%',
+                        textStyle: {
+                            fontSize: 16,
+                            color: '#999',
+                            lineHeight: 20
+                        },
+                        subtextStyle: {
+                            fontSize: 28,
+                            color: '#00c6ff'
+                        },
+                        textAlign: 'center',
+                        left: '50%',
+                        top: '50%'
+                    },
+                    {
+                        show: true,
+                        text: '鏉ユ枡涓嶈壇鐜�',
+                        textStyle: {
+                            color: '#00c6ff',
+                            fontSize: '16',
+                        },
+                        textAlign: 'center',
+                        left: '50%',
+                        top: '5%'
+                    }
+                ],
+                tooltip: {
+                    trigger: 'item',
+                },
+                legend: {
+                    type: 'scroll',
+                    icon: 'pin',
+                    show: false
+                },
+                color: colorList,
+                series: [
+                    {
+                        name: '鍗犳瘮',
+                        type: 'pie',
+                        radius: [50, 80],
+                        center: ['50%', '50%'],
+                        center: ['50%', '60%'],
+                        avoidLabelOverlap: false,
+                        label: {
+                            show: false
+                        },
+                        labelLine: {
+                            show: false
+                        },
+                        itemStyle: {
+                            borderWidth: 3,
+                            borderColor: '#000000'
+                        },
+                        data: [
+                            { name: '', value: BadProgress },
+                            { name: '', value: 100 - BadProgress }
+                        ],
+                    }
+                ]
+            };
+
+            option3 = {
+                title: {
+                    text: '绋煎姩鐜囧姣�',
+                    left: '0',
+                    top: 2,
+                    textStyle: {
+                        fontSize: 20,
+                        color: '#00c6ff',
+                        fontFamily: "寰蒋闆呴粦"
+                    },
+                },
+                color: ['#5b9bd5', '#ed7d31', '#a9d18e', '#ffc000'],
+                tooltip: {
+
+                },
+                grid: {
+                    left: '3%',
+                    right: '4%',
+                    bottom: '10%',
+                    containLabel: true
+                },
+                legend: {
+                    left: 'right',
+                    data: ['浠诲姟鏁�', '瀹屾垚鏁�'],
+                    textStyle: {
+                        color: '#00c6ff',
+                        fontSize: 16,
+                        fontFamily: "寰蒋闆呴粦"
+                    }
+
+                },
+                xAxis: [
+                    {
+                        type: 'category',
+                        data: ToDayDt,
+                        axisTick: {
+                            alignWithLabel: true
+                        },
+
+                        axisLine: {
+                            show: true,
+                            lineStyle: {
+                                color: '#00c6ff',
+                                type: 'solid', //璁剧疆缃戞牸绾跨被鍨� dotted锛氳櫄绾�   solid:瀹炵嚎
+                                width: 1, //闅愯棌y杞�
+                            }
+                        },
+                        axisLabel: {
+                            show: true,
+                            textStyle: {
+                                color: '#00c6ff', //鍧愭爣鍊煎緱鍏蜂綋鐨勯鑹�
+                                fontSize: '16'
+                            }
+                        }
+                    }
+                ],
+                yAxis: [
+                    {
+                        type: 'value',
+                        axisLine: {
+                            show: false,
+
+                        },
+                        splitLine: { //缃戞牸绾�
+                            lineStyle: {
+                                color: '#00c6ff',
+
+                            },
+                            show: true //闅愯棌鎴栨樉绀�
+                        },
+                        axisLabel: {
+                            textStyle: {
+                                color: '#00c6ff', //鍧愭爣鍊煎緱鍏蜂綋鐨勯鑹�
+                                fontSize: '16'
+                            }
+                        }
+                    }
+                ],
+                series: [
+                    {
+                        name: '浠诲姟鏁�',
+                        type: 'bar',
+                        barWidth: 15,
+                        data: GoodQty
+                    },
+                    {
+                        name: '瀹屾垚鏁�',
+                        type: 'bar',
+                        barWidth: 15,
+                        data: BadQty
+                    }
+                ]
+            };
+
+
+            mychart1.setOption(option1);
+            //mychart2.setOption(option2);
+            mychart3.setOption(option3);
+        }
+
+        function DataTable() {
+
+            $('#tb_order').bootstrapTable({
+                url: 'http://122.227.199.62:5058/HDKanBanApi/api/loaddata/LackMatsTableData',
+                //data: dataJson,
+                method: 'get',                      //璇锋眰鏂瑰紡锛�*锛�
+                dataType: "json",
+                queryParams: queryParams,
+                striped: false,                      //鏄惁鏄剧ず琛岄棿闅旇壊
+                cache: false,                       //鏄惁浣跨敤缂撳瓨锛岄粯璁や负true锛屾墍浠ヤ竴鑸儏鍐典笅闇�瑕佽缃竴涓嬭繖涓睘鎬э紙*锛�
+                pagination: true,                   //鏄惁鏄剧ず鍒嗛〉锛�*锛�
+                sortable: false,                     //鏄惁鍚敤鎺掑簭
+                sortable: false, //鏄惁鍚敤鎺掑簭
+                search: false,   //鏄惁鍚敤鎼滅储妗�
+                sidePagination: "server",           //鍒嗛〉鏂瑰紡锛歝lient瀹㈡埛绔垎椤碉紝server鏈嶅姟绔垎椤碉紙*锛�
+                pageNumber: 1,                       //鍒濆鍖栧姞杞界涓�椤碉紝榛樿绗竴椤�
+                pageSize: 20,                       //姣忛〉鐨勮褰曡鏁帮紙*锛�
+                pageList: [20],                     //鍙緵閫夋嫨鐨勬瘡椤电殑琛屾暟锛�*锛�
+                strictSearch: false,                //璁剧疆涓� true鍚敤 鍏ㄥ尮閰嶆悳绱紝鍚﹀垯涓烘ā绯婃悳绱�
+                clickToSelect: true,                //鏄惁鍚敤鐐瑰嚮閫変腑琛�
+                singleSelect: true,                  //璁剧疆True 灏嗙姝㈠閫�
+                uniqueId: "ID",                     //姣忎竴琛岀殑鍞竴鏍囪瘑锛屼竴鑸负涓婚敭鍒�
+                cardView: false,                    //鏄惁鏄剧ず璇︾粏瑙嗗浘
+                detailView: false,                   //鏄惁鏄剧ず鐖跺瓙琛�
+
+                columns: [
+                    { field: 'PartNumber', title: '鐗╂枡缂栫爜', align: "left" },
+                    {
+                        field: 'PartName', title: '鐗╂枡鍚嶇О', align: "left", cellStyle: function (value, row, index) {
+                            return {
+                                css: {
+                                    "min-width": "100px",
+                                    "white-space": "nowrap",
+                                    "text-overflow": "ellipsis",
+                                    "overflow": "hidden",
+                                    "max-width": "120px"
+                                }
+                            }
+                        }
+                    },
+                    {
+                        field: 'PartSpec', title: '瑙勬牸鍨嬪彿', align: "left", cellStyle: function (value, row, index) {
+                            return {
+                                css: {
+                                    "min-width": "100px",
+                                    "white-space": "nowrap",
+                                    "text-overflow": "ellipsis",
+                                    "overflow": "hidden",
+                                    "max-width": "120px"
+                                }
+                            }
+                        }
+                    },
+                    {
+                        field: 'LackMastQty', title: '缂烘枡鏁伴噺', align: "left", formatter: function (value, row, index) {
+                            return parseFloat(value).toFixed(2);
+                        }
+                    },
+                    {
+                        field: 'KQty', title: '搴撳瓨鏁伴噺', align: "left", formatter: function (value, row, index) {
+                            return parseFloat(value).toFixed(2);
+                        }
+                    },
+                    {
+                        field: 'EmpQty', title: '鍗犵敤鏁伴噺', align: "left", formatter: function (value, row, index) {
+                            return parseFloat(value).toFixed(2);
+                        }
+                    },
+                    {
+                        field: 'AVAILQTY', title: '鍓╀綑鍙敤鏁伴噺', align: "left", formatter: function (value, row, index) {
+                            var res = row.KQty - row.EmpQty;
+                            return parseFloat(res).toFixed(2);
+                        }
+                    },
+                    {
+                        field: 'PuchQty', title: '閲囪喘鍦ㄩ�旀暟閲�', align: "left", formatter: function (value, row, index) {
+                            return parseFloat(value).toFixed(2);
+                        }
+                    },
+                    {
+                        field: 'SafeQty', title: '瀹夊叏搴撳瓨', align: "left", formatter: function (value, row, index) {
+                            return parseFloat(value).toFixed(2);
+                        }
+                    },
+                    {
+                        field: 'SupQty', title: '闇�姹傞噺', align: "left", formatter: function (value, row, index) {
+                            return parseFloat(value).toFixed(2);
+                        }
+                    },
+                    {
+                        field: 'ToDaySupQty', title: '鏈棩姹傞噺', align: "left", formatter: function (value, row, index) {
+                            return parseFloat(value).toFixed(2);
+                        }
+                    }
+                ],
+                onClickRow: function (row, $element) {
+
+                },
+                onCheck: function (row, $element) {
+
+                },
+                onLoadSuccess: function (row) {
+                    var num_total = (row.total) / 20
+                    if (num >= num_total) {
+                        num = 0
+                    }
+                    //var a = $('#tb_order').bootstrapTable('getSelections');
+                }
+
+            })
+        }
+        //寰楀埌鏌ヨ鐨勫弬鏁�
+        function queryParams(params) {
+            num += 1;
+            var temp = {   //杩欓噷鐨勯敭鐨勫悕瀛楀拰鎺у埗鍣ㄧ殑鍙橀噺鍚嶅繀椤讳竴鐩达紝杩欒竟鏀瑰姩锛屾帶鍒跺櫒涔熼渶瑕佹敼鎴愪竴鏍风殑
+                HouseCode: HouseCode,
+                limit: params.limit,   //椤甸潰澶у皬
+                offset: num,  //椤电爜
+            };
+            return temp;
+        }
+    </script>
+</head>
+
+<body>
+    <div class='title'>璁惧绋煎姩鐜囩湅鏉�</div>
+    <div class="clock">
+        <ul>
+            <li id="Date"></li>
+            <li id="hours"> </li>
+            <li id="point">:</li>
+            <li id="min"> </li>
+            <li id="point">:</li>
+            <li id="sec"> </li>
+        </ul>
+
+    </div>
+    <div class="col-sm-8 left">
+        <table id="tb_order" class="table-condensed table-responsive tb_order" data-filter-control="true"></table>
+    </div>
+    <div class="col-sm-4 right">
+        <div class="col-sm-6 right">
+            <ul id="cList">
+                <li style="font-size: 25px">鐘舵�侊細<span id="Stus"></span></li>
+                <li>鎬昏澶囨暟閲忥細<span id="OrderQty">0</span></li>
+                <li>寮�鏈猴細<span id="NetQty">0</span></li>
+                <li>寮�宸ワ細<span id="SumQty">0</span></li>
+                <li>寰呮満锛�<span id="MatsQty">0</span></li>
+                <li>缁翠慨涓細<span id="WayQty">0</span></li>
+            </ul>
+        </div>
+        <div class="col-sm-6 right">
+            <div id="mychart1"></div>
+        </div>
+    </div>
+    <div class="col-sm-4 right">
+        <div id="mychart2"></div>
+    </div>
+    <div class="col-sm-4 right">
+        <div id="mychart3"></div>
+    </div>
+
+</body>
+
+</html>
\ No newline at end of file
diff --git a/KB_ProductionEquipmentOutputAnalysis.html b/KB_ProductionEquipmentOutputAnalysis.html
new file mode 100644
index 0000000..a50a20a
--- /dev/null
+++ b/KB_ProductionEquipmentOutputAnalysis.html
@@ -0,0 +1,1009 @@
+锘�<!DOCTYPE html>
+
+<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
+<head>
+    <meta charset="utf-8" />
+    <title>鐢熶骇璁惧浜ч噺鍒嗘瀽鐪嬫澘</title>
+    <link rel="stylesheet" type="text/css" href="css/bootstrap.min.css">
+    <link rel="stylesheet" type="text/css" href="css/bootstrap-table.min.css">
+    <link rel="stylesheet" type="text/css" href="css/bootstrap-select.min.css">
+    <link rel="stylesheet" type="text/css" href="css/index.css">
+    <script src="js/jquery.min.js"></script>
+    <script src='js/echarts.min.js'></script>
+    <script src="js/bootstrap.min.js"></script>
+    <script src='js/bootstrap-table.min.js'></script>
+    <script src='js/bootstrap-select.min.js'></script>
+    <script src='js/bootstrap-table-zh-CN.min.js'></script>
+    <script src="js/jquery.SuperSlide.2.1.3.js"></script>
+    <script src='js/template.js'></script>
+    <script src="js/jquery.qrcode.min.js"></script>
+    <style>
+        .clock0 {
+            font-family: 'BebasNeueRegular', Arial, Helvetica, sans-serif;
+            font-size: 20px;
+            width: 450px;
+            float: left;
+            color: #fff;
+            margin-top: -75px;
+            margin-right: 5px;
+            color: #09d1ea;
+        }
+
+        .clock {
+            font-family: 'BebasNeueRegular', Arial, Helvetica, sans-serif;
+            font-size: 20px;
+            width: 450px;
+            float: right;
+            color: #fff;
+            margin-top: -75px;
+            margin-right: 5px;
+            color: #09d1ea;
+        }
+
+            .clock #Date {
+                text-align: center;
+                text-shadow: 0 0 0px #00c6ff;
+            }
+
+            .clock ul {
+                width: 450px;
+                margin: 0 auto;
+                padding: 0px;
+                list-style: none;
+                text-align: right;
+                margin-left: 15px;
+                position: relative;
+            }
+
+                .clock ul li {
+                    display: inline;
+                    font-size: 24px;
+                    text-align: left;
+                    font-family: 'BebasNeueRegular', Arial, Helvetica, sans-serif;
+                    text-shadow: 0 0 0px #00c6ff;
+                }
+
+        body {
+            padding-left: 50px;
+            padding-right: 50px;
+        }
+
+        .title {
+            font-size: 44px;
+            font-family: PingFangSC;
+            font-weight: 500;
+            color: rgba(9, 209, 234, 1);
+            text-align: center;
+            background: url(img/img_little_new.png) center no-repeat;
+            margin-bottom: 30px;
+        }
+
+        .col-sm-12 {
+            position: relative;
+            min-height: 1px;
+            padding-right: 0px;
+            padding-left: 0px;
+        }
+
+        .col-sm-8,
+        .col-sm-6,
+        .col-sm-4,
+        .col-sm-3,
+        .col-sm-2 {
+            /* border: 1px solid #00c6ff; */
+            height: 450px;
+        }
+
+        #cTitle {
+            width: 50px;
+            height: 450px;
+            font-size: 25px;
+            line-height: 30px;
+            color: #00c6ff;
+            border: 1px solid #333
+        }
+
+        .col-sm-12,
+        .col-sm-2,
+        .col-sm-3,
+        .col-sm-4,
+        .col-sm-6,
+        .col-sm-8 {
+            position: relative;
+            min-height: 1px;
+            padding-right: 0px;
+            padding-left: 0px;
+        }
+
+        #mychart1,
+        #mychart2,
+        #mychart3,
+        #mychart4,
+        #mychart5 {
+            width: 100%;
+            border: none;
+            height: 450px;
+        }
+
+        #cList {
+            margin: 0% auto;
+            color: #00c6ff;
+        }
+
+            #cList li {
+                margin: 26px auto;
+                white-space: nowrap;
+                overflow: hidden;
+                text-overflow: ellipsis;
+            }
+
+                #cList li span {
+                    word-wrap: break-word;
+                    word-break: break-all;
+                    overflow: hidden;
+                }
+
+        #cList0 {
+            height: 450px;
+            width: 3%;
+            /* border: 1px solid #00c6ff; */
+            float: left;
+        }
+
+        #cList1 {
+            float: left;
+        }
+
+            #cList1 li {
+                float: left;
+                height: 450px;
+                color: #00c6ff;
+                font-size: 20px;
+                /*鏂囧瓧灞呬腑*/
+                text-align: center;
+                /*display: flex;*/
+            }
+
+                #cList1 li span {
+                    /*鏂囧瓧灞呬腑*/
+                    display: inline-block;
+                    height: 100%;
+                    /*鏂囧瓧灞呬腑*/
+                    /*鏂囧瓧绔栨帓*/
+                    writing-mode: vertical-lr;
+                    /*浠庡乏鍚戝彸 浠庡彸鍚戝乏鏄� writing-mode: vertical-rl;*/
+                    writing-mode: tb-lr;
+                    /*IE娴忚鍣ㄧ殑浠庡乏鍚戝彸 浠庡彸鍚戝乏鏄� writing-mode: tb-rl锛�*/
+                }
+
+        #cList2 {
+            height: 450px;
+            width: 97%;
+            /* border: 1px solid #00c6ff; */
+            float: left;
+        }
+
+        table tr td {
+            text-align: center;
+            vertical-align: middle !important;
+            /*border: 1px solid #464646;*/
+            border-right: 0px;
+            height: 40px;
+            font-size: 16px;
+            font-family: '榛戜綋';
+            font-family: Arial;
+            border: none;
+        }
+
+        .table > caption + thead > tr:first-child > td,
+        .table > caption + thead > tr:first-child > th,
+        .table > colgroup + thead > tr:first-child > td,
+        .table > colgroup + thead > tr:first-child > th,
+        .table > thead:first-child > tr:first-child > td,
+        .table > thead:first-child > tr:first-child > th {
+            background-color: #000;
+            color: #3bff72;
+        }
+
+        .fixed-table-container tbody td .th-inner,
+        .fixed-table-container thead th .th-inner {
+            font-size: 15px;
+            color: #09d1ea;
+            padding: 20px 0 15px 0;
+        }
+
+        #tb_order tr td {
+            text-align: center;
+            height: 32px;
+            line-height: 32px;
+            font-size: 14px;
+            /* font-family: '榛戜綋'; */
+            color: #a6a8ae;
+            font-family: Arial;
+            /* border: 1px solid #464646; */
+            border: none;
+        }
+
+        .bootstrap-table .table {
+            border-radius: none
+        }
+
+        th {
+            background-color: transparent !important;
+        }
+
+        td {
+            background-color: transparent;
+        }
+
+        tr {
+            background-color: transparent
+        }
+
+        #tb_order tr:nth-child(even) {
+            background: #080c1c;
+        }
+
+        .fixed-table-container tbody td .th-inner,
+        .fixed-table-container thead th .th-inner {
+            text-align: left;
+        }
+
+        .progress {
+            background-color: darkblue;
+        }
+
+        #tb_order tr:nth-child(even) {
+            background: #000000;
+        }
+
+        .pull-right, .fixed-table-pagination .pagination-detail, .fixed-table-pagination div.pagination {
+            display: none;
+        }
+
+        .col-sm-3 {
+            width: 20%;
+        }
+
+        .bootstrap-select.form-control:not([class*=col-]) {
+            width: 220px;
+            /* float: right; */
+        }
+
+        .bootstrap-select > .dropdown-toggle.bs-placeholder,
+        .bootstrap-select > .dropdown-toggle.bs-placeholder:active,
+        .bootstrap-select > .dropdown-toggle.bs-placeholder:focus,
+        .bootstrap-select > .dropdown-toggle.bs-placeholder:hover {
+            border-color: #080E2D !important;
+            background-color: #000 !important;
+            color: #09d1ea !important;
+        }
+
+        .bootstrap-select.btn-group.show-tick .dropdown-menu li a span.text {
+            color: #09d1ea !important;
+        }
+
+        .bootstrap-select.btn-group .dropdown-menu {
+            background-color: #000 !important;
+        }
+
+        .form-control {
+            background-color: #000 !important;
+        }
+
+            .form-control:focus {
+                border-color: #09d1ea !important;
+            }
+
+            .form-control:hover {
+                border-color: #000 !important;
+            }
+
+        .btn-default:hover {
+            border-color: #09d1ea !important;
+        }
+
+        .bootstrap-select.btn-group .dropdown-menu li a:hover {
+            background-color: rgba(255, 255, 255, 0.3) !important;
+        }
+
+        .btn-default {
+            border-color: #09d1ea !important;
+            color: #09d1ea !important;
+            background-color: #000 !important;
+        }
+
+        .bootstrap-select.form-control:hover {
+            background-color: #000 !important;
+        }
+
+        .btn-default:hover {
+            background-color: #000 !important;
+            border-color: #09d1ea !important;
+            color: #09d1ea !important;
+        }
+
+        .dropdown-menu > .active > a, .dropdown-menu > .active > a:focus, .dropdown-menu > .active > a:hover {
+            background-color: rgba(255, 255, 255, 0.3) !important;
+        }
+    </style>
+    <script type="text/javascript">
+        //閰嶇疆鍙傛暟
+        var LineCode = '11111'//鐢熶骇璧勬簮缂栫爜
+        var LineCodeList = 'BM000002';//娴佹按绾跨湅鏉夸粖鏃ュ叏閮ㄦ祦姘寸嚎缂栫爜:浜х嚎1銆佷骇绾�2銆佷骇绾�3銆佷骇绾�4銆佷骇绾�5銆佷骇绾�6
+
+
+
+        var interval;//璁℃椂鍣�
+        var interval1;//璁℃椂鍣�
+        var num = 0;
+        var hours = [];
+        var hoursqty = [];
+        var CloseProgress = 0;  //瀹屽伐鐜�
+        var LineName = [];  //娴佹按绾挎暟缁�
+        var LineOrderQty = [];  //娴佹按绾垮綋澶╄鍗曟�讳换鍔℃暟閲忔暟缁�
+        var LineOrderCloseQty = [];  //娴佹按绾垮綋澶╄鍗曟�诲畬鎴愭暟閲忔暟缁�
+        var Week = 0;  //鏈懆鍒嗘瀽
+        var Month = 0; //鏈湀鍒嗘瀽
+        $(document).ready(function () {
+            // 鍒涘缓涓や釜鍙橀噺锛屼竴涓暟缁勪腑鐨勬湀鍜屾棩鐨勫悕绉�
+            var monthNames = ["1 鏈�", "2 鏈�", "3 鏈�", "4 鏈�", "5 鏈�", "6 鏈�", "7 鏈�", "8 鏈�", "9 鏈�", "10 鏈�", "11 鏈�", "12 鏈�"];
+            setInterval(function () {
+                var date1 = new Date;
+                var year = date1.getFullYear();
+                var month = date1.getMonth();
+                var day = date1.getDate();
+                var hh = date1.getHours();
+                var mm = date1.getMinutes();
+                var ss = date1.getSeconds();
+                var dayNames = new Array("鏄熸湡鏃�", "鏄熸湡涓�", "鏄熸湡浜�", "鏄熸湡涓�", "鏄熸湡鍥�", "鏄熸湡浜�", "鏄熸湡鍏�");
+                var Stamp = new Date();
+
+
+                $('#Date').html(year + "&nbsp;骞�" + " " + monthNames[month] + ' ' + day + "&nbsp;鏃�&nbsp;&nbsp;" + ' ' + dayNames[Stamp.getDay()]);
+                $("#hours").html((hh < 10 ? ("0" + hh) : hh));
+                $("#min").html((mm < 10 ? ("0" + mm) : mm));
+                $("#sec").html((ss < 10 ? ("0" + ss) : ss));
+
+            }, 1000);
+
+        });
+        $(function () {
+            showHospitalCode();
+            var mychart1 = echarts.init(document.getElementById('mychart1'));
+            var mychart2 = echarts.init(document.getElementById('mychart2'));
+            var mychart3 = echarts.init(document.getElementById('mychart3'));
+            var mychart4 = echarts.init(document.getElementById('mychart4'));
+            var mychart5 = echarts.init(document.getElementById('mychart5'));
+            Chart(mychart1, mychart2, mychart3, mychart4, mychart5);
+            DataTable();
+            // 瀹氭椂鍣�
+            interval = setInterval(function () {
+                hours = [];
+                hoursqty = [];
+                CloseProgress = 0;  //瀹屽伐鐜�
+                LineName = [];  //娴佹按绾挎暟缁�
+                LineOrderQty = [];  //娴佹按绾垮綋澶╄鍗曟�讳换鍔℃暟閲忔暟缁�
+                LineOrderCloseQty = [];  //娴佹按绾垮綋澶╄鍗曟�诲畬鎴愭暟閲忔暟缁�
+                Week = 0;  //鏈懆鍒嗘瀽
+                Month = 0; //鏈湀鍒嗘瀽
+                Chart(mychart1, mychart2, mychart3, mychart4, mychart5);
+            }, 20000);
+            setInterval(function () {
+                //num+=1;
+                //$("#tb_order").bootstrapTable('refreshOptions',{offset:num});  // pageNumber:1, 鎸囧畾椤电爜涓虹1椤�
+                $("#tb_order").bootstrapTable('refresh');
+            }, 10000);
+            //鏍规嵁绐楀彛鐨勫ぇ灏忓彉鍔ㄥ浘琛� --- 閲嶇偣
+            window.onresize = function () {
+                myChart1.resize();
+                myChart2.resize();
+                myChart3.resize();
+                myChart4.resize();
+                myChart5.resize();
+            }
+        })
+
+        function Chart(mychart1, mychart2, mychart3, mychart4, mychart5) {
+            $.ajax({
+                url: "http://localhost:12298/api/loaddata/KB_ProductData",
+                dataType: "JSON",
+                async: false,//浣跨敤鍚屾鐨勬柟寮�,true涓哄紓姝ユ柟寮�
+                type: "Get",
+                data: { "LineCode": LineCode, "LineCodeList": LineCodeList },
+                success: function (data) {
+
+                    $.each(data.data[0], function (index, val) {
+                        hours.push(val.hour + '鐐�');
+                        hoursqty.push(parseFloat(val.Count).toFixed(2));
+
+                    });
+                    if (data.data[1].length > 0) {
+                        $("#OrderQty").html(parseFloat(data.data[1][0].HDatePlanQty).toFixed(2)); //鎬昏鍗�
+                        $("#OrderInQty").html(parseFloat(data.data[1][0].HQty).toFixed(2));//宸插叆搴�
+
+                        CloseProgress = parseFloat(data.data[1][0].HQty / data.data[1][0].HDatePlanQty).toFixed(2);  //瀹屾垚鐜�
+                    }
+
+                    if (data.data[2].length > 0) {
+                        $("#LineStus").html(data.data[2][0].HICMOStatus);
+                    }
+
+                    //浠婃棩鍏ㄩ儴娴佹按绾夸骇閲忓姣�
+                    $.each(data.data[3], function (index, val) {
+                        LineName.push(val.FNAME);
+                        LineOrderQty.push(parseFloat(val.qty).toFixed(2));
+                        LineOrderCloseQty.push(parseFloat(val.inqty).toFixed(2));
+
+                    });
+
+                    //鏈懆鍒嗘瀽
+                    Week = parseFloat(data.data[4][1].weekqty / data.data[4][0].weekqty).toFixed(2);
+                    //鏈湀鍒嗘瀽
+                    Month = parseFloat(data.data[4][3].weekqty / data.data[4][2].weekqty).toFixed(2);
+                },
+                error: function (data) {
+
+                }
+            })
+
+
+            option1 = {
+                tooltip: {
+                    trigger: 'item',
+                    formatter: "{a} <br/>{b}鏈� : {c}"
+                },
+                xAxis: {
+                    type: 'category',
+                    boundaryGap: false,
+                    data: hours,   //鏃堕棿鐐规暟鎹�
+                    axisLine: {
+                        show: true,
+                        lineStyle: {
+                            color: '#00c6ff',
+                        },
+                    },
+                    axisTick: {
+                        show: true,
+                    },
+                    axisLabel: {
+                        textStyle: {
+                            color: '#00c6ff', //鍧愭爣鍊煎緱鍏蜂綋鐨勯鑹�
+                            fontSize: '16'
+                        }
+                    }
+                },
+                yAxis: [{
+                    type: 'value',
+                    axisLine: {
+                        show: true,
+                        lineStyle: {
+                            color: '#00c6ff',
+                            width: 0, //闅愯棌y杞�
+                        }
+                    },
+                    splitLine: { //缃戞牸绾�
+                        lineStyle: {
+                            type: 'dotted', //璁剧疆缃戞牸绾跨被鍨� dotted锛氳櫄绾�   solid:瀹炵嚎
+                        },
+                        show: false //闅愯棌鎴栨樉绀�
+                    },
+                    axisTick: {
+                        show: false,
+                    },
+                    axisLabel: {
+                        textStyle: {
+                            color: '#00c6ff', //鍧愭爣鍊煎緱鍏蜂綋鐨勯鑹�
+                            fontSize: '16'
+                        }
+                    },
+                    splitNumber: 5
+                }],
+                title: {
+                    show: true,
+                    text: '鐢熶骇鏁堢巼鍒嗘瀽',
+                    x: 'left',
+                    textStyle: {
+                        color: '#00c6ff',
+                        fontSize: 18,
+                        fotweight: 'normal',
+                        fontFamily: "寰蒋闆呴粦"
+                    }
+                },
+                legend: {
+                    icon: 'line',
+                    data: ['灏忔椂浜ц兘'],
+                    textStyle: {
+                        color: '#00c6ff',
+                        fontSize: 20,
+                        fontFamily: "寰蒋闆呴粦"
+                    }
+                },
+                series: [
+                    {
+                        name: '灏忔椂浜ц兘',
+                        data: hoursqty,  //鏃堕棿鐐瑰��
+                        type: 'line',
+                        smooth: true,
+                        itemStyle: {
+                            normal: {
+                                color: 'orange',
+                                lineStyle: {
+                                    width: 4, //璁剧疆绾挎潯绮楃粏
+                                    shadowColor: 'rgba(255, 94, 91,.1)',
+                                    shadowOffsetX: 3,
+                                    shadowOffsetY: 5,
+                                }
+                            },
+                        },
+                        textStyle: {
+                            fontFamily: "寰蒋闆呴粦"
+                        }
+                    },
+                ]
+            }
+
+            const colorList = ['#47A2FF ', '#FBD444']
+
+            option2 = {
+                title: {
+                    text: '杈炬垚鐜�',
+                    subtext: (CloseProgress * 100).toFixed(0) + '%',
+                    textStyle: {
+                        fontSize: 20,
+                        color: '#00c6ff',
+                        lineHeight: 20,
+                        fontFamily: "寰蒋闆呴粦"
+                    },
+                    subtextStyle: {
+                        fontSize: 18,
+                        color: '#00c6ff'
+                    },
+                    textAlign: 'center',
+                    left: '50%',
+                    top: '70%'
+                },
+                tooltip: {
+                    trigger: 'item',
+                },
+                legend: {
+                    type: 'scroll',
+                    icon: 'pin',
+                    show: true,
+                    top: '90%',
+                    left: 'center',
+                    textStyle: {
+                        color: '#09d1ea'
+                    }
+                },
+                color: colorList,
+                series: [
+                    {
+                        name: '鍗犳瘮',
+                        type: 'pie',
+                        radius: [50, 80],
+                        center: ['50%', '50%'],
+                        label: {
+                            show: false
+                        },
+                        labelLine: {
+                            show: false
+                        },
+                        itemStyle: {
+                            borderWidth: 3,
+                            borderColor: '#000000'
+                        },
+                        data: [
+                            { name: '杈炬垚鐜�', value: CloseProgress > 1 ? 1 : CloseProgress },
+                            { name: '鏈揪鎴愮巼', value: CloseProgress > 1 ? 0 : 1 - CloseProgress }
+                        ]
+                    }
+                ]
+            };
+
+            option3 = {
+                title: {
+                    text: '浠婃棩鍏ㄩ儴娴佹按绾夸骇閲忓姣�',
+                    left: '0',
+                    top: 2,
+                    textStyle: {
+                        fontSize: 20,
+                        color: '#00c6ff',
+                        fontFamily: "寰蒋闆呴粦"
+                    },
+                },
+                color: ['#5b9bd5', '#ed7d31', '#a9d18e', '#ffc000'],
+                tooltip: {
+
+                },
+                grid: {
+                    left: '3%',
+                    right: '4%',
+                    bottom: '10%',
+                    containLabel: true
+                },
+                legend: {
+                    left: 'right',
+                    data: ['浠诲姟鏁�', '瀹屾垚鏁�'],
+                    textStyle: {
+                        color: '#00c6ff',
+                        fontSize: 16,
+                        fontFamily: "寰蒋闆呴粦"
+                    }
+
+                },
+                xAxis: [
+                    {
+                        type: 'category',
+                        data: LineName,
+                        axisTick: {
+                            alignWithLabel: true
+                        },
+
+                        axisLine: {
+                            show: true,
+                            lineStyle: {
+                                color: '#00c6ff',
+                                type: 'solid', //璁剧疆缃戞牸绾跨被鍨� dotted锛氳櫄绾�   solid:瀹炵嚎
+                                width: 1, //闅愯棌y杞�
+                            }
+                        },
+                        axisLabel: {
+                            show: true,
+                            textStyle: {
+                                color: '#00c6ff', //鍧愭爣鍊煎緱鍏蜂綋鐨勯鑹�
+                                fontSize: '16'
+                            }
+                        }
+                    }
+                ],
+                yAxis: [
+                    {
+                        type: 'value',
+                        axisLine: {
+                            show: false,
+
+                        },
+                        splitLine: { //缃戞牸绾�
+                            lineStyle: {
+                                color: '#00c6ff',
+
+                            },
+                            show: true //闅愯棌鎴栨樉绀�
+                        },
+                        axisLabel: {
+                            textStyle: {
+                                color: '#00c6ff', //鍧愭爣鍊煎緱鍏蜂綋鐨勯鑹�
+                                fontSize: '16'
+                            }
+                        }
+                    }
+                ],
+                series: [
+                    {
+                        name: '浠诲姟鏁�',
+                        type: 'bar',
+                        data: LineOrderQty
+                    },
+                    {
+                        name: '瀹屾垚鏁�',
+                        type: 'bar',
+                        data: LineOrderCloseQty
+                    }
+                ]
+            };
+
+            option4 = {
+                title: [
+                    {
+                        text: '杈炬垚鐜�',
+                        subtext: (Week * 100).toFixed(0) + '%',
+                        textStyle: {
+                            fontSize: 16,
+                            color: '#999',
+                            lineHeight: 20
+                        },
+                        subtextStyle: {
+                            fontSize: 28,
+                            color: '#00c6ff'
+                        },
+                        textAlign: 'center',
+                        left: '50%',
+                        top: '70%'
+                    },
+                    {
+                        show: true,
+                        text: '鏈懆鍒嗘瀽',
+                        textStyle: {
+                            color: '#00c6ff',
+                            fontSize: '16',
+                        },
+                        textAlign: 'center',
+                        left: '50%',
+                        top: '5%'
+                    }
+                ],
+                tooltip: {
+                    trigger: 'item',
+                },
+                legend: {
+                    type: 'scroll',
+                    icon: 'pin',
+                    show: true,
+                    top: '90%',
+                    left: 'center',
+                    textStyle: {
+                        color: '#09d1ea'
+                    }
+                },
+                color: colorList,
+                series: [
+                    {
+                        name: '濮撳悕',
+                        type: 'pie',
+                        radius: [50, 80],
+                        center: ['50%', '50%'],
+                        label: {
+                            show: false
+                        },
+                        labelLine: {
+                            show: false
+                        },
+                        itemStyle: {
+                            borderWidth: 3,
+                            borderColor: '#000000'
+                        },
+                        data: [
+                            { name: '杈炬垚鐜�', value: Week > 1 ? 1 : Week },
+                            { name: '鏈揪鎴愮巼', value: Week > 1 ? 0 : 1 - Week }
+                        ],
+                    }
+                ]
+            };
+
+            option5 = {
+                title: [
+                    {
+                        text: '杈炬垚鐜�',
+                        subtext: (Month * 100).toFixed(0) + '%',
+                        textStyle: {
+                            fontSize: 16,
+                            color: '#999',
+                            lineHeight: 20
+                        },
+                        subtextStyle: {
+                            fontSize: 28,
+                            color: '#00c6ff'
+                        },
+                        textAlign: 'center',
+                        left: '50%',
+                        top: '70%'
+                    },
+                    {
+                        show: true,
+                        text: '鏈湀鍒嗘瀽',
+                        textStyle: {
+                            color: '#00c6ff',
+                            fontSize: '16',
+                        },
+                        textAlign: 'center',
+                        left: '50%',
+                        top: '5%'
+                    }
+                ],
+                tooltip: {
+                    trigger: 'item',
+                },
+                legend: {
+                    type: 'scroll',
+                    icon: 'pin',
+                    show: true,
+                    top: '90%',
+                    left: 'center',
+                    textStyle: {
+                        color: '#09d1ea'
+                    }
+                },
+                color: colorList,
+                series: [
+                    {
+                        name: '濮撳悕',
+                        type: 'pie',
+                        radius: [50, 80],
+                        center: ['50%', '50%'],
+                        label: {
+                            show: false
+                        },
+                        labelLine: {
+                            show: false
+                        },
+                        itemStyle: {
+                            borderWidth: 3,
+                            borderColor: '#000000'
+                        },
+                        data: [
+                            { name: '杈炬垚鐜�', value: Month > 1 ? 1 : Month },
+                            { name: '鏈揪鎴愮巼', value: Month > 1 ? 0 : 1 - Month }
+                        ],
+                    }
+                ]
+            };
+
+
+            mychart1.setOption(option1);
+            mychart2.setOption(option2);
+            mychart3.setOption(option3);
+            mychart4.setOption(option4);
+            mychart5.setOption(option5);
+
+        }
+
+        function DataTable() {
+            $('#tb_order').bootstrapTable({
+                url: 'http://localhost:12298/api/loaddata/KB_ProductTableData',
+                //data: dataJson,
+                method: 'get',                      //璇锋眰鏂瑰紡锛�*锛�
+                dataType: "json",
+                queryParams: queryParams,
+                striped: false,                      //鏄惁鏄剧ず琛岄棿闅旇壊
+                cache: false,                       //鏄惁浣跨敤缂撳瓨锛岄粯璁や负true锛屾墍浠ヤ竴鑸儏鍐典笅闇�瑕佽缃竴涓嬭繖涓睘鎬э紙*锛�
+                pagination: true,                   //鏄惁鏄剧ず鍒嗛〉锛�*锛�
+                sortable: false,                     //鏄惁鍚敤鎺掑簭
+                sortable: false, //鏄惁鍚敤鎺掑簭
+                search: false,   //鏄惁鍚敤鎼滅储妗�
+                sidePagination: "server",           //鍒嗛〉鏂瑰紡锛歝lient瀹㈡埛绔垎椤碉紝server鏈嶅姟绔垎椤碉紙*锛�
+                pageNumber: 1,                       //鍒濆鍖栧姞杞界涓�椤碉紝榛樿绗竴椤�
+                pageSize: 10,                       //姣忛〉鐨勮褰曡鏁帮紙*锛�
+                pageList: [10],                     //鍙緵閫夋嫨鐨勬瘡椤电殑琛屾暟锛�*锛�
+                strictSearch: false,                //璁剧疆涓� true鍚敤 鍏ㄥ尮閰嶆悳绱紝鍚﹀垯涓烘ā绯婃悳绱�
+                clickToSelect: true,                //鏄惁鍚敤鐐瑰嚮閫変腑琛�
+                singleSelect: true,                  //璁剧疆True 灏嗙姝㈠閫�
+                uniqueId: "ID",                     //姣忎竴琛岀殑鍞竴鏍囪瘑锛屼竴鑸负涓婚敭鍒�
+                cardView: false,                    //鏄惁鏄剧ず璇︾粏瑙嗗浘
+                detailView: false,                   //鏄惁鏄剧ず鐖跺瓙琛�
+                //responseHandler: function (res) {
+                //    // 瀵硅繑鍥炲弬鏁拌繘琛屽鐞�
+                //    //console.log(res);
+                //    //return {
+                //    //    "total": res.total,
+                //    //    "rows": res.rows
+                //    //};
+                //},
+                columns: [
+                    { field: 'HICMOBillNo', title: '鐢熶骇璁㈠崟鍙�', align: "left" },
+                    { field: 'HNumber', title: '浜у搧缂栫爜', align: "left" },
+                    { field: 'HName', title: '浜у搧鍚嶇О', align: "left" },
+                    { field: 'HModel', title: '浜у搧瑙勬牸', align: "left" },
+                    {
+                        field: 'HPlanQty', title: '璁㈠崟鏁伴噺', align: "left", width: 100, formatter: function (value, row, index) {
+                            return parseFloat(value).toFixed(2);
+                        }
+                    },
+                    {
+                        field: 'HSplitRelationQty', title: '瀹屾垚鏁伴噺', align: "left", width: 100, formatter: function (value, row, index) {
+                            return parseFloat(value).toFixed(2);
+                        }
+                    },
+                    {
+                        field: 'FQTY', title: '搴撳瓨鏁伴噺', align: "left", width: 100, formatter: function (value, row, index) {
+                            return parseFloat(value).toFixed(2);
+                        }
+                    },
+                    {
+                        field: 'HICMOStatus', title: '鐘舵��', align: "left", width: 100
+                    },
+                    {
+                        field: 'Progress', title: '杩涘害', align: "left", formatter: function (value, row, index) {
+                            var res = 100 * row.HSplitRelationQty / row.HPlanQty;
+                            return "<div class='w40 div_co pw'><div class='PA' style='text-align:right;color:#4b2dba;float:right;height:20px;line-height:25px'>" + res.toFixed(2) + "%</div><div class='progress' style='margin-top:4px;'><div class='progress-bar progress-diy-info' role='progressbar' aria-valuenow='50' aria-valuemin='0' aria-valuemax='100' style='width:" + res.toFixed(2) + "%';text-align:center;'></div></div></div>";
+                        }
+                    }
+                ],
+                onClickRow: function (row, $element) {
+
+                },
+                onCheck: function (row, $element) {
+
+                },
+                onLoadSuccess: function (row) {
+                    var num_total = (row.total) / 10
+                    if (num >= num_total) {
+                        num = 0
+                    }
+                    //var a = $('#tb_order').bootstrapTable('getSelections');
+                }
+
+            })
+        }
+        //寰楀埌鏌ヨ鐨勫弬鏁�
+        function queryParams(params) {
+            num += 1;
+            var temp = {   //杩欓噷鐨勯敭鐨勫悕瀛楀拰鎺у埗鍣ㄧ殑鍙橀噺鍚嶅繀椤讳竴鐩达紝杩欒竟鏀瑰姩锛屾帶鍒跺櫒涔熼渶瑕佹敼鎴愪竴鏍风殑
+                LineCode: LineCode,
+                limit: params.limit,   //椤甸潰澶у皬
+                offset: num,  //椤电爜
+            };
+            return temp;
+        }
+            //閫夋嫨浜嬩欢
+            function selectOnchang(obj) {
+                LineCode = obj.options[obj.selectedIndex].value;
+                Chart(mychart1, mychart2, mychart3, mychart4, mychart5)
+                //DataTable();
+                $('#tb_order').bootstrapTable('refresh');
+        }
+        function showHospitalCode() {
+            $.ajax({
+                url: "http://localhost:12298/api/loaddata/Gy_Source",//璺宠浆鍒版帶鍒跺櫒HospitalController
+                type: "get",
+                success: function (Data) {
+                    var hospitals = JSON.parse(Data);//鍙嶅簭鍒楀寲
+                    var content = '';
+                    $.each(hospitals.data, function (i, n) {
+                        content += "<option value='" + n.HNumber + "'>" + n.HName + "</option>";
+                    });
+                    $("#hospitalCodeSelect").append(content);//append 娣诲姞杩涘幓骞跺睍绀�
+                    $("#hospitalCodeSelect").find("option[value='" + hospitals.data[0].HNumber + "']").attr("selected", true);
+                    $("#hospitalCodeSelect").selectpicker('refresh');
+                   
+                }
+            })
+        }
+    </script>
+</head>
+<body>
+    <div class='title'>鐢熶骇璁惧浜ч噺鍒嗘瀽鐪嬫澘</div>
+    <div class="clock0">
+        <select class="selectpicker show-tick form-control" id="hospitalCodeSelect" data-live-search="true" title="鎼滅储鎴栭�夋嫨娴佹按绾�" style="float: left;" onchange="selectOnchang(this)">
+            <option value=''></option>
+        </select>
+    </div>
+    <div class="clock">
+        <ul>
+            <li id="Date"></li>
+            <li id="hours"> </li>
+            <li id="point">:</li>
+            <li id="min"> </li>
+            <li id="point">:</li>
+            <li id="sec"> </li>
+        </ul>
+
+    </div>
+    <div class="col-sm-8">
+        <div class="col-sm-7">
+            <div id="mychart1"></div>
+        </div>
+        <div class="col-sm-3">
+            <ul id="cList">
+                <li style="font-size: 25px"><span>璁惧鐘舵�侊細</span><span id="LineStus"></span></li>
+                <li><span>璁㈠崟閲忥細</span><span id="OrderQty">0</span></li>
+                <li><span>浜ч噺锛�</span><span id="OrderInQty">0</span></li>
+            </ul>
+        </div>
+        <div class="col-sm-2">
+            <div id="mychart2"></div>
+        </div>
+    </div>
+    <div class="col-sm-4">
+        <div id="mychart3"></div>
+    </div>
+    <div class="col-sm-8">
+        <div id="cList0">
+            <ul id="cList1">
+                <li><span>鏈嚎褰撴棩鍏ㄩ儴璁㈠崟</span></li>
+            </ul>
+        </div>
+        <div id="cList2">
+            <table id="tb_order" class="table-condensed table-responsive tb_order" data-filter-control="true"></table>
+        </div>
+    </div>
+    <div class="col-sm-4">
+        <div class="col-sm-6">
+            <div id="mychart4"></div>
+        </div>
+        <div class="col-sm-6">
+            <div id="mychart5"></div>
+        </div>
+    </div>
+</body>
+</html>
\ No newline at end of file

--
Gitblit v1.9.1