Skip to content
This repository was archived by the owner on Jan 24, 2024. It is now read-only.

Commit e8e9364

Browse files
LeiShi1313LeiShi1313
committed
v0.10.0: Fix a couple of bugs
1 parent e432518 commit e8e9364

File tree

8 files changed

+195
-34
lines changed

8 files changed

+195
-34
lines changed

‎package.json‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -25,6 +25,7 @@
2525
"faker": "4.1.0",
2626
"jwt-decode": "^3.0.0",
2727
"phosphor-react": "^1.0.0",
28+
"postcss": "^8.1.10",
2829
"react": "^16.13.1",
2930
"react-chartjs-2": "2.9.0",
3031
"react-dom": "^16.13.1",

‎src/components/Buttons/ServerPortUserAdd.js‎

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -38,13 +38,15 @@ const ServerPortUserAdd = ({
3838

3939
return (
4040
<div className="relative">
41+
<button className="hidden" />
4142
<button
4243
className={
4344
addingType === "port"
4445
? "align-bottom inline-flex items-center justify-center cursor-pointer leading-5 transition-colors duration-150 font-medium focus:outline-none px-1 py-1 rounded-md text-sm text-white bg-green-400 border border-transparent active:bg-green-600 hover:bg-green-700 focus:shadow-outline-green"
4546
: "align-bottom inline-flex items-center justify-center cursor-pointer leading-5 transition-colors duration-150 font-medium focus:outline-none px-4 py-2 rounded-lg text-sm text-white bg-purple-600 border border-transparent active:bg-purple-600 hover:bg-purple-700 focus:shadow-outline-purple"
4647
}
47-
onClick={() => {
48+
onClick={e => {
49+
e.preventDefault();
4850
setIsAdding(!isAdding);
4951
setSearchText("");
5052
}}

‎src/components/ForwardRuleEditor.js‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -197,7 +197,7 @@ const ForwardRuleEditor = ({
197197
<div className="flex flex-3 items-center">
198198
<button
199199
className="mr-3 h-5 w-5 text-sm font-medium leading-5 text-white transition-colors duration-150 bg-red-500 border border-transparent rounded active:bg-red-600 hover:bg-red-700 focus:outline-none focus:shadow-outline-red"
200-
onClick={() =>
200+
onClick={e => e.preventDefault() &&
201201
retries > 0 ? setRetries(retries - 1) : setRetries(0)
202202
}
203203
>

‎src/components/PortUserEditor.js‎

Lines changed: 6 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -53,24 +53,27 @@ const PortUserEditor = ({ portId, serverId, isModalOpen, setIsModalOpen }) => {
5353
? port.allowed_users.map((user, idx) => (
5454
<Label className="mt-4" key={`port_user_editor_users_${idx}`}>
5555
<div className="flex flex-row flex-wrap justify-start items-center">
56-
<div className="flex w-1/2 items-center text-gray-500 focus-within:text-purple-600 dark:focus-within:text-purple-400">
56+
<div className="flex w-1/2 items-center text-gray-500 focus-within:text-purple-600 dark:focus-within:text-purple-400"
57+
onClick={e => {e.preventDefault();alert(e.target.value)}}
58+
>
5759
<span className="flex flex-auto ml-2">
5860
{user.user.email}
5961
</span>
6062
</div>
6163
<div className="flex flex-row w-1/2 justify-end items-center">
64+
<Button className="hidden" />
6265
<Button
6366
layout="link"
6467
aria-label="delete"
65-
onClick={() =>
68+
onClick={e => {e.preventDefault();
6669
dispatch(
6770
deleteServerPortUser(
6871
serverId,
6972
portId,
7073
user.user_id
7174
)
7275
)
73-
}
76+
}}
7477
>
7578
删除
7679
</Button>

‎src/components/ServerEditor.js‎

Lines changed: 71 additions & 21 deletions
Original file line numberDiff line numberDiff line change
@@ -10,9 +10,9 @@ import {
1010
ModalFooter,
1111
Button,
1212
} from "@windmill/react-ui";
13-
import { At } from 'phosphor-react'
13+
import { At } from "phosphor-react";
1414

15-
import { TwoDotIcon } from "../icons"
15+
import { TwoDotIcon } from "../icons";
1616
import {
1717
createServer,
1818
editServer,
@@ -21,14 +21,17 @@ import {
2121

2222
const ServerEditor = ({ server, isModalOpen, setIsModalOpen }) => {
2323
const dispatch = useDispatch();
24+
const [lastServer, setLastServer] = useState(null);
2425
const [name, setName] = useState("");
2526
const [address, setAddress] = useState("");
2627
const [ansibleName, setAnsibleName] = useState("");
2728
const [ansibleHost, setAnsibleHost] = useState("");
2829
const [ansiblePort, setAnsiblePort] = useState(22);
2930
const [sshUser, setSshUser] = useState("root");
3031
const [sshPassword, setSshPassword] = useState("");
32+
const [sshPasswordNeeded, setSshPasswordNeeded] = useState(false);
3133
const [sudoPassword, setSudoPassword] = useState("");
34+
const [sudoPasswordNeeded, setSudoPasswordNeeded] = useState(false);
3235
const [isDelete, setIsDelete] = useState(false);
3336

3437
const validName = () => name.length > 0;
@@ -59,8 +62,16 @@ const ServerEditor = ({ server, isModalOpen, setIsModalOpen }) => {
5962
};
6063
if (ansibleHost) data.ansible_host = ansibleHost;
6164
if (ansiblePort) data.ansible_port = ansiblePort;
62-
if (sshPassword) data.ssh_password = sshPassword;
63-
if (sudoPassword) data.sudo_password = sudoPassword;
65+
if (!sshPasswordNeeded) {
66+
data.ssh_password = null;
67+
} else if (sshPassword) {
68+
data.ssh_password = sshPassword;
69+
}
70+
if (!sudoPasswordNeeded) {
71+
data.sudo_password = null;
72+
} else if (sudoPassword) {
73+
data.sudo_password = sudoPassword;
74+
}
6475

6576
if (server) {
6677
dispatch(editServer(server.id, data));
@@ -69,6 +80,14 @@ const ServerEditor = ({ server, isModalOpen, setIsModalOpen }) => {
6980
}
7081
}
7182
setIsModalOpen(false);
83+
setName("");
84+
setAddress("");
85+
setAnsibleName("");
86+
setAnsibleHost("");
87+
setAnsiblePort(22);
88+
setSshUser("root");
89+
setSshPasswordNeeded(false);
90+
setSudoPasswordNeeded(false);
7291
};
7392

7493
useEffect(() => {
@@ -84,14 +103,15 @@ const ServerEditor = ({ server, isModalOpen, setIsModalOpen }) => {
84103
else setAnsibleHost("");
85104
if (server.ansible_port) setAnsiblePort(server.ansible_port);
86105
else setAnsiblePort("");
87-
} else {
106+
} else if (lastServer) {
88107
setName("");
89108
setAddress("");
90109
setAnsibleName("");
91110
setAnsibleHost("");
92111
setAnsiblePort(22);
93112
setSshUser("root");
94113
}
114+
setLastServer(server);
95115
}, [isModalOpen, server]);
96116

97117
return (
@@ -161,24 +181,54 @@ const ServerEditor = ({ server, isModalOpen, setIsModalOpen }) => {
161181
</div>
162182
</Label>
163183
<Label className="mt-1">
164-
<span>SSH密码</span>
165-
<Input
166-
className="mt-1"
167-
placeholder={"可为空，默认使用ssh key"}
168-
value={sshPassword}
169-
valid={() => !sshPassword || sshPassword.length >= 6}
170-
onChange={(e) => setSshPassword(e.target.value)}
171-
/>
184+
<div className="flex flex-row justify-between items-center">
185+
<span>SSH密码</span>
186+
<div>
187+
<Input
188+
type="checkbox"
189+
className="mr-1"
190+
checked={!sshPasswordNeeded}
191+
onChange={() => setSshPasswordNeeded(!sshPasswordNeeded)}
192+
/>
193+
<span>不需要SSH密码</span>
194+
</div>
195+
</div>
196+
{sshPasswordNeeded ? (
197+
<Input
198+
className="mt-1"
199+
placeholder={"可为空，默认使用ssh key"}
200+
value={sshPassword}
201+
valid={() => !sshPassword || sshPassword.length >= 6}
202+
onChange={(e) => setSshPassword(e.target.value)}
203+
/>
204+
) : (
205+
<Input className="mt-1" disabled={true} />
206+
)}
172207
</Label>
173208
<Label className="mt-1">
174-
<span>SUDO密码</span>
175-
<Input
176-
className="mt-1"
177-
placeholder={"可为空，用户非root且需输sudo密码则需填写"}
178-
value={sudoPassword}
179-
valid={() => !sudoPassword || sudoPassword.length >= 6}
180-
onChange={(e) => setSudoPassword(e.target.value)}
181-
/>
209+
<div className="flex flex-row justify-between items-center">
210+
<span>SUDO密码</span>
211+
<div>
212+
<Input
213+
type="checkbox"
214+
className="mr-1"
215+
checked={!sudoPasswordNeeded}
216+
onChange={() => setSudoPasswordNeeded(!sudoPasswordNeeded)}
217+
/>
218+
<span>不需要SUDO密码</span>
219+
</div>
220+
</div>
221+
{sudoPasswordNeeded ? (
222+
<Input
223+
className="mt-1"
224+
placeholder={"可为空，用户非root且需输sudo密码则需填写"}
225+
value={sudoPassword}
226+
valid={() => !sudoPassword || sudoPassword.length >= 6}
227+
onChange={(e) => setSudoPassword(e.target.value)}
228+
/>
229+
) : (
230+
<Input className="mt-1" disabled={true} />
231+
)}
182232
</Label>
183233

184234
{server ? (

‎src/pages/Server.js‎

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -25,7 +25,7 @@ import {
2525

2626
import { getServer } from "../redux/actions/servers";
2727
import { PlusIcon, InfinityIcon } from "../icons";
28-
import { clearServerPorts, getServerPorts } from "../redux/actions/ports";
28+
import { getServerPorts } from "../redux/actions/ports";
2929
import FullScreenLoading from "../components/FullScreenLoading";
3030
import AuthSelector from "../components/AuthSelector";
3131
import PortEditor from "../components/PortEditor";
@@ -106,7 +106,6 @@ function Server() {
106106
const [showUsers, setShowUsers] = useState({});
107107

108108
useEffect(() => {
109-
dispatch(clearServerPorts());
110109
dispatch(getServerPorts(server_id));
111110
if (!(server_id in servers)) {
112111
dispatch(getServer(server_id));

‎src/pages/Servers.js‎

Lines changed: 70 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,7 @@ import React, { useState, useEffect } from "react";
22
import { useSelector, useDispatch } from "react-redux";
33
import { useHistory } from "react-router-dom";
44
import {
5+
Badge,
56
Button,
67
TableBody,
78
TableContainer,
@@ -10,15 +11,50 @@ import {
1011
TableCell,
1112
TableRow,
1213
} from "@windmill/react-ui";
14+
import { Question, CheckCircle, WarningCircle } from "phosphor-react";
1315

1416
import { PlusIcon } from "../icons";
17+
import AuthSelector from "../components/AuthSelector";
1518
import ServerEditor from "../components/ServerEditor";
1619
import { getServers } from "../redux/actions/servers";
1720
import PageTitle from "../components/Typography/PageTitle";
21+
import { clearServerPorts } from "../redux/actions/ports";
22+
23+
const serverFactsToBadge = (facts, permission) => {
24+
if (!facts)
25+
return (
26+
<>
27+
<Badge type="warning">SSH状态未知</Badge>
28+
{permission === "user" ? (
29+
<span>请通知管理员更新服务器状态</span>
30+
) : (
31+
<span>请稍等片刻或重新编辑一次服务器以触发服务器状态更新</span>
32+
)}
33+
</>
34+
);
35+
if (!facts.ansible_distribution)
36+
return (
37+
<>
38+
<Badge type="warning">SSH连接失败</Badge>
39+
{permission === "user" ? (
40+
<span>请通知管理员检查SSH连接信息</span>
41+
) : (
42+
<span>请检查SSH连接信息</span>
43+
)}
44+
</>
45+
);
46+
return (
47+
<>
48+
<Badge type="success">SSH连接成功</Badge>
49+
<span>{`${facts.ansible_distribution} ${facts.ansible_distribution_version} (${facts.ansible_distribution_release}) ${facts.ansible_architecture}`}</span>
50+
</>
51+
);
52+
};
1853

1954
function Servers() {
2055
const [editorOpen, setEditorOpen] = useState(false);
2156
const [currentServer, setCurrentServer] = useState(null);
57+
const [showFacts, setShowFacts] = useState({});
2258
const servers = useSelector((state) => state.servers.servers);
2359
const permission = useSelector((state) => state.auth.permission);
2460
const dispatch = useDispatch();
@@ -56,9 +92,10 @@ function Servers() {
5692
<Table>
5793
<TableHeader>
5894
<tr>
59-
<TableCell>Name</TableCell>
60-
<TableCell>Address</TableCell>
61-
<TableCell>Actions</TableCell>
95+
<TableCell>名字</TableCell>
96+
<TableCell>地址</TableCell>
97+
<TableCell>SSH状态</TableCell>
98+
<TableCell>动作</TableCell>
6299
</tr>
63100
</TableHeader>
64101
<TableBody>
@@ -70,11 +107,40 @@ function Servers() {
70107
<TableCell>
71108
<span className="text-sm">{servers[server_id].address}</span>
72109
</TableCell>
110+
<TableCell>
111+
<div className="relative z-20 inline-flex">
112+
<div
113+
onMouseEnter={() => setShowFacts({ [server_id]: true })}
114+
onMouseLeave={() => setShowFacts({ [server_id]: false })}
115+
>
116+
{servers[server_id].config.facts ? (
117+
!servers[server_id].config.facts
118+
.ansible_distribution ? (
119+
<WarningCircle weight="bold" size={20} />
120+
) : (
121+
<CheckCircle weight="bold" size={20} />
122+
)
123+
) : (
124+
<Question weight="bold" size={20} />
125+
)}
126+
</div>
127+
{showFacts[server_id] ? (
128+
<div className="relative">
129+
<div className="absolute top-0 z-30 w-auto p-2 -mt-1 text-sm leading-tight text-black transform -translate-x-1/2 -translate-y-full bg-white rounded-lg shadow-lg">
130+
{serverFactsToBadge(
131+
servers[server_id].config.facts,
132+
permission
133+
)}
134+
</div>
135+
</div>
136+
) : null}
137+
</div>
138+
</TableCell>
73139
<TableCell>
74140
<div className="flex justify-start space-x-1">
75141
<Button
76142
size="small"
77-
onClick={() => history.push(`/app/servers/${server_id}`)}
143+
onClick={() => {dispatch(clearServerPorts());history.push(`/app/servers/${server_id}`)}}
78144
>
79145
查看
80146
</Button>

0 commit comments

Comments
 (0)