import NavBarNormal from "@/components/NavBarNormal/index";
import { View,Text, Image, Checkbox, Button } from "@tarojs/components";
import PageCustom from "@/components/page-custom/index";
import LogoImage from '@/images/logo.png'
import { useLogin } from '@/xiaolanbenlib/hooks/data/useAuth'
import WemetaRadio from "@/components/WemetaRadio";

import { useEffect, useState } from "react";

import Popup from "@/components/popup/popup";
import Taro from "@tarojs/taro";
import { navToWebView } from "@/utils/index";
import { getSysAgreements, type TAgreementItem } from "@/service/system";
import { isSuccess } from "@/utils";

interface IProps {
  showPopup: boolean
  setShowPopup: (b: boolean)=> void
  onEnd: ()=>void
}

export default function Index({showPopup, setShowPopup, onEnd}:IProps) {
  const { onGetPhoneNumber, onError, onClick, openType } = useLogin({
    onSuccess: () => {
      console.log('yes')
      setShowPopup(false)
      onEnd()
    },
  })
  const [checked, setChecked] = useState(false);

  const handleChecked = () => {
    setChecked(prev => !prev)
  }

  const [agreements, setAgreements] = useState<TAgreementItem[]>([])

  const fetchPageData = async () => {
    const response = await getSysAgreements('register')
    if(isSuccess(response.status)){
      setAgreements(response.data)
    }
  }

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

  return (
    <Popup setShow={setShowPopup} show={showPopup}>
      <View className="text-24 font-medium leading-32 text-black mb-16">欢迎来到小蓝本</View>
      <View className="text-gray-45 text-14 leading-22 mb-70">登录后享受更好的服务体验</View>
      <Button
        disabled={!checked}
        className="button-rounded-big mb-16"
        style={{backgroundColor: '#317CFA', fontSize: '14px'}}
        type='primary'
        openType={openType}
        onGetPhoneNumber={onGetPhoneNumber}
        onError={onError}
        onClick={() => {
          onClick()
        }}
      >
        手机号快捷登录
      </Button>
      <View className="flex items-center justify-center text-12 mb-86 text-center">
        <View className="flex-center text-gray-45 gap-8" onClick={handleChecked}><WemetaRadio checkbox checked={checked}></WemetaRadio>同意</View>
        {agreements.map(item=> <Text onClick={()=> navToWebView(item.link)} className="primary-color">《{item.name}》</Text>)}
      </View>
    </Popup>
  );
}
