Feat: edit node

This commit is contained in:
HFO4 2021-10-31 09:35:37 +08:00
parent ee4eff7d7a
commit 926b60214e
4 changed files with 81 additions and 21 deletions

View File

@ -34,6 +34,7 @@ import Import from "./component/Admin/File/Import";
import Captcha from "./component/Admin/Setting/Captcha";
import Node from "./component/Admin/Node/Node";
import AddNode from "./component/Admin/Node/AddNode";
import EditNode from "./component/Admin/Node/EditNode";
const useStyles = makeStyles((theme) => ({
root: {
@ -193,6 +194,10 @@ export default function Admin() {
<Route path={`${path}/node/add`} exact>
<AddNode />
</Route>
<Route path={`${path}/node/edit/:id`} exact>
<EditNode />
</Route>
</Switch>
)}
/>

View File

@ -0,0 +1,55 @@
import React, { useCallback, useEffect, useState } from "react";
import { makeStyles } from "@material-ui/core/styles";
import Paper from "@material-ui/core/Paper";
import NodeGuide from "./Guide/NodeGuide";
import { useParams } from "react-router";
import { useDispatch } from "react-redux";
import { toggleSnackbar } from "../../../actions";
import API from "../../../middleware/Api";
const useStyles = makeStyles((theme) => ({
root: {
[theme.breakpoints.up("md")]: {
marginLeft: 100,
},
marginBottom: 40,
},
content: {
padding: theme.spacing(2),
},
}));
export default function EditNode() {
const classes = useStyles();
const { id } = useParams();
const [node, setNode] = useState(null);
const dispatch = useDispatch();
const ToggleSnackbar = useCallback(
(vertical, horizontal, msg, color) =>
dispatch(toggleSnackbar(vertical, horizontal, msg, color)),
[dispatch]
);
useEffect(() => {
API.get("/admin/node/" + id)
.then((response) => {
response.data.Rank = response.data.Rank.toString();
response.data.Aria2Enabled = response.data.Aria2Enabled
? "true"
: "false";
setNode(response.data);
})
.catch((error) => {
ToggleSnackbar("top", "right", error.message, "error");
});
}, [id]);
return (
<div>
<Paper square className={classes.content}>
{node && <NodeGuide node={node} />}
</Paper>
</div>
);
}

View File

@ -100,8 +100,8 @@ export default function Aria2RPC(props) {
type: props.node.Type,
server: props.node.Server,
secret: props.node.SlaveKey,
rpc: props.node.Aria2OptionsSerialized.Server,
token: props.node.Aria2OptionsSerialized.Token,
rpc: props.node.Aria2OptionsSerialized.server,
token: props.node.Aria2OptionsSerialized.token,
})
.then((response) => {
ToggleSnackbar(
@ -219,7 +219,7 @@ export default function Aria2RPC(props) {
<br />
# RPC 授权令牌可自行设定
<br />
rpc-secure={props.node.Aria2OptionsSerialized.Token}
rpc-secret={props.node.Aria2OptionsSerialized.token}
<br />
</pre>
<Alert severity="info" style={{ marginBottom: 10 }}>
@ -254,10 +254,10 @@ export default function Aria2RPC(props) {
required
type={"url"}
value={
props.node.Aria2OptionsSerialized.Server
props.node.Aria2OptionsSerialized.server
}
onChange={props.handleOptionChange(
"Server"
"server"
)}
/>
<FormHelperText id="component-helper-text">
@ -281,8 +281,8 @@ export default function Aria2RPC(props) {
</Typography>
<div className={classes.form}>
<Input
value={props.node.Aria2OptionsSerialized.Token}
onChange={props.handleOptionChange("Token")}
value={props.node.Aria2OptionsSerialized.token}
onChange={props.handleOptionChange("token")}
/>
</div>
</div>
@ -301,9 +301,9 @@ export default function Aria2RPC(props) {
<div className={classes.form}>
<Input
value={
props.node.Aria2OptionsSerialized.TempPath
props.node.Aria2OptionsSerialized.temp_path
}
onChange={props.handleOptionChange("TempPath")}
onChange={props.handleOptionChange("temp_path")}
/>
</div>
</div>
@ -331,10 +331,10 @@ export default function Aria2RPC(props) {
required
value={
props.node.Aria2OptionsSerialized
.Interval
.interval
}
onChange={props.handleOptionChange(
"Interval"
"interval"
)}
/>
<FormHelperText id="component-helper-text">
@ -356,10 +356,10 @@ export default function Aria2RPC(props) {
required
value={
props.node.Aria2OptionsSerialized
.Timeout
.timeout
}
onChange={props.handleOptionChange(
"Timeout"
"timeout"
)}
/>
<FormHelperText id="component-helper-text">
@ -377,10 +377,10 @@ export default function Aria2RPC(props) {
required
value={
props.node.Aria2OptionsSerialized
.Options
.options
}
onChange={props.handleOptionChange(
"Options"
"options"
)}
/>
<FormHelperText id="component-helper-text">

View File

@ -63,9 +63,9 @@ export default function NodeGuide(props) {
MasterKey: randomStr(64),
Rank: "0",
Aria2OptionsSerialized: {
Token: randomStr(32),
Options: "{}",
Interval: 10,
token: randomStr(32),
options: "{}",
interval: 10,
},
}
);
@ -88,8 +88,8 @@ export default function NodeGuide(props) {
const handleOptionChange = (name) => (event) => {
setNode({
...node,
Aria2Options: {
...node.Aria2Options,
Aria2OptionsSerialized: {
...node.Aria2OptionsSerialized,
[name]: event.target.value,
},
});
@ -119,7 +119,7 @@ export default function NodeGuide(props) {
ToggleSnackbar(
"top",
"right",
"节点已" + (props.policy ? "保存" : "添加"),
"节点已" + (props.node ? "保存" : "添加"),
"success"
);
setActiveStep(activeStep + 1);