import React, { useCallback, useState } from 'react'
import styles from './index.module.scss'
import TopCom from '@/components/TopCom'

import topImg from '@/assets/img/team/top.png'
import history from '@/utils/history'
import ZinfoPop from '@/components/ZinfoPop'
import { A4_APIcheck } from '@/store/action/all'

function A7team() {
  const toFromFu = useCallback(async (can?: string) => {
    const res = await A4_APIcheck()

    if (res.code === 0) {
      // 0：未认证 | 1：已认证 | 2：认证中

      if (res.data === 1) {
        setTitPop({
          txt1: '您已完成认证',
          txt2: '无需重复申请'
        })
      } else if (res.data === 2) {
        setTitPop({
          txt1: '申请审核中',
          txt2: '请勿重复申请'
        })
      } else if (res.data === 0) {
        if (can) history.push(`/proof/${can}`)
        else history.push(`/codeAuth`)
      }
    }
  }, [])

  // 打开提示弹窗
  const [titPop, setTitPop] = useState({
    txt1: '',
    txt2: ''
  })

  return (
    <div className={styles.A7team}>
      <TopCom txt='选择认证方式' />
      <div className='A7main'>
        <img src={topImg} alt='' />
        <div className='A7tit'>请选择认证方式</div>

        <div className='A7dan1' onClick={() => toFromFu('live')}>
          <div>申请认证</div>
        </div>
        <div className='A7dan1' onClick={() => toFromFu()}>
          <div className='A7dan1_1'>邀请码认证</div>
        </div>
      </div>
      {/* 提示的弹窗 */}
      {titPop.txt1 ? (
        <ZinfoPop
          txt1={titPop.txt1}
          txt2={titPop.txt2}
          type='info'
          callFu={() => setTitPop({ txt1: '', txt2: '' })}
        />
      ) : null}
    </div>
  )
}

const MemoA7team = React.memo(A7team)

export default MemoA7team