Перенес флаги / статусы на бэк

jwt
Sipachev Igor 2 years ago
parent f1de8a69f9
commit e0a9da229e
  1. 113
      components/elements/processes/index.tsx

@ -26,6 +26,8 @@ export interface ProcessProgressInterface {
total: number,
progress: number,
memory: any[],
remaining: string
percent: number
}
export interface ProcessInterface {
@ -45,14 +47,20 @@ export interface ProcessInterface {
pausedAt: string | null,
cancelledAt: string | null
completedAt: string | null
status: Status
canPlay: boolean
canPause: boolean
canRepeat: boolean
canStop: boolean
canKill: boolean
}
enum Status {
Wait,
Running,
Cancelled,
Error,
Success
Wait = 'wait',
Running = 'running',
Cancelled = 'cancelled',
Error = 'error',
Success = 'success',
}
export default function Processes() {
@ -99,28 +107,6 @@ export default function Processes() {
}, [page]);
let isFinished = (process: ProcessInterface) => process.cancelledAt || process.completedAt
let canPlay = (process: ProcessInterface) => !isFinished(process) && process.progress && process.pausedAt
let canPause = (process: ProcessInterface) => !isFinished(process) && process.progress && !process.pausedAt
let canRepeat = (process: ProcessInterface) => isFinished(process)
let canStop = (process: ProcessInterface) => !isFinished(process) && process.progress
let canKill = (process: ProcessInterface) => !isFinished(process) && process.startedAt
let progress = (progress: ProcessProgressInterface) => progress.progress / progress.total * 100
let status = (process: ProcessInterface): Status => {
if (process.cancelledAt && process.completedAt) {
return Status.Cancelled
}
if (process.exception && process.completedAt) {
return Status.Error
}
if (!process.exception && process.completedAt) {
return Status.Success
}
if (process.startedAt && !process.completedAt) {
return Status.Running
}
return Status.Wait
}
const handleChangePage = (event: any, page: number) => {
setPage(page);
@ -157,55 +143,6 @@ export default function Processes() {
setOpen(false)
}
let formatSize = (length: any) => {
var i = 0, type = ['b','Kb','Mb','Gb','Tb','Pb'];
while((length / 1000 | 0) && i < type.length - 1) {
length /= 1024;
i++;
}
return length.toFixed(2) + ' ' + type[i];
}
let remaining = (process: ProcessInterface) =>
{
if (!process?.progress?.progress || !process.startedAt) {
return null
}
return Math.round((new Date().getTime() - new Date(process.startedAt).getTime()) / process?.progress.progress * (process?.progress.total - process?.progress.progress));
}
let formatTime = ($secs: number | null) => {
if ($secs === null) {
return ''
}
let $timeFormats = [
[0, '< 1 sec'],
[1, '1 sec'],
[2, 'secs', 1],
[60, '1 min'],
[120, 'mins', 60],
[3600, '1 hr'],
[7200, 'hrs', 3600],
[86400, '1 day'],
[172800, 'days', 86400],
];
for (let $index in $timeFormats) {
let $format = $timeFormats[$index]
if ($secs >= $format[0]) {
if ((typeof $timeFormats[$index + 1] !== 'undefined' && $secs < $timeFormats[$index + 1][0])
|| $index == $timeFormats.length - 1
) {
if (2 == $format.length) {
return $format[1];
}
return Math.floor($secs / $format[2]) + ' ' + $format[1];
}
}
}
}
return (
<>
<TableContainer>
@ -226,42 +163,42 @@ export default function Processes() {
<TableCell>
{!process.progress && !isFinished(process) && <LinearProgress/>}
{!process.progress && isFinished(process) && <LinearProgress variant="determinate" value={100}/>}
{process.progress && <LinearProgress variant="determinate" value={progress(process.progress)}/>}
{process.progress && <LinearProgress variant="determinate" value={process.progress.percent}/>}
{process.progress && <span>
{`${process.progress.progress}`} / {`${process.progress.total}`} - {progress(process.progress)}% [{formatSize(process.progress.memory)}] / {formatTime(remaining(process))}
{`${process.progress.progress}`} / {`${process.progress.total}`} - {process.progress.percent}% [{process.progress.memory}] / {process.progress.remaining}
</span>}
{canPlay(process) && <IconButton title={`Play`} aria-label="Play">
{process.canPlay && <IconButton title={`Play`} aria-label="Play">
<PlayCircleOutline/>
</IconButton>}
{canPause(process) && <IconButton title={`Pause`} aria-label="Pause">
{process.canPause && <IconButton title={`Pause`} aria-label="Pause">
<PauseCircleOutline/>
</IconButton>}
{canStop(process) && <IconButton title={`Stop`} aria-label="Stop">
{process.canStop && <IconButton title={`Stop`} aria-label="Stop">
<StopCircleOutlined/>
</IconButton>}
</TableCell>
<TableCell>
{Status.Error === status(process) && <IconButton title={`Error`} aria-label="Error">
{Status.Error === process.status && <IconButton title={`Error`} aria-label="Error">
<ErrorOutline/>
</IconButton>}
{Status.Success === status(process) && <IconButton title={`Success`} aria-label="Success">
{Status.Success === process.status && <IconButton title={`Success`} aria-label="Success">
<CheckCircleOutline/>
</IconButton>}
{Status.Running === status(process) && <IconButton title={`Running`} aria-label="Running">
{Status.Running === process.status && <IconButton title={`Running`} aria-label="Running">
<RunCircleOutlined/>
</IconButton>}
{Status.Cancelled === status(process) && <IconButton title={`Cancelled`} aria-label="Cancelled">
{Status.Cancelled === process.status && <IconButton title={`Cancelled`} aria-label="Cancelled">
<StopCircleOutlined/>
</IconButton>}
{Status.Wait === status(process) && <IconButton title={`Wait`} aria-label="Wait">
{Status.Wait === process.status && <IconButton title={`Wait`} aria-label="Wait">
<HourglassEmptyOutlined/>
</IconButton>}
</TableCell>
<TableCell>
{canRepeat(process) && <IconButton onClick={() => openRepeatDialog(process)} title={`Repeat`} aria-label="Repeat">
{process.canRepeat && <IconButton onClick={() => openRepeatDialog(process)} title={`Repeat`} aria-label="Repeat">
<ReplayOutlined/>
</IconButton>}
{canKill(process) && <IconButton title={`Kill`} aria-label="Kill">
{process.canKill && <IconButton title={`Kill`} aria-label="Kill">
<DeleteForeverOutlined/>
</IconButton>}
{process?.outputId && <IconButton title={`Output`} onClick={() => output(process)} aria-label="Output">

Loading…
Cancel
Save