import {useEffect, useState} from "react";
import Taro from '@tarojs/taro'
import {Button} from '@nutui/nutui-react-taro'
import {Target, Scan, Truck} from '@nutui/icons-react-taro'
import {getUserInfo} from "@/api/layout";
import navTo from "@/utils/common";

const ExpirationTime = () => {
  const [isAdmin, setIsAdmin] = useState<boolean>(false)
  const [roleName, setRoleName] = useState<string>()
  const onScanCode = () => {
    Taro.scanCode({
      onlyFromCamera: true,
      scanType: ['qrCode'],
      success: (res) => {
        console.log(res, 'qrcode...')
        Taro.navigateTo({url: '/hjm/query?id=' + res.result})
      },
      fail: (res) => {
        console.log(res, '扫码失败')
        Taro.showToast({
          title: '扫码失败',
          icon: 'none',
          duration: 2000
        })
      }
    })
  }

  const navToCarList = () => {
    if (isAdmin) {
      navTo('/hjm/list', true)
    }
  }

  useEffect(() => {
    getUserInfo().then((data) => {
      if (data) {
        if(data.certification){
          setIsAdmin( true)
        }
        data.roles?.map((item, index) => {
          if (index == 0) {
            setRoleName(item.roleCode)
          }
        })
      }
    })

  }, [])

  return (
    <div className={'mb-3 fixed top-36 z-20'} style={{width: '96%', marginLeft: '3%'}}>
      <div className={'w-full flex justify-around items-center py-3 rounded-lg'}>
        <>
          <Button size={'large'}
                  style={{background: 'linear-gradient(to right, #f3f2f7, #805de1)', borderColor: '#f3f2f7'}}
                  icon={<Truck/>} onClick={navToCarList}>车辆列表</Button>
          <Button size={'large'}
                  style={{background: 'linear-gradient(to right, #fffbe6, #ffc53d)', borderColor: '#f3f2f7'}}
                  icon={<Scan/>}
                  onClick={onScanCode}>扫一扫
          </Button>
        </>

        {
          roleName == 'youzheng' && <Button size={'large'} style={{
            background: 'linear-gradient(to right, #eaff8f, #7cb305)',
            borderColor: '#f3f2f7'
          }} icon={<Target/>} onClick={() => Taro.navigateTo({url: '/hjm/fence'})}>电子围栏</Button>
        }

        {
          roleName == 'kuaidiyuan' && <Button size={'large'} style={{
            background: 'linear-gradient(to right, #ffa39e, #ff4d4f)',
            borderColor: '#f3f2f7'
          }} icon={<Target/>} onClick={() => Taro.navigateTo({url: '/hjm/bx/bx-add'})}>一键报险</Button>
        }
      </div>
    </div>
  )
}
export default ExpirationTime