forked from Surachai-kent/nxshell
-
Notifications
You must be signed in to change notification settings - Fork 1
Expand file tree
/
Copy pathnavtop.js
More file actions
164 lines (142 loc) · 3.72 KB
/
Copy pathnavtop.js
File metadata and controls
164 lines (142 loc) · 3.72 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
import React, { useState } from 'react';
import { Menu, ConfigProvider, Modal, Flex, Title } from 'antd';
import NewSSHContents from '../dialog/newssh';
import NewSettingContents from '../dialog/setting';
import { PlusOutlined } from '@ant-design/icons';
const style1 = {
marginLeft: '8pt',
};
// TODO：Children 中历史记录需要动态加载
const addnewChildren = [
{
type: 'group',
label: '新建',
children: [
{
label: 'SSH 链接',
key: 'ssh',
},
{
label: 'RDP 远程桌面',
key: 'rdp',
},
],
},
{
type: 'group',
label: '系统',
children: [
{
label: '设置',
key: 'setting',
},
],
},
{
type: 'group',
label: '历史记录',
children: [
{
label: 'AWS',
key: 'aws0',
},
{
label: 'Aliyun',
key: 'ali0',
},
],
},
];
class PanelNavTop extends React.Component {
constructor(props) {
super(props);
this.state = {
...props,
showModal: false,
currentTab: 'addnew',
modalTitle: "NoTitle",
items:[
{
label: '',
key: 'addnew',
title: '创建新会话',
icon: <PlusOutlined style={style1}/>,
children: addnewChildren,
}],
};
}
render() {
var i;
const getSSHModalBody = () => {
return (
<NewSSHContents onSubmit={handleModalSubmit} />
);
}
const getSettingModalBody = () => {
return (
<NewSettingContents onSubmit={handleModalSubmit} />
);
}
const showModal = () => {
this.setState({showModal: true});
};
const closeModal = () => {
this.setState({showModal: false});
};
const handleModalSubmit = (submit) => {
console.log("Get submit return.", submit);
closeModal();
// Call parents that we may need a new view
this.props.onSubmit(submit);
}
// 导航内容按需创建，从系统中心拉去该NAV 需要显示几个导航
const items = [...this.props.navItems, ...this.state.items];
// 菜单点击，包括子菜单内容
const onClick = (e) => {
console.log('click ', e);
// 弹出对话框配置新建的链接会话
if (e.key == 'ssh') {
// 将ssh 的内容填充到对话框中
this.setState({modalText:getSSHModalBody()})
this.setState({modalTitle:"新建SSH链接"});
showModal();
} else if (e.key == 'rdp') {
} else if (e.key == 'setting') {
this.setState({modalText:getSettingModalBody()})
showModal();
} else {
this.setState({currentTab: e.key});
// Normal tab
this.props.onClickTap(e.key);
}
};
const handleModalCancel = () => {
closeModal();
};
const current = this.state.currentTab;
return (
<>
<ConfigProvider
theme={{
components: {
Menu: {
itemPaddingInline:4,
},
},
}}
>
<Menu key="menu1" onClick={onClick} selectedKeys={[current]} mode="horizontal" items={items} triggerSubMenuAction="click" />
</ConfigProvider>
<Modal
title={this.state.modalTitle}
open={this.state.showModal}
footer={null}
onCancel={handleModalCancel}
>
{this.state.modalText}
</Modal>
</>
);
}
}
export default PanelNavTop;