import React, { useCallback, useEffect, useState } from 'react'
import styles from './index.module.scss'
import { Button, Modal } from 'antd'
import MyTable from '@/components/MyTable'
import { D4API_downloadLog } from '@/store/action/Dmanage/D4resource'
import { MessageFu } from '@/utils/message'

type Props = {
  ids: number[]
  closeFu: () => void
}

function ResourceDownLog({ closeFu, ids }: Props) {
  const [list, setList] = useState<any[]>([])

  const getList = useCallback(async () => {
    if (!ids.length) {
      MessageFu.warning('暂无藏品')
      return
    }
    const res = await D4API_downloadLog(ids)
    if (res.code === 0) {
      setList(res.data || [])
    }
  }, [ids])

  useEffect(() => {
    getList()
  }, [getList])

  return (
    <Modal wrapClassName={styles.ResourceDownLog} title='下载记录' open={true} footer={[]}>
      <MyTable
        yHeight={500}
        classKey='ResourceDownLog'
        list={list}
        columnsTemp={[
          ['txt', '藏品登记号', 'joinNum'],
          ['txt', '藏品名称', 'joinName'],
          ['txt', '下载人员', 'creatorName'],
          ['txt', '下载时间', 'createTime']
        ]}
        pagingInfo={false}
      />

      <div className='ResourceDownLogBtn'>
        <Button onClick={closeFu}>关闭</Button>
      </div>
    </Modal>
  )
}

const MemoResourceDownLog = React.memo(ResourceDownLog)

export default MemoResourceDownLog
