功能：修改邮箱配置

src/api/Project.ts

@@ -1,5 +1,5 @@
 import Request from '@/utils/request'
-import { System, Web, Theme } from '@/types/app/project'
+import { System, Web, Theme, Other } from '@/types/app/project'
 
 // 获取系统配置信息
 export const getSystemDataAPI = () => Request<System>("GET", "/project/system")
@@ -12,8 +12,12 @@ export const editWebDataAPI = (data: Web) => Request<Web>("PATCH", "/project/web
 
 // 获取主题配置信息
 export const getThemeDataAPI = () => Request<Theme>("GET", "/project/theme")
-// export const getThemeDataAPI = () => Request<Theme>("GET", "/project/layout")
 
 // 修改主题配置信息
 export const editThemeDataAPI = (data: Theme) => Request<Theme>("PATCH", "/project/theme", { data })
-// export const editThemeDataAPI = (data: Theme) => Request<Theme>("PATCH", "/project/layout", { data })
+
+// 获取其他配置信息
+export const getOtherDataAPI = () => Request<Other>("GET", "/project/other")
+
+// 修改其他配置信息
+export const editOtherDataAPI = (data: Other) => Request<Other>("PATCH", "/project/other", { data })

src/pages/Setup/components/Other/components/Email/index.tsx

@@ -1,10 +1,34 @@
-import { Button, Form, Input } from "antd"
+import { Button, Form, Input, message, Spin } from "antd"
+import { editOtherDataAPI, getOtherDataAPI } from "@/api/Project";
+import { useEffect, useState } from "react";
+
+interface EmailForm {
+    host: string,
+    port: number,
+    username: string,
+    password: string
+}
 
 export default () => {
+    const [loading, setLoading] = useState(false)
     const [form] = Form.useForm();
 
-    const handleSubmit = async (values) => {
+    const getOtherData = async () => {
+        const { data } = await getOtherDataAPI()
+        form.setFieldsValue(JSON.parse(data.email))
+    }
 
+    useEffect(() => {
+        getOtherData()
+    }, [])
+
+    const handleSubmit = async (values: EmailForm) => {
+        setLoading(true)
+        await editOtherDataAPI({
+            email: JSON.stringify(values)
+        })
+        message.success("🎉 修改配置成功");
+        setLoading(false)
     };
 
     return (
@@ -17,26 +41,24 @@ export default () => {
                     onFinish={handleSubmit}
                     className="w-full lg:w-[500px] md:ml-10"
                 >
-                    <Form.Item label="服务器" name="host">
+                    <Form.Item label="邮箱服务器" name="host">
                         <Input placeholder="smtp.qq.com" />
                     </Form.Item>
 
-                    <Form.Item label="端口" name="port">
+                    <Form.Item label="邮箱端口" name="port">
                         <Input placeholder="465" />
                     </Form.Item>
 
-                    <Form.Item label="用户名" name="host">
+                    <Form.Item label="邮箱用户名" name="username">
                         <Input placeholder="3311118881@qq.com" />
                     </Form.Item>
 
-                    <Form.Item label="密码" name="host">
+                    <Form.Item label="邮箱授权码" name="password">
                         <Input placeholder="audhaudhaudhauddwq" />
                     </Form.Item>
 
                     <Form.Item>
-                        <Button type="primary" htmlType="submit" className="w-full">
-                            保存
-                        </Button>
+                        <Button type="primary" htmlType="submit" loading={loading} className="w-full">保存</Button>
                     </Form.Item>
                 </Form>
             </div>

src/types/app/project.d.ts

@@ -42,3 +42,8 @@ export interface Theme {
     social: string,
     covers: string
 }
+
+// 其他配置
+export interface Other {
+    email: string
+}