💄 UI: 前端优化调整

.gitattributes

@@ -1 +1,3 @@
-resource/** linguist-vendored
+resource/** linguist-vendored
+resource/static/* !linguist-vendored
+resource/template/dashboard/* !linguist-vendored

README.md

@@ -101,21 +101,21 @@ URL 里面也可放置占位符，请求时会进行简单的字符串替换。
 1. 添加通知方式
 
     - server酱示例
-      - 备注：server酱
+      - 名称：server酱
       - URL：https://sc.ftqq.com/SCUrandomkeys.send?text=#NEZHA#
       - 请求方式: GET
       - 请求类型: 默认
       - Body: 空
       
     - wxpusher示例，需要关注你的应用
-      - 备注: wxpusher
+      - 名称: wxpusher
       - URL：http://wxpusher.zjiecode.com/api/send/message
       - 请求方式: POST
       - 请求类型: JSON
       - Body: `{"appToken":"你的appToken","topicIds":[],"content":"#NEZHA#","contentType":"1","uids":["你的uid"]}`
 
     - telegram示例 [@haitau](https://github.com/haitau) 贡献
-      - 备注：telegram机器人消息通知
+      - 名称：telegram机器人消息通知
       - URL：https://api.telegram.org/botXXXXXX/sendMessage?chat_id=YYYYYY&text=#NEZHA#
       - 请求方式: GET
       - 请求类型: 默认
@@ -124,13 +124,13 @@ URL 里面也可放置占位符，请求时会进行简单的字符串替换。
 
 2. 添加一个离线报警
 
-    - 备注：离线通知
+    - 名称：离线通知
     - 规则：`[{"Type":"offline","Min":0,"Max":0,"Duration":10}]`
     - 启用：√
 
 3. 添加一个监控 CPU 持续 10s 超过 50% **且** 内存持续 20s 占用低于 20% 的报警
 
-    - 备注：CPU+内存
+    - 名称：CPU+内存
     - 规则：`[{"Type":"cpu","Min":0,"Max":50,"Duration":10},{"Type":"memory","Min":20,"Max":0,"Duration":20}]`
     - 启用：√
 

cmd/dashboard/controller/member_page.go

@@ -62,7 +62,7 @@ func (mp *memberPage) notification(c *gin.Context) {
 	var ar []model.AlertRule
 	dao.DB.Find(&ar)
 	c.HTML(http.StatusOK, "dashboard/notification", mygin.CommonEnvironment(c, gin.H{
-		"Title":         "通知管理",
+		"Title":         "报警通知",
 		"Notifications": nf,
 		"AlertRules":    ar,
 	}))

model/server.go

@@ -14,7 +14,7 @@ type Server struct {
 	Tag          string // 分组名
 	Secret       string `json:"-"`
 	Note         string `json:"-"` // 管理员可见备注
-	DisplayIndex int    // 展示权重，越大越靠前
+	DisplayIndex int    // 展示排序，越大越靠前
 
 	Host       *Host      `gorm:"-"`
 	State      *HostState `gorm:"-"`

resource/static/main.css

@@ -6,30 +6,25 @@
 
 .nb-container {
     padding-top: 75px;
-    min-height: 80%;
+    min-height: 100%;
-    padding-bottom: 75px;
+    padding-bottom: 55px;
+    margin-bottom: -47px;
 }
 
-.footer.segment {
+.login.nb-container {
+    display: flex;
+    align-items: center;
+    padding-top: unset;
+}
+
+.login.nb-container>.grid {
     width: 100%;
-    position: fixed;
-    bottom: 0;
-    padding-top: 20px;
-    padding-bottom: 20px;
 }
 
-.login-form {
+.login.nb-container>.grid .column {
-    height: 82%;
-}
-
-.login-form .column {
     max-width: 450px;
 }
 
-.login-form .grid {
-    height: 100%;
-}
-
 .status.cards .flag {
     margin-right: 0 !important;
 }

resource/template/common/footer.html

@@ -1,7 +1,8 @@
 {{define "common/footer"}}
 <div class="ui inverted vertical footer segment">
     <div class="ui center aligned is-size-7 container">
-        Powered by <a href="https://github.com/naiba/nezha" style="color: white;" target="_blank">哪吒面板</a> {{.Version}}
+        <b>&copy; <a style="color: white;" href="/">{{.Conf.Site.Brand}}</a></b> | <small>Powered by <a href="https://github.com/naiba/nezha"
+                style="color: white;" target="_blank">哪吒面板</a> {{.Version}}</small>
     </div>
 </div>
 <script src="https://cdn.jsdelivr.net/npm/jquery@3.4.1/dist/jquery.min.js"></script>

resource/template/common/menu.html

@@ -5,11 +5,10 @@
             <img src="/static/logo.png">
         </div>
         {{if .IsAdminPage}}
-        <a class="item{{if eq .MatchedPath " /server"}} active{{end}}" href="/server">服务器</a>
+        <a class="item{{if eq .MatchedPath " /server"}} active{{end}}" href="/server">Agent</a>
-        <a class="item{{if eq .MatchedPath " /monitor"}} active{{end}}" href="/monitor">服务监控</a>
+        <a class="item{{if eq .MatchedPath " /monitor"}} active{{end}}" href="/monitor">Service</a>
-        <a class="item{{if eq .MatchedPath " /cron"}} active{{end}}" href="/cron">计划任务</a>
+        <a class="item{{if eq .MatchedPath " /cron"}} active{{end}}" href="/cron">Cron</a>
-        <a class="item{{if eq .MatchedPath " /notification"}} active{{end}}" href="/notification">通知</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>
         {{else}}
         <a class="item{{if eq .MatchedPath " /"}} active{{end}}" href="/">首页</a>
         <a class="item{{if eq .MatchedPath " /service"}} active{{end}}" href="/service">服务状态</a>
@@ -24,6 +23,9 @@
                     <i class="dropdown icon"></i>
                     <div class="menu">
                         {{if .IsAdminPage}}
+                        <a class="item" href="/setting">
+                            <i class="settings icon"></i>系统设置
+                        </a>
                         <a class="item" href="/">
                             <i class="chart area icon"></i>返回前台
                         </a>

resource/template/component/cron.html

@@ -5,7 +5,7 @@
         <form id="cronForm" class="ui form">
             <input type="hidden" name="ID">
             <div class="field">
-                <label>备注</label>
+                <label>名称</label>
                 <input type="text" name="Name" placeholder="备份">
             </div>
             <div class="field">
@@ -21,7 +21,7 @@
                 <div class="ui fluid multiple servers search selection dropdown">
                     <input type="hidden" name="ServersRaw">
                     <i class="dropdown icon"></i>
-                    <div class="default text">输入ID/备注以搜索</div>
+                    <div class="default text">输入ID/名称以搜索</div>
                     <div class="menu"></div>
                 </div>
             </div>

resource/template/component/monitor.html

@@ -5,7 +5,7 @@
         <form id="monitorForm" class="ui form">
             <input type="hidden" name="ID">
             <div class="field">
-                <label>备注</label>
+                <label>名称</label>
                 <input type="text" name="Name" placeholder="博客">
             </div>
             <div class="field">

resource/template/component/notification.html

@@ -5,7 +5,7 @@
         <form id="notificationForm" class="ui form">
             <input type="hidden" name="ID">
             <div class="field">
-                <label>备注</label>
+                <label>名称</label>
                 <input type="text" name="Name">
             </div>
             <div class="field">

resource/template/component/rule.html

@@ -5,7 +5,7 @@
         <form id="ruleForm" class="ui form">
             <input type="hidden" name="ID">
             <div class="field">
-                <label>备注</label>
+                <label>名称</label>
                 <input type="text" name="Name">
             </div>
             <div class="secret field">

resource/template/component/server.html

@@ -5,7 +5,7 @@
         <form id="serverForm" class="ui form">
             <input type="hidden" name="id">
             <div class="field">
-                <label>备注</label>
+                <label>名称</label>
                 <input type="text" name="name" placeholder="爱因斯坦-光速1号">
             </div>
             <div class="field">
@@ -13,7 +13,7 @@
                 <input type="text" name="Tag" placeholder="服务器分组">
             </div>
             <div class="field">
-                <label>展示权重</label>
+                <label>排序</label>
                 <input type="number" name="DisplayIndex" placeholder="越大越靠前">
             </div>
             <div class="secret field">
@@ -21,7 +21,7 @@
                 <input type="text" name="secret">
             </div>
             <div class="field">
-                <label>隐藏备注</label>
+                <label>备注</label>
                 <textarea name="Note"></textarea>
             </div>
         </form>

resource/template/dashboard/cron.html

@@ -14,7 +14,7 @@
             <thead>
                 <tr>
                     <th>ID</th>
-                    <th>备注</th>
+                    <th>名称</th>
                     <th>计划</th>
                     <th>命令</th>
                     <th>成功推送</th>

resource/template/dashboard/error.html

@@ -1,7 +1,7 @@
 {{define "dashboard/error"}}
 {{template "common/header" .}}
-<div class="login-form">
+<div class="login nb-container">
-    <div class="ui middle aligned center aligned grid">
+    <div class="ui center aligned grid">
         <div class="column">
             <h2 class="ui teal image header">
                 <img src="/static/logo.png" class="image">

resource/template/dashboard/login.html

@@ -1,7 +1,7 @@
 {{define "dashboard/login"}}
 {{template "common/header" .}}
-<div class="login-form">
+<div class="login nb-container">
-    <div class="ui middle aligned center aligned grid">
+    <div class="ui center aligned grid">
         <div class="column">
             <h2 class="ui teal image header">
                 <img src="static/logo.png" class="image">

resource/template/dashboard/monitor.html

@@ -14,7 +14,7 @@
             <thead>
                 <tr>
                     <th>ID</th>
-                    <th>备注</th>
+                    <th>名称</th>
                     <th>目标</th>
                     <th>类型</th>
                     <th>管理</th>

resource/template/dashboard/notification.html

@@ -14,7 +14,7 @@
             <thead>
                 <tr>
                     <th>ID</th>
-                    <th>备注</th>
+                    <th>名称</th>
                     <th>URL</th>
                     <th>验证SSL</th>
                     <th>管理</th>
@@ -54,7 +54,7 @@
             <thead>
                 <tr>
                     <th>ID</th>
-                    <th>备注</th>
+                    <th>名称</th>
                     <th>规则</th>
                     <th>启用</th>
                     <th>管理</th>

resource/template/dashboard/server.html

@@ -13,13 +13,13 @@
         <table class="ui very basic table">
             <thead>
                 <tr>
-                    <th>权重</th>
+                    <th>排序</th>
-                    <th>备注</th>
+                    <th>名称</th>
                     <th>分组</th>
                     <th>IP</th>
                     <th>ID</th>
                     <th>密钥</th>
-                    <th>隐藏备注</th>
+                    <th>备注</th>
                     <th>管理</th>
                 </tr>
             </thead>