import {Headphones, Share} from '@nutui/icons-react-taro'
import navTo from "@/utils/common";
import Taro, { getCurrentInstance } from '@tarojs/taro';
import {getUserInfo} from "@/api/layout";
import {useEffect, useState} from "react";
import {getCmsArticle} from "@/api/cms/cmsArticle";
import {CmsArticle} from "@/api/cms/cmsArticle/model";

function AddCartBar() {
  const { router } = getCurrentInstance();
  const [id, setId] = useState<number>()
  const [article, setArticle] = useState<CmsArticle>()
  const [IsLogin, setIsLogin] = useState<boolean>(false)
  const onPay = () => {
    if (!IsLogin) {
      Taro.showToast({title: `请先登录`, icon: 'error'})
      setTimeout(() => {
        Taro.switchTab(
          {
            url: '/pages/user/user',
          },
        )
      }, 1000)
      return false;
    }
    if (article?.model == 'bm') {
      navTo('/bszx/bm/bm?id=' + id)
    }
    if (article?.model == 'pay') {
      navTo('/bszx/pay/pay?id=' + id)
    }
  }
  const reload = (id: number) => {
    getCmsArticle(id).then(data => {
      setArticle(data)
    })
    getUserInfo().then((data) => {
      if (data) {
        setIsLogin(true);
        Taro.setStorageSync('UserId', data.userId)
      }
    }).catch(() => {
      console.log('未登录')
    });
  }

  useEffect(() => {
    const id = router?.params.id as number | undefined;
    setId(id)
    reload(Number(id));
  }, []);

  return (
    <div className={'flex justify-between items-center w-full fixed bottom-0 bg-gray-100 pb-5'}>
      <div className={'btn flex px-5 items-center gap-4'}>
        <button className={'item px-4 py-1 bg-white flex items-center gap-2 text-nowrap whitespace-nowrap'} open-type="contact">
          <Headphones size={16}/>咨询
        </button>
        <button className={'item px-4 py-1 bg-white flex items-center gap-2 text-nowrap whitespace-nowrap'} open-type="share"><Share
          size={16}/>分享
        </button>
      </div>
      <div className={'bg-red-500 py-3 px-10 text-white'} style={{ whiteSpace: 'nowrap'}}
           onClick={onPay}>{article?.model == 'pay' ? '我要捐款' : '我要报名'}</div>
    </div>
  )
}

// 监听页面分享事件
export default AddCartBar