import React from 'react'
import ReactDOM from 'react-dom/client'
import { App as AntdApp, ConfigProvider } from 'antd'
import zhCN from 'antd/locale/zh_CN'
import { QueryClient, QueryClientProvider } from '@tanstack/react-query'
import 'antd/dist/reset.css'

// 必须在渲染前初始化 dayjs 中文，否则 DatePicker 日历周/月仍为英文
import '@/lib/dayjs'

import App from './App'
import './styles/main.css'

const queryClient = new QueryClient({
  defaultOptions: {
    queries: {
      // 页面切换和网络恢复不主动重新请求，数据由首次加载、用户操作或手动刷新触发更新。
      staleTime: Infinity,
      refetchOnWindowFocus: false,
      refetchOnReconnect: false,
      retry: 1,
    },
  },
})

ReactDOM.createRoot(document.getElementById('root')!).render(
  <React.StrictMode>
    <ConfigProvider
      locale={zhCN}
      // 全局分页：常开条数切换（ConfigProvider 仅支持 showSizeChanger 等字段）
      // 具体 10/20/50/100 由 utils/admin-pagination 在各 Table 上统一配置
      pagination={{
        showSizeChanger: true,
        totalBoundaryShowSizeChanger: 0,
      }}
      theme={{
        token: {
          colorPrimary: '#ff6a00',
          colorLink: '#ff6a00',
          colorInfo: '#ff6a00',
          borderRadius: 6,
          fontFamily:
            '-apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Microsoft YaHei", sans-serif',
        },
        components: {
          Layout: {
            bodyBg: '#f5f7fb',
            headerBg: '#ffffff',
            siderBg: '#ffffff',
          },
          Card: {
            borderRadiusLG: 6,
          },
        },
      }}
    >
      <AntdApp>
        <QueryClientProvider client={queryClient}>
          <App />
        </QueryClientProvider>
      </AntdApp>
    </ConfigProvider>
  </React.StrictMode>,
)