添加了postsPanel作为通用帖子显示板,增加了对jest测试的配置,添加了论坛主页,设定了论坛全局框架,设定了论坛基础主题色及主题切换、字号切换逻辑
Change-Id: I9fad0cf577088adb00c9850d405ccd23e6072413
diff --git a/src/components/postsPanel/postsPanel.tsx b/src/components/postsPanel/postsPanel.tsx
new file mode 100644
index 0000000..e4f87c0
--- /dev/null
+++ b/src/components/postsPanel/postsPanel.tsx
@@ -0,0 +1,40 @@
+import { useApi } from '@/hooks/request';
+import React, { useCallback } from 'react';
+import request from '@/utils/request'
+import style from './postsPanel.module.css'
+
+
+interface panelProps{
+ name:string,
+ url:string,
+ limit:number
+}
+
+const PostsPanel:React.FC<panelProps> = (props) => {
+ const fenchData = useCallback(() => request.get(props.url), [props.url])
+ const {data} = useApi(fenchData, true);
+
+
+
+ return (
+ <div className={style.panel}>
+ <div className={style.header}>
+ <span className={style.title}>{props.name}</span>
+ <span className={style.more}>更多</span>
+ </div>
+ <div className={style.content}>
+ {data && data.length > 0 ?
+ data?.map((item: { title: string; date: string }, index: number) => (
+ <div key={index} className={style.item}>
+ <span className={style.text}>{item.title}</span>
+ <span>{item.date}</span>
+ </div>
+ )) :(
+ <div>未查询到相关记录</div>
+ )}
+ </div>
+ </div>
+ )
+}
+
+export default PostsPanel;
\ No newline at end of file