115 lines
4.4 KiB
JavaScript
115 lines
4.4 KiB
JavaScript
$(document).ready(function(){
|
|
var theBlock = $('#tab-accountSettings')
|
|
var mqttList = $('#mqttout_list')
|
|
function drawMqttLsitRow(row){
|
|
row = row ? row : {
|
|
host: '',
|
|
pubKey: '',
|
|
msgFor: [],
|
|
monitors: [],
|
|
}
|
|
var selecteEventsHtml = ''
|
|
$.each([
|
|
{
|
|
value: 'onMonitorSave',
|
|
label: lang['Monitor Edit'],
|
|
},
|
|
{
|
|
value: 'onMonitorStart',
|
|
label: lang['Monitor Start'],
|
|
},
|
|
{
|
|
value: 'onMonitorStop',
|
|
label: lang['Monitor Stop'],
|
|
},
|
|
{
|
|
value: 'onMonitorDied',
|
|
label: lang['Monitor Died'],
|
|
},
|
|
{
|
|
value: 'onEventTrigger',
|
|
label: lang['Detection Event'],
|
|
},
|
|
{
|
|
value: 'onDetectorNoTriggerTimeout',
|
|
label: lang['No Trigger'],
|
|
},
|
|
{
|
|
value: 'onAccountSave',
|
|
label: lang['Account Save'],
|
|
},
|
|
{
|
|
value: 'onUserLog',
|
|
label: lang['User Log'],
|
|
},
|
|
{
|
|
value: 'onTwoFactorAuthCodeNotification',
|
|
label: lang['2-Factor Authentication'],
|
|
},
|
|
],function(n,option){
|
|
selecteEventsHtml += createOptionHtml({
|
|
value: option.value,
|
|
label: option.label,
|
|
selected: row.msgFor.indexOf(option.value) > -1,
|
|
})
|
|
})
|
|
var html = `<div class="d-flex flex-row mqtt-out-list-row vertical-center">
|
|
<div class="px-1 py-2 flex-grow-1">
|
|
<input placeholder="${lang.Example} : mqtt.server.host" class="form-control form-control-sm mb-2" mqtt-param="host" value="${row.host || ''}">
|
|
<input placeholder="${lang.Example} : your/events" class="form-control form-control-sm" mqtt-param="pubKey" value="${row.pubKey || ''}">
|
|
</div>
|
|
<div class="px-1 py-2">
|
|
<input placeholder="${lang.Username}" class="form-control form-control-sm mb-2" mqtt-param="username" value="${row.username || ''}">
|
|
<input placeholder="${lang.Password}" class="form-control form-control-sm" mqtt-param="password" value="${row.password || ''}">
|
|
</div>
|
|
<div class="px-1 py-2">
|
|
<select multiple class="form-control form-control-sm" mqtt-param="msgFor">
|
|
${selecteEventsHtml}
|
|
</select>
|
|
</div>
|
|
<div class="px-1 py-2">
|
|
<select multiple class="form-control form-control-sm" mqtt-param="monitors">
|
|
<option value="$all">${lang['All Monitors']}</option>
|
|
<optgroup label="${lang.Monitors}">${buildMonitorsListSelectFieldHtml(row.monitors || [])}</optgroup>
|
|
</select>
|
|
</div>
|
|
<div class="px-1 py-2">
|
|
<button type="button" class="btn btn-sm btn-danger mqtt-out-delete-row"><i class="fa fa-times"></i></button>
|
|
</div>
|
|
</div>`
|
|
return html
|
|
}
|
|
theBlock.find('.mqtt-out-add-row').click(function(){
|
|
mqttList.append(drawMqttLsitRow())
|
|
});
|
|
mqttList.on('click','.mqtt-out-delete-row',function(){
|
|
$(this).parents('.mqtt-out-list-row').remove()
|
|
});
|
|
accountSettings.onLoadFields(function(theForm){
|
|
var mqttClientList = $user.details.mqttout_list ? $user.details.mqttout_list : []
|
|
mqttList.html(`<div class="flex-grow-1 text-center"><i class="fa fa-spinner fa-pulse"></i></div>`)
|
|
setTimeout(function(){
|
|
var html = ''
|
|
$.each(mqttClientList,function(n,row){
|
|
html += `${drawMqttLsitRow(row,n)}`
|
|
})
|
|
mqttList.html(html)
|
|
},3000)
|
|
})
|
|
accountSettings.onSaveFields(function(theForm){
|
|
var mqttClientList = []
|
|
mqttList.find('.mqtt-out-list-row').each(function(n,v){
|
|
var el = $(v)
|
|
var rowFields = {}
|
|
el.find('[mqtt-param]').each(function(nn,param){
|
|
var paramEl = $(param)
|
|
var theKey = paramEl.attr('mqtt-param')
|
|
var value = paramEl.val()
|
|
rowFields[theKey] = value
|
|
})
|
|
mqttClientList.push(rowFields)
|
|
})
|
|
theForm.details.mqttout_list = mqttClientList
|
|
})
|
|
})
|