import './pay-cert.scss'
import {useEffect, useState} from "react";
import {useRouter} from '@tarojs/taro'
import Taro from '@tarojs/taro'
import {getPayCert} from "@/api/bszx/bszxPay";
import {ConfigProvider, Loading} from "@nutui/nutui-react-taro";

function PayCert() {
  const {params} = useRouter();
  const [poster, setPoster] = useState<string>('')
  const [loading, setLoading] = useState<boolean>(true)

  const generatePayCert = () => {
    if (process.env.NODE_ENV === 'development') {
      // setPoster("https://oss.wsdns.cn/20250304/8a9aac182ac94494a806c4bda5766fee.png")
    }
    // 保存到临时地址
    Taro.downloadFile({
      url: poster,
      success: function (res) {
        Taro.saveImageToPhotosAlbum({
          filePath: res.tempFilePath,
          success: function () {
            Taro.showToast({
              title: '保存成功',
              icon: 'success',
              duration: 2000
            });
          },
          fail: function (err) {
            if (err.errMsg === 'saveImageToPhotosAlbum:fail auth deny') {
            }
          }
        })
      }
    })
  }

  const reload = () => {
    if (params.id) {
      getPayCert(Number(params.id)).then(img => {
        console.log(img, 'img....')
        setPoster(`${img}`)
        setTimeout(() => {
          setLoading(false)
        },1000)
        if (process.env.NODE_ENV === 'development') {
          // setPoster("https://oss.wsdns.cn/20250304/8a9aac182ac94494a806c4bda5766fee.png")
        }
      })
    }
  }
  useEffect(() => {
    reload()
  }, []);
  return (
    <>
      {loading ?
        <div className={'bg-white w-full flex justify-center items-center'} style={{height: '100vh'}}>
          <ConfigProvider theme={{nutuiLoadingIconSize: '28px'}}>
            <Loading type="spinner">加载中</Loading>
          </ConfigProvider>
        </div> :

        <div className={'flex justify-center'}>
          <img src={poster} width={'750rpx'} height={'1060rpx'}/>
          <div className={'fixed bottom-10'}>
            {/*<Button />*/}
            <button
              className={'item px-20 py-3 bg-yellow-300 text-black flex items-center gap-2 text-nowrap whitespace-nowrap'}
              onClick={() => {
                generatePayCert()
              }}>
              保存到相册
            </button>
          </div>
        </div>
      }
    </>

  )
}

export default PayCert;
