feat(notification): 添加通知方式

This commit is contained in:
naiba
2020-12-19 22:14:36 +08:00
parent b118958f35
commit d19de0edc2
16 changed files with 391 additions and 58 deletions

View File

@@ -42,7 +42,7 @@ function showFormModal(modelSelector, formID, URL, getData) {
form.children('.message').remove()
btn.toggleClass('loading')
const data = getData ? getData() : $(formID).serializeArray().reduce(function (obj, item) {
obj[item.name] = (item.name.endsWith('_id') || item.name === 'id') ? parseInt(item.value) : item.value;
obj[item.name] = (item.name.endsWith('_id') || item.name === 'id' || item.name === 'ID' || item.name === 'RequestType' || item.name === 'RequestMethod') ? parseInt(item.value) : item.value;
return obj;
}, {});
$.post(URL, JSON.stringify(data)).done(function (resp) {
@@ -70,11 +70,26 @@ function showFormModal(modelSelector, formID, URL, getData) {
}).modal('show')
}
function addOrEditNotification(notification) {
const modal = $('.notification.modal')
modal.children('.header').text((notification ? '修改' : '添加') + '通知方式')
modal.find('.positive.button').html(notification ? '修改<i class="edit icon"></i>' : '添加<i class="add icon"></i>')
modal.find('input[name=ID]').val(notification ? notification.ID : null)
modal.find('input[name=Name]').val(notification ? notification.Name : null)
modal.find('input[name=URL]').val(notification ? notification.URL : null)
modal.find('textarea[name=RequestBody]').val(notification ? notification.RequestBody : null)
modal.find('select[name=RequestMethod]').val(notification ? notification.RequestMethod : 1)
modal.find('select[name=RequestType]').val(notification ? notification.RequestType : 1)
if (notification && notification.VerifySSL) {
modal.find('.ui.checkbox').checkbox('set checked')
} else {
modal.find('.ui.checkbox').checkbox('set unchecked')
}
showFormModal('.notification.modal', '#notificationForm', '/api/notification')
}
function addOrEditServer(server) {
const modal = $('.server.modal')
if (server) {
server = JSON.parse(server)
}
modal.children('.header').text((server ? '修改' : '添加') + '服务器')
modal.find('.positive.button').html(server ? '修改<i class="edit icon"></i>' : '添加<i class="add icon"></i>')
modal.find('input[name=id]').val(server ? server.ID : null)

View File

@@ -1,21 +1,3 @@
/* Dark mode */
#darkmodeButton {
background-color: black;
width: 3rem;
height: 3rem;
position: fixed;
bottom: 2rem;
right: 0.5rem;
z-index: 9999;
border-radius: 50%;
outline: 0;
}
body.dark #darkmodeButton {
background-color: white;
}
body.dark {
background: #263236;
color: #aaa;
@@ -38,7 +20,8 @@ body.dark .panel {
color: #aaa;
}
body.dark .panel h3, body.dark .panel span {
body.dark .panel h3,
body.dark .panel span {
color: #aaa;
}

View File

@@ -4,10 +4,11 @@
<div class="item">
<img src="/static/logo.png">
</div>
<a class="item{{if eq .MatchedPath "/"}} active{{end}}" href="/">首页</a>
<a class="item{{if eq .MatchedPath " /"}} active{{end}}" href="/">首页</a>
{{if .Admin}}
<a class="item{{if eq .MatchedPath "/server"}} active{{end}}" href="/server">服务器</a>
<a class="item{{if eq .MatchedPath "/setting"}} active{{end}}" href="/setting">设置</a>
<a class="item{{if eq .MatchedPath " /server"}} active{{end}}" href="/server">服务器</a>
<a class="item{{if eq .MatchedPath " /notification"}} active{{end}}" href="/notification">通知</a>
<a class="item{{if eq .MatchedPath " /setting"}} active{{end}}" href="/setting">设置</a>
{{end}}
<div class="right menu">
<a class="item" href="https://github.com/naiba/nezha/issues" target="_blank">反馈</a>

View File

@@ -0,0 +1,47 @@
{{define "component/notification"}}
<div class="ui tiny notification modal transition hidden">
<div class="header">添加通知方式</div>
<div class="content">
<form id="notificationForm" class="ui form">
<input type="hidden" name="ID">
<div class="field">
<label>备注</label>
<input type="text" name="Name">
</div>
<div class="field">
<label>URL</label>
<input type="text" name="URL">
</div>
<div class="field">
<label>请求方式</label>
<select name="RequestMethod" class="ui fluid dropdown">
<option value="1">GET</option>
<option value="2">POST</option>
</select>
</div>
<div class="field">
<label>请求类型</label>
<select name="RequestType" class="ui fluid dropdown">
<option value="1">JSON</option>
<option value="2">FORM</option>
</select>
</div>
<div class="secret field">
<label>Body</label>
<textarea name="RequestBody"></textarea>
</div>
<div class="field">
<div class="ui checkbox">
<input name="VerifySSL" type="checkbox" tabindex="0" class="hidden">
<label>验证SSL</label>
</div>
</div>
</form>
</div>
<div class="actions">
<div class="ui negative button">取消</div>
<button class="ui positive right labeled icon button">确认<i class="checkmark icon"></i>
</button>
</div>
</div>
{{end}}

View File

@@ -0,0 +1,29 @@
{{define "component/rule"}}
<div class="ui tiny notification modal transition hidden">
<div class="header">添加通知规则</div>
<div class="content">
<form id="notificationForm" class="ui form">
<input type="hidden" name="ID">
<div class="field">
<label>备注</label>
<input type="text" name="Name">
</div>
<div class="secret field">
<label>规则</label>
<textarea name="RequestBody"></textarea>
</div>
<div class="field">
<div class="ui checkbox">
<input name="VerifySSL" type="checkbox" tabindex="0" class="hidden">
<label>启用</label>
</div>
</div>
</form>
</div>
<div class="actions">
<div class="ui negative button">取消</div>
<button class="ui positive right labeled icon button">确认<i class="checkmark icon"></i>
</button>
</div>
</div>
{{end}}

View File

@@ -16,7 +16,7 @@
</div>
<div class=" actions">
<div class="ui negative button">取消</div>
<button class="ui positive right labeled icon button">绑定<i class="checkmark icon"></i>
<button class="ui positive right labeled icon button">确认<i class="checkmark icon"></i>
</button>
</div>
</div>

View File

@@ -0,0 +1,88 @@
{{define "dashboard/notification"}}
{{template "common/header" .}}
{{template "common/menu" .}}
<div class="nb-container">
<div class="ui container">
<div class="ui grid">
<div class="right floated right aligned twelve wide column">
<button class="ui right labeled positive icon button" onclick="addOrEditNotification()"><i
class="add icon"></i> 添加通知方式
</button>
</div>
</div>
<table class="ui very basic table">
<thead>
<tr>
<th>ID</th>
<th>备注</th>
<th>URL</th>
<th>管理</th>
</tr>
</thead>
<tbody>
{{range $notification := .Notifications}}
<tr>
<td>{{$notification.ID}}</td>
<td>{{$notification.Name}}</td>
<td>{{$notification.URL}}</td>
<td>
<div class="ui mini icon buttons">
<button class="ui button" onclick="addOrEditNotification({{$notification}})">
<i class="edit icon"></i>
</button>
<button class="ui button"
onclick="showConfirm('删除通知方式','确认删除此通知方式?',deleteRequest,'/api/notification/'+{{$notification.ID}})">
<i class="delete icon"></i>
</button>
</div>
</td>
</tr>
{{end}}
</tbody>
</table>
<div class="ui grid">
<div class="right floated right aligned twelve wide column">
<button class="ui right labeled positive icon button" onclick="addOrEditNotification()"><i
class="add icon"></i> 添加报警规则
</button>
</div>
</div>
<table class="ui very basic table">
<thead>
<tr>
<th>ID</th>
<th>备注</th>
<th>URL</th>
<th>管理</th>
</tr>
</thead>
<tbody>
{{range $notification := .Notifications}}
<tr>
<td>{{$notification.ID}}</td>
<td>{{$notification.Name}}</td>
<td>{{$notification.URL}}</td>
<td>
<div class="ui mini icon buttons">
<button class="ui button" onclick="addOrEditNotification({{$notification}})">
<i class="edit icon"></i>
</button>
<button class="ui button"
onclick="showConfirm('删除通知方式','确认删除此通知方式?',deleteRequest,'/api/notification/'+{{$notification.ID}})">
<i class="delete icon"></i>
</button>
</div>
</td>
</tr>
{{end}}
</tbody>
</table>
</div>
</div>
{{template "component/notification"}}
{{template "common/footer" .}}
<script>
$('.checkbox').checkbox()
</script>
{{end}}

View File

@@ -20,7 +20,7 @@
</div>
<div class="field">
<label>自定义CSS</label>
<textarea name="CustomCSS" value="{{.Conf.Site.CustomCSS}}"></textarea>
<textarea name="CustomCSS">{{.Conf.Site.CustomCSS}}</textarea>
</div>
<button class="ui button" type="submit">保存</button>
</form>

View File

@@ -134,8 +134,6 @@
</div>
</div>
</div>
<button id="darkmodeButton"></button>
<footer>
<p style="text-align:center;padding: 15px;">Powered by <a href="https://github.com/naiba/nezha">哪吒面板</a> build ·
{{.Version}}
@@ -202,30 +200,6 @@
if (hour > 17 || hour < 4) {
document.body.classList.add('dark');
}
return
//darkmode
if (document.getElementById("darkmodeButton")) {
var night = parseInt(document.cookie.replace(/(?:(?:^|.*;\s*)dark\s*=\s*([^;]*).*$)|^.*$/, "$1") || '0');
if (night) {
document.body.classList.add('dark');
console.log('Dark mode on', night);
}
document.getElementById("darkmodeButton").onclick = function () {
night = parseInt(document.cookie.replace(/(?:(?:^|.*;\s*)dark\s*=\s*([^;]*).*$)|^.*$/, "$1") || '0');
if (!night) {
document.body.classList.add('dark');
document.cookie = "dark=1";
console.log('Dark mode on', night);
} else {
document.body.classList.remove('dark');
document.cookie = "dark=0";
console.log('Dark mode off', night);
}
}
} else {
document.cookie && (document.cookie = "");
console.log('Darkmode not Support');
}
},
secondToDate(s) {
var d = Math.floor(s / 3600 / 24);