diff --git a/frontend/src/pages/ForumDetail.jsx b/frontend/src/pages/ForumDetail.jsx index f2e481e..0ed9116 100644 --- a/frontend/src/pages/ForumDetail.jsx +++ b/frontend/src/pages/ForumDetail.jsx @@ -1,6 +1,6 @@ import React, { useState, useEffect } from 'react'; import { useParams, useNavigate } from 'react-router-dom'; -import { Typography, Card, Avatar, Tag, Space, Button, Divider, Input, message, Upload, Tooltip, Grid } from 'antd'; +import { Typography, Card, Avatar, Tag, Space, Button, Divider, Input, message, Upload, Tooltip, Grid, Modal } from 'antd'; import { UserOutlined, ClockCircleOutlined, EyeOutlined, CheckCircleFilled, LeftOutlined, UploadOutlined, EditOutlined } from '@ant-design/icons'; import { getTopicDetail, createReply, uploadMedia, getStarUsers } from '../api'; import { useAuth } from '../context/AuthContext'; @@ -44,6 +44,10 @@ const ForumDetail = () => { // Star Users State const [starUsers, setStarUsers] = useState([]); + // User Info Modal State + const [userInfoModalVisible, setUserInfoModalVisible] = useState(false); + const [selectedUser, setSelectedUser] = useState(null); + const fetchTopic = async () => { try { const res = await getTopicDetail(id); @@ -82,8 +86,9 @@ const ForumDetail = () => { }; const showUserTitle = (author) => { - if (author?.is_star || author?.title) { - message.info(author.title || '技术专家'); + if (author) { + setSelectedUser(author); + setUserInfoModalVisible(true); } }; @@ -414,6 +419,41 @@ const ForumDetail = () => { onClose={() => setLoginModalVisible(false)} onLoginSuccess={() => {}} /> + + setUserInfoModalVisible(false)} + footer={null} + centered + width={300} + styles={{ body: { textAlign: 'center', padding: '30px 20px' } }} + > + {selectedUser && ( +
+ } + style={{ marginBottom: 16, border: '2px solid #f0f0f0' }} + /> + {selectedUser.nickname} + + {(selectedUser.is_star || selectedUser.title) && ( + + {selectedUser.title || '技术专家'} + + )} + + {selectedUser.is_verified_owner && ( +
+ + 已认证购买用户 +
+ )} +
+ )} +
{/* Edit Modal */}