From a52b9a24cf8effe1ba42288dd8ede35aa21cc0d8 Mon Sep 17 00:00:00 2001 From: Rinsvent Date: Tue, 17 Jan 2023 23:46:34 +0700 Subject: [PATCH] =?UTF-8?q?=D0=94=D0=BE=D0=B1=D0=B0=D0=B2=D0=B8=D0=BB=20?= =?UTF-8?q?=D0=BF=D0=BE=D0=BA=D0=B0=D0=B7=20=D0=B4=D0=B8=D0=B0=D0=BB=D0=BE?= =?UTF-8?q?=D0=B3=D0=BE=D0=B2=20=D0=BF=D0=B5=D1=80=D0=B5=D1=85=D0=BE=D0=B4?= =?UTF-8?q?=20=D0=BF=D0=BE=20=D1=82=D0=B0=D0=B1=D0=B0=D0=BC=20=D0=B8=20?= =?UTF-8?q?=D0=BF=D0=BE=D0=BA=D0=B0=D0=B7=20=D0=B2=D1=8B=D0=B2=D0=BE=D0=B4?= =?UTF-8?q?=D0=B0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- components/elements/commands/index.tsx | 17 +++++--- components/elements/processes/index.tsx | 53 ++++++++++++++++++++++--- context/tab.ts | 10 +++++ pages/index.tsx | 19 ++++++--- 4 files changed, 83 insertions(+), 16 deletions(-) create mode 100644 context/tab.ts diff --git a/components/elements/commands/index.tsx b/components/elements/commands/index.tsx index 827ca9b..8b621a0 100644 --- a/components/elements/commands/index.tsx +++ b/components/elements/commands/index.tsx @@ -1,16 +1,19 @@ import styles from './styles.module.css' import {Table, TableBody, TableCell, TableHead, TableRow, IconButton, Autocomplete, TextField} from "@mui/material"; import Command, {CommandInterface} from "./elements/command"; -import {useEffect, useState} from "react"; +import {useContext, useEffect, useState} from "react"; import PlayCircleOutline from '@mui/icons-material/PlayCircleOutline'; -import { v4 } from "uuid" +import ConfirmDialog from "../confirm-dialog"; +import TabContext from "../../../context/tab"; +import {TabEnum} from "../../../pages"; export default function Commands() { + const {setTab} = useContext(TabContext) const [commands, setCommands] = useState([]); const [selectedCommand, setSelectedCommand] = useState(null); const [command2data, setCommand2data] = useState>({}); const [value, setValue] = useState(''); - let requestId = v4() + const [open, setOpen] = useState(false); let refreshCommands = async () => { let response = await fetch('http://fmw.sipachev.sv/system-monitoring/commands', { @@ -46,7 +49,7 @@ export default function Commands() { setCommand2data(temp) } let lock = false - let runCommand = async () => { + let runCommand = async (dialogId: string) => { if (lock) { return } @@ -56,7 +59,7 @@ export default function Commands() { lock = true let url = `http://fmw.sipachev.sv/system-monitoring/commands/${selectedCommand.name}/run` let data = command2data[selectedCommand.name] || {} - data['requestId'] = requestId; + data['requestId'] = dialogId; let response = await fetch(url, { method: 'POST', headers: { @@ -66,6 +69,7 @@ export default function Commands() { body: JSON.stringify(data) }); lock = false + setTab(TabEnum.Processes) } return ( @@ -95,13 +99,14 @@ export default function Commands() { {selectedCommand && - + setOpen(true)} aria-label="run"> } + setOpen(false)}/> ) } diff --git a/components/elements/processes/index.tsx b/components/elements/processes/index.tsx index 6c72380..08719bf 100644 --- a/components/elements/processes/index.tsx +++ b/components/elements/processes/index.tsx @@ -10,7 +10,7 @@ import ErrorOutline from "@mui/icons-material/ErrorOutline" import Replay from "@mui/icons-material/Replay" import RunCircle from "@mui/icons-material/RunCircle" import {IconButton, LinearProgress, TableContainer, Table, TableBody, TableCell, TableHead, TableRow, TablePagination} from "@mui/material" -import { v4 } from "uuid" +import ConfirmDialog from "../confirm-dialog"; export interface ProcessExceptionInterface { message: string, @@ -56,7 +56,8 @@ export default function Processes() { const [processes, setProcesses] = useState([]); const [page, setPage] = useState(0); const [count, setCount] = useState(0); - let requestId = v4() + const [open, setOpen] = useState(false); + const [selectedProcess, setSelectedProcess] = useState(null); let refreshLock = false let refreshProcesses = async () => { @@ -80,6 +81,17 @@ export default function Processes() { setCount(Number(response.headers.get('X-Pagination-Count'))) refreshLock = false } + let output = async (process: string) => { + let response = await fetch(`http://fmw.sipachev.sv/system-monitoring/processes/${process}/output`, + { + method: 'GET', + headers: { + 'X-Plugin-Token': 'passw0rd', + 'X-Pagination-Count': '0', + }, + }); + const processes: ProcessInterface[] = await response.json() + } useEffect(() => { const timer = setInterval(() => refreshProcesses(), 1000) @@ -114,8 +126,35 @@ export default function Processes() { setPage(page); } - const repeat = (event: any) => { + const openRepeatDialog = (process: ProcessInterface) => { + setSelectedProcess(process) + setOpen(true) + } + let lock = false + const repeat = async (dialogId: string) => { + if (lock) { + return + } + if (!selectedProcess) { + return + } + lock = true + let url = `http://fmw.sipachev.sv/system-monitoring/processes/${selectedProcess.id}/repeat` + let data = { + requestId: dialogId + } + let response = await fetch(url, { + method: 'POST', + headers: { + 'Content-Type': 'application/json;charset=utf-8', + 'X-Plugin-Token': 'passw0rd' + }, + body: JSON.stringify(data) + }); + lock = false + setSelectedProcess(null) + setOpen(false) } return ( @@ -156,7 +195,7 @@ export default function Processes() { {Status.Error === status(process) && } - {Status.Success === status(process) && + {Status.Success === status(process) && output(process.id)} title={`Success`} aria-label="Success"> } {Status.Running === status(process) && @@ -170,7 +209,7 @@ export default function Processes() { } - {canRepeat(process) && + {canRepeat(process) && openRepeatDialog(process)} title={`Repeat`} aria-label="Repeat"> } {canKill(process) && @@ -192,6 +231,10 @@ export default function Processes() { page={page} onPageChange={handleChangePage} /> + { + setSelectedProcess(null) + setOpen(false) + }}/> ) } diff --git a/context/tab.ts b/context/tab.ts new file mode 100644 index 0000000..434d997 --- /dev/null +++ b/context/tab.ts @@ -0,0 +1,10 @@ +import React from 'react' + +export interface ContextInterface { + tab: number, + setTab: (number: number) => void, +} + +const Context = React.createContext({} as ContextInterface) +export const Provider = Context.Provider +export default Context diff --git a/pages/index.tsx b/pages/index.tsx index 89fcad3..fa940a7 100644 --- a/pages/index.tsx +++ b/pages/index.tsx @@ -4,9 +4,15 @@ import Processes from "../components/elements/processes"; import {Tabs, Tab} from '@mui/material'; import {useState} from "react"; import Commands from "../components/elements/commands"; +import {Provider as TabProvider} from '../context/tab' + +export enum TabEnum { + Commands, + Processes, +} export default function Home() { - const [tab, setTab] = useState(0); + const [tab, setTab] = useState(TabEnum.Processes); const handleChange = (event: any, tab: number) => setTab(tab) return ( <> @@ -25,11 +31,14 @@ export default function Home() { allowScrollButtonsMobile aria-label="scrollable force tabs example" > - - + + - {tab === 0 && } - {tab === 1 && } + + {tab === TabEnum.Commands && } + {tab === TabEnum.Processes && } + + )