dashboard.html 7.6 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167
  1. <html lang="en">
  2. <head>
  3. <meta charset="UTF-8">
  4. <meta name="viewport" content="width=device-width, initial-scale=1.0">
  5. <meta http-equiv="X-UA-Compatible" content="ie=edge">
  6. <title>麟力科技产量统计看板</title>
  7. <link rel="stylesheet" href="../lib/owl-carousel/css/owl.carousel.css">
  8. <link rel="stylesheet" href="../lib/owl-carousel/css/owl.theme.css">
  9. <script type="text/javascript" src="../js/jquery.js"></script>
  10. <script type="text/javascript" src="../lib/echart4.js"></script>
  11. <script type="text/javascript" src="../js/dashboard.js"></script>
  12. <script type="text/javascript" src="../js/jquery.liMarquee.js"></script>
  13. <script type="text/javascript" src="../js/jquery.cxselect.min.js"></script>
  14. <script type="text/javascript" src="../lib/owl.carousel.min.js"></script>
  15. <link rel="stylesheet" href="../css/dashboard.css">
  16. <link rel="stylesheet" href="../css/style.css">
  17. </head>
  18. <body>
  19. <div style="background:#000d4a url(../images/bg.jpg) center top;">
  20. <div class="loading">
  21. <div class="loadbox"> <img src="../images/loading.gif"> 页面加载中... </div>
  22. </div>
  23. <div class="back"></div>
  24. <div class="head">
  25. <div class="weather"><span id="showTime"></span></div>
  26. <h1>麟力科技生产运行监控分析系统</h1>
  27. </div>
  28. <script>
  29. var t = null;
  30. t = setTimeout(time, 1000);/*開始运行*/
  31. function time() {
  32. clearTimeout(t);/*清除定时器*/
  33. dt = new Date();
  34. var y = dt.getFullYear();
  35. var mt = dt.getMonth() + 1;
  36. var day = dt.getDate();
  37. var h = dt.getHours();
  38. var m = dt.getMinutes();
  39. var s = dt.getSeconds();
  40. document.getElementById("showTime").innerHTML = y + "年" + mt + "月" + day + "日" + h + "时" + m + "分" + s + "秒";
  41. t = setTimeout(time, 1000);
  42. }
  43. </script>
  44. <div class="mainbox">
  45. <ul class="clearfix">
  46. <li>
  47. <div class="boxall" style="height:300px;">
  48. <div class="alltitle">工序每日产出数量</div>
  49. <div class="navboxall">
  50. <div class="pmProgresstit">
  51. <span class="col15">工序</span><span class="col50">产量</span><span
  52. class="col20">产能</span><span class="col15">使用率</span>
  53. </div>
  54. <div class="wrap" id="dayOutputs">
  55. <ul class="dayOutputs">
  56. </ul>
  57. </div>
  58. </div>
  59. </div>
  60. <div class="boxall" style="height:300px;">
  61. <div class="alltitle">未完成订单清单</div>
  62. <div class="navboxall">
  63. <div class="wraptit">
  64. <span>单号</span><span>产品名称</span><span>当前工序</span>
  65. </div>
  66. <div class="wrap" id="lastestLots">
  67. <ul class="lastestLots">
  68. </ul>
  69. </div>
  70. </div>
  71. </div>
  72. <div class="boxall" style="height:300px;">
  73. <div class="alltitle">生产报废统计分布</div>
  74. <div class="navboxall" id="echart1"></div>
  75. </div>
  76. </li>
  77. <li>
  78. <div class="boxall" style="height:300px">
  79. <div id="owl" class="owl-carousel">
  80. <div>
  81. <div class="alltitle"><span class="yearSpan"></span>封装月产出数</div>
  82. <div class="navboxall" id="echart12"></div>
  83. </div>
  84. <div>
  85. <div class="alltitle"><span class="yearSpan"></span>中测月产出数</div>
  86. <div class="navboxall" id="echart10"></div>
  87. </div>
  88. <div>
  89. <div class="alltitle"><span class="yearSpan"></span>成测月产出数</div>
  90. <div class="navboxall" id="echart11"></div>
  91. </div>
  92. </div>
  93. </div>
  94. <div class="boxall" style="height:300px">
  95. <div class="alltitle"><span class="yearSpan"></span>年制造部成测月实际良率与目标良率表</div>
  96. <div class="navboxall" id="echart4"></div>
  97. </div>
  98. <div class="boxall" style="height:300px">
  99. <div class="alltitle"><span class="yearSpan"></span>年中测实际良率与目标良率表</div>
  100. <div class="navboxall" id="echart3"></div>
  101. </div>
  102. </li>
  103. <li>
  104. <div class="boxall" style="height:300px">
  105. <div class="alltitle">设备保养完成统计</div>
  106. <div class="navboxall">
  107. <div class="pmProgresstit">
  108. <span class="col25">工序</span><span class="col50">保养完成率</span><span
  109. class="col25">机台数</span>
  110. </div>
  111. <div class="pmProgress" id="machinePmRate">
  112. <ul class="machinePmRate">
  113. </ul>
  114. </div>
  115. <!-- <table class="table1" width="100%" border="0" cellspacing="0" cellpadding="0">
  116. <thead>
  117. <tr>
  118. <th scope="col">工序</th>
  119. <th scope="col">保养完成率</th>
  120. <th scope="col">机台数</th>
  121. </tr>
  122. </thead>
  123. <tbody id="machinePmRate">
  124. </tbody>
  125. </table> -->
  126. </div>
  127. </div>
  128. <div class="boxall" style="height: 300px">
  129. <div class="alltitle">设备未完成保养清单</div>
  130. <div class="navboxall">
  131. <div class="wraptit">
  132. <span class="li-num">序号</span><span class="li-pname">所在工序</span><span
  133. class="li-mac">机台编号</span><span class="li-duty">责任员工号</span>
  134. </div>
  135. <div class="wrap" id="machineToPm">
  136. <ul class="machineToPm">
  137. </ul>
  138. </div>
  139. </div>
  140. </div>
  141. <div class="boxall" style="height:300px">
  142. <div class="alltitle">OS失效分析分布统计</div>
  143. <div class="navboxall" id="echart2"></div>
  144. </div>
  145. </li>
  146. </ul>
  147. </div>
  148. </div>
  149. </body>
  150. </html>