修改dashboard页面

go.mod

@@ -11,7 +11,6 @@ require (
 	github.com/labstack/gommon v0.3.0
 	github.com/patrickmn/go-cache v2.1.0+incompatible
 	github.com/pkg/sftp v1.12.0
-	github.com/shirou/gopsutil v3.20.10+incompatible
 	github.com/spf13/viper v1.7.1
 	golang.org/x/crypto v0.0.0-20200820211705-5c72a883971a
 	gorm.io/driver/mysql v1.0.1

main.go

@@ -11,6 +11,7 @@ import (
 	"next-terminal/pkg/handle"
 	"next-terminal/pkg/model"
 	"next-terminal/pkg/utils"
+	"strconv"
 	"time"
 )
 
@@ -34,9 +35,7 @@ func Run() error {
 		return err
 	}
 
-	users := model.FindAllUser()
+	if len(model.FindAllUser()) == 0 {
-
-	if len(users) == 0 {
 
 		var pass []byte
 		if pass, err = utils.Encoder.Encode([]byte("admin")); err != nil {
@@ -71,6 +70,18 @@ func Run() error {
 		return err
 	}
 
+	if err := config.DB.AutoMigrate(&model.Num{}); err != nil {
+		return err
+	}
+
+	if len(model.FindAllTemp()) == 0 {
+		for i := 0; i <= 30; i++ {
+			if err := model.CreateNewTemp(&model.Num{I: strconv.Itoa(i)}); err != nil {
+				return err
+			}
+		}
+	}
+
 	config.Cache = cache.New(5*time.Minute, 10*time.Minute)
 	config.Store = config.NewStore()
 	e := api.SetupRoutes()

pkg/api/overview.go

@@ -1,41 +1,10 @@
 package api
 
 import (
-	"next-terminal/pkg/model"
-	"fmt"
 	"github.com/labstack/echo/v4"
-	"github.com/shirou/gopsutil/cpu"
+	"next-terminal/pkg/model"
-	"github.com/shirou/gopsutil/load"
-	"github.com/shirou/gopsutil/mem"
-	"time"
 )
 
-type OverviewStatus struct {
-	Load   Load   `json:"load"`
-	Memory Memory `json:"memory"`
-	CPU    CPU    `json:"cpu"`
-}
-
-type Load struct {
-	Load1  float64 `json:"load1"`
-	Load5  float64 `json:"load5"`
-	Load15 float64 `json:"load15"`
-}
-
-type Memory struct {
-	Total       uint64  `json:"total"`
-	Available   uint64  `json:"available"`
-	UsedPercent float64 `json:"usedPercent"`
-	Used        uint64  `json:"used"`
-}
-
-type CPU struct {
-	PhysicalCount int     `json:"physicalCount"`
-	LogicalCount  int     `json:"logicalCount"`
-	Percent       float64 `json:"percent"`
-	ModelName     string  `json:"modelName"`
-}
-
 type Counter struct {
 	User          int64 `json:"user"`
 	Asset         int64 `json:"asset"`
@@ -43,44 +12,6 @@ type Counter struct {
 	OnlineSession int64 `json:"onlineSession"`
 }
 
-func OverviewStatusEndPoint(c echo.Context) error {
-	info, _ := load.Avg()
-	memory, _ := mem.VirtualMemory()
-	infoStats, _ := cpu.Info()
-	physicalCount, _ := cpu.Counts(false)
-	logicalCount, _ := cpu.Counts(true)
-	cps, _ := cpu.Percent(time.Second, false)
-
-	fmt.Printf("%+v\n", info)
-	fmt.Printf("%+v\n", memory)
-	fmt.Printf("%+v\n", infoStats)
-	fmt.Printf("%+v\n", physicalCount)
-	fmt.Printf("%+v\n", logicalCount)
-	fmt.Printf("%+v\n", cps)
-
-	overviewStatus := OverviewStatus{
-		Load: Load{
-			Load1:  info.Load1,
-			Load5:  info.Load5,
-			Load15: info.Load15,
-		},
-		Memory: Memory{
-			Total:       memory.Total,
-			Available:   memory.Available,
-			UsedPercent: memory.UsedPercent,
-			Used:        memory.Used,
-		},
-		CPU: CPU{
-			PhysicalCount: physicalCount,
-			LogicalCount:  logicalCount,
-			Percent:       cps[0],
-			ModelName:     infoStats[0].ModelName,
-		},
-	}
-
-	return Success(c, overviewStatus)
-}
-
 func OverviewCounterEndPoint(c echo.Context) error {
 	countUser, _ := model.CountUser()
 	countOnlineSession, _ := model.CountOnlineSession()
@@ -96,3 +27,17 @@ func OverviewCounterEndPoint(c echo.Context) error {
 
 	return Success(c, counter)
 }
+
+func OverviewSessionPoint(c echo.Context) (err error) {
+	d := c.QueryParam("d")
+	var results []model.D
+	if d == "m" {
+		results, err = model.CountSessionByDay(30)
+	} else {
+		results, err = model.CountSessionByDay(7)
+	}
+	if err != nil {
+		return err
+	}
+	return Success(c, results)
+}

pkg/api/property.go

@@ -1,13 +1,13 @@
 package api
 
 import (
-	"next-terminal/pkg/model"
 	"fmt"
 	"github.com/labstack/echo/v4"
+	"next-terminal/pkg/model"
 )
 
 func PropertyGetEndpoint(c echo.Context) error {
-	properties := model.FindAllProperties()
+	properties := model.FindAllTemp()
 	return Success(c, properties)
 }
 

pkg/api/routes.go

@@ -97,8 +97,8 @@ func SetupRoutes() *echo.Echo {
 	e.GET("/properties", PropertyGetEndpoint)
 	e.PUT("/properties", PropertyUpdateEndpoint)
 
-	e.GET("/overview/status", OverviewStatusEndPoint)
 	e.GET("/overview/counter", OverviewCounterEndPoint)
+	e.GET("/overview/sessions", OverviewSessionPoint)
 
 	return e
 }

pkg/api/test/ps.go

@@ -1,33 +0,0 @@
-package main
-
-func main() {
-	//v, _ := mem.VirtualMemory()
-	//c, _ := cpu.Info()
-	//cc, _ := cpu.Percent(time.Second, false)
-	//d, _ := disk.Usage("/")
-	//n, _ := host.Info()
-	//nv, _ := net.IOCounters(true)
-	//boottime, _ := host.BootTime()
-	//btime := time.Unix(int64(boottime), 0).Format("2006-01-02 15:04:05")
-	//
-	//fmt.Printf("        Mem       : %v MB  Free: %v MB Used:%v Usage:%f%%\n", v.Total/1024/1024, v.Available/1024/1024, v.Used/1024/1024, v.UsedPercent)
-	//if len(c) > 1 {
-	//	for _, sub_cpu := range c {
-	//		modelname := sub_cpu.ModelName
-	//		cores := sub_cpu.Cores
-	//		fmt.Printf("        CPU       : %v   %v cores \n", modelname, cores)
-	//	}
-	//} else {
-	//	sub_cpu := c[0]
-	//	modelname := sub_cpu.ModelName
-	//	cores := sub_cpu.Cores
-	//	fmt.Printf("        CPU       : %v   %v cores \n", modelname, cores)
-	//
-	//}
-	//fmt.Printf("        Network: %v bytes / %v bytes\n", nv[0].BytesRecv, nv[0].BytesSent)
-	//fmt.Printf("        SystemBoot:%v\n", btime)
-	//fmt.Printf("        CPU Used    : used %f%% \n", cc[0])
-	//fmt.Printf("        HD        : %v GB  Free: %v GB Usage:%f%%\n", d.Total/1024/1024/1024, d.Free/1024/1024/1024, d.UsedPercent)
-	//fmt.Printf("        OS        : %v(%v)   %v  \n", n.Platform, n.PlatformFamily, n.PlatformVersion)
-	//fmt.Printf("        Hostname  : %v  \n", n.Hostname)
-}

pkg/model/num.go

@@ -0,0 +1,25 @@
+package model
+
+import (
+	"next-terminal/pkg/config"
+)
+
+type Num struct {
+	I string `gorm:"primary_key" json:"i"`
+}
+
+func (r *Num) TableName() string {
+	return "nums"
+}
+
+func FindAllTemp() (o []Num) {
+	if config.DB.Find(&o).Error != nil {
+		return nil
+	}
+	return
+}
+
+func CreateNewTemp(o *Num) (err error) {
+	err = config.DB.Create(o).Error
+	return
+}

pkg/model/session.go

@@ -3,6 +3,7 @@ package model
 import (
 	"next-terminal/pkg/config"
 	"next-terminal/pkg/utils"
+	"time"
 )
 
 const (
@@ -136,3 +137,31 @@ func CountOnlineSession() (total int64, err error) {
 	err = config.DB.Where("status = ?", Connected).Find(&Session{}).Count(&total).Error
 	return
 }
+
+type D struct {
+	Day      string `json:"day"`
+	Count    int    `json:"count"`
+	Protocol string `json:"protocol"`
+}
+
+func CountSessionByDay(day int) (results []D, err error) {
+
+	today := time.Now().Format("20060102")
+	sql := "select t1.`day`, count(t2.id) as count\nfrom (\n         SELECT @date := DATE_ADD(@date, INTERVAL - 1 DAY) day\n         FROM (SELECT @date := DATE_ADD('" + today + "', INTERVAL + 1 DAY) FROM nums) as t0\n         LIMIT ?\n     )\n         as t1\n         left join\n     (\n         select DATE(s.connected_time) as day, s.id\n         from sessions as s\n         WHERE protocol = ? and DATE(connected_time) <= '" + today + "'\n           AND DATE(connected_time) > DATE_SUB('" + today + "', INTERVAL ? DAY)\n     ) as t2 on t1.day = t2.day\ngroup by t1.day"
+
+	protocols := []string{"rdp", "ssh", "vnc", "telnet"}
+
+	for i := range protocols {
+		var result []D
+		err = config.DB.Raw(sql, day, protocols[i], day).Scan(&result).Error
+		if err != nil {
+			return nil, err
+		}
+		for j := range result {
+			result[j].Protocol = protocols[i]
+		}
+		results = append(results, result...)
+	}
+
+	return
+}

web/package.json

@@ -36,6 +36,9 @@
   ],
   "homepage": ".",
   "devDependencies": {
+    "@ant-design/charts": "^1.0.13",
+    "g2": "^2.3.13",
+    "g2-react": "^1.3.2",
     "umi-request": "^1.3.5",
     "xterm-addon-attach": "^0.6.0",
     "xterm-addon-fit": "^0.4.0"

web/src/components/asset/Asset.js

@@ -1,5 +1,4 @@
 import React, {Component} from 'react';
-import "video-react/dist/video-react.css";
 
 import {
     Badge,

web/src/components/credential/Credential.js

@@ -1,5 +1,4 @@
 import React, {Component} from 'react';
-import "video-react/dist/video-react.css";
 
 import {Button, Col, Divider, Input, Layout, Modal, PageHeader, Row, Space, Table, Tooltip, Typography} from "antd";
 import qs from "qs";

web/src/components/dashboard/Dashboard.js

@@ -1,10 +1,11 @@
 import React, {Component} from 'react';
-import {Layout, PageHeader, Card, Row, Col, Progress, Typography, Popover, Statistic} from "antd";
+import {Card, Col, Layout, PageHeader, Radio, Row, Statistic, Typography} from "antd";
-import {DesktopOutlined, IdcardOutlined, LikeOutlined, LinkOutlined, UserOutlined} from '@ant-design/icons';
+import {DesktopOutlined, IdcardOutlined, LinkOutlined, UserOutlined} from '@ant-design/icons';
 import {itemRender} from '../../utils/utils'
 import request from "../../common/request";
 import './Dashboard.css'
 import {Link} from "react-router-dom";
+import {Area} from '@ant-design/charts';
 
 const {Content} = Layout;
 const {Title, Paragraph} = Typography;
@@ -24,78 +25,59 @@ const routes = [
 class Dashboard extends Component {
 
     state = {
-        status: {
+        counter: {},
-            load: {
+        d: 'w',
-                load1: 0,
+        session: [],
-                load5: 0,
-                load15: 0,
-            },
-            cpu: {
-                percent: 0,
-                logicalCount: 0,
-                physicalCount: 0
-            },
-            memory: {
-                usedPercent: 0,
-                available: 0,
-                total: 0,
-                used: 0
-            }
-        },
-        interval: null,
-        counter: {}
     }
 
     componentDidMount() {
         this.getCounter();
-        this.getStatus();
+        this.getD();
-
-        this.setState({
-            interval: setInterval(() => this.getStatus(), 5000)
-        })
     }
 
     componentWillUnmount() {
-        if (this.state.interval != null) {
-            clearInterval(this.state.interval);
-        }
-    }
 
-    getStatus = async () => {
-        let result = await request.get('/overview/status');
-        if (result.code === 1) {
-            this.setState({
-                status: result.data
-            })
-        }
     }
 
     getCounter = async () => {
         let result = await request.get('/overview/counter');
-        if (result.code === 1) {
+        if (result['code'] === 1) {
             this.setState({
-                counter: result.data
+                counter: result['data']
             })
         }
     }
 
+    getD = async () => {
+        let result = await request.get('/overview/sessions?d=' + this.state.d);
+        if (result['code'] === 1) {
+            this.setState({
+                session: result['data']
+            })
+            console.log('set session', this.state.session)
+        }
+    }
+
+    handleChangeD = (e) => {
+        let d = e.target.value;
+        this.setState({
+            d: d
+        }, () => this.getD())
+    }
+
     render() {
 
-        const loadContent = (
+        const config = {
-            <div>
+            data: this.state.session,
-                <p>最近1分钟负载：{this.state.status.load['load1'].toFixed(1)}</p>
+            xField: 'day',
-                <p>最近5分钟负载：{this.state.status.load['load5'].toFixed(1)}</p>
+            yField: 'count',
-                <p>最近15分钟负载：{this.state.status.load['load15'].toFixed(1)}</p>
+            seriesField: 'protocol',
-            </div>
+        };
-        );
 
-        const cpuContent = (
+        const buttonRadio = <Radio.Group value={this.state.d} onChange={this.handleChangeD}>
-            <div>
+            <Radio.Button value="w">按周</Radio.Button>
-                <p>CPU型号：{this.state.status.cpu['modelName']}</p>
+            <Radio.Button value="m">按月</Radio.Button>
-                <p>物理核心：{this.state.status.cpu['physicalCount']}</p>
+        </Radio.Group>
-                <p>逻辑核心：{this.state.status.cpu['logicalCount']}</p>
-            </div>
-        );
 
         return (
             <>
@@ -150,41 +132,8 @@ class Dashboard extends Component {
                 </div>
 
                 <div className="page-card">
-                    <Card title="状态" bordered={true}>
+                    <Card title="会话统计" bordered={true} extra={buttonRadio}>
-                        <Row>
+                        <Area {...config} />
-                            <Col span={4}>
-                                <Title level={5} className="text-center">负载状态</Title>
-                                <Popover placement="topLeft" title={"负载详情"} content={loadContent}>
-                                    <Progress type="circle" width={100}
-                                              percent={this.state.status.load['load1'].toFixed(1)}/>
-                                </Popover>
-
-                                <Paragraph className="text-center">运行流畅</Paragraph>
-                            </Col>
-                            <Col span={4}>
-                                <Title level={5} className="text-center">CPU使用率</Title>
-                                <Popover placement="topLeft" title={"CPU详情"} content={cpuContent}>
-                                    <Progress type="circle" width={100}
-                                              percent={this.state.status.cpu['percent'].toFixed(1)}/>
-                                </Popover>
-                                <Paragraph className="text-center">{this.state.status.cpu['logicalCount']}核心</Paragraph>
-                            </Col>
-                            <Col span={4}>
-                                <Title level={5} className="text-center">内存使用率</Title>
-                                <Progress type="circle" width={100}
-                                          percent={this.state.status.memory['usedPercent'].toFixed(1)}/>
-
-                                <Paragraph className="text-center">
-                                    {Math.floor(this.state.status.memory['used'] / 1024 / 1024)}
-                                    /
-                                    {Math.floor(this.state.status.memory['total'] / 1024 / 1024)}
-                                    (MB)
-                                </Paragraph>
-                            </Col>
-                            <Col span={4}>
-
-                            </Col>
-                        </Row>
                     </Card>
 
                 </div>

web/src/components/session/OfflineSession.js

@@ -1,5 +1,4 @@
 import React, {Component} from 'react';
-import "video-react/dist/video-react.css";
 
 import {
     Button,
@@ -238,14 +237,14 @@ class OfflineSession extends Component {
             render: (id, record, index) => {
                 return index + 1;
             }
-        }, {
-            title: '用户昵称',
-            dataIndex: 'creatorName',
-            key: 'creatorName'
         }, {
             title: '来源IP',
             dataIndex: 'clientIp',
             key: 'clientIp'
+        }, {
+            title: '用户昵称',
+            dataIndex: 'creatorName',
+            key: 'creatorName'
         }, {
             title: '资产名称',
             dataIndex: 'assetName',
@@ -369,6 +368,13 @@ class OfflineSession extends Component {
                             <Col span={16} key={2} style={{textAlign: 'right'}}>
                                 <Space>
 
+                                    <Search
+                                        ref={this.inputRefOfClientIp}
+                                        placeholder="来源IP"
+                                        allowClear
+                                        onSearch={this.handleSearchByClientIp}
+                                    />
+
                                     <Select
                                         style={{width: 200}}
                                         showSearch
@@ -381,13 +387,6 @@ class OfflineSession extends Component {
                                         {userOptions}
                                     </Select>
 
-                                    <Search
-                                        ref={this.inputRefOfClientIp}
-                                        placeholder="来源IP"
-                                        allowClear
-                                        onSearch={this.handleSearchByClientIp}
-                                    />
-
                                     <Select
                                         style={{width: 200}}
                                         showSearch

web/src/components/session/OnlineSession.js

@@ -1,5 +1,4 @@
 import React, {Component} from 'react';
-import "video-react/dist/video-react.css";
 
 import {
     Button,
@@ -236,14 +235,14 @@ class OnlineSession extends Component {
             render: (id, record, index) => {
                 return index + 1;
             }
-        }, {
-            title: '用户昵称',
-            dataIndex: 'creatorName',
-            key: 'creatorName'
         }, {
             title: '来源IP',
             dataIndex: 'clientIp',
             key: 'clientIp'
+        }, {
+            title: '用户昵称',
+            dataIndex: 'creatorName',
+            key: 'creatorName'
         }, {
             title: '资产名称',
             dataIndex: 'assetName',
@@ -371,6 +370,13 @@ class OnlineSession extends Component {
                             <Col span={16} key={2} style={{textAlign: 'right'}}>
                                 <Space>
 
+                                    <Search
+                                        ref={this.inputRefOfClientIp}
+                                        placeholder="来源IP"
+                                        allowClear
+                                        onSearch={this.handleSearchByClientIp}
+                                    />
+
                                     <Select
                                         style={{width: 200}}
                                         showSearch
@@ -383,13 +389,6 @@ class OnlineSession extends Component {
                                         {userOptions}
                                     </Select>
 
-                                    <Search
-                                        ref={this.inputRefOfClientIp}
-                                        placeholder="来源IP"
-                                        allowClear
-                                        onSearch={this.handleSearchByClientIp}
-                                    />
-
                                     <Select
                                         style={{width: 200}}
                                         showSearch