From e1578aeb5a8f15630e1832f1e7aa7c2067089a54 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E8=B0=A2=E4=BA=9A=E6=98=95?= <1549469775@qq.com>
Date: Mon, 25 Nov 2024 14:45:36 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20=E6=B7=BB=E5=8A=A0=E9=83=A8=E5=88=86?=
=?UTF-8?q?=E5=BA=93?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
---
package.json | 4 ++-
pnpm-lock.yaml | 40 ++++++++++++++++++++++++++---
src/App.tsx | 26 ++++++++++++++++++-
src/api/index.ts | 5 ++--
src/index.css | 1 +
src/plugins/http/Repeat.ts | 3 +++
src/plugins/http/index.ts | 17 ++++++++++---
src/ui/Hero/index.tsx | 4 +--
src/ui/Register/Register.tsx | 29 ++++++++++-----------
src/views/Home/index.tsx | 60 +++++++++++++++++++++++++++++++++-----------
10 files changed, 146 insertions(+), 43 deletions(-)
diff --git a/package.json b/package.json
index c0c3844..76e7cea 100644
--- a/package.json
+++ b/package.json
@@ -18,16 +18,18 @@
"@blueprintjs/table": "^5.2.5",
"@types/lodash": "^4.17.13",
"@types/react-router-dom": "^5.3.3",
- "axios": "^1.7.7",
"appwrite": "^16.0.2",
+ "axios": "^1.7.7",
"framer-motion": "^11.11.17",
"jotai": "^2.10.3",
"lodash": "^4.17.21",
"normalize.css": "^8.0.1",
"react": "^18.3.1",
"react-dom": "^18.3.1",
+ "react-hook-form": "^7.53.2",
"react-markdown": "^9.0.1",
"react-router-dom": "^5.3.4",
+ "react-toastify": "^10.0.6",
"styled-components": "^6.1.13"
},
"devDependencies": {
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index 3bda8e5..3de642e 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -26,12 +26,12 @@ importers:
'@types/react-router-dom':
specifier: ^5.3.3
version: 5.3.3
- axios:
- specifier: ^1.7.7
- version: 1.7.7
appwrite:
specifier: ^16.0.2
version: 16.0.2
+ axios:
+ specifier: ^1.7.7
+ version: 1.7.7
framer-motion:
specifier: ^11.11.17
version: 11.11.17(@emotion/is-prop-valid@1.2.2)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)
@@ -50,12 +50,18 @@ importers:
react-dom:
specifier: ^18.3.1
version: 18.3.1(react@18.3.1)
+ react-hook-form:
+ specifier: ^7.53.2
+ version: 7.53.2(react@18.3.1)
react-markdown:
specifier: ^9.0.1
version: 9.0.1(@types/react@18.3.12)(react@18.3.1)
react-router-dom:
specifier: ^5.3.4
version: 5.3.4(react@18.3.1)
+ react-toastify:
+ specifier: ^10.0.6
+ version: 10.0.6(react-dom@18.3.1(react@18.3.1))(react@18.3.1)
styled-components:
specifier: ^6
version: 6.1.13(react-dom@18.3.1(react@18.3.1))(react@18.3.1)
@@ -733,6 +739,10 @@ packages:
classnames@2.5.1:
resolution: {integrity: sha512-saHYOzhIQs6wy2sVxTM6bUDsQO4F50V9RQ22qBpEdCW+I+/Wmke2HOl6lS6dTpdxVhb88/I6+Hs+438c3lfUow==}
+ clsx@2.1.1:
+ resolution: {integrity: sha512-eYm0QWBtUrBWZWG0d386OGAw16Z995PiOVo2B7bjWSbHedGl5e0ZWaq65kOGgUSNesEIDkB9ISbTg/JK9dhCZA==}
+ engines: {node: '>=6'}
+
color-convert@2.0.1:
resolution: {integrity: sha512-RRECPsj7iu/xb5oKYcsFHSppFNnsj/52OVTRKb4zP5onXwVF3zVmmToNcOfGC+CRDpfK/U584fMg38ZHCaElKQ==}
engines: {node: '>=7.0.0'}
@@ -1295,6 +1305,12 @@ packages:
react-fast-compare@3.2.2:
resolution: {integrity: sha512-nsO+KSNgo1SbJqJEYRE9ERzo7YtYbou/OqjSQKxV7jcKox7+usiUVZOAC+XnDOABXggQTno0Y1CpVnuWEc1boQ==}
+ react-hook-form@7.53.2:
+ resolution: {integrity: sha512-YVel6fW5sOeedd1524pltpHX+jgU2u3DSDtXEaBORNdqiNrsX/nUI/iGXONegttg0mJVnfrIkiV0cmTU6Oo2xw==}
+ engines: {node: '>=18.0.0'}
+ peerDependencies:
+ react: ^16.8.0 || ^17 || ^18 || ^19
+
react-innertext@1.1.5:
resolution: {integrity: sha512-PWAqdqhxhHIv80dT9znP2KvS+hfkbRovFp4zFYHFFlOoQLRiawIic81gKb3U1wEyJZgMwgs3JoLtwryASRWP3Q==}
peerDependencies:
@@ -1327,6 +1343,12 @@ packages:
peerDependencies:
react: '>=15'
+ react-toastify@10.0.6:
+ resolution: {integrity: sha512-yYjp+omCDf9lhZcrZHKbSq7YMuK0zcYkDFTzfRFgTXkTFHZ1ToxwAonzA4JI5CxA91JpjFLmwEsZEgfYfOqI1A==}
+ peerDependencies:
+ react: '>=18'
+ react-dom: '>=18'
+
react-transition-group@4.4.5:
resolution: {integrity: sha512-pZcd1MCJoiKiBR2NRxeCRg13uCXbydPnmB4EOeRrY7480qNWO8IIgQG6zlDkm6uRMsURXPuKq0GWtiM59a5Q6g==}
peerDependencies:
@@ -2111,6 +2133,8 @@ snapshots:
classnames@2.5.1: {}
+ clsx@2.1.1: {}
+
color-convert@2.0.1:
dependencies:
color-name: 1.1.4
@@ -2833,6 +2857,10 @@ snapshots:
react-fast-compare@3.2.2: {}
+ react-hook-form@7.53.2(react@18.3.1):
+ dependencies:
+ react: 18.3.1
+
react-innertext@1.1.5(@types/react@18.3.12)(react@18.3.1):
dependencies:
'@types/react': 18.3.12
@@ -2889,6 +2917,12 @@ snapshots:
tiny-invariant: 1.3.3
tiny-warning: 1.0.3
+ react-toastify@10.0.6(react-dom@18.3.1(react@18.3.1))(react@18.3.1):
+ dependencies:
+ clsx: 2.1.1
+ react: 18.3.1
+ react-dom: 18.3.1(react@18.3.1)
+
react-transition-group@4.4.5(react-dom@18.3.1(react@18.3.1))(react@18.3.1):
dependencies:
'@babel/runtime': 7.26.0
diff --git a/src/App.tsx b/src/App.tsx
index 20a2876..26e8670 100644
--- a/src/App.tsx
+++ b/src/App.tsx
@@ -1,5 +1,29 @@
import AppRouter from "@/router/AppRouter"
+import { ToastContainer, Bounce } from 'react-toastify';
export default function App() {
- return
+ return <>
+
+
+ {/* */}
+
}
diff --git a/src/api/index.ts b/src/api/index.ts
index 36b0b7d..a768f2a 100644
--- a/src/api/index.ts
+++ b/src/api/index.ts
@@ -1,6 +1,5 @@
-import { Toast } from "@/utils/toast"
import { Account, Client, ID } from "appwrite"
-
+import { toast } from "react-toastify"
const client = new Client()
client.setProject(import.meta.env.VUE_APPWRITE_PROJECT_ID)
@@ -10,7 +9,7 @@ export async function register(opts: { email: string; password: string }, errTex
try {
await account.create(ID.unique(), opts.email, opts.password)
} catch (error: any) {
- Toast.error(error?.message ?? errText)
+ toast.error(error?.message ?? errText)
return Promise.reject(error)
}
}
diff --git a/src/index.css b/src/index.css
index e91f86d..20514aa 100644
--- a/src/index.css
+++ b/src/index.css
@@ -1,4 +1,5 @@
@import "normalize.css";
+@import 'react-toastify/dist/ReactToastify.css';
@import "@blueprintjs/core/lib/css/blueprint.css";
@import "@blueprintjs/icons/lib/css/blueprint-icons.css";
@import "@blueprintjs/table/lib/css/table.css";
diff --git a/src/plugins/http/Repeat.ts b/src/plugins/http/Repeat.ts
index 2644db8..0dc20c2 100644
--- a/src/plugins/http/Repeat.ts
+++ b/src/plugins/http/Repeat.ts
@@ -3,6 +3,9 @@ import { IPlugin } from "./base"
declare module "axios" {
interface AxiosRequestConfig {
+ /**
+ * 全局请求，不会被RepeatPlugin插件的clearPendingPool清除
+ */
global?: boolean
}
}
diff --git a/src/plugins/http/index.ts b/src/plugins/http/index.ts
index 79303a6..872c3a9 100644
--- a/src/plugins/http/index.ts
+++ b/src/plugins/http/index.ts
@@ -57,11 +57,20 @@ class Fly extends httpBase {
super()
this.name = name
}
- get(...argus: [url: string, config?: AxiosRequestConfig | undefined]) {
- return this.instance!.get.apply(this.instance, argus ?? []) as Promise
+ get(...argus: [url: string, config?: AxiosRequestConfig | undefined]) {
+ return this.instance!.get.apply(this.instance, argus ?? []) as Promise>
}
- request(...argus: [config: AxiosRequestConfig]): Promise {
- return this.instance!.request.apply(this.instance, argus) as Promise
+ post(...argus: [url: string, config?: AxiosRequestConfig | undefined]) {
+ return this.instance!.post.apply(this.instance, argus ?? []) as Promise>
+ }
+ put(...argus: [url: string, config?: AxiosRequestConfig | undefined]) {
+ return this.instance!.put.apply(this.instance, argus ?? []) as Promise>
+ }
+ delete(...argus: [url: string, config?: AxiosRequestConfig | undefined]) {
+ return this.instance!.delete.apply(this.instance, argus ?? []) as Promise>
+ }
+ request(...argus: [config: AxiosRequestConfig]) {
+ return this.instance!.request.apply(this.instance, argus) as Promise>
}
#init(config: AxiosRequestConfig) {
this.callPlugin("beforeCreate")
diff --git a/src/ui/Hero/index.tsx b/src/ui/Hero/index.tsx
index a76c103..852b172 100644
--- a/src/ui/Hero/index.tsx
+++ b/src/ui/Hero/index.tsx
@@ -40,10 +40,10 @@ export function Hero() {
return (
- 
+ /> */}
珠光照月，斑驳裂影。桃艳压山，风月无边。
diff --git a/src/ui/Register/Register.tsx b/src/ui/Register/Register.tsx
index 5afcbe8..682e0c1 100644
--- a/src/ui/Register/Register.tsx
+++ b/src/ui/Register/Register.tsx
@@ -1,9 +1,9 @@
// import { Tag } from "@blueprintjs/core";
import { register } from "@/api"
-import { Toast } from "@/utils/toast"
import { Button, FormGroup, InputGroup, Intent, Tooltip } from "@blueprintjs/core"
-import { FC, ReactNode, useCallback, useEffect, useState } from "react"
+import { FC, ReactNode, useCallback, useEffect, useRef, useState } from "react"
+import { toast } from "react-toastify"
interface IProps {
onSuccess?: () => void
@@ -22,29 +22,30 @@ export function Register({ onSuccess, children }: IProps) {
const clickRegister = useCallback(async () => {
if (isLoading) {
- Toast.success("正在请求中")
+ toast.info("正在请求中")
return
}
- if (!email) return Toast.error("请输入邮箱")
- if (!password) return Toast.error("请输入密码")
- if (!repeatPassword) return Toast.error("请再一次输入密码")
- if (repeatPassword !== password) return Toast.error("两次输入的密码不一致")
- let toastID = Toast.loading("注册中")
+ if (!email) return toast.error("请输入邮箱")
+ if (!password) return toast.error("请输入密码")
+ if (!repeatPassword) return toast.error("请再一次输入密码")
+ if (repeatPassword !== password) return toast.error("两次输入的密码不一致")
setIsLoading(true)
try {
- await register({ email, password }, "注册失败")
- Toast.success("注册成功")
+ await toast.promise(register({ email, password }, "注册失败"), {
+ pending: '注册中',
+ success: '注册成功',
+ error: '注册失败'
+ })
onSuccess && onSuccess()
} catch (error) {
console.error(error)
} finally {
- Toast.loadingDismiss(toastID)
setIsLoading(false)
}
}, [password, email, repeatPassword, isLoading])
- useEffect(()=>{
- return ()=>{
+ useEffect(() => {
+ return () => {
console.log("取消请求");
}
}, [])
@@ -60,7 +61,7 @@ export function Register({ onSuccess, children }: IProps) {
return (
<>
-