import React, { useEffect, useState } from "react";
import Warrant from '../warrant'
import AuthLogin from '../authLogin'

type Props = {
    onClose: () => void,    // 关闭清除value
    onChange: () => void,   // 扫码成功
    value: {
        base64: string,
        code: string
    },
    isUpdataAcc?: boolean,  /** 是否是更新账户 */
}

/**
 * 授权登录  首次授权 二次授权
 * @returns 
 */
function AdLogin(props: Props) {
    let { value, isUpdataAcc = false, onClose, onChange } = props
    const [warrant, setWarrant] = useState<boolean>(false)  //授权弹窗控制
    const [authShow, setAuthShow] = useState<boolean>(false)  // 授权弹窗登录
    useEffect(() => {
        if (value && value.code) {
            if (value.base64) { // 二次
                setAuthShow(() => true)
            } else {  // 首次授权
                setWarrant(() => true)
            }
        }
    }, [value])
    return <div>
        {/* 首次授权登录 */}
        {warrant && <Warrant show={warrant} onClose={() => { onClose && onClose(); setWarrant(false); }} isUpdataAcc={isUpdataAcc} onChange={() => { onChange && onChange(); setWarrant(false);  }}></Warrant>}
        {/* 不是首次授权登录 */}
        {authShow && <AuthLogin show={authShow} onClose={() => { onClose && onClose(); setAuthShow(false); }} data={value} onChange={() => { onChange && onChange(); setAuthShow(false) }} />}
    </div>
}

export default React.memo(AdLogin)