160 lines
4.9 KiB
TypeScript
160 lines
4.9 KiB
TypeScript
import React from 'react'
|
||
import {
|
||
amisRender,
|
||
commonInfo,
|
||
crudCommonOptions,
|
||
horizontalFormOptions,
|
||
paginationTemplate,
|
||
remoteMappings,
|
||
remoteOptions,
|
||
time,
|
||
} from '../../util/amis.tsx'
|
||
import {useNavigate} from 'react-router'
|
||
|
||
function TaskList() {
|
||
const navigate = useNavigate()
|
||
return (
|
||
<div className="task-list">
|
||
{amisRender(
|
||
{
|
||
type: 'page',
|
||
title: '任务列表',
|
||
body: [
|
||
{
|
||
type: 'crud',
|
||
api: {
|
||
method: 'post',
|
||
url: `${commonInfo.baseUrl}/task/list`,
|
||
data: {
|
||
page: {
|
||
index: '${page}',
|
||
size: '${perPage}',
|
||
},
|
||
},
|
||
},
|
||
interval: 30000,
|
||
...crudCommonOptions(),
|
||
...paginationTemplate(
|
||
15,
|
||
undefined,
|
||
[
|
||
{
|
||
type: 'action',
|
||
label: '',
|
||
icon: 'fa fa-plus',
|
||
actionType: 'dialog',
|
||
dialog: {
|
||
title: '创建任务',
|
||
body: {
|
||
type: 'form',
|
||
api: {
|
||
method: 'post',
|
||
url: `${commonInfo.baseUrl}/task/execute`,
|
||
data: {
|
||
templateId: '${templateId|default:undefined}',
|
||
},
|
||
},
|
||
...horizontalFormOptions(),
|
||
body: [
|
||
{
|
||
name: 'templateId',
|
||
label: '名称',
|
||
required: true,
|
||
selectFirst: true,
|
||
...remoteOptions('select', 'task_template_id'),
|
||
},
|
||
],
|
||
},
|
||
},
|
||
},
|
||
],
|
||
),
|
||
columns: [
|
||
{
|
||
name: 'name',
|
||
label: '简称',
|
||
width: 150,
|
||
},
|
||
{
|
||
name: 'description',
|
||
label: '描述',
|
||
},
|
||
{
|
||
name: 'status',
|
||
label: '状态',
|
||
align: 'center',
|
||
width: 100,
|
||
...remoteMappings('task_status', 'status'),
|
||
},
|
||
{
|
||
label: '进度',
|
||
type: 'progress',
|
||
width: 200,
|
||
value: '${ROUND(step * 100, 0)}',
|
||
},
|
||
{
|
||
label: '耗时',
|
||
type: 'tpl',
|
||
align: 'center',
|
||
width: 150,
|
||
tpl: "${IF(costText, costText, '/')}",
|
||
},
|
||
{
|
||
name: 'launchedTime',
|
||
label: '启动时间',
|
||
width: 150,
|
||
align: 'center',
|
||
...time('launchedTime'),
|
||
},
|
||
{
|
||
name: 'finishedTime',
|
||
label: '结束时间',
|
||
width: 150,
|
||
align: 'center',
|
||
...time('finishedTime'),
|
||
},
|
||
{
|
||
type: 'operation',
|
||
label: '操作',
|
||
width: 100,
|
||
buttons: [
|
||
{
|
||
type: 'action',
|
||
label: '详情',
|
||
level: 'link',
|
||
onEvent: {
|
||
click: {
|
||
actions: [
|
||
{
|
||
actionType: 'custom',
|
||
// @ts-ignore
|
||
script: (context, action, event) => {
|
||
navigate(`/task/detail/${context.props.data['id']}`)
|
||
},
|
||
},
|
||
],
|
||
},
|
||
},
|
||
},
|
||
{
|
||
className: 'text-danger btn-deleted',
|
||
type: 'action',
|
||
label: '删除',
|
||
level: 'link',
|
||
actionType: 'ajax',
|
||
api: `get:${commonInfo.baseUrl}/task/remove/\${id}`,
|
||
confirmText: '确认删除任务记录<span class="text-lg font-bold mx-2">${name}</span>？',
|
||
confirmTitle: '删除',
|
||
},
|
||
],
|
||
},
|
||
],
|
||
},
|
||
],
|
||
},
|
||
)}
|
||
</div>
|
||
)
|
||
}
|
||
|
||
export default React.memo(TaskList) |