|
@@ -32,7 +32,6 @@ import { GET_TASKS_URL, KILL_TASK_URL } from './constants.ts';
|
|
|
import ScheduleTaskModal from './ScheduleTaskModal/ScheduleTaskModal.tsx';
|
|
import ScheduleTaskModal from './ScheduleTaskModal/ScheduleTaskModal.tsx';
|
|
|
import TaskLogsModal from './TaskLogsModal/TaskLogsModal.tsx';
|
|
import TaskLogsModal from './TaskLogsModal/TaskLogsModal.tsx';
|
|
|
import LoadingErrorWrapper from '../LoadingErrorWrapper/LoadingErrorWrapper.tsx';
|
|
import LoadingErrorWrapper from '../LoadingErrorWrapper/LoadingErrorWrapper.tsx';
|
|
|
-import useResizeObserver from '../../utils/hooks/useResizeObserver/useResizeObserver';
|
|
|
|
|
|
|
|
|
|
import './TaskServer.scss';
|
|
import './TaskServer.scss';
|
|
|
|
|
|
|
@@ -69,22 +68,26 @@ export const TaskServer: React.FC = () => {
|
|
|
{
|
|
{
|
|
|
title: t('User'),
|
|
title: t('User'),
|
|
|
dataIndex: ['result', 'username'],
|
|
dataIndex: ['result', 'username'],
|
|
|
- key: 'user'
|
|
|
|
|
|
|
+ key: 'user',
|
|
|
|
|
+ width: '10%'
|
|
|
},
|
|
},
|
|
|
{
|
|
{
|
|
|
title: t('Progress'),
|
|
title: t('Progress'),
|
|
|
dataIndex: ['result', 'progress'],
|
|
dataIndex: ['result', 'progress'],
|
|
|
- key: 'progress'
|
|
|
|
|
|
|
+ key: 'progress',
|
|
|
|
|
+ width: '10%'
|
|
|
},
|
|
},
|
|
|
{
|
|
{
|
|
|
title: t('Task Name'),
|
|
title: t('Task Name'),
|
|
|
dataIndex: ['result', 'taskName'],
|
|
dataIndex: ['result', 'taskName'],
|
|
|
- key: 'taskName'
|
|
|
|
|
|
|
+ key: 'taskName',
|
|
|
|
|
+ width: '10%'
|
|
|
},
|
|
},
|
|
|
{
|
|
{
|
|
|
title: t('Parameters'),
|
|
title: t('Parameters'),
|
|
|
dataIndex: 'parameters',
|
|
dataIndex: 'parameters',
|
|
|
key: 'parameters',
|
|
key: 'parameters',
|
|
|
|
|
+ width: '10%',
|
|
|
render: (_, record: TaskServerResponse) => {
|
|
render: (_, record: TaskServerResponse) => {
|
|
|
if (record.result?.taskName) {
|
|
if (record.result?.taskName) {
|
|
|
const paramterText = {
|
|
const paramterText = {
|
|
@@ -103,6 +106,7 @@ export const TaskServer: React.FC = () => {
|
|
|
title: t('Status'),
|
|
title: t('Status'),
|
|
|
dataIndex: 'status',
|
|
dataIndex: 'status',
|
|
|
key: 'status',
|
|
key: 'status',
|
|
|
|
|
+ width: '10%',
|
|
|
render: (status: TaskServerResponse['status']) => (
|
|
render: (status: TaskServerResponse['status']) => (
|
|
|
<Tag color={statusTagColor(status)}>{status.toUpperCase()}</Tag>
|
|
<Tag color={statusTagColor(status)}>{status.toUpperCase()}</Tag>
|
|
|
)
|
|
)
|
|
@@ -111,11 +115,13 @@ export const TaskServer: React.FC = () => {
|
|
|
title: t('Started'),
|
|
title: t('Started'),
|
|
|
dataIndex: ['result', 'taskStart'],
|
|
dataIndex: ['result', 'taskStart'],
|
|
|
key: 'started',
|
|
key: 'started',
|
|
|
|
|
+ width: '10%',
|
|
|
render: (text: TaskServerResult['taskStart']) => formatTimestamp(text)
|
|
render: (text: TaskServerResult['taskStart']) => formatTimestamp(text)
|
|
|
},
|
|
},
|
|
|
{
|
|
{
|
|
|
title: t('Duration'),
|
|
title: t('Duration'),
|
|
|
key: 'duration',
|
|
key: 'duration',
|
|
|
|
|
+ width: '10%',
|
|
|
render: (_, record: TaskServerResponse) => {
|
|
render: (_, record: TaskServerResponse) => {
|
|
|
if (record.result?.taskStart && record.result?.taskEnd) {
|
|
if (record.result?.taskStart && record.result?.taskEnd) {
|
|
|
return calculateDuration(record.result?.taskStart, record.result?.taskEnd);
|
|
return calculateDuration(record.result?.taskStart, record.result?.taskEnd);
|
|
@@ -195,9 +201,6 @@ export const TaskServer: React.FC = () => {
|
|
|
setSelectedTasks([]);
|
|
setSelectedTasks([]);
|
|
|
};
|
|
};
|
|
|
|
|
|
|
|
- const [ref, rect] = useResizeObserver();
|
|
|
|
|
- const tableBodyHeight = Math.max(rect.height - 40, 100);
|
|
|
|
|
-
|
|
|
|
|
return (
|
|
return (
|
|
|
<div className="hue-task-server">
|
|
<div className="hue-task-server">
|
|
|
<div className="hue-task-server__actions">
|
|
<div className="hue-task-server__actions">
|
|
@@ -232,20 +235,17 @@ export const TaskServer: React.FC = () => {
|
|
|
<span>{t('All')}</span>
|
|
<span>{t('All')}</span>
|
|
|
</Checkbox>
|
|
</Checkbox>
|
|
|
</div>
|
|
</div>
|
|
|
- <div className="hue-task-server__table" ref={ref}>
|
|
|
|
|
- <LoadingErrorWrapper loading={!tasks && loading} errors={errors}>
|
|
|
|
|
- <PaginatedTable<TaskServerResponse>
|
|
|
|
|
- onRowSelect={setSelectedTasks}
|
|
|
|
|
- columns={columns}
|
|
|
|
|
- data={filteredTasks}
|
|
|
|
|
- rowKey="taskId"
|
|
|
|
|
- scroll={{ y: tableBodyHeight }}
|
|
|
|
|
- locale={{
|
|
|
|
|
- emptyText: t('No tasks found')
|
|
|
|
|
- }}
|
|
|
|
|
- />
|
|
|
|
|
- </LoadingErrorWrapper>
|
|
|
|
|
- </div>
|
|
|
|
|
|
|
+ <LoadingErrorWrapper loading={false} errors={errors}>
|
|
|
|
|
+ <PaginatedTable<TaskServerResponse>
|
|
|
|
|
+ loading={!tasks && loading}
|
|
|
|
|
+ onRowSelect={setSelectedTasks}
|
|
|
|
|
+ columns={columns}
|
|
|
|
|
+ data={filteredTasks}
|
|
|
|
|
+ rowKey="taskId"
|
|
|
|
|
+ isDynamicHeight
|
|
|
|
|
+ locale={{ emptyText: t('No tasks found') }}
|
|
|
|
|
+ />
|
|
|
|
|
+ </LoadingErrorWrapper>
|
|
|
{showSchedulePopup && <ScheduleTaskModal onClose={() => showScheduleTaskPopup(false)} />}
|
|
{showSchedulePopup && <ScheduleTaskModal onClose={() => showScheduleTaskPopup(false)} />}
|
|
|
{!!selectedTaskId && (
|
|
{!!selectedTaskId && (
|
|
|
<TaskLogsModal taskId={selectedTaskId} onClose={() => setSelectedTaskId(null)} />
|
|
<TaskLogsModal taskId={selectedTaskId} onClose={() => setSelectedTaskId(null)} />
|