<%@ page language="java" pageEncoding="UTF-8"%>
|
<script type="text/javascript"
|
src="https://fastly.jsdelivr.net/npm/echarts@5.4.2/dist/echarts.min.js"></script>
|
<!-- 更换班组信息 -->
|
<style>
|
.s-title {
|
font-size: 25px;
|
/*font-weight: bold;
|
text-align :center; */
|
vertical-align: middle;
|
text-align: center
|
}
|
|
datetime-local {
|
font-size: 25px;
|
}
|
</style>
|
<div class="modal fade" id="div_daping_posun" tabindex="-1" role="dialog"
|
aria-labelledby="myModalLabel" aria-hidden="true">
|
<form class="form-horizontal" role="form">
|
<div class="modal-dialog" style="width: 75%;height=75%">
|
<div class="modal-content" style="">
|
<div class="modal-header">
|
<div class="form-group" style="margin: auto; text-align: center">
|
<span id="mdp_title1"
|
style="font-size: 30px; font-weight: bold; float: left; margin-left: 5%">
|
</span> <span class="s-title">开始时间</span> <input type="datetime-local"
|
id="starttime1" name="starttime" class="s-title" /> <span
|
class="s-title">结束时间</span> <input type="datetime-local"
|
id="endtime1" name="endtime" class="s-title" />
|
|
<span class="s-title">线路</span>
|
<select id="xianlu1" class="s-title">
|
<option value=''>请选择--</option>
|
<option value='切磨一线'>切磨一线</option>
|
<option value='切磨二线'>切磨二线</option>
|
<option value='切磨三线'>切磨三线</option>
|
<option value='钢化一线'>钢化一线</option>
|
<option value='钢化二线'>钢化二线</option>
|
<option value='中空一线'>中空一线</option>
|
<option value='中空二线'>中空二线</option>
|
<option value='中空三线'>中空三线</option>
|
</select>
|
<span class="s-title">班组</span>
|
<select id="banzu1" class="s-title">
|
<option value=''>请选择--</option>
|
<option value='磨边A班'>磨边A班</option>
|
<option value='磨边B班'>磨边B班</option>
|
<option value='磨边C班'>磨边C班</option>
|
<option value='钢化A班'>钢化A班</option>
|
<option value='钢化B班'>钢化B班</option>
|
<option value='钢化C班'>钢化C班</option>
|
<option value='中空A班'>中空A班</option>
|
<option value='中空B班'>中空B班</option>
|
<option value='中空C班'>中空C班</option>
|
<option value='包装A班'>包装A班</option>
|
</select>
|
<button type="button" class="btn btn-success btn-lg"
|
id="btn_query" onclick="chat_query1()">查询</button>
|
|
<button type="button" class="btn btn-primary close"
|
data-dismiss="modal" aria-hidden="true">【关闭】</button>
|
</div>
|
</div>
|
<div class="modal-body">
|
|
|
|
<div id="container1" style="height: 1000px; max-width: 100%"></div>
|
</div>
|
<div class="modal-footer"></div>
|
</div>
|
</div>
|
</form>
|
</div>
|
|
|
<script type="text/javascript">
|
|
var format1 = "";
|
var dom = document.getElementById('container1');
|
var myChart1 = echarts.init(dom, null, {
|
renderer : 'canvas',
|
useDirtyRect : false
|
});
|
|
function getFormat1(days) {
|
format1 = "";
|
var nTime = new Date();
|
nTime.setDate(nTime.getDate() - days);
|
format1 += nTime.getFullYear() + "-";
|
format1 += (nTime.getMonth() + 1) < 10 ? "0" + (nTime.getMonth() + 1)
|
: (nTime.getMonth() + 1);
|
format1 += "-";
|
format1 += nTime.getDate() < 10 ? "0" + (nTime.getDate()) : (nTime
|
.getDate());
|
format1 += "T";
|
format1 += nTime.getHours() < 10 ? "0" + (nTime.getHours()) : (nTime
|
.getHours());
|
format1 += ":";
|
format1 += nTime.getMinutes() < 10 ? "0" + (nTime.getMinutes()) : (nTime
|
.getMinutes());
|
format1 += ":00";
|
}
|
|
function modalDPShow1(pT) {
|
$("#div_daping_posun").modal('toggle');
|
$("#mdp_title1").text(pT);
|
getFormat1(0);
|
$("#endtime1").val(format1);
|
getFormat1(6);
|
$("#starttime1").val(format1);
|
myChart1.resize();
|
chat_query1();
|
//query_chats_data();
|
}
|
|
var pageTitle = $("#mdp_title1").text();
|
|
var app1 = {};
|
var queryYY = [];
|
var queryPS = [];
|
function chat_query1() {
|
var sTime = $("#starttime1").val();
|
if (sTime == null || sTime == "") {
|
$("#CZ_Msg").modal('toggle');
|
$("#cz_Ming").html("查询");
|
$("#cz_Zhuangtai").html("");
|
$("#cz_Zhuangtai").attr("style", "color:red;");
|
$("#cz_mingxi").html("请选择查询开始时间！");
|
|
return;
|
}
|
|
var sDate = $("#starttime1").val().substr(0, 10);
|
var eDate = $("#endtime1").val().substr(0, 10);
|
var banzu = $("#banzu1").val();
|
var xianlu = $("#xianlu1").val();
|
if(banzu==null){
|
banzu='';
|
}
|
if(xianlu==null){
|
xianlu='';
|
}
|
|
|
|
|
|
$.ajax({
|
type : "post",
|
dataType : "Json",
|
url : "/gmms2/mesview/data/_dapingxianshi_mangage",
|
data : {
|
yemian:"吊装管理1",
|
caozuo : '破损',
|
leixing:"查询",
|
sDate : sDate,
|
eDate : eDate,
|
banzu : banzu,
|
xianlu : xianlu
|
},
|
success : function(data) {
|
console.log(data);
|
var d = data;
|
if (d.length > 0) {
|
queryYY = [];
|
queryPS = [];
|
for (var i = 0; i < d.length; i++) {
|
queryYY.push(d[i][0]);
|
queryPS.push(d[i][1]);
|
}
|
if (queryYY.length < 1) {
|
return;
|
|
}
|
//alert("日期：" + queryDate + "\r\n电量：" + queryD+ "\r\n产量：" + queryCL);
|
|
showChats1(queryYY, queryPS);
|
}
|
else{
|
queryYY = [];
|
queryPS = [];
|
showChats1(queryYY, queryPS);
|
}
|
|
},
|
error : function(data) {
|
alert("失败");
|
}
|
})
|
|
}
|
|
|
function showChats1(queryYY, queryPS) {
|
|
var option1;
|
option1 = {
|
title : {
|
text : pageTitle,
|
left : 'center',
|
subtext : '',
|
textStyle : {
|
fontSize : 35
|
}
|
},
|
toolbox : {
|
show : true,
|
itemSize : 50,
|
showTitle : false, // 隐藏默认文字，否则两者位置会重叠
|
feature : {
|
dataView : {
|
show : true,
|
readOnly : true,
|
title : '数据视图'
|
},
|
//magicType: { show: true, type: ['line', 'bar'] },
|
//restore: { show: true },
|
saveAsImage : {
|
show : true,
|
title : '保存为图片'
|
}
|
},
|
tooltip : { // 和 option.tooltip 的配置项相同
|
show : true,
|
formatter : function(param) {
|
//return '<div>' + param.title + '</div>'; // 自定义的 DOM 结构
|
return param.title; // 自定义的 DOM 结构
|
},
|
textStyle : {
|
fontSize : 20
|
},
|
extraCssText : 'box-shadow: 0 0 3px rgba(0, 0, 0, 0.3);' // 自定义的 CSS 样式
|
}
|
},
|
tooltip : {
|
trigger : 'axis',
|
axisPointer : {
|
type : ''
|
},
|
|
textStyle : {
|
fontSize : 30
|
}
|
},
|
grid : {
|
left : '3%',
|
right : '4%',
|
bottom : '3%',
|
containLabel : true
|
},
|
xAxis : [ {
|
type : 'category',
|
data : queryYY,
|
axisTick : {
|
alignWithLabel : true
|
},
|
axisLabel : {
|
//interval: 50,
|
//rotate: 40,
|
textStyle : {
|
color : "#222222",
|
fontSize : 26
|
}
|
},
|
} ],
|
textStyle : {
|
fontSize : 26
|
},
|
yAxis : [ {
|
type : 'value',
|
name : '数量(片)',
|
axisLabel : {
|
//interval: 50,
|
//rotate: 40,
|
textStyle : {
|
color : "#222222",
|
fontSize : 26
|
}
|
}
|
} ],
|
series : [ {
|
name : '数量',
|
type : 'bar',
|
//barWidth: '50%',
|
data : queryPS
|
} ]
|
};
|
|
if (option1 && typeof option1 === 'object') {
|
|
myChart1.setOption(option1);
|
}
|
//myChart.setOption(option,true);
|
myChart1.resize();
|
}
|
</script>
|
