import {useEffect, useRef} from 'react'
import {PullToRefresh} from '@nutui/nutui-react-taro'
import UserCard from "./components/UserCard";
import UserOrder from "./components/UserOrder";
import UserFooter from "./components/UserFooter";
import {useUserData} from "@/hooks/useUserData";
import './user.scss'
import IsDealer from "./components/IsDealer";
import UserGrid from "@/pages/user/components/UserGrid";

function User() {

  const { refresh } = useUserData()
  const userCardRef = useRef<any>()

  // 下拉刷新处理
  const handleRefresh = async () => {
    await refresh()
    // 如果 UserCard 组件有自己的刷新方法，也可以调用
    if (userCardRef.current?.handleRefresh) {
      await userCardRef.current.handleRefresh()
    }
  }

  useEffect(() => {
  }, []);

  return (
    <PullToRefresh
      onRefresh={handleRefresh}
      headHeight={60}
    >
      <div className={'w-full'} style={{
        background: 'linear-gradient(to bottom, #e9fff2, #f9fafb)'
      }}>
        <UserCard ref={userCardRef}/>
        <UserOrder/>
        <IsDealer/>
        <UserGrid/>
        <UserFooter/>
      </div>
    </PullToRefresh>
  )
}

export default User