achenc1013/ThriveX-Admin
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

完成更新记录页面

Browse Source
This commit is contained in:
宇阳
2024-08-16 15:05:04 +08:00
parent 3f8b17d4c2
commit 482331e4cd
1 changed files with 27 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files

33
src/pages/Iterative/index.tsx
View File

@@ -1,4 +1,4 @@
import { Card, Timeline, TimelineItemProps } from 'antd';
import { Card, Select, Timeline, TimelineItemProps } from 'antd';
import { useEffect, useState } from 'react';
import GitHubCalendar from 'react-github-calendar';
import Title from '@/components/Title';
@@ -12,6 +12,9 @@ interface Commit {
}
const Home = () => {
const [year, setYear] = useState<number>(new Date().getFullYear())
const [yearList, setYearList] = useState<{ value: number, label: string }[]>([])
const [blog_iterativeRecording, setBlog_IterativeRecording] = useState<TimelineItemProps[]>([])
const [admin_iterativeRecording, setAdmin_IterativeRecording] = useState<TimelineItemProps[]>([])
const [server_iterativeRecording, setServer_IterativeRecording] = useState<TimelineItemProps[]>([])
@@ -38,6 +41,12 @@ const Home = () => {
}
useEffect(() => {
// 获取当前年份
const currentYear = dayjs().year();
// 生成最近10年的年份数组
const yearList = Array.from({ length: 10 }, (_, i) => currentYear - i);
setYearList(yearList.map(item => ({ value: item, label: item + '' })))
// 如果缓存中有值就无需重新调接口
const blog_project_iterative = JSON.parse(sessionStorage.getItem('blog_project_iterative') || '[]')
blog_project_iterative.length ? setBlog_IterativeRecording(blog_project_iterative) : getCommitData("Thrive_Blog")
@@ -54,23 +63,35 @@ const Home = () => {
<Title value='项目迭代记录'></Title>
<Card className='mt-2'>
<div className='flex justify-center mt-2 mb-10'>
<GitHubCalendar username="liuyuyang01"/>
<div className='flex flex-col items-center mt-2 mb-22'>
<div className='ml-5 mb-6'>
<span>年份切换：</span>
<Select
size='small'
defaultValue={year}
options={yearList}
onChange={setYear}
className='w-20'
/>
</div>
<GitHubCalendar username="liuyuyang01" year={year} />
</div>
<div className='flex justify-between'>
<div className='flex-1'>
<h3 className='text-xl text-center pb-6 font-bold'>Thrive_Blog</h3>
<h3 className='text-xl text-center pb-6 font-bold text-gradient block'>Thrive_Blog</h3>
<Timeline mode="left" items={blog_iterativeRecording} />
</div>
<div className='flex-1'>
<h3 className='text-xl text-center pb-6 font-bold'>Thrive_Admin</h3>
<h3 className='text-xl text-center pb-6 font-bold text-gradient block'>Thrive_Admin</h3>
<Timeline mode="left" items={admin_iterativeRecording} />
</div>
<div className='flex-1'>
<h3 className='text-xl text-center pb-6 font-bold'>Thrive_Server</h3>
<h3 className='text-xl text-center pb-6 font-bold text-gradient block'>Thrive_Server</h3>
<Timeline mode="left" items={server_iterativeRecording} />
</div>
</div>