大改动

This commit is contained in:
宇阳
2025-01-11 22:10:58 +08:00
parent 9df0370ab6
commit c0946a7f40
15 changed files with 564 additions and 391 deletions

View File

@@ -1,5 +1,5 @@
<!DOCTYPE html> <!DOCTYPE html>
<html lang="en"> <html lang="zh-CN">
<head> <head>
<meta charset="UTF-8" /> <meta charset="UTF-8" />
<link rel="icon" type="image/svg+xml" href="/favicon.ico" /> <link rel="icon" type="image/svg+xml" href="/favicon.ico" />

View File

@@ -41,20 +41,24 @@ const CatePage = () => {
}; };
const editCateData = async (id: number) => { const editCateData = async (id: number) => {
setIsMethod("edit")
setLoading(true); setLoading(true);
setIsMethod("edit")
setIsModelOpen(true); setIsModelOpen(true);
try {
const { data } = await getCateDataAPI(id); const { data } = await getCateDataAPI(id);
setIsCateShow(data.type === "cate" ? false : true) setIsCateShow(data.type === "cate" ? false : true)
setCate(data); setCate(data);
form.setFieldsValue(data); form.setFieldsValue(data);
} catch (error) {
setLoading(false); setLoading(false);
}
}; };
const delCateData = async (id: number) => { const delCateData = async (id: number) => {
setLoading(true); setLoading(true);
try { try {
await delCateDataAPI(id); await delCateDataAPI(id);
message.success('🎉 删除分类成功'); message.success('🎉 删除分类成功');
@@ -67,6 +71,7 @@ const CatePage = () => {
const submit = async () => { const submit = async () => {
setBtnLoading(true) setBtnLoading(true)
try {
form.validateFields().then(async (values: Cate) => { form.validateFields().then(async (values: Cate) => {
if (values.type === "cate") values.url = '/' if (values.type === "cate") values.url = '/'
@@ -86,8 +91,9 @@ const CatePage = () => {
getCateList(); getCateList();
setIsMethod("create") setIsMethod("create")
}) })
} catch (error) {
setBtnLoading(false) setBtnLoading(false)
}
}; };
const closeModel = () => { const closeModel = () => {

View File

@@ -20,6 +20,8 @@ const CommentPage = () => {
const user = useUserStore(state => state.user) const user = useUserStore(state => state.user)
const [loading, setLoading] = useState(false); const [loading, setLoading] = useState(false);
const [btnLoading, setBtnLoading] = useState(false);
const [comment, setComment] = useState<Comment>({} as Comment); const [comment, setComment] = useState<Comment>({} as Comment);
const [list, setList] = useState<Comment[]>([]); const [list, setList] = useState<Comment[]>([]);
@@ -27,16 +29,19 @@ const CommentPage = () => {
const getCommentList = async () => { const getCommentList = async () => {
const { data } = await getCommentListAPI(); const { data } = await getCommentListAPI();
setList(data) setList(data)
setLoading(false) setLoading(false)
} }
const delCommentData = async (id: number) => { const delCommentData = async (id: number) => {
setLoading(true) setLoading(true)
try {
await delCommentDataAPI(id); await delCommentDataAPI(id);
getCommentList(); getCommentList();
message.success('🎉 删除评论成功'); message.success('🎉 删除评论成功');
} catch (error) {
setLoading(false)
}
}; };
useEffect(() => { useEffect(() => {
@@ -115,6 +120,9 @@ const CommentPage = () => {
const { RangePicker } = DatePicker; const { RangePicker } = DatePicker;
const onSubmit = async (values: FilterForm) => { const onSubmit = async (values: FilterForm) => {
setLoading(true)
try {
const query: FilterData = { const query: FilterData = {
key: values?.title, key: values?.title,
content: values?.content, content: values?.content,
@@ -124,12 +132,18 @@ const CommentPage = () => {
const { data } = await getCommentListAPI({ query }); const { data } = await getCommentListAPI({ query });
setList(data) setList(data)
} catch (error) {
setLoading(false)
}
} }
// 回复内容 // 回复内容
const [replyInfo, setReplyInfo] = useState("") const [replyInfo, setReplyInfo] = useState("")
const [isReplyModalOpen, setIsReplyModalOpen] = useState(false); const [isReplyModalOpen, setIsReplyModalOpen] = useState(false);
const handleReply = async () => { const handleReply = async () => {
setBtnLoading(true)
try {
await addCommentDataAPI({ await addCommentDataAPI({
avatar: user.avatar, avatar: user.avatar,
url: web.url, url: web.url,
@@ -147,6 +161,9 @@ const CommentPage = () => {
setIsReplyModalOpen(false) setIsReplyModalOpen(false)
setReplyInfo("") setReplyInfo("")
getCommentList() getCommentList()
} catch (error) {
setBtnLoading(false)
}
} }
return ( return (
@@ -198,7 +215,7 @@ const CommentPage = () => {
<div><b></b> {comment?.content}</div> <div><b></b> {comment?.content}</div>
</div> </div>
<Button type='primary' onClick={() => setIsReplyModalOpen(true)} className='w-full mt-4'></Button> <Button type='primary' loading={btnLoading} onClick={() => setIsReplyModalOpen(true)} className='w-full mt-4'></Button>
</Modal> </Modal>
<Modal title="回复评论" open={isReplyModalOpen} footer={null} onCancel={() => setIsReplyModalOpen(false)}> <Modal title="回复评论" open={isReplyModalOpen} footer={null} onCancel={() => setIsReplyModalOpen(false)}>
@@ -211,7 +228,7 @@ const CommentPage = () => {
<div className="flex space-x-4"> <div className="flex space-x-4">
<Button className="w-full mt-2" onClick={() => setIsReplyModalOpen(false)}></Button> <Button className="w-full mt-2" onClick={() => setIsReplyModalOpen(false)}></Button>
<Button type="primary" className="w-full mt-2" onClick={handleReply}></Button> <Button type="primary" loading={btnLoading} onClick={handleReply} className="w-full mt-2"></Button>
</div> </div>
</Modal> </Modal>
</> </>

View File

@@ -25,6 +25,7 @@ const EditorMD = ({ value, onChange }: Props) => {
const uploadImages = async (files: File[]) => { const uploadImages = async (files: File[]) => {
setLoading(true); setLoading(true);
try {
// 处理成后端需要的格式 // 处理成后端需要的格式
const formData = new FormData(); const formData = new FormData();
formData.append("dir", "article"); formData.append("dir", "article");
@@ -37,10 +38,13 @@ const EditorMD = ({ value, onChange }: Props) => {
} }
}); });
setLoading(false);
// 返回图片信息数组 // 返回图片信息数组
return data.map((url: string) => ({ url })); return data.map((url: string) => ({ url }));
} catch (error) {
setLoading(false);
}
setLoading(false);
} }
return ( return (

View File

@@ -93,7 +93,7 @@ const PublishForm = ({ data, closeModel }: { data: Article, closeModel: () => vo
const onSubmit = async (values: FieldType, isDraft?: boolean) => { const onSubmit = async (values: FieldType, isDraft?: boolean) => {
setBtnLoading(true) setBtnLoading(true)
console.log(values); try {
values.isEncrypt = values.isEncrypt ? 1 : 0 values.isEncrypt = values.isEncrypt ? 1 : 0
// 如果是文章标签,则先判断是否存在,如果不存在则添加 // 如果是文章标签,则先判断是否存在,如果不存在则添加
@@ -167,6 +167,9 @@ const PublishForm = ({ data, closeModel }: { data: Article, closeModel: () => vo
} as any) } as any)
} }
} }
} catch (error) {
setBtnLoading(false)
}
// 关闭弹框 // 关闭弹框
closeModel() closeModel()
@@ -176,7 +179,6 @@ const PublishForm = ({ data, closeModel }: { data: Article, closeModel: () => vo
isDraft ? navigate("/draft") : navigate("/article") isDraft ? navigate("/draft") : navigate("/article")
// 初始化表单 // 初始化表单
form.resetFields() form.resetFields()
setBtnLoading(false) setBtnLoading(false)
} }

View File

@@ -18,6 +18,8 @@ const CreatePage = () => {
const id = +params.get('id')! const id = +params.get('id')!
const isDraftParams = Boolean(params.get('draft')) const isDraftParams = Boolean(params.get('draft'))
const [loading, setLoading] = useState(false)
const [data, setData] = useState<Article>({} as Article) const [data, setData] = useState<Article>({} as Article)
const [content, setContent] = useState(''); const [content, setContent] = useState('');
const [publishOpen, setPublishOpen] = useState(false) const [publishOpen, setPublishOpen] = useState(false)
@@ -29,13 +31,18 @@ const CreatePage = () => {
// 获取文章数据 // 获取文章数据
const getArticleData = async () => { const getArticleData = async () => {
try {
const { data } = await getArticleDataAPI(id) const { data } = await getArticleDataAPI(id)
setData(data) setData(data)
setContent(data.content) setContent(data.content)
} catch (error) {
setLoading(false)
}
} }
// 回显数据 // 回显数据
useEffect(() => { useEffect(() => {
setLoading(true)
setPublishOpen(false) setPublishOpen(false)
// 有Id就回显指定的数据 // 有Id就回显指定的数据
@@ -176,7 +183,7 @@ const CreatePage = () => {
</div> </div>
</Title> </Title>
<Card className={`${titleSty} overflow-hidden rounded-xl min-h-[calc(100vh-180px)]`}> <Card loading={loading} className={`${titleSty} overflow-hidden rounded-xl min-h-[calc(100vh-180px)]`}>
<Editor value={content} onChange={(value) => setContent(value)} /> <Editor value={content} onChange={(value) => setContent(value)} />
<Drawer <Drawer

View File

@@ -1,7 +1,7 @@
import { useEffect, useState } from "react"; import { useEffect, useState } from "react";
import { useNavigate, useSearchParams } from "react-router-dom"; import { useNavigate, useSearchParams } from "react-router-dom";
import { Button, Card, Dropdown, Image, Input, message, Modal } from "antd" import { Button, Card, Dropdown, Image, Input, message, Modal, Spin } from "antd"
import TextArea from "antd/es/input/TextArea" import TextArea from "antd/es/input/TextArea"
import { addRecordDataAPI, editRecordDataAPI, getRecordDataAPI } from '@/api/Record' import { addRecordDataAPI, editRecordDataAPI, getRecordDataAPI } from '@/api/Record'
@@ -19,6 +19,8 @@ export default () => {
const id = +params.get('id')! const id = +params.get('id')!
const navigate = useNavigate() const navigate = useNavigate()
const [loading, setLoading] = useState(false)
const [content, setContent] = useState("") const [content, setContent] = useState("")
const [imageList, setImageList] = useState<string[]>([]) const [imageList, setImageList] = useState<string[]>([])
@@ -30,6 +32,9 @@ export default () => {
} }
const onSubmit = async () => { const onSubmit = async () => {
setLoading(true)
try {
const data = { const data = {
content, content,
images: JSON.stringify(imageList), images: JSON.stringify(imageList),
@@ -48,13 +53,21 @@ export default () => {
} }
navigate("/record") navigate("/record")
} catch (error) {
setLoading(false)
}
setLoading(false)
} }
const getRecordData = async () => { const getRecordData = async () => {
setLoading(true)
const { data } = await getRecordDataAPI(id) const { data } = await getRecordDataAPI(id)
console.log(data, 222);
setContent(data.content) setContent(data.content)
setImageList(JSON.parse(data.images as string)) setImageList(JSON.parse(data.images as string))
setLoading(false)
} }
// 回显数据 // 回显数据
@@ -120,6 +133,7 @@ export default () => {
<> <>
<Title value="闪念" /> <Title value="闪念" />
<Spin spinning={loading}>
<Card className={`${titleSty} min-h-[calc(100vh-180px)]`}> <Card className={`${titleSty} min-h-[calc(100vh-180px)]`}>
<div className="relative flex w-[90%] xl:w-[800px] mx-auto mt-[50px]"> <div className="relative flex w-[90%] xl:w-[800px] mx-auto mt-[50px]">
<TextArea <TextArea
@@ -163,6 +177,7 @@ export default () => {
/> />
</div> </div>
</Card> </Card>
</Spin>
<FileUpload <FileUpload
dir="record" dir="record"

View File

@@ -5,8 +5,11 @@ import CardDataStats from "@/components/CardDataStats"
import { AiOutlineEye, AiOutlineMeh, AiOutlineStock, AiOutlineFieldTime } from "react-icons/ai"; import { AiOutlineEye, AiOutlineMeh, AiOutlineStock, AiOutlineFieldTime } from "react-icons/ai";
import { useEffect, useState } from "react" import { useEffect, useState } from "react"
import dayjs from 'dayjs'; import dayjs from 'dayjs';
import { Spin } from "antd";
export default () => { export default () => {
const [loading, setLoading] = useState(false)
const [stats, setStats] = useState({ const [stats, setStats] = useState({
pv: 0, pv: 0,
ip: 0, ip: 0,
@@ -28,6 +31,9 @@ export default () => {
// 获取统计数据 // 获取统计数据
const getDataList = async () => { const getDataList = async () => {
setLoading(true)
try {
const siteId = import.meta.env.VITE_BAIDU_TONGJI_SITE_ID; const siteId = import.meta.env.VITE_BAIDU_TONGJI_SITE_ID;
const token = import.meta.env.VITE_BAIDU_TONGJI_ACCESS_TOKEN; const token = import.meta.env.VITE_BAIDU_TONGJI_ACCESS_TOKEN;
@@ -71,6 +77,12 @@ export default () => {
}); });
setStats({ pv, ip, bounce: (bounce / count) || 0, avgTime: formatTime(avgTime / count) || "00:00:00" }) setStats({ pv, ip, bounce: (bounce / count) || 0, avgTime: formatTime(avgTime / count) || "00:00:00" })
} catch (error) {
setLoading(false)
}
setLoading(false)
}; };
useEffect(() => { useEffect(() => {
@@ -78,7 +90,7 @@ export default () => {
}, []); }, []);
return ( return (
<> <Spin spinning={loading}>
{/* 基本数据 */} {/* 基本数据 */}
<div className="mt-2 grid grid-cols-1 gap-2 md:grid-cols-2 xl:grid-cols-4"> <div className="mt-2 grid grid-cols-1 gap-2 md:grid-cols-2 xl:grid-cols-4">
<CardDataStats title="今日访客" total={stats.pv + ''} rate="0.43%" levelUp> <CardDataStats title="今日访客" total={stats.pv + ''} rate="0.43%" levelUp>
@@ -104,6 +116,6 @@ export default () => {
{/* <ChartTwo /> {/* <ChartTwo />
<ChatCard /> */} <ChatCard /> */}
</div> </div>
</> </Spin>
) )
} }

View File

@@ -1,13 +1,13 @@
import { useState, useEffect } from 'react'; import { useState, useEffect } from 'react';
import { useNavigate } from 'react-router-dom'; import { useNavigate } from 'react-router-dom';
import { Table, Button, Tag, notification, Card, Popconfirm, Form } from 'antd'; import { Table, Button, Tag, notification, Card, Popconfirm, Form, Spin } from 'antd';
import { titleSty } from '@/styles/sty' import { titleSty } from '@/styles/sty'
import Title from '@/components/Title'; import Title from '@/components/Title';
import { delArticleDataAPI, getArticleListAPI, reductionArticleDataAPI } from '@/api/Article'; import { delArticleDataAPI, getArticleListAPI, reductionArticleDataAPI } from '@/api/Article';
import type { Tag as ArticleTag } from '@/types/app/tag'; import type { Tag as ArticleTag } from '@/types/app/tag';
import type { Cate } from '@/types/app/cate'; import type { Cate } from '@/types/app/cate';
import type { Article, Config } from '@/types/app/article'; import type { Article } from '@/types/app/article';
import { useWebStore } from '@/stores'; import { useWebStore } from '@/stores';
import dayjs from 'dayjs'; import dayjs from 'dayjs';
@@ -23,33 +23,46 @@ export default () => {
const [form] = Form.useForm(); const [form] = Form.useForm();
const getArticleList = async () => { const getArticleList = async () => {
setLoading(true); try {
const { data } = await getArticleListAPI({ query: { isDel: 1 } }); const { data } = await getArticleListAPI({ query: { isDel: 1 } });
setArticleList(data as Article[]); setArticleList(data as Article[]);
} catch (error) {
setLoading(false);
}
setLoading(false); setLoading(false);
}; };
useEffect(() => { useEffect(() => {
setLoading(true);
getArticleList() getArticleList()
}, []); }, []);
const delArticleData = async (id: number) => { const delArticleData = async (id: number) => {
setLoading(true); setLoading(true);
try {
// 严格删除:彻底从数据库删除,无法恢复 // 严格删除:彻底从数据库删除,无法恢复
await delArticleDataAPI(id); await delArticleDataAPI(id);
await getArticleList(); await getArticleList();
form.resetFields() form.resetFields()
setCurrent(1) setCurrent(1)
notification.success({ message: '🎉 删除文章成功' }) notification.success({ message: '🎉 删除文章成功' })
} catch (error) {
setLoading(false); setLoading(false);
}
}; };
const reductionArticleData = async (id: number) => { const reductionArticleData = async (id: number) => {
setLoading(true);
try {
await reductionArticleDataAPI(id) await reductionArticleDataAPI(id)
navigate("/article") navigate("/article")
notification.success({ message: '🎉 还原文章成功' }) notification.success({ message: '🎉 还原文章成功' })
} catch (error) {
setLoading(false);
}
} }
// 标签颜色 // 标签颜色

View File

@@ -21,26 +21,32 @@ export default () => {
const [form] = Form.useForm(); const [form] = Form.useForm();
const getArticleList = async () => { const getArticleList = async () => {
setLoading(true); try {
const { data } = await getArticleListAPI({ query: { isDraft: 1 } }); const { data } = await getArticleListAPI({ query: { isDraft: 1 } });
setArticleList(data as Article[]); setArticleList(data as Article[]);
} catch (error) {
setLoading(false); setLoading(false);
}
setLoading(false)
}; };
useEffect(() => { useEffect(() => {
setLoading(true)
getArticleList() getArticleList()
}, []); }, []);
const delArticleData = async (id: number) => { const delArticleData = async (id: number) => {
setLoading(true); setLoading(true);
try {
await delArticleDataAPI(id); await delArticleDataAPI(id);
await getArticleList(); await getArticleList();
form.resetFields() form.resetFields()
setCurrent(1) setCurrent(1)
notification.success({ message: '🎉 删除文章成功' }) notification.success({ message: '🎉 删除文章成功' })
} catch (error) {
setLoading(false); setLoading(false);
}
}; };
// 标签颜色 // 标签颜色

View File

@@ -34,9 +34,13 @@ export default () => {
// 获取目录列表 // 获取目录列表
const getDirList = async () => { const getDirList = async () => {
setLoading(true) try {
const { data } = await getDirListAPI() const { data } = await getDirListAPI()
setDirList(data) setDirList(data)
} catch (error) {
setLoading(false)
}
setLoading(false) setLoading(false)
} }
@@ -54,13 +58,16 @@ export default () => {
const onDeleteImage = async (data: File) => { const onDeleteImage = async (data: File) => {
setLoading(true) setLoading(true)
try {
await delFileDataAPI(data.url) await delFileDataAPI(data.url)
message.success("🎉 删除图片成功") message.success("🎉 删除图片成功")
getFileList(dirName) getFileList(dirName)
setFile({} as File) setFile({} as File)
setOpenFileInfoDrawer(false) setOpenFileInfoDrawer(false)
setOpenFilePreviewDrawer(false) setOpenFilePreviewDrawer(false)
} catch (error) {
setLoading(false)
}
} }
// 下载图片 // 下载图片

View File

@@ -12,6 +12,7 @@ import axios from 'axios';
const FootprintPage = () => { const FootprintPage = () => {
const [loading, setLoading] = useState<boolean>(false); const [loading, setLoading] = useState<boolean>(false);
const [btnLoading, setBtnLoading] = useState(false) const [btnLoading, setBtnLoading] = useState(false)
const [modalLoading, setModalLoading] = useState(false)
const [footprintList, setFootprintList] = useState<Footprint[]>([]); const [footprintList, setFootprintList] = useState<Footprint[]>([]);
const [isModelOpen, setIsModelOpen] = useState(false); const [isModelOpen, setIsModelOpen] = useState(false);
@@ -86,13 +87,18 @@ const FootprintPage = () => {
const { RangePicker } = DatePicker; const { RangePicker } = DatePicker;
const getFootprintList = async () => { const getFootprintList = async () => {
setLoading(true); try {
const { data } = await getFootprintListAPI(); const { data } = await getFootprintListAPI();
setFootprintList(data as Footprint[]); setFootprintList(data as Footprint[]);
} catch (error) {
setLoading(false);
}
setLoading(false); setLoading(false);
}; };
useEffect(() => { useEffect(() => {
setLoading(true);
getFootprintList(); getFootprintList();
}, []); }, []);
@@ -105,10 +111,14 @@ const FootprintPage = () => {
const delFootprintData = async (id: number) => { const delFootprintData = async (id: number) => {
setLoading(true); setLoading(true);
try {
await delFootprintDataAPI(id); await delFootprintDataAPI(id);
notification.success({ message: '🎉 删除足迹成功' }); notification.success({ message: '🎉 删除足迹成功' });
getFootprintList(); getFootprintList();
} catch (error) {
setLoading(false); setLoading(false);
}
}; };
const addFootprintData = () => { const addFootprintData = () => {
@@ -119,8 +129,10 @@ const FootprintPage = () => {
}; };
const editFootprintData = async (id: number) => { const editFootprintData = async (id: number) => {
setModalLoading(true);
try {
setIsMethod("edit"); setIsMethod("edit");
setLoading(true);
setIsModelOpen(true); setIsModelOpen(true);
const { data } = await getFootprintDataAPI(id); const { data } = await getFootprintDataAPI(id);
@@ -130,12 +142,17 @@ const FootprintPage = () => {
setFootprint(data); setFootprint(data);
form.setFieldsValue(data); form.setFieldsValue(data);
setLoading(false); } catch (error) {
setModalLoading(false);
}
setModalLoading(false);
}; };
const onSubmit = async () => { const onSubmit = async () => {
setBtnLoading(true) setBtnLoading(true)
try {
form.validateFields().then(async (values: Footprint) => { form.validateFields().then(async (values: Footprint) => {
values.createTime = values.createTime.valueOf() values.createTime = values.createTime.valueOf()
values.images = values.images ? (values.images as string).split("\n") : [] values.images = values.images ? (values.images as string).split("\n") : []
@@ -151,13 +168,17 @@ const FootprintPage = () => {
reset() reset()
getFootprintList(); getFootprintList();
}); });
} catch (error) {
setBtnLoading(false) setBtnLoading(false)
}
}; };
const closeModel = () => reset(); const closeModel = () => reset();
const onFilterSubmit = async (values: FilterForm) => { const onFilterSubmit = async (values: FilterForm) => {
setLoading(true)
try {
const query: FilterData = { const query: FilterData = {
key: values.address, key: values.address,
startDate: values.createTime && values.createTime[0].valueOf() + '', startDate: values.createTime && values.createTime[0].valueOf() + '',
@@ -165,14 +186,21 @@ const FootprintPage = () => {
} }
const { data } = await getFootprintListAPI({ query }); const { data } = await getFootprintListAPI({ query });
setFootprintList(data as Footprint[]); setFootprintList(data);
} catch (error) {
setLoading(false)
}
setLoading(false)
} }
// 通过详细地址获取纬度 // 通过详细地址获取纬度
const getGeocode = async () => { const getGeocode = async () => {
const address = form.getFieldValue("address") setModalLoading(true)
try { try {
const address = form.getFieldValue("address")
const { data } = await axios.get('https://restapi.amap.com/v3/geocode/geo', { const { data } = await axios.get('https://restapi.amap.com/v3/geocode/geo', {
params: { params: {
address, address,
@@ -187,16 +215,17 @@ const FootprintPage = () => {
// 立即触发校验 // 立即触发校验
form.validateFields(['position']); form.validateFields(['position']);
setModalLoading(false)
return data.geocodes[0].location; return data.geocodes[0].location;
} else { } else {
message.warning('未找到该地址的经纬度'); message.warning('未找到该地址的经纬度');
return '';
} }
} catch (error) { } catch (error) {
console.error('获取地理编码时出错:', error); setModalLoading(false)
message.error('获取地理编码时出错');
return '';
} }
}; };
return ( return (
@@ -237,7 +266,7 @@ const FootprintPage = () => {
/> />
</Card> </Card>
<Modal title={isMethod === "edit" ? "编辑足迹" : "新增足迹"} open={isModelOpen} onCancel={closeModel} destroyOnClose footer={null}> <Modal loading={modalLoading} title={isMethod === "edit" ? "编辑足迹" : "新增足迹"} open={isModelOpen} onCancel={closeModel} destroyOnClose footer={null}>
<Form form={form} layout="vertical" initialValues={footprint} size='large' preserve={false} className='mt-6'> <Form form={form} layout="vertical" initialValues={footprint} size='large' preserve={false} className='mt-6'>
<Form.Item label="标题" name="title" rules={[{ required: true, message: '标题不能为空' }]}> <Form.Item label="标题" name="title" rules={[{ required: true, message: '标题不能为空' }]}>
<Input placeholder="请输入标题" /> <Input placeholder="请输入标题" />

View File

@@ -1,4 +1,4 @@
import { Card, Select, Timeline, TimelineItemProps } from 'antd'; import { Card, Select, Spin, Timeline, TimelineItemProps } from 'antd';
import { useEffect, useState } from 'react'; import { useEffect, useState } from 'react';
import GitHubCalendar from 'react-github-calendar'; import GitHubCalendar from 'react-github-calendar';
import Title from '@/components/Title'; import Title from '@/components/Title';
@@ -12,6 +12,8 @@ interface Commit {
} }
const Home = () => { const Home = () => {
const [loading, setLoading] = useState<boolean>(false)
const [year, setYear] = useState<number>(new Date().getFullYear()) const [year, setYear] = useState<number>(new Date().getFullYear())
const [yearList, setYearList] = useState<{ value: number, label: string }[]>([]) const [yearList, setYearList] = useState<{ value: number, label: string }[]>([])
@@ -21,6 +23,7 @@ const Home = () => {
// 从github获取最近10次迭代记录 // 从github获取最近10次迭代记录
const getCommitData = async (project: string) => { const getCommitData = async (project: string) => {
try {
const res = await fetch(`https://api.github.com/repos/LiuYuYang01/${project}/commits?per_page=10`) const res = await fetch(`https://api.github.com/repos/LiuYuYang01/${project}/commits?per_page=10`)
const data = await res.json() const data = await res.json()
const result = data?.map((item: Commit) => ( const result = data?.map((item: Commit) => (
@@ -44,9 +47,16 @@ const Home = () => {
setServer_IterativeRecording(result) setServer_IterativeRecording(result)
break; break;
} }
} catch (error) {
setLoading(false)
}
setLoading(false)
} }
useEffect(() => { useEffect(() => {
setLoading(true)
// 获取当前年份 // 获取当前年份
const currentYear = dayjs().year(); const currentYear = dayjs().year();
// 生成最近10年的年份数组 // 生成最近10年的年份数组
@@ -62,12 +72,15 @@ const Home = () => {
const server_project_iterative = JSON.parse(sessionStorage.getItem('server_project_iterative') || '[]') const server_project_iterative = JSON.parse(sessionStorage.getItem('server_project_iterative') || '[]')
server_project_iterative.length ? setServer_IterativeRecording(server_project_iterative) : getCommitData("ThriveX-Server") server_project_iterative.length ? setServer_IterativeRecording(server_project_iterative) : getCommitData("ThriveX-Server")
setLoading(false)
}, []) }, [])
return ( return (
<> <>
<Title value='项目迭代记录'></Title> <Title value='项目迭代记录'></Title>
<Spin spinning={loading}>
<Card className='mt-2 min-h-[calc(100vh-180px)]'> <Card className='mt-2 min-h-[calc(100vh-180px)]'>
<div className='flex flex-col items-center mt-2 mb-22'> <div className='flex flex-col items-center mt-2 mb-22'>
<div className='ml-5 mb-6'> <div className='ml-5 mb-6'>
@@ -104,6 +117,7 @@ const Home = () => {
</div> </div>
</div> </div>
</Card> </Card>
</Spin>
</> </>
); );
}; };

View File

@@ -7,6 +7,8 @@ import { loginDataAPI } from '@/api/User';
import { useUserStore } from '@/stores'; import { useUserStore } from '@/stores';
const LoginPage = () => { const LoginPage = () => {
const [loading, setLoading] = useState(false)
const [form] = useForm(); const [form] = useForm();
const [isPassVisible, setIsPassVisible] = useState(false); const [isPassVisible, setIsPassVisible] = useState(false);
const store = useUserStore(); const store = useUserStore();
@@ -15,6 +17,9 @@ const LoginPage = () => {
const returnUrl = new URLSearchParams(location.search).get('returnUrl') || '/'; const returnUrl = new URLSearchParams(location.search).get('returnUrl') || '/';
const onSubmit = async () => { const onSubmit = async () => {
setLoading(true)
try {
const values = await form.validateFields(); const values = await form.validateFields();
const { data } = await loginDataAPI(values); const { data } = await loginDataAPI(values);
@@ -29,6 +34,11 @@ const LoginPage = () => {
}); });
navigate(returnUrl); navigate(returnUrl);
} catch (error) {
setLoading(false)
}
setLoading(false)
}; };
return ( return (
@@ -70,7 +80,7 @@ const LoginPage = () => {
</Form.Item> </Form.Item>
<Form.Item> <Form.Item>
<Button type="primary" htmlType="submit" className="w-full" block></Button> <Button type="primary" htmlType="submit" loading={loading} className="w-full" block></Button>
</Form.Item> </Form.Item>
</Form> </Form>
</div> </div>

View File

@@ -9,7 +9,9 @@ import { titleSty } from '@/styles/sty';
const StoragePage = () => { const StoragePage = () => {
const [loading, setLoading] = useState<boolean>(false); const [loading, setLoading] = useState<boolean>(false);
const [btnLoading, setBtnLoading] = useState(false); const [btnLoading, setBtnLoading] = useState(false);
const [modalLoading, setModalLoading] = useState(false)
const [isModalOpen, setIsModalOpen] = useState(false); const [isModalOpen, setIsModalOpen] = useState(false);
const [oss, setOss] = useState<Oss>({} as Oss); const [oss, setOss] = useState<Oss>({} as Oss);
const [ossList, setOssList] = useState<Oss[]>([]); const [ossList, setOssList] = useState<Oss[]>([]);
const [platformList, setPlatformList] = useState<{ label: string, value: string, disabled: boolean }[]>([]); const [platformList, setPlatformList] = useState<{ label: string, value: string, disabled: boolean }[]>([]);
@@ -51,9 +53,9 @@ const StoragePage = () => {
render: (_, record: Oss) => ( render: (_, record: Oss) => (
<div className='space-x-2'> <div className='space-x-2'>
{record.isEnable ? ( {record.isEnable ? (
<Button type="primary" danger onClick={() => handleDisable(record.id!)}></Button> <Button type="primary" danger onClick={() => disableOssData(record.id!)}></Button>
) : ( ) : (
<Button type="primary" onClick={() => handleEnable(record.id!)}></Button> <Button type="primary" onClick={() => enableOssData(record.id!)}></Button>
)} )}
<Button onClick={() => editOssData(record)}></Button> <Button onClick={() => editOssData(record)}></Button>
@@ -83,44 +85,71 @@ const StoragePage = () => {
}; };
const getOssList = async () => { const getOssList = async () => {
setLoading(true); try {
const { data } = await getOssListAPI(); const { data } = await getOssListAPI();
setOssList(data); setOssList(data);
} catch (error) {
setLoading(false)
}
setLoading(false); setLoading(false);
}; };
useEffect(() => { useEffect(() => {
setLoading(true);
getOssList(); getOssList();
getOssPlatformList() getOssPlatformList()
}, []); }, []);
const handleEnable = async (id: number) => { const enableOssData = async (id: number) => {
try {
await enableOssDataAPI(id); await enableOssDataAPI(id);
await getOssList();
message.success('启用成功'); message.success('启用成功');
getOssList(); } catch (error) {
setLoading(false)
}
}; };
const handleDisable = async (id: number) => { const disableOssData = async (id: number) => {
try {
await disableOssDataAPI(id); await disableOssDataAPI(id);
await getOssList();
message.success('禁用成功'); message.success('禁用成功');
getOssList(); } catch (error) {
setLoading(false)
}
}; };
const editOssData = async (record: Oss) => { const editOssData = async (record: Oss) => {
setOss(record); setModalLoading(true)
const { data } = await getOssDataAPI(record.id)
form.setFieldsValue(data); try {
setIsModalOpen(true); setIsModalOpen(true);
const { data } = await getOssDataAPI(record.id)
setOss(data);
form.setFieldsValue(data);
} catch (error) {
setModalLoading(false)
}
setModalLoading(false)
}; };
const delOssData = async (id: number) => { const delOssData = async (id: number) => {
setLoading(true); setLoading(true);
try {
await delOssDataAPI(id); await delOssDataAPI(id);
await getOssList();
message.success('🎉 删除存储配置成功'); message.success('🎉 删除存储配置成功');
getOssList(); } catch (error) {
setLoading(false)
}
}; };
const handleAdd = () => { const addOssData = () => {
setOss({} as Oss); setOss({} as Oss);
form.resetFields(); form.resetFields();
form.setFieldsValue({}); form.setFieldsValue({});
@@ -151,20 +180,22 @@ const StoragePage = () => {
form.resetFields(); form.resetFields();
setBtnLoading(false); setBtnLoading(false);
} catch (error) { } catch (error) {
console.error('表单验证失败:', error);
setBtnLoading(false); setBtnLoading(false);
} }
setBtnLoading(false)
}; };
return ( return (
<> <>
<Title value="存储管理"> <Title value="存储管理">
<Button type="primary" size='large' onClick={handleAdd}></Button> <Button type="primary" size='large' onClick={addOssData}></Button>
</Title> </Title>
<Card className={`${titleSty} min-h-[calc(100vh-180px)]`}> <Card className={`${titleSty} min-h-[calc(100vh-180px)]`}>
<Table <Table
rowKey="id" rowKey="id"
loading={loading}
dataSource={ossList} dataSource={ossList}
columns={columns} columns={columns}
scroll={{ x: 'max-content' }} scroll={{ x: 'max-content' }}
@@ -172,11 +203,11 @@ const StoragePage = () => {
position: ['bottomCenter'], position: ['bottomCenter'],
pageSize: 8 pageSize: 8
}} }}
loading={loading}
/> />
</Card> </Card>
<Modal <Modal
loading={modalLoading}
title={oss.id ? "编辑存储配置" : "新增存储配置"} title={oss.id ? "编辑存储配置" : "新增存储配置"}
open={isModalOpen} open={isModalOpen}
onCancel={handleCancel} onCancel={handleCancel}