import React from 'react'
import {useNavigate} from 'react-router'
import {
  amisRender,
  commonInfo,
  crudCommonOptions,
  mappingField,
  mappingItem,
  paginationTemplate,
  readOnlyDialogOptions,
} from '../../../util/amis.tsx'
import {generateInputForm} from './InputSchema.tsx'

const statusMapping = [
  mappingItem('完成', 'FINISHED', 'label-success'),
  mappingItem('执行中', 'RUNNING', 'label-warning'),
  mappingItem('错误', 'ERROR', 'label-danger'),
]

const FlowTask: React.FC = () => {
  const navigate = useNavigate()
  return (
    <div className="task-template">
      {amisRender(
        {
          type: 'page',
          title: '任务记录',
          body: [
            {
              type: 'crud',
              api: {
                method: 'post',
                url: `${commonInfo.baseAiUrl}/flow_task/list`,
                data: {
                  page: {
                    index: '${page}',
                    size: '${perPage}',
                  },
                },
              },
              ...crudCommonOptions(),
              ...paginationTemplate(
                10,
                5,
                [
                  {
                    type: 'action',
                    label: '',
                    icon: 'fa fa-plus',
                    size: 'sm',
                    onEvent: {
                      click: {
                        actions: [
                          {
                            actionType: 'custom',
                            // @ts-ignore
                            script: (context, action, event) => {
                              navigate(`/ai/flow_task/add`)
                            },
                          },
                        ],
                      },
                    },
                  },
                ],
              ),
              columns: [
                {
                  name: 'id',
                  label: '任务ID',
                  width: 200,
                },
                {
                  name: 'templateName',
                  label: '模板',
                },
                {
                  name: 'status',
                  label: '状态',
                  width: 50,
                  align: 'center',
                  ...mappingField('status', statusMapping),
                },
                {
                  type: 'operation',
                  label: '操作',
                  width: 200,
                  buttons: [
                    {
                      type: 'action',
                      label: '查看',
                      level: 'link',
                      size: 'sm',
                      actionType: 'dialog',
                      dialog: {
                        title: '查看',
                        size: 'md',
                        ...readOnlyDialogOptions(),
                        body: [
                          {
                            type: 'service',
                            schemaApi: {
                              method: 'get',
                              url: `${commonInfo.baseAiUrl}/flow_task/template/input_schema/\${templateId}`,
                              // @ts-ignore
                              adaptor: (payload, response, api, context) => {
                                return {
                                  ...payload,
                                  data: {
                                    ...generateInputForm(payload.data, undefined, false),
                                    id: 'db8a4d10-0c47-4e27-b1a4-d0f2e1c15992',
                                    initApi: {
                                      method: 'get',
                                      url: `${commonInfo.baseAiUrl}/flow_task/input_data/\${id}`,
                                      // @ts-ignore
                                      adaptor: (payload, response, api, context) => {
                                        return {
                                          ...payload,
                                          data: {
                                            inputData: payload.data,
                                          }
                                        }
                                      }
                                    },
                                    static: true,
                                  },
                                }
                              },
                            },
                          },
                        ],
                      },
                    },
                    {
                      type: 'action',
                      label: '重新执行',
                      level: 'link',
                      size: 'sm',
                    },
                    {
                      type: 'action',
                      label: '删除',
                      className: 'text-danger btn-deleted',
                      level: 'link',
                      size: 'sm',
                      actionType: 'ajax',
                      api: `get:${commonInfo.baseAiUrl}/task/remove/\${id}`,
                      confirmText: '确认删除任务记录：${name}',
                      confirmTitle: '删除',
                    },
                  ],
                },
              ],
            },
          ],
        },
      )}
    </div>
  )
}

export default FlowTask