feat: implement user authentication with login functionality

- Add auth-api for handling login requests.
- Update index.ts to export AuthApi.
- Modify HeroLayout to display username or login link based on authentication state.
- Create LoginPage component for user login.
- Update router to include login route with EmptyLayout.
- Configure WebClient to include credentials in requests.
- Add auth-slice for managing authentication state in Redux.
- Update Redux store to include auth reducer.
- Define LoginRequest and User types in types/index.ts.
- Configure Vite to proxy API requests to the backend server.

src/layout/hero-layout/index.tsx

@@ -1,6 +1,7 @@
 import { Outlet, Link } from "react-router-dom"
 import { useMemo } from "react"
 import dayjs from "dayjs"
+import { useAppSelector } from "@/store"
 
 /**
  * Main application component that serves as the root layout.
@@ -8,6 +9,7 @@ import dayjs from "dayjs"
  */
 export default function HeroLayout() {
   const today = useMemo(() => dayjs(), [])
+  const user = useAppSelector((state) => state.auth.user)
 
   return (
     <div className="bg-gray-50">
@@ -33,6 +35,18 @@ export default function HeroLayout() {
               >
                 改枪码
               </Link>
+              {user ? (
+                <span className="text-gray-700 px-3 py-2 rounded-md text-sm font-medium">
+                  {user.username}
+                </span>
+              ) : (
+                <Link
+                  to="/login"
+                  className="text-gray-500 hover:text-gray-900 px-3 py-2 rounded-md text-sm font-medium"
+                >
+                  登录
+                </Link>
+              )}
               <a
                 href="https://github.com/zihluwang/delta-force-firearm-modification-codes"
                 target="_blank"