import React from 'react'
import Taro from '@tarojs/taro'
import {View, Text} from '@tarojs/components'
import {Avatar, Button} from '@nutui/nutui-react-taro'
import {User} from '@nutui/icons-react-taro'
import {useThemeStyles} from '@/hooks/useTheme'
import {useUser} from '@/hooks/useUser'

const RiderIndex: React.FC = () => {
  const themeStyles = useThemeStyles()
  const {isLoggedIn, loading: userLoading, getAvatarUrl, getDisplayName} = useUser()

  if (!isLoggedIn && !userLoading) {
    return (
      <View className="bg-gray-100 min-h-screen p-4">
        <View className="bg-white rounded-xl p-4">
          <Text className="text-gray-700">请先登录后再进入骑手中心</Text>
          <View className="mt-3">
            <Button type="primary" onClick={() => Taro.navigateTo({url: '/passport/login'})}>
              去登录
            </Button>
          </View>
        </View>
      </View>
    )
  }

  return (
    <View className="bg-gray-100 min-h-screen">
      <View className="px-4 py-6 relative overflow-hidden" style={themeStyles.primaryBackground}>
        <View className="flex items-center justify-between relative z-10">
          <Avatar
            size="50"
            src={getAvatarUrl()}
            icon={<User />}
            className="mr-4"
            style={{border: '2px solid rgba(255, 255, 255, 0.3)'}}
          />
          <View className="flex-1 flex-col">
            <View className="text-white text-lg font-bold mb-1">{getDisplayName()}</View>
            <View className="text-sm" style={{color: 'rgba(255, 255, 255, 0.8)'}}>
              骑手中心
            </View>
          </View>
        </View>
      </View>

      <View className="p-4">
        <View className="bg-white rounded-xl p-4">
          <Text className="text-gray-800 font-semibold">常用功能</Text>
          <View className="mt-3">
            <Button type="primary" block onClick={() => Taro.navigateTo({url: '/rider/orders/index'})}>
              我的配送订单
            </Button>
          </View>
        </View>
      </View>
    </View>
  )
}

export default RiderIndex

