状态栏修复更新

1.添加状态栏间距来防止内容遮挡
2.添加了跟随页面自动变色的状态栏标题色改变

src/pages/orders/index.tsx

@@ -5,6 +5,8 @@ import './index.scss'
 import { getOrderList, type OrderItem } from '../../utils/store'
 import { PRODUCT_ICON_MAP } from '../../utils/productConfig'
 import { useThemeContext } from '../../context/ThemeContext'
+import { useSafeArea } from '../../hooks/useSafeArea'
+import { useStatusBar } from '../../hooks/useStatusBar'
 import LoginGuard from '../../components/LoginGuard'
 
 const STATUS_TABS = [
@@ -25,6 +27,8 @@ const STATUS_MAP: Record<string, { label: string; badge: string }> = {
 
 export default function OrdersPage() {
   const { theme, resolvedTheme } = useThemeContext()
+  const safe = useSafeArea()
+  useStatusBar(resolvedTheme)
   const [activeTab, setActiveTab] = useState('all')
   const [orders, setOrders] = useState<OrderItem[]>([])
 
@@ -74,7 +78,7 @@ export default function OrdersPage() {
       <LoginGuard>
         <View className='orders-page'>
 
-          <View className='page-header dashed-card mt-20'>
+          <View className='page-header dashed-card mt-20' style={{ marginTop: `${safe.headerPaddingTop}px` }}>
             <View className='star-badge' />
             <Text className='page-title'>我的订单</Text>
           </View>