feat: 创建路由
This commit is contained in:
parent
7bb611ba17
commit
8fc61a98c6
|
|
@ -2,7 +2,7 @@
|
||||||
<html lang="en">
|
<html lang="en">
|
||||||
<head>
|
<head>
|
||||||
<meta charset="UTF-8" />
|
<meta charset="UTF-8" />
|
||||||
<link rel="icon" type="image/svg+xml" href="/vite.svg" />
|
<!-- <link rel="icon" type="image/svg+xml" href="/vite.svg" /> -->
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||||
<title>Vite + React</title>
|
<title>Vite + React</title>
|
||||||
</head>
|
</head>
|
||||||
|
|
|
||||||
File diff suppressed because it is too large
Load Diff
|
|
@ -10,6 +10,8 @@
|
||||||
"preview": "vite preview"
|
"preview": "vite preview"
|
||||||
},
|
},
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
|
"@ant-design/pro-components": "^2.8.10",
|
||||||
|
"antd": "^5.27.1",
|
||||||
"react": "^19.1.1",
|
"react": "^19.1.1",
|
||||||
"react-dom": "^19.1.1",
|
"react-dom": "^19.1.1",
|
||||||
"react-router-dom": "^7.8.2"
|
"react-router-dom": "^7.8.2"
|
||||||
|
|
|
||||||
|
|
@ -0,0 +1,25 @@
|
||||||
|
export async function request(url, method, data) {
|
||||||
|
const options = {
|
||||||
|
method,
|
||||||
|
headers: {
|
||||||
|
"Content-Type": "application/json",
|
||||||
|
},
|
||||||
|
};
|
||||||
|
|
||||||
|
if (data) {
|
||||||
|
options.body = JSON.stringify(data);
|
||||||
|
}
|
||||||
|
|
||||||
|
try {
|
||||||
|
const response = await fetch(url, options);
|
||||||
|
|
||||||
|
if (!response.ok) {
|
||||||
|
throw new Error(`HTTP error! status: ${response.status}`);
|
||||||
|
}
|
||||||
|
|
||||||
|
return await response.json();
|
||||||
|
} catch (error) {
|
||||||
|
console.error("Request failed:", error);
|
||||||
|
throw error;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
@ -0,0 +1,7 @@
|
||||||
|
import { request } from "./base";
|
||||||
|
|
||||||
|
export const login = async (username, password) => {
|
||||||
|
return request("/api/login", "POST", {username, password})
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
@ -1,15 +1,30 @@
|
||||||
import { createContext, useContext, useState } from "react";
|
import { createContext, useContext, useEffect, useState } from "react";
|
||||||
|
import { login as loginToServer } from "../api/user";
|
||||||
const AuthContext = createContext(null);
|
const AuthContext = createContext(null);
|
||||||
|
|
||||||
|
|
||||||
export function AuthProvider({ children }) {
|
export function AuthProvider({ children }) {
|
||||||
|
const token = localStorage.getItem('_token')
|
||||||
const [user, setUser] = useState(null);
|
const [user, setUser] = useState(null);
|
||||||
|
|
||||||
const login = (username) => {
|
const currentUser = async () => {
|
||||||
setUser({ name: username });
|
|
||||||
|
}
|
||||||
|
|
||||||
|
const login = async (username, password) => {
|
||||||
|
const res = await loginToServer(username, password);
|
||||||
|
if (res?.success) {
|
||||||
|
localStorage.setItem('_token', res.data);
|
||||||
|
setUser({
|
||||||
|
token: res?.data?.token,
|
||||||
|
...res?.data?.user,
|
||||||
|
})
|
||||||
|
}
|
||||||
|
return res;
|
||||||
};
|
};
|
||||||
|
|
||||||
const logout = () => {
|
const logout = () => {
|
||||||
|
localStorage.removeItem('_token')
|
||||||
setUser(null);
|
setUser(null);
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -4,12 +4,19 @@ import './index.css'
|
||||||
import { BrowserRouter } from "react-router-dom";
|
import { BrowserRouter } from "react-router-dom";
|
||||||
import App from "./App";
|
import App from "./App";
|
||||||
import { AuthProvider } from "./context/AuthContext";
|
import { AuthProvider } from "./context/AuthContext";
|
||||||
|
import zhCN from "antd/locale/zh_CN";
|
||||||
|
import { ConfigProvider } from "antd";
|
||||||
|
import { ProConfigProvider } from "@ant-design/pro-components";
|
||||||
|
|
||||||
createRoot(document.getElementById('root')).render(
|
createRoot(document.getElementById('root')).render(
|
||||||
<StrictMode>
|
<StrictMode>
|
||||||
<BrowserRouter>
|
<BrowserRouter>
|
||||||
<AuthProvider>
|
<AuthProvider>
|
||||||
<App />
|
<ConfigProvider locale={zhCN}>
|
||||||
|
<ProConfigProvider>
|
||||||
|
<App />
|
||||||
|
</ProConfigProvider>
|
||||||
|
</ConfigProvider>
|
||||||
</AuthProvider>
|
</AuthProvider>
|
||||||
</BrowserRouter>
|
</BrowserRouter>
|
||||||
</StrictMode>,
|
</StrictMode>,
|
||||||
|
|
|
||||||
|
|
@ -1,5 +1,30 @@
|
||||||
|
|
||||||
|
import { LoginFormPage, ProForm, ProFormText } from '@ant-design/pro-components';
|
||||||
|
import { message } from 'antd';
|
||||||
|
import { useAuth } from '../context/AuthContext';
|
||||||
|
import { useEffect } from 'react';
|
||||||
|
const REQUIRED = [{required: true}]
|
||||||
|
|
||||||
export default () => {
|
export default () => {
|
||||||
return <>
|
const { login, user } = useAuth();
|
||||||
<h1>Login</h1>
|
|
||||||
</>
|
console.log(user);
|
||||||
|
|
||||||
|
return <div style={{ width: '100vw', height: '100vh'}}>
|
||||||
|
<LoginFormPage
|
||||||
|
backgroundVideoUrl="https://gw.alipayobjects.com/v/huamei_gcee1x/afts/video/jXRBRK_VAwoAAAAAAAAAAAAAK4eUAQBr"
|
||||||
|
title="工作流"
|
||||||
|
onFinish={async (values) => {
|
||||||
|
const res = await login(values?.username, values?.password);
|
||||||
|
if (res?.success) {
|
||||||
|
|
||||||
|
} else {
|
||||||
|
message.error(res?.message);
|
||||||
|
}
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
<ProFormText name="username" label="帐号" rules={REQUIRED} />
|
||||||
|
<ProFormText.Password name="password" label="密码" rules={REQUIRED}/>
|
||||||
|
</LoginFormPage>
|
||||||
|
</div>
|
||||||
}
|
}
|
||||||
|
|
@ -4,4 +4,13 @@ import react from '@vitejs/plugin-react'
|
||||||
// https://vite.dev/config/
|
// https://vite.dev/config/
|
||||||
export default defineConfig({
|
export default defineConfig({
|
||||||
plugins: [react()],
|
plugins: [react()],
|
||||||
|
server: {
|
||||||
|
proxy: {
|
||||||
|
"/api": {
|
||||||
|
target: "http://0.0.0.0:8080", // 你的后端地址
|
||||||
|
changeOrigin: true,
|
||||||
|
// rewrite: (path) => path.replace(/^\/api/, ""),
|
||||||
|
},
|
||||||
|
},
|
||||||
|
},
|
||||||
})
|
})
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue