import { View } from "@tarojs/components";
import Taro from "@tarojs/taro";
import { useEffect } from "react";
import Popup from '@/components/popup/popup/index'
import { useAppStore } from "@/store/appStore";
import { useUserStore } from "@/store/userStore";

import AuthPhone from '@/components/auth-phone/index'
import { useRouter } from "@tarojs/taro";
import { EBindKind } from "@/consts/enum";

const Index = () => {
  const router = useRouter();
  const { from } = router.params;
  // from ==='douya'
  const authPhonePopupVisible = useAppStore((state)=> state.authPhonePopupVisible)
  const user = useUserStore((state) => state.user);
  // 全局控制显示 vip 提示
  const {setAuthPhoneVisible} = useAppStore()

  const handleGetPhoneNumber = async (
    phone: string
  ) => {
    if(phone?.length){
      setAuthPhoneVisible(false)
      Taro.showToast({
        title: '绑定成功'
      })
      return
    }
    Taro.showToast({
      title: '绑定失败'
    })
  };


  

  useEffect(()=> {
    // 已经登录
    // 如果是豆芽部落跳回来且没有手机号则显示绑定提示
    const logined = user?.id !== undefined
    const phone = user?.phone ?? ''
    const phoneUnauth = phone.length < 1
    const isFromDouya = from ==='douya'
    if(logined && phoneUnauth && isFromDouya){
      setAuthPhoneVisible(true)
    }
  }, [user])

  return (
    <View >
      {/* 豆芽达人数据同步 */}
      <Popup title="绑定手机号，即可创建完成AI助理" setShow={setAuthPhoneVisible} show={authPhonePopupVisible}>
        <View className="py-40">
          <View className="button-rounded-big">
            <AuthPhone bindKind={EBindKind.WechatPhone} getPhoneNumber={handleGetPhoneNumber} contentStyle={{color: '#333'}} text='绑定手机号'></AuthPhone>
          </View>
        </View>
      </Popup>
    </View>
  );
};

export default Index;
