import React, {useState, useEffect, useCallback} from 'react'
import {View, Text, ScrollView} from '@tarojs/components'
import {Empty, Tag, PullToRefresh, Loading} from '@nutui/nutui-react-taro'
import Taro from '@tarojs/taro'
import {pageShopDealerOrder} from '@/api/shop/shopDealerOrder'
import {useDealerUser} from '@/hooks/useDealerUser'
import type {ShopDealerOrder} from '@/api/shop/shopDealerOrder/model'

interface OrderWithDetails extends ShopDealerOrder {
  orderNo?: string
  customerName?: string
  userCommission?: string
}

const DealerOrders: React.FC = () => {
  const [loading, setLoading] = useState<boolean>(false)
  const [refreshing, setRefreshing] = useState<boolean>(false)
  const [loadingMore, setLoadingMore] = useState<boolean>(false)
  const [orders, setOrders] = useState<OrderWithDetails[]>([])
  const [currentPage, setCurrentPage] = useState<number>(1)
  const [hasMore, setHasMore] = useState<boolean>(true)

  const {dealerUser} = useDealerUser()

  // 获取订单数据
  const fetchOrders = useCallback(async (page: number = 1, isRefresh: boolean = false) => {
    // 需要当前登录用户ID（用于 resourceId 参数）
    if (!dealerUser || !dealerUser.userId) return

    try {
      if (isRefresh) {
        setRefreshing(true)
      } else if (page === 1) {
        setLoading(true)
      } else {
        setLoadingMore(true)
      }

      const result = await pageShopDealerOrder({
        page,
        limit: 10,
        // 后端需要 resourceId=当前登录用户ID 才能正确过滤分销订单
        resourceId: dealerUser.userId
      })

      if (result?.list) {
        const newOrders = result.list.map(order => ({
          ...order,
          // 优先使用接口返回的订单号；没有则降级展示 orderId
          orderNo: order.orderNo ?? (order.orderId != null ? String(order.orderId) : undefined),
          customerName: `${order.nickname}${order.userId}`,
          userCommission: order.firstMoney || '0.00'
        }))

        if (page === 1) {
          setOrders(newOrders)
        } else {
          setOrders(prev => [...prev, ...newOrders])
        }

        setHasMore(newOrders.length === 10)
        setCurrentPage(page)
      }

    } catch (error) {
      console.error('获取分销订单失败:', error)
      Taro.showToast({
        title: '获取订单失败',
        icon: 'error'
      })
    } finally {
      setLoading(false)
      setRefreshing(false)
      setLoadingMore(false)
    }
  }, [dealerUser?.userId])

  // 下拉刷新
  const handleRefresh = async () => {
    await fetchOrders(1, true)
  }

  // 加载更多
  const handleLoadMore = async () => {
    if (!loadingMore && hasMore) {
      await fetchOrders(currentPage + 1)
    }
  }

  // 初始化加载数据
  useEffect(() => {
    if (dealerUser?.userId) {
      fetchOrders(1)
    }
  }, [fetchOrders])

  const getStatusText = (isSettled?: number, isInvalid?: number, isUnfreeze?: number, orderStatus?: number) => {
    if (orderStatus === 2 || orderStatus === 5 || orderStatus === 6) return '已取消'
    if (isInvalid === 1) return '已失效'
    if (isUnfreeze === 1) return '已解冻'
    if (isSettled === 1) return '已结算'
    return '待结算'
  }

  const getStatusColor = (isSettled?: number, isInvalid?: number, isUnfreeze?: number, orderStatus?: number) => {
    if (orderStatus === 2 || orderStatus === 5 || orderStatus === 6) return 'default'
    if (isInvalid === 1) return 'danger'
    if (isUnfreeze === 1) return 'success'
    if (isSettled === 1) return 'info'
    return 'warning'
  }

  const handleGoCapital = () => {
    Taro.navigateTo({url: '/dealer/capital/index'})
  }

  const renderOrderItem = (order: OrderWithDetails) => (
    <View
      key={order.id}
      className="bg-white rounded-lg p-4 mb-3 shadow-sm"
      onClick={handleGoCapital}
    >
      <View className="flex justify-between items-start mb-1">
        <Text className="font-semibold text-gray-800">
          订单号：{order.orderNo || '-'}
        </Text>
        <Tag type={getStatusColor(order.isSettled, order.isInvalid, order.isUnfreeze,order.orderStatus)}>
          {getStatusText(order.isSettled, order.isInvalid, order.isUnfreeze,order.orderStatus)}
        </Tag>
      </View>

      {/*<View className="flex justify-between items-center mb-1">*/}
      {/*  <Text className="text-sm text-gray-400">*/}
      {/*    订单金额：¥{order.orderPrice || '0.00'}*/}
      {/*  </Text>*/}
      {/*</View>*/}

      <View className="flex justify-between items-center">
        <Text className="text-sm text-gray-400">
          {order.createTime}
        </Text>
        <Text className="text-sm text-gray-400">
          订单金额：¥{order.orderPrice || '0.00'}
        </Text>
      </View>
    </View>
  )

  if (!dealerUser) {
    return (
      <View className="bg-gray-50 min-h-screen flex items-center justify-center">
        <Loading/>
        <Text className="text-gray-500 mt-2">加载中...</Text>
      </View>
    )
  }

  return (
    <View className="min-h-screen bg-gray-50">
      <PullToRefresh
        onRefresh={handleRefresh}
        disabled={refreshing}
        pullingText="下拉刷新"
        canReleaseText="释放刷新"
        refreshingText="刷新中..."
        completeText="刷新完成"
      >
        <ScrollView
          scrollY
          className="h-screen"
          onScrollToLower={handleLoadMore}
          lowerThreshold={50}
        >
          <View className="p-4">
            {loading && orders.length === 0 ? (
              <View className="text-center py-8">
                <Loading/>
                <Text className="text-gray-500 mt-2">加载中...</Text>
              </View>
            ) : orders.length > 0 ? (
              <>
                {orders.map(renderOrderItem)}
                {loadingMore && (
                  <View className="text-center py-4">
                    <Loading/>
                    <Text className="text-gray-500 mt-1 text-sm">加载更多...</Text>
                  </View>
                )}
                {!hasMore && orders.length > 0 && (
                  <View className="text-center py-4">
                    <Text className="text-gray-400 text-sm">没有更多数据了</Text>
                  </View>
                )}
              </>
            ) : (
              <Empty description="暂无分销订单"/>
            )}
          </View>
        </ScrollView>
      </PullToRefresh>
    </View>
  )
}

export default DealerOrders