|
|
|
@ -15,7 +15,7 @@
|
|
|
|
|
</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: 0px 10px;">
|
|
|
|
|
<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>
|
|
|
|
@ -30,7 +30,7 @@
|
|
|
|
|
<div class="layui-inline">
|
|
|
|
|
<label class="layui-form-label">登录时间</label>
|
|
|
|
|
<div class="layui-input-inline">
|
|
|
|
|
<input type="text" class="layui-input" id="test5" name="loginTime"
|
|
|
|
|
<input type="text" class="layui-input" id="test5" name="timeZones"
|
|
|
|
|
placeholder="请输入登录时间">
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
@ -45,36 +45,23 @@
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<table id="teacherTable" lay-filter="teacherTable"></table>
|
|
|
|
|
<div class="layui-row" style="margin-bottom:10px;padding-right: 110px;"><h2>在线人数变化折线图:</h2></div>
|
|
|
|
|
<div class="layui-row">
|
|
|
|
|
<div class="layui-inline">
|
|
|
|
|
<label class="layui-form-label">登录时间</label>
|
|
|
|
|
<div class="layui-input-inline">
|
|
|
|
|
<input type="text" class="layui-input" id="test6" name="loginTime"
|
|
|
|
|
placeholder="请输入登录时间">
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="layui-inline" style="margin-left: 20px">
|
|
|
|
|
<button type="button" class="layui-btn layui-btn-normal" id="dateSearch"><i class="layui-icon"></i>搜索</button>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<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: 'datetime'
|
|
|
|
|
});
|
|
|
|
|
laydate.render({
|
|
|
|
|
elem: '#test6'
|
|
|
|
|
, type: 'date'
|
|
|
|
|
, range: '~'
|
|
|
|
|
, trigger: 'click'
|
|
|
|
|
});
|
|
|
|
|
function getDate() {
|
|
|
|
|
window.setTimeout(function () {
|
|
|
|
@ -108,6 +95,7 @@
|
|
|
|
|
method : 'get',
|
|
|
|
|
size:"lg",
|
|
|
|
|
url : Common.ctxPath + '/jlw/student/studentLogAnalysisList.json' // 数据接口
|
|
|
|
|
, where: {'loginStartTime': getDate(), 'loginEndTime': Common.getNowDate()}
|
|
|
|
|
,page : Lib.tablePage // 开启分页
|
|
|
|
|
,limit : 10,
|
|
|
|
|
cols : [ [ // 表头
|
|
|
|
@ -128,7 +116,7 @@
|
|
|
|
|
{
|
|
|
|
|
field : 'onLineCount', title : '实时在线人数',align: "center"
|
|
|
|
|
}
|
|
|
|
|
] ]
|
|
|
|
|
]]
|
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
toolbar = {
|
|
|
|
@ -141,7 +129,14 @@
|
|
|
|
|
Lib.doSearchForm($("#searchForm"), teacherTable, 1);
|
|
|
|
|
},
|
|
|
|
|
search:function () {
|
|
|
|
|
Lib.doSearchForm($("#searchForm"), teacherTable, 1);
|
|
|
|
|
//Lib.doSearchForm($("#searchForm"), teacherTable, 1);
|
|
|
|
|
teacherTable.reload({
|
|
|
|
|
where: getParam(),
|
|
|
|
|
page: {
|
|
|
|
|
curr: 1
|
|
|
|
|
}
|
|
|
|
|
});
|
|
|
|
|
count();
|
|
|
|
|
},import:function (){
|
|
|
|
|
var url = "/jlw/teacher/importPage.do";
|
|
|
|
|
Common.openDlg(url,"");
|
|
|
|
@ -156,27 +151,63 @@
|
|
|
|
|
var type = $(this).data('type');
|
|
|
|
|
toolbar[type] ? toolbar[type].call(this) : '';
|
|
|
|
|
});
|
|
|
|
|
var chartDom = document.getElementById('monitor');
|
|
|
|
|
var myChart= echarts.init(chartDom);
|
|
|
|
|
var option = {
|
|
|
|
|
title: {
|
|
|
|
|
left: 'center',
|
|
|
|
|
text: '在线人数'
|
|
|
|
|
},
|
|
|
|
|
xAxis: {
|
|
|
|
|
type: 'category',
|
|
|
|
|
data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun']
|
|
|
|
|
},
|
|
|
|
|
yAxis: {
|
|
|
|
|
type: 'value'
|
|
|
|
|
},
|
|
|
|
|
series: [
|
|
|
|
|
{
|
|
|
|
|
data: [150, 230, 224, 218, 135, 147, 260],
|
|
|
|
|
type: 'line'
|
|
|
|
|
}
|
|
|
|
|
]
|
|
|
|
|
};
|
|
|
|
|
option && myChart.setOption(option);
|
|
|
|
|
|
|
|
|
|
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>
|
|
|
|
|