import React, { useCallback, useEffect } from 'react'
import styles from './index.module.scss'
import { Button, Modal } from 'antd'
import { B2_APIgetInfo } from '@/store/action/B2exhiLog'

type Props = {
  sId: number
  closeFu: () => void
}

const arr = [
  {
    id: 1,
    name: '啊萨达萨达是',
    phone: '18702025050',
    identity: '421083199504071212'
  },
  {
    id: 2,
    name: '王大锤',
    phone: '18702025050',
    identity: '421083199504071212'
  },
  {
    id: 3,
    name: '小溺😥',
    phone: '18702025050',
    identity: '421083199504071212'
  }
]

function B2look({ sId, closeFu }: Props) {
  const getInfoFu = useCallback(async (id: number) => {
    const res = await B2_APIgetInfo(id)
    if (res.code === 0) {
      // 待完善 接口数据不明确
      console.log(123, res)
    }
  }, [])

  useEffect(() => {
    getInfoFu(sId)
  }, [getInfoFu, sId])

  return (
    <Modal
      wrapClassName={styles.B2look}
      open={true}
      title='查看'
      footer={
        [] // 设置footer为空，去掉 取消 确定默认按钮
      }
    >
      <div className='B2row'>
        <div className='B2box'>
          <div className='B2boxll'>申请时间：</div>
          <div className='B2boxrr'>2024-10-30 09:59:05</div>
        </div>
        {/* 待完善 */}
        {/* <div className='B2box'>验证状态：</div> */}
        <div className='B2box'>
          <div className='B2boxll'>预约日期：</div>
          <div className='B2boxrr'>2024-10-30</div>
        </div>

        <div className='B2box'>
          <div className='B2boxll'>预约时段：</div>
          <div className='B2boxrr'>08:00-09:00</div>
        </div>
        <br />
      </div>

      {arr.map(item => (
        <div className='B2row' key={item.id}>
          <div className='B2box'>
            <div className='B2boxll'>参观人姓名：</div>
            <div className='B2boxrr'>{item.name}</div>
          </div>
          <div className='B2box'>
            <div className='B2boxll'>参观人电话：</div>
            <div className='B2boxrr'>{item.phone}</div>
          </div>
          <div className='B2box'>
            <div className='B2boxll'>身份证号：</div>
            <div className='B2boxrr'>{item.identity}</div>
          </div>
        </div>
      ))}

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

const MemoB2look = React.memo(B2look)

export default MemoB2look
