2024-05-07 16:24:43 +00:00
|
|
|
|
// src/app.tsx
|
|
|
|
|
|
2024-05-09 22:29:02 +00:00
|
|
|
|
import { PostEntity } from '@3rapp/api/modules/content/entities/post.entity';
|
2024-05-07 16:24:43 +00:00
|
|
|
|
import { StyleProvider } from '@ant-design/cssinjs';
|
|
|
|
|
import { Button, ConfigProvider, theme, App as AntdApp } from 'antd';
|
|
|
|
|
// import 'dayjs/locale/zh-cn';
|
|
|
|
|
import zhCN from 'antd/locale/zh_CN';
|
|
|
|
|
|
2024-05-09 22:29:02 +00:00
|
|
|
|
import axios from 'axios';
|
|
|
|
|
import { FC, useEffect, useState } from 'react';
|
2024-05-07 16:24:43 +00:00
|
|
|
|
|
|
|
|
|
import $styles from './app.module.css';
|
|
|
|
|
|
2024-05-09 22:29:02 +00:00
|
|
|
|
const getPosts = async () => {
|
|
|
|
|
let data: PostEntity[] = [];
|
|
|
|
|
try {
|
|
|
|
|
const res = await axios.get('/api/posts');
|
|
|
|
|
data = res.data;
|
|
|
|
|
} catch (err) {
|
|
|
|
|
console.log('Error:', err);
|
|
|
|
|
}
|
|
|
|
|
return data;
|
|
|
|
|
};
|
|
|
|
|
|
2024-05-07 16:24:43 +00:00
|
|
|
|
const App: FC = () => {
|
2024-05-09 22:29:02 +00:00
|
|
|
|
const [data, setData] = useState<PostEntity[]>([]);
|
|
|
|
|
useEffect(() => {
|
|
|
|
|
(async () => {
|
|
|
|
|
setData(await getPosts());
|
|
|
|
|
})();
|
|
|
|
|
}, []);
|
2024-05-07 16:24:43 +00:00
|
|
|
|
return (
|
|
|
|
|
<ConfigProvider
|
|
|
|
|
locale={zhCN}
|
|
|
|
|
theme={{
|
|
|
|
|
algorithm: theme.defaultAlgorithm,
|
|
|
|
|
token: {
|
|
|
|
|
colorPrimary: '#00B96B',
|
|
|
|
|
},
|
|
|
|
|
components: {
|
|
|
|
|
Layout: {
|
|
|
|
|
colorBgBody: '',
|
|
|
|
|
},
|
|
|
|
|
},
|
|
|
|
|
}}
|
|
|
|
|
>
|
|
|
|
|
<StyleProvider hashPriority="high">
|
|
|
|
|
<AntdApp>
|
|
|
|
|
<div className={$styles.app}>
|
|
|
|
|
<div className={$styles.container}>
|
|
|
|
|
欢迎来到3R教室,这是<span>React课程第一节</span>
|
|
|
|
|
<Button
|
|
|
|
|
type="primary"
|
|
|
|
|
className="!bg-lime-400 !text-emerald-900"
|
|
|
|
|
href="https://pincman.com/3r"
|
|
|
|
|
target="_blank"
|
|
|
|
|
>
|
|
|
|
|
点此打开
|
|
|
|
|
</Button>
|
2024-05-09 22:29:02 +00:00
|
|
|
|
<h2>文章列表</h2>
|
|
|
|
|
<ul>
|
|
|
|
|
{data.map((item) => (
|
|
|
|
|
<li key={item.id}>{item.title}</li>
|
|
|
|
|
))}
|
|
|
|
|
</ul>
|
2024-05-07 16:24:43 +00:00
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</AntdApp>
|
|
|
|
|
</StyleProvider>
|
|
|
|
|
</ConfigProvider>
|
|
|
|
|
);
|
|
|
|
|
};
|
|
|
|
|
export default App;
|