实现日志消息聚合

internal/web/actions/default/clusters/cluster/node/logs.go

@@ -18,12 +18,24 @@ func (this *LogsAction) Init() {
 
 func (this *LogsAction) RunGet(params struct {
 	NodeId  int64
+	DayFrom string
+	DayTo   string
+	Keyword string
+	Level   string
 }) {
 	this.Data["nodeId"] = params.NodeId
+	this.Data["dayFrom"] = params.DayFrom
+	this.Data["dayTo"] = params.DayTo
+	this.Data["keyword"] = params.Keyword
+	this.Data["level"] = params.Level
 
 	countResp, err := this.RPC().NodeLogRPC().CountNodeLogs(this.AdminContext(), &pb.CountNodeLogsRequest{
 		Role:    "node",
 		NodeId:  params.NodeId,
+		DayFrom: params.DayFrom,
+		DayTo:   params.DayTo,
+		Keyword: params.Keyword,
+		Level:   params.Level,
 	})
 	if err != nil {
 		this.ErrorPage(err)
@@ -35,6 +47,10 @@ func (this *LogsAction) RunGet(params struct {
 	logsResp, err := this.RPC().NodeLogRPC().ListNodeLogs(this.AdminContext(), &pb.ListNodeLogsRequest{
 		NodeId:  params.NodeId,
 		Role:    "node",
+		DayFrom: params.DayFrom,
+		DayTo:   params.DayTo,
+		Keyword: params.Keyword,
+		Level:   params.Level,
 		Offset:  page.Offset,
 		Size:    page.Size,
 	})
@@ -47,6 +63,7 @@ func (this *LogsAction) RunGet(params struct {
 			"createdTime": timeutil.FormatTime("Y-m-d H:i:s", log.CreatedAt),
 			"level":       log.Level,
 			"isToday":     timeutil.FormatTime("Y-m-d", log.CreatedAt) == timeutil.Format("Y-m-d"),
+			"count":       log.Count,
 		})
 	}
 	this.Data["logs"] = logs

internal/web/actions/default/clusters/logs/index.go

@@ -70,6 +70,7 @@ func (this *IndexAction) RunGet(params struct {
 			"createdTime": timeutil.FormatTime("Y-m-d H:i:s", log.CreatedAt),
 			"level":       log.Level,
 			"isToday":     timeutil.FormatTime("Y-m-d", log.CreatedAt) == timeutil.Format("Y-m-d"),
+			"count":       log.Count,
 			"node": maps.Map{
 				"id": node.Id,
 				"cluster": maps.Map{

web/views/@default/clusters/cluster/node/logs.html

@@ -1,6 +1,45 @@
 {$layout}
 {$template "node_menu"}
 
+{$var "header"}
+<!-- datepicker -->
+<script type="text/javascript" src="/js/moment.min.js"></script>
+<script type="text/javascript" src="/js/pikaday.js"></script>
+<link rel="stylesheet" href="/js/pikaday.css"/>
+<link rel="stylesheet" href="/js/pikaday.theme.css"/>
+<link rel="stylesheet" href="/js/pikaday.triangle.css"/>
+{$end}
+
+<form method="get" action="/clusters/cluster/node/logs" class="ui form" autocomplete="off">
+    <input type="hidden" name="clusterId" :value="clusterId"/>
+    <input type="hidden" name="nodeId" :value="nodeId"/>
+    <div class="ui fields inline">
+        <div class="ui field">
+            <input type="text" name="dayFrom" placeholder="开始日期" v-model="dayFrom" value="" style="width:8em" id="day-from-picker"/>
+        </div>
+        <div class="ui field">
+            <input type="text" name="dayTo" placeholder="结束日期" v-model="dayTo" value="" style="width:8em" id="day-to-picker"/>
+        </div>
+        <div class="ui field">
+            <select class="ui dropdown" name="level" v-model="level">
+                <option value="">[级别]</option>
+                <option value="error">错误</option>
+                <option value="warn">警告</option>
+                <option value="info">信息</option>
+            </select>
+        </div>
+        <div class="ui field">
+            <input type="text" name="keyword" style="width:10em" v-model="keyword" placeholder="关键词"/>
+        </div>
+        <div class="ui field">
+            <button type="submit" class="ui button">查询</button>
+        </div>
+        <div class="ui field" v-if="dayFrom.length > 0 || dayTo.length > 0 || keyword.length > 0 || level.length > 0">
+            <a :href="'/clusters/cluster/node/logs?clusterId=' + clusterId + '&nodeId=' + nodeId">[清除条件]</a>
+        </div>
+    </div>
+</form>
+
 <p class="comment" v-if="logs.length == 0">暂时还没有日志。</p>
 
 <table class="ui table selectable" v-if="logs.length > 0">
@@ -11,7 +50,7 @@
     </thead>
     <tr v-for="log in logs">
         <td>
-            <pre class="log-box"><span :class="{red:log.level == 'error', yellow:log.level == 'warning'}"><span v-if="!log.isToday">[{{log.createdTime}}]</span><strong v-if="log.isToday">[{{log.createdTime}}]</strong>[{{log.tag}}]{{log.description}}</span></pre>
+            <pre class="log-box"><span :class="{red:log.level == 'error', yellow:log.level == 'warning'}"><span v-if="!log.isToday">[{{log.createdTime}}]</span><strong v-if="log.isToday">[{{log.createdTime}}]</strong>[{{log.tag}}]{{log.description}}</span> &nbsp; <span v-if="log.count > 0" class="ui label tiny red">共{{log.count}}条</span></pre>
         </td>
     </tr>
 </table>

web/views/@default/clusters/cluster/node/logs.js

@@ -0,0 +1,6 @@
+Tea.context(function () {
+	this.$delay(function () {
+		teaweb.datepicker("day-from-picker")
+		teaweb.datepicker("day-to-picker")
+	})
+})

web/views/@default/clusters/logs/index.html

@@ -54,7 +54,7 @@
         <td nowrap=""><link-icon :href="'/clusters/cluster?clusterId=' + log.node.cluster.id">{{log.node.cluster.name}}</link-icon></td>
         <td nowrap=""><link-icon :href="'/clusters/cluster/node?clusterId=' + log.node.cluster.id + '&nodeId=' + log.node.id">{{log.node.name}}</link-icon></td>
         <td>
-            <pre class="log-box"><span :class="{red:log.level == 'error', yellow:log.level == 'warning'}"><span v-if="!log.isToday">[{{log.createdTime}}]</span><strong v-if="log.isToday">[{{log.createdTime}}]</strong>[{{log.tag}}]{{log.description}}</span></pre>
+            <pre class="log-box"><span :class="{red:log.level == 'error', yellow:log.level == 'warning'}"><span v-if="!log.isToday">[{{log.createdTime}}]</span><strong v-if="log.isToday">[{{log.createdTime}}]</strong>[{{log.tag}}]{{log.description}}</span> &nbsp; <span v-if="log.count > 0" class="ui label tiny red">共{{log.count}}条</span></pre>
         </td>
     </tr>
 </table>