• 0108


    require.config({
        baseUrl:'/static/ui/common/',
        paths:{
           'jquery':'js/libs/jquery-1.11.1.min',
           'domReady':'js/functionality/domReady',
            'ztree.core':'plugins/other/ztree/jquery.ztree.core',
            'ztree.excheck':'plugins/other/ztree/jquery.ztree.excheck',
            'tree':'plugins/formElems/downTree/ztreeSelect',
           'util':'js/functionality/Util',
            'echart':'plugins/chart/echarts.min',
            'DialogBySHF':'plugins/formElems/dialogbyshf/js/DialogBySHF',
            'nicescroll':'plugins/other/nicescroll/jquery.nicescroll.min',
           'bootstrap':'plugins/other/ipanel/bootstrap.min'
        },
        shim:{
            'bootstrap':{deps:['jquery']},
            'ztree.core':{deps:['jquery']},
            'ztree.excheck':{deps:['ztree.core']}
        }
    });
    var dateArr="";
    var rTransformerTreeCode="";
    require(['jquery','domReady','util','echart','DialogBySHF','ztree.core','ztree.excheck','tree','nicescroll']
    ,function($,domReady,util,echart){
        var image_path=[];
        domReady(function(){
            var ztreeObj;
            var params={
                zoomVal:1
            }
            $('#areaCodeSelect').selZtree({
                url:'/sys/companyInfo/findAllcomInfo',
                dataParams:null,
                initValue:null,
                onchange:function(){
                    image_path=ztreeObj.getNodeByParam('id',$('#areaCodeSelect').val()).imagePath.split(';');
                    console.log(image_path);
                },
                onclick:function(selnode){
                    // $('.ipn-tools li.cur').trigger('click');
                    //initTreeLoad('/busin/deviceTree/findAllDeviceTrees');
                    //将树中的rTransformerTreeCode放入input做隐藏字段
                    //$("#areaCodeSelect").attr("rTransformerTreeCode",selnode[0].rTransformerTreeCode);
                    //触发选中后让框隐藏
                    setTimeout(function () {
                        $('.ztreeInput').blur();
                        // $(document).trigger('click');//全部隐藏
                        $('#areaCodeSelect').parent().find('div.slimScroll').hide(); //让自己隐藏
                    }, 20);
                    //initBottomData('/findEnergyDayDataList')
                    swithData();
                },
                complete:function(ztree,obj){
                    ztreeObj=ztree;
                    image_path=obj.defaultParams.initValue.imagePath.split(';');
                    console.log(image_path);
                    // $('.ipn-tools li.cur').trigger('click');
                    //initTreeLoad('/busin/deviceTree/findAllDeviceTrees');
                    //var relationUrl="/relationForecast/relevanceAnalysis/findRelevanceTreeData?dictSortCode=ambient,yield,";
                    //initTreeLoadTree(relationUrl,[],"relevanceTree");
                    swithData();//加载上下
                    //bottomLine();
                }
            });
            //点击切换图片事件
            $('body').on('click','.img-change i',function(){
                var f=$(this).attr('class');
                $(this).parent().prev('img').css({'margin-left':0,'margin-top':0,'width':'auto','height':'auto'})
                var href=$(this).parent().prev('img').attr('src').replace('/static','');
                var index=image_path.indexOf(href);
                var length=image_path.length;
                var len;
                if(f=='c_left'){
                    if(--index<0){
                        len=length-1;
                    }else{
                        len=index;
                    }
                }else{
                    if(++index<length){
                        len=index;
                    }else{
                        len=0;
                    }
                }
                $(this).parent().prev('img').attr('src','/static'+image_path[len]);
            });
            $('body').on('mousedown','.big-image',function(e){
                var $img=$(this),$parent=$(this).closest('.layer-content');
                var oleft=parseFloat($img.css('margin-left'));
                var otop=parseFloat($img.css('margin-top'));
                var width=parseFloat($img.css('width'));
                var height=parseFloat($img.css('height'));
                var pwidth=parseFloat($parent.css('width'));
                var pheight=parseFloat($parent.css('height'));
                if(isNaN(oleft)){oleft=0;}
                if(isNaN(otop)){otop=0;}
                var ox=e.pageX||e.clientX;
                var oy=e.pageY||e.clientY;
                var x=oleft,y=otop;
                $('body').on('mousemove',function(event){
                    var nx=event.pageX||event.clientX;
                    var ny=event.pageY||event.clientY;
                    x=nx-ox;
                    y=ny-oy;
                    var ll=oleft+x;
                    var tt=otop+y;
                    if(ll>0){ll=0}
                    if(tt>0){tt=0}
                    if((ll-pwidth)<(-1*width)){ll=-(width-pwidth)}
                    if((tt-pheight)<(-1*height)){tt=-(height-pheight)}
                    $img.css({
                        'margin-left':ll+'px',
                        'margin-top':tt+'px'
                        });
                });
                $('body').on('mouseup',function(){
                    $('body').off('mousemove').off('mouseup');
                });
                return false;
            });
            //滚轮效果
            $('body').on('mousewheel','.big-image',function(e){
                console.log("启动滚轮的缩放了");
                params.zoomVal+=event.wheelDelta/1200;
                var o=e.target;
                if (params.zoomVal >= 0.2) {
                    o.style.transform="scale("+params.zoomVal+")";
                } else {
                    params.zoomVal=0.2;
                    o.style.transform="scale("+params.zoomVal+")";
                    return false;
                }
                var delta = (e.originalEvent.wheelDelta && (e.originalEvent.wheelDelta > 0 ? 1 : -1)) ||  // chrome & ie
                            (e.originalEvent.detail && (e.originalEvent.detail > 0 ? -1 : 1));              // firefox
                if (delta > 0) {
                    // 向上滚
                    console.log("wheelup");
                } else if (delta < 0) {
                    // 向下滚
                    console.log("wheeldown");
                }
    
            })
    
    
            /*
            $('body').mousewheel(function(event, delta) {
                var dir = delta > 0 ? 'Up' : 'Down';
                if (dir == 'Up') {
                    console.log('向上滚动');
                } else {
                    console.log('向下滚动');
                }
                return false;
    
            });
            */
            //点击事件日月年
            $(".switch-change li").click(function(){
                $(".switch-change li").removeClass("cur");
                $(this).addClass("cur");
                initBottomData('/findEnergyDayDataList',rTransformerTreeCode);
            })
            //点击变压器弹出事件
            $("#byq").click(function(){
                $.DialogBySHF.Dialog({ Width:1000, Height: 500, Title:"变压器详情", URL: "/demo3Edit?idx="+rTransformerTreeCode});
            })
            //点击配电图弹出图片
            
            //关闭点击时弹出图片
            // $("#img-close").click(function(){
            //     $(this).closest(".dialog-img").remove();
            // })
            $("body").on("click",".dialog-img .img-close",function(e){
                $(e.target).closest(".dialog-img").remove();
            })
        });
        window.imgdialog=function(event){
            var imgstr='/static'+image_path[0];
            //创建一个dialog框
            var id='byqdialog'+new Date().getTime();
            var imghtml=
                '<div id="'+id+'" class="dialog-img">'+
                    '<div class="layer"></div>'+
                    '<div class="layer-content" style="overflow:hidden;76%;height:76%;">'+
                        '<span class="img-close">X</span>'+
                        '<img class="big-image" src="'+imgstr+'" alt="" style="auto;height:auto;cursor:all-scroll;">'+
                        '<p class="img-change"><i class="c_left">&lt</i><i class="c_right">&gt</i><p>'+
                    '</div>'+
                '</div>';
            $("body").append(imghtml);
        }
        function swithData(){
            var id=$("#top-left .ztree").attr("id");
            var treeObj=$.fn.zTree.getZTreeObj(id);
            var selNode=treeObj.getSelectedNodes();
            if(selNode.length>0){
                rTransformerTreeCode=selNode[0].rTransformerTreeCode
            }else{
                rTransformerTreeCode=treeObj.getNodes()[0].rTransformerTreeCode;
            }
            initTopData('/findIndexPage',rTransformerTreeCode);
            initBottomData('/findEnergyDayDataList',rTransformerTreeCode);
        }
        function initBottomData(url,findTransformerSnameList){
            //var rTransformerTreeCode=$("#areaCodeSelect").attr("rTransformerTreeCode");
            //从下拉树中获取到sname
            $.ajax({
                url:"/findTransformerSnameList",
                type:"get",
                data:{treeCode:rTransformerTreeCode,property:"EPdel"},
                dataType:"json",
                success:function(data){
                    if(data.length==0){alert("没有获取到code编码");return}
                    var param={};
                    dateArr=[];
                    var type=$(".switch-change li.cur").index();
                    var dateIndex=0;//天:24,月:28-31天,年:12
                    var xDate=[];
                    param.snames=data.join(";");
                    switch(type){
                        case 0:
                            param.type=0;
                            param.dateTime=new Date().Format("yyyy-MM-dd");
                            dateIndex=24;
                            xDate = Object.keys(Array.apply(null, {length:24})).map(function(item){       
                                return +(parseInt(item)+1)+"时";   
                            });
                            break;
                        case 1:
                            param.type=1;
                            param.dateTime=new Date().Format("yyyy-MM");
                            dateIndex=getMonthDay(param.dateTime);
                            xDate = Object.keys(Array.apply(null, {length:dateIndex})).map(function(item){       
                                return +(parseInt(item)+1)+"日";   
                            });
                            break;
                        case 2:
                            param.type=2;
                            param.dateTime=new Date().Format("yyyy");
                            dateIndex=12;
                            xDate = Object.keys(Array.apply(null, {length:12})).map(function(item){       
                                return +(parseInt(item)+1)+"月";   
                            });
                            break;
                    }
                    //测试数据用
                    //param.dateTime="2018";
                    //param.snames="KJ_GKDZ_DDZY22-Z02_EPdel1;KJ_GKDZ_DDZY22-Z02_EPdel2;KJ_GKDZ_DDZY22-Z02_EPdel3";
                    //param.snames="KJ_SZYF_03_DDZY22_EPdel;KJ_SZYF_02_DDZY22_EPdel;KJ_SZYF_04_DDZY22_EPdel;KJ_SZYF_05_DDZY22_EPdel";
                    dateArr=getDateArr(param.dateTime,type);
                    initbData(param,dateIndex,xDate);
                }
            })
        }
        function getMonthDay(date){
            var year=date.split("-")[0];
            var month=date.split("-")[1];
            var d = new Date(year, month, 0);
            return d.getDate();
        }
        function initbData(param,dateIndex,xDate){
            $.post("/findEnergyDayDataList",param,function(data){
                var mobj={};
                var resObj={};
                var code=param.snames.split(";");
                //var dateArr=["todayDataList","yestodayDataList"];
                for(var i=0;i<dateArr.length;i++){
                    var _date=dateArr[i];
                    var d=data[_date];
                    if(mobj[_date]===undefined){
                        mobj[_date]={};
                    }
                    mobj[_date]=makeObj(d);
                }
                //将所有的code值进行组合成一个
                resObj=getaddArr(mobj,dateArr,code);
                initCurve(resObj,xDate);
                initbottomright(resObj);
                function makeObj(d){
                    var _obj={};
                    var obj={};
                    //分组
                    for(var m=0;m<d.length;m++){
                        if(_obj[d[m]["sname"]]===undefined){
                            _obj[d[m]["sname"]]=(new Array(dateIndex).join("-;")+"-").split(";");
                        }
                        var idx=parseInt(d[m]["time"])-1;
                        _obj[d[m]["sname"]][idx]=d[m]["data"]
                    }
                    for(var j=0;j<code.length;j++){
                        if(_obj[code[j]]===undefined){
                            continue;
                        }else{
                            obj[code[j]]=_obj[code[j]]
                        }
                    }
                    return obj;
                }
            })
        }
        function initbottomright(rowData){
            var t1=0,t2=0,t3=0;
            var type=$(".switch-change .cur").index();
            switch(type){
                case 0:
                    $("#thisday>p>span").text("当日用电");
                    $("#beforeday>p>span").text("昨日用电");
                    break;
                case 1:
                    $("#thisday>p>span").text("当月用电");
                    $("#beforeday>p>span").text("上月用电");
                    break;
                case 2:
                    $("#thisday>p>span").text("今年用电");
                    $("#beforeday>p>span").text("去年用电");
                    break;
            }
            for(var i=0;i<dateArr.length;i++){
                var d=dateArr[i]
                $("#bottom_right li:eq("+i+")").find("span").eq(1).text(arrSum(rowData[d])+"kWh")
            }
            t1=parseInt($("#thisday").children().last().text())
            t2=parseInt($("#beforeday").children().last().text());
            t3=t1-t2;
            if(t2==0||isNaN(t2)){
                $("#huanbi>span").text("0%");
            }else{
                $("#huanbi>span").text(Math.abs((t1-t2)*100/t2).toFixed(2)+"%");
            }
            if(t3>0){
                $("#huanbi").children().last().attr("class","fa fa-fw fa-long-arrow-up")
            }else if(t3<0){
                $("#huanbi").children().last().attr("class","fa fa-fw fa-long-arrow-down")
            }else{
                
            }
        }
    /**
     * @desc 对一个数组进行求和。
     * @param 数组
     * @return {string} sum 
     */
    function arrSum(arr){
        if(!arr||arr.length===0){
            return 0;
        }
        var sum=arr.reduce(function(x,y){
            x=isNaN(x)?0:x;
            y=isNaN(y)?0:y;
            return Number(parseFloat(x)+parseFloat(y)).toFixed(2);
        },0)
        return sum;
    }
        function initCurve(rowData,xDate){
            var keys=Object.keys(rowData).sort().reverse()
            for(var i=0;i<keys.length;i++){
                var k=keys[i];
                if(i==0){
                    for(var m=rowData[k].length;m>0;m--){
                        //如果时间大于当前时间
                        if(m>new Date().getHours()-1){
                            //如果有值
                            if(!rowData[k][m]){
                                rowData[k].length=m;
                            }else{
                                break;
                            }
                        }else{
                            break;
                        }
                    }
                }
            }
            
            var series=[];
            var obj={};
            for(var i=0;i<dateArr.length;i++){
                var _data=dateArr[i];
                series.push({
                    name:dateArr[i],
                    type:'line',
                    smooth:true,
                    itemStyle : 
                    {  
                        normal : {  
                            lineStyle:{
                                3
                            }  
                        }  
                    },
                    symbolSize:10,
                    data:rowData[_data]
                });
            }
            initEc("bottom_line",{
                title : {
                    text: '对比分析',
                    x:'center'
                },
                legend: {
                    data:dateArr,
                    x : 'center',
                // y : 'top',
                    bottom:'7px',
                    type:'scroll'
                },
                xAxis: [{
                    type: 'category',
                    data:xDate,
                    minInterval: 2,
                    axisPointer: {
                        type: 'shadow'
                    }
                }],
                yAxis: [
                    {
                        type: 'value',
                        name:"",
                        //name:unitName,(多选如何显示)
                        axisLabel: {
                            formatter: '{value}'
                        }
                    }
                ],
                series:series
            })
        }
        //初始化echarts
        function initEc(id,op){
            var color=['#0093F1','#45BF98','#F28D4E','#C1232B','#B5C334','#FCCE10',
            '#E87C25','#27727B','#FE8463','#9BCA63','#FAD860','#F3A43B','#60C0DD',
            '#D7504B','#C6E579','#F4E001','#F0805A','#26C0C0'];
            //var unit=unitList[$('#'+id).prev('div').find('.bar-type dt.cur').attr('unit')];
            var option = {
                color:color,
                tooltip: {
                    trigger: 'axis',
                    axisPointer: {
                        type: 'cross',
                        crossStyle: {
                            color: '#999'
                        }
                    }
                },
                calculable:true,
                toolbox: {
                    right:'10px',
                    zlevel:600,
                    z:600,
                    feature: {
                        dataView: {show: true, readOnly: false},
                        magicType: {show: true, type: ['line', 'bar','stack']},
                        restore: {show: true},
                        saveAsImage: {show: true}
                    }
                },
                grid:{
                    left:'70px',
                    right:'70px',
                    bottom:'60px',
                    //x:'10%',
                    //y2:'13%',//距离最下面的边距
                },
                legend: {
                    data:['bar'],
                },
                calculable:true,
                noDataLoadingOption:{   //没有数据时,
                    effect: "bubble",
                    text:"暂无数据",
                    effectOption:{
                        effect:{
                            n:0
                        }
                    },
                    textStyle:{
                        fontSize:32,
                        fontWeight:'bold'
                    }
                },
                xAxis: [
                    {
                        type: 'category',
                        data:[],
                        axisPointer: {
                            type: 'shadow'
                        }
                    }
                ],
                yAxis: [
                    {
                        type: 'value',
                        //name:unit,
                        name:"千瓦时",
                        axisLabel: {
                            formatter: '{value}'
                        }
                    }
                ],
                series: [{
                    name:'line',
                    type:'line',
                    data:[]
                }]
            };
            var myChart = echart.init(document.getElementById(id));
            myChart.setOption($.extend({},option,op),true);  
            myChart.resize();
        }
        function getaddArr(dataObj,dateArr,code){
            var resultObj={};
            for(var i=0;i<dateArr.length;i++){
                resultObj[dateArr[i]]=getArr(dataObj[dateArr[i]]);
            }
            return resultObj;
            function getArr(obj){
                var arr=[];
                for(var key in obj){
                    for(var i=0;i<obj[key].length;i++){
                        var _arr=arr[i];
                        if(_arr==""||_arr==null||isNaN(_arr)){
                            arr[i]=0;
                        }
                        arr[i]+=parseFloat(obj[key][i]);
                    }
                }
                for(var m=0;m<arr.length;m++){
                    if(arr[m]==0){continue}
                    if(isNaN(arr[m])){continue}
                    arr[m]=Number(arr[m]).toFixed(2);
                }
                return arr;
            }
        }
        function getDateArr(date,type){
            var arr=[];
            if(type===0){//
                arr=getSubSeven(date,2);
            }else if(type===1){//
                arr=getMonthArr(date,2);
            }else if(type===2){//
                arr=[new Date().getFullYear()+"",new Date().getFullYear()-1+""]
            }else{
                
            }
            return arr;
        }
        /**
         * 传入一个日期的天数,往前面减day天,得到数组
         */
        function getSubSeven(sDate,day){
            var arr=[];
            var sTime=new Date(sDate).getTime();
            var subTime=sTime-(86400000*day)
            for(var i=sTime;i>subTime;i-=86400000){
                arr.push(new Date(i).Format("yyyy-MM-dd"));
            }
            return arr;
        }
        /**
         * @desc 得到最近n个月份的数组
         * @param {Number} sDate 开始月份
         * @param {Int} n 向前推的月份数
         * return  {Array} 
         */
        function getMonthArr(sDate,n){
            var arr=[];
            arr.push(sDate);
            while(n>1){
                arr.unshift(getBeforMonth(sDate));
                sDate=getBeforMonth(sDate);
                n--;
            }
            return arr;
        }
        function getBeforMonth(date){
            var lastMonth="";
            var year=date.split("-")[0],month=date.split("-")[1];
            if(month==1){
                lastMonth=(year-1)+"-"+12;
            }else{
                lastMonth=year+"-"+add0(month-1);
            }
            return lastMonth;
        }
        function add0(n){
            if(parseFloat(n)<10){
                return "0"+n;
            }else{
                return n;
            }
        }
        function initTopData(url,findTransformerSnameList){
            $.post(url,{treeCode:rTransformerTreeCode},function(data){
                var obj=JSON.parse(JSON.stringify(data))
                //设置属性和值
                $(".top-left>li").eq(0).find("span").text((!!data.voltageClass?Number(data.voltageClass).toFixed(2):'-')+"kV")
                $(".top-left>li").eq(1).find("span").text((!!data.transformerNum?Number(data.transformerNum).toFixed(2):'-')+"台")
                $(".top-left>li").eq(2).find("span").text((!!data.ratedCapacity?Number(data.ratedCapacity).toFixed(2):'-')+"kVA")
                $(".top-left>li").eq(3).find("span").text((!!data.demandNum?Number(data.demandNum).toFixed(2):'-')+"kW")
                $(".top-left>li").eq(4).find("span").text((!!data.controlDevMS?Number(data.controlDevMS).toFixed(2):'-')+"个")
                $(".top-left>li").eq(5).find("span").text((!!data.measuringPointNum?Number(data.measuringPointNum).toFixed(2):'-')+"个")
                $(".top-status>li").eq(0).find(".mdata").text((!!data.currentLoad?Number(data.currentLoad).toFixed(2):'-')+"kW")
                $(".top-status>li").eq(1).find(".mdata").text((!!data.currentElectric?Number(data.currentElectric).toFixed(2):'-')+"A")
                $(".top-status>li").eq(2).find(".mdata").text((!!data.monthMaxDeman?Number(data.monthMaxDeman).toFixed(2):'-')+"kW")
                $(".top-status>li").eq(3).find(".mdata").text((!!data.environTemperate?Number(data.environTemperate).toFixed(2):'-')+"℃")
            })
        }
        /**
         * 左下角的曲线
         */
        function bottomLine(){
            var date=new Date();
            var x=[57,25,22,14,51,48,43,47,53,67,73,53,27,27,14,19,21,47,54,73,67,53,27,24];
            x.length=date.getHours();
                ec = echart.init($('#bottom_line')[0]);//初始化echart
                option = {
                tooltip : {
                        trigger: 'axis',
                        axisPointer : {            // 坐标轴指示器,坐标轴触发有效
                            type : 'shadow'        // 默认为直线,可选为:'line' | 'shadow'
                        }
                    },
                    legend: {
                        data:['昨日用电','今日用电'],
                        bottom:10
                    },
                    calculable : true,
                    xAxis : [
                        {
                            type : 'category',
                            boundaryGap : true,
                            data : ['0时','1时','2时','3时','4时','5时','6时','7时','8时','9时','10时','11时','12时','13时','14时','15时','16时','17时','18时','19时','20时','21时','22时','23时']
                        }
                    ],
                    yAxis : [
                        {
                            name : 'kWh',
                            type : 'value',
                            axisLabel : {
                                formatter: '{value} '
                            },                   
                        }
                    ],
                    series : [
                        {
                            name:'今日负荷',
                            type:'line',
                            smooth:true,
                            itemStyle : 
                            {  
                                normal : {  
                                    lineStyle:{
                                        3
                                    }  
                                }  
                            },
                        symbolSize:10,
                        data:x
                        },
                        {
                            name:'昨日负荷',
                            type:'line',
                            smooth:true,
                            itemStyle : 
                            {  
                                normal : {  
                                    lineStyle:{
                                        3
                                    }  
                                }  
                            },
                        symbolSize:10,
                        data:[50, 62, 77,80,92,91,90,73,67,53,27,14,19,25,22,14,21,47,54,57,51,48,43,47]
                        }
                    ]
                };
                ec.setOption(option, true);
            }
        }
    );

  • 相关阅读:
    IE设置代理后登录QQ再关闭代理仍然可以使用QQ
    ubuntu14.04下Qt开发环境搭建遇到的问题
    CButtonST使用技巧: CButtonST简介
    springboot webapi 支持跨域 CORS
    服务注册和发现 Eureka
    开发框架 springBoot
    springBoot springCloud
    springBoot 微服务
    springBoot AOP环绕增强、自定义注解、log4j2、MDC
    springBoot 热部署
  • 原文地址:https://www.cnblogs.com/pengfei25/p/10240693.html
Copyright © 2020-2023  润新知