feat: 完善项目架构和功能

- 修复路由配置，实现根路径自动重定向到/project
- 新增Gitea OAuth认证系统和相关组件
- 完善日志系统实现，包含pino日志工具和中间件
- 重构页面结构，分离项目管理和环境管理页面
- 新增CORS、Session等关键中间件
- 优化前端请求封装和类型定义
- 修复TypeScript类型错误和参数传递问题

apps/web/.env

@@ -0,0 +1 @@
+BASE_URL=http://192.168.1.36:3001

apps/web/package.json

@@ -12,8 +12,9 @@
   },
   "dependencies": {
     "@arco-design/web-react": "^2.66.4",
-    "react": "^19.1.1",
-    "react-dom": "^19.1.1",
+    "axios": "^1.11.0",
+    "react": "^18.3.1",
+    "react-dom": "^18.3.1",
     "react-router": "^7.8.0"
   },
   "devDependencies": {

apps/web/rsbuild.config.ts

@@ -1,16 +1,24 @@
-import { ArcoDesignPlugin } from "@arco-plugins/unplugin-react";
-import { defineConfig } from "@rsbuild/core";
-import { pluginReact } from "@rsbuild/plugin-react";
-import { pluginLess } from "@rsbuild/plugin-less";
+import { ArcoDesignPlugin } from '@arco-plugins/unplugin-react';
+import { defineConfig } from '@rsbuild/core';
+import { pluginReact } from '@rsbuild/plugin-react';
+import { pluginLess } from '@rsbuild/plugin-less';
 import { pluginSvgr } from '@rsbuild/plugin-svgr';
 
 export default defineConfig({
   plugins: [pluginReact(), pluginLess(), pluginSvgr()],
+  html: {
+    title: 'Foka CI',
+  },
+  source: {
+    define: {
+      'process.env.BASE_URL': JSON.stringify(process.env.BASE_URL),
+    },
+  },
   tools: {
     rspack: {
       plugins: [
         new ArcoDesignPlugin({
-          defaultLanguage: "zh-CN",
+          defaultLanguage: 'zh-CN',
         }),
       ],
     },

apps/web/src/assets/images/gitea.svg

@@ -0,0 +1,31 @@
+<?xml version="1.0" encoding="utf-8"?>
+<svg version="1.1" id="main_outline" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px"
+	 y="0px" viewBox="0 0 640 640" style="enable-background:new 0 0 640 640;" xml:space="preserve">
+<g>
+	<path id="teabag" style="fill:#FFFFFF" d="M395.9,484.2l-126.9-61c-12.5-6-17.9-21.2-11.8-33.8l61-126.9c6-12.5,21.2-17.9,33.8-11.8
+		c17.2,8.3,27.1,13,27.1,13l-0.1-109.2l16.7-0.1l0.1,117.1c0,0,57.4,24.2,83.1,40.1c3.7,2.3,10.2,6.8,12.9,14.4
+		c2.1,6.1,2,13.1-1,19.3l-61,126.9C423.6,484.9,408.4,490.3,395.9,484.2z"/>
+	<g>
+		<g>
+			<path style="fill:#609926" d="M622.7,149.8c-4.1-4.1-9.6-4-9.6-4s-117.2,6.6-177.9,8c-13.3,0.3-26.5,0.6-39.6,0.7c0,39.1,0,78.2,0,117.2
+				c-5.5-2.6-11.1-5.3-16.6-7.9c0-36.4-0.1-109.2-0.1-109.2c-29,0.4-89.2-2.2-89.2-2.2s-141.4-7.1-156.8-8.5
+				c-9.8-0.6-22.5-2.1-39,1.5c-8.7,1.8-33.5,7.4-53.8,26.9C-4.9,212.4,6.6,276.2,8,285.8c1.7,11.7,6.9,44.2,31.7,72.5
+				c45.8,56.1,144.4,54.8,144.4,54.8s12.1,28.9,30.6,55.5c25,33.1,50.7,58.9,75.7,62c63,0,188.9-0.1,188.9-0.1s12,0.1,28.3-10.3
+				c14-8.5,26.5-23.4,26.5-23.4s12.9-13.8,30.9-45.3c5.5-9.7,10.1-19.1,14.1-28c0,0,55.2-117.1,55.2-231.1
+				C633.2,157.9,624.7,151.8,622.7,149.8z M125.6,353.9c-25.9-8.5-36.9-18.7-36.9-18.7S69.6,321.8,60,295.4
+				c-16.5-44.2-1.4-71.2-1.4-71.2s8.4-22.5,38.5-30c13.8-3.7,31-3.1,31-3.1s7.1,59.4,15.7,94.2c7.2,29.2,24.8,77.7,24.8,77.7
+				S142.5,359.9,125.6,353.9z M425.9,461.5c0,0-6.1,14.5-19.6,15.4c-5.8,0.4-10.3-1.2-10.3-1.2s-0.3-0.1-5.3-2.1l-112.9-55
+				c0,0-10.9-5.7-12.8-15.6c-2.2-8.1,2.7-18.1,2.7-18.1L322,273c0,0,4.8-9.7,12.2-13c0.6-0.3,2.3-1,4.5-1.5c8.1-2.1,18,2.8,18,2.8
+				l110.7,53.7c0,0,12.6,5.7,15.3,16.2c1.9,7.4-0.5,14-1.8,17.2C474.6,363.8,425.9,461.5,425.9,461.5z"/>
+			<path style="fill:#609926" d="M326.8,380.1c-8.2,0.1-15.4,5.8-17.3,13.8c-1.9,8,2,16.3,9.1,20c7.7,4,17.5,1.8,22.7-5.4
+				c5.1-7.1,4.3-16.9-1.8-23.1l24-49.1c1.5,0.1,3.7,0.2,6.2-0.5c4.1-0.9,7.1-3.6,7.1-3.6c4.2,1.8,8.6,3.8,13.2,6.1
+				c4.8,2.4,9.3,4.9,13.4,7.3c0.9,0.5,1.8,1.1,2.8,1.9c1.6,1.3,3.4,3.1,4.7,5.5c1.9,5.5-1.9,14.9-1.9,14.9
+				c-2.3,7.6-18.4,40.6-18.4,40.6c-8.1-0.2-15.3,5-17.7,12.5c-2.6,8.1,1.1,17.3,8.9,21.3c7.8,4,17.4,1.7,22.5-5.3
+				c5-6.8,4.6-16.3-1.1-22.6c1.9-3.7,3.7-7.4,5.6-11.3c5-10.4,13.5-30.4,13.5-30.4c0.9-1.7,5.7-10.3,2.7-21.3
+				c-2.5-11.4-12.6-16.7-12.6-16.7c-12.2-7.9-29.2-15.2-29.2-15.2s0-4.1-1.1-7.1c-1.1-3.1-2.8-5.1-3.9-6.3c4.7-9.7,9.4-19.3,14.1-29
+				c-4.1-2-8.1-4-12.2-6.1c-4.8,9.8-9.7,19.7-14.5,29.5c-6.7-0.1-12.9,3.5-16.1,9.4c-3.4,6.3-2.7,14.1,1.9,19.8
+				C343.2,346.5,335,363.3,326.8,380.1z"/>
+		</g>
+	</g>
+</g>
+</svg>

apps/web/src/index.tsx

@@ -1,4 +1,3 @@
-import React from 'react';
 import ReactDOM from 'react-dom/client';
 import App from '@pages/App';
 import { BrowserRouter } from 'react-router';
@@ -8,10 +7,8 @@ const rootEl = document.getElementById('root');
 if (rootEl) {
   const root = ReactDOM.createRoot(rootEl);
   root.render(
-    <React.StrictMode>
-      <BrowserRouter>
-        <App />
-      </BrowserRouter>
-    </React.StrictMode>,
+    <BrowserRouter>
+      <App />
+    </BrowserRouter>,
   );
 }

apps/web/src/pages/App.tsx

@@ -1,14 +1,17 @@
-import { Route, Routes } from 'react-router';
+import { Route, Routes, Navigate } from 'react-router';
 import Home from '@pages/home';
 import Login from '@pages/login';
-import Application from '@pages/application';
+import Project from '@pages/project';
+import Env from '@pages/env';
 
 import '@styles/index.css';
 const App = () => {
   return (
     <Routes>
       <Route path="/" element={<Home />}>
-        <Route path="application" element={<Application />} index />
+        <Route index element={<Navigate to="project" replace />} />
+        <Route path="project" element={<Project />} />
+        <Route path="env" element={<Env />} />
       </Route>
       <Route path="/login" element={<Login />} />
     </Routes>

apps/web/src/pages/application/index.tsx

@@ -1,12 +0,0 @@
-import { useState } from "react";
-
-function Application() {
-  const [apps, setApps] = useState<Application[]>([]);
-  return (
-    <div>
-      application
-    </div>
-  )
-}
-
-export default Application;

apps/web/src/pages/env/index.tsx

@@ -0,0 +1,12 @@
+import { useState } from "react";
+
+function Env() {
+  const [env, setEnv] = useState([]);
+  return (
+    <div>
+      env page
+    </div>
+  )
+}
+
+export default Env;

apps/web/src/pages/home/index.tsx

@@ -11,7 +11,7 @@ import {
 } from '@arco-design/web-react/icon';
 import { useState } from 'react';
 import Logo from '@assets/images/logo.svg?react';
-import { Outlet } from 'react-router';
+import { Link, Outlet } from 'react-router';
 
 function Home() {
   const [collapsed, setCollapsed] = useState(false);
@@ -33,24 +33,16 @@ function Home() {
           defaultSelectedKeys={['0_1']}
         >
           <Menu.Item key="0">
-            <IconApps />
-            Navigation 1
+            <Link to="/project" className="flex flex-row items-center">
+              <IconApps fontSize={18} />
+              项目管理
+            </Link>
           </Menu.Item>
           <Menu.Item key="1">
-            <IconRobot />
-            Navigation 2
-          </Menu.Item>
-          <Menu.Item key="2">
-            <IconBulb />
-            Navigation 3
-          </Menu.Item>
-          <Menu.Item key="3">
-            <IconSafe />
-            Navigation 4
-          </Menu.Item>
-          <Menu.Item key="4">
-            <IconFire />
-            Navigation 5
+            <Link to="/env" className="flex flex-row items-center">
+              <IconRobot fontSize={18} />
+              环境管理
+            </Link>
           </Menu.Item>
         </Menu>
       </Layout.Sider>

apps/web/src/pages/login/index.tsx

@@ -1,16 +1,41 @@
-import { Input, Space } from '@arco-design/web-react';
-import { IconUser, IconInfoCircle } from '@arco-design/web-react/icon';
+import { Button } from '@arco-design/web-react';
+import Gitea from '@assets/images/gitea.svg?react';
+import { loginService } from './service';
+import { useEffect } from 'react';
+import { useNavigate, useSearchParams } from 'react-router';
+
 function Login() {
+  const [ searchParams ] = useSearchParams();
+  const navigate = useNavigate();
+  const authCode = searchParams.get('code');
+
+  const onLoginClick = async () => {
+    const url = await loginService.getAuthUrl();
+    if (url) {
+      window.location.href = url;
+    }
+  };
+
+  useEffect(() => {
+    if (authCode) {
+      loginService.login(authCode, navigate);
+    }
+  }, [authCode, navigate]);
+
   return (
-    <div>
-      <Space direction='vertical'>
-        <Input placeholder="username" prefix={<IconUser />} size="large" />
-        <Input.Password
-          placeholder="password"
-          prefix={<IconInfoCircle />}
-          size="large"
-        />
-      </Space>
+    <div className="flex  justify-center items-center h-[100vh]">
+      <Button
+        type="primary"
+        color="green"
+        shape="round"
+        size="large"
+        onClick={onLoginClick}
+      >
+        <span className="flex items-center gap-2">
+          <Gitea className="w-5 h-5" />
+          <span>Gitea 授权登录</span>
+        </span>
+      </Button>
     </div>
   );
 }

apps/web/src/pages/login/service.ts

@@ -0,0 +1,39 @@
+import { net } from '@shared';
+import type { AuthURLResponse } from './types';
+import type { NavigateFunction } from 'react-router';
+import { Notification } from '@arco-design/web-react';
+
+class LoginService {
+  async getAuthUrl() {
+    const { code, data } = await net.request<AuthURLResponse>({
+      method: 'GET',
+      url: '/api/auth/url',
+      params: {
+        redirect: encodeURIComponent(`${location.origin}/login`),
+      },
+    });
+    if (code === 0) {
+      return data.url;
+    }
+  }
+
+  async login(authCode: string, navigate: NavigateFunction) {
+    const { data, code } = await net.request<AuthURLResponse>({
+      method: 'POST',
+      url: '/api/auth/login',
+      data: {
+        code: authCode,
+      },
+    });
+    if (code === 0) {
+      localStorage.setItem('user', JSON.stringify(data));
+      navigate('/');
+      Notification.success({
+        title: '提示',
+        content: '登录成功'
+      });
+    }
+  }
+}
+
+export const loginService = new LoginService();

apps/web/src/pages/login/types.ts

@@ -0,0 +1,5 @@
+import type { APIResponse } from '@shared';
+
+export type AuthURLResponse = APIResponse<{
+  url: string;
+}>

apps/web/src/pages/project/index.tsx

@@ -0,0 +1,8 @@
+import { useState } from 'react';
+
+function Project() {
+  const [projects, setProjects] = useState([]);
+  return <div>project page</div>;
+}
+
+export default Project;

apps/web/src/pages/project/types.ts

@@ -1,15 +1,15 @@
-enum AppStatus {
+enum BuildStatus {
   Idle = "Pending",
   Running = "Running",
   Stopped = "Stopped",
 }
 
-export interface Application {
+export interface Project {
   id: string;
   name: string;
   description: string;
   git: string;
   env: Record<string, string>;
   createdAt: string;
-  status: AppStatus;
+  status: BuildStatus;
 }

apps/web/src/shared/index.ts

@@ -0,0 +1 @@
+export * from './request';

apps/web/src/shared/request.ts

@@ -0,0 +1,26 @@
+import axios, { Axios, type AxiosRequestConfig } from 'axios';
+
+class Net {
+  private readonly instance: Axios;
+  constructor() {
+    this.instance = axios.create({
+      baseURL: process.env.BASE_URL,
+      timeout: 20000,
+      withCredentials: true,
+    });
+  }
+
+  async request<T>(config: AxiosRequestConfig): Promise<T> {
+    const { data } = await this.instance.request<T>(config);
+    return data;
+  }
+}
+
+export interface APIResponse<T> {
+  code: number;
+  data: T;
+  message: string;
+  timestamp: number;
+}
+
+export const net = new Net();

apps/web/tsconfig.json

@@ -23,7 +23,8 @@
      "paths": {
       "@pages/*": ["./src/pages/*"],
       "@styles/*": ["./src/styles/*"],
-      "@assets/*": ["./src/assets/*"]
+      "@assets/*": ["./src/assets/*"],
+      "@shared": ["./src/shared"]
     }
   },
   "include": ["src"]