/** * Created by xuxueli on 17/4/24. */ $(function () { // filter Time var rangesConf = {}; rangesConf[I18n.daterangepicker_ranges_today] = [moment().startOf('day'), moment().endOf('day')]; rangesConf[I18n.daterangepicker_ranges_yesterday] = [moment().subtract(1, 'days').startOf('day'), moment().subtract(1, 'days').endOf('day')]; rangesConf[I18n.daterangepicker_ranges_this_month] = [moment().startOf('month'), moment().endOf('month')]; rangesConf[I18n.daterangepicker_ranges_last_month] = [moment().subtract(1, 'months').startOf('month'), moment().subtract(1, 'months').endOf('month')]; rangesConf[I18n.daterangepicker_ranges_recent_week] = [moment().subtract(1, 'weeks').startOf('day'), moment().endOf('day')]; rangesConf[I18n.daterangepicker_ranges_recent_month] = [moment().subtract(1, 'months').startOf('day'), moment().endOf('day')]; $('#filterTime').daterangepicker({ autoApply:false, singleDatePicker:false, showDropdowns:false, // 是否显示年月选择条件 timePicker: true, // 是否显示小时和分钟选择条件 timePickerIncrement: 10, // 时间的增量,单位为分钟 timePicker24Hour : true, opens : 'left', //日期选择框的弹出位置 ranges: rangesConf, locale : { format: 'YYYY-MM-DD HH:mm:ss', separator : ' - ', customRangeLabel : I18n.daterangepicker_custom_name , applyLabel : I18n.system_ok , cancelLabel : I18n.system_cancel , fromLabel : I18n.daterangepicker_custom_starttime , toLabel : I18n.daterangepicker_custom_endtime , daysOfWeek : I18n.daterangepicker_custom_daysofweek.split(',') , // '日', '一', '二', '三', '四', '五', '六' monthNames : I18n.daterangepicker_custom_monthnames.split(',') , // '一月', '二月', '三月', '四月', '五月', '六月', '七月', '八月', '九月', '十月', '十一月', '十二月' firstDay : 1 }, startDate: rangesConf[I18n.daterangepicker_ranges_recent_week][0] , endDate: rangesConf[I18n.daterangepicker_ranges_recent_week][1] }, function (start, end, label) { freshChartDate(start, end); }); freshChartDate(rangesConf[I18n.daterangepicker_ranges_recent_week][0], rangesConf[I18n.daterangepicker_ranges_recent_week][1]); /** * fresh Chart Date * * @param startDate * @param endDate */ function freshChartDate(startDate, endDate) { $.ajax({ type : 'POST', url : base_url + '/chartInfo', data : { 'startDate':startDate.format('YYYY-MM-DD HH:mm:ss'), 'endDate':endDate.format('YYYY-MM-DD HH:mm:ss') }, dataType : "json", success : function(data){ if (data.code == 200) { lineChartInit(data) pieChartInit(data); } else { layer.open({ title: I18n.system_tips , btn: [ I18n.system_ok ], content: (data.msg || I18n.job_dashboard_report_loaddata_fail ), icon: '2' }); } } }); } /** * line Chart Init */ function lineChartInit(data) { var option = { title: { text: I18n.job_dashboard_date_report }, tooltip : { trigger: 'axis', axisPointer: { type: 'cross', label: { backgroundColor: '#6a7985' } } }, legend: { data:[I18n.joblog_status_suc, I18n.joblog_status_fail, I18n.joblog_status_running] }, toolbox: { feature: { /*saveAsImage: {}*/ } }, grid: { left: '3%', right: '4%', bottom: '3%', containLabel: true }, xAxis : [ { type : 'category', boundaryGap : false, data : data.content.triggerDayList } ], yAxis : [ { type : 'value' } ], series : [ { name:I18n.joblog_status_suc, type:'line', stack: 'Total', areaStyle: {normal: {}}, data: data.content.triggerDayCountSucList }, { name:I18n.joblog_status_fail, type:'line', stack: 'Total', label: { normal: { show: true, position: 'top' } }, areaStyle: {normal: {}}, data: data.content.triggerDayCountFailList }, { name:I18n.joblog_status_running, type:'line', stack: 'Total', areaStyle: {normal: {}}, data: data.content.triggerDayCountRunningList } ], color:['#00A65A', '#c23632', '#F39C12'] }; var lineChart = echarts.init(document.getElementById('lineChart')); lineChart.setOption(option); } /** * pie Chart Init */ function pieChartInit(data) { var option = { title : { text: I18n.job_dashboard_rate_report , /*subtext: 'subtext',*/ x:'center' }, tooltip : { trigger: 'item', formatter: "{b} : {c} ({d}%)" }, legend: { orient: 'vertical', left: 'left', data: [I18n.joblog_status_suc, I18n.joblog_status_fail, I18n.joblog_status_running ] }, series : [ { //name: '分布比例', type: 'pie', radius : '55%', center: ['50%', '60%'], data:[ { name:I18n.joblog_status_suc, value:data.content.triggerCountSucTotal }, { name:I18n.joblog_status_fail, value:data.content.triggerCountFailTotal }, { name:I18n.joblog_status_running, value:data.content.triggerCountRunningTotal } ], itemStyle: { emphasis: { shadowBlur: 10, shadowOffsetX: 0, shadowColor: 'rgba(0, 0, 0, 0.5)' } } } ], color:['#00A65A', '#c23632', '#F39C12'] }; var pieChart = echarts.init(document.getElementById('pieChart')); pieChart.setOption(option); } });