feat: add logs to node's monitor

Author: yaojiping

web/src/components/Overview/Monitor/index.jsx

@@ -119,9 +119,10 @@ const Monitor = (props) => {
     setParam({ ...param, timeRange: state.timeRange, timeInterval: state.timeInterval, timeout: state.timeout });
   }, [state.timeRange, state.timeInterval, state.timeout]);
 
-  const handleTimeChange = useCallback(({ start, end, timeInterval, timeout, refresh }) => {
+  const handleTimeChange = ({ start, end, timeInterval, timeout, refresh }) => {
     setState(initState({
       ...state,
+      param,
       timeRange: {
         min: start,
         max: end,
@@ -130,11 +131,12 @@ const Monitor = (props) => {
       timeout: timeout || state.timeout,
       refresh
     }));
-  }, [state]) 
+  }
 
   const onInfoChange = (info) => {
     setState({
       ...state,
+      param,
       info,
     });
   };
@@ -194,6 +196,7 @@ const Monitor = (props) => {
                       })
                       setState({
                         ...state,
+                        param,
                         timeInterval: timeSetting.timeInterval,
                         timeout: timeSetting.timeout
                       });
@@ -249,6 +252,7 @@ const Monitor = (props) => {
                                 })
                                 setState({
                                   ...state,
+                                  param,
                                   timeInterval,
                                 });
                               }}

web/src/pages/Platform/Overview/Cluster/Monitor/Logs.jsx

@@ -1,5 +1,4 @@
 import { Empty, Input, Spin, Table } from "antd";
-import styles from "./Logs.less"
 import { formatMessage } from "umi/locale";
 import { Link } from "umi";
 import Logs from "../../components/Logs";
@@ -11,7 +10,7 @@ const AGGS = {
 }
 
 export default (props) => {
-    const { clusterID } = props;
+    const { clusterID, param = {} } = props;
 
     return (
         <Logs 
@@ -31,6 +30,14 @@ export default (props) => {
                     dataIndex: "metadata.labels.node_name",
                     width: 88,
                     ellipsis: true,
+                    render: (value, record) => {
+                        if (!record.metadata?.labels?.node_uuid) return value
+                        return (
+                            <Link to={`/cluster/monitor/${clusterID}/nodes/${record.metadata.labels.node_uuid}?_g=${encodeURIComponent(JSON.stringify(param))}`}>
+                                {value}
+                            </Link>
+                        )
+                    }
                 },
             ]}
         />

web/src/pages/Platform/Overview/Cluster/Monitor/Logs.less

@@ -0,0 +1,26 @@
+import { Empty, Input, Spin, Table } from "antd";
+import { formatMessage } from "umi/locale";
+import Logs from "../../components/Logs";
+
+const AGGS = {
+    "Type":{"terms":{"field":"metadata.name", "size": 1000 }},
+    "Level":{"terms":{"field":"payload.level", "size": 1000 }},
+}
+
+export default (props) => {
+    const { nodeID } = props;
+
+    return (
+        <Logs 
+            {...props} 
+            aggs={AGGS} 
+            queryFilters={[
+                {
+                    "term": {
+                        "metadata.labels.node_uuid": nodeID
+                    }
+                }
+            ]}
+        />
+    );
+}

web/src/pages/Platform/Overview/Node/Monitor/Logs.jsx

@@ -6,10 +6,12 @@ import { formatMessage } from "umi/locale";
 import Monitor from "@/components/Overview/Monitor";
 import StatisticBar from "./statistic_bar";
 import { connect } from "dva";
+import Logs from "./Logs";
 
 const panes = [
   { title: "Overview", component: Overview, key: "overview" },
   { title: "Advanced", component: Advanced, key: "advanced" },
+  { title: "Logs", component: Logs, key: "logs" },
   { title: "Shards", component: Shards, key: "shards" },
 ];
 const Page = (props) => {

web/src/pages/Platform/Overview/Node/Monitor/index.jsx

@@ -22,8 +22,5 @@
             border-radius: 2px;
             margin-bottom: 16px;
         }
-
-        .table {
-        }
     }
 }