image.png
<!--
* @Author: mabo 9086467+mabo19920219@user.noreply.gitee.com
* @Date: 2022-11-16 13:58:48
* @LastEditors: mabo 9086467+mabo19920219@user.noreply.gitee.com
* @LastEditTime: 2023-02-01 10:01:03
* @FilePath: \dataList\businessSta.html
* @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
-->
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<link rel="stylesheet" href="./layui/css/layui.css" media="all" />
<link rel="stylesheet" href="./css/public.css" media="all" />
<link rel="stylesheet" href="./css/businessSta.css?v=1" media="all" />
<style>
</style>
<title>资料访问统计</title>
</head>
<body style="background: white !important">
<div class="business-container">
<div class="layui-row">
<div class="layui-col-md12">
<div class="layui-tab" lay-filter="tabChange">
<ul class="layui-tab-title">
<li class="layui-this">用户统计</li>
<li>资料统计</li>
</ul>
<div class="layui-tab-content">
<div class="layui-tab-item layui-show">
<form class="layui-form" action="">
<div class="layui-form-item">
<label class="layui-form-label">登录ID:</label>
<div class="layui-input-inline">
<input type="text" id="userNameOne" name="loginid" placeholder="请输入登录ID"
autocomplete="off" class="layui-input" />
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">用户类型:</label>
<div class="layui-input-inline">
<select id="Category_select" name="remarks" lay-search>
<option value="" selected="selected"></option>
</select>
</div>
</div>
<div class="layui-form-item time-from">
<label class="layui-form-label">时间</label>
<div class="layui-inline">
<div class="layui-input-inline" style="width: 160px;">
<input type="text" class="layui-input" id="start_time" name="start_time"
placeholder="开始时间">
</div>
<div class="layui-form-mid">至</div>
<div class="layui-input-inline" style="width: 160px;">
<input type="text" class="layui-input" id="end_time" name="end_time"
placeholder="">
</div>
<button type="button" lay-filter="formDemo" lay-submit=""
class="layui-btn layui-btn-normal">
<i class="layui-icon"></i>
检索</button>
<button type="button" class="layui-btn layui-btn-gray" onclick="exportData()">
<i class="layui-icon"></i>
导出</button>
</div>
</div>
</form>
<table id="demo" lay-filter="test-filter-two"></table>
<div id="openProductBox" style="display: none; padding: 10px;">
<table id="openProductTable" style="width:100%" lay-filter="openProductTable"></table>
<div class="openProduct-charts">
<div id="time-charts"></div>
</div>
</div>
</div>
<div class="layui-tab-item">
<form class="layui-form new-form">
<div class="layui-form-item">
<label class="layui-form-label">数据名称：</label>
<div class="layui-input-inline">
<input type="text" name="title" id="dataNames" placeholder="请输入标题"
autocomplete="off" class="layui-input" />
</div>
</div>
<div class="layui-form-item time-from">
<label class="layui-form-label">时间</label>
<div class="layui-inline">
<div class="layui-input-inline" style="width: 160px;">
<input type="text" class="layui-input" id="start_times" name="start_times"
placeholder="开始时间">
</div>
<div class="layui-form-mid">至</div>
<div class="layui-input-inline" style="width: 160px;">
<input type="text" class="layui-input" id="end_times" name="end_times"
placeholder="">
</div>
<button type="button" class="layui-btn layui-btn-normal" lay-filter="formDemo2"
lay-submit="">
<i class="layui-icon"></i>
检索</button>
<button type="button" class="layui-btn layui-btn-gray"
onclick="exportStaData()">
<i class="layui-icon"></i>
导出</button>
</div>
</div>
<!-- <table id="demos" lay-filter="tests"></table> -->
</form>
<table id="demos" lay-filter="test-filter"></table>
<div id="openProductBoxs" style="display: none; padding: 10px;">
<table id="openProductTables" style="width:100%" lay-filter="openProductTables"></table>
<div class="openProduct-chartss">
<div id="time-chartsTwo"></div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<script src="./layui/layui.js"></script>
<script src="./js/echarts.min.js"></script>
<!-- <script src="./js/businessSta.js"></script> -->
<script src="./js/dayjs.min.js"></script>
<script>
layui.use(['element', 'jquery', 'layer', 'form', 'laydate', 'table', 'laypage'], function () {
var laydate = layui.laydate;
var laypage = layui.laypage;
var element = layui.element;
var $ = layui.$;
var table = layui.table;
var form = layui.form;
var myDate = new Date(); //获取当前时间设置选择时间的范围
// var maxtime = myDate.getFullYear() + "-" + (myDate.getMonth() + 1) + "-" + (myDate.getDate()); //拼接当前是时间
var startDate = laydate.render({
elem: '#start_time',
eventElem: '.date-input-icon',
value: (dayjs().subtract(2, 'month')).format('YYYY-MM-DD'),
done: function (value, date, endDate) {
var startDate = new Date(value).getTime();
var endTime =new Date($('#end_time').val()).getTime();
if (endTime < startDate) {
layer.msg('不能小大于结束时间');
$('#start_time').val('');
}
}
});
var endDate = laydate.render({
elem: '#end_time',
eventElem: '.date-input-icon',
value: dayjs(Date.now()).format('YYYY-MM-DD'),
done: function (value, date, endDate) {
var startDate = new Date($('#start_time').val()).getTime();;
var endTime =new Date(value).getTime()
if (endTime < startDate) {
layer.msg('不能小于开始时间');
$('#end_time').val('');
}
}
});
var startDates = laydate.render({
elem: '#start_times',
eventElem: '.date-input-icon',
value: (dayjs().subtract(2, 'month')).format('YYYY-MM-DD'),
done: function (value, date, endDate) {
var startDate = new Date(value).getTime();
var endTime =new Date($('#end_times').val()).getTime();
if (endTime < startDate) {
layer.msg('不能小大于结束时间');
$('#start_times').val('');
}
}
})
var endDates = laydate.render({
elem: '#end_times',
eventElem: '.date-input-icon',
value: dayjs(Date.now()).format('YYYY-MM-DD'),
done: function (value, date, endDate) {
var startDate = new Date($('#start_times').val()).getTime();;
var endTime =new Date(value).getTime()
if (endTime < startDate) {
layer.msg('不能小于开始时间');
$('#start_times').val('');
}
}
});
$.ajax({
type: "get",
url: "/a/udi/opt/dataCensus/getUserRemarks",
data: null,
dataType: 'json',
success: function (result) {
var datas = "";
var data = result.DS;
for (var i = 0; i < data.length; i++) {
datas += "<option value='" + data[i] + "'>" + data[i] + "</option>";
}
$('#Category_select').append(datas);
form.render('select');
},
error: function (error) {
$.modal.alertWarning("获取模版数据失败");
}
});
//点击行 弹框
table.on('row(test-filter-two)', function (obj) {
impNum(obj.data.loginid, obj.data.loginid)
window.sessionStorage.setItem('userNames', obj.data.loginid)
});
//点击行 弹框
table.on('row(test-filter)', function (obj) {
if (obj.data.dataName) {
impNumTwo(obj.data.dataCode, obj.data.dataName)
window.sessionStorage.setItem('dataNames', obj.data.dataName)
} else {
impNumTwo(obj.data.dataCode, '')
window.sessionStorage.setItem('dataNames', '')
}
});
let clickOneTab = function () {
form.on('submit(formDemo)', function (data) {
window.sessionStorage.setItem('setformDataTwo', JSON.stringify(data.field));
getUsersData(data.field)
});
}
clickOneTab
let clickOneTab2 = function () {
form.on('submit(formDemo2)', function (data) {
window.sessionStorage.setItem('setformDatas', JSON.stringify(data.field));
getMeansData(data.field)
});
}
clickOneTab2
//检索
form.on('submit(formDemo)', function (data) {
window.sessionStorage.setItem('setformDataTwo', JSON.stringify(data.field));
getUsersData(data.field)
});
form.on('submit(formDemo2)', function (data) {
window.sessionStorage.setItem('setformDatas', JSON.stringify(data.field));
getMeansData(data.field)
});
function getMeansData(data, orderData) {
let dataList = {
pageNo: 1,
pageSize: '',
endTime: (dayjs(data.end_times)).format('YYYY-MM-DD 23:59:59'),
startTime: (dayjs(data.start_times)).subtract(2, 'month').format('YYYY-MM-DD 00:00:00'),
dataName: data.title,
orderBy: orderData
};
$.ajax({
url: `/a/udi/opt/dataCensus/dataCsList`,
type: 'post',
data: dataList,
success: function (res) {
// 渲染页面
if (res.resultCode == 0) {
// layer.msg('查询成功');
var tableDataTwo = res.DS;
tableDataTwo.forEach(element => {
if (element.downSize > 0) {
element.downSize = (element.downSize / 1024).toFixed(2)
}
});
var count = res.conut;
getTablesData(tableDataTwo, count)
} else {
layer.msg('未查询到数据');
}
}
})
};;
getUsersData({
start_time: (dayjs(Date.now()).subtract(2, 'month')).format('YYYY-MM-DD'),
end_time: dayjs(Date.now()).format('YYYY-MM-DD')
})
function getUsersData(data, orderData) {
let dataList = {
pageNo: 1,
pageSize: '20',
startTime: (dayjs(data.start_time)).format('YYYY-MM-DD 00:00:00'),
endTime: (dayjs(data.end_time)).format('YYYY-MM-DD 23:59:59'),
orderBy: orderData,
remarks: data.remarks,
loginid: data.loginid
};
$.ajax({
url: `/a/udi/opt/dataCensus/userCsList`,
type: 'post',
data: dataList,
success: function (res) {
// 渲染页面
if (res.resultCode == 0) {
// layer.msg('查询成功');
var tableDataOne = res.DS
tableDataOne.forEach(element => {
element.downSize = (element.downSize / 1024).toFixed(2)
});
var count = res.conut;
getTableData(tableDataOne, count)
} else {
layer.msg('未查询到数据');
}
}
})
};
function getTableData(tableDataOne, count) {
table.render({
elem: '#demo',
height: 890,
data: tableDataOne,
page: true, //开启分页
count: count,
limit: 20,
parseData: function (res) { //将原始数据解析成 table 组件所规定的数据
return {
"code": res.resultCode, //解析接口状态
"message": res.resMessage, //解析提示文本
"count": res.count, //解析数据长度
"data": res.DS //解析数据列表
};
},
cols: [
[ //表头
{
field: 'loginid',
title: '登录ID',
sort: false,
unresize: true,
align: 'center'
}, {
field: 'remarks',
title: '用户类型',
align: 'center'
}, {
field: 'dataNum',
title: '资料数',
unresize: true,
sort: true,
align: 'center'
}, {
field: 'downSize',
sort: true,
title: '下载量(MB)',
unresize: true,
align: 'center',
// templet: function (data) {
// var html =
// '<div class="layui-progress layui-progress-big" lay-showPercent="true" lay-filter="rate">';
// html +=
// `<div class="layui-progress-bar layui-bg-blue" lay-percent='${((data.downSize / 1048576) * 100).toFixed(2)}'></div>`;
// html += '<div>'
// return html;
// }
}, {
sort: true,
field: 'visits',
title: '访问量(次)',
unresize: true,
align: 'center'
}
]
],
done: function (value, data) {
element.render();
}
});
}
function getTablesData(tableDataTwo, count) {
table.render({
elem: '#demos',
height: 890,
// url: '/GetDataForLayuiTableLearning.ashx' //数据接口
data: tableDataTwo,
page: true, //开启分页
limit: 20,
parseData: function (res) { //将原始数据解析成 table 组件所规定的数据
return {
"code": res.resultCode, //解析接口状态
"message": res.resMessage, //解析提示文本
"count": res.count, //解析数据长度
"data": res.DS //解析数据列表
};
},
cols: [
[ //表头
{
field: 'dataCode',
title: '资料编码',
align: 'center',
width: '28%',
unresize: true
}, {
field: 'dataName',
align: 'center',
width: '42%',
title : '<span title="资料名">资料名</span>',
templet:'<div><span title="{{d.dataName}}">{{d.dataName}}</span></div>',
unresize: true
}, {
field: 'userNum',
align: 'center',
title: '用户数',
sort: true,
width: '10%',
}, {
field: 'downSize',
align: 'center',
sort: true,
width: '10%',
title: '下载量(MB)',
unresize: true,
// templet: function (data) {
// var html =
// '<div class="layui-progress layui-progress-big" lay-showPercent="true" lay-filter="rate">';
// html +=
// `<div class="layui-progress-bar layui-bg-blue" lay-percent='${((data.downSize / 1048576) * 100).toFixed(2)}'></div>`;
// html += '<div>'
// return html;
// }
}, {
field: 'visits',
width: '10%',
sort: true,
align: 'center',
title: '访问量(次)',
unresize: true
}
]
],
done: function (value, data) {
element.render();
}
});
}
exportData = function () {
var start_timeOne = [$('#start_time').val()];
var end_timeOne = [$('#end_time').val()];
var userNameOne = [$('#userNameOne').val()];
var url =
`/a/udi/opt/dataCensus/userCsExpOut?startTime=${start_timeOne} 00:00:00&endTime=${end_timeOne} 23:59:59&loginid=${userNameOne}&orderBy=down_size desc`
var link = document.createElement("a")
link.href = url
link.click()
URL.revokeObjectURL(url)
}
exportStaData = function () {
var start_timeTwo = [$('#start_times').val()][0];
var end_timeTwo = [$('#end_times').val()][0];
var dataNames = [$('#dataNames').val()][0];
var urls =
`/a/udi/opt/dataCensus/dataCsExpOut?startTime=${start_timeTwo} 00:00:00&endTime=${end_timeTwo} 23:59:59&dataName=${dataNames}&orderBy=down_size desc`
var link = document.createElement("a")
link.href = urls
link.click()
URL.revokeObjectURL(urls)
}
impNum = function (examId, userName) {
var examidSend = examId
window.sessionStorage.setItem('examidSend', examidSend)
var start_timeOnes = [$('#start_time').val()];
var end_timeOnes = [$('#end_time').val()];
$.ajax({
type: "post",
url: '/a/udi/opt/dataCensus/userCsListloginid',
data: {
"orderBy": 'dataNum desc',
"loginid": examId,
"pageNo": 1,
"pageSize": '10',
"startTime": start_timeOnes + ' 00:00:00',
"endTime": end_timeOnes + ' 23:59:59',
},
success: function (data) {
if (data.resultCode == 0) {
var datalists = data.DS;
datalists.forEach(item => {
item.downSize = (item.downSize / 1024).toFixed(2)
})
var firstData = data.DS[0].dataCode
// var layer = layui.layer;
layer.open({
title: `${examId}访问详情`,
type: 1,
content: $('#openProductBox'),
area: ['1314px', '680px'], //宽高
// btn: ["确定"],
btn1: function (index) {
layer.close(index);
},
success: function (layero) {
laypage.render({
elem: 'demo10',
count: 10,
layout: ['page', 'count']
});
table.render({
elem: '#openProductTable',
height: 250,
data: datalists,
page: true, //关闭分页
cols: [
[ //表头
{
field: 'dataCode',
title: '资料编码',
align: 'center'
}, {
field: 'dataName',
title: '资料名',
align: 'center'
},
{
field: 'downSize',
title: '下载量(MB)',
sort: true,
align: 'center',
},
{
field: 'visits',
title: '访问次数',
sort: true,
align: 'center'
},
]
],
done: function (value, data) {
// element.render();
var index = value.data[0];
let getDataLocal = window
.sessionStorage.getItem(
'examidSend')
let userNames = window
.sessionStorage
.getItem('userNames')
setTimeout(() => {
getChartData(
getDataLocal,
index
.dataCode,
userNames,
1
) //得到当前行元素对象
}, 1000);
}
});
table.render({
elem: '#openProductTable2',
height: 150,
data: data["notRegister"],
// url: $("#BasePath").val() + "/teacher/getQiandaoList" //数据接口,
page: false //关闭分页
,
cols: [
[ //表头
{
field: 'studentId',
title: '学号',
sort: true,
fixed: 'left'
}, {
field: 'studentName',
title: '姓名',
fixed: 'left'
},
]
]
});
// layer.close(index)
var mask = $(".layui-layer-shade");
mask.appendTo(layero.parent());
}
})
} else {
alert("失败")
}
getChartData(examidSend, firstData, userName, 2)
}
})
}
impNumTwo = function (examIdCode, userName) {
window.sessionStorage.setItem('examidCodeSend', examIdCode)
var start_timeTwos = [$('#start_times').val()];
var end_timeTwos = [$('#end_times').val()];
$.ajax({
type: "post",
url: '/a/udi/opt/dataCensus/dataCsListDataCode',
data: {
"dataCode": examIdCode,
"pageNo": 1,
"pageSize": '10',
"startTime": start_timeTwos + ' 00:00:00',
"endTime": end_timeTwos + ' 23:59:59',
},
success: function (data) {
if (data.resultCode == 0) {
var datalistsTwo = data.DS;
datalistsTwo.forEach(item => {
item.downSize = (item.downSize / 1024).toFixed(2)
})
var firstDataTwo = data.DS[0].loginid
// var layer = layui.layer;
layer.open({
title: `${examIdCode}访问详情`,
type: 1,
content: $('#openProductBoxs'),
area: ['1314px', '680px'], //宽高
success: function () {
laypage.render({
elem: 'demo10',
count: 10,
layout: ['page', 'count']
});
table.render({
elem: '#openProductTables',
height: 250,
data: datalistsTwo,
page: true, //关闭分页
cols: [
[ //表头
{
field: 'loginid',
title: '用户id',
align: 'center'
}, {
field: 'userName',
title: '用户名',
align: 'center'
},
{
field: 'downSize',
title: '下载量(MB)',
sort: true,
align: 'center',
// templet: function (
// data) {
// var html =
// '<div class="layui-progress layui-progress-big" lay-showPercent="true" lay-filter="rate">';
// html +=
// `<div class="layui-progress-bar layui-bg-blue" lay-percent='${((data.downSize / 1048576) * 100).toFixed(2)}'></div>`;
// html +=
// '<div>'
// return html;
// }
},
{
field: 'visits',
title: '访问次数',
sort: true,
align: 'center'
},
]
],
done: function (value, data) {
let index = value.data[0]
.loginid
// element.render();
let getDataLocals = window
.sessionStorage.getItem(
'examidCodeSend')
let dataNames = window
.sessionStorage.getItem(
'dataNames')
setTimeout(() => {
getChartDatas(
getDataLocals,
index,
dataNames,
1
) //得到当前行元素对象
}, 1000);
}
});
}
})
} else {
alert("失败")
}
getChartDatas(examIdCode, firstDataTwo, userName, 2)
}
})
}
getChartDatas = function (data, datacodes, dataName, num) {
let dataNames = window.sessionStorage.getItem('setformDatas')
let jsonDataNames = {}
if (dataNames) {
jsonDataNames = JSON.parse(dataNames)
} else {
jsonDataNames = {
start_times: (dayjs(Date.now()).subtract(2, 'month')).format('YYYY-MM-DD'),
end_times: dayjs(Date.now()).format('YYYY-MM-DD')
};
}
$.ajax({
type: "get",
url: `/a/udi/opt/dataCensus/dataCsListDataUser?loginid=${datacodes}&dataCode=${data}&startTime=${jsonDataNames.start_times}&endTime=${jsonDataNames.end_times}`,
success: function (res) {
var chartsRDatas = res.DS
setTimeout(() => {
getInitChartDatas(datacodes, chartsRDatas, dataName, num)
}, 100);
}
})
}
getChartData = function (data, datacodes, userName, num) {
let timePart = window.sessionStorage.getItem('setformDataTwo');
if (timePart) {
var timePartParse = JSON.parse(timePart)
} else {
var timePartParse = {
start_time: (dayjs(Date.now()).subtract(2, 'month')).format('YYYY-MM-DD'),
end_time: dayjs(Date.now()).format('YYYY-MM-DD')
};
}
$.ajax({
type: "get",
url: `/a/udi/opt/dataCensus/dataCsListDataUser?loginid=${data}&dataCode=${datacodes}&startTime=${timePartParse.start_time}&endTime=${timePartParse.end_time}`,
success: function (res) {
var chartsRData = res.DS
getInitChartData(datacodes, chartsRData, userName, num)
}
})
}
getInitChartDatas = function (name, receiveData, dataName, num) {
var lineChartsTwo = echarts.init(document.getElementById('time-chartsTwo'));
let setformDatas = JSON.parse(window.sessionStorage.getItem('setformDatas'))
function xDatas(index) {
var Arraydatas = [];
var visitNumAlls = []
var downNums = []
receiveData.forEach(item => {
if (num == 1) {
Arraydatas.push(item.dataTime)
}
visitNumAlls.push(item.visits)
downNums.push((item.downSize / 1024).toFixed(3))
});
if (num == 2) {
Arraydatas.push(setformDatas.start_times)
Arraydatas.push(setformDatas.end_times)
}
if (index == 1) {
return Arraydatas
} else if (index == 2) {
return visitNumAlls
} else {
return downNums
}
};
function getDataName(data) {
if (data == '') {
return '访问统计'
} else if (data == null) {
return '访问统计'
} else {
return data + '访问统计'
}
}
var options = {
backgroundColor: "transparent",
title: {
show: true, // 显示策略，默认值true,可选为：true（显示） | false（隐藏）
text: getDataName(dataName),
x: 'center', // 水平安放位置，默认为'left'，可选为：'center' | 'left' | 'right' | {number}（x坐标，单位px）
y: '0%',
textStyle: { // 主标题文本样式{"fontSize": 18,"fontWeight": "bolder","color": "#333"}
fontSize: 14,
color: '#323232'
}
},
tooltip: {
formatter: '{b1}<br />{a}: {c}次<br>{a1}: {c1}MB',
trigger: "axis",
axisPointer: {
type: "shadow",
textStyle: {
color: "#565656"
}
},
},
grid: {
borderWidth: 0,
top: 50,
bottom: 65,
textStyle: {
color: "#565656"
}
},
legend: {
x: 'center',
top: '8%',
textStyle: {
color: '#90979c',
},
// data: ['访问量', '订单量']
},
calculable: true,
xAxis: [{
type: "category",
axisLine: {
lineStyle: {
color: "#565656",
}
},
splitLine: {
show: false
},
axisTick: {
show: false
},
data: xDatas(1),
}],
yAxis: [{
type: "value",
name: "单位（次）",
splitLine: {
show: true
},
axisLine: {
lineStyle: {
color: "#565656",
}
},
},
{
type: "value",
name: "下载量(MB)",
splitLine: {
show: true
},
axisTick: {
show: false
},
axisLine: {
lineStyle: {
color: "#565656",
}
},
},
],
dataZoom: [{
show: true,
height: 20,
xAxisIndex: [0],
bottom: 20,
"start": 10,
"end": 80,
// handleIcon: 'path://M306.1,413c0,2.2-1.8,4-4,4h-59.8c-2.2,0-4-1.8-4-4V200.8c0-2.2,1.8-4,4-4h59.8c2.2,0,4,1.8,4,4V413z',
handleSize: '100%',
handleStyle: {
color: "#DCE2EB",
},
textStyle: {
color: "rgba(204,187,225,0.5)",
},
fillerColor: "#DCE2EB",
borderColor: "#DCE2EB",
}, {
type: "inside",
show: true,
height: 15,
start: 1,
end: 35
}],
series: [{
name: "访问次数",
type: "line",
// symbolSize: 10,
yAxisIndex: 0,
// symbol: 'circle',
itemStyle: {
color: "#FFAA00",
},
data: xDatas(2),
}, {
name: "下载量(MB)",
type: "bar",
yAxisIndex: 1,
// symbolSize: 10,
// symbol: 'circle',
itemStyle: {
color: "#40ACFB",
},
data: xDatas(3)
}, ]
}
lineChartsTwo.setOption(options);
}
//弹框echarts
getInitChartData = function (name, receiveData, userName, num) {
let setformDataTwo = JSON.parse(window.sessionStorage.getItem('setformDataTwo'))
var lineCharts = echarts.init(document.getElementById('time-charts'));
function xData(index) {
var Arraydata = [];
var visitNumAll = []
var downNum = []
receiveData.forEach(item => {
if (num == 1) {
Arraydata.push(item.dataTime)
}
visitNumAll.push(item.visits)
downNum.push((item.downSize / 1024).toFixed(2))
});
if (num == 2) {
// Arraydata.push(setformDataTwo.start_time)
// Arraydata.push(setformDataTwo.end_time)
}
if (index == 1) {
return Arraydata
} else if (index == 2) {
return visitNumAll
} else {
return downNum
}
};
function getDataName(data) {
if (data == undefined) {
return '访问统计'
} else if (data == null) {
return '访问统计'
} else {
return data + '访问统计'
}
// if (data == '') {
// return '访问统计'
// } else if (data == null) {
// return '访问统计'
// } else if (data == undefined) {
// return '访问统计'
// } else {
// return '访问统计'
// }
}
var option = {
backgroundColor: "transparent",
title: {
show: true, // 显示策略，默认值true,可选为：true（显示） | false（隐藏）
text: getDataName(userName),
x: 'center', // 水平安放位置，默认为'left'，可选为：'center' | 'left' | 'right' | {number}（x坐标，单位px）
y: '0%',
textStyle: { // 主标题文本样式{"fontSize": 18,"fontWeight": "bolder","color": "#333"}
fontSize: 14,
color: '#323232'
}
},
tooltip: {
trigger: "axis",
formatter: '{b1}<br />{a}: {c}次<br>{a1}: {c1}MB',
axisPointer: {
type: "shadow",
textStyle: {
color: "#565656"
}
},
},
grid: {
borderWidth: 0,
top: 50,
bottom: 65,
textStyle: {
color: "#565656"
}
},
legend: {
x: 'center',
top: '8%',
textStyle: {
color: '#90979c',
},
// data: ['访问量', '订单量']
},
calculable: true,
xAxis: [{
type: "category",
axisLine: {
lineStyle: {
color: "#565656",
}
},
splitLine: {
show: false
},
axisTick: {
show: false
},
data: xData(1),
}],
yAxis: [{
name: "单位（次）",
type: "value",
splitLine: {
show: true
},
axisLine: {
lineStyle: {
color: "#565656",
}
},
},
{
name: "下载量（MB）",
type: "value",
splitLine: {
show: true
},
axisLine: {
lineStyle: {
color: "#565656",
}
},
}
],
dataZoom: [{
show: true,
height: 20,
xAxisIndex: [0],
bottom: 20,
"start": 10,
"end": 80,
// handleIcon: 'path://M306.1,413c0,2.2-1.8,4-4,4h-59.8c-2.2,0-4-1.8-4-4V200.8c0-2.2,1.8-4,4-4h59.8c2.2,0,4,1.8,4,4V413z',
handleSize: '100%',
handleStyle: {
color: "#DCE2EB",
},
textStyle: {
color: "rgba(204,187,225,0.5)",
},
fillerColor: "#DCE2EB",
borderColor: "#DCE2EB",
}, {
type: "inside",
show: true,
height: 15,
start: 1,
end: 35
}],
series: [{
name: "访问次数",
type: "line",
yAxisIndex: 0,
itemStyle: {
color: "#FFAA00",
},
data: xData(2),
}, {
name: "下载量(MB)",
type: "bar",
itemStyle: {
color: "#40ACFB",
},
yAxisIndex: 1,
data: xData(3)
}, ]
}
lineCharts.setOption(option);
}
table.on('sort(test-filter)', function (obj) {
let sDate = (dayjs(Date.now()).subtract(2, 'month')).format('YYYY-MM-DD 00:00:00')
let eDate = (dayjs(Date.now())).format('YYYY-MM-DD 00:00:00')
table.reload('demos', { //testTable是表格容器id
initSort: {
field:obj.field,
type:obj.type
}, //记录初始排序，如果不设的话，将无法标记表头的排序状态。 layui 2.1.1 新增参数
autoSort:true,
url: '/a/udi/opt/dataCensus/dataCsList' +
'?orderBy=' + obj.field + ' ' + obj.type + '&startTime=' + sDate +
'&endTime=' + eDate + '&pageSize=20',
parseData:function (res) {
res.DS.forEach(item => {
item.downSize = Number((item.downSize / 1024).toFixed(2))
})
if (res.resultCode == '0') {
// filterData = res.data
//分页
var result;//存储分页后的数据
if (this.page.curr) {//显示第n页的数据
result = res.DS.slice(this.limit * (this.page.curr - 1), this.limit * this.page.curr);
} else {
result = res.DS.slice(0, this.limit);
}
return {
"code": res.resultCode, //解析接口状态
"msg": res.resMessage, //解析提示文本
"count": res.DS.length, //解析数据长度
"data": result //解析数据列表
};
}
}
});
});
table.on('sort(test-filter-two)', function (obj) {
let setFormDataTwo = window.sessionStorage.getItem('setformDataTwo')
let newSetFormData = JSON.parse(setFormDataTwo)
let sDate = (dayjs(Date.now()).subtract(2, 'month')).format('YYYY-MM-DD 00:00:00')
let eDate = (dayjs(Date.now())).format('YYYY-MM-DD 00:00:00')
table.reload('demo', { //testTable是表格容器id
initSort: {
field:obj.field,
type:obj.type
}, //记录初始排序，如果不设的话，将无法标记表头的排序状态。 layui 2.1.1 新增参数
url: '/a/udi/opt/dataCensus/userCsList' +
'?orderBy=' + obj.field + ' ' + obj.type + '&startTime=' + sDate +
'&endTime=' + eDate + '&pageSize=20',
parseData:function (res) {
res.DS.forEach(item => {
item.downSize = Number((item.downSize / 1024).toFixed(2))
})
if (res.resultCode == '0') {
// filterData = res.data
//分页
var result;//存储分页后的数据
if (this.page.curr) {//显示第n页的数据
result = res.DS.slice(this.limit * (this.page.curr - 1), this.limit * this.page.curr);
} else {
result = res.DS.slice(0, this.limit);
}
let arrsa = []
arrsa=result
return {
"data": arrsa ,//解析数据列表
"code": res.resultCode, //解析接口状态
"msg": res.resMessage, //解析提示文本
"count": res.DS.length, //解析数据长度
};
}
}
});
})
table.on('row(openProductTable)', function (obj) {
$(".layui-table-body .layui-table tr").attr({
"style": "background:#FFF"
}); //其它tr恢复原样（必须在前）
$(obj.tr.selector).attr({
"style": "background:#EEE"
});
let getDataLocal = window.sessionStorage.getItem('examidSend')
let userNames = window.sessionStorage.getItem('userNames')
getChartData(getDataLocal, obj.data.dataCode, userNames, 1) //得到当前行元素对象
});
table.on('sort(openProductTable)', function (obj) {
var start_timeOnes = [$('#start_time').val()];
var end_timeOnes = [$('#end_time').val()];
table.reload('openProductTable', { //testTable是表格容器id
initSort: {
field:obj.field,
type:obj.type
}, //记录初始排序，如
url: '/a/udi/opt/dataCensus/userCsListloginid'+'?orderBy='
+ obj.field + ' ' + obj.type +
'&startTime='+start_timeOnes+' 00:00:00'+
'&endTime='+end_timeOnes+' 23:59:59'+
'&loginid='+window.sessionStorage.getItem('examidSend')+'&pageSize=20',
parseData:function (res) {
res.DS.forEach(item => {
item.downSize = Number((item.downSize / 1024).toFixed(2))
})
if (res.resultCode == '0') {
// filterData = res.data
//分页
var result;//存储分页后的数据
if (this.page.curr) {//显示第n页的数据
result = res.DS.slice(this.limit * (this.page.curr - 1), this.limit * this.page.curr);
} else {
result = res.DS.slice(0, this.limit);
}
let arrsa = []
arrsa=result
return {
"data": arrsa ,//解析数据列表
"code": res.resultCode, //解析接口状态
"msg": res.resMessage, //解析提示文本
"count": res.DS.length, //解析数据长度
};
}
}
})
})
table.on('sort(openProductTables)', function (obj) {
var start_timeOnes = [$('#start_time').val()];
var end_timeOnes = [$('#end_time').val()];
table.reload('openProductTables', { //testTable是表格容器id
initSort: {
field:obj.field,
type:obj.type
}, //记录初始排序，如
url: '/a/udi/opt/dataCensus/dataCsListDataCode'+'?orderBy='
+ obj.field + ' ' + obj.type +
'&startTime='+start_timeOnes+' 00:00:00'+
'&endTime='+end_timeOnes+' 23:59:59'+
'&dataCode='+window.sessionStorage.getItem('examidCodeSend')+'&pageSize=20',
parseData:function (res) {
res.DS.forEach(item => {
item.downSize = Number((item.downSize / 1024).toFixed(2))
})
if (res.resultCode == '0') {
// filterData = res.data
//分页
var result;//存储分页后的数据
if (this.page.curr) {//显示第n页的数据
result = res.DS.slice(this.limit * (this.page.curr - 1), this.limit * this.page.curr);
} else {
result = res.DS.slice(0, this.limit);
}
let arrsa = []
arrsa=result
return {
"data": arrsa ,//解析数据列表
"code": res.resultCode, //解析接口状态
"msg": res.resMessage, //解析提示文本
"count": res.DS.length, //解析数据长度
};
}
}
})
})
table.on('row(openProductTables)', function (obj) {
$(".layui-table-body .layui-table tr").attr({
"style": "background:#FFF"
}); //其它tr恢复原样（必须在前）
$(obj.tr.selector).attr({
"style": "background:#EEE"
});
let getDataLocals = window.sessionStorage.getItem('examidCodeSend')
let dataNames = window.sessionStorage.getItem('dataNames')
getChartDatas(getDataLocals, obj.data.loginid, dataNames, 1) //得到当前行元素对象
});
element.on('tab(tabChange)', function (data) {
if (data.index == 1) {
getMeansData({
field: {
start_times: (dayjs(Date.now()).subtract(2, 'month')).format(
'YYYY-MM-DD'),
end_times: dayjs(Date.now()).format('YYYY-MM-DD')
}
})
}
});
})
</script>
</body>
</html>
image.png
