diff --git a/spug_web/src/pages/ssh/FileManager.js b/spug_web/src/pages/ssh/FileManager.js index ab64e59..4ac6da3 100644 --- a/spug_web/src/pages/ssh/FileManager.js +++ b/spug_web/src/pages/ssh/FileManager.js @@ -39,8 +39,8 @@ class FileManager extends React.Component { key: 'name', render: info => info.kind === 'd' ? (
this.handleChdir(info.name, '1')} style={{cursor: 'pointer'}}> - - {info.name} + + {info.name}
) : ( @@ -131,7 +131,7 @@ class FileManager extends React.Component { this.setState({uploadStatus: 'success'}); this.fetchFiles() }, () => this.setState({uploadStatus: 'exception'})) - .finally(() => setTimeout(() => this.setState({uploading: false}), 2000)) + .finally(() => setTimeout(() => this.setState({uploading: false}), 2000)) } }; @@ -188,7 +188,7 @@ class FileManager extends React.Component { if (!this.state.showDot) { objects = objects.filter(x => !x.name.startsWith('.')) } - const scrollY = document.body.clientHeight - 222; + const scrollY = document.body.clientHeight - 182; return ( ))} -
+
显示隐藏文件: this.setState({showDot: v})}/> - } - onClick={this.handleUpload}>上传文件 + {this.state.uploading ? ( + + ) : ( + } + onClick={this.handleUpload}>上传文件 + )}
- {this.state.uploading && ( - - )} +
+
+
) } diff --git a/spug_web/src/pages/ssh/index.js b/spug_web/src/pages/ssh/index.js index 6bde02a..a5e394e 100644 --- a/spug_web/src/pages/ssh/index.js +++ b/spug_web/src/pages/ssh/index.js @@ -16,14 +16,15 @@ import { ReloadOutlined, VerticalAlignBottomOutlined, VerticalAlignMiddleOutlined, - CloseOutlined + CloseOutlined, + LeftOutlined, } from '@ant-design/icons'; import { NotFound, AuthButton } from 'components'; import Terminal from './Terminal'; import FileManager from './FileManager'; import { http, hasPermission, includes } from 'libs'; import styles from './index.module.less'; -import LogoSpugText from 'layout/logo-spug-txt.png'; +import LogoSpugText from 'layout/logo-spug-white.png'; import lds from 'lodash'; let posX = 0 @@ -241,17 +242,17 @@ function WebSSH(props) { type="editable-card" onTabClick={key => setActiveId(key)} onEdit={(key, action) => action === 'remove' ? handleRemove(key, 'self') : null} - style={{width: `calc(100vw - ${width}px)`}} + style={{background: '#fff', width: `calc(100vw - ${width}px)`}} tabBarExtraContent={hosts.length === 0 ? (
小提示:双击标签快速复制窗口,右击标签展开更多操作。
) : ( }>文件管理器 + icon={}>文件管理器 )}> {hosts.map(item => ( }> diff --git a/spug_web/src/pages/ssh/index.module.less b/spug_web/src/pages/ssh/index.module.less index cb76574..cd04815 100644 --- a/spug_web/src/pages/ssh/index.module.less +++ b/spug_web/src/pages/ssh/index.module.less @@ -11,9 +11,9 @@ .split { position: absolute; - width: 6px; + width: 8px; height: 100vh; - right: -3px; + right: -4px; cursor: ew-resize; } @@ -22,14 +22,16 @@ display: flex; justify-content: center; align-items: center; - background-color: #f0f0f0; + background-color: #2563fc; img { - height: 30px; + height: 28px; } } .hosts { + box-shadow: 2px 2px 2px #e0e0e0; + :global(.ant-tree-node-content-wrapper) { overflow: hidden; text-overflow: ellipsis; @@ -53,6 +55,7 @@ flex: 1; display: flex; flex-direction: column; + background: #eeeeee; .tips { position: absolute; @@ -62,40 +65,60 @@ color: #666; } + .fig { + flex: 1; + background-color: #2b2b2b; + color: #A9B7C6; + margin: 12px; + padding-top: 200px; + text-align: center; + border-radius: 6px; + } + .tabRender { user-select: none; padding: 8px 8px 8px 16px; margin: 0 -8px 0 -16px; + color: #2563fc; } :global(.ant-tabs-nav) { height: 42px; margin: 0; + padding-left: 12px; + } + + :global(.ant-tabs-nav:before) { + border: none; + } + + :global(.ant-tabs-tab) { + border: none; + background: #fff; } :global(.ant-tabs-tab-active) { - border-bottom: 2px solid #1890ff !important; + border-bottom: 2px solid #2563fc !important; transition: unset; } + + :global(.ant-tabs-content) { + background: #eeeeee; + } } } -.terminal { - flex: 1; - display: flex; +.termContainer { + margin: 12px; + border-radius: 6px; background-color: #2b2b2b; - padding-left: 5px; - height: calc(100vh - 42px); + padding: 10px 0 10px 10px; + + .terminal { + height: calc(100vh - 84px); + } } -.fig { - flex: 1; - background-color: #2b2b2b; - color: #A9B7C6; - padding-top: 200px; - margin-bottom: 0; - text-align: center; -} .fileSize { padding-right: 24px !important; @@ -106,6 +129,27 @@ justify-content: space-between; align-items: center; margin-bottom: 15px; + height: 24px; + + .action { + display: flex; + justify-content: flex-end; + align-items: center; + height: 24px; + } + + .progress { + width: 94px; + margin-left: 12px; + } + + :global(.ant-breadcrumb) { + flex: 1; + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; + margin-right: 24px; + } } .drawerBtn {