lxw
2020-07-11 9db52f2f2dd3665fe9da1ae5657e0167c3a34d40
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382
383
384
385
386
387
388
389
390
391
392
393
394
395
396
397
398
399
400
401
402
403
404
405
406
407
408
409
410
411
412
413
414
415
416
417
418
419
420
421
422
423
424
425
426
427
428
429
430
431
432
433
434
435
436
437
438
439
440
441
442
443
444
445
446
447
448
449
450
451
452
453
454
455
456
457
458
459
460
461
462
463
464
465
466
467
468
469
470
471
472
473
474
475
476
477
478
479
480
481
482
483
484
485
486
487
488
489
490
491
492
493
494
495
496
497
498
499
500
501
502
503
504
505
506
507
508
509
510
511
512
513
514
515
516
517
518
519
520
521
522
523
524
525
526
527
528
529
530
531
532
533
534
535
536
537
538
539
540
541
542
543
544
545
546
547
548
549
550
551
552
553
554
555
556
557
558
559
560
561
562
563
564
565
566
567
568
569
570
571
572
573
574
575
576
577
578
579
580
581
582
583
584
585
586
587
588
589
590
591
592
593
594
595
596
597
598
599
600
601
602
603
604
605
606
607
608
609
610
611
612
613
614
615
616
617
618
619
620
621
622
623
624
625
626
627
628
629
630
631
632
633
634
635
636
637
638
639
640
641
642
643
644
645
646
647
648
649
650
651
652
653
654
655
656
657
658
659
660
661
662
663
664
665
666
667
668
669
670
671
672
673
674
675
676
677
678
679
680
681
682
683
684
685
686
687
688
689
690
691
692
693
694
695
696
697
698
699
700
701
702
703
704
705
706
707
708
709
710
711
712
713
714
715
716
717
718
719
720
721
722
723
724
725
726
727
728
729
730
731
732
733
734
735
736
737
738
739
740
741
742
743
744
745
746
747
748
749
750
751
752
753
754
755
756
757
758
759
760
761
762
763
764
765
766
767
768
769
770
771
772
773
774
775
776
777
778
779
780
781
782
783
784
785
786
787
788
789
790
791
792
793
794
795
796
797
798
799
800
801
802
803
804
805
806
807
808
809
810
811
812
813
814
815
816
817
818
819
820
821
822
823
824
825
826
827
828
829
830
831
832
833
834
835
836
837
838
839
840
841
842
843
844
845
846
847
848
849
850
851
852
853
854
855
856
857
858
859
860
861
862
863
864
865
866
867
868
869
870
871
872
873
874
875
876
877
878
879
880
881
882
883
884
885
886
887
888
889
890
891
892
893
894
895
896
897
898
899
900
901
902
903
904
905
906
907
908
909
910
911
912
913
914
915
916
917
918
919
920
921
922
923
924
925
926
927
928
929
930
931
932
933
934
935
936
937
938
939
940
941
942
943
944
945
946
947
948
949
950
951
952
953
954
955
956
957
958
959
960
961
962
963
964
965
966
967
968
969
970
971
972
973
974
975
976
977
978
979
980
981
982
983
984
985
986
987
988
989
990
991
992
993
994
995
996
997
998
999
1000
1001
1002
1003
1004
1005
1006
1007
1008
1009
1010
1011
1012
1013
1014
1015
1016
1017
1018
1019
<%@ 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>;&nbsp;<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: '&#x3c;上月',
              nextText: '下月&#x3e;',
              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>