|
|
<!--#layout("/common/layout.html",{"jsBase":"/js/jlw/teacher/"}){ -->
|
|
|
<script type="text/javascript" src="${ctxPath}/plugins/echarts.min_4.8.0.js?v=${jsVer}"></script>
|
|
|
<!--统计报表页面-->
|
|
|
<style>
|
|
|
.layui-laypage .layui-laypage-curr .layui-laypage-em,button{
|
|
|
background-color: #73a2f8 !important;
|
|
|
}
|
|
|
/* 分页确定按钮*/
|
|
|
.layui-laypage-btn{
|
|
|
color: white!important;
|
|
|
}
|
|
|
.xxmc{
|
|
|
white-space: nowrap;text-overflow:ellipsis;line-height: 37px;font-size: 16px;padding-left: 10px;width: auto;min-width: 200px;max-width: 300px;overflow: hidden;height: 37px;
|
|
|
}
|
|
|
</style>
|
|
|
<div class="layui-inline" style="margin-bottom:10px;padding-right: 110px;"><h2>总人数统计：</h2></div>
|
|
|
<div class="layui-inline">
|
|
|
<form id="searchForm" class="layui-form" style="background-color: #fdfdfd;padding: 10px 0;margin-bottom: 15px;">
|
|
|
<!--#if(isSignRole.get()!''!= 2){ -->
|
|
|
<div class="layui-inline">
|
|
|
<label class="layui-form-label">所属院校</label>
|
|
|
<div class="layui-input-inline">
|
|
|
<layui:simpleDictSelect style='layui-input-inline'
|
|
|
type="universities_colleges.universities_colleges_name.universities_colleges_status=1"
|
|
|
id="universitiesCollegesId" name="universitiesCollegesId"
|
|
|
layFilter="select_universitiesColleges"/>
|
|
|
</div>
|
|
|
</div>
|
|
|
<!--#} -->
|
|
|
<div class="layui-inline">
|
|
|
<label class="layui-form-label">登录时间</label>
|
|
|
<div class="layui-input-inline">
|
|
|
<input type="text" class="layui-input" id="test5" name="timeZones"
|
|
|
placeholder="请输入登录时间">
|
|
|
</div>
|
|
|
</div>
|
|
|
</form>
|
|
|
</div>
|
|
|
|
|
|
<div class="layui-btn-group" style="margin-bottom:16px;margin-left: 20px;">
|
|
|
<layui:accessButton function="teacher.query" id="searchFormSearch" action="search"><i
|
|
|
class="layui-icon"></i>搜索
|
|
|
</layui:accessButton>
|
|
|
<layui:accessButton function="teacher.add" action="export"><span class="iconfont"></span>导出</layui:accessButton>
|
|
|
</div>
|
|
|
|
|
|
<table id="teacherTable" lay-filter="teacherTable"></table>
|
|
|
<div class="layui-row" style="margin-bottom:10px;padding-top: 60px;"><h2>在线人数变化折线图：</h2></div>
|
|
|
|
|
|
<!-- 为 ECharts 准备一个定义了宽高的 DOM，必须定义宽高才可以显示 -->
|
|
|
<div style="width: 100%;height: 300px" id="monitor"></div>
|
|
|
<!--#} -->
|
|
|
<script>
|
|
|
layui.use([ 'form', 'laydate', 'table' ], function(){
|
|
|
var form = layui.form;
|
|
|
var laydate = layui.laydate;
|
|
|
var table = layui.table;
|
|
|
var teacherTable = null;
|
|
|
|
|
|
laydate.render({
|
|
|
elem: '#test5'
|
|
|
, type: 'date'
|
|
|
, range: '~'
|
|
|
, trigger: 'click'
|
|
|
});
|
|
|
function getDate() {
|
|
|
window.setTimeout(function () {
|
|
|
window.requestAnimationFrame(getDate)
|
|
|
}, 1000 / 2);
|
|
|
var d = new Date();
|
|
|
var year = d.getFullYear(); //获取年
|
|
|
var month = d.getMonth() + 1; //获取月，从 Date 对象返回月份 (0 ~ 11)，故在此处+1
|
|
|
var day = d.getDay(); //获取日
|
|
|
var days = d.getDate(); //获取日期
|
|
|
var hour = d.getHours(); //获取小时
|
|
|
var minute = d.getMinutes(); //获取分钟
|
|
|
var second = d.getSeconds(); //获取秒
|
|
|
if (month < 10) month = "0" + month;
|
|
|
if (days < 10) days = "0" + days;
|
|
|
if (hour < 10) hour = "0" + hour;
|
|
|
if (minute < 10) minute = "0" + minute;
|
|
|
if (second < 10) second = "0" + second;
|
|
|
var week = new Array("星期日", "星期一", "星期二", "星期三", "星期四", "星期五", "星期六")
|
|
|
var Tools = document.getElementById("Main");
|
|
|
var da = year + "-" + (month - 1) + "-" + days + " " + "00:00:00";
|
|
|
if(month === "01"){
|
|
|
da = (year-1) + "-" +12+ "-" + days + " " + "00:00:00";
|
|
|
}
|
|
|
//var da=year+" 年 "+month+" 月 "+days+" 日 "+week[day]+" "+hour+" : "+minute+" :"+second
|
|
|
return da;
|
|
|
}
|
|
|
teacherTable = table.render({
|
|
|
elem : '#teacherTable',
|
|
|
height : Lib.getTableHeight(),
|
|
|
cellMinWidth: 100,
|
|
|
even:true,
|
|
|
// skin:'nob',
|
|
|
method : 'get',
|
|
|
size:"lg",
|
|
|
url : Common.ctxPath + '/jlw/student/studentLogAnalysisList.json' // 数据接口
|
|
|
, where: {'loginStartTime': getDate(), 'loginEndTime': Common.getNowDate()}
|
|
|
,page : Lib.tablePage // 开启分页
|
|
|
,limit : 10,
|
|
|
cols : [ [ // 表头
|
|
|
{
|
|
|
field : 'time', title : '日期',align: "center"
|
|
|
},
|
|
|
{
|
|
|
field: 'universitiesCollegesName', title: '登录院校', align: "center",
|
|
|
hide: "${isSignRole.get()!''}" != 2 ? false : true
|
|
|
},
|
|
|
{
|
|
|
field: 'universitiesCollegesProvince', title: '所属省份', align: "center",
|
|
|
hide: "${isSignRole.get()!''}" != 2 ? false : true,
|
|
|
},
|
|
|
{
|
|
|
field : 'loginCount', title : '登录人数',align: "center"
|
|
|
},
|
|
|
{
|
|
|
field : 'onLineCount', title : '实时在线人数',align: "center"
|
|
|
}
|
|
|
]]
|
|
|
});
|
|
|
|
|
|
toolbar = {
|
|
|
add : function() { // 获取选中数据
|
|
|
var url = "/jlw/teacher/add.do";
|
|
|
Common.openDlg(url,"教师管理/添加教师");
|
|
|
},
|
|
|
refresh: function () {//刷新
|
|
|
searchForm.reset();
|
|
|
Lib.doSearchForm($("#searchForm"), teacherTable, 1);
|
|
|
},
|
|
|
search:function () {
|
|
|
//Lib.doSearchForm($("#searchForm"), teacherTable, 1);
|
|
|
teacherTable.reload({
|
|
|
where: getParam(),
|
|
|
page: {
|
|
|
curr: 1
|
|
|
}
|
|
|
});
|
|
|
count();
|
|
|
},import:function (){
|
|
|
var url = "/jlw/teacher/importPage.do";
|
|
|
Common.openDlg(url,"");
|
|
|
},export: function () {//导出 /jlw/student/studentLogListExport.json
|
|
|
layer.confirm('是否确定导出统计报表吗？', function (index) {
|
|
|
window.open(Common.ctxPath + "/jlw/student/studentLogAnalysisListExport.json");
|
|
|
layer.close(index);
|
|
|
});
|
|
|
}
|
|
|
};
|
|
|
$('.ext-toolbar').on('click', function() {
|
|
|
var type = $(this).data('type');
|
|
|
toolbar[type] ? toolbar[type].call(this) : '';
|
|
|
});
|
|
|
|
|
|
count();
|
|
|
function count() {
|
|
|
var onLineCountData = [];//在线人数Data
|
|
|
var timeData = [];//日期Date
|
|
|
var url = '/jlw/student/studentLogAnalysisList.json';
|
|
|
var param = getParam();
|
|
|
param.page = 1;
|
|
|
param.limit = 1000;
|
|
|
var ret = Common.getAjax(url, param);
|
|
|
var data = ret.data;
|
|
|
if (ret.code == 0) {
|
|
|
data.forEach(function(v, k) {
|
|
|
onLineCountData.push(v.onLineCount);
|
|
|
timeData.push(v.time)
|
|
|
});
|
|
|
var chartDom = document.getElementById('monitor');
|
|
|
var myChart= echarts.init(chartDom);
|
|
|
|
|
|
var option = {
|
|
|
title: {
|
|
|
left: 'center',
|
|
|
text: '在线人数'
|
|
|
},
|
|
|
xAxis: {
|
|
|
type: 'category',
|
|
|
data: timeData
|
|
|
},
|
|
|
yAxis: {
|
|
|
type: 'value'
|
|
|
},
|
|
|
series: [
|
|
|
{
|
|
|
data: onLineCountData,
|
|
|
type: 'line'
|
|
|
}
|
|
|
]
|
|
|
};
|
|
|
option && myChart.setOption(option);
|
|
|
}
|
|
|
}
|
|
|
});
|
|
|
|
|
|
function getParam(checkStatus) {
|
|
|
var codePlural = "";
|
|
|
var param = {};
|
|
|
if (!$.isEmpty(checkStatus)) {
|
|
|
codePlural = Common.concatBatchId(checkStatus.data, "code");
|
|
|
}
|
|
|
if ($.isEmpty(codePlural)) {
|
|
|
param = $("#searchForm").serializeJson();
|
|
|
param.loginStartTime = param.timeZones.split(' ~ ')[0];
|
|
|
param.loginEndTime = param.timeZones.split(' ~ ')[1];
|
|
|
delete param.timeZones;
|
|
|
} else {
|
|
|
param.codePlural = codePlural;
|
|
|
}
|
|
|
return param;
|
|
|
}
|
|
|
</script>
|