修改dashboard页面
This commit is contained in:
1
go.mod
1
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
|
||||
|
17
main.go
17
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(users) == 0 {
|
||||
if len(model.FindAllUser()) == 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()
|
||||
|
@ -1,41 +1,10 @@
|
||||
package api
|
||||
|
||||
import (
|
||||
"next-terminal/pkg/model"
|
||||
"fmt"
|
||||
"github.com/labstack/echo/v4"
|
||||
"github.com/shirou/gopsutil/cpu"
|
||||
"github.com/shirou/gopsutil/load"
|
||||
"github.com/shirou/gopsutil/mem"
|
||||
"time"
|
||||
"next-terminal/pkg/model"
|
||||
)
|
||||
|
||||
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)
|
||||
}
|
||||
|
@ -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)
|
||||
}
|
||||
|
||||
|
@ -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
|
||||
}
|
||||
|
@ -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)
|
||||
}
|
25
pkg/model/num.go
Normal file
25
pkg/model/num.go
Normal file
@ -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
|
||||
}
|
@ -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
|
||||
}
|
||||
|
858
web/package-lock.json
generated
858
web/package-lock.json
generated
File diff suppressed because it is too large
Load Diff
@ -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"
|
||||
|
@ -1,5 +1,4 @@
|
||||
import React, {Component} from 'react';
|
||||
import "video-react/dist/video-react.css";
|
||||
|
||||
import {
|
||||
Badge,
|
||||
|
@ -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";
|
||||
|
@ -1,10 +1,11 @@
|
||||
import React, {Component} from 'react';
|
||||
import {Layout, PageHeader, Card, Row, Col, Progress, Typography, Popover, Statistic} from "antd";
|
||||
import {DesktopOutlined, IdcardOutlined, LikeOutlined, LinkOutlined, UserOutlined} from '@ant-design/icons';
|
||||
import {Card, Col, Layout, PageHeader, Radio, Row, Statistic, Typography} from "antd";
|
||||
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: {
|
||||
load: {
|
||||
load1: 0,
|
||||
load5: 0,
|
||||
load15: 0,
|
||||
},
|
||||
cpu: {
|
||||
percent: 0,
|
||||
logicalCount: 0,
|
||||
physicalCount: 0
|
||||
},
|
||||
memory: {
|
||||
usedPercent: 0,
|
||||
available: 0,
|
||||
total: 0,
|
||||
used: 0
|
||||
}
|
||||
},
|
||||
interval: null,
|
||||
counter: {}
|
||||
counter: {},
|
||||
d: 'w',
|
||||
session: [],
|
||||
}
|
||||
|
||||
componentDidMount() {
|
||||
this.getCounter();
|
||||
this.getStatus();
|
||||
|
||||
this.setState({
|
||||
interval: setInterval(() => this.getStatus(), 5000)
|
||||
})
|
||||
this.getD();
|
||||
}
|
||||
|
||||
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 = (
|
||||
<div>
|
||||
<p>最近1分钟负载:{this.state.status.load['load1'].toFixed(1)}</p>
|
||||
<p>最近5分钟负载:{this.state.status.load['load5'].toFixed(1)}</p>
|
||||
<p>最近15分钟负载:{this.state.status.load['load15'].toFixed(1)}</p>
|
||||
</div>
|
||||
);
|
||||
const config = {
|
||||
data: this.state.session,
|
||||
xField: 'day',
|
||||
yField: 'count',
|
||||
seriesField: 'protocol',
|
||||
};
|
||||
|
||||
const cpuContent = (
|
||||
<div>
|
||||
<p>CPU型号:{this.state.status.cpu['modelName']}</p>
|
||||
<p>物理核心:{this.state.status.cpu['physicalCount']}</p>
|
||||
<p>逻辑核心:{this.state.status.cpu['logicalCount']}</p>
|
||||
</div>
|
||||
);
|
||||
const buttonRadio = <Radio.Group value={this.state.d} onChange={this.handleChangeD}>
|
||||
<Radio.Button value="w">按周</Radio.Button>
|
||||
<Radio.Button value="m">按月</Radio.Button>
|
||||
</Radio.Group>
|
||||
|
||||
return (
|
||||
<>
|
||||
@ -150,41 +132,8 @@ class Dashboard extends Component {
|
||||
</div>
|
||||
|
||||
<div className="page-card">
|
||||
<Card title="状态" bordered={true}>
|
||||
<Row>
|
||||
<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 title="会话统计" bordered={true} extra={buttonRadio}>
|
||||
<Area {...config} />
|
||||
</Card>
|
||||
|
||||
</div>
|
||||
|
@ -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
|
||||
|
@ -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
|
||||
|
Reference in New Issue
Block a user