fix: 留言接入
This commit is contained in:
Shu Guang
parent
33ef6e7d20
commit
55c472b840
@ -95,6 +95,7 @@ const ForumAdmin: React.FC = () => {
|
||||
{
|
||||
title: '标签',
|
||||
dataIndex: 'tagList',
|
||||
width: 200,
|
||||
render: (tags: string[]) => (
|
||||
<>
|
||||
{tags?.map(tag => (
|
||||
|
||||
@ -156,13 +156,7 @@ const UserManage: React.FC = () => {
|
||||
return <span>普通用户</span>;
|
||||
},
|
||||
},
|
||||
{
|
||||
title: '简介',
|
||||
dataIndex: 'userProfile',
|
||||
width: 200,
|
||||
align: 'center',
|
||||
ellipsis: true,
|
||||
},
|
||||
|
||||
{
|
||||
title: '创建时间',
|
||||
dataIndex: 'createTime',
|
||||
@ -233,9 +227,9 @@ const UserManage: React.FC = () => {
|
||||
<Form.Item name="userAvatar" label="头像链接">
|
||||
<Input />
|
||||
</Form.Item>
|
||||
<Form.Item name="userProfile" label="简介">
|
||||
{/* <Form.Item name="userProfile" label="简介">
|
||||
<Input.TextArea rows={3} />
|
||||
</Form.Item>
|
||||
</Form.Item> */}
|
||||
<Form.Item name="userRole" label="角色" rules={[{ required: true, message: '请选择角色' }]}>
|
||||
<Select>
|
||||
<Option value="user">普通用户</Option>
|
||||
|
||||
@ -1,5 +1,5 @@
|
||||
import React, { useState, useEffect } from 'react';
|
||||
import { useParams } from '@umijs/max';
|
||||
import { useParams, useModel } from '@umijs/max';
|
||||
import {
|
||||
Card,
|
||||
Avatar,
|
||||
@ -22,56 +22,37 @@ import {
|
||||
import { getPostVoByIdUsingGet } from '@/services/hebi/postController';
|
||||
import { doThumbUsingPost } from '@/services/hebi/postThumbController';
|
||||
import { doPostFavourUsingPost } from '@/services/hebi/postFavourController';
|
||||
import dayjs from 'dayjs';
|
||||
import MDEditor from '@uiw/react-md-editor';
|
||||
import '@uiw/react-md-editor/markdown-editor.css';
|
||||
import '@uiw/react-markdown-preview/markdown.css';
|
||||
import { getCommentListByPostIdUsingGet, addCommentUsingPost } from '@/services/hebi/commentController';
|
||||
import dayjs from 'dayjs';
|
||||
import MDEditor from '@uiw/react-md-editor';
|
||||
import '@uiw/react-md-editor/markdown-editor.css';
|
||||
import '@uiw/react-markdown-preview/markdown.css';
|
||||
|
||||
const { Title } = Typography;
|
||||
const { TextArea } = Input;
|
||||
|
||||
|
||||
|
||||
import { useModel } from '@umijs/max'; // 新增
|
||||
|
||||
const ForumDetail: React.FC = () => {
|
||||
const { initialState } = useModel('@@initialState'); // 获取当前登录用户信息
|
||||
const { initialState } = useModel('@@initialState');
|
||||
const currentUser = initialState?.currentUser;
|
||||
const { id } = useParams();
|
||||
const [liked, setLiked] = useState(false);
|
||||
const [collected, setCollected] = useState(false);
|
||||
const [comment, setComment] = useState('');
|
||||
// mock 评论数据
|
||||
const [comments, setComments] = useState([
|
||||
{
|
||||
id: 1,
|
||||
author: '小明',
|
||||
avatar: 'https://joeschmoe.io/api/v1/1',
|
||||
content: '很棒的分享，受益匪浅！',
|
||||
createTime: '2025-05-15 10:00:00',
|
||||
likes: 2,
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
author: 'AI助手',
|
||||
avatar: 'https://joeschmoe.io/api/v1/2',
|
||||
content: '请问有完整代码示例吗？',
|
||||
createTime: '2025-05-15 11:20:00',
|
||||
likes: 1,
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
author: '匿名用户',
|
||||
avatar: 'https://joeschmoe.io/api/v1/random',
|
||||
content: '期待更多相关内容！',
|
||||
createTime: '2025-05-15 12:45:00',
|
||||
likes: 0,
|
||||
},
|
||||
]);
|
||||
|
||||
// 帖子详情状态
|
||||
|
||||
// 帖子相关状态
|
||||
const [post, setPost] = useState<any>(null);
|
||||
const [loading, setLoading] = useState(true);
|
||||
const [liked, setLiked] = useState(false);
|
||||
const [collected, setCollected] = useState(false);
|
||||
|
||||
// 评论相关状态
|
||||
const [comments, setComments] = useState<API.CommentVO[]>([]);
|
||||
const [comment, setComment] = useState('');
|
||||
const [commentLoading, setCommentLoading] = useState(false);
|
||||
|
||||
// 判断是否是当前用户的帖子
|
||||
const isMyPost = currentUser?.id === post?.userId;
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
// 拉取帖子详情
|
||||
useEffect(() => {
|
||||
@ -92,7 +73,7 @@ const ForumDetail: React.FC = () => {
|
||||
// 点赞处理
|
||||
const handleLike = async () => {
|
||||
try {
|
||||
const res = await doThumbUsingPost({ postId: id }); // 直接传字符串 id
|
||||
const res = await doThumbUsingPost({ postId: id });
|
||||
if (res && res.code === 0) {
|
||||
setLiked(!liked);
|
||||
message.success(liked ? '已取消点赞' : '点赞成功');
|
||||
@ -104,25 +85,6 @@ const ForumDetail: React.FC = () => {
|
||||
}
|
||||
};
|
||||
|
||||
const handleSubmitComment = () => {
|
||||
if (!comment.trim()) {
|
||||
message.warning('请输入评论内容');
|
||||
return;
|
||||
}
|
||||
// 提交评论
|
||||
const newComment = {
|
||||
id: comments.length + 1,
|
||||
author: '当前用户',
|
||||
avatar: 'https://joeschmoe.io/api/v1/random',
|
||||
content: comment,
|
||||
createTime: new Date().toLocaleString(),
|
||||
likes: 0,
|
||||
};
|
||||
setComments([newComment, ...comments]);
|
||||
message.success('评论成功');
|
||||
setComment('');
|
||||
};
|
||||
|
||||
// 收藏处理
|
||||
const handleFavour = async () => {
|
||||
try {
|
||||
@ -138,9 +100,59 @@ const ForumDetail: React.FC = () => {
|
||||
}
|
||||
};
|
||||
|
||||
// 判断是否是当前用户的帖子
|
||||
const isMyPost = currentUser?.id === post?.userId;
|
||||
|
||||
|
||||
// 添加获取评论列表的 effect
|
||||
useEffect(() => {
|
||||
const fetchComments = async () => {
|
||||
if (!id) return;
|
||||
try {
|
||||
const res = await getCommentListByPostIdUsingGet({ postId: id });
|
||||
if (res && res.code === 0 && res.data) {
|
||||
setComments(res.data);
|
||||
}
|
||||
} catch (error) {
|
||||
message.error('获取评论失败');
|
||||
}
|
||||
};
|
||||
fetchComments();
|
||||
}, [id]);
|
||||
|
||||
// 修改提交评论的处理函数
|
||||
const handleSubmitComment = async () => {
|
||||
if (!comment.trim()) {
|
||||
message.warning('请输入评论内容');
|
||||
return;
|
||||
}
|
||||
setCommentLoading(true);
|
||||
try {
|
||||
const res = await addCommentUsingPost({
|
||||
content: comment.trim(),
|
||||
postId: id,
|
||||
});
|
||||
if (res && res.code === 0) {
|
||||
message.success('评论成功');
|
||||
setComment('');
|
||||
// 重新获取评论列表
|
||||
const commentsRes = await getCommentListByPostIdUsingGet({ postId: id });
|
||||
if (commentsRes && commentsRes.code === 0 && commentsRes.data) {
|
||||
setComments(commentsRes.data);
|
||||
// 获取最新的帖子信息（包括评论数等）
|
||||
const postRes = await getPostVoByIdUsingGet({ id });
|
||||
if (postRes && postRes.code === 0 && postRes.data) {
|
||||
setPost(postRes.data);
|
||||
}
|
||||
}
|
||||
} else {
|
||||
message.error(res?.message || '评论失败');
|
||||
}
|
||||
} catch (error) {
|
||||
message.error('评论失败');
|
||||
}
|
||||
setCommentLoading(false);
|
||||
};
|
||||
|
||||
// 在 return 部分修改评论区渲染
|
||||
return (
|
||||
<Card loading={loading}>
|
||||
<article>
|
||||
@ -209,7 +221,7 @@ const ForumDetail: React.FC = () => {
|
||||
placeholder="写下你的评论..."
|
||||
style={{ marginBottom: 16 }}
|
||||
/>
|
||||
<Button type="primary" onClick={handleSubmitComment}>
|
||||
<Button type="primary" onClick={handleSubmitComment} loading={commentLoading}>
|
||||
发表评论
|
||||
</Button>
|
||||
|
||||
@ -218,20 +230,14 @@ const ForumDetail: React.FC = () => {
|
||||
itemLayout="horizontal"
|
||||
dataSource={comments}
|
||||
renderItem={(item) => (
|
||||
<List.Item
|
||||
actions={[
|
||||
<Button type="text" icon={<LikeOutlined />} key="list-loadmore-like">
|
||||
{item.likes}
|
||||
</Button>,
|
||||
]}
|
||||
>
|
||||
<List.Item>
|
||||
<List.Item.Meta
|
||||
avatar={<Avatar src={item.avatar} />}
|
||||
avatar={<Avatar src={item.userAvatar || 'https://joeschmoe.io/api/v1/random'} />}
|
||||
title={
|
||||
<Space>
|
||||
<span>{item.author}</span>
|
||||
<span>{item.userName || '匿名用户'}</span>
|
||||
<span style={{ color: 'rgba(0, 0, 0, 0.45)', fontSize: '14px' }}>
|
||||
{item.createTime}
|
||||
{item.createTime ? dayjs(item.createTime).format('YYYY-MM-DD HH:mm:ss') : ''}
|
||||
</span>
|
||||
</Space>
|
||||
}
|
||||
|
||||
@ -343,7 +343,7 @@ const HomePage: React.FC = () => {
|
||||
<Space direction="vertical" style={{ width: '100%' }}>
|
||||
<Statistic
|
||||
title="当前活跃用户"
|
||||
value={totalUsers * 0.8}
|
||||
value={Math.ceil(totalUsers * 0.8)}
|
||||
prefix={<UserOutlined />}
|
||||
/>
|
||||
<Progress
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user