Authored by wangtao

即时消息功能增加对于es、influxdb、tdengine的支撑(支持监控数据库的查询操作/文本,es、influxdb、tdengine暂时不支持)

... ... @@ -37,6 +37,7 @@ layui.define(['table', 'form', 'admin', 'layer', 'common', 'sessions', 'treeTabl
noticeTimely.sendState = noticeTimely.sendState == 1 ? 1 : 0;
noticeTimely.state = noticeTimely.state == 2 ? 1 : 0;
form.val('form-noticeTimely-add', noticeTimely);
$('[name="templates"]').val(noticeTimely.templates);
bloatedSite(noticeTimely.site);
bloatedParameter(noticeTimely);
if (response.data) {
... ... @@ -72,11 +73,11 @@ layui.define(['table', 'form', 'admin', 'layer', 'common', 'sessions', 'treeTabl
},
});
//响应声音事件
form.on('select(noticeTimely_voice)', function(data){
var url='../src/style/mp3/'+data.value+'.mp3';
var audio=common.audioPlayer(url);
audio.playclip();
});
// form.on('select(noticeTimely_voice)', function(data){
// var url='../src/style/mp3/'+data.value+'.mp3';
// var audio=common.audioPlayer(url);
// audio.playclip();
// });
//选择用户
$("#noticeTimely-form-select-users").on("click",function (){
//获取
... ... @@ -100,8 +101,24 @@ layui.define(['table', 'form', 'admin', 'layer', 'common', 'sessions', 'treeTabl
}
});
});
// 播放mp3
$("#playMp3").on("click",function () {
var name = $('#noticeTimely_voice').val();
var mp3Url = `/src/style/mp3/${name}.mp3`;
var player = new Audio(mp3Url);
player.play();
});
//添加消息状态
$("#editNoticeTimelyParamBtn").on("click",function () {
let testStatus = $('#layui-notice_timely_sql_test').attr('test-status');
if(!testStatus || testStatus != 'success'){
layer.msg('请先测试脚本!', {icon: 7,time:3000});
return;
}
var html = $("#noticeTimelyParamAddRowHtml").html();
$('#notice_timely_param_level').append(html);
$('#notice_timely_param_sql').removeClass('hide');
... ... @@ -121,7 +138,7 @@ layui.define(['table', 'form', 'admin', 'layer', 'common', 'sessions', 'treeTabl
//写入标签内容
function writeTagsInfo(data) {
var tags = `
<span id="tags_span_${data.id}" data-id="${data.id}" data-username="${data.username}"
<span id="tags_span_${data.id}" style="margin: 3px;" data-id="${data.id}" data-username="${data.username}"
data-nickname="${data.nickname}" data-phone="${data.phone}" ><em>${data.nickname}</em>
<button type="button" value="${data.id}" class="tagsclose close">×</button>
</span>
... ... @@ -179,9 +196,13 @@ layui.define(['table', 'form', 'admin', 'layer', 'common', 'sessions', 'treeTabl
Object.assign(noticeTimely, form.val('form-noticeTimely-add'));
//状态是否为开启
noticeTimely.state = statusChange(document.querySelector("#switch_noticeTimely_state").checked ? 1 : 0);
noticeTimely.broadcast = statusChange(document.querySelector("#switch_noticeTimely_broadcast").checked ? 0 : 1);
noticeTimely.retry = statusChange(document.querySelector("#switch_noticeTimely_retry").checked ? 0 : 1);
noticeTimely.sendState = statusChange(document.querySelector("#switch_noticeTimely_sendState").checked ? 0 : 1);
// 是否广播消息 1是,2否
noticeTimely.broadcast = 2;//statusChange(document.querySelector("#switch_noticeTimely_broadcast").checked ? 0 : 1);
// 是否重发 1重发,2不重发
noticeTimely.retry = 2;//statusChange(document.querySelector("#switch_noticeTimely_retry").checked ? 0 : 1); //
// 发送状态 1已发送,2未发送
noticeTimely.sendState = 2;//statusChange(document.querySelector("#switch_noticeTimely_sendState").checked ? 0 : 1);
noticeTimely.noticeNames = userNames;
var noticeStateList = [];
//获取消息状态列表
... ... @@ -201,7 +222,10 @@ layui.define(['table', 'form', 'admin', 'layer', 'common', 'sessions', 'treeTabl
noticeTimely.site = $('#notice_timely_select').val() + $('#notice_timely_site').val();
//获取配置参数
var map = getParam();
noticeTimely.grade = map.grade;
if(!map){
return ;
}
noticeTimely.msgSetting = JSON.stringify(map.msgSetting);
noticeTimely.templates = map.templates;
layer.load(2);
admin.req({
... ... @@ -333,21 +357,32 @@ layui.define(['table', 'form', 'admin', 'layer', 'common', 'sessions', 'treeTabl
}
, success: function (res) {
if (res && res.data && res.data.length > 0) {
// 增加测试成功属性
$('#layui-notice_timely_sql_test').attr('test-status','success');
//更新行数
var list = res.data;
//默认取值第一个
var keys = Object.keys(list[0]);
var details_tags = '';
var html = '';
keys.forEach(item => {
html += '<option value="' + item + '">' + item + '</option>'
//
details_tags += `<span id="tags_span_${item}" class="layui-badge layui-bg-blue" style="margin: 3px;" ><em>${item}</em></span>`;
})
$.each($('.notice_time_select_sql_value'), function (i, v) {
$(this).empty();
$(this).append(html);
})
layer.msg('验证SQL通过!', {icon: 1, time: 3000});
$('#details_tags').append(details_tags);
$('#details_tags span').on('click',function (){
$('[name="templates"]').val($('[name="templates"]').val() + '#{'+$(this).text() + '}');
});
layer.msg('脚本验证通过!', {icon: 1, time: 3000});
} else {
layer.msg('验证SQL失败!', {icon: 7, time: 3000});
layer.msg('脚本验证失败,请检查!', {icon: 7, time: 3000});
}
}
});
... ... @@ -355,6 +390,7 @@ layui.define(['table', 'form', 'admin', 'layer', 'common', 'sessions', 'treeTabl
//获取配置参数
function getParam() {
debugger
var map = getRowName();
var pa = '';
map.rowNameList.forEach(item => {
... ... @@ -364,38 +400,58 @@ layui.define(['table', 'form', 'admin', 'layer', 'common', 'sessions', 'treeTabl
pa = pa.substring(0, pa.length - 1);
}
//获取模板和等级
var str = {
grade: '1',
var obj = {
msgSetting: '',
templates: pa
};
var errMsg = '';
if (!$('#notice_timely_param_sql').hasClass('hide')) {
//获取模板信息
var val = $('#notice_timely_param_sql').find('textarea[name="details"]').eq(0).val();
str.templates = val ? val : pa;
var btn= $('#notice_timely_param_level').find('.layui-notice-time-btn').eq(0).val();
if(btn){
//获取颜色
//行名
var row = $('#notice_timely_param_level').find('.notice_time_select_sql_value').eq(0).val();
//条件
var condition = $('#notice_timely_param_level').find('.notice_time_select_symbol').eq(0).val();
//值1
var value1 = btn;
//颜色
var colour = $('#notice_timely_param_level').find('.notice_time_select_colour').eq(0).val();
//值2
var value2 = map.dataList[0][row] ? map.dataList[0][row] : '';
var sign = compareSize(value2, condition, value1);
//判断类型
if (sign) {
str.grade = colour;
}
}else{
var colour = $('#notice_timely_param_level').find('.notice_time_select_colour').eq(0).val();
str.grade = colour;
// 获取模板信息
var val = $('#notice_timely_param_sql').find('textarea[name="templates"]').eq(0).val();
obj.templates = val ? val : pa;
var arr = [];
// 获取条件行
var msgSettings = $('#notice_timely_param_level').find('.msgSetting');
if(msgSettings && msgSettings.length > 0){
$(msgSettings).each(function (i,v){
if(v){
var settingItem = $(v);
var fieldName = settingItem.find('.notice_time_select_sql_value').val();
var condition = settingItem.find('.notice_time_select_symbol').val();
var conditionVal = settingItem.find('.layui-notice-time-btn').val();
var msgLevel = settingItem.find('.notice_time_select_colour').val();
if(fieldName == '' || condition =='' || conditionVal ==''|| msgLevel =='' ||
fieldName == null || condition == null || conditionVal == null|| msgLevel == null){
if(errMsg != ''){
errMsg = "请完善展示设置的条件!";
}
return;
}
arr.push({
fieldName:fieldName,
condition:condition,
conditionVal:conditionVal,
msgLevel:msgLevel,
})
}
})
}
if(arr.length > 0){
obj.msgSetting = arr;
}
}
return str;
if(errMsg != ''){
layer.msg(errMsg.join('<br/>'), {icon: 7, time: 3000});
return undefined;
}
// 验证数据
return obj;
}
//比大小
... ... @@ -432,4 +488,4 @@ layui.define(['table', 'form', 'admin', 'layer', 'common', 'sessions', 'treeTabl
return regPos.test(val) || regNeg.test(val);
}
});
});
\ No newline at end of file
});
... ...
... ... @@ -207,7 +207,7 @@ layui.define(['table', 'form', 'admin', 'layer', 'common', 'sessions', 'treeTabl
var checked = d.state == 2 ? 'checked' : '';
return '<div><input type="checkbox" data-id="' + d.id + '" lay-filter="switch_noticeTimely_checkbox_state" name="state" lay-skin="switch" lay-text="启用|禁用" ' + checked + ' ></div>'
}
}, {
}, /*{
field: 'broadcast', title: '是否广播', align: 'center', width: '100',
templet: function (d) {
var checked = d.broadcast == 1 ? 'checked' : '';
... ... @@ -219,7 +219,7 @@ layui.define(['table', 'form', 'admin', 'layer', 'common', 'sessions', 'treeTabl
var checked = d.retry == 1 ? 'checked' : '';
return '<div><input type="checkbox" data-id="' + d.id + '" lay-filter="switch_noticeTimely_checkbox_retry" name="retry" lay-skin="switch" lay-text="重发|不重发" ' + checked + ' ></div>'
}
}, {
}, */{
title: '操作', align: 'center', minWidth: '150', fixed: 'right',
templet:
'<div>' +
... ... @@ -341,4 +341,4 @@ layui.define(['table', 'form', 'admin', 'layer', 'common', 'sessions', 'treeTabl
});
}
});
});
\ No newline at end of file
});
... ...
... ... @@ -465,7 +465,7 @@ layui.extend({
new msgTips({
dom: ".right-bottom-tips",
title: "告警消息",
message: `<p style="line-height: 40px">${v.alarmContent}</p>`,
message: `<p style="line-height: 20px">${v.alarmContent}</p>`,
duration: 10000,
space: 10,
firstSpace: 8,
... ... @@ -539,7 +539,7 @@ layui.extend({
new msgTips({
dom: ".right-bottom-tips",
title: title,
message: `<p style="line-height: 40px">${content}</p>`,
message: `<p style="line-height: 20px">${content}</p>`,
duration: 10000,
space: 10,
firstSpace: 8,
... ...
... ... @@ -11,105 +11,103 @@
</div>
</div>
<div class="inline-half layui-inline">
<label class="layui-form-label">频率</label>
<div class="layui-input-inline">
<input type="text" id="sentFrequency_input_noticeTimely" name="frequency" lay-verify="required"
placeholder="请输入频率" class="layui-input">
</div>
<div class="layui-form-mid layui-word-aux" id="show_corn_info_frequency"
style="padding: 0!important;position: relative;line-height: 38px;display: flex;justify-content: center;margin: 0px;margin-left: 5px;">
<i class="layui-icon form-btn-icon">&#xe702;</i>
</div>
</div>
</div>
<div class="layui-form-item" style="display: flex;justify-content: space-between;">
<div class="layui-inline" style="flex: 1;">
<label class="layui-form-label">状态</label>
<div class="layui-input-inline" style="margin-left: 20px;;width: 100px">
<!-- <div class="layui-input-inline" style="width: calc(20vw - 142px);margin-right:65px;margin-left: 50px;">-->
<div class="layui-input-inline" style="padding-left: 6px">
<input type="checkbox" id="switch_noticeTimely_state" name="state" lay-skin="switch" lay-text="启用|禁用" value="0" >
</div>
</div>
<div class="layui-inline" style="flex: 1;">
<label class="layui-form-label" >是否广播</label>
<div class="layui-input-inline" style="margin-left: 20px;width: 100px">
<input type="checkbox" id="switch_noticeTimely_broadcast" name="broadcast" lay-skin="switch" lay-text="是|否" value="0" >
</div>
</div>
<div class="layui-inline" style="">
<label class="layui-form-label">是否轮循</label>
<div class="layui-input-inline" style="margin-left: 20px;width: 100px">
<input type="checkbox" id="switch_noticeTimely_retry" name="retry" lay-skin="switch" lay-text="轮循|不轮循" value="0" >
</div>
</div>
<div class="layui-inline" style="display: none !important;">
<label class="layui-form-label">发送状态</label>
<div class="layui-input-inline" style="width: calc(20vw - 142px);margin-right:0px;margin-left: 50px;">
<input type="checkbox" id="switch_noticeTimely_sendState" name="sendState" lay-skin="switch" lay-text="已发送|未发送" value="0" >
</div>
</div>
</div>
<div class="layui-form-item">
<div class="inline-half layui-inline" style="display: none!important;">
<label class="layui-form-label" style="font-size: 12px">重发延迟时间</label>
<div class="layui-input-inline">
<input type="text" name="retryTime" placeholder="请输入重发延迟时间(秒)" class="layui-input">
<div class="inline-half layui-inline" style="width: 100%">
<label class="layui-form-label">频率</label>
<div style="width: calc(100% - 110px)">
<div class="layui-input-inline" style="width: calc(100% - 10px);display: inline-flex;">
<input type="text" id="sentFrequency_input_noticeTimely" name="frequency" lay-verify="required"
placeholder="请输入频率" class="layui-input">
<i id="show_corn_info_frequency" class="layui-icon form-btn-icon" style="line-height: 32px;margin-left: 5px;">&#xe702;</i>
</div>
</div>
</div>
</div>
<!--添砖地址功能待优化-->
<!--<div class="layui-form-item">
<div class="inline-half layui-inline" style="width: 100%">
<label class="layui-form-label">跳转地址</label>
<div style="width: 95%">
<div class="layui-input-inline" style="width: 46%;">
<div style="width: calc(100% - 110px)">
<div class="layui-input-inline" style="width: 200px;">
<select id="notice_timely_select">
<option selected="selected" disabled="disabled" style='display: none' value=''></option>
</select>
</div>
<div class="layui-input-inline" style="margin-left: 1px;width: 52%;">
<div class="layui-input-inline" style="width: calc(100% - 210px);display: inline-flex;">
<input type="text" name="site" id="notice_timely_site" placeholder="请输入详情页地址" class="layui-input">
<i id="show_corn_info_state" class="layui-icon form-btn-icon" style="line-height: 32px;margin-left: 5px;">&#xe702;</i>
</div>
<div class="layui-form-mid layui-word-aux" id="show_corn_info_state"
style="padding: 0!important;position: relative;line-height: 38px;display: flex;justify-content: center;margin: 0px;margin-left: 5px;">
<i class="layui-icon form-btn-icon">&#xe702;</i>
</div>
</div>
</div>-->
<div class="layui-form-item">
<div class="inline-half layui-inline" style="width: 100%">
<label class="layui-form-label">发送用户</label>
<div style="width: calc(100% - 110px)">
<div class="layui-input-inline" style="width: calc(100% - 10px);display: inline-flex;">
<div class="tags" id="select_noticeTimely_id_user" style="width: calc(100% - 20px);border: solid 1px #D2D2D2;margin-top: 0px;height: 36px;"></div>
<i class="layui-icon form-btn-icon" id="noticeTimely-form-select-users" style="line-height: 36px;margin-left: 5px;">&#xe615;</i>
</div>
</div>
</div>
</div>
<div class="layui-form-item">
<div class="inline-half layui-inline" style="display: none!important;">
<div class="inline-half layui-inline">
<label class="layui-form-label">响应声音</label>
<div class="layui-input-inline">
<select name="voice" id="noticeTimely_voice" lay-filter="noticeTimely_voice">
<option value="咳咳">咳咳</option>
<option value="微信提醒">微信提醒</option>
<option value="滑稽">滑稽</option>
</select>
<div style="display: flex">
<div style=" width: calc(100% - 60px);">
<select name="voice" id="noticeTimely_voice" lay-filter="noticeTimely_voice" >
<option value="14039">叮咚</option>
<option value="咳咳">咳咳</option>
<option value="微信提醒">微信提醒</option>
<option value="滑稽">滑稽</option>
</select>
</div>
<button type="button" class="layui-btn layui-btn-primary" id="playMp3" style="margin-left: 2px">
<i class="layui-icon">&#xe652;</i>
</button>
</div>
</div>
</div>
<div class="inline-half layui-inline" style="display: none!important;">
<div class="inline-half layui-inline">
<label class="layui-form-label">类型</label>
<div class="layui-input-inline">
<input type="text" name="type" placeholder="请输入类型" value="sql" readonly="readonly" class="layui-input">
<select name="type" id="noticeTimely_type" lay-filter="noticeTimely_type">
<option value="sql">监控数据库</option>
<option value="text">文本</option>
<!-- <option value="es">es</option>
<option value="influxdb">时序</option>
<option value="tdEngine">tdEngine</option>-->
</select>
<span>
文本支持:#{now} 当前时间格式:yyyy-MM-dd HH:mm:ss
</span>
</div>
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">用户</label>
<div class="layui-input-block tags-input" style="height: auto;width: 90% !important;">
<div class="tags" id="select_noticeTimely_id_user"></div>
</div>
<div class="layui-form-mid layui-word-aux" style="padding: 0!important;position: relative;top: -28px;left: 98%;justify-content: center;margin-left: 10px; "><i class="layui-icon form-btn-icon" id="noticeTimely-form-select-users">&#xe615;</i></div>
</div>
<div class="layui-form-item">
<label class="layui-form-label textarea-label">内容</label>
<div class="layui-input-block" style="display: flex;flex-direction: column;align-items: flex-end;">
<textarea name="details" placeholder="请输入内容(SQL)" class="layui-textarea" id="layui-notice_timely_sql" style="width: 100%"></textarea>
<div style="width: 100px;height: auto;">
<div style="background-color: #1E9FFF;width: 90px;float: right;display: flex;justify-content: center;height: 40px;line-height: 40px;margin-top: 30px; color: #fff;"
id="layui-notice_timely_sql_test">测试
</div>
<textarea name="details" placeholder="请输入脚本内容" class="layui-textarea" id="layui-notice_timely_sql" style="width: 100%"></textarea>
<div style="width: 100%;padding: 10px 0px;">
<button id="layui-notice_timely_sql_test" class="layui-btn layui-btn-normal">测试脚本</button>
<span style="color: red">* 脚本尽量添加条件,否则一次性查询内容过多导致发送消息失败!(建议发送内容不超过200个汉字)</span>
</div>
</div>
</div>
<button id="btn-noticeTimely-submit" class="hide" lay-submit lay-filter="btn-noticeTimely-submit">提交</button>
</form>
<div class="layui-card-body layui-form-pane editNoticeTimelyParam-list" style="padding-top: 0px;">
... ... @@ -125,16 +123,18 @@
<div class="layui-form-item hide" id="notice_timely_param_sql">
<label class="layui-form-label textarea-label">展示内容</label>
<div class="layui-input-block" style="display: flex;">
<textarea name="details" placeholder="请输入展示内容" class="layui-textarea" style=""></textarea>
<textarea name="templates" placeholder="请输入展示内容" class="layui-textarea" style=""></textarea>
</div>
<div id="details_tags" style="width: 100%;display: flex;flex-wrap: wrap;"></div>
</div>
<div class="layui-form-item hide" id="notice_timely_param_level">
<label class="layui-form-label">展示设置</label>
<span style="color: red">* 列表数据的状态设置办法:获取“第一条”数据的内容进行判断;多条件之间的关系为“且”。</span>
</div>
</div>
</article>
<script type="text/html" id="noticeTimelyParamAddRowHtml">
<div class="layui-form-item">
<div class="layui-form-item msgSetting">
<div class="layui-inline" style="margin-left: 110px">
<div class="layui-notice-time-lable">当数据集中的</div>
<select class="layui-notice-time-select notice_time_select_sql_value">
... ... @@ -142,8 +142,8 @@
</select>
<div class="layui-notice-time-lable" style="width: 40px;">的值</div>
<select class="layui-notice-time-select notice_time_select_symbol">
<option value="0">大于</option>
<option value="1">小于</option>
<option value="0">大于(适用于数字类型、日期类型)</option>
<option value="1">小于(适用于数字类型、日期类型)</option>
<option value="2">等于</option>
</select>
<input type="text" class="layui-notice-time-btn" value="">
... ... @@ -153,7 +153,7 @@
<option value="2">重要(黄色)</option>
<option value="3">严重(红色)</option>
</select>
<div class="layui-notice-time-lable" style="width: 40px;">提示</div>
<div class="layui-notice-time-lable" style="width: 40px;">测试</div>
</div>
</div>
</script>
... ... @@ -215,4 +215,4 @@
layui.use('noticeTimelyAdd', function (fn) {
fn({{d}});
});
</script>
\ No newline at end of file
</script>
... ...