241 lines
7.6 KiB
Plaintext
241 lines
7.6 KiB
Plaintext
|
<%@page import="com.sipai.entity.user.ExtSystem"%>
|
|||
|
|
<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
|
|||
|
|
<%@ taglib uri="http://java.sun.com/jstl/core_rt" prefix="c"%>
|
|||
|
|
<%@ taglib uri="http://java.sun.com/jsp/jstl/functions" prefix="fn"%>
|
|||
|
|
<% request.setAttribute("RequestMode", ExtSystem.RequestMode); %>
|
|||
|
|
<% request.setAttribute("SystemType", ExtSystem.SystemType); %>
|
|||
|
|
<style type="text/css">
|
|||
|
|
.select2-container .select2-selection--single{
|
|||
|
|
height:34px;
|
|||
|
|
line-height: 34px;
|
|||
|
|
}
|
|||
|
|
.select2-selection__arrow{
|
|||
|
|
margin-top:3px;
|
|||
|
|
}
|
|||
|
|
</style>
|
|||
|
|
<script type="text/javascript">
|
|||
|
|
var mpcodestr="${idstr}";
|
|||
|
|
var mpnamestr="${namestr}";
|
|||
|
|
var mpunitstr="${unitstr}";
|
|||
|
|
var colors = ['#c12e34', '#e6b600', '#0098d9','#2b821d','#005eaa', '#339ca8', '#cda819','#32a487','#f3a43b','#60c0dd','#d7504b','#c6e579','#f4e001'];
|
|||
|
|
|
|||
|
|
//var colors = ['#c1232b', '#27727b', '#fcce10','#e87c25','#b5c334', '#fe8463', '#9bca63','#fad860','#f3a43b','#60c0dd','#d7504b','#c6e579','#f4e001'];
|
|||
|
|
$(function() {
|
|||
|
|
initDate1();
|
|||
|
|
mpcodestr = mpcodestr.substring(0, mpcodestr.length-1);
|
|||
|
|
mpcodestr = mpcodestr.split(",");
|
|||
|
|
mpnamestr = mpnamestr.substring(0, mpnamestr.length-1);
|
|||
|
|
|
|||
|
|
mpnamestr = mpnamestr.split(",");
|
|||
|
|
|
|||
|
|
mpunitstr = mpunitstr.substring(0, mpunitstr.length-1);
|
|||
|
|
mpunitstr = mpunitstr.split(",");
|
|||
|
|
getHistoryJsons('${idstr}','${namestr}','${unitstr}');
|
|||
|
|
});
|
|||
|
|
var beginTimeStore1 = '';
|
|||
|
|
var endTimeStore1 = '';
|
|||
|
|
function initDate1() {
|
|||
|
|
//定义locale汉化插件
|
|||
|
|
beginTimeStore1 = moment().subtract(6, 'days').format('YYYY-MM-DD');;
|
|||
|
|
endTimeStore1 = moment().subtract(-1, 'days').format('YYYY-MM-DD');
|
|||
|
|
if(${param.sdt==''}){
|
|||
|
|
beginTimeStore1='2019-03-16';
|
|||
|
|
}else{
|
|||
|
|
beginTimeStore1 ='${param.sdt}';
|
|||
|
|
}
|
|||
|
|
if(${param.edt==''}){
|
|||
|
|
endTimeStore1='2019-03-20';
|
|||
|
|
}else{
|
|||
|
|
endTimeStore1 ='${param.edt}';
|
|||
|
|
}
|
|||
|
|
var locale = {
|
|||
|
|
"format": 'YYYY-MM-DD',
|
|||
|
|
"separator": " ~ ",
|
|||
|
|
"applyLabel": "确定",
|
|||
|
|
"cancelLabel": "取消",
|
|||
|
|
"fromLabel": "起始时间",
|
|||
|
|
"toLabel": "结束时间'",
|
|||
|
|
"customRangeLabel": "自定义",
|
|||
|
|
"weekLabel": "W",
|
|||
|
|
"daysOfWeek": ["日", "一", "二", "三", "四", "五", "六"],
|
|||
|
|
"monthNames": ["一月", "二月", "三月", "四月", "五月", "六月", "七月", "八月", "九月", "十月", "十一月", "十二月"],
|
|||
|
|
"firstDay": 1
|
|||
|
|
};
|
|||
|
|
$('#reservationtime2').daterangepicker({
|
|||
|
|
"timePicker": false,
|
|||
|
|
"timePicker24Hour": false,
|
|||
|
|
"linkedCalendars": false,
|
|||
|
|
"autoUpdateInput": false,
|
|||
|
|
"timePickerIncrement": 10,
|
|||
|
|
"locale": locale,
|
|||
|
|
//汉化按钮部分
|
|||
|
|
ranges: {
|
|||
|
|
'今日': [moment(), moment().subtract(-1, 'days')],
|
|||
|
|
'昨日': [moment().subtract(1, 'days'), moment()],
|
|||
|
|
'最近7日': [moment().subtract(6, 'days'), moment().subtract(-1, 'days')],
|
|||
|
|
'本月': [moment().startOf('month'), moment().endOf('month').subtract(-1, 'days')],
|
|||
|
|
'上月': [moment().subtract(1, 'month').startOf('month'), moment().subtract(1, 'month').endOf('month').subtract(-1, 'days')]
|
|||
|
|
},
|
|||
|
|
startDate: beginTimeStore1,
|
|||
|
|
endDate: endTimeStore1
|
|||
|
|
}, function(start, end, label) {
|
|||
|
|
beginTimeStore1 = start.format(this.locale.format);
|
|||
|
|
endTimeStore1 = end.format(this.locale.format);
|
|||
|
|
if(!this.startDate){
|
|||
|
|
this.element.val('');
|
|||
|
|
}else{
|
|||
|
|
this.element.val(this.startDate.format(this.locale.format) + this.locale.separator + this.endDate.format(this.locale.format));
|
|||
|
|
}
|
|||
|
|
});
|
|||
|
|
$('#reservationtime2').val(beginTimeStore1 + locale.separator + endTimeStore1);
|
|||
|
|
};
|
|||
|
|
function getHistoryJsons(ids,names,units){
|
|||
|
|
|
|||
|
|
console.log(ids);
|
|||
|
|
console.log(names);
|
|||
|
|
console.log(units);
|
|||
|
|
$.post(ext.contextPath +"/work/mpoint/getHistory.do",{bizId:'${param.companyId}',ids:ids,sdt:beginTimeStore1,edt:endTimeStore1},function(data){
|
|||
|
|
//console.log(data);
|
|||
|
|
var ArrayDatas = eval("(" + data + ")");
|
|||
|
|
console.log(ArrayDatas);
|
|||
|
|
var measuredt = [];
|
|||
|
|
var res = ArrayDatas[0];
|
|||
|
|
for(var i=0;i<res.length;i++){
|
|||
|
|
measuredt.push(res[i].measuredt.substring(0,16));
|
|||
|
|
}
|
|||
|
|
var parmvalue = [];
|
|||
|
|
var mpnamestr = names.substring(0, names.length-1);
|
|||
|
|
mpnamestr = mpnamestr.split(",");
|
|||
|
|
var mpunitstr = units.substring(0, units.length-1);
|
|||
|
|
mpunitstr = mpunitstr.split(",");
|
|||
|
|
|
|||
|
|
var offset=50;
|
|||
|
|
var yaAxis=[];
|
|||
|
|
var series=[];
|
|||
|
|
for(var i=0;i<mpnamestr.length;i++){
|
|||
|
|
var xobj = {};
|
|||
|
|
xobj.type='value';
|
|||
|
|
if(i==0){
|
|||
|
|
xobj.name=mpnamestr[i];
|
|||
|
|
xobj.position='left';
|
|||
|
|
xobj.offset=0;
|
|||
|
|
}else{
|
|||
|
|
xobj.name=mpnamestr[i].split("").join("\n");
|
|||
|
|
xobj.nameLocation='middle'; //name位置，'start' 'middle' 'end'
|
|||
|
|
xobj.nameRotate=0;//name角度
|
|||
|
|
xobj.position='right';
|
|||
|
|
xobj.offset=offset*(i-1);
|
|||
|
|
}
|
|||
|
|
xobj.nameGap=30;//name与y轴距离
|
|||
|
|
var axisLine={};
|
|||
|
|
var lineStyle={};
|
|||
|
|
var length=mpnamestr.length;
|
|||
|
|
lineStyle.color=colors[i%colors.length];
|
|||
|
|
|
|||
|
|
axisLine.lineStyle=lineStyle;
|
|||
|
|
xobj.axisLine=axisLine;
|
|||
|
|
var axisLabel={};
|
|||
|
|
axisLabel.formatter='{value}'+mpunitstr[i];
|
|||
|
|
xobj.axisLabel=axisLabel;
|
|||
|
|
yaAxis.push(xobj);
|
|||
|
|
|
|||
|
|
var yobj = {};
|
|||
|
|
yobj.type='line';
|
|||
|
|
yobj.name=mpnamestr[i];
|
|||
|
|
yobj.yAxisIndex=i;
|
|||
|
|
var data =[];
|
|||
|
|
for(var j=0;j<measuredt.length;j++){
|
|||
|
|
var resy = ArrayDatas[i];
|
|||
|
|
data.push(resy[j].parmvalue);
|
|||
|
|
}
|
|||
|
|
yobj.data=data;
|
|||
|
|
series.push(yobj);
|
|||
|
|
}
|
|||
|
|
var option = {
|
|||
|
|
color: colors,
|
|||
|
|
|
|||
|
|
tooltip: {
|
|||
|
|
trigger: 'axis',
|
|||
|
|
axisPointer: {
|
|||
|
|
type: 'cross'
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
grid: {
|
|||
|
|
right: '20%'
|
|||
|
|
},
|
|||
|
|
toolbox: {
|
|||
|
|
feature: {
|
|||
|
|
dataView: {show: false, readOnly: false},
|
|||
|
|
restore: {show: false},
|
|||
|
|
saveAsImage: {show: false}
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
legend: {
|
|||
|
|
data:mpnamestr,
|
|||
|
|
type: 'scroll',
|
|||
|
|
},
|
|||
|
|
xAxis: [
|
|||
|
|
{
|
|||
|
|
type: 'category',
|
|||
|
|
axisTick: {
|
|||
|
|
alignWithLabel: true
|
|||
|
|
},
|
|||
|
|
data: measuredt,
|
|||
|
|
axisLabel: {
|
|||
|
|
|
|||
|
|
rotate: 340,//横坐标倾斜角度
|
|||
|
|
|
|||
|
|
},
|
|||
|
|
|
|||
|
|
}
|
|||
|
|
],
|
|||
|
|
yAxis:yaAxis,
|
|||
|
|
series:series
|
|||
|
|
|
|||
|
|
};
|
|||
|
|
var chart = document.getElementById("box1");
|
|||
|
|
var number=mpnamestr.length;
|
|||
|
|
$("#box1").height(450);
|
|||
|
|
$("#box1").width( 900);
|
|||
|
|
// chart.style.width = 900-offset;
|
|||
|
|
var chartData = echarts.init(chart);
|
|||
|
|
|
|||
|
|
//setTimeout(function(){
|
|||
|
|
chartData.setOption(option);
|
|||
|
|
//},1000);
|
|||
|
|
});
|
|||
|
|
|
|||
|
|
}
|
|||
|
|
function dosearch(){
|
|||
|
|
mpcodestr="";
|
|||
|
|
mpnamestr="";
|
|||
|
|
mpunitstr="";
|
|||
|
|
getHistoryJsons('${idstr}','${namestr}','${unitstr}')
|
|||
|
|
}
|
|||
|
|
</script>
|
|||
|
|
<div class="modal fade" id="subModal" >
|
|||
|
|
<div class="modal-dialog modal-lg">
|
|||
|
|
<div class="modal-content" id="model">
|
|||
|
|
<div class="modal-header">
|
|||
|
|
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
|
|||
|
|
<span aria-hidden="true">×</span></button>
|
|||
|
|
<h4 class="modal-title">${namestr }曲线</h4>
|
|||
|
|
</div>
|
|||
|
|
<div class="modal-body" id="model-body" style="overflow:auto;overflow-y:hidden;">
|
|||
|
|
<div class="input-group pull-right input-group-sm" >
|
|||
|
|
<input type="text" class="form-control pull-right" id="reservationtime2" style="width:175px">
|
|||
|
|
<div class="input-group-btn ">
|
|||
|
|
<button type="button" class="btn btn-default" onclick="dosearch();" ><i class="fa fa-search"></i> 查询</button>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
<div id="box1" style="margin-left:-30px"></div>
|
|||
|
|
</div>
|
|||
|
|
<div class="modal-footer">
|
|||
|
|
<button type="button" class="btn btn-default pull-right" data-dismiss="modal">关闭</button>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
<!-- /.modal-content -->
|
|||
|
|
</div>
|
|||
|
|
<!-- /.modal-dialog -->
|
|||
|
|
</div>
|