Вынес кнопку наверх

jwt
Rinsvent 2 years ago
parent ac8359d488
commit bb977edb2c
  1. 34
      components/elements/commands/elements/command/index.tsx
  2. 43
      components/elements/commands/index.tsx

@ -4,7 +4,7 @@ import Arguments from "../arguments";
import {OptionInterface} from "../option"; import {OptionInterface} from "../option";
import {ArgumentInterface} from "../argument"; import {ArgumentInterface} from "../argument";
import {Provider} from "./context"; import {Provider} from "./context";
import {useState} from "react"; import {useEffect, useState} from "react";
export interface CommandInterface { export interface CommandInterface {
class: string, class: string,
@ -14,28 +14,19 @@ export interface CommandInterface {
arguments: ArgumentInterface[], arguments: ArgumentInterface[],
} }
export default function Command(command: CommandInterface) { interface CommandComponentInterface {
command: CommandInterface,
callback: any,
}
export default function Command({command, callback}: CommandComponentInterface) {
const [optionList, setOptionList] = useState<Record<string, any>>({}); const [optionList, setOptionList] = useState<Record<string, any>>({});
const [argumentList, setArgumentList] = useState<Record<string, any>>({}); const [argumentList, setArgumentList] = useState<Record<string, any>>({});
let onClick = async (event: any) => { useEffect(() => {
let url = `http://fmw.sipachev.sv/system-monitoring/commands/${command.name}/run` callback && callback(command.name, optionList, argumentList)
let data = { }, [optionList, argumentList])
options: optionList,
arguments: argumentList,
}
console.log('data', data)
let response = await fetch(url, {
method: 'POST',
headers: {
'Content-Type': 'application/json;charset=utf-8',
'X-Plugin-Token': 'passw0rd'
},
body: JSON.stringify(data)
});
let result = await response.json();
console.log('result', result)
}
return ( return (
<Provider value={{optionList, setOptionList, argumentList, setArgumentList}}> <Provider value={{optionList, setOptionList, argumentList, setArgumentList}}>
<div className={styles.task}> <div className={styles.task}>
@ -44,9 +35,6 @@ export default function Command(command: CommandInterface) {
<Options optionList={command.options} /> <Options optionList={command.options} />
<Arguments argumentList={command.arguments} /> <Arguments argumentList={command.arguments} />
</div> </div>
<div>
<button onClick={onClick}>Run</button>
</div>
</div> </div>
</Provider> </Provider>
) )

@ -1,9 +1,11 @@
import {Table, TableBody, TableCell, TableHead, TableRow} from "@mui/material"; import {Table, TableBody, TableCell, TableHead, TableRow, IconButton} from "@mui/material";
import Command, {CommandInterface} from "./elements/command"; import Command, {CommandInterface} from "./elements/command";
import {useEffect, useState} from "react"; import {useEffect, useState} from "react";
import PlayCircleOutlineIcon from '@mui/icons-material/PlayCircleOutline';
export default function Commands() { export default function Commands() {
const [commands, setCommands] = useState<CommandInterface[]>([]); const [commands, setCommands] = useState<CommandInterface[]>([]);
const [command2data, setCommand2data] = useState<Record<string, any>>({});
let refreshCommands = async () => { let refreshCommands = async () => {
let response = await fetch('http://fmw.sipachev.sv/system-monitoring/commands', { let response = await fetch('http://fmw.sipachev.sv/system-monitoring/commands', {
@ -31,11 +33,40 @@ export default function Commands() {
</TableRow> </TableRow>
</TableHead> </TableHead>
<TableBody> <TableBody>
{commands.map((command: CommandInterface, index: number) => ( {commands.map((command: CommandInterface, index: number) => {
<TableRow key={command.name}> let callback = (name: string, optionList: Record<string, any>, argumentList: Record<string, any>) => {
<TableCell><Command key={index} {...command} /></TableCell> let temp = {
</TableRow> ...command2data
))} }
temp[name] = {
options: optionList,
arguments: argumentList,
}
setCommand2data(temp)
}
let runCommand = async () => {
let url = `http://fmw.sipachev.sv/system-monitoring/commands/${command.name}/run`
let data = command2data[command.name] || {}
let response = await fetch(url, {
method: 'POST',
headers: {
'Content-Type': 'application/json;charset=utf-8',
'X-Plugin-Token': 'passw0rd'
},
body: JSON.stringify(data)
});
}
return (
<TableRow key={command.name}>
<TableCell><Command key={index} command={command} callback={callback} /></TableCell>
<TableCell>
<IconButton onClick={runCommand} aria-label="run">
<PlayCircleOutlineIcon />
</IconButton>
</TableCell>
</TableRow>
)
})}
</TableBody> </TableBody>
</Table> </Table>
) )

Loading…
Cancel
Save