From 86964737d39ef7211f46a425ec8fb8785eca30a2 Mon Sep 17 00:00:00 2001 From: none Date: Tue, 11 Apr 2023 11:01:15 +0800 Subject: [PATCH] =?UTF-8?q?=E7=99=BB=E5=BD=95=E6=88=90=E5=8A=9F=E8=AF=B7?= =?UTF-8?q?=E6=B1=82=E7=B3=BB=E7=BB=9F=E9=85=8D=E7=BD=AE?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/api/system.ts | 4 ++ src/pages/login/index.tsx | 76 +++++++++++++++++---------- src/store/system/systemConfigSlice.ts | 22 +++----- 3 files changed, 59 insertions(+), 43 deletions(-) diff --git a/src/api/system.ts b/src/api/system.ts index 233aa16..0ff970c 100644 --- a/src/api/system.ts +++ b/src/api/system.ts @@ -3,3 +3,7 @@ import client from "./internal/httpClient"; export function getImageCaptcha() { return client.get("/backend/v1/system/image-captcha", {}); } + +export function getSystemConfig() { + return client.get("/backend/v1/system/config", {}); +} \ No newline at end of file diff --git a/src/pages/login/index.tsx b/src/pages/login/index.tsx index 55dfb3c..a52dff2 100644 --- a/src/pages/login/index.tsx +++ b/src/pages/login/index.tsx @@ -1,7 +1,7 @@ -import React, { useState, useEffect } from "react"; +import { useState, useEffect } from "react"; import styles from "./index.module.less"; import { Spin, Input, Button, message } from "antd"; -import { login, system } from "../../api/index"; +import { login as loginApi, system } from "../../api/index"; import { setToken } from "../../utils/index"; import { useDispatch } from "react-redux"; import { useNavigate } from "react-router-dom"; @@ -9,6 +9,10 @@ import banner from "../../assets/images/login/banner.png"; import icon from "../../assets/images/login/icon.png"; import "./login.less"; import { loginAction } from "../../store/user/loginUserSlice"; +import { + SystemConfigStoreInterface, + saveConfigAction, +} from "../../store/system/systemConfigSlice"; const LoginPage = () => { const dispatch = useDispatch(); @@ -22,6 +26,7 @@ const LoginPage = () => { const [captchaLoading, setCaptchaLoading] = useState(true); const fetchImageCaptcha = () => { + setCaptchaVal(""); setCaptchaLoading(true); system.getImageCaptcha().then((res: any) => { setImage(res.data.image); @@ -30,7 +35,7 @@ const LoginPage = () => { }); }; - const loginSubmit = (e: any) => { + const loginSubmit = async () => { if (!email) { message.error("请输入管理员邮箱账号"); return; @@ -43,47 +48,60 @@ const LoginPage = () => { message.error("请输入图形验证码"); return; } - if (captchaVal.length < 4) { + if (captchaVal.length !== 4) { message.error("图形验证码错误"); return; } - if (loading) { - return; - } - handleSubmit(); + await handleSubmit(); }; - const handleSubmit = () => { + const handleSubmit = async () => { if (loading) { return; } setLoading(true); - login - .login(email, password, captchaKey, captchaVal) - .then((res: any) => { - const token = res.data.token; - setToken(token); - getUser(); - }) - .catch((e) => { - setLoading(false); - setCaptchaVal(""); - fetchImageCaptcha(); - }); + try { + let res: any = await loginApi.login( + email, + password, + captchaKey, + captchaVal + ); + setToken(res.data.token); //将token写入本地 + await getSystemConfig(); //获取系统配置并写入store + await getUser(); //获取登录用户的信息并写入store + + navigate("/"); + } catch (e) { + message.error("登录出现错误"); + console.error("错误信息", e); + setLoading(false); + fetchImageCaptcha(); //刷新图形验证码 + } }; - const getUser = () => { - login.getUser().then((res: any) => { - const data = res.data; - dispatch(loginAction(data)); - setLoading(false); - navigate("/"); - }); + const getUser = async () => { + let res: any = await loginApi.getUser(); + dispatch(loginAction(res.data)); + }; + + const getSystemConfig = async () => { + let res: any = await system.getSystemConfig(); + let data: SystemConfigStoreInterface = { + systemName: res.data["system.name"], + systemLogo: res.data["system.logo"], + systemApiUrl: res.data["system.api_url"], + systemPcUrl: res.data["system.pc_url"], + systemH5Url: res.data["system.h5_url"], + memberDefaultAvatar: res.data["member.default_avatar"], + courseDefaultThumbs: res.data["default.course_thumbs"], + }; + dispatch(saveConfigAction(data)); }; const keyUp = (e: any) => { if (e.keyCode === 13) { - loginSubmit(e); + loginSubmit(); } }; diff --git a/src/store/system/systemConfigSlice.ts b/src/store/system/systemConfigSlice.ts index eab6dfe..300a1b9 100644 --- a/src/store/system/systemConfigSlice.ts +++ b/src/store/system/systemConfigSlice.ts @@ -1,25 +1,19 @@ import { createSlice } from "@reduxjs/toolkit"; type SystemConfigStoreInterface = { - systemApiUrl: string; - systemPcUrl: string; - systemH5Url: string; - systemLogo: string; - systemName: string; -}; - -let defaultValue: SystemConfigStoreInterface = { - systemApiUrl: "", - systemPcUrl: "", - systemH5Url: "", - systemLogo: "", - systemName: "", + systemApiUrl?: string; + systemPcUrl?: string; + systemH5Url?: string; + systemLogo?: string; + systemName?: string; + memberDefaultAvatar?: string; + courseDefaultThumbs?: string[]; }; const systemConfigSlice = createSlice({ name: "systemConfig", initialState: { - value: defaultValue, + value: {}, }, reducers: { saveConfigAction(stage, e) {