<!DOCTYPE html>
|
<html>
|
<head>
|
<meta charset="utf-8" />
|
<title>设备状态分布</title>
|
<link rel="stylesheet" href="../../../layuiadmin/layui/css/layui.css" media="all">
|
<link rel="stylesheet" href="../../../layuiadmin/style/admin.css" media="all">
|
<script src="../../../layuiadmin/layui/layui.js"></script>
|
<script src="../../../layuiadmin/layui/layui.js"></script>
|
<script src="../../../layuiadmin/Scripts/json2.js"></script>
|
<script src="../../../layuiadmin/Scripts/jquery-1.4.1.js"></script>
|
<script src="../../../layuiadmin/Scripts/webConfig.js"></script>
|
<script src="../../../layuiadmin/layui/layui1.js"></script>
|
<script src="../../../layuiadmin/echarts.min.js"></script>
|
<style>
|
/*树状图点击高亮变色*/
|
.layui-tree-set-active > .layui-tree-entry .layui-tree-main {
|
background: #aef0f7;
|
}
|
|
.cnt {
|
border: 1px solid #5FB878;
|
height: 50px;
|
border-radius: 5px;
|
/*background: -webkit-gradient(linear, 0% 0%, 0% 50%,from(#262525), to(#262525));*/ /*谷歌*/
|
}
|
|
.bottomright {
|
cursor: pointer; /*鼠标变成手指样式*/
|
transition: all 0.6s; /*所有属性变化在0.6秒内执行动画*/
|
}
|
|
.bottomright:hover {
|
transform: scale(1.3); /*鼠标放上之后元素变成1.4倍大小*/
|
}
|
|
.imgicon {
|
/*width: 50%;
|
height: 50px;*/
|
/*display: block;*/
|
/*text-align: center;
|
line-height: 50px;
|
float: left;*/
|
}
|
|
.imgtitle {
|
width: 70%;
|
height: 50px;
|
text-align: center;
|
display: block;
|
font-size: 15px;
|
float: left;
|
line-height: 50px;
|
}
|
|
.cns {
|
border: 1px solid #5FB878;
|
height: 130px;
|
border-radius: 5px;
|
}
|
|
.cns p {
|
font-size: 12px;
|
line-height: 18px;
|
margin: 0 5px;
|
white-space: nowrap;
|
text-overflow: ellipsis;
|
overflow: hidden;
|
}
|
|
.check1 {
|
cursor: pointer; /*鼠标变成手指样式*/
|
-webkit-transition: border linear .1s,-webkit-box-shadow linear .5s;
|
border-color: rgba(0,148, 255,.75);
|
-webkit-box-shadow: 0 0 18px rgba(0,148,255);
|
}
|
|
.prs {
|
font-family: "微软雅黑";
|
font-weight: bold;
|
line-height: 30px;
|
margin: 0 0px 0px 10px;
|
float: left;
|
}
|
|
.layui-progress {
|
width: 45%;
|
float: left;
|
top: 6px;
|
}
|
|
.tr1-1, .tr1-2, .tr1-3, .tr1-4 {
|
margin-left: 3%;
|
margin-top: 4%;
|
height: 310px;
|
/*background-color: #99f6a733;*/
|
border: 1px solid rgb(0 0 0 / 10%);
|
width: 95%;
|
}
|
.btnM {
|
width: 30%;
|
height: 50px;
|
line-height: 50px;
|
float: left;
|
text-align:right;
|
}
|
</style>
|
</head>
|
<body>
|
<div class="layui-fluid">
|
<div class="layui-col-md12">
|
<div class="layui-card" style="padding: 1px">
|
<div class="layui-card-body" style="padding: 1px;">
|
<form class="layui-form" action="" lay-filter="component-form-group">
|
<div class="layui-row">
|
<div class="layui-col-xs2 layui-inline" style="border: solid 1.5px #e0d6d64d;">
|
<div id="TreeTable" class="demo-tree demo-tree-box" style="height: 600px; overflow: scroll;"></div>
|
</div>
|
<div class="layui-col-xs9 layui-inline" style="border: solid 1.5px #e0d6d64d;">
|
<div id="btomleft" style="height:600px;display:block;overflow-y:auto;">
|
|
</div>
|
</div>
|
<div class="layui-col-xs1 layui-inline" style="border: solid 1.5px #e0d6d64d;">
|
<fieldset style="border: 1px solid #eee; box-shadow: 0 2px 5px 0 rgb(0 0 0 / 10%); height: 585px;">
|
<legend style="color: #5FB878">操作台</legend>
|
<div class="content4">
|
<div class="layui-row layui-col-space10">
|
<div class="layui-col-sm12 " onclick="OpenWork(event,this)">
|
<div class="cnt bottomright">
|
<div class="btnM">
|
<span class="layui-icon layui-icon-pause imgicon"></span>
|
</div>
|
<span class="imgtitle">开机</span>
|
</div>
|
</div>
|
</div>
|
<div class="layui-row layui-col-space10">
|
<div class="layui-col-sm12 " onclick="OpenReport(event,this)">
|
<div class="cnt bottomright">
|
<div class="btnM">
|
<span class="layui-icon layui-icon-list imgicon"></span>
|
</div>
|
<span class="imgtitle">故障登记</span>
|
</div>
|
</div>
|
</div>
|
<div class="layui-row layui-col-space10">
|
<div class="layui-col-sm12 " onclick="OpenEnd(event,this)">
|
<div class="cnt bottomright">
|
<div class="btnM">
|
<span class="layui-icon layui-icon-logout imgicon"></span>
|
</div>
|
<span class="imgtitle">维修</span>
|
</div>
|
</div>
|
</div>
|
<div class="layui-row layui-col-space10">
|
<div class="layui-col-sm12 " onclick="KSOpenWork(event,this)">
|
<div class="cnt bottomright">
|
<div class="btnM">
|
<span class="layui-icon layui-icon-pause imgicon"></span>
|
</div>
|
<span class="imgtitle">停机</span>
|
</div>
|
</div>
|
</div>
|
<div class="layui-row layui-col-space10">
|
<div class="layui-col-sm12 " onclick="KSOpenWork(event,this)">
|
<div class="cnt bottomright">
|
<div class="btnM">
|
<span class="layui-icon layui-icon-pause imgicon"></span>
|
</div>
|
<span class="imgtitle">履历</span>
|
</div>
|
</div>
|
</div>
|
<div class="layui-row layui-col-space10">
|
<div class="layui-col-sm12 " onclick="KSOpenWork(event,this)">
|
<div class="cnt bottomright">
|
<div class="btnM">
|
<span class="layui-icon layui-icon-pause imgicon"></span>
|
</div>
|
<span class="imgtitle">工艺</span>
|
</div>
|
</div>
|
</div>
|
</div>
|
</fieldset>
|
</div>
|
</div>
|
<div class="layui-row">
|
<div class="layui-col-xs3 layui-inline">
|
<div class="tr1-1" id="mychart1"> </div>
|
</div>
|
<div class="layui-col-xs3 layui-inline">
|
<div class="tr1-2" id="mychart2"> </div>
|
</div>
|
<div class="layui-col-xs3 layui-inline">
|
<div class="tr1-3" id="mychart3"> </div>
|
</div>
|
<div class="layui-col-xs3 layui-inline">
|
<div class="tr1-4" id="mychart4"> </div>
|
</div>
|
</div>
|
</form>
|
</div>
|
</div>
|
</div>
|
</div>
|
</body>
|
</html>
|
<script>
|
layui.config({
|
base: '../../../layuiadmin/' //静态资源所在路径
|
}).extend({
|
index: 'lib/index', //主入口模块
|
}).use(['index', 'form', 'table', 'element', 'laypage', 'laydate','tree'], function () {
|
//#region 公用变量
|
var $ = layui.$
|
, admin = layui.admin
|
, layer = layui.layer
|
, table = layui.table
|
, form = layui.form
|
, element = layui.element
|
, laypage = layui.laypage
|
, laydate = layui.laydate
|
, tree = layui.tree
|
var sWhere = "";
|
var wktag = 0;
|
//#endregion
|
|
//#region 进入页面即加载
|
|
//初始化界面
|
set_ClearBill();
|
|
//#endregion
|
|
//#region 触发事件：包括form.on(){}格式的所有点击事件、选择事件等
|
|
|
|
|
//#endregion
|
|
|
//#region 本页面被调用的所有方法
|
|
//#region 初始化界面
|
function set_ClearBill() {
|
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'));
|
get_Histogram1(mychart1);//柱状图1
|
get_LineChart(mychart2);//折线
|
get_Statistics(mychart3);//饼图
|
get_Histogram4(mychart4);//柱状图4
|
|
//查询
|
get_Display_Tree();
|
|
}
|
//#endregion
|
|
function Check(sWhere) {
|
wktag = 0;
|
$("#btomleft").html("");
|
$.ajax({
|
url: GetWEBURL() + '/Sc_OrderStateDistribution/Sc_OrderStateDistribution_Souce',
|
type: "GET",
|
data: { "sWhere": sWhere, "user": sessionStorage["HUserName"], "OrganizationID": sessionStorage["OrganizationID"] },
|
dataType: "json",//数据类型可以为 text xml json script jsonp
|
success: function (data) {
|
|
//var LoadData1 = data.data.h_p_JIT_GetWorkBillListInfoBySource;
|
var LoadData1 = data.data.h_p_sc_HDeptSouceMOList;
|
//var LoadData2 = data.data.h_p_JIT_GetWorkBillListInfoBySource1;
|
if (LoadData1.length > 0) //工单列表数据
|
{
|
|
for (var i = 0; i < LoadData1.length; i++) {
|
var html1 = '';
|
html1 += '<div class="layui-col-sm12 layui-col-md2" style="margin: 6px;width: 135px;">';
|
html1 += '<div class="cns" id="bs' + (i + 1) + '" onclick="CheckBtom(this,' + (i + 1) + ')">';
|
html1 += '<dl>';
|
html1 += '<dd class="tcenter">';
|
html1 += '<h1 style="display:none;"><span>单据类型：</span><span id="ty' + (i + 1) + '">' + LoadData1[i].HBillType + '</span></h1>';
|
//HSourceInterID实际取值：Sc_ICMOBillStatus_Tmp HInterID（单据主ID）
|
html1 += '<h1 style="display:none;"><span>源单主内码：</span><span id="sm' + (i + 1) + '">' + LoadData1[i].HSourceInterID + '</span></h1>';
|
html1 += '<h1 style="display:none;"><span>源单子内码：</span><span id="sb' + (i + 1) + '">' + LoadData1[i].HSourceEntryID + '</span></h1>';
|
html1 += '<h1 style="display:none;"><span>源单单号：</span><span id="sw' + (i + 1) + '">' + LoadData1[i].HSourceBillNo + '</span></h1>';
|
html1 += '<h1 style="display:none;"><span>源单类型：</span><span id="st' + (i + 1) + '">' + LoadData1[i].HSourceBillType + '</span></h1>';
|
html1 += '<h1 style="display:none;"><span>生产订单号主ID：</span><span id="df' + (i + 1) + '">' + LoadData1[i].HICMOInterID + '</span></h1>';
|
html1 += '<h1 style="display:none;"><span>生产订单子ID：</span><span id="ds' + (i + 1) + '">' + LoadData1[i].HICMOEntryID + '</span></h1>';
|
|
|
html1 += '<p><span>产线：</span><span id="wk' + (i + 1) + '">' + LoadData1[i].产线 + '</span></p>';
|
html1 += '<p><span>当前订单：</span><span id="wk' + (i + 1) + '">' + LoadData1[i].订单 + '</span></p>';
|
html1 += '<p><span>产量：</span><span id="ptn' + (i + 1) + '">' + LoadData1[i].计划数量 + '</span></p>';
|
html1 += '<p><span>状态：</span><span>' + LoadData1[i].状态 + '</span></p>';
|
html1 += '<p><span>运行时长：</span><span>' + LoadData1[i].状态 + '</span></p>';
|
html1 += '<p><span>维修时长：</span><span>' + LoadData1[i].计划数量 + '</span></p>';
|
html1 += '<p><span>稼动率：</span><span>35%</span></p>';
|
html1 += '</dd>';
|
html1 += '</dl>';
|
html1 += '</div>';
|
html1 += '</div>';
|
$("#btomleft").append(html1);
|
}
|
}
|
//if (LoadData2.length > 0) //当前状态数据
|
//{
|
// for (var i = 0; i < LoadData2.length; i++) {
|
// var html1 = '';
|
// html1 += '<div class="layui-col-sm12 layui-col-md12">';
|
// html1 += '<dl class="topright">;'
|
// html1 += '<dt>';
|
// html1 += '<img src="../layuiadmin/layui/images/device.png" onError="this.src="../layuiadmin/layui/images/erro.png";">'
|
// html1 += '</dt>';
|
// html1 += '<dd>';
|
// html1 += '<h1><span>当前设备：</span><span>' + LoadData2[i].HSourceName + '</span></h1>';
|
// html1 += '<h1><span>当前订单：</span><span>' + LoadData2[i].HSourceBillNo + '</span></h1>';
|
// html1 += '<h1><span>物料名称：</span><span>' + LoadData2[i].HMaterName + '</span></h1>';
|
// html1 += '<h1><span>计划数量：</span><span>' + LoadData2[i].HPlanQty + '</span></h1>';
|
// html1 += '<h1><span>已汇报数量：</span><span>' + LoadData2[i].HRelationQty + '</span></h1>';
|
// if (LoadData2[i].HRelationQty == 0 || LoadData2[i].HRelationQty == null) {
|
// html1 += '<h1><span>进度：</span><span>0%</span></h1>';
|
// }
|
// else {
|
// html1 += '<h1><span>进度：</span><span>' + ((LoadData2[i].HRelationQty / LoadData2[i].HPlanQty) * 100).toFixed(2) + '%</span></h1>';
|
// }
|
// html1 += '<h1><span>本单运行时间：</span><span>' + getSeconds(LoadData2[i].HSumTimes) + '</span></h1>';
|
// html1 += '<h1><span>本资源运行时间：</span><span>' + getSeconds(LoadData2[i].HSourceWorkTime) + '</span></h1>';
|
// html1 += '</dd>';
|
// html1 += '</dl>';
|
// html1 += '</div>';
|
// $("#topright").append(html1);
|
// }
|
//}
|
},
|
error: function (err) {
|
layer.alert(err.Message, { time: 1 * 2000, icon: 5 });
|
return false;
|
}
|
});
|
|
|
}
|
|
|
|
// 树状图查询
|
function get_Display_Tree() {
|
var sWhere = " and HUSEORGID=" + sessionStorage["OrganizationID"];
|
var ajaxLoad = layer.load();
|
$.ajax({
|
url: GetWEBURL() + '/Gy_Department/Gy_DepartmentTreeList',
|
data: { "sWhere": sWhere },
|
type: "GET",
|
success: function (data1) {
|
if (data1.count == 1) {
|
layer.close(ajaxLoad);
|
var data = JSON.parse(data1.data);
|
MenuMain(data);
|
} else {
|
layer.close(ajaxLoad);
|
layer.alert(data1.code + data1.Message, { icon: 5 });
|
}
|
}, error: function () {
|
layer.close(ajaxLoad);
|
layer.alert("接口请求失败!", { icon: 5 });
|
}
|
});
|
}
|
|
//遍历生成主菜单
|
function MenuMain(data) {
|
var liStr = '[';
|
//遍历生成主菜单
|
for (var i = 0; i < data.length; i++) {
|
// 判断是否存在子菜单
|
if (data[i].children != null && data[i].children.length > 0) {
|
liStr += '{"title": "' + data[i].id + "-" + data[i].title + '", "id": "' + data[i].id + '","spread":true, "children":[ ';
|
// 遍历获取子菜单
|
for (var k = 0; k < data[i].children.length; k++) {
|
liStr += getChildMenu(data[i].children[k], 0);
|
}
|
liStr = liStr.substring(0, liStr.length - 1);
|
liStr += ']},';
|
} else {
|
liStr += '{"title": "' + data[i].id + "-" + data[i].title + '", "id": "' + data[i].id + '"},';
|
}
|
};
|
liStr = liStr.substring(0, liStr.length - 1);
|
liStr += "]";
|
var treeTable = JSON.parse(liStr);
|
tree.render({
|
elem: '#TreeTable' //默认是点击节点可进行收缩
|
, data: treeTable
|
, click: function (obj) {
|
//高亮变色
|
$(".layui-tree-set").removeClass('layui-tree-set-active');
|
obj.elem.addClass('layui-tree-set-active');
|
|
var data = obj.data; //获取当前点击的节点数据
|
var HDeptID = 0;
|
if (data.id == "0") {
|
|
} else {
|
HDeptID = data.id ;
|
}
|
Check(HDeptID);
|
}
|
});
|
}
|
|
// 递归生成子菜单
|
function getChildMenu(subMenu, num) {
|
num++;
|
var subStr = '';
|
if (subMenu.children != null && subMenu.children.length > 0) {
|
subStr += '{"title": "' + subMenu.id + "-" + subMenu.title + '", "id": "' + subMenu.id + '", "children":[';
|
for (var j = 0; j < subMenu.children.length; j++) {
|
subStr += getChildMenu(subMenu.children[j], num);
|
if (j + 1 == subMenu.children.length) {
|
subStr = subStr.substring(0, subStr.length - 1);
|
}
|
}
|
subStr += ']},';
|
} else {
|
subStr += '{"title": "' + subMenu.id + "-" + subMenu.title + '", "id": "' + subMenu.id + '"},';
|
}
|
return subStr;
|
}
|
|
|
//柱状图1
|
function get_Histogram1(mychart1) {
|
|
//生产负荷
|
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(0);
|
// } else if (res.data[0][i].HProcID == 193) {//烘干定型
|
// optionData[1] = (res.data[0][i].HQty / 1000).toFixed(0);
|
// }
|
// else if (res.data[0][i].HProcID == 194) {//上浆定型
|
// optionData[2] = (res.data[0][i].HQty / 1000).toFixed(0);
|
// }
|
// else if (res.data[0][i].HProcID == 198) {//色坯烫光
|
// optionData[3] = (res.data[0][i].HQty / 1000).toFixed(0);
|
// }
|
// else if (res.data[0][i].HProcID == 204) {//预烫剪
|
// optionData[4] = (res.data[0][i].HQty / 1000).toFixed(0);
|
// }
|
// else if (res.data[0][i].HProcID == 197) {//补刷
|
// optionData[5] = (res.data[0][i].HQty / 1000).toFixed(0);
|
// }
|
// else if (res.data[0][i].HProcID == 201) {//印毛尖
|
// optionData[6] = (res.data[0][i].HQty / 1000).toFixed(0);
|
// }
|
// else if (res.data[0][i].HProcID == 200) {//拉幅定型
|
// optionData[7] = (res.data[0][i].HQty / 1000).toFixed(0);
|
// }
|
// else if (res.data[0][i].HProcID == 206) {//短线烫
|
// optionData[8] = (res.data[0][i].HQty / 1000).toFixed(0);
|
// }
|
// else if (res.data[0][i].HProcID == 205) {//长线烫
|
// optionData[9] = (res.data[0][i].HQty / 1000).toFixed(0);
|
// }
|
// }
|
// }
|
//})
|
|
var option = {
|
xAxis: {
|
type: 'category',
|
data: ['缸染', '烘干定型', '上浆定型', '色坯烫光', '预烫剪', '补刷', '印毛尖', '拉幅定型', '短线烫', '长线烫']
|
},
|
yAxis: {
|
type: 'value'
|
},
|
axisLabel: {
|
show: true,
|
interval: 0,
|
color: '#15b1fa',
|
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,
|
data: [23,14,45,56,12,35,64,34,62,75],
|
type: 'bar',
|
label: {
|
normal: {
|
show: true,
|
position: 'top',
|
formatter: function (params) {
|
return echarts.format.addCommas(params.value);
|
}
|
}
|
}
|
, itemStyle: {
|
// 设置柱形的颜色
|
normal: {
|
color: '#15b1fa',
|
label: {
|
show: true // 在折线拐点上显示数据
|
}
|
},
|
}
|
}
|
]
|
};
|
mychart1.setOption(option);
|
}
|
|
//折线图
|
function get_LineChart(mychart2) {
|
|
//生产效率
|
//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(0);
|
// } else if (res.data[0][i].HProcID == 193) {//烘干定型
|
// optionData[1] = (res.data[0][i].OutHQty / 1000).toFixed(0);
|
// }
|
// else if (res.data[0][i].HProcID == 194) {//上浆定型
|
// optionData[2] = (res.data[0][i].OutHQty / 1000).toFixed(0);
|
// }
|
// else if (res.data[0][i].HProcID == 198) {//色坯烫光
|
// optionData[3] = (res.data[0][i].OutHQty / 1000).toFixed(0);
|
// }
|
// else if (res.data[0][i].HProcID == 204) {//预烫剪
|
// optionData[4] = (res.data[0][i].OutHQty / 1000).toFixed(0);
|
// }
|
// else if (res.data[0][i].HProcID == 197) {//补刷
|
// optionData[5] = (res.data[0][i].OutHQty / 1000).toFixed(0);
|
// }
|
// else if (res.data[0][i].HProcID == 201) {//印毛尖
|
// optionData[6] = (res.data[0][i].OutHQty / 1000).toFixed(0);
|
// }
|
// else if (res.data[0][i].HProcID == 200) {//拉幅定型
|
// optionData[7] = (res.data[0][i].OutHQty / 1000).toFixed(0);
|
// }
|
// else if (res.data[0][i].HProcID == 206) {//短线烫
|
// optionData[8] = (res.data[0][i].OutHQty / 1000).toFixed(0);
|
// }
|
// else if (res.data[0][i].HProcID == 205) {//长线烫
|
// optionData[9] = (res.data[0][i].OutHQty / 1000).toFixed(0);
|
// }
|
//}
|
////打包入库
|
//optionData[10] = (res.data[1][0].HQty / 1000).toFixed(0);
|
|
var option = {
|
xAxis: {
|
type: 'category',
|
boundaryGap: false,
|
data: ['缸染', '烘干定型', '上浆定型', '色坯烫光', '预烫剪', '补刷', '印毛尖', '拉幅定型', '短线烫', '长线烫', '打包入库']
|
},
|
yAxis: {
|
type: 'value'
|
},
|
legend: {
|
orient: 'vertical',
|
data: ['12', '43'],//设置线条的名字
|
right: 0,
|
top: 15,
|
textStyle: {
|
color: '#15b1fa' //设置字体颜色
|
}
|
},
|
axisLabel: {
|
show: true,
|
interval: 0,
|
color: '#15b1fa',
|
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,
|
data: [23,43,56,45,67,46,35,46,23,34,35],
|
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: '#15b1fa'
|
}
|
, itemStyle: {
|
// 设置线条上点的颜色（和图例的颜色）
|
normal: {
|
color: '#15b1fa',
|
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: {}
|
}
|
]
|
};
|
|
|
mychart2.setOption(option);
|
}
|
|
//饼图
|
function get_Statistics(mychart3) {
|
|
const colorList = ['#5470c6', '#91cc75', '#fac858', '#ee6666'];
|
var option = {
|
title: [
|
{
|
text: '开机率',
|
//subtext: NetQtys + '%',
|
subtext: 45 + '%',
|
textStyle: {
|
fontSize: 16,
|
color: '#999',
|
lineHeight: 20
|
},
|
subtextStyle: {
|
fontSize: 28,
|
color: '#00c6ff'
|
},
|
textAlign: 'center',
|
left: '50%',
|
top: '78%'
|
},
|
{
|
show: true,
|
text: '状态对比分析',
|
textStyle: {
|
color: '#00c6ff',
|
fontSize: '16',
|
},
|
textAlign: 'center',
|
left: '50%',
|
top: '0%'
|
}
|
],
|
tooltip: {
|
trigger: 'item',
|
},
|
legend: {
|
type: 'scroll',
|
icon: 'pin',
|
top: '15%',
|
left: 'center',
|
textStyle: {
|
color: '#09d1ea'
|
}
|
},
|
color: colorList,
|
series: [
|
{
|
name: '占比',
|
type: 'pie',
|
radius: '50%',
|
center: ['50%', '50%'],
|
avoidLabelOverlap: false,
|
label: {
|
show: false
|
},
|
labelLine: {
|
show: false
|
},
|
data: [
|
{ name: '开机', value: 14 },
|
{ name: '开工', value: 16 },
|
{ name: '待机', value: 23 },
|
{ name: '维修中', value: 43 }
|
],
|
}
|
]
|
};
|
|
mychart3.setOption(option);
|
}
|
|
//柱状图4
|
function get_Histogram4(mychart1) {
|
|
//生产负荷
|
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(0);
|
// } else if (res.data[0][i].HProcID == 193) {//烘干定型
|
// optionData[1] = (res.data[0][i].HQty / 1000).toFixed(0);
|
// }
|
// else if (res.data[0][i].HProcID == 194) {//上浆定型
|
// optionData[2] = (res.data[0][i].HQty / 1000).toFixed(0);
|
// }
|
// else if (res.data[0][i].HProcID == 198) {//色坯烫光
|
// optionData[3] = (res.data[0][i].HQty / 1000).toFixed(0);
|
// }
|
// else if (res.data[0][i].HProcID == 204) {//预烫剪
|
// optionData[4] = (res.data[0][i].HQty / 1000).toFixed(0);
|
// }
|
// else if (res.data[0][i].HProcID == 197) {//补刷
|
// optionData[5] = (res.data[0][i].HQty / 1000).toFixed(0);
|
// }
|
// else if (res.data[0][i].HProcID == 201) {//印毛尖
|
// optionData[6] = (res.data[0][i].HQty / 1000).toFixed(0);
|
// }
|
// else if (res.data[0][i].HProcID == 200) {//拉幅定型
|
// optionData[7] = (res.data[0][i].HQty / 1000).toFixed(0);
|
// }
|
// else if (res.data[0][i].HProcID == 206) {//短线烫
|
// optionData[8] = (res.data[0][i].HQty / 1000).toFixed(0);
|
// }
|
// else if (res.data[0][i].HProcID == 205) {//长线烫
|
// optionData[9] = (res.data[0][i].HQty / 1000).toFixed(0);
|
// }
|
// }
|
// }
|
//})
|
|
var option = {
|
xAxis: {
|
type: 'category',
|
data: ['缸染', '烘干定型', '上浆定型', '色坯烫光', '预烫剪', '补刷', '印毛尖', '拉幅定型', '短线烫', '长线烫']
|
},
|
yAxis: {
|
type: 'value'
|
},
|
axisLabel: {
|
show: true,
|
interval: 0,
|
color: '#15b1fa',
|
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,
|
data: [23, 14, 45, 56, 12, 35, 64, 34, 62, 75],
|
type: 'bar',
|
label: {
|
normal: {
|
show: true,
|
position: 'top',
|
formatter: function (params) {
|
return echarts.format.addCommas(params.value);
|
}
|
}
|
}
|
, itemStyle: {
|
// 设置柱形的颜色
|
normal: {
|
color: '#15b1fa',
|
label: {
|
show: true // 在折线拐点上显示数据
|
}
|
},
|
}
|
}
|
]
|
};
|
mychart1.setOption(option);
|
}
|
|
});
|
//#endregion
|
|
//工单列表选中
|
function CheckBtom(obj, i) {
|
//var partid = $(obj).parent().attr("id"); //获取父级id
|
workcode = $("#wk" + i + "").html(); //通过样式ID获取html内容(工单号)
|
HBillType = $("#ty" + i + "").html(); //通过样式ID获取html内容(单据类型)
|
HSourceInterID = $("#sm" + i + "").html(); //通过样式ID获取html内容(源单主内码)
|
HSourceEntryID = $("#sb" + i + "").html(); //通过样式ID获取html内容(源单子内吗)
|
HSourceBillNo = $("#sw" + i + "").html(); //通过样式ID获取html内容(源单单号)
|
HSourceBillType = $("#st" + i + "").html(); //通过样式ID获取html内容(源单类型)
|
HICMOInterID = $("#df" + i + "").html(); //生产订单主内码
|
HICMOEntryID = $("#ds" + i + "").html(); //生产订单子内码
|
HMaterName = $("#ptn" + i + "").html(); //产品名称
|
|
$('.cns').removeClass('check1'); //删除不同父级clss样式相同的所有元素
|
$("#bs" + i + "").addClass('check1'); // 添加当前元素的样式
|
if (workcode != "" && workcode != null) {
|
wktag = 1;
|
}
|
}
|
|
</script>
|
