1203 lines
53 KiB
HTML
1203 lines
53 KiB
HTML
<!DOCTYPE html>
|
||
<html lang="en">
|
||
<head>
|
||
<meta charset="UTF-8">
|
||
<title>LogSearch-Web</title>
|
||
<!-- 你引入的 layui.js 建议是通过官网首页下载的。当然也可以由 github 或 gitee clone -->
|
||
<script src="./res/layui/layui.js"></script>
|
||
<script src="./res/layui/treeTable.js"></script>
|
||
<script src="./res/jquery-3.7.1.min.js"></script>
|
||
<!-- 引入 layui.css -->
|
||
<link rel="stylesheet" href="./res/layui/css/layui.css">
|
||
<script src="./main.js"></script>
|
||
<style>
|
||
.layui-input {
|
||
height:27px;
|
||
max-height: 27px;
|
||
line-height: 27px;
|
||
font-size: 12px;
|
||
}
|
||
.layui-input-inline {
|
||
padding-top: 4px;
|
||
}
|
||
.layui-form-item {
|
||
margin-bottom: 0px;
|
||
}
|
||
.custom-btn {
|
||
height:27px;
|
||
max-height: 27px;
|
||
line-height: 27px;
|
||
}
|
||
.layui-table-cell {
|
||
padding: 0 5px;
|
||
}
|
||
.layui-table-view .layui-table td {
|
||
padding:0;
|
||
}
|
||
.layui-table td, .layui-table th, .layui-table-col-set, .layui-table-fixed-r, .layui-table-grid-down, .layui-table-header, .layui-table-page, .layui-table-tips-main, .layui-table-tool, .layui-table-total, .layui-table-view, .layui-table[lay-skin=line], .layui-table[lay-skin=row] {
|
||
border-color:#bbb1b1;
|
||
}
|
||
/* 设置选中行的背景颜色 */
|
||
.layui-table-tr-selected {
|
||
background-color: #a30b0b;
|
||
}
|
||
.layui-table-view .layui-table tr:hover {
|
||
background-color: #53a4caed;
|
||
color:black;
|
||
}
|
||
.layui-input{
|
||
border-radius: 0;
|
||
}
|
||
.layui-btn{
|
||
border-radius: 0;
|
||
}
|
||
.single-line {
|
||
white-space: nowrap; /* 不换行 */
|
||
overflow: hidden; /* 隐藏超出部分 */
|
||
text-overflow: ellipsis; /* 显示省略号 */
|
||
cursor: pointer;
|
||
width:330px;
|
||
}
|
||
.single-line:hover {
|
||
background-color: #C9C5C5;
|
||
}
|
||
</style>
|
||
</head>
|
||
<body onload="init()" style="background-color: #fbfbfb;" >
|
||
<div class="layui-fluid" style="padding-top: 5px;">
|
||
<div class="layui-panel" id="headContent" >
|
||
<form class="layui-form " style="background-color: #ebebeb7a;" lay-size="xs" action="" lay-filter="search-form" id="search-form">
|
||
<div class="layui-form-item">
|
||
<div class="layui-inline">
|
||
<label class="layui-form-label">ES数据源</label>
|
||
<div class="layui-input-inline" style="width: 220px;">
|
||
<select name="quiz" id="dataSourceSelect" required lay-verify="required" lay-filter="dataSourceSelect">
|
||
<option value="">请选择数据源</option>
|
||
</select>
|
||
</div>
|
||
<div class="layui-input-inline" style="width: 40px;">
|
||
|
||
</div>
|
||
</div>
|
||
|
||
<div class="layui-inline">
|
||
<label class="layui-form-label">日期选择</label>
|
||
<div class="layui-input-inline" style="width: 220px;">
|
||
<input type="text" name="date1" id="date1" required lay-verify="required" autocomplete="off" class="layui-input">
|
||
<input type="hidden" id="startTime" />
|
||
<input type="hidden" id="endTime" />
|
||
</div>
|
||
<div class="layui-input-inline" style="width: 120px;">
|
||
<button class="layui-btn layui-btn-primary layui-btn-sm custom-btn" id="timeFastBtn">
|
||
选择<i class="layui-icon layui-icon-down layui-font-12"></i>
|
||
</button>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="layui-inline"><label class="layui-form-label">程序</label>
|
||
<div class="layui-input-inline" style="width: 220px;">
|
||
<input type="text" name="logger" id="logger" placeholder="请输入或点击选择" autocomplete="on" class="layui-input">
|
||
</div>
|
||
<div class="layui-input-inline" style="margin-left: -10px;width: 50px;">
|
||
<button style="border-left-width: 0;" type="button" onclick="javascript:$('#logger').val('');" class="layui-btn layui-btn-primary layui-btn-sm custom-btn" >清除</button>
|
||
</div>
|
||
<div class="layui-input-inline" style="width: 120px;">
|
||
<button type="button" onclick="showTreeFix()" class="layui-btn layui-btn-primary layui-btn-sm custom-btn">选择</button>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="layui-form-item">
|
||
<div class="layui-inline">
|
||
<label class="layui-form-label">线程ID</label>
|
||
<div class="layui-input-inline" style="width: 220px;">
|
||
<input type="text" name="thread" id="thread" placeholder="请输入线程号" autocomplete="on" class="layui-input">
|
||
|
||
</div>
|
||
<div class="layui-input-inline" style="margin-left: -10px;width: 50px;">
|
||
<button style="border-left-width: 0;" type="button" onclick="javascript:$('#thread').val('');" class="layui-btn layui-btn-primary layui-btn-sm custom-btn" >清除</button>
|
||
</div>
|
||
</div>
|
||
<div class="layui-inline">
|
||
<label class="layui-form-label">消息类型</label>
|
||
<div class="layui-input-block">
|
||
<input type="checkbox" name="error" title="错误" lay-skin="primary" checked>
|
||
<input type="checkbox" name="info" title="信息" lay-skin="primary" checked>
|
||
<input type="checkbox" name="time" title="耗时" lay-skin="primary">
|
||
<input type="checkbox" name="debug" title="调试" lay-skin="primary">
|
||
<input type="checkbox" name="trace" title="追踪" lay-skin="primary">
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
|
||
<div class="layui-form-item">
|
||
<div class="layui-inline">
|
||
<label class="layui-form-label">检索内容</label>
|
||
<div class="layui-input-inline" style="width: 220px;">
|
||
<input type="text" name="msg" id="msg" placeholder="请输入内容" autocomplete="on" class="layui-input">
|
||
<input type="text" name="msgAdd" id="msgAdd" placeholder="AND 内容" autocomplete="on" class="layui-input">
|
||
</div>
|
||
<div class="layui-input-inline" style="margin-left: -10px;width: 50px;">
|
||
<button style="border-left-width: 0;" type="button" onclick="javascript:$('#msg').val('');$('#msgAdd').val('');" class="layui-btn layui-btn-primary layui-btn-sm custom-btn" >清除</button>
|
||
</div>
|
||
<div class="layui-input-inline" style="width: 120px;">
|
||
<div style="width: 120px;margin-top: -5px;">
|
||
<input type="checkbox" name="overMatchSelected" title="全词匹配" lay-skin="primary" checked>
|
||
</div>
|
||
</div>
|
||
<div class="layui-input-inline" style="width: 120px;">
|
||
<div style="width: 120px;margin-top: -5px;">
|
||
<input type="checkbox" name="similaritySelected" title="匹配度排序" lay-skin="primary">
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="layui-inline">
|
||
<div class="layui-input-block">
|
||
<button type="button" onclick="resetForm()" class="layui-btn layui-btn-primary layui-btn-sm custom-btn"><i class="layui-icon"></i>重置</button>
|
||
<button class="layui-btn layui-btn-normal layui-btn-sm custom-btn" lay-submit lay-filter="esQuery"><i class="layui-icon"></i>查询</button>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</form>
|
||
</div>
|
||
<div class="layui-panel">
|
||
<!--移动：6/12 | 平板：6/12 | 桌面：4/12-->
|
||
<div class="layui-col-xs12 layui-col-sm12 layui-col-md12">
|
||
<!-- <span id="initBtn">msg</span>-->
|
||
<table id="msgTable" lay-filter="msgTable" lay-size="sm"></table>
|
||
</div>
|
||
</div>
|
||
<div id="bottomContent">
|
||
<!--移动：6/12 | 平板：6/12 | 桌面：4/12-->
|
||
<div class="layui-col-xs12 layui-col-sm12 layui-col-md12">
|
||
<span class="layui-badge-rim">总条数: <span id="total">0</span></span>
|
||
<span class="layui-badge-rim">已加载: <span id="already">0</span></span>
|
||
<span class="layui-badge-rim">每次加载数量: <input id="size" value="100" style="width:50px;border-color: #ccc;border-width: 1px;"/></span>
|
||
<i onclick="help()" class="layui-icon " style="width: 24px;height: 24px;cursor: pointer;"></i>
|
||
<!-- <span class="layui-badge layui-bg-blue" style="cursor: pointer;" onclick="next()">加载更多</span>-->
|
||
</div>
|
||
</div>
|
||
|
||
</div>
|
||
<div id="detailContent" style="display: none;">
|
||
<form class="layui-form" lay-size="sm" action="" lay-filter="detail-form">
|
||
<div class="layui-form-item">
|
||
<div class="layui-inline">
|
||
<label class="layui-form-label">程序</label>
|
||
<div class="layui-input-inline" style="width: 220px;">
|
||
<input type="text" id="loggerStr2" name="loggerStr2" autocomplete="off" class="layui-input">
|
||
</div>
|
||
</div>
|
||
|
||
<div class="layui-inline">
|
||
<label class="layui-form-label">类路径</label>
|
||
<div class="layui-input-inline" style="min-width: 220px;">
|
||
<input type="text" name="logger2" id="logger2" autocomplete="off" class="layui-input">
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="layui-form-item">
|
||
<div class="layui-inline">
|
||
<label class="layui-form-label">时间</label>
|
||
<div class="layui-input-inline" style="width: 220px;">
|
||
<input type="text" id="createTimeStr2" name="createTimeStr2" autocomplete="off" class="layui-input">
|
||
</div>
|
||
</div>
|
||
|
||
<div class="layui-inline">
|
||
<label class="layui-form-label">消息类型</label>
|
||
<div class="layui-input-inline" style="width: 220px;">
|
||
<input type="text" id="level2" name="level2" autocomplete="off" class="layui-input">
|
||
</div>
|
||
</div>
|
||
|
||
<div class="layui-inline"><label class="layui-form-label">线程ID</label>
|
||
<div class="layui-input-inline" style="width: 220px;">
|
||
<input type="text" id="thread2" name="thread2" lay-verify="required" placeholder="请输入标题" autocomplete="off" class="layui-input">
|
||
</div>
|
||
<div class="layui-input-inline" style="margin-left: -10px;width: 50px;">
|
||
<button style="border-left-width: 0;" type="button" onclick="filterThread()" class="layui-btn layui-btn-primary layui-btn-sm custom-btn" >过滤</button>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="layui-form-item">
|
||
<div class="layui-inline">
|
||
<label class="layui-form-label">用户</label>
|
||
<div class="layui-input-inline" style="width: 220px;">
|
||
<input type="text" id="userId2" name="userId2" lay-verify="required"
|
||
placeholder="请输入标题" autocomplete="off" class="layui-input">
|
||
</div>
|
||
</div>
|
||
<div class="layui-inline">
|
||
<div class="layui-input-block">
|
||
<button type="button" onclick="fastFilter()" class="layui-btn layui-btn-sm custom-btn" >快速过滤</button>
|
||
<button type="button" onclick="copyMsg()" class="layui-btn layui-btn-sm custom-btn " >复制内容</button>
|
||
<button type="button" onclick="closeDetail()" class="layui-btn layui-btn-sm custom-btn layui-btn-primary" >关闭</button>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="layui-form-item layui-form-text">
|
||
<label class="layui-form-label">内容</label>
|
||
<div class="layui-input-block" style="padding-right: 15px;">
|
||
<pre class="layui-textarea layui-text layui-code" name="msg2" id="msg2" ></pre>
|
||
</div>
|
||
<label class="layui-form-label" name="exceptionLabel" id="exceptionLabel">异常</label>
|
||
<div class="layui-input-block" style="padding-right: 15px;">
|
||
<pre class="layui-textarea layui-text layui-code" name="exception" id="exception" ></pre>
|
||
</div>
|
||
</div>
|
||
</form>
|
||
</div>
|
||
|
||
<table class="layui-table layui-form" id="tree-table" lay-size="sm" style="display: none;"></table>
|
||
</body>
|
||
<script>
|
||
var sourceTemp = {};/*数据源喊出*/
|
||
var dataTemp = [];/*已加载的数据*/
|
||
var loggerTemp = {};/*程序缓存 ID>OBJ*/
|
||
var loggerKeyTemp = {};/*程序缓存 logger>name*/
|
||
var tableBodyDom;//表格主题DOM
|
||
var treeTable1;/*程序选择*/
|
||
var scrollTop = 0;
|
||
var click = false;
|
||
var size = 100;// 每次加载数量
|
||
var tipsIndex = null;
|
||
|
||
// 添加窗口大小变化的事件监听器
|
||
window.addEventListener('resize', function() {
|
||
var headContent = document.getElementById("headContent");
|
||
var bottomContent = document.getElementById("bottomContent");
|
||
var height = headContent.offsetHeight + (bottomContent.offsetHeight || 35);
|
||
|
||
var windowHeight = document.documentElement.clientHeight || document.body.clientHeight || window.innerHeight;
|
||
|
||
var bodyHeight = windowHeight - height;
|
||
var tableHeight = bodyHeight < 400 ? 400 : bodyHeight - 55;
|
||
// 清空表格数据
|
||
layui.table.reload('msgTable', {
|
||
height: tableHeight
|
||
});
|
||
});
|
||
|
||
function init() {
|
||
var headContent = document.getElementById("headContent");
|
||
var bottomContent = document.getElementById("bottomContent");
|
||
var height = headContent.offsetHeight + (bottomContent.offsetHeight || 35);
|
||
|
||
var windowHeight = document.documentElement.clientHeight || document.body.clientHeight || window.innerHeight;
|
||
|
||
var bodyHeight = windowHeight - height;
|
||
var tableHeight = bodyHeight < 400 ? 400 : bodyHeight - 55;
|
||
|
||
// 时间快捷选择
|
||
layui.dropdown.render({
|
||
elem: '#timeFastBtn' //可绑定在任意元素中，此处以上述按钮为例
|
||
,data: [
|
||
{title: '今天',id: 1,href: '#'},
|
||
{title: '过去15分钟',id: 2,href: '#'},
|
||
{title: '过去30分钟',id: 5,href: '#'},
|
||
{title: '过去1小时',id: 6,href: '#'},
|
||
{title: '过去3小时',id: 7,href: '#'},
|
||
{title: '过去12小时',id: 8,href: '#'},
|
||
{title: '过去24小时',id: 9,href: '#'},
|
||
{title: '过去48小时',id: 10,href: '#'},
|
||
{title: '自选',id: 11,href: '#'},
|
||
]
|
||
,id: 'timeFastBtn'
|
||
//菜单被点击的事件
|
||
,click: function(obj){
|
||
switch(obj.id){
|
||
case 1:
|
||
setDefaultTime(0,true);
|
||
break;
|
||
case 2:
|
||
setDefaultTime(1000*60*15,false);
|
||
break;
|
||
case 5:
|
||
setDefaultTime(1000*60*30,false);
|
||
break;
|
||
case 6:
|
||
setDefaultTime(1000*60*60,false);
|
||
break;
|
||
case 7:
|
||
setDefaultTime(1000*60*180,false);
|
||
break;
|
||
case 8:
|
||
setDefaultTime(1000*60*720,false);
|
||
break;
|
||
case 9:
|
||
setDefaultTime(1000*60*1440,false);
|
||
break;
|
||
case 10:
|
||
setDefaultTime(1000*60*1440*2,false);
|
||
break;
|
||
case 11:
|
||
$('#date1').click();
|
||
break;
|
||
}
|
||
}
|
||
});
|
||
//数据表格
|
||
layui.table.render({
|
||
elem: '#msgTable'
|
||
, height: tableHeight
|
||
, data: []
|
||
, limits: [50]
|
||
, limit: 10000
|
||
, page: false //开启分页
|
||
, cols: [[ //表头
|
||
{
|
||
field: 'id', title: '序号', width: 50, sort: false, templet: function (d) {
|
||
return d.LAY_INDEX
|
||
}
|
||
}
|
||
, {field: 'createTimeStr', title: '时间', width: 160, sort: true}
|
||
, {field: 'logger', title: '程序', width: 200, templet: function (d) {
|
||
return loggerKeyTemp[d.logger] || showClassName(d.logger);
|
||
}
|
||
}
|
||
, {
|
||
field: 'level', title: '消息类型', width: 70, templet: function (d) {
|
||
var tempLevel = '<span>' + d.level + '</span>';
|
||
switch (d.level) {
|
||
case "INFO":
|
||
tempLevel = '<span style="color:#666;padding:2px;">' + d.level + '</span>';
|
||
break;
|
||
case "ERROR":
|
||
tempLevel = '<span style="background-color:#c00;color:white;font-size:10px;padding:2px;">' + d.level + '</span>';
|
||
break;
|
||
case "TIME":
|
||
tempLevel = '<span style="background-color:#ffff4d;color:#666;font-size:10px;padding:2px;">' + d.level + '</span>';
|
||
break;
|
||
case "DEBUG":
|
||
tempLevel = '<span style="background-color:#ffffcc;color:#666;font-size:10px;padding:2px;">' + d.level + '</span>';
|
||
break;
|
||
case "TRACE":
|
||
tempLevel = '<span style="background-color:#e6e6cc;color:#666;font-size:10px;padding:2px;">' + d.level + '</span>';
|
||
break;
|
||
}
|
||
return tempLevel;
|
||
}
|
||
}
|
||
, {field: 'thread', title: '线程', width: 180}
|
||
, {field: 'msg', title: '日志内容'}
|
||
, {field: 'ip', title: '服务端IP', width: 100}
|
||
]]
|
||
,done: function (res, curr, count) {
|
||
if(scrollTop>0){
|
||
$('.layui-table-body').scrollTop(scrollTop);
|
||
}
|
||
var table2 = $('.layui-table-body').find("table")[0];
|
||
// 重载表格---保持滚动条位置
|
||
$('.layui-table-body').scroll(function () {
|
||
var top = $('.layui-table-body').scrollTop();
|
||
var tableHeight = $('.layui-table-body').height();
|
||
var contentHeight = $(table2).height();
|
||
var windowHeight = $(window).height();
|
||
scrollTop = top;
|
||
//console.log('top:'+top+'-contentHeight:'+contentHeight+'tableHeight:' + tableHeight + '-windowHeight:' + windowHeight);
|
||
if(contentHeight>0 && top >= contentHeight - tableHeight-2){
|
||
console.log('botttttttm')
|
||
if(!click){
|
||
click = true;
|
||
next();
|
||
setTimeout(function () {
|
||
click = false;
|
||
},2000);
|
||
}
|
||
}
|
||
});
|
||
}
|
||
// , skin: 'line' //行边框风格
|
||
, even: true //开启隔行背景
|
||
, size: 'sm' //小尺寸的表格
|
||
});
|
||
// 程序列表
|
||
treeTable1 = layui.treeTable.render({
|
||
elem: '#tree-table',
|
||
data: [],
|
||
id: 'demoId',
|
||
icon_key: 'title',
|
||
is_checkbox: true,
|
||
checked: {
|
||
key: 'id',
|
||
data: [],
|
||
},
|
||
end: function(e){
|
||
// form.render();
|
||
},
|
||
cols: [
|
||
{
|
||
key: 'title',
|
||
title: '名称',
|
||
width: '180px',
|
||
template: function(item){
|
||
return item.title || item.name;
|
||
}
|
||
},
|
||
{
|
||
key: 'value',
|
||
title: '类路径',
|
||
align: 'left',
|
||
},
|
||
{
|
||
key: 'type',
|
||
title: '类型',
|
||
width: '100px',
|
||
align: 'left',
|
||
},
|
||
{
|
||
key: 'pinyin',
|
||
title: '拼音',
|
||
width: '100px',
|
||
align: 'left'
|
||
},
|
||
{
|
||
key: 'favourite',
|
||
title: '收藏',
|
||
width: '100px',
|
||
align: 'left'
|
||
},
|
||
]
|
||
});
|
||
|
||
// 监听checkbox选择
|
||
layui.treeTable.on('tree(box)',function(data){
|
||
setChooseLogger();
|
||
})
|
||
|
||
//触发行单击事件
|
||
layui.table.on('row(msgTable)', function (obj) {
|
||
console.log(obj.tr) //得到当前行元素对象
|
||
console.log(obj.data) //得到当前行数据
|
||
var row = obj.data;
|
||
layui.$('#logger2').val(row.logger);
|
||
layui.$('#loggerStr2').val(loggerKeyTemp[row.logger] || row.logger);
|
||
layui.$('#level2').val(row.level);
|
||
layui.$('#thread2').val(row.thread);
|
||
layui.$('#userId2').val(row.userId);
|
||
layui.$('#createTimeStr2').val(row.createTimeStr);
|
||
layui.$('#msg2').html(row.htmlMsg || row.msg);
|
||
if ('ERROR' !== row.level) {
|
||
$('#exception').hide();
|
||
$('#exceptionLabel').hide();
|
||
} else {
|
||
$('#exception').show();
|
||
$('#exceptionLabel').show();
|
||
}
|
||
layui.$('#exception').html(row.exception);
|
||
|
||
$(".layui-table-body .layui-table tr").attr({"style":"background:#black"}); //其它tr恢复原样（必须在前）
|
||
$(obj.tr.selector).attr({"style":"background:#FFE48D"}); //改变当前tr颜色（必须在后）
|
||
|
||
|
||
var windowHeight = window.innerHeight || document.documentElement.clientHeight || document.body.clientHeight;
|
||
var windowWight = window.innerWidth || document.documentElement.clientWidth || document.body.clientWidth;
|
||
layer.open({
|
||
type: 1,
|
||
maxmin: true,
|
||
moveOut: true,
|
||
area: [windowWight * 0.8 + 'px', windowHeight * 0.8 + 'px'],
|
||
content: $("#detailContent"), //这里content是一个DOM，注意：最好该元素要存放在body最外层，否则可能被其它的相对元素所影响
|
||
cancel: function (index, layero) {
|
||
$("#detailContent").css("display", "none");
|
||
layer.close(index)
|
||
return true;
|
||
}
|
||
});
|
||
});
|
||
|
||
// 监听数据源选择器更新事件
|
||
layui.form.on('select(dataSourceSelect)', function (data) {
|
||
// 切换数据源，删除数据
|
||
dataTemp = [];/*已加载的数据*/
|
||
loggerTemp = {};/*程序缓存 ID>OBJ*/
|
||
loggerKeyTemp = {};/*程序缓存 logger>name*/
|
||
// 获取选择的数据源
|
||
// 获取选中的数据源
|
||
var selectedValue = $('#dataSourceSelect').val();
|
||
if(window.localStorage){
|
||
window.localStorage.setItem('sourceId',selectedValue)
|
||
window.localStorage.setItem('source',JSON.stringify(sourceTemp[selectedValue]))
|
||
}
|
||
|
||
// 清空表格数据
|
||
layui.table.reload('msgTable', {
|
||
data: dataTemp,
|
||
});
|
||
// 重新加载程序列表
|
||
loadLoggerItems();
|
||
// 清空程序选择
|
||
$("#logger").val('');
|
||
treeTable1.checked = {
|
||
key: 'id',
|
||
data: [],
|
||
};
|
||
layui.treeTable.render(treeTable1);
|
||
layui.form.render();
|
||
});
|
||
|
||
var options = [];
|
||
// 加载下拉数据源
|
||
$.ajax({
|
||
url: 'http://10.30.35.208:9999//es/es-source',
|
||
type: 'GET',
|
||
dataType: 'json',
|
||
success: function (resp) {
|
||
if (resp.success) {
|
||
var data = resp.data;
|
||
var sourceId = window.localStorage ? window.localStorage.getItem('sourceId') : '';
|
||
var sourceStr = window.localStorage ? window.localStorage.getItem('source') : '{}';
|
||
var source = JSON.parse(sourceStr === 'undefined' ? '{}' : sourceStr);
|
||
if(source){
|
||
options.push('<option value="' + (source.id || '') + '">' + (source.name || '请选择') + '</option>')
|
||
}
|
||
|
||
// 将返回的数据处理成options格式
|
||
for (var ceIndex in data) {
|
||
var groupName = data[ceIndex].name;
|
||
var optionsData = data[ceIndex].children;
|
||
|
||
var cegroupBefore = '<optgroup label="'+groupName+'"> '
|
||
options.push(cegroupBefore);
|
||
for(var opIndex in optionsData){
|
||
var key = optionsData[opIndex].id;
|
||
var option = '<option value="' + optionsData[opIndex].id + '">' + optionsData[opIndex].name + '</option>';
|
||
sourceTemp[key] = optionsData[opIndex];
|
||
options.push(option);
|
||
}
|
||
var cegroupBehind = '</optgroup>';
|
||
options.push(cegroupBehind);
|
||
|
||
}
|
||
var optionsStr = options.join('');
|
||
console.log(optionsStr);
|
||
// 更新select的内容
|
||
$('#dataSourceSelect').empty();
|
||
$('#dataSourceSelect').append(optionsStr);
|
||
|
||
$('#dataSourceSelect').val(sourceId || data[0].children[0].id);
|
||
|
||
// 重新初始化select组件
|
||
layui.form.render('select');
|
||
// 加载程序列表
|
||
loadLoggerItems();
|
||
}
|
||
|
||
}
|
||
}).then(function (resp) {
|
||
console.log('then==resp>')
|
||
console.log(resp);
|
||
})
|
||
var dateNow = new Date();
|
||
var month = dateNow.getMonth() + 1; // 月份从0开始，需要加1
|
||
var day = dateNow.getDate();
|
||
var mmdd = ''+(month>9 ? month : '0' + month) + '-' + (day>9 ? day : '0' + day);
|
||
|
||
//日期时间范围
|
||
layui.laydate.render({
|
||
elem: '#date1'
|
||
, type: 'datetime'
|
||
, range: true
|
||
, format: "MM-dd HH:mm:ss"
|
||
, value: mmdd+' 00:00:00 - '+mmdd+' 23:59:59'
|
||
, btns: ['now', 'clear', 'confirm']
|
||
, calendar: true
|
||
, done: function (value, date, endDate) {
|
||
$("#startTime").val(date.year
|
||
+ '-' + (date.month > 9 ? date.month : '0' + date.month)
|
||
+ '-' + (date.date > 9 ? date.date : '0' + date.date)
|
||
+ ' ' + (date.hours > 9 ? date.hours : '0' + date.hours)
|
||
+ ':' + (date.minutes > 9 ? date.minutes : '0' + date.minutes)
|
||
+ ':' + (date.seconds > 9 ? date.seconds : '0' + date.seconds))
|
||
$("#endTime").val(date.year
|
||
+ '-' + (endDate.month > 9 ? endDate.month : '0' + endDate.month)
|
||
+ '-' + (endDate.date > 9 ? endDate.date : '0' + endDate.date)
|
||
+ ' ' + (endDate.hours > 9 ? endDate.hours : '0' + endDate.hours)
|
||
+ ':' + (endDate.minutes > 9 ? endDate.minutes : '0' + endDate.minutes)
|
||
+ ':' + (endDate.seconds > 9 ? endDate.seconds : '0' + endDate.seconds))
|
||
}
|
||
});
|
||
setDefaultTime(0,true);
|
||
//监听from提交
|
||
layui.form.on('submit(esQuery)', function (data) {
|
||
// document.getElementById('initBtn').innerText = new Date().getTime()+'====' + 111;
|
||
// 重置滚动条为0
|
||
scrollTop = 0;
|
||
$('.layui-table-body').scrollTop(0)
|
||
// 重置数量
|
||
$("#already").text(0);
|
||
$("#total").text(0);
|
||
dataTemp = [];
|
||
var levels = [];
|
||
var overMatchSelected = false;
|
||
var similaritySelected = false;
|
||
// 关闭弹窗
|
||
layer.closeAll();
|
||
// 操作记录
|
||
saveHistory();
|
||
if (data.field.info && data.field.info === 'on') {
|
||
levels.push('INFO')
|
||
}
|
||
if (data.field.error && data.field.error === 'on') {
|
||
levels.push('ERROR')
|
||
}
|
||
if (data.field.debug && data.field.debug === 'on') {
|
||
levels.push('DEBUG')
|
||
}
|
||
if (data.field.time && data.field.time === 'on') {
|
||
levels.push('TIME')
|
||
}
|
||
if (data.field.trace && data.field.trace === 'on') {
|
||
levels.push('TRACE')
|
||
}
|
||
if (data.field.overMatchSelected && data.field.overMatchSelected === 'on') {
|
||
overMatchSelected = true
|
||
}
|
||
if (data.field.similaritySelected && data.field.similaritySelected === 'on') {
|
||
similaritySelected = true
|
||
}
|
||
loadMore(levels, overMatchSelected, similaritySelected);
|
||
return false;
|
||
});
|
||
// 修改size
|
||
$("#size").blur(function(){
|
||
size = parseInt($("#size").val()) || 100;
|
||
console.log(size)
|
||
});
|
||
// 消息历史记录单机显示
|
||
$('#msg').on('click', function(){
|
||
var msgHistory = window.localStorage ? window.localStorage.getItem('msgHistory') : undefined;
|
||
if(msgHistory){
|
||
var items = JSON.parse(msgHistory);
|
||
var lis = '<input id="666" style="display: block;width:0;height:0;" >';
|
||
for (var msgHistoryKey in items) {
|
||
var item = items[msgHistoryKey];
|
||
lis += '<div onclick="setMsgHistory(\'msg\','+msgHistoryKey+')" class="single-line" style="width:240px;color:black;overflow: hidden;">'+item+'</div>';
|
||
}
|
||
console.log(lis)
|
||
var tipsIndex1 = layer.tips(lis, '#msg',{tips:[3, '#ffffff']});
|
||
$("#666").focus();
|
||
$("#666").blur(function() {
|
||
layer.close(tipsIndex1);
|
||
});
|
||
}
|
||
});
|
||
// 消息历史记录单机显示
|
||
$('#msgAdd').on('click', function(){
|
||
var msgHistory = window.localStorage ? window.localStorage.getItem('msgHistory') : undefined;
|
||
if(msgHistory){
|
||
var items = JSON.parse(msgHistory);
|
||
var lis = '<input id="666777" style="display: block;width:0;height:0;" >';
|
||
for (var msgHistoryKey in items) {
|
||
var item = items[msgHistoryKey];
|
||
lis += '<div onclick="setMsgHistory(\'msgAdd\','+msgHistoryKey+')" class="single-line" style="width:240px;color:black;overflow: hidden;">'+item+'</div>';
|
||
}
|
||
var tipsIndex2 = layer.tips(lis, '#msgAdd',{tips:[3, '#ffffff']});
|
||
$("#666777").focus();
|
||
$("#666777").blur(function() {
|
||
layer.close(tipsIndex2);
|
||
});
|
||
}
|
||
});
|
||
// 线程历史记录单机显示
|
||
$('#thread').on('click', function(){
|
||
var threadHistory = window.localStorage ? window.localStorage.getItem('threadHistory') : undefined;
|
||
if(threadHistory){
|
||
var items = JSON.parse(threadHistory);
|
||
var lis = '<input id="666777888" style="display: block;width:0;height:0;" >';
|
||
for (var msgHistoryKey in items) {
|
||
var item = items[msgHistoryKey];
|
||
lis += '<div onclick="setThreadHistory('+msgHistoryKey+')" class="single-line" style="width:240px;color:black;overflow: hidden;">'+item+'</div>';
|
||
}
|
||
var tipsIndex3 = layer.tips(lis, '#thread',{tips:[3, '#ffffff']});
|
||
$("#666777888").focus();
|
||
$("#666777888").blur(function() {
|
||
layer.close(tipsIndex3);
|
||
});
|
||
}
|
||
});
|
||
}
|
||
|
||
function setThreadHistory(index){
|
||
var threadHistory = window.localStorage ? window.localStorage.getItem('threadHistory') : undefined;
|
||
if(threadHistory) {
|
||
var items = JSON.parse(threadHistory);
|
||
$('#thread').val(items[index]+'');
|
||
}
|
||
layer.closeAll();
|
||
};
|
||
function setMsgHistory(id,index){
|
||
var msgHistory = window.localStorage ? window.localStorage.getItem('msgHistory') : undefined;
|
||
if(msgHistory) {
|
||
var items = JSON.parse(msgHistory);
|
||
$('#'+id).val(items[index]+'');
|
||
}
|
||
layer.closeAll();
|
||
};
|
||
|
||
function showClassName(logger){
|
||
if(logger){
|
||
return logger.substring(logger.lastIndexOf('.')+1 || 0);
|
||
}
|
||
return logger;
|
||
}
|
||
|
||
function next(){
|
||
if(parseInt($('#already').text()) >= parseInt($('#total').text())){
|
||
// layer.msg('已经加载完所有数据!');
|
||
return;
|
||
}
|
||
// 重置数量 form.val('formId');
|
||
var data = layui.form.val('search-form');
|
||
// document.getElementById('initBtn').innerText = new Date().getTime()+'====' + JSON.stringify(data);
|
||
var levels = [];
|
||
var overMatchSelected = false;
|
||
var similaritySelected = false;
|
||
if (data.info && data.info === 'on') {
|
||
levels.push('INFO')
|
||
}
|
||
if (data.error && data.error === 'on') {
|
||
levels.push('ERROR')
|
||
}
|
||
if (data.debug && data.debug === 'on') {
|
||
levels.push('DEBUG')
|
||
}
|
||
if (data.time && data.time === 'on') {
|
||
levels.push('TIME')
|
||
}
|
||
if (data.trace && data.trace === 'on') {
|
||
levels.push('TRACE')
|
||
}
|
||
if (data.overMatchSelected && data.overMatchSelected === 'on') {
|
||
overMatchSelected = true
|
||
}
|
||
if (data.similaritySelected && data.similaritySelected === 'on') {
|
||
similaritySelected = true
|
||
}
|
||
loadMore(levels, overMatchSelected, similaritySelected);
|
||
}
|
||
|
||
function setChooseLogger(){
|
||
var chooseLoggers = layui.treeTable.checked(treeTable1);
|
||
var loggerStr = '';
|
||
if(chooseLoggers){
|
||
for(var index in chooseLoggers){
|
||
if(loggerStr.length > 0){loggerStr += ',';}
|
||
var key = chooseLoggers[index];
|
||
loggerStr += loggerTemp[key] && loggerTemp[key].value;
|
||
}
|
||
}
|
||
$("#logger").val(loggerStr);
|
||
}
|
||
function resetForm(){
|
||
$("#logger").val('');
|
||
$("#thread").val('');
|
||
$("#msg").val('');
|
||
$("input[name='error']").prop('checked', true);
|
||
$("input[name='info']").prop('checked', true);
|
||
$("input[name='debug']").prop('checked', false);
|
||
$("input[name='time']").prop('checked', false);
|
||
$("input[name='trace']").prop('checked', false);
|
||
$("input[name='overMatchSelected']").prop('checked', true);
|
||
$("input[name='similaritySelected']").prop('checked', false);
|
||
// loggers程序重置
|
||
treeTable1.checked = {
|
||
key: 'id',
|
||
data: [],
|
||
};
|
||
layui.treeTable.render(treeTable1);
|
||
layui.form.render();
|
||
// 日期重置
|
||
setDefaultTime(0,true);
|
||
// 重置滚动条为0
|
||
scrollTop = 0;
|
||
$('.layui-table-body').scrollTop(0)
|
||
// 关闭弹窗
|
||
layer.closeAll();
|
||
}
|
||
|
||
function setDefaultTime(offset,flag){
|
||
var timestamp = Date.now();
|
||
var dateNow = new Date(timestamp);
|
||
var beforeDate = new Date(timestamp-offset);
|
||
|
||
|
||
// 当前时间年月日时分秒
|
||
var behindYear = dateNow.getFullYear();
|
||
var behindMonth = dateNow.getMonth() + 1; // 月份从0开始，需要加1
|
||
var behindDay = dateNow.getDate();
|
||
var behindHours = flag ? 23 : dateNow.getHours();
|
||
var behindMinutes = flag ? 59 : dateNow.getMinutes();
|
||
var behindSeconds = flag ? 59 :dateNow.getSeconds();
|
||
// 前面时间年月日时分秒
|
||
var beforeYear = beforeDate.getFullYear();
|
||
var beforeMonth = beforeDate.getMonth() + 1; // 月份从0开始，需要加1
|
||
var beforeDay = beforeDate.getDate();
|
||
var beforeHours = flag ? 0 : beforeDate.getHours();
|
||
var beforeMinutes = flag ? 0 : beforeDate.getMinutes();
|
||
var beforeSeconds = flag ? 0 :beforeDate.getSeconds();
|
||
|
||
var beforeMMddHHmmss = ''+(beforeMonth>9 ? beforeMonth : '0' + beforeMonth) + '-' + (beforeDay>9 ? beforeDay : '0' + beforeDay)
|
||
+ ' '+(beforeHours>9 ? beforeHours : '0' + beforeHours)
|
||
+ ':' + (beforeMinutes>9 ? beforeMinutes : '0' + beforeMinutes)
|
||
+ ':' + (beforeSeconds>9 ? beforeSeconds : '0' + beforeSeconds);;
|
||
var beforeyyyyMMddHHmmss = beforeYear+'-'+(beforeMonth>9 ? beforeMonth : '0' + beforeMonth) + '-' + (beforeDay>9 ? beforeDay : '0' + beforeDay)
|
||
+ ' '+(beforeHours>9 ? beforeHours : '0' + beforeHours)
|
||
+ ':' + (beforeMinutes>9 ? beforeMinutes : '0' + beforeMinutes)
|
||
+ ':' + (beforeSeconds>9 ? beforeSeconds : '0' + beforeSeconds);
|
||
|
||
var behindMMddHHmmss = ''+(behindMonth>9 ? behindMonth : '0' + behindMonth) + '-' + (behindDay>9 ? behindDay : '0' + behindDay)
|
||
+ ' '+(behindHours>9 ? behindHours : '0' + behindHours)
|
||
+ ':' + (behindMinutes>9 ? behindMinutes : '0' + behindMinutes)
|
||
+ ':' + (behindSeconds>9 ? behindSeconds : '0' + behindSeconds);;
|
||
var behindyyyyMMddHHmmss = behindYear+'-'+(behindMonth>9 ? behindMonth : '0' + behindMonth) + '-' + (behindDay>9 ? behindDay : '0' + behindDay)
|
||
+ ' '+(behindHours>9 ? behindHours : '0' + behindHours)
|
||
+ ':' + (behindMinutes>9 ? behindMinutes : '0' + behindMinutes)
|
||
+ ':' + (behindSeconds>9 ? behindSeconds : '0' + behindSeconds);
|
||
|
||
$("#startTime").val(beforeyyyyMMddHHmmss);
|
||
$("#endTime").val(behindyyyyMMddHHmmss);
|
||
|
||
layui.laydate.render({
|
||
elem: '#date1'
|
||
, value: beforeMMddHHmmss +' - ' + behindMMddHHmmss
|
||
});
|
||
}
|
||
|
||
function loadMore(levels,overMatchSelected,similaritySelected){
|
||
|
||
// 获取选中的数据源
|
||
var selectedValue = $('#dataSourceSelect').val();
|
||
|
||
if(!selectedValue){
|
||
layer.msg('请先选择数据源');
|
||
return;
|
||
}
|
||
var source = sourceTemp[selectedValue];
|
||
var loggers = [];
|
||
// 获取选中的loggers
|
||
var loggerStr = $("#logger").val();
|
||
|
||
if(loggerStr){
|
||
var strarr = loggerStr.split(',');
|
||
for (var strarrIndex in strarr) {
|
||
var temp = {
|
||
"pinyin": "",
|
||
"title": "",
|
||
"index": 0,
|
||
"favourite": false,
|
||
"type": "OTHER",
|
||
"value": strarr[strarrIndex],
|
||
"children": [],
|
||
"pid": 0,
|
||
"id": 0
|
||
}
|
||
loggers.push(temp)
|
||
}
|
||
}
|
||
|
||
var index = layer.load(2); //换了种风格
|
||
try{
|
||
var form = parseInt($("#already").text()) || 0;
|
||
var dataJson = {
|
||
source: source,
|
||
startTime: $("#startTime").val(),
|
||
endTime: $("#endTime").val(),
|
||
logger: loggers,
|
||
thread: $("#thread").val(),
|
||
levels: levels,
|
||
msg: $("#msg").val(),
|
||
msgAdd: $("#msgAdd").val(),
|
||
overMatchSelected: overMatchSelected,
|
||
similaritySelected: similaritySelected,
|
||
from: form,
|
||
size: size
|
||
}
|
||
var params = 'source=' + JSON.stringify(source) +'&startTime='+$("#startTime").val()+'&endTime='+$("#endTime").val()+'&logger='+loggers
|
||
+'&thread='+$("#thread").val()+'&levels='+levels+'&msg='+$("#msg").val()+'&msgAdd='+$("#msgAdd").val()+'&overMatchSelected='+overMatchSelected+'&similaritySelected='+similaritySelected
|
||
+'&from='+form+'&size='+size;
|
||
var dataStr = JSON.stringify(dataJson);
|
||
// document.getElementById('initBtn').innerText = new Date().getTime()+'====dataStr:' + dataStr;
|
||
$.ajax({
|
||
url: "http://10.30.35.208:9999//es/es-query",
|
||
type: 'POST',
|
||
dataType: 'json',
|
||
contentType:'application/json', // 指定编码格式
|
||
// headers: {
|
||
// 'content-type': 'application/json',
|
||
// },
|
||
data: dataStr,
|
||
success: function (result) {
|
||
if(result.code === 200 && result.data.code === 0){
|
||
var data = result.data.data;
|
||
$("#total").text(result.data.size);
|
||
//layer.msg(result.message);
|
||
dataTemp = dataTemp.concat(data)
|
||
$("#already").text(dataTemp.length);
|
||
|
||
layui.use('table', function() {
|
||
var table = layui.table;
|
||
table.reload('msgTable', {
|
||
data: dataTemp,
|
||
});
|
||
});
|
||
|
||
//关闭
|
||
setTimeout(function () {
|
||
layer.close(index);
|
||
},300);
|
||
|
||
}else{
|
||
layer.msg(result.data.message || result.msg);
|
||
//关闭
|
||
setTimeout(function () {
|
||
layer.close(index);
|
||
},300);
|
||
}
|
||
},
|
||
error: function (xhrJson,status,error) {
|
||
// 1. 创建ajax对象（异步对象）
|
||
let xmlHttpRequest = new XMLHttpRequest();
|
||
// 2. 创建请求
|
||
// xhr.open('请求方法','url地址','是否采用异步处理去访问接口true/false')
|
||
xmlHttpRequest.open("POST", "http://10.30.35.208:9999/es/es-query");
|
||
// // 3. 设置 Content-Type 属性（固定写法）
|
||
xmlHttpRequest.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded')
|
||
// // 3. 发送请求
|
||
xmlHttpRequest.send(params);
|
||
// 4. 监听状态，接收响应
|
||
xmlHttpRequest.onreadystatechange = function() {
|
||
// document.getElementById('initBtn').innerText = new Date().getTime()+'====xhr:' + JSON.stringify(xmlHttpRequest.response);
|
||
var result = JSON.parse(xmlHttpRequest.response);
|
||
// document.getElementById('initBtn').innerText = new Date().getTime()+'====xhr:' + JSON.stringify(result);
|
||
// 4.1 监听 xhr 对象的请求状态 readyState ；与服务器响应的状态 status
|
||
// if (xmlHttpRequest.readyState === 4&& xmlHttpRequest.status === 200) {
|
||
// // 4.2 使用xhr.response 获取服务器返回的数据
|
||
// document.getElementById('initBtn').innerText = new Date().getTime()+'====xhr:' + JSON.stringify();
|
||
// }else{
|
||
// layer.msg(result.data.message || result.msg);
|
||
// //关闭
|
||
// setTimeout(function () {
|
||
// layer.close(index);
|
||
// },300);
|
||
// }
|
||
// document.getElementById('initBtn').innerText = new Date().getTime()+'====result.code:' +result
|
||
if(result.code === 200 && result.data.code === 0){
|
||
var data = result.data.data;
|
||
$("#total").text(result.data.size);
|
||
//layer.msg(result.message);
|
||
dataTemp = dataTemp.concat(data)
|
||
$("#already").text(dataTemp.length);
|
||
|
||
layui.use('table', function() {
|
||
var table = layui.table;
|
||
table.reload('msgTable', {
|
||
data: dataTemp,
|
||
});
|
||
});
|
||
|
||
//关闭
|
||
setTimeout(function () {
|
||
layer.close(index);
|
||
},300);
|
||
|
||
}else{
|
||
layer.msg(result.data.message || result.msg);
|
||
//关闭
|
||
setTimeout(function () {
|
||
layer.close(index);
|
||
},300);
|
||
}
|
||
}
|
||
}
|
||
});
|
||
}catch (e){
|
||
layer.msg("e:"+JSON.stringify(e))
|
||
console.log(e)
|
||
//关闭
|
||
layer.close(index);
|
||
}finally {
|
||
|
||
console.log(3)
|
||
//关闭
|
||
setTimeout(function () {
|
||
layer.close(index);
|
||
},10000);
|
||
}
|
||
|
||
}
|
||
|
||
function loadLoggerItems() {
|
||
// 获取选中的数据源
|
||
var selectedValue = $('#dataSourceSelect').val();
|
||
if(!selectedValue){
|
||
layer.msg('请先选择数据源');
|
||
return;
|
||
}
|
||
var source = sourceTemp[selectedValue];
|
||
if(loggerTemp && Object.keys(loggerTemp).length === 0){
|
||
$.ajax({
|
||
url: "http://10.30.35.208:9999/es/" + source.config,
|
||
type: 'GET',
|
||
dataType: 'JSON',
|
||
contentType:'application/json',
|
||
success: function (result) {
|
||
//layer.msg("result:"+JSON.stringify(result))
|
||
loggerTemp = {};
|
||
loggerKeyTemp = {};
|
||
var tempData = [];
|
||
for(var index in result.data){
|
||
var item = result.data[index];
|
||
loggerTemp[item.id] = item;
|
||
loggerKeyTemp[item.value] = item.title || item.name;
|
||
tempData.push(item)
|
||
}
|
||
treeTable1.data = tempData;
|
||
layui.treeTable.render(treeTable1);
|
||
},
|
||
});
|
||
}
|
||
}
|
||
|
||
function showTreeFix(){
|
||
var windowHeight = window.innerHeight || document.documentElement.clientHeight || document.body.clientHeight;
|
||
var windowWight = window.innerWidth || document.documentElement.clientWidth || document.body.clientWidth;
|
||
layer.open({
|
||
type: 1,
|
||
title: '程序别名',
|
||
maxmin: true,
|
||
moveOut: true,
|
||
btn: ['确定','关闭','清除选择并关闭'],
|
||
area: [windowWight * 0.8 + 'px', windowHeight * 0.8 + 'px'],
|
||
content: $("#tree-table"), //这里content是一个DOM，注意：最好该元素要存放在body最外层，否则可能被其它的相对元素所影响
|
||
yes: function(index, layero){
|
||
setChooseLogger();
|
||
$("#tree-table").css("display", "none");
|
||
layer.close(index)
|
||
return true;
|
||
}
|
||
,btn2: function(index, layero){
|
||
$("#tree-table").css("display", "none");
|
||
layer.close(index)
|
||
return true;
|
||
}
|
||
,btn3: function(index, layero){
|
||
$("#logger").val('');
|
||
treeTable1.checked = {
|
||
key: 'id',
|
||
data: [],
|
||
};
|
||
layui.treeTable.render(treeTable1);
|
||
layui.form.render();
|
||
$("#tree-table").css("display", "none");
|
||
layer.close(index)
|
||
return true;
|
||
},
|
||
cancel: function (index, layero) {
|
||
$("#tree-table").css("display", "none");
|
||
layer.close(index)
|
||
return true;
|
||
}
|
||
});
|
||
}
|
||
|
||
function fastFilter(){
|
||
$("#thread").val($("#thread2").val());
|
||
// $("#logger").val($("#logger2").val());
|
||
$("#tree-table").css("display", "none");
|
||
$("#detailContent").css("display", "none");
|
||
layer.closeAll();
|
||
}
|
||
|
||
function filterThread(){
|
||
$("#thread").val($("#thread2").val());
|
||
$("#tree-table").css("display", "none");
|
||
$("#detailContent").css("display", "none");
|
||
layer.closeAll();
|
||
}
|
||
|
||
function closeDetail(){
|
||
$("#tree-table").css("display", "none");
|
||
$("#detailContent").css("display", "none");
|
||
layer.closeAll();
|
||
}
|
||
|
||
function copyMsg(){
|
||
var msg = $("#msg2").val();
|
||
// HTML元素的id为"myText"
|
||
var text = $("#msg2").text(); //获取要复制的文本内容
|
||
copyToClipboard(text); //调用函数并传入要复制的文本内容
|
||
layer.msg('复制成功');
|
||
}
|
||
|
||
function copyToClipboard(elementId) {
|
||
var aux = document.createElement("input");
|
||
aux.setAttribute("value", elementId);
|
||
document.body.appendChild(aux);
|
||
aux.select();
|
||
document.execCommand("copy");
|
||
document.body.removeChild(aux);
|
||
}
|
||
|
||
function saveHistory(){
|
||
// 将输入存入到历史
|
||
var msg = $('#msg').val();
|
||
var thread = $('#thread').val();
|
||
if(window.localStorage){
|
||
var msgHistory = window.localStorage.getItem('msgHistory');
|
||
var threadHistory = window.localStorage.getItem('threadHistory');
|
||
if(msg){
|
||
if(!msgHistory){// 没有记录
|
||
var items = [msg];
|
||
window.localStorage.setItem('msgHistory',JSON.stringify(items));
|
||
}else{
|
||
var items = JSON.parse(msgHistory);
|
||
// 判断对象是否存在，存在那么不管
|
||
if (items.includes(msg)) {
|
||
console.log("数组包含该值");
|
||
} else {
|
||
// 添加到头
|
||
items.unshift(msg);
|
||
if(items.length >= 8){
|
||
//删除最后一个
|
||
items.pop();
|
||
}
|
||
window.localStorage.setItem('msgHistory',JSON.stringify(items));
|
||
}
|
||
}
|
||
}
|
||
if(thread){
|
||
if(!threadHistory){// 没有记录
|
||
var items = [thread];
|
||
window.localStorage.setItem('threadHistory',JSON.stringify(items));
|
||
}else{
|
||
var items = JSON.parse(threadHistory);
|
||
// 判断对象是否存在，存在那么不管
|
||
if (items.includes(thread)) {
|
||
console.log("数组包含该值");
|
||
} else {
|
||
// 添加到头
|
||
items.unshift(thread);
|
||
if(items.length >= 8){
|
||
//删除最后一个
|
||
items.pop();
|
||
}
|
||
window.localStorage.setItem('threadHistory',JSON.stringify(items));
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
function help(){
|
||
layer.alert('1.勾选匹配度查询时将不会以时间进行排序，而是以文档相似计算得分，得分越高越靠前。<br>' +
|
||
'2.数据源选择会暂存到浏览器，下次打开时会默认选择该数据源。<br>' +
|
||
'3.日志级别说明：错误:ERROR 信息:INFO 耗时:TIME 调试:DEBUG 追踪:TRACE。<br>' +
|
||
'4.网页加载数据比较慢，请不要将加载行数设置过大，以免把服务器搞蹦啦~o(╥﹏╥)o。</br>' +
|
||
'5.表格高度是计算的，当浏览器宽高变化时，请右键刷新或者F5刷新浏览器即可从新计算显示表格高度。</br>', {icon: 3});
|
||
}
|
||
</script>
|
||
</html>
|