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

const ImportDataDiv = styled.div`
    .antd-EditorControl {
        min-height: 500px !important;
    }
`

const DataImport: React.FC = () => {
  const {knowledge_id} = useParams()
  return (
    <ImportDataDiv className="import-data h-full">
      {amisRender({
        type: 'page',
        title: {
          type: 'wrapper',
          size: 'none',
          body: [
            '数据导入 （知识库：',
            {
              type: 'service',
              className: 'inline',
              api: `${commonInfo.baseAiUrl}/knowledge/name?id=${knowledge_id}`,
              body: {
                type: 'tpl',
                tpl: '${name}',
              },
            },
            '）',
          ],
        },
        body: [
          [
            {
              className: 'h-full',
              type: 'grid',
              columns: [
                {
                  body: [
                    {
                      id: 'a5219cc7-72dd-4199-9eeb-61305fe41075',
                      type: 'form',
                      wrapWithPanel: false,
                      actions: [],
                      body: [
                        {
                          name: 'mode',
                          type: 'radios',
                          label: '解析模式',
                          value: 'NORMAL',
                          options: [
                            {
                              value: 'NORMAL',
                              label: '常规模式',
                            },
                            {
                              value: 'LLM',
                              label: '智能模式',
                            },
                            {
                              value: 'QA',
                              label: 'Q/A模式',
                            },
                          ],
                        },
                        {
                          name: 'type',
                          type: 'radios',
                          label: '数据形式',
                          value: 'file',
                          options: [
                            {
                              value: 'text',
                              label: '文本',
                            },
                            {
                              value: 'file',
                              label: '文件',
                            },
                          ],
                        },
                        {
                          visibleOn: 'type === \'text\'',
                          type: 'editor',
                          required: true,
                          label: '数据内容',
                          name: 'content',
                          language: 'plaintext',
                          options: {
                            lineNumbers: 'off',
                            wordWrap: 'bounded',
                          },
                        },
                        {
                          visibleOn: 'type === \'file\'',
                          type: 'input-file',
                          required: true,
                          name: 'files',
                          label: '数据文件',
                          autoUpload: false,
                          drag: true,
                          multiple: true,
                          accept: '*',
                          // 5MB 5242880
                          // 100MB 104857600
                          // 500MB 524288000
                          // 1GB 1073741824
                          maxSize: 104857600,
                          receiver: `${commonInfo.baseAiUrl}/upload`
                          // useChunk: true,
                          // startChunkApi: `post:${commonInfo.baseAiKnowledgeUrl}/upload/start`,
                          // chunkApi: `post:${commonInfo.baseAiKnowledgeUrl}/upload/slice`,
                          // finishChunkApi: `post:${commonInfo.baseAiKnowledgeUrl}/upload/finish`,
                        },
                        {
                          className: 'text-right',
                          type: 'button-toolbar',
                          buttons: [
                            {
                              type: 'reset',
                              label: '重置',
                            },
                            {
                              type: 'submit',
                              label: '预览',
                              actionType: 'ajax',
                              level: 'secondary',
                              api: {
                                method: 'post',
                                url: `${commonInfo.baseAiUrl}/knowledge/preview_text`,
                                dataType: 'form',
                                data: {
                                  mode: '${mode|default:undefined}',
                                  type: '${type|default:undefined}',
                                  content: '${content|default:undefined}',
                                  files: '${files|default:undefined}',
                                },
                              },
                              reload: 'preview_list?rows=${items}',
                            },
                            {
                              type: 'submit',
                              label: '提交',
                              level: 'primary',
                              actionType: 'ajax',
                              api: {
                                method: 'post',
                                url: `${commonInfo.baseAiUrl}/knowledge/submit_text`,
                                dataType: 'form',
                                data: {
                                  id: knowledge_id,
                                  mode: '${mode|default:undefined}',
                                  type: '${type|default:undefined}',
                                  content: '${content|default:undefined}',
                                  files: '${files|default:undefined}',
                                },
                              },
                            },
                          ],
                        },
                      ],
                    },
                  ],
                },
                {
                  body: [
                    {
                      className: 'h-full',
                      name: 'preview_list',
                      type: 'service',
                      body: [
                        {
                          type: 'tpl',
                          tpl: '文本分段预览',
                        },
                        {
                          type: 'crud',
                          mode: 'list',
                          source: '${rows}',
                          loadDataOnce: true,
                          syncLocation: false,
                          perPage: 20,
                          footerToolbar: [
                            {
                              type: 'pagination',
                              mode: 'normal',
                              layout: 'total,perPage,pager',
                            },
                          ],
                          listItem: {
                            body: {
                              className: 'white-space-pre-line',
                              type: 'tpl',
                              tpl: '${text}',
                            },
                          },
                        },
                      ],
                    },
                  ],
                },
              ],
            },
          ],
        ],
      })}
    </ImportDataDiv>
  )
}

export default DataImport