diff --git a/.env.example b/.env.example new file mode 100644 index 0000000..021a2cc --- /dev/null +++ b/.env.example @@ -0,0 +1 @@ +REACT_APP_URL= \ No newline at end of file diff --git a/.gitignore b/.gitignore index 4d29575..9664149 100644 --- a/.gitignore +++ b/.gitignore @@ -21,3 +21,11 @@ npm-debug.log* yarn-debug.log* yarn-error.log* + +yanr.lock +package-lock.json + +.env +.env.local +.env.production +.env.development \ No newline at end of file diff --git a/src/api/categories.ts b/src/api/categories.ts deleted file mode 100644 index 9e8e1b9..0000000 --- a/src/api/categories.ts +++ /dev/null @@ -1,9 +0,0 @@ -import axios from "axios"; - -export const getCategoriesAsync = (params: any) => - axios.get("/categroy/findCategroy", { - params: params, - }); - -export const addCategoriesAsync = (data: any) => - axios.post("/categroy/addCategroy", data); diff --git a/src/api/index.ts b/src/api/index.ts new file mode 100644 index 0000000..b224c91 --- /dev/null +++ b/src/api/index.ts @@ -0,0 +1,3 @@ +import * as login from "./login"; + +export {login} diff --git a/src/api/internal/httpClient.ts b/src/api/internal/httpClient.ts new file mode 100644 index 0000000..c635ca0 --- /dev/null +++ b/src/api/internal/httpClient.ts @@ -0,0 +1,117 @@ +import axios, { Axios, AxiosResponse } from "axios"; +import { message } from "antd"; +import { getToken, clearToken } from "../../utils/index"; + +export class HttpClient { + axios: Axios; + + constructor(url: string) { + this.axios = axios.create({ + baseURL: url, + timeout: 15000, + withCredentials: false, + }); + + //拦截器注册 + this.axios.interceptors.request.use( + (config) => { + const token = getToken(); + token && (config.headers.Authorization = "Bearer " + token); + return config; + }, + (err) => { + return Promise.reject(err); + } + ); + + this.axios.interceptors.response.use( + (response: AxiosResponse) => { + let status = response.data.status; //HTTP状态码 + let code = response.data.code; //业务返回代码 + let msg = response.data.msg; //错误消息 + + if (code === 0) { + return Promise.resolve(response); + } else { + message.error(msg); + return Promise.reject(response); + } + }, + // 当http的状态码非0 + (error) => { + let status = error.response.status; + if (status === 401) { + clearToken(); + // 跳转到登录界面 + } else if (status === 404) { + // 跳转到404页面 + } else if (status === 403) { + // 跳转到无权限页面 + } else if (status === 500) { + // 跳转到500异常页面 + } + return Promise.reject(error.response); + } + ); + } + + get(url: string, params: object) { + return new Promise((resolve, reject) => { + this.axios + .get(url, { + params: params, + }) + .then((res) => { + resolve(res.data); + }) + .catch((err) => { + reject(err.data); + }); + }); + } + + destroy(url: string) { + return new Promise((resolve, reject) => { + this.axios + .delete(url) + .then((res) => { + resolve(res.data); + }) + .catch((err) => { + reject(err.data); + }); + }); + } + + post(url: string, params: object) { + return new Promise((resolve, reject) => { + this.axios + .post(url, params) + .then((res) => { + resolve(res.data); + }) + .catch((err) => { + reject(err.data); + }); + }); + } + + put(url: string, params: object) { + return new Promise((resolve, reject) => { + this.axios + .put(url, params) + .then((res) => { + resolve(res.data); + }) + .catch((err) => { + reject(err.data); + }); + }); + } +} + +const APP_URL = process.env.REACT_APP_URL || ""; + +const client = new HttpClient(APP_URL); + +export default client; diff --git a/src/api/login.ts b/src/api/login.ts new file mode 100644 index 0000000..ba3c0d3 --- /dev/null +++ b/src/api/login.ts @@ -0,0 +1,19 @@ +import client from "./internal/httpClient"; + +export function login( + email: string, + password: string, + captchaKey: string, + captchaVal: string +) { + return client.post("/backend/v1/auth/login", { + email: email, + password: password, + captcha_key: captchaKey, + captcha_val: captchaVal, + }); +} + +export function logout() { + return client.post("/backend/v1/auth/logout", {}); +} diff --git a/src/pages/home/HomePage.tsx b/src/pages/home/HomePage.tsx index c932372..1c81326 100644 --- a/src/pages/home/HomePage.tsx +++ b/src/pages/home/HomePage.tsx @@ -1,9 +1,14 @@ -import React from "react"; +import React, { useEffect } from "react"; import styles from "./HomePage.module.css"; import { Outlet } from "react-router-dom"; -import { Header, LeftMenu } from "../../compenents"; +import { Header, LeftMenu, Footer } from "../../compenents"; +import { login } from "../../api/index"; export const HomePage: React.FC = () => { + useEffect(() => { + login.login("1@qq.com", "123123", "1", "2"); + }, []); + return ( <>