import {Cell} from '@nutui/nutui-react-taro'
import navTo from "@/utils/common";
import Taro from '@tarojs/taro'
import {View, Text} from '@tarojs/components'
import {ArrowRight, ShieldCheck, LogisticsError, Location, Tips, Ask} from '@nutui/icons-react-taro'
import {useUser} from '@/hooks/useUser'

const UserCell = () => {
  const {logoutUser, isCertified} = useUser();

  const onLogout = () => {
    Taro.showModal({
      title: '提示',
      content: '确定要退出登录吗？',
      success: function (res) {
        if (res.confirm) {
          // 使用 useUser hook 的 logoutUser 方法
          logoutUser();
          Taro.reLaunch({
            url: '/pages/index/index'
          })
        }
      }
    })
  }

  return (
    <>
      <View className={'px-4'}>

        <Cell.Group divider={true} description={
          <View style={{display: 'inline-flex', alignItems: 'center'}}>
            <Text style={{marginTop: '12px'}}>我的服务</Text>
          </View>
        }>
          <Cell
            className="nutui-cell-clickable"
            style={{
              display: 'none'
            }}
            title={
              <View style={{display: 'inline-flex', alignItems: 'center'}}>
                <LogisticsError size={16}/>
                <Text className={'pl-3 text-sm'}>我的钱包</Text>
              </View>
            }
            align="center"
            extra={<ArrowRight color="#cccccc" size={18}/>}
            onClick={() => {
              navTo('/user/wallet/index', true)
            }}
          />
          <Cell
            className="nutui-cell-clickable"
            title={
              <View style={{display: 'inline-flex', alignItems: 'center'}}>
                <Location size={16}/>
                <Text className={'pl-3 text-sm'}>收货地址</Text>
              </View>
            }
            align="center"
            extra={<ArrowRight color="#cccccc" size={18}/>}
            onClick={() => {
              navTo('/user/address/index', true)
            }}
          />
          <Cell
            className="nutui-cell-clickable"
            title={
              <View style={{display: 'inline-flex', alignItems: 'center'}}>
                <ShieldCheck size={16} color={isCertified() ? '#52c41a' : '#666'}/>
                <Text className={'pl-3 text-sm'}>实名认证</Text>
                {isCertified() && (
                  <Text className={'pl-2 text-xs text-green-500'}>已认证</Text>
                )}
              </View>
            }
            align="center"
            extra={<ArrowRight color="#cccccc" size={18}/>}
            onClick={() => {
              navTo('/user/userVerify/index', true)
            }}
          />
          <Cell
            className="nutui-cell-clickable"
            title={
              <View style={{display: 'inline-flex', alignItems: 'center'}}>
                <Ask size={16}/>
                <Text className={'pl-3 text-sm'}>常见问题</Text>
              </View>
            }
            align="center"
            extra={<ArrowRight color="#cccccc" size={18}/>}
            onClick={() => {
              navTo('/user/help/index')
            }}
          />
          <Cell
            className="nutui-cell-clickable"
            title={
              <View style={{display: 'inline-flex', alignItems: 'center'}}>
                <Tips size={16}/>
                <Text className={'pl-3 text-sm'}>关于我们</Text>
              </View>
            }
            align="center"
            extra={<ArrowRight color="#cccccc" size={18}/>}
            onClick={() => {
              navTo('/user/about/index')
            }}
          />
        </Cell.Group>
        <Cell.Group divider={true} description={
          <View style={{display: 'inline-flex', alignItems: 'center'}}>
            <Text style={{marginTop: '12px'}}>账号管理</Text>
          </View>
        }>
          <Cell
            className="nutui-cell-clickable"
            title="账号安全"
            align="center"
            extra={<ArrowRight color="#cccccc" size={18}/>}
            onClick={() => navTo('/user/profile/profile', true)}
          />
          <Cell
            className="nutui-cell-clickable"
            title="切换主题"
            align="center"
            extra={<ArrowRight color="#cccccc" size={18}/>}
            onClick={() => navTo('/user/theme/index', true)}
          />
          <Cell
            className="nutui-cell-clickable"
            title="退出登录"
            align="center"
            extra={<ArrowRight color="#cccccc" size={18}/>}
            onClick={onLogout}
          />
        </Cell.Group>
      </View>
    </>
  )
}
export default UserCell