evan/next-terminal
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

- 修复无法查看原生会话录屏的bug

Browse Source 
- 优化列表显示的时间
- 优化获取开发环境的方式
This commit is contained in:
dushixiang
2021-02-20 17:03:32 +08:00
parent b977b85cdf
commit 11d3dc167b
26 changed files with 195 additions and 78 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
web/src/components/access/Access.js
View File

@ -3,7 +3,7 @@ import Guacamole from 'guacamole-common-js';
import {Affix, Button, Col, Drawer, Dropdown, Form, Input, Menu, message, Modal, Row} from 'antd'
import qs from "qs";
import request from "../../common/request";
import {wsServer} from "../../common/constants";
import {wsServer} from "../../common/env";
import {
AppstoreTwoTone,
CopyTwoTone,

2
web/src/components/access/Console.js
View File

@ -2,7 +2,7 @@ import React, {Component} from 'react';
import "xterm/css/xterm.css"
import {Terminal} from "xterm";
import qs from "qs";
import {wsServer} from "../../common/constants";
import {wsServer} from "../../common/env";
import "./Console.css"
import {getToken, isEmpty} from "../../utils/utils";
import {FitAddon} from 'xterm-addon-fit'

4
web/src/components/access/FileSystem.js
View File

@ -22,7 +22,7 @@ import {
} from "@ant-design/icons";
import qs from "qs";
import request from "../../common/request";
import {server} from "../../common/constants";
import {server} from "../../common/env";
import Upload from "antd/es/upload";
import {download, getFileName, getToken, isEmpty, renderSize} from "../../utils/utils";
import './FileSystem.css'
@ -107,7 +107,7 @@ class FileSystem extends Component {
if (isEmpty(key)) {
key = '/';
}
let result = await request.get(`${server}/sessions/${this.state.sessionId}/ls?dir=${key}`);
let result = await request.get(`/sessions/${this.state.sessionId}/ls?dir=${key}`);
if (result['code'] !== 1) {
message.error(result['message']);
return;

2
web/src/components/access/Monitor.js
View File

@ -2,7 +2,7 @@ import React, {Component} from 'react';
import Guacamole from 'guacamole-common-js';
import {Modal, Result, Spin} from 'antd'
import qs from "qs";
import {wsServer} from "../../common/constants";
import {wsServer} from "../../common/env";
import {getToken} from "../../utils/utils";
import './Access.css'

2
web/src/components/access/Term.js
View File

@ -2,7 +2,7 @@ import React, {Component} from 'react';
import "xterm/css/xterm.css"
import {Terminal} from "xterm";
import qs from "qs";
import {wsServer} from "../../common/constants";
import {wsServer} from "../../common/env";
import {getToken, isEmpty} from "../../utils/utils";
import {FitAddon} from 'xterm-addon-fit';
import "./Access.css"

79
web/src/components/asset/Asset.js
View File

@ -26,9 +26,8 @@ import qs from "qs";
import AssetModal from "./AssetModal";
import request from "../../common/request";
import {message} from "antd/es";
import {itemRender} from "../../utils/utils";
import {isEmpty, itemRender} from "../../utils/utils";
import dayjs from 'dayjs';
import {
DeleteOutlined,
DownOutlined,
@ -41,6 +40,7 @@ import {PROTOCOL_COLORS} from "../../common/constants";
import Logout from "../user/Logout";
import {hasPermission, isAdmin} from "../../service/permission";
const confirm = Modal.confirm;
const {Search} = Input;
const {Content} = Layout;
@ -59,6 +59,7 @@ const routes = [
class Asset extends Component {
inputRefOfName = React.createRef();
inputRefOfIp = React.createRef();
changeOwnerFormRef = React.createRef();
state = {
@ -172,6 +173,17 @@ class Asset extends Component {
this.loadTableData(query);
};
handleSearchByIp = ip => {
let query = {
...this.state.queryParams,
'pageIndex': 1,
'pageSize': this.state.queryParams.pageSize,
'ip': ip,
}
this.loadTableData(query);
};
handleTagsChange = tags => {
this.setState({
selectedTags: tags
@ -459,18 +471,48 @@ class Asset extends Component {
dataIndex: 'protocol',
key: 'protocol',
render: (text, record) => {
return (<Tag color={PROTOCOL_COLORS[text]}>{text}</Tag>);
const title = `${record['ip'] + ':' + record['port']}`
return (
<Tooltip title={title}>
<Tag color={PROTOCOL_COLORS[text]}>{text}</Tag>
</Tooltip>
)
}
}, {
title: '标签',
dataIndex: 'tags',
key: 'tags',
render: tags => {
if (!isEmpty(tags)) {
let tagDocuments = []
let tagArr = tags.split(',');
for (let i = 0; i < tagArr.length; i++) {
if (tags[i] === '-') {
continue;
}
tagDocuments.push(<Tag>{tagArr[i]}</Tag>)
}
return tagDocuments;
}
}
}, {
title: '状态',
dataIndex: 'active',
key: 'active',
render: text => {
if (text) {
return (<Badge status="processing" text="运行中"/>);
return (
<Tooltip title='运行中'>
<Badge status="processing"/>
</Tooltip>
)
} else {
return (<Badge status="error" text="不可用"/>);
return (
<Tooltip title='不可用'>
<Badge status="error"/>
</Tooltip>
)
}
}
}, {
@ -480,7 +522,14 @@ class Asset extends Component {
}, {
title: '创建日期',
dataIndex: 'created',
key: 'created'
key: 'created',
render: (text, record) => {
return (
<Tooltip title={text}>
{dayjs(text).fromNow()}
</Tooltip>
)
}
},
{
title: '操作',
@ -598,10 +647,10 @@ class Asset extends Component {
<Content key='page-content' className="site-layout-background page-content">
<div style={{marginBottom: 20}}>
<Row justify="space-around" align="middle" gutter={24}>
<Col span={8} key={1}>
<Col span={4} key={1}>
<Title level={3}>资产列表</Title>
</Col>
<Col span={16} key={2} style={{textAlign: 'right'}}>
<Col span={20} key={2} style={{textAlign: 'right'}}>
<Space>
<Search
@ -609,6 +658,15 @@ class Asset extends Component {
placeholder="资产名称"
allowClear
onSearch={this.handleSearchByName}
style={{width: 200}}
/>
<Search
ref={this.inputRefOfIp}
placeholder="资产IP"
allowClear
onSearch={this.handleSearchByIp}
style={{width: 200}}
/>
<Select mode="multiple"
@ -638,6 +696,7 @@ class Asset extends Component {
<Button icon={<UndoOutlined/>} onClick={() => {
this.inputRefOfName.current.setValue('');
this.inputRefOfIp.current.setValue('');
this.setState({
selectedTags: []
})

10
web/src/components/command/DynamicCommand.js
View File

@ -36,6 +36,7 @@ import {
import {compare, itemRender} from "../../utils/utils";
import Logout from "../user/Logout";
import {hasPermission, isAdmin} from "../../service/permission";
import dayjs from "dayjs";
const confirm = Modal.confirm;
const {Content} = Layout;
@ -403,7 +404,14 @@ class DynamicCommand extends Component {
}, {
title: '创建日期',
dataIndex: 'created',
key: 'created'
key: 'created',
render: (text, record) => {
return (
<Tooltip title={text}>
{dayjs(text).fromNow()}
</Tooltip>
)
}
}, {
title: '操作',
key: 'action',

8
web/src/components/credential/Credential.js
View File

@ -35,6 +35,7 @@ import {
import {itemRender} from "../../utils/utils";
import Logout from "../user/Logout";
import {hasPermission, isAdmin} from "../../service/permission";
import dayjs from "dayjs";
const confirm = Modal.confirm;
const {Search} = Input;
@ -375,6 +376,13 @@ class Credential extends Component {
title: '创建时间',
dataIndex: 'created',
key: 'created',
render: (text, record) => {
return (
<Tooltip title={text}>
{dayjs(text).fromNow()}
</Tooltip>
)
}
},
{
title: '操作',

26
web/src/components/session/OfflineSession.js
View File

@ -18,12 +18,13 @@ import {
} from "antd";
import qs from "qs";
import request from "../../common/request";
import {differTime, formatDate, itemRender} from "../../utils/utils";
import {differTime, itemRender} from "../../utils/utils";
import Playback from "./Playback";
import {message} from "antd/es";
import {DeleteOutlined, ExclamationCircleOutlined, SyncOutlined, UndoOutlined} from "@ant-design/icons";
import {PROTOCOL_COLORS} from "../../common/constants";
import Logout from "../user/Logout";
import dayjs from "dayjs";
const confirm = Modal.confirm;
const {Content} = Layout;
@ -244,29 +245,28 @@ class OfflineSession extends Component {
title: '资产名称',
dataIndex: 'assetName',
key: 'assetName'
}, {
title: '远程连接',
dataIndex: 'access',
key: 'access',
render: (text, record) => {
return `${record.username}@${record.ip}:${record.port}`;
}
}, {
title: '连接协议',
dataIndex: 'protocol',
key: 'protocol',
render: (text, record) => {
return (<Tag color={PROTOCOL_COLORS[text]}>{text}</Tag>);
const title = `${record.username}@${record.ip}:${record.port}`;
return (
<Tooltip title={title}>
<Tag color={PROTOCOL_COLORS[text]}>{text}</Tag>
</Tooltip>
)
}
}, {
title: '接入时间',
dataIndex: 'connectedTime',
key: 'connectedTime',
render: (text, record) => {
return formatDate(text, 'yyyy-MM-dd hh:mm:ss');
return (
<Tooltip title={text}>
{dayjs(text).fromNow()}
</Tooltip>
)
}
}, {
title: '接入时长',

26
web/src/components/session/OnlineSession.js
View File

@ -19,12 +19,13 @@ import {
} from "antd";
import qs from "qs";
import request from "../../common/request";
import {differTime, formatDate, itemRender} from "../../utils/utils";
import {differTime, itemRender} from "../../utils/utils";
import {message} from "antd/es";
import {PROTOCOL_COLORS} from "../../common/constants";
import {DisconnectOutlined, ExclamationCircleOutlined, SyncOutlined, UndoOutlined} from "@ant-design/icons";
import Monitor from "../access/Monitor";
import Logout from "../user/Logout";
import dayjs from "dayjs";
const confirm = Modal.confirm;
const {Content} = Layout;
@ -241,29 +242,28 @@ class OnlineSession extends Component {
title: '资产名称',
dataIndex: 'assetName',
key: 'assetName'
}, {
title: '远程连接',
dataIndex: 'access',
key: 'access',
render: (text, record) => {
return `${record.username}@${record.ip}:${record.port}`;
}
}, {
title: '连接协议',
dataIndex: 'protocol',
key: 'protocol',
render: (text, record) => {
return (<Tag color={PROTOCOL_COLORS[text]}>{text}</Tag>);
const title = `${record.username}@${record.ip}:${record.port}`;
return (
<Tooltip title={title}>
<Tag color={PROTOCOL_COLORS[text]}>{text}</Tag>
</Tooltip>
)
}
}, {
title: '接入时间',
dataIndex: 'connectedTime',
key: 'connectedTime',
render: (text, record) => {
return formatDate(text, 'yyyy-MM-dd hh:mm:ss');
return (
<Tooltip title={text}>
{dayjs(text).fromNow()}
</Tooltip>
)
}
}, {
title: '接入时长',

2
web/src/components/session/Playback.js
View File

@ -1,6 +1,6 @@
import React, {Component} from 'react';
import Guacamole from "guacamole-common-js";
import {server} from "../../common/constants";
import server from "../../common/env";
import {Button, Col, Row, Slider, Typography} from "antd";
import {PauseCircleOutlined, PlayCircleOutlined} from '@ant-design/icons';
import {Tooltip} from "antd/lib/index";

10
web/src/components/user/User.js
View File

@ -36,6 +36,7 @@ import {
import Logout from "./Logout";
import UserShareAsset from "./UserShareAsset";
import {hasPermission} from "../../service/permission";
import dayjs from "dayjs";
const confirm = Modal.confirm;
const {Search} = Input;
@ -342,7 +343,14 @@ class User extends Component {
}, {
title: '创建日期',
dataIndex: 'created',
key: 'created'
key: 'created',
render: (text, record) => {
return (
<Tooltip title={text}>
{dayjs(text).fromNow()}
</Tooltip>
)
}
},
{
title: '操作',

10
web/src/components/user/UserGroup.js
View File

@ -9,6 +9,7 @@ import {DeleteOutlined, ExclamationCircleOutlined, PlusOutlined, SyncOutlined, U
import Logout from "./Logout";
import UserGroupModal from "./UserGroupModal";
import UserShareAsset from "./UserShareAsset";
import dayjs from "dayjs";
const confirm = Modal.confirm;
const {Search} = Input;
@ -285,7 +286,14 @@ class UserGroup extends Component {
}, {
title: '创建日期',
dataIndex: 'created',
key: 'created'
key: 'created',
render: (text, record) => {
return (
<Tooltip title={text}>
{dayjs(text).fromNow()}
</Tooltip>
)
}
},
{
title: '操作',