import React from 'react'
import {useParams} from 'react-router'
import {amisRender, commonInfo, remoteMappings, time} from '../../util/amis.tsx'

function TaskDetail() {
  const {id} = useParams()
  return (
    <div className="task-detail">
      {amisRender(
        {
          type: 'page',
          title: '任务详情',
          initApi: `get:${commonInfo.baseUrl}/task/detail/${id}`,
          body: [
            {
              type: 'property',
              items: [
                {label: '名称', content: '${name}'},
                {label: '描述', content: '${description}', span: 2},
                {
                  label: '状态',
                  content: {
                    value: '${status}',
                    ...remoteMappings('task_status', 'status'),
                  },
                },
                {
                  label: '进度',
                  content: {
                    type: 'tpl',
                    tpl: "${ROUND(step * 100, 2)}%",
                  },
                  span: 2,
                },
                {
                  label: '耗时',
                  content: {
                    type: 'tpl',
                    tpl: "${IF(costText, costText, '/')}",
                  },
                },
                {label: '启动时间', content: time('launchedTime')},
                {label: '结束时间', content: time('finishedTime')},
              ],
            },
            {type: 'divider'},
            {
              type: 'form',
              wrapWithPanel: false,
              body: [
                {
                  visibleOn: 'error',
                  type: 'editor',
                  name: 'error',
                  label: '错误信息',
                },
                {
                  visibleOn: 'result',
                  type: 'markdown-enhance',
                  name: 'result',
                  label: '结果',
                  content: '${result}',
                },
              ],
            },
          ],
        },
      )}
    </div>
  )
}

export default React.memo(TaskDetail)