$(function(){ //页面淡入效果 $(".animsition").animsition({ inClass : 'fade-in', outClass : 'fade-out', inDuration : 300, outDuration : 1000, // e.g. linkElement : 'a:not([target="_blank"]):not([href^=#])' loading : false, loadingParentElement : 'body', //animsition wrapper element loadingClass : 'animsition-loading', unSupportCss : [ 'animation-duration', '-webkit-animation-duration', '-o-animation-duration' ], //"unSupportCss" option allows you to disable the "animsition" in case the css property in the array is not supported by your browser. //The default setting is to disable the "animsition" in a browser that does not support "animation-duration". overlay : false, overlayClass : 'animsition-overlay-slide', overlayParentElement : 'body' }); document.onreadystatechange = subSomething; function subSomething() { if(document.readyState == "complete"){ $('#loader').hide(); } } //顶部时间 function getTime(){ var myDate = new Date(); var myYear = myDate.getFullYear(); //获取完整的年份(4位,1970-????) var myMonth = myDate.getMonth()+1; //获取当前月份(0-11,0代表1月) var myToday = myDate.getDate(); //获取当前日(1-31) var myDay = myDate.getDay(); //获取当前星期X(0-6,0代表星期天) var myHour = myDate.getHours(); //获取当前小时数(0-23) var myMinute = myDate.getMinutes(); //获取当前分钟数(0-59) var mySecond = myDate.getSeconds(); //获取当前秒数(0-59) var week = ['星期日','星期一','星期二','星期三','星期四','星期五','星期六']; var nowTime; nowTime = myYear+'-'+fillZero(myMonth)+'-'+fillZero(myToday)+'  '+week[myDay]+'  '+fillZero(myHour)+':'+fillZero(myMinute)+':'+fillZero(mySecond); $('.topTime').html(nowTime); }; function fillZero(str){ var realNum; if(str<10){ realNum = '0'+str; }else{ realNum = str; } return realNum; } setInterval(getTime,1000); function totalNum(obj,speed){ var singalNum = 0; var timer; var totalNum = obj.attr('total'); if(totalNum){ timer = setInterval(function(){ singalNum+=speed; if(singalNum>=totalNum){ singalNum=totalNum; clearInterval(timer); } obj.html(singalNum); },1); } } var myChart2 = echarts.init(document.getElementById('myChart2')); var myChart3 = echarts.init(document.getElementById('myChart3')); var option2 = { legend: { type: 'scroll', orient: 'vertical', right: 10, top: 20, bottom: 20, textStyle:{//图例文字的样式 color:'#ccc' }, data: [ {value: 10, name: '缺水报警'}, {value: 5, name: '缺清洁剂'}, {value: 15, name: '缺消毒水'}, {value: 25, name: '复位异常'}, {value: 20, name: '阻碍物异常'}, {value: 35, name: '断电异常'} ], }, series: [ { // name: '姓名', type: 'pie', radius: '55%', label: { normal: { position: 'inner', show : false } }, center: ['40%', '50%'], data: [ {value: 10, name: '缺水报警'}, {value: 5, name: '缺清洁剂'}, {value: 15, name: '缺消毒水'}, {value: 25, name: '复位异常'}, {value: 20, name: '阻碍物异常'}, {value: 35, name: '断电异常'} ], emphasis: { itemStyle: { shadowBlur: 10, shadowOffsetX: 0, shadowColor: 'rgba(0, 0, 0, 0.5)' } } } ] }; var option3 = { tooltip: { trigger: 'item', formatter: function(params) { var res = params.name+'使用次数为:'+params.data; return res; } }, grid: { top: '5%', left: '0%', width: '100%', height: '95%', containLabel: true }, xAxis: { data: ['1月','2月','3月','4月','5月','6月','7月','8月','9月','10月','11月','12月'], axisLabel: { show: true, textStyle: { fontSize: '12px', color: '#fff', } }, axisLine:{ lineStyle:{ color:'#fff', width:1, } } }, yAxis: { axisLabel: { show: true, textStyle: { fontSize: '12px', color: '#fff', } }, axisLine:{ lineStyle:{ color:'#fff', width:1, } }, splitLine:{ show:false, } }, series :{ name: '', type: 'bar', barWidth : 10, data: ['5','14','3','6','8','18','11','4','8','7','16','13'], itemStyle: { normal: { barBorderRadius:[5, 5, 5, 5], color: new echarts.graphic.LinearGradient( 0, 0, 0, 1, [ {offset: 0, color: '#3876cd'}, {offset: 0.5, color: '#45b4e7'}, {offset: 1, color: '#54ffff'} ] ), }, }, }, } //列表文字滚动 $('#FontScroll').FontScroll({time: 3000,num: 1}); $('#FontScroll2').FontScroll({time: 5000,num: 1}); setTimeout(function(){ $('.progress').each(function(i,ele){ var PG = $(ele).attr('progress'); var PGNum = parseInt(PG); var zero = 0; var speed = 50; var timer; $(ele).find('h4').html(zero+'%'); if(PGNum<10){ $(ele).find('.progressBar span').addClass('bg-red'); $(ele).find('h3 i').addClass('color-red'); }else if(PGNum>=10 && PGNum<50){ $(ele).find('.progressBar span').addClass('bg-yellow'); $(ele).find('h3 i').addClass('color-yellow'); }else if(PGNum>=50 && PGNum<100){ $(ele).find('.progressBar span').addClass('bg-blue'); $(ele).find('h3 i').addClass('color-blue'); }else{ $(ele).find('.progressBar span').addClass('bg-green'); $(ele).find('h3 i').addClass('color-green'); } $(ele).find('.progressBar span').animate({width: PG},PGNum*speed); timer = setInterval(function(){ zero++; $(ele).find('h4').html(zero+'%'); if(zero==PGNum){ clearInterval(timer); } },speed); }); //总计清洗次数 totalNum($('#totalNum'),10); myChart2.setOption(option2); myChart3.setOption(option3); },500); $(window).resize(function(){ myChart2.resize(); myChart3.resize(); }); // setInterval(getAlarmRecord,15000); function getAlarmRecord(){ var list = null; $.ajax({ url:"/asl-admin/index/alarmRecordList.htm", type:"get", contentType: "application/json;charset=utf-8", dataType: "json", success: function(data){ list = data[0].id; } }); var da = list; var ta = da; console.log("list:",list); }; });