<!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>
|
<script src="js/webConfig.js"></script>
|
<style>
|
/* body {
|
padding-left: 50px;
|
padding-right: 50px;
|
font-family: KaiTi;
|
background-color: #031f52;
|
}
|
*/
|
body {
|
padding :0px;
|
font-family: KaiTi;
|
height: 100%;
|
width: 100%;
|
}
|
.bj {
|
background: url(../KanBanUI/img/bj2.jpg) no-repeat center center; /*加载背景图：图片地址 不平铺 */
|
background-size: cover; /*让背景图基于容器大小伸缩 */
|
background-attachment: fixed;
|
height: 100%;
|
width: 100%;
|
position: absolute;
|
}
|
|
/*.box:after {
|
content: "";
|
display: block;
|
position: fixed;
|
top: 0;
|
left: 0;
|
background: url(../KanBanUI/img/bj2.jpg) no-repeat;*/ /*加载背景图：图片地址 不平铺 */
|
/*background-size: cover;*/ /*让背景图基于容器大小伸缩 */
|
/*background-attachment: fixed;
|
background-attachment;*/ /*设置背景图像是否固定或者随着页面的其余部分滚动。*/
|
/* scroll 背景图片随着页面的滚动而滚动，这是默认的。
|
fixed 背景图片不会随着页面的滚动而滚动。
|
local 背景图片会随着元素内容的滚动而滚动。*/
|
|
/*width: 100%;
|
height: 100%;*/
|
/*opacity: 0.1;*/
|
/*z-index: -1;
|
}*/
|
|
.tr0 {
|
height: 80px;
|
/*background-color: aquamarine;*/
|
width: 100%
|
}
|
|
.tr1 {
|
height: 700px;
|
/*background-color: aquamarine;*/
|
width: 100%
|
}
|
|
.col1 {
|
width: 20%;
|
/*background-color: #808080;*/
|
/*background: rgb(0 104 255 / 23%);*/
|
height: 100%;
|
float: left;
|
/*margin-right: 2%;*/
|
/*border: solid 1px #93c1de;*/
|
}
|
|
.col1-1 {
|
width: 100%;
|
height: 7%;
|
/*background-color:#808080;*/
|
/*background: linear-gradient(270deg,#196bcb00,#1391ba);*/
|
line-height: 300%;
|
}
|
|
.col1-1 p {
|
font-size: 30PX;
|
text-align: center;
|
height: 100%;
|
/*padding-left: 5%;*/
|
}
|
|
.col1-2 {
|
width: 100%;
|
height: 93%;
|
font-size:30px;
|
/*background-color: #865454;*/
|
|
}
|
|
.col1-2 p {
|
padding-top: 10px;
|
}
|
|
.col1-2 h2 {
|
text-align: center;
|
}
|
|
.col1-2-j {
|
width: 100%;
|
height: 25%;
|
/*background-color: #865454;*/
|
}
|
|
.col1-2-w {
|
width: 100%;
|
height: 25%;
|
/*background-color: #865454;*/
|
}
|
|
.col1-2-z {
|
width: 100%;
|
height: 25%;
|
/*background-color: #865454;*/
|
}
|
|
.col1-2-d {
|
width: 100%;
|
height: 25%;
|
/*background-color: #865454;*/
|
}
|
|
.col2 {
|
width: 60%;
|
/*background-color: #c3c4c9;*/
|
/*background: rgb(4 70 111 / 82%);*/
|
height: 100%;
|
float: left;
|
}
|
|
.col2-1 {
|
width: 100%;
|
height: 100%;
|
}
|
.col2-1-p {
|
width: 50%;
|
height: 100%;
|
/*background-color: #0d5974;*/
|
margin: 0 auto;
|
line-height: 100%;
|
/*padding:1% 10%;*/
|
}
|
|
.col2-1-p p {
|
font-size: 32px;
|
text-align: center;
|
width: 100%;
|
height: 100%;
|
line-height: 160%;
|
/*background-color: #88ace74d;*/
|
}
|
|
.col2-2 {
|
width: 100%;
|
height: 100%;
|
}
|
|
.col2-2-in {
|
width: 100%;
|
height: 100%;
|
/*background-color: #d6bbbb;*/
|
/*background: url(../KanBanUI/img/bj.png) no-repeat center center;*/
|
/*border: solid 1px #93c1de;*/
|
}
|
|
.col2-2-in-1 {
|
width: 100%;
|
height: 30%;
|
}
|
.col2-2-in-1-l-k {
|
width: 19%;
|
height: 100%;
|
/*background-color: #93a6b7;*/
|
float: left;
|
}
|
.col2-2-in-1-l {
|
width: 14%;
|
height: 100%;
|
/*background-color: #edc4c45e;*/
|
padding-top: 10%;
|
float: left;
|
}
|
|
.col2-2-in-1-l p {
|
text-align: left;
|
height: 10px;
|
}
|
|
.col2-2-in-1-c {
|
width: 15.1%;
|
height: 100%;
|
/*background-color: #ede6c45e;*/
|
padding-top: 10%;
|
float: left;
|
}
|
|
.col2-2-in-1-c p {
|
text-align: left;
|
height: 10px;
|
}
|
|
.col2-2-in-1-r {
|
width: 15.3%;
|
height: 100%;
|
/*background-color: #93a6b79c;*/
|
padding-top: 10%;
|
float: left;
|
}
|
|
.col2-2-in-1-r p {
|
text-align: left;
|
height: 10px;
|
}
|
|
.col2-2-in-1-r2 {
|
width: 15.3%;
|
height: 100%;
|
/*background-color: #3d84c3a8;*/
|
padding-top: 10%;
|
float: left;
|
}
|
|
.col2-2-in-1-r2 p {
|
text-align: left;
|
height: 10px;
|
}
|
|
.col2-2-in-1-r3 {
|
width: 21.3%;
|
height: 100%;
|
/*background-color: #75afe39c;*/
|
padding-top: 10%;
|
float: left;
|
}
|
|
.col2-2-in-1-r3 p {
|
text-align: left;
|
height: 10px;
|
}
|
|
.col2-2-in-2 {
|
width: 100%;
|
height: 10%;
|
/*background-color: #93a6b7;*/
|
}
|
.col2-2-in-2-l-k {
|
width: 14.5%;
|
height: 100%;
|
/*background-color: #93a6b7;*/
|
float: left;
|
}
|
.col2-2-in-2-l {
|
width: 14.5%;
|
height: 100%;
|
/*background-color: #a6b6c496;*/
|
float: left;
|
}
|
|
.col2-2-in-2-l p {
|
text-align: left;
|
font-size: 20px;
|
}
|
|
.col2-2-in-2-c {
|
width: 13.5%;
|
height: 100%;
|
/*background-color: #6aa0d08c;*/
|
/*text-align:right*/
|
float: left;
|
}
|
|
.col2-2-in-2-c p {
|
text-align: left;
|
font-size: 20px;
|
}
|
|
.col2-2-in-2-r {
|
width: 15%;
|
height: 100%;
|
/*background-color: #8393a159;*/
|
/*text-align:right*/
|
float: left;
|
}
|
|
.col2-2-in-2-r p {
|
text-align: left;
|
font-size: 20px;
|
}
|
|
.col2-2-in-2-r2 {
|
width: 15.5%;
|
height: 100%;
|
/*background-color: #a4cef3a1;*/
|
/*text-align:right*/
|
float: left;
|
}
|
|
.col2-2-in-2-r2 p {
|
text-align: left;
|
font-size: 20px;
|
}
|
|
.col2-2-in-2-r3 {
|
width: 27%;
|
height: 100%;
|
/*background-color: #93a6b7;*/
|
/*text-align:right*/
|
float: left;
|
}
|
|
.col2-2-in-2-r3 p {
|
text-align: left;
|
font-size: 20px;
|
}
|
|
.col2-2-in-3 {
|
width: 100%;
|
height: 23%;
|
/*background-color: #93a6b7;*/
|
padding-top: 10%;
|
}
|
|
.col2-2-in-3-l-k {
|
width: 33%;
|
height: 100%;
|
/*background-color: #93a6b7;*/
|
float: left;
|
}
|
.col2-2-in-3-l {
|
width: 20.5%;
|
height: 100%;
|
/*background-color: #8ba7c036;*/
|
float: left;
|
}
|
|
.col2-2-in-3-l p {
|
text-align: left;
|
height: 10px;
|
/*font-size: 20px;*/
|
}
|
|
.col2-2-in-3-r {
|
width: 20%;
|
height: 100%;
|
/*background-color: #93a6b7;*/
|
float: left;
|
}
|
|
.col2-2-in-3-r p {
|
text-align: left;
|
height: 10px;
|
/*font-size: 20px;*/
|
}
|
|
.col2-2-in-3-r2 {
|
width: 26.5%;
|
height: 100%;
|
/*background-color: #93a6b7;*/
|
float: left;
|
}
|
|
.col2-2-in-3-r2 p {
|
text-align: left;
|
height: 10px;
|
/*font-size: 20px;*/
|
}
|
|
.col2-2-in-4 {
|
width: 100%;
|
height: 6%;
|
/*background-color: #93a6b7;*/
|
}
|
.col2-2-in-4-l-k {
|
width: 17.5%;
|
height: 100%;
|
/*background-color: #93a6b7;*/
|
float: left;
|
}
|
.col2-2-in-4-l {
|
width: 21.5%;
|
height: 100%;
|
/*background-color: #93a6b75c;*/
|
float: left;
|
}
|
|
.col2-2-in-4-l p {
|
text-align: left;
|
font-size: 20px;
|
}
|
|
.col2-2-in-4-c {
|
width: 20%;
|
height: 100%;
|
/*background-color: #8ec2f1a8;*/
|
/*text-align:right*/
|
float: left;
|
}
|
|
.col2-2-in-4-c p {
|
text-align: left;
|
font-size: 20px;
|
}
|
|
.col2-2-in-4-r {
|
width: 19%;
|
height: 100%;
|
/*background-color: #3174af5c;*/
|
/*text-align:right*/
|
float: left;
|
}
|
|
.col2-2-in-4-r p {
|
text-align: left;
|
font-size: 20px;
|
}
|
|
.col2-2-in-4-r2 {
|
width: 22%;
|
height: 100%;
|
/*background-color: #93a6b780;*/
|
/*text-align:right*/
|
float: left;
|
}
|
|
.col2-2-in-4-r2 p {
|
text-align: left;
|
font-size: 20px;
|
}
|
.col2-2-in-56-k {
|
width: 100%;
|
height: 5%;
|
/*background-color: #73978c94;*/
|
}
|
.col2-2-in-56-kk {
|
width: 27.5%;
|
height: 100%;
|
/*background-color: #93a6b7;*/
|
float: left;
|
}
|
.col2-2-in-5-lc {
|
width: 21.5%;
|
height: 100%;
|
/*background-color: #7ebef875;*/
|
/*padding-top: 2%;*/
|
float: left;
|
}
|
|
.col2-2-in-5-lc p {
|
text-align: left;
|
height: 10px;
|
font-size: 20px;
|
}
|
.col2-2-in-5-cr {
|
width: 19.5%;
|
height: 100%;
|
/*background-color: #93a6b7;*/
|
/*padding-top: 2%;*/
|
float: left;
|
}
|
|
.col2-2-in-5-cr p {
|
text-align: left;
|
font-size: 20px;
|
}
|
.col2-2-in-5-rr2 {
|
width: 31.5%;
|
height: 100%;
|
/*background-color: #93a6b7;*/
|
/*padding-top: 2%;*/
|
float: left;
|
}
|
|
.col2-2-in-5-rr2 p {
|
text-align: left;
|
font-size: 20px;
|
}
|
|
.col2-2-in-5 {
|
width: 100%;
|
height: 20%;
|
/*background-color: #93a6b7;*/
|
/*padding-bottom:2%;*/
|
}
|
.col2-2-in-5-l-k {
|
width: 9%;
|
height: 100%;
|
/*background-color: #72aad64a;*/
|
float: left;
|
}
|
|
.col2-2-in-5-l {
|
width: 20.5%;
|
height: 100%;
|
/*background-color: #2b353d4a;*/
|
padding-top: 2%;
|
float: left;
|
}
|
|
.col2-2-in-5-l p {
|
text-align: left;
|
height: 10px;
|
/*font-size: 20px;*/
|
}
|
|
|
|
.col2-2-in-5-c {
|
width: 19.5%;
|
height: 100%;
|
/*background-color: #72aad64a;*/
|
padding-top: 2%;
|
float: left;
|
}
|
|
.col2-2-in-5-c p {
|
text-align: left;
|
height: 10px;
|
}
|
|
|
.col2-2-in-5-r {
|
width: 19.5%;
|
height: 100%;
|
/*background-color: #2b353d4a;*/
|
padding-top: 2%;
|
float: left;
|
}
|
|
.col2-2-in-5-r p {
|
text-align: left;
|
height: 10px;
|
/*font-size: 20px;*/
|
}
|
|
.col2-2-in-5-r2 {
|
width: 31.5%;
|
height: 100%;
|
/*background-color: #72aad64a;*/
|
padding-top: 2%;
|
float: left;
|
}
|
|
.col2-2-in-5-r2 p {
|
text-align: left;
|
height: 10px;
|
/*background-color: #93a6b7;*/
|
}
|
|
.col3 {
|
width: 20%;
|
/*background: rgb(0 104 255 / 23%);*/
|
height: 100%;
|
float: left;
|
/*border: solid 1px #93c1de;*/
|
}
|
|
.col3-1 {
|
width: 100%;
|
height: 7%;
|
/*background: linear-gradient(270deg,#196bcb00,#1391ba);*/
|
line-height: 300%;
|
}
|
|
.col3-1 p {
|
font-size: 30px;
|
text-align: center;
|
height: 100%;
|
/*padding-left: 5%;*/
|
}
|
|
.col3-2 {
|
width: 100%;
|
height: 93%;
|
font-size:20px;
|
/*background-color: #865454;*/
|
}
|
|
.col3-2 p {
|
padding-top: 10px;
|
}
|
|
.col3-2 h2 {
|
text-align: center;
|
}
|
|
.col3-2-j {
|
width: 100%;
|
height: 20%;
|
/*background-color: #865454;*/
|
}
|
|
.col3-2-w {
|
width: 100%;
|
height: 20%;
|
/*background-color: #865454;*/
|
}
|
|
.col3-2-z {
|
width: 100%;
|
height: 20%;
|
/*background-color: #865454;*/
|
}
|
|
.col3-2-d {
|
width: 100%;
|
height: 20%;
|
/*background-color: #865454;*/
|
}
|
|
.col3-2-t {
|
width: 100%;
|
height: 20%;
|
/*background-color: #865454;*/
|
}
|
|
.tr2 {
|
height: 300px;
|
/*background-color: #e0dddd;*/
|
width: 100%;
|
padding-top: 1%;
|
}
|
.tr2-1-k {
|
width: 1%;
|
height: 100%;
|
float: left;
|
}
|
|
.tr2-1 {
|
width: 23%;
|
height: 100%;
|
/*background: rgb(0 104 255 / 23%);*/
|
float: left;
|
/*border: solid 1px #93c1de;*/
|
}
|
|
.tr2-1-on {
|
width: 100%;
|
height: 15%;
|
/*background: linear-gradient(270deg,#196bcb00,#1391ba);*/
|
}
|
|
.tr2-1-on p {
|
line-height:250%;
|
text-align: left;
|
padding-left: 9%;
|
font-size: 20px;
|
}
|
|
.tr2-1-in {
|
width: 100%;
|
height: 85%;
|
/*background-color: #c7c5db;*/
|
}
|
|
.tr2-2 {
|
width: 23%;
|
height: 100%;
|
/*background: rgb(0 104 255 / 23%);*/
|
float: left;
|
margin-left: 2%;
|
/*border: solid 1px #93c1de;*/
|
}
|
|
.tr2-3 {
|
width: 23%;
|
height: 100%;
|
/*background: rgb(0 104 255 / 23%);*/
|
float: left;
|
margin-left: 2.5%;
|
/*border: solid 1px #93c1de;*/
|
}
|
|
.tr2-4 {
|
width: 23%;
|
height: 100%;
|
/*background: rgb(0 104 255 / 23%);*/
|
float: left;
|
margin-left: 1%;
|
/*border: solid 1px #93c1de;*/
|
}
|
|
.clock {
|
font-family: 'BebasNeueRegular', Arial, Helvetica, sans-serif;
|
font-size: 20px;
|
float: right;
|
margin-top: -44px;
|
margin-right: 5px;
|
}
|
|
.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;
|
}
|
|
#jh, #wc, #zz, #dd, #rc, #hzsh, #hzyh, #hzeh, #tz {
|
color: #21d5dc
|
}
|
</style>
|
<script type="text/javascript">
|
$(document).ready(function () {
|
// 创建两个变量，一个数组中的月和日的名称
|
var monthNames = ["01", "02", "03", "04", "05", "06", "07", "08", "09", "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();
|
|
|
$('#Date').html(year + "-" + monthNames[month] + '-' + (day < 10 ? "0" + day : day) + " ");
|
$("#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'));
|
var mychart4 = echarts.init(document.getElementById('mychart4'));
|
|
Chart(mychart1, mychart2, mychart3, mychart4);
|
|
setInterval(function () {
|
Chart(mychart1, mychart2, mychart3, mychart4);
|
}, 60000);
|
|
|
|
//根据窗口的大小变动图表 --- 重点
|
window.onresize = function () {
|
mychart1.resize();
|
mychart2.resize();
|
mychart3.resize();
|
mychart4.resize();
|
}
|
|
});
|
var PubRes = [];
|
|
|
|
function Chart(mychart1, mychart2, mychart3, mychart4) {
|
//所有工序在制 生产数量
|
get_Proc();
|
//当前状态
|
get_CurrentState();
|
//折线图
|
get_LineChart(mychart1, mychart3);
|
//柱状图
|
get_Histogram(mychart2);
|
//仪表盘
|
get_Dashboard(mychart4);
|
}
|
|
//当前状态
|
function get_CurrentState() {
|
$.ajax({
|
url: GetWEBURL() + "/loaddata/get_CurrentState",
|
dataType: "JSON",
|
async: false,//使用同步的方式,true为异步方式
|
type: "Get",
|
data: { "LineCode": "1" },
|
success: function (res) {
|
var HQty = 0.0;
|
for (var i = 0; i < PubRes.data[0].length; i++) {
|
HQty += PubRes.data[0][i].InHQty;
|
}
|
$("#jh").text(res.data[0][0]["HQty"].toLocaleString());
|
$("#wc").text(res.data[1][0]["HQty"].toLocaleString());
|
$("#zz").text(HQty.toLocaleString());
|
$("#dd").text(res.data[2][0]["HQty"].toLocaleString());
|
}
|
})
|
}
|
|
//工序数量
|
function get_Proc() {
|
$.ajax({
|
url: GetWEBURL() + "/loaddata/KB_ProcSum",
|
dataType: "JSON",
|
async: false,//使用同步的方式,true为异步方式
|
type: "Get",
|
data: { "LineCode": "1" },
|
success: function (res) {
|
PubRes = res;
|
for (var i = 0; i < res.data[0].length; i++) {
|
if (res.data[0][i].HProcID == 191) {//缸厂
|
//$("#zzp1_2").text("在制品: " + res.data[0][i].InHQty.toLocaleString());
|
$("#cps_2").text("产品数: " + res.data[0][i].OutHQty.toLocaleString());
|
} else
|
if (res.data[0][i].HProcID == 193) {//烘干定型
|
$("#zzp1_3").text("在制品: " + res.data[0][i].InHQty.toLocaleString());
|
$("#cps_3").text("产品数: " + res.data[0][i].OutHQty.toLocaleString());
|
}
|
else if (res.data[0][i].HProcID == 194) {//上浆定型
|
$("#zzp1_4").text("在制品: " + res.data[0][i].InHQty.toLocaleString());
|
$("#cps_4").text("产品数: " + res.data[0][i].OutHQty.toLocaleString());
|
}
|
else if (res.data[0][i].HProcID == 198) {//色坯烫光
|
$("#zzp1_5").text("在制品: " + res.data[0][i].InHQty.toLocaleString());
|
$("#cps_5").text("产品数: " + res.data[0][i].OutHQty.toLocaleString());
|
}
|
else if (res.data[0][i].HProcID == 204) {//预烫剪
|
$("#zzp1_6").text("在制品: " + res.data[0][i].InHQty.toLocaleString());
|
$("#cps_6").text("产品数: " + res.data[0][i].OutHQty.toLocaleString());
|
}
|
else if (res.data[0][i].HProcID == 197) {//补刷
|
$("#zzp1_7").text("在制品: " + res.data[0][i].InHQty.toLocaleString());
|
$("#cps_7").text("产品数: " + res.data[0][i].OutHQty.toLocaleString());
|
}
|
else if (res.data[0][i].HProcID == 201) {//印毛尖
|
$("#zzp1_8").text("在制品: " + res.data[0][i].InHQty.toLocaleString());
|
$("#cps_8").text("产品数: " + res.data[0][i].OutHQty.toLocaleString());
|
}
|
else if (res.data[0][i].HProcID == 200) {//拉幅定型
|
$("#zzp1_9").text("在制品: " + res.data[0][i].InHQty.toLocaleString());
|
$("#cps_9").text("产品数: " + res.data[0][i].OutHQty.toLocaleString());
|
}
|
else if (res.data[0][i].HProcID == 206) {//短线烫
|
$("#zzp1_10").text("在制品: " + res.data[0][i].InHQty.toLocaleString());
|
$("#cps_10").text("产品数: " + res.data[0][i].OutHQty.toLocaleString());
|
}
|
else if (res.data[0][i].HProcID == 205) {//长线烫
|
$("#zzp1_11").text("在制品: " + res.data[0][i].InHQty.toLocaleString());
|
$("#cps_11").text("产品数: " + res.data[0][i].OutHQty.toLocaleString());
|
$("#zzp1_12").text("在制品: " + res.data[0][i].InHQty.toLocaleString());//打包入库
|
}
|
}
|
//打包入库
|
$("#cps_12").text("产品数: " + res.data[1][0].HQty.toLocaleString());
|
//染厂在制数量
|
$("#zzp1_2").text("在制品: " + (res.data[2].length == 0 ? 0 : res.data[2][0].HQty.toLocaleString()));
|
}
|
})
|
}
|
|
//折线图
|
function get_LineChart(mychart1, mychart3) {
|
|
//生产效率
|
var res = PubRes;
|
var optionData = [0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0];
|
for (var i = 0; i < res.data[0].length; i++) {
|
if (res.data[0][i].HProcID == 191) {//缸厂
|
optionData[0] = (res.data[0][i].OutHQty / 1000).toFixed(2);
|
} else if (res.data[0][i].HProcID == 193) {//烘干定型
|
optionData[1] = (res.data[0][i].OutHQty / 1000).toFixed(2);
|
}
|
else if (res.data[0][i].HProcID == 194) {//上浆定型
|
optionData[2] = (res.data[0][i].OutHQty / 1000).toFixed(2);
|
}
|
else if (res.data[0][i].HProcID == 198) {//色坯烫光
|
optionData[3] = (res.data[0][i].OutHQty / 1000).toFixed(2);
|
}
|
else if (res.data[0][i].HProcID == 204) {//预烫剪
|
optionData[4] = (res.data[0][i].OutHQty / 1000).toFixed(2);
|
}
|
else if (res.data[0][i].HProcID == 197) {//补刷
|
optionData[5] = (res.data[0][i].OutHQty / 1000).toFixed(2);
|
}
|
else if (res.data[0][i].HProcID == 201) {//印毛尖
|
optionData[6] = (res.data[0][i].OutHQty / 1000).toFixed(2);
|
}
|
else if (res.data[0][i].HProcID == 200) {//拉幅定型
|
optionData[7] = (res.data[0][i].OutHQty / 1000).toFixed(2);
|
}
|
else if (res.data[0][i].HProcID == 206) {//短线烫
|
optionData[8] = (res.data[0][i].OutHQty / 1000).toFixed(2);
|
}
|
else if (res.data[0][i].HProcID == 205) {//长线烫
|
optionData[9] = (res.data[0][i].OutHQty / 1000).toFixed(2);
|
}
|
}
|
//打包入库
|
optionData[10] = (res.data[1][0].HQty / 1000).toFixed(2);
|
|
var option = {
|
xAxis: {
|
type: 'category',
|
boundaryGap: false,
|
data: ['缸染', '烘干定型', '上浆定型', '色坯烫光', '预烫剪', '补刷', '印毛尖', '拉幅定型', '短线烫', '长线烫', '打包入库']
|
},
|
yAxis: {
|
type: 'value'
|
},
|
legend: {
|
orient: 'vertical',
|
data: ['12', '43'],//设置线条的名字
|
right: 0,
|
top: 15,
|
textStyle: {
|
color: '#35d1ed' //设置字体颜色
|
}
|
},
|
axisLabel: {
|
show: true,
|
interval: 0,
|
color: '#35d1ed',
|
formatter: function (value) {
|
var ret = "";//拼接加\n返回的类目项
|
var maxLength = 1;//每项显示文字个数
|
var valLength = value.length;//X轴类目项的文字个数
|
var rowN = Math.ceil(valLength / maxLength); //类目项需要换行的行数
|
if (rowN > 1)//如果类目项的文字大于3,
|
{
|
for (var i = 0; i < rowN; i++) {
|
var temp = "";//每次截取的字符串
|
var start = i * maxLength;//开始截取的位置
|
var end = start + maxLength;//结束截取的位置
|
//这里也可以加一个是否是最后一行的判断，但是不加也没有影响，那就不加吧
|
temp = value.substring(start, end) + "\n";
|
ret += temp; //凭借最终的字符串
|
}
|
return ret;
|
}
|
else {
|
return value;
|
}
|
}
|
},
|
series: [
|
{
|
name: '12',//与legend对应
|
data: optionData,
|
type: 'line',
|
label: {
|
normal: {
|
show: true,
|
position: 'top',
|
formatter: function (params) {
|
return echarts.format.addCommas(params.value);
|
}
|
}
|
},
|
smooth: true,//smooth属性默认是false false就是直线 true就是曲线
|
lineStyle: {
|
color: '#44E2F0'
|
}
|
, itemStyle: {
|
// 设置线条上点的颜色（和图例的颜色）
|
normal: {
|
color: '#44E2F0',
|
label: {
|
show: true // 在折线拐点上显示数据
|
}
|
},
|
}, areaStyle: {}
|
},
|
{
|
name: '43',
|
data: [10, 10, 10, 10, 10, 10, 10, 10],
|
type: 'line',
|
smooth: true,//smooth属性默认是false false就是直线 true就是曲线
|
lineStyle: {
|
color: '#90f083'
|
}
|
, itemStyle: {
|
// 设置线条上点的颜色（和图例的颜色）
|
normal: {
|
color: '#90f083',
|
label: {
|
show: true // 在折线拐点上显示数据
|
}
|
},
|
}, areaStyle: {}
|
}
|
]
|
};
|
|
|
//生产产量
|
var dateData = [];
|
var OptionData = [];
|
$.ajax({
|
url: GetWEBURL() + "/loaddata/ProductionOutput",
|
dataType: "JSON",
|
async: false,//使用同步的方式,true为异步方式
|
type: "Get",
|
data: { "LineCode": "1" },
|
success: function (res) {
|
for (var i = 0; i < res.data[0].length; i++) {
|
dateData.push(res.data[0][i]["HDate"]);
|
OptionData.push((res.data[0][i]["HQty"] / 1000).toFixed(2));
|
}
|
}
|
})
|
|
var option2 = {
|
xAxis: {
|
type: 'category',
|
boundaryGap: false,
|
data: dateData
|
},
|
yAxis: {
|
type: 'value'
|
},
|
legend: {
|
orient: 'vertical',
|
data: ['千米'],//设置线条的名字
|
right: 0,
|
top: 15,
|
textStyle: {
|
color: '#35d1ed' //设置字体颜色
|
}
|
},
|
axisLabel: {
|
show: true,
|
interval: 0,
|
color: '#35d1ed',
|
formatter: function (value) {
|
var ret = "";//拼接加\n返回的类目项
|
var maxLength = 2;//每项显示文字个数
|
var valLength = value.length;//X轴类目项的文字个数
|
var rowN = Math.ceil(valLength / maxLength); //类目项需要换行的行数
|
if (rowN > 1)//如果类目项的文字大于3,
|
{
|
for (var i = 0; i < rowN; i++) {
|
var temp = "";//每次截取的字符串
|
var start = i * maxLength;//开始截取的位置
|
var end = start + maxLength;//结束截取的位置
|
//这里也可以加一个是否是最后一行的判断，但是不加也没有影响，那就不加吧
|
if (value[i + 1] == "/") {
|
temp = value.substring(i + 1, i + 2) + "\n" + value.substring(i + 2, valLength);
|
ret += temp;
|
return ret;
|
} else {
|
temp = value.substring(start, end) + "\n";
|
}
|
ret += temp; //凭借最终的字符串
|
}
|
return ret;
|
}
|
else {
|
return value;
|
}
|
}
|
},
|
series: [
|
{
|
name: '千米',//与legend对应
|
data: OptionData,
|
type: 'line',
|
label: {
|
normal: {
|
show: true,
|
position: 'top',
|
formatter: function (params) {
|
return echarts.format.addCommas(params.value);
|
}
|
}
|
},
|
smooth: true,//smooth属性默认是false false就是直线 true就是曲线
|
lineStyle: {
|
color: '#44E2F0' //线条颜色
|
}
|
, itemStyle: {
|
// 设置线条上点的颜色（和图例的颜色）
|
normal: {
|
color: '#44E2F0',
|
label: {
|
show: true // 在折线拐点上显示数据
|
}
|
},
|
}
|
}
|
]
|
};
|
mychart1.setOption(option);
|
mychart3.setOption(option2);
|
}
|
|
//柱状图
|
function get_Histogram(mychart2) {
|
|
//生产负荷
|
var optionData = [0, 0, 0, 0, 0, 0, 0, 0, 0, 0];
|
|
$.ajax({
|
url: GetWEBURL() + "/loaddata/KB_scfh",
|
dataType: "JSON",
|
async: false,//使用同步的方式,true为异步方式
|
type: "Get",
|
data: { "LineCode": "1" },
|
success: function (res) {
|
|
for (var i = 0; i < res.data[0].length; i++) {
|
if (res.data[0][i].HProcID == 191) {//缸厂
|
optionData[0] = (res.data[0][i].HQty / 1000).toFixed(2);
|
} else if (res.data[0][i].HProcID == 193) {//烘干定型
|
optionData[1] = (res.data[0][i].HQty / 1000).toFixed(2);
|
}
|
else if (res.data[0][i].HProcID == 194) {//上浆定型
|
optionData[2] = (res.data[0][i].HQty / 1000).toFixed(2);
|
}
|
else if (res.data[0][i].HProcID == 198) {//色坯烫光
|
optionData[3] = (res.data[0][i].HQty / 1000).toFixed(2);
|
}
|
else if (res.data[0][i].HProcID == 204) {//预烫剪
|
optionData[4] = (res.data[0][i].HQty / 1000).toFixed(2);
|
}
|
else if (res.data[0][i].HProcID == 197) {//补刷
|
optionData[5] = (res.data[0][i].HQty / 1000).toFixed(2);
|
}
|
else if (res.data[0][i].HProcID == 201) {//印毛尖
|
optionData[6] = (res.data[0][i].HQty / 1000).toFixed(2);
|
}
|
else if (res.data[0][i].HProcID == 200) {//拉幅定型
|
optionData[7] = (res.data[0][i].HQty / 1000).toFixed(2);
|
}
|
else if (res.data[0][i].HProcID == 206) {//短线烫
|
optionData[8] = (res.data[0][i].HQty / 1000).toFixed(2);
|
}
|
else if (res.data[0][i].HProcID == 205) {//长线烫
|
optionData[9] = (res.data[0][i].HQty / 1000).toFixed(2);
|
}
|
}
|
}
|
})
|
|
var option = {
|
xAxis: {
|
type: 'category',
|
data: ['缸染', '烘干定型', '上浆定型', '色坯烫光', '预烫剪', '补刷', '印毛尖', '拉幅定型', '短线烫', '长线烫']
|
},
|
yAxis: {
|
type: 'value'
|
},
|
axisLabel: {
|
show: true,
|
interval: 0,
|
color: '#35d1ed',
|
formatter: function (value) {
|
var ret = "";//拼接加\n返回的类目项
|
var maxLength = 1;//每项显示文字个数
|
var valLength = value.length;//X轴类目项的文字个数
|
var rowN = Math.ceil(valLength / maxLength); //类目项需要换行的行数
|
if (rowN > 1)//如果类目项的文字大于3,
|
{
|
for (var i = 0; i < rowN; i++) {
|
var temp = "";//每次截取的字符串
|
var start = i * maxLength;//开始截取的位置
|
var end = start + maxLength;//结束截取的位置
|
//这里也可以加一个是否是最后一行的判断，但是不加也没有影响，那就不加吧
|
temp = value.substring(start, end) + "\n";
|
ret += temp; //凭借最终的字符串
|
}
|
return ret;
|
}
|
else {
|
return value;
|
}
|
}
|
},
|
series: [
|
{
|
data: optionData,
|
type: 'bar',
|
label: {
|
normal: {
|
show: true,
|
position: 'top',
|
formatter: function (params) {
|
return echarts.format.addCommas(params.value);
|
}
|
}
|
}
|
, itemStyle: {
|
// 设置柱形的颜色
|
normal: {
|
//color: '#44E2F0',
|
label: {
|
show: true // 在折线拐点上显示数据
|
}
|
},
|
}
|
}
|
]
|
};
|
mychart2.setOption(option);
|
}
|
|
//仪表盘
|
function get_Dashboard(mychart4) {
|
var hgl = 0;
|
var zcl = 0;
|
//制成率
|
$.ajax({
|
url: GetWEBURL() + "/loaddata/Dashboard",
|
dataType: "JSON",
|
async: false,//使用同步的方式,true为异步方式
|
type: "Get",
|
data: { "LineCode": "1" },
|
success: function (res) {
|
hgl = res.data[0][0]["合格率"].toFixed(2);
|
zcl = res.data[1][0]["制成率"].toFixed(2);
|
}
|
})
|
|
var option = {
|
series: [
|
{//左边仪表盘
|
// name: '业务指标',
|
type: 'gauge',
|
detail: {
|
formatter: '{value}%',
|
//offsetCenter: ['10', '70%'], //相对于仪表盘中心的偏移位置，数组第一项是水平方向的偏移，第二项是垂直方向的偏移。可以是绝对的数值，也可以是相对于仪表盘半径的百分比
|
fontSize: 22, //文字的字体大小
|
offsetCenter: ['20%', '100%']
|
},
|
radius: "60%", // 参数:number, string。 仪表盘半径,默认 75% ，可以是相对于容器高宽中较小的一项的一半的百分比，也可以是绝对的数值。
|
center: ["25%", "60%"],
|
startAngle: 235,
|
endAngle: 25,
|
clockWise: true,
|
min: 0,
|
max: 100,
|
splitNumber: 10, // 仪表盘刻度的分割段数,默认 10。
|
axisTick: { // 刻度(线)样式。
|
show: true, // 是否显示刻度(线),默认 true。
|
splitNumber: 5, // 分隔线之间分割的刻度数,默认 5。
|
length: 15, // 刻度线长。支持相对半径的百分比,默认 8。
|
lineStyle: { // 刻度线样式。
|
color: "auto", //线的颜色,默认 #eee。
|
opacity: 1, //图形透明度。支持从 0 到 1 的数字，为 0 时不绘制该图形。
|
width: 1, //线度,默认 1。
|
type: "solid", //线的类型,默认 solid。 此外还有 dashed,dotted
|
// shadowBlur: 10, //(发光效果)图形阴影的模糊大小。该属性配合 shadowColor,shadowOffsetX, shadowOffsetY 一起设置图形的阴影效果。
|
// shadowColor: "#fff", //阴影颜色。支持的格式同color。
|
},
|
},
|
axisLine: { // 仪表盘轴线(轮廓线)相关配置。
|
show: true, // 是否显示仪表盘轴线(轮廓线),默认 true。
|
lineStyle: { // 仪表盘轴线样式。
|
// color: colorTemplate1, //仪表盘的轴线可以被分成不同颜色的多段。每段的 结束位置(范围是[0,1]) 和 颜色 可以通过一个数组来表示。默认取值：[[0.2, '#91c7ae'], [0.8, '#63869e'], [1, '#c23531']]
|
// opacity: 1, //图形透明度。支持从 0 到 1 的数字，为 0 时不绘制该图形。
|
width: 10, //轴线宽度,默认 30。
|
// shadowBlur: 20, //(发光效果)图形阴影的模糊大小。该属性配合 shadowColor,shadowOffsetX, shadowOffsetY 一起设置图形的阴影效果。
|
// shadowColor: "#fff", //阴影颜色。支持的格式同color。
|
}
|
},
|
splitLine: { // 分隔线样式。
|
show: true, // 是否显示分隔线,默认 true。
|
length: 15, // 分隔线线长。支持相对半径的百分比,默认 30。
|
lineStyle: { // 分隔线样式。
|
color: "auto", //线的颜色,默认 #eee。
|
opacity: 1, //图形透明度。支持从 0 到 1 的数字，为 0 时不绘制该图形。
|
width: 2, //线度,默认 2。
|
type: "solid", //线的类型,默认 solid。 此外还有 dashed,dotted
|
// shadowBlur: 10, //(发光效果)图形阴影的模糊大小。该属性配合 shadowColor,shadowOffsetX, shadowOffsetY 一起设置图形的阴影效果。
|
// shadowColor: "#fff", //阴影颜色。支持的格式同color。
|
}
|
},
|
title: {
|
fontSize: 20,
|
color: '#55bcd5',//标题颜色
|
offsetCenter: ['20%', '60%']//设置完成率位置
|
},
|
data: [{
|
value: zcl,
|
name: '制成率',
|
}],
|
|
},
|
{//右仪表盘
|
// name: '业务指标',
|
type: 'gauge',
|
detail: {
|
formatter: '{value}%',
|
offsetCenter: ['10%', '90%']
|
},
|
radius: "80%", // 参数:number, string。 仪表盘半径,默认 75% ，可以是相对于容器高宽中较小的一项的一半的百分比，也可以是绝对的数值。
|
center: ["70%", "55%"],
|
startAngle: 225,//仪表盘起始角度。正右手侧为0度，正上方为90度，正左手侧为180度。
|
endAngle: -45,//仪表盘结束角度
|
clockWise: true,
|
min: 0,
|
max: 100,
|
splitNumber: 10, // 仪表盘刻度的分割段数,默认 10。
|
axisTick: { // 刻度(线)样式。
|
show: true, // 是否显示刻度(线),默认 true。
|
splitNumber: 5, // 分隔线之间分割的刻度数,默认 5。
|
length: 15, // 刻度线长。支持相对半径的百分比,默认 8。
|
lineStyle: { // 刻度线样式。
|
color: "auto", //线的颜色,默认 #eee。
|
opacity: 1, //图形透明度。支持从 0 到 1 的数字，为 0 时不绘制该图形。
|
width: 1, //线度,默认 1。
|
type: "solid", //线的类型,默认 solid。 此外还有 dashed,dotted
|
// shadowBlur: 10, //(发光效果)图形阴影的模糊大小。该属性配合 shadowColor,shadowOffsetX, shadowOffsetY 一起设置图形的阴影效果。
|
// shadowColor: "#fff", //阴影颜色。支持的格式同color。
|
},
|
},
|
axisLine: { // 仪表盘轴线(轮廓线)相关配置。
|
show: true, // 是否显示仪表盘轴线(轮廓线),默认 true。
|
lineStyle: { // 仪表盘轴线样式。
|
// color: colorTemplate1, //仪表盘的轴线可以被分成不同颜色的多段。每段的 结束位置(范围是[0,1]) 和 颜色 可以通过一个数组来表示。默认取值：[[0.2, '#91c7ae'], [0.8, '#63869e'], [1, '#c23531']]
|
// opacity: 1, //图形透明度。支持从 0 到 1 的数字，为 0 时不绘制该图形。
|
width: 10, //轴线宽度,默认 30。
|
// shadowBlur: 20, //(发光效果)图形阴影的模糊大小。该属性配合 shadowColor,shadowOffsetX, shadowOffsetY 一起设置图形的阴影效果。
|
// shadowColor: "#fff", //阴影颜色。支持的格式同color。
|
}
|
},
|
splitLine: { // 分隔线样式。
|
show: true, // 是否显示分隔线,默认 true。
|
length: 15, // 分隔线线长。支持相对半径的百分比,默认 30。
|
lineStyle: { // 分隔线样式。
|
color: "auto", //线的颜色,默认 #eee。
|
opacity: 1, //图形透明度。支持从 0 到 1 的数字，为 0 时不绘制该图形。
|
width: 2, //线度,默认 2。
|
type: "solid", //线的类型,默认 solid。 此外还有 dashed,dotted
|
// shadowBlur: 10, //(发光效果)图形阴影的模糊大小。该属性配合 shadowColor,shadowOffsetX, shadowOffsetY 一起设置图形的阴影效果。
|
// shadowColor: "#fff", //阴影颜色。支持的格式同color。
|
}
|
},
|
title: {
|
fontSize: 20,
|
color: '#55bcd5',//标题颜色
|
offsetCenter: ['0', '60%']//设置完成率位置
|
},
|
data: [{
|
value: hgl,
|
name: '合格率',
|
}]
|
}
|
]
|
|
};
|
|
// 使用刚指定的配置项和数据显示图表。
|
mychart4.setOption(option);
|
}
|
|
</script>
|
</head>
|
<body class="box">
|
<div class="bj">
|
<div class="tr0">
|
<div class="col2-1">
|
<div class="col2-1-p">
|
<p>宁波科艺绿色皮草集团有限公司</p>
|
</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>
|
</div>
|
<div class="tr1">
|
<div class="col1">
|
<div class="col1-1">
|
<p>
|
当前状态
|
</p>
|
</div>
|
<div class="col1-2">
|
<div class="col1-2-j">
|
<p>计划数量</p>
|
<h2><label id="jh">0</label> </h2>
|
</div>
|
<div class="col1-2-w">
|
<p>完成数量</p>
|
<h2><label id="wc">0</label></h2>
|
</div>
|
<div class="col1-2-z">
|
<p>在制数量</p>
|
<h2><label id="zz">0</label></h2>
|
</div>
|
<div class="col1-2-d">
|
<p>等待生产</p>
|
<h2><label id="dd">0</label></h2>
|
</div>
|
</div>
|
</div>
|
<div class="col2">
|
<div class="col2-2">
|
<div class="col2-2-on">
|
</div>
|
<div class="col2-2-in">
|
<div class="col2-2-in-1">
|
<div class="col2-2-in-1-l-k">
|
</div>
|
<div class="col2-2-in-1-l">
|
<p id="zzp1_1">在制品:0</p>
|
<p id="cps_1">产品数:0</p>
|
</div>
|
<div class="col2-2-in-1-c">
|
<p id="zzp1_2">在制品:0</p>
|
<p id="cps_2">产品数:0</p>
|
</div>
|
<div class="col2-2-in-1-r">
|
<p id="zzp1_3">在制品:0</p>
|
<p id="cps_3">产品数:0</p>
|
</div>
|
<div class="col2-2-in-1-r2">
|
<p id="zzp1_4">在制品:0</p>
|
<p id="cps_4">产品数:0</p>
|
</div>
|
<div class="col2-2-in-1-r3">
|
<p id="zzp1_5">在制品:0</p>
|
<p id="cps_5">产品数:0</p>
|
</div>
|
</div>
|
<div class="col2-2-in-2">
|
<div class="col2-2-in-2-l-k">
|
</div>
|
<div class="col2-2-in-2-l">
|
<p>织造</p>
|
</div>
|
<div class="col2-2-in-2-c">
|
<p>缸染</p>
|
</div>
|
<div class="col2-2-in-2-r">
|
<p>
|
烘干定型
|
</p>
|
</div>
|
<div class="col2-2-in-2-r2">
|
<p>
|
上浆定型
|
</p>
|
</div>
|
<div class="col2-2-in-2-r3">
|
<p>
|
色坯烫光
|
</p>
|
</div>
|
</div>
|
<div class="col2-2-in-3">
|
<div class="col2-2-in-3-l-k">
|
</div>
|
<div class="col2-2-in-3-l">
|
<p id="zzp1_6">在制品:0</p>
|
<p id="cps_6">产品数:0</p>
|
</div>
|
<div class="col2-2-in-3-r">
|
<p id="zzp1_7">在制品:0</p>
|
<p id="cps_7">产品数:0</p>
|
</div>
|
<div class="col2-2-in-3-r2">
|
<p id="zzp1_8">在制品:0</p>
|
<p id="cps_8">产品数:0</p>
|
</div>
|
</div>
|
<div class="col2-2-in-4">
|
<div class="col2-2-in-4-l-k">
|
</div>
|
<div class="col2-2-in-4-l">
|
<p>
|
拉幅定型
|
</p>
|
</div>
|
<div class="col2-2-in-4-c">
|
<p>
|
短线烫
|
</p>
|
</div>
|
<div class="col2-2-in-4-r">
|
<p>
|
长线烫
|
</p>
|
</div>
|
<div class="col2-2-in-4-r2">
|
<p>
|
打包入库
|
</p>
|
</div>
|
</div>
|
<div class="col2-2-in-56-k">
|
<div class="col2-2-in-56-kk">
|
</div>
|
<div class="col2-2-in-5-lc">
|
<p>
|
预烫剪
|
</p>
|
</div>
|
|
<div class="col2-2-in-5-cr">
|
<p>补刷</p>
|
</div>
|
|
<div class="col2-2-in-5-rr2">
|
<p>
|
印毛尖
|
</p>
|
</div>
|
</div>
|
<div class="col2-2-in-5">
|
<div class="col2-2-in-5-l-k">
|
</div>
|
<div class="col2-2-in-5-l">
|
<p id="zzp1_9">在制品:0</p>
|
<p id="cps_9">产品数:0</p>
|
</div>
|
|
<div class="col2-2-in-5-c">
|
<p id="zzp1_10">在制品:0</p>
|
<p id="cps_10">产品数:0</p>
|
</div>
|
|
<div class="col2-2-in-5-r">
|
<p id="zzp1_11">在制品:0</p>
|
<p id="cps_11">产品数:0</p>
|
</div>
|
|
<div class="col2-2-in-5-r2">
|
<p id="zzp1_12">在制品:0</p>
|
<p id="cps_12">产品数:0</p>
|
</div>
|
</div>
|
</div>
|
</div>
|
</div>
|
<div class="col3">
|
<div class="col3-1">
|
<p>返工状态</p>
|
</div>
|
<div class="col1-2">
|
<div class="col3-2-j">
|
<p>染厂</p>
|
<h2><label id="rc">0</label> </h2>
|
</div>
|
<div class="col3-2-w">
|
<p>后整一号</p>
|
<h2><label id="hzyh">0</label></h2>
|
</div>
|
<div class="col3-2-z">
|
<p>后整二号</p>
|
<h2><label id="hzeh">0</label></h2>
|
</div>
|
<div class="col3-2-d">
|
<p>后整三号</p>
|
<h2><label id="hzsh">0</label></h2>
|
</div>
|
<div class="col3-2-t">
|
<p>特整</p>
|
<h2><label id="tz">0</label></h2>
|
</div>
|
</div>
|
</div>
|
</div>
|
<div class="tr2">
|
<div class="tr2-1-k">
|
|
</div>
|
<div class="tr2-1">
|
<div class="tr2-1-on">
|
<p>生产负荷(km)</p>
|
</div>
|
<div class="tr2-1-in" id="mychart1">
|
|
</div>
|
</div>
|
<div class="tr2-2">
|
<div class="tr2-1-on">
|
<p>生产效率(km)</p>
|
</div>
|
<div class="tr2-1-in" id="mychart2">
|
|
</div>
|
</div>
|
<div class="tr2-3">
|
<div class="tr2-1-on">
|
<p>生产产量(km)</p>
|
</div>
|
<div class="tr2-1-in" id="mychart3">
|
|
</div>
|
</div>
|
<div class="tr2-4">
|
<div class="tr2-1-on">
|
<p>质量指标</p>
|
</div>
|
<div class="tr2-1-in" id="mychart4">
|
|
</div>
|
</div>
|
</div>
|
</div>
|
</body>
|
</html>
|
