<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
|
<%
|
String path = request.getContextPath();
|
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
|
%>
|
<%@ taglib uri="/struts-tags" prefix="s" %>
|
<!DOCTYPE HTML>
|
<html>
|
<head>
|
<base href="<%=basePath%>">
|
<meta charset="UTF-8">
|
<title>历史数据</title>
|
|
<meta http-equiv="pragma" content="no-cache">
|
<meta http-equiv="cache-control" content="no-cache">
|
<meta http-equiv="expires" content="0">
|
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
|
<meta http-equiv="description" content="This is my page">
|
<!--
|
<link rel="stylesheet" type="text/css" href="styles.css">
|
-->
|
<link href="css/basic.css" type="text/css" rel="stylesheet" />
|
<link rel="stylesheet" href="css/history-data.css">
|
<link href="jqueryui/jquery-ui.css" type="text/css" rel="stylesheet" />
|
<link rel="stylesheet" type="text/css" href="css/popup.css">
|
<link rel="stylesheet" type="text/css" href="css/nocontent.css">
|
<link rel="stylesheet" type="text/css" href="css/filter.css">
|
<script type="text/javascript" src="js/echarts.js"></script>
|
<script type="text/javascript" src="js/jquery-1.8.3.js"></script>
|
<script type="text/javascript" src="js/base.js"></script>
|
<script type="text/javascript" src="js/right-menu.js"></script>
|
</head>
|
|
<body>
|
<!--头部内容开始-->
|
<jsp:include page="Top.jsp" flush="true"/>
|
<!--头部内容结束-->
|
<div id="main">
|
<!--导航开始-->
|
<jsp:include page="nav.jsp" flush="true"/>
|
<!--导航结束-->
|
<table class="content">
|
<tbody>
|
<tr>
|
<td class="left-content">
|
<!-- 机房数电池组数 -->
|
<div id="mach_num">
|
<s:text name="Room_num"></s:text>:<span id="room_num"></span>; <s:text name="Batt_group_num"></s:text>:<span id="batt_group_num"></span>
|
</div>
|
<!--电池组菜单栏-->
|
<div id="lside"></div>
|
</td>
|
<td class="right-content">
|
<div class="filter">
|
<div class="filter-header">
|
<div class="filter-nav">
|
当前内容:机房信息>>组端电压(2010-10-11至2012-10-11)
|
</div>
|
<div class="filter-header-btn">
|
<a href="javascript:;" class="show-body">显示筛选</a>
|
</div>
|
</div>
|
<div class="filter-body">
|
<div class="filter-item">
|
<div class="filter-title">机房信息</div>
|
<div class="filter-content">
|
<a href="javascript:;" class="active" number="01">组端电压</a>
|
<a href="javascript:;" number="02">在线电压</a>
|
<a href="javascript:;" number="03">组端温度</a>
|
<a href="javascript:;" number="04">组端电流</a>
|
</div>
|
</div>
|
<div class="filter-item">
|
<div class="filter-title">单体信息</div>
|
<div class="filter-content">
|
<a href="javascript:;" number="11">单体电压</a>
|
<a href="javascript:;" number="12">单体内阻</a>
|
<a href="javascript:;" number="13">单体温度</a>
|
<a href="javascript:;" number="14">单体电导</a>
|
<a href="javascript:;" number="15">连接条阻抗</a>
|
</div>
|
</div>
|
<div class="filter-item">
|
<div class="filter-title">单体列表<span style="color:red">(仅对单体有效)</span></div>
|
<div class="filter-content">
|
<div class="check"></div>
|
<div class="btn">
|
<button type="button" class="all-check button blue">全选</button>
|
<button type="button" class="no-check button blue">取消全选</button>
|
<button type="button" class="invert-check button blue">反选</button>
|
</div>
|
</div>
|
</div>
|
<div class="filter-item">
|
<div class="filter-title">日期</div>
|
<div class="filter-content">
|
<input type="text" class="filter-start-time" value="2018-1-1" readonly="readonly">
|
到
|
<input type="text" class="filter-end-time" value="2018-1-2" readonly="readonly">
|
</div>
|
</div>
|
</div>
|
</div>
|
|
<div class="graph">
|
<div class="echarts-contain">
|
<div class="echarts"></div>
|
</div>
|
<div class="no-data">
|
<div class="no-data-content">
|
<div class="no-data-img">
|
<img src="image/no_data.gif">
|
<div class="no-data-text">暂无数据</div>
|
</div>
|
</div>
|
</div>
|
</div>
|
</td>
|
</tr>
|
</tbody>
|
</table>
|
</div>
|
<script type="text/javascript" src="jqueryui/jquery-ui.js"></script>
|
<script type="text/javascript" src="js/createTab.js"></script>
|
<script type="text/javascript" src="js/popup.js"></script>
|
<script type="text/javascript" src="js/nocontent.js"></script>
|
<script type="text/javascript" src="js/myfilter.js"></script>
|
<script type="text/javascript">
|
var permits;
|
<% Object obj=session.getAttribute("permits");
|
if(obj!=null){
|
String permits = obj.toString(); %>
|
permits=<%=permits%>;
|
//console.info(json);
|
<% } %>
|
var battinlist = [];
|
var isFirLoadPage = 1; // 判断是否是第一次加载页面
|
var BattGroupId=0; //当前选中的电池组id
|
var battmon_num =0; //当前选中的单体编号
|
var $echarts = $('.graph .echarts-contain .echarts').get(0);
|
var graph = echarts.init($echarts);
|
//初始化左导航
|
$(document).ready(function(){
|
//console.info(2222);
|
//根据域名中传递过来的battgroupid找到指定的电池组
|
var thr_id=getQueryString("battgroupId");
|
if(thr_id!=undefined){
|
BattGroupId = thr_id;
|
//获得一级菜单并展示二级菜单
|
var secTag =$('#'+thr_id).parent().parent().siblings().first().parent().parent().siblings().first().next();
|
var secTagA = $('#'+thr_id).parent().parent().siblings().first();
|
//console.info(secTagA.text()+'******');
|
if(secTagA.text().trim().length == 0) {
|
secTagA.hide();
|
}
|
secTag.show();
|
//$('#'+thr_id).parent().parent().siblings().first().parent().parent().siblings().first().next().show();
|
//获得二级菜单并展示三级菜单
|
$('#'+thr_id).parent().parent().siblings().first().next().show();
|
$('#'+thr_id).css('background-color','#9bbaf3');
|
//一级菜单展开样式
|
$('#'+thr_id).parent().parent().siblings().first().parent().parent().siblings().first().children('.arrow').removeClass("down");
|
$('#'+thr_id).parent().parent().siblings().first().parent().parent().siblings().first().children('.arrow').addClass("up");
|
$('#'+thr_id).parent().parent().siblings().first().children('.mark').text('-');
|
$('#'+thr_id).parent().parent().siblings().first().children('.mark').addClass('black');
|
//alert($('#'+thr_id).parent().parent().siblings().first().text());
|
location.hash="#"+thr_id;
|
}else{
|
$('.fir:first').next().css('display','block');
|
$('.sec:first').next().css('display','block');
|
$('.thr:first').css('background-color','#9bbaf3');
|
$(this).addClass('act');
|
$('#address_infor').text($('.fir:first').text()+"-"+$('.sec:first').text()+"-"+$('.thr:first').text());
|
|
//初始化内容
|
//$(".arrow").eq(0).removeClass("down");
|
//$(".arrow").eq(0).addClass("up");
|
$(".mark").eq(0).text("-");
|
$(".mark").eq(0).addClass("black");
|
BattGroupId=$('.thr:first').attr("id");
|
}
|
for(var i=0;i<$('.fir:first').next().children().length;i++)
|
{
|
if($('.fir:first').next().children().eq(i).children().eq(0).text()=='')
|
{
|
$('.fir:first').next().children().eq(i).children().eq(0).css('display','none');
|
}
|
}
|
});
|
// 使用jquery实现左导航的显示和隐藏
|
$(document).ready(function(){
|
//二级左菜单的显示和隐藏
|
$('#lside').on('click','.fir', function(){
|
$('.thr').css('background-color','');
|
$('.fir').css('background-color','');
|
$('.sec').css('background-color','');
|
$(this).css('background-color','#9bbaf3');
|
$(this).css('color','black');
|
// alert($(this).next().children().eq(0).children().eq(0).text());
|
if ($(this).next().length == 0) {
|
searchkBattByStationid($(this).attr('name'));
|
}else {
|
//修复二级为空时的bug
|
for(var i=0;i<$(this).next().children().length;i++)
|
{
|
if($(this).next().children().eq(i).children().eq(0).text()=='')
|
{
|
$(this).next().children().eq(i).children().eq(0).remove();
|
$(this).next().children().eq(i).children().eq(0).next().slideToggle();
|
}
|
}
|
$(this).next().slideToggle(function() {
|
//console.info($(this));
|
changeFirImg($(this));
|
});
|
}
|
});
|
//三级左菜单的显示和隐藏
|
$('#lside').on('click', '.sec', function(){
|
$('.thr').css('background-color','');
|
$('.fir').css('background-color','');
|
$('.sec').css('background-color','');
|
// alert($(this).parent().parent().siblings().get(0).tagName);
|
$(this).css('background-color','#9bbaf3');
|
$(this).next().slideToggle();
|
});
|
// 三级菜单背景色改变
|
$('#lside').on('click', '.thr', function(){
|
$('.thr').css('background-color','');
|
$('.thr').removeClass('act');
|
$('.fir').css('background-color','');
|
$('.sec').css('background-color','');
|
$(this).css('background-color','#9bbaf3');
|
$(this).addClass('act');
|
//显示电池的详细信息
|
$('#address_infor').text($(this).parent().parent().parent().parent().siblings().first().text()+"-"+$(this).parent().parent().siblings().first().text()+"-"+$(this).text());
|
|
// 获取设备ID和电池组ID
|
searchHistoryDataById();
|
});
|
});
|
|
// 显示电池总数
|
$(document).ready(function(){
|
searchAllBattNum($('#batt_group_num'));
|
});
|
|
// 初始化页面高度
|
$(function (){
|
initPage();
|
$(window).resize(function() {
|
initPage();
|
});
|
});
|
|
|
// 生成图表
|
$(function () {
|
// 拖动容器大小后图表自动改变
|
$(window).resize(function() {
|
graph.resize();
|
});
|
|
// 点击图标隐藏筛选内容
|
$('.graph').click(function(){
|
var btn = $('.filter-header .filter-header-btn a.hide-body');
|
btn.removeClass('hide-body')
|
.addClass('show-body')
|
.text('显示筛选');
|
$('.filter .filter-body').slideUp();
|
});
|
$('.graph').dblclick(function() {
|
$(this).toggleClass('fixed');
|
graph.resize();
|
});
|
});
|
|
// 点击筛选条件生成对应的折线统计图
|
$(function () {
|
// 点击筛选按钮显示和隐藏筛选内容
|
$('.filter-header .filter-header-btn a').click(function() {
|
toggleFilter($(this));
|
});
|
// 点击连接生成对应的filter导航
|
$('.filter .filter-body .filter-content').on('click', 'a:not(.active)', function() {
|
$('.filter .filter-body .filter-content a').removeClass('active');
|
$(this).addClass('active');
|
changeFilterNav();
|
specialGraph(); // 根据特定的值生成图表
|
});
|
|
// 点击复选框更新折线图
|
$('.filter .filter-content .check').on('click', 'input', function() {
|
specialGraph(); // 根据特定的值生成图表
|
});
|
|
// 点击全部选中取消选择更新图表
|
$('.filter .filter-content .btn .all-check').click(function() {
|
var check = $('.filter .filter-content .check input');
|
check.each(function() {
|
$(this).attr('checked', true);
|
});
|
|
specialGraph(); // 根据特定的值生成图表
|
});
|
|
// 点击全部不选中取消选择更新图表
|
$('.filter .filter-content .btn .no-check').click(function() {
|
var check = $('.filter .filter-content .check input');
|
check.each(function() {
|
$(this).attr('checked', false);
|
});
|
|
specialGraph(); // 根据特定的值生成图表
|
});
|
|
// 点击反选更新图表
|
$('.filter .filter-content .btn .invert-check').click(function() {
|
var check = $('.filter .filter-content .check input');
|
check.each(function() {
|
if($(this).is(':checked')) {
|
$(this).attr('checked', false);
|
}else {
|
$(this).attr('checked', true);
|
}
|
});
|
|
specialGraph(); // 根据特定的值生成图表
|
});
|
|
});
|
|
// 格式化日期插件内容为中文和日期格式为'yy-mm-dd'
|
jQuery(function($){
|
$.datepicker.regional['zh-CN'] = {
|
closeText: '关闭',
|
prevText: '<上月',
|
nextText: '下月>',
|
currentText: '今天',
|
monthNames: ['一月','二月','三月','四月','五月','六月',
|
'七月','八月','九月','十月','十一月','十二月'],
|
monthNamesShort: ['一','二','三','四','五','六',
|
'七','八','九','十','十一','十二'],
|
dayNames: ['星期日','星期一','星期二','星期三','星期四','星期五','星期六'],
|
dayNamesShort: ['周日','周一','周二','周三','周四','周五','周六'],
|
dayNamesMin: ['日','一','二','三','四','五','六'],
|
weekHeader: '周',
|
dateFormat: 'yy-mm-dd',
|
firstDay: 1,
|
isRTL: false,
|
showMonthAfterYear: true,
|
yearSuffix: '年'};
|
$.datepicker.setDefaults($.datepicker.regional['zh-CN']);
|
});
|
|
// 设置页面中的jquery ui的插件
|
$(function() {
|
// 定义左导航可以左右拖动
|
$('.left-content').resizable({
|
minWidth: 240,
|
maxWidth: 520,
|
handles: 'e',
|
edge: 10
|
});
|
|
// 定义筛选条件的日期插件
|
$('.filter .filter-start-time').datepicker({
|
minDate: '-3Y',
|
maxDate: getToday(),
|
changeMonth: true,
|
changeYear: true,
|
onClose: function(selectedDate) {
|
var startTime = getDateObj(selectedDate);
|
var endTime = getDateObj($('.filter .filter-end-time').val());
|
if(startTime.start!=endTime.start) {
|
$('.filter .filter-end-time').val(startTime.end);
|
}
|
changeFilterNav(); // 更改筛选导航条
|
searchHistoryDataById(); // 获取历史信息
|
$('.filter .filter-end-time').datepicker('option', 'minDate', selectedDate);
|
}
|
});
|
$('.filter .filter-end-time').datepicker({
|
maxDate: getToday(),
|
changeMonth: true,
|
changeYear: true,
|
onClose: function(selectedDate) {
|
var startTime = getDateObj($('.filter .filter-start-time').val());
|
var endTime = getDateObj(selectedDate);
|
if(startTime.start!=endTime.start) {
|
$('.filter .filter-start-time').val(endTime.start);
|
}
|
changeFilterNav(); // 更改筛选导航条
|
searchHistoryDataById(); // 获取历史信息
|
$('.filter .filter-start-time').datepicker('option', 'maxDate', selectedDate);
|
}
|
});
|
});
|
|
|
$(function() {
|
// 设置筛选的时间段
|
var date = getDateObj(getToday());
|
|
$('.filter .filter-start-time').val(date.start);
|
$('.filter .filter-end-time').val(date.today);
|
changeFilterNav(); // 更改筛选的导航
|
seachAllStation(); //查询所有机房
|
});
|
//查询所有机房
|
function seachAllStation(){
|
$.ajax({
|
type: "post",
|
url: "BattInfAction!serchAllStation",
|
async:true,
|
dataType:'text',
|
data:null,
|
success: function(data){
|
data = eval('('+data+')');
|
var model = eval('('+data.result+')');
|
console.info(model);
|
if(model.code == 1){
|
console.info("查询成功");
|
createLsideFir($('#lside'), model.data); // 生成一级导航
|
var stationId=getQueryString("stationId"); // 获取机房的ID
|
if(stationId != undefined && stationId>0) {
|
isFirLoadPage = 0;
|
searchkBattByStationid(stationId);
|
}else {
|
searchkBattByStationid(model.data[0].StationId);
|
}
|
|
}
|
},
|
error:function(){
|
|
}
|
});
|
}
|
|
/**
|
* 生成左侧一级导航
|
* @param array mList 一级导航的数据机房名称,机房ID
|
* [{StationName:string,StationId:string}...]
|
*/
|
function createLsideFir(contain,mList){
|
// 清除contain的内容
|
contain.text('');
|
var _ul = $('<ul></ul>');
|
// 遍历mList根据其数据生成页面中的内容
|
for (var i = 0; i < mList.length; i++) {
|
var _li = $('<li></li>');
|
var _a = $('<a href="javascript:;" id="'+mList[i].StationName+'" class="fir" name="'+mList[i].StationId+'"><strong class="arrow down"></strong><span></span>'+mList[i].StationName+'</a>');
|
_li.append(_a);
|
_ul.append(_li);
|
}
|
|
contain.append(_ul);
|
loading.hideLoading(contain);
|
// 在id为mach_num的div显示内容
|
var MachineRoom = $('#lside .fir').length;
|
$('#room_num').text(MachineRoom);
|
}
|
/**
|
* 生成左侧二级导航
|
* @param array mList 一级导航的数据机房名称,机房ID
|
* [{StationName:string,StationId:string,BattGroupId:string,BattGroupName:string}...]
|
*/
|
function createLsideSec(mList, batterId){
|
var _stationId = mList[0].StationId;
|
//console.info(_stationId);
|
// 根据_stationId的值确定要生成二级导航的位置
|
var _fir = $('#lside .fir');
|
|
_fir.each(function() {
|
if($(this).attr('name') == _stationId) {
|
$(this).next('ul').remove();
|
$(this).children('strong.arrow').removeClass('down').addClass('up');
|
|
var _ul = $('<ul style="display:block"></ul>');
|
var _li = $('<li></li>');
|
var _a = $('<a href="javascript:;" class="sec" id="'+mList[0].StationId+'" eid="'+mList[0].FBSDeviceId+'" value="'+mList[0].StationName+'" style="display:none"></a>');
|
_li.append(_a);
|
var __ul = $('<ul style="display: block"></ul>');
|
var tagStr = "";
|
// 遍历mList生成第二级内容
|
for(var _i = 0; _i < mList.length; _i++) {
|
tagStr += '<li><a href="javascript:;" class="thr" id="'+mList[_i].BattGroupId+'" eid="'+mList[0].FBSDeviceId+'">'+mList[_i].BattGroupName+'</a></li>';
|
|
}
|
var __li = $(tagStr);
|
__ul.append(__li);
|
_li.append(__ul);
|
_ul.append(_li);
|
$(this).after(_ul);
|
var battId = getQueryString('battgroupId');
|
if(isFirLoadPage) {
|
isFirLoadPage = 0;
|
//console.info(123);
|
var firTag = $('#lside .fir').eq(0).next().find('.thr').eq(0);
|
var firId = firTag.attr('id');
|
firTag.css('background-color', '#9bbaf3');
|
firTag.addClass('act');
|
BattGroupId = firId;
|
}else if(battId != undefined && batterId == undefined){
|
$(this).next().find('.thr').each(function() {
|
if($(this).attr('id') == battId) {
|
$(this).css('background-color', '#9bbaf3');
|
$(this).addClass('act');
|
BattGroupId = battId;
|
location.hash = '#'+battId;
|
}
|
});
|
}else if(batterId > 0){
|
$(this).next().find('.thr').each(function() {
|
if($(this).attr('id') == batterId) {
|
$('#lside a').css('background-color', "");
|
$(this).css('background-color', '#9bbaf3');
|
$(this).addClass('act');
|
BattGroupId = batterId;
|
location.hash = '#'+batterId;
|
}
|
});
|
}
|
getBattStr();
|
searchHistoryDataById();
|
}
|
});
|
}
|
|
// 根据左导航的状态确定一级菜单的图表
|
function changeFirImg(ele) {
|
var _status = ele.get(0).style.display;
|
if(_status == 'block') {
|
ele.siblings('a').children('.arrow').removeClass('down').addClass('up');
|
}else {
|
ele.siblings('a').children('.arrow').removeClass('up').addClass('down');
|
}
|
}
|
|
// 根据机房id和电池组id定位
|
function locationBattPos(stationid, battId) {
|
var _firTag = $('#lside .fir[name="'+stationid+'"]');
|
|
if(_firTag.next('ul').length == 0) {
|
addLoadingToMenu(stationid); // 添加数据加载等待
|
$.ajax({
|
type: "post",
|
url: "BattInfAction!serchBattByStation",
|
async:true,
|
dataType:'text',
|
data:"json = "+JSON.stringify({
|
StationId:stationid
|
}),
|
success: function(data){
|
data = eval('('+data+')');
|
var model = eval('('+data.result+')');
|
removeLoadingMenu(stationid); // 移除数据加载等待
|
if(model.code == 1){
|
battinlist.push(model.data);
|
createLsideSec(model.data, battId);
|
}
|
},
|
error:function(){
|
|
}
|
});
|
}else {
|
var _ul = _firTag.next();
|
_ul.slideDown();
|
_ul.find('.thr').each(function() {
|
if($(this).attr('id') == battId) {
|
$('#lside a').css('background-color', "");
|
$(this).css('background-color', '#9bbaf3');
|
BattGroupId = battId;
|
location.hash = '#'+battId;
|
}
|
});
|
getBattStr();
|
}
|
}
|
//根据机房id查询电池组
|
function searchkBattByStationid(stationid){
|
addLoadingToMenu(stationid);
|
$.ajax({
|
type: "post",
|
url: "BattInfAction!serchBattByStation",
|
async:true,
|
dataType:'text',
|
data:"json = "+JSON.stringify({
|
StationId:stationid
|
}),
|
success: function(data){
|
data = eval('('+data+')');
|
var model = eval('('+data.result+')');
|
console.info(model);
|
removeLoadingMenu(stationid); // 移除数据加载等待
|
if(model.code == 1){
|
battinlist.push(model.data);
|
createLsideSec(model.data);
|
}
|
},
|
error:function(){
|
|
}
|
});
|
}
|
// 向页面的左侧添加加载等待
|
function addLoadingToMenu(stationId) {
|
var ele = $('#lside .fir[name="'+stationId+'"]');
|
var marginLeft = $('#lside').width()/2 - 95; // 获取容器的高度
|
console.info($('#lside').width());
|
var _div = $('<div class="loading-menu"></div>');
|
var _img = $('<img src="image/right-menu-loading.gif" alt="数据加载中..." />');
|
_div.append(_img);
|
_div.css({
|
'width': '100%',
|
'padding': '10px 0'
|
});
|
_img.css({
|
'margin-left':marginLeft+'px'
|
});
|
ele.after(_div);
|
}
|
|
// 清除左侧的数据等待
|
function removeLoadingMenu(stationId) {
|
var ele = $('#lside .fir[name="'+stationId+'"]');
|
ele.next('.loading-menu').remove();
|
}
|
|
// 根据电池组ID获取当前的机房+电池的字符串
|
function getBattStr() {
|
var battInfo = getBatt();
|
console.info(battInfo);
|
var battStr = battInfo.StationName+'-'+battInfo.BattGroupName;
|
$('#address_infor').text(battStr);
|
}
|
//根据当前选中的电池组id获取当前电池组的信息
|
function getBatt(){
|
if(battinlist!=undefined && BattGroupId!=undefined){
|
for(var i=0;i<battinlist.length;i++){
|
for(var k=0;k<battinlist[i].length;k++){
|
if(BattGroupId==battinlist[i][k].BattGroupId){
|
return battinlist[i][k];
|
}
|
}
|
}
|
}
|
return undefined;
|
}
|
|
// 根据设备id和电池组id查询历史数据
|
function searchHistoryDataById() {
|
var battId = $('#lside .act').attr('id');
|
var eId = $('#lside .act').attr('eid');
|
//console.info(battId+"***"+eId);
|
var temp = {
|
dev_id:eId,
|
BattGroupId:battId,
|
rec_datetime:$('.filter-start-time').val()+" 00:00:00",
|
rec_datetime1:$('.filter-end-time').val()+" 23:59:59",
|
};
|
loading.showLoading();
|
$('.no-data').hide();
|
$.ajax({
|
type: "post",
|
url: "Batt_historyAction!serchByCondition",
|
async:true,
|
dataType:'text',
|
data:"json = "+JSON.stringify(temp),
|
success: function(data){
|
data = eval('('+data+')');
|
var model = eval('('+data.result+')');
|
console.info(model);
|
if(model.code != 0) {
|
createData(model.data);
|
}else {
|
graph.clear();
|
$('.no-data').show();
|
}
|
|
loading.hideLoading();
|
},
|
error:function(){
|
loading.hideLoading();
|
}
|
});
|
}
|
|
|
var record_time_arr; //曲线图横坐标
|
var group_vol_arr; //组端电压折线图
|
var online_vol_arr; //在线电压数据
|
var group_tmp_arr; //组端温度数据
|
var group_curr_arr; //组端电流数据
|
var mon_vol_arr; //单体电压数据
|
var mon_tmp_arr; //单体温度数据
|
var mon_res_arr; //单体内阻数据
|
var mon_ser_arr; //单体电导数据
|
var conn_res_arr; //连接条阻抗
|
var mon_num; // 单体编号
|
|
//构造数据
|
function createData(list){
|
record_time_arr = new Array(); //曲线图横坐标
|
group_vol_arr = new Array(); //组端电压折线图
|
online_vol_arr = new Array(); //在线电压数据
|
group_tmp_arr = new Array(); //组端温度数据
|
group_curr_arr = new Array(); //组端电流数据
|
mon_vol_arr = new Array(); //单体电压数据
|
mon_tmp_arr = new Array(); //单体温度数据
|
mon_res_arr = new Array(); //单体内阻数据
|
mon_ser_arr = new Array(); //单体电导数据
|
conn_res_arr = new Array(); //连接条阻抗
|
mon_num = new Array(); // 单体编号
|
|
var mon_count = 0; // 单体总数
|
for(var i=0;list!=undefined && i<list.length;i++){
|
if(i == 0){
|
for(var j=0;j<list[i].batt_count;j++){
|
mon_vol_arr.push(new Array()); //单体电压数据
|
mon_tmp_arr.push(new Array()); //单体温度数据
|
mon_res_arr.push(new Array()); //单体内阻数据
|
mon_ser_arr.push(new Array()); //单体电导数据
|
conn_res_arr.push(new Array()); //连接条阻抗
|
}
|
}
|
record_time_arr.push(list[i].rec_datetime);
|
group_vol_arr.push(list[i].group_vol);
|
online_vol_arr.push(list[i].online_vol);
|
group_tmp_arr.push(list[i].group_tmp);
|
group_curr_arr.push(list[i].group_curr);
|
|
var mon_caps = list[i].mon_caps.split(',');
|
var mon_conn_ress = list[i].mon_conn_ress.split(',');
|
var mon_ress = list[i].mon_ress.split(',');
|
var mon_tmps = list[i].mon_tmps.split(',');
|
var mon_vols = list[i].mon_vols.split(',');
|
var mon_sers = list[i].mon_sers.split(',');
|
mon_count = list[i].batt_count;
|
for(var j=0;j<list[i].batt_count;j++){
|
mon_vol_arr[j].push(mon_vols[j]); //单体电压数据
|
mon_tmp_arr[j].push(mon_tmps[j]); //单体温度数据
|
mon_res_arr[j].push(mon_ress[j]); //单体内阻数据
|
mon_ser_arr[j].push(mon_sers[j]); //单体电导数据
|
conn_res_arr[j].push(mon_conn_ress[j]);
|
}
|
}
|
|
for(var i=0; i<mon_count; i++) {
|
mon_num.push('#'+(i+1));
|
}
|
/* console.info(record_time_arr);
|
console.info("组端电压"+group_vol_arr);
|
console.info("在线电压"+online_vol_arr);
|
console.info("组端温度"+group_tmp_arr);
|
console.info("组端电流"+group_curr_arr);
|
console.info("单体电压"+mon_vol_arr);
|
console.info("单体温度"+mon_tmp_arr);
|
console.info("单体内阻"+mon_res_arr);
|
console.info("单体电导"+mon_ser_arr);
|
console.info("连接条阻抗"+conn_res_arr);
|
console.info("单体编号"+mon_num); */
|
|
specialGraph(); // 生成特定的图表
|
createMonList(mon_num); // 生成单体列表
|
}
|
|
function createGraph(ech,obj) {
|
//console.info(obj);
|
ech.clear(); // 清空echarts
|
var _obj = new Object();
|
_obj.xData = obj.xData?obj.xData:[];
|
_obj.yData = obj.yData?obj.yData:[];
|
_obj.unit = obj.unit?obj.unit: '';
|
_obj.lname = obj.lname?obj.lname:'';
|
var opt = {
|
title: {
|
text: ''
|
},
|
tooltip: {
|
show:true,
|
trigger:'axis',
|
formatter: function(params) {
|
//console.info(params)
|
var res = params[0].name+'<br>';
|
for(var i=0;i<params.length;i++) {
|
var color = params[i].color;
|
var marker = '<span style="display:inline-block;margin-right:5px;border-radius:10px;width:9px;height:9px;background-color:'+color+';"></span>';
|
res += marker;
|
res += params[i].seriesName+":";
|
res += params[i].value+_obj.unit+'<br>';
|
}
|
return res;
|
}
|
},
|
toolbox:{
|
show : true,
|
feature : {
|
|
}
|
},
|
grid: {
|
left: '3%',
|
right: '4%',
|
bottom: '3%',
|
containLabel: true
|
},
|
calculable : true,
|
xAxis: {
|
data: _obj.xData
|
},
|
yAxis: {
|
name: _obj.unit,
|
type: 'value'
|
},
|
series: function() {
|
var rs = [];
|
for(var i=0; i<_obj.yData.length; i++) {
|
var item= {
|
name: _obj.lname[i],
|
type: 'line',
|
data: _obj.yData[i]
|
};
|
rs.push(item);
|
}
|
|
//console.info(rs);
|
return rs;
|
}()
|
};
|
|
ech.setOption(opt);
|
}
|
|
// 生成折线图对象
|
function getGraphObj(xData, yData, unit, lname) {
|
var rs = new Object();
|
rs.xData = xData;
|
rs.yData = yData;
|
rs.unit = unit;
|
rs.lname = lname;
|
return rs;
|
}
|
|
// 根据筛选条件的返回特定的值
|
function specialGraph() {
|
var num = $('.filter .filter-content a.active').attr('number');
|
//console.info(num);
|
var graphObj = new Object();
|
switch(num) {
|
case '01': // 组端电压
|
var new_group_vol_arr = new Array();
|
new_group_vol_arr.push(group_vol_arr);
|
graphObj = getGraphObj(record_time_arr, new_group_vol_arr, "V", ['组端电压']);
|
break;
|
case '02': // 在线电压
|
var new_online_vol_arr = new Array();
|
new_online_vol_arr.push(online_vol_arr);
|
graphObj = getGraphObj(record_time_arr, new_online_vol_arr, "V", ['在线电压']);
|
break;
|
case '03': // 组端温度
|
var new_group_tmp_arr = new Array();
|
new_group_tmp_arr.push(group_tmp_arr);
|
graphObj = getGraphObj(record_time_arr, new_group_tmp_arr, "℃", ['组端温度']);
|
break;
|
case '04': // 组端电流
|
var new_group_curr_arr = new Array();
|
new_group_curr_arr.push(group_curr_arr);
|
graphObj = getGraphObj(record_time_arr, new_group_curr_arr, "A", ['组端电流']);
|
break;
|
case '11': // 单体电压
|
var new_mon_vol_arr = getArrByStatus(mon_vol_arr);
|
var new_mon_num = getArrByStatus(mon_num);
|
graphObj = getGraphObj(record_time_arr, new_mon_vol_arr, "V", new_mon_num);
|
break;
|
case '12': // 单体温度
|
var new_mon_tmp_arr = getArrByStatus(mon_tmp_arr);
|
var new_mon_num = getArrByStatus(mon_num);
|
graphObj = getGraphObj(record_time_arr, new_mon_tmp_arr, "℃", new_mon_num);
|
break;
|
case '13': // 单体内阻
|
var new_mon_res_arr = getArrByStatus(mon_res_arr);
|
var new_mon_num = getArrByStatus(mon_num);
|
graphObj = getGraphObj(record_time_arr, new_mon_res_arr, "Ω", new_mon_num);
|
break;
|
case '14': // 单体电导
|
var new_mon_ser_arr = getArrByStatus(mon_ser_arr);
|
var new_mon_num = getArrByStatus(mon_num);
|
graphObj = getGraphObj(record_time_arr, new_mon_ser_arr, "", new_mon_num);
|
break;
|
case '15': // 连接条阻抗
|
var new_conn_res_arr = getArrByStatus(conn_res_arr);
|
var new_mon_num = getArrByStatus(mon_num);
|
graphObj = getGraphObj(record_time_arr, new_conn_res_arr, "", new_mon_num);
|
break;
|
}
|
|
createGraph(graph, graphObj);
|
}
|
|
|
/**
|
获取当前日期yy-mm-dd
|
*/
|
function getToday() {
|
var rs = "";
|
var date = new Date();
|
var year = date.getFullYear();
|
var month = date.getMonth()+1;
|
var day = date.getDate();
|
rs = year+'-'+month+'-'+day;
|
//console.info(rs);
|
return rs;
|
}
|
|
/**
|
根据日期获取日期的当月的开头,结尾以及年,月,日
|
@param string date 日期yy-mm-dd
|
@return obj rs 日期对象(当月开头,结尾,年月日)
|
*/
|
function getDateObj (date) {
|
var date_arr = date.split('-');
|
var rs = new Object();
|
rs.year = date_arr[0]; // 年
|
rs.month = date_arr[1]; // 月
|
rs.day = date_arr[2]; // 日
|
rs.start = rs.year+'-'+rs.month+'-'+'1'; // 月开始时间
|
|
var end = getMonthEndDay(rs.year, rs.month);
|
rs.end = rs.year+'-'+rs.month+'-'+end; // 月结束时间
|
rs.today = date; // 当前时间
|
//console.info(rs);
|
return rs;
|
}
|
|
/*
|
获取当前月的最后一天
|
@param mixed year 年
|
@param mixed month 月
|
@return string rs 时间yy-mm-dd
|
*/
|
function getMonthEndDay(year,month) {
|
var rs = 30;
|
if(month==1||month==3||month==5||month==7||month==8||month==10||month==12) {
|
rs = 31;
|
}
|
if(month == 2) {
|
var a1=year%4==0;
|
|
var a2=year%100!=0;
|
|
var a3=year%400==0;
|
|
rs=(a1&&a2)||a3?28:29;//三目运算符
|
}
|
|
return rs;
|
}
|
|
/*
|
根据单体编号生成列表
|
@param array monlist 单体编号
|
*/
|
function createMonList(monlist) {
|
// 遍历monlist向筛选的复选框容器添加内容
|
var check = $('.filter .filter-content .check');
|
check.text(" ");
|
var ul = $('<ul></ul>');
|
for(var i=0; i<monlist.length; i++) {
|
var li = $('<li>'+monlist[i]+'<input type="checkbox" checked="checked"></li>');
|
ul.append(li);
|
}
|
check.append(ul);
|
}
|
|
/*
|
根据单体列表选中内容筛选单体信息
|
@param array datalist 需要筛选的数据
|
*/
|
function getArrByStatus(datalist){
|
var check = $('.filter .filter-content .check input');
|
var status = new Array();
|
var rs = new Array();
|
check.each(function() {
|
if($(this).is(':checked')) {
|
status.push(1);
|
}else {
|
status.push(0);
|
}
|
});
|
|
// 遍历datalist根据status生成新的数组
|
for(var i=0; i<datalist.length; i++) {
|
if(status[i] == 1) {
|
rs.push(datalist[i]);
|
}
|
}
|
|
return rs;
|
}
|
|
// 初始化高度
|
function initPage() {
|
var bodyHt = $('body').height();
|
var screenHt = $(window).height();
|
|
if(screenHt > bodyHt ) {
|
var shiftHt = 395+screenHt-bodyHt;
|
|
$('#lside').height(shiftHt);
|
$('.graph').height(shiftHt);
|
graph.resize();
|
}
|
}
|
</script>
|
</body>
|
</html>
|