论坛，聊天室前后端对接
Change-Id: I90740329ab40dc050e8a791a382ab187900d673a
diff --git a/src/views/forum/ForumView.vue b/src/views/forum/ForumView.vue
index 28cdff2..703e4f5 100644
--- a/src/views/forum/ForumView.vue
+++ b/src/views/forum/ForumView.vue
@@ -67,10 +67,10 @@
<div class="section-info">
<h3 class="section-name">{{ section.name }}</h3>
<p class="section-description">{{ section.description }}</p>
- <div class="section-stats">
- <span class="stat">{{ section.topics }} 主题</span>
- <span class="stat">{{ section.replies }} 回复</span>
- </div>
+<!-- <div class="section-stats">-->
+<!-- <span class="stat">{{ section.topics }} 主题</span>-->
+<!-- <span class="stat">{{ section.replies }} 回复</span>-->
+<!-- </div>-->
</div>
<div class="section-latest">
<div v-if="section.latestTopic" class="latest-topic">
@@ -270,13 +270,21 @@
QuestionFilled,
Bell
} from '@element-plus/icons-vue'
-import Navbar from '@/components/Navbar.vue'
+import {
+ getAllTopics,
+ getTopicsByForum,
+ createTopic,
+ searchTopics
+} from '@/api/topic'
+import {
+ getAllForums,
+ getForumById
+} from '@/api/forum'
+import Navbar from "@/components/Navbar.vue";
export default {
name: 'ForumView',
- components:{
- Navbar
- },
+ components: {Navbar},
setup() {
const router = useRouter()
const topicFormRef = ref(null)
@@ -288,10 +296,10 @@
const tagInputValue = ref('')
const forumStats = reactive({
- totalTopics: '15,268',
- totalReplies: '89,456',
- activeUsers: '2,341',
- todayPosts: '156'
+ totalTopics: 0,
+ totalReplies: 0,
+ activeUsers: 0,
+ todayPosts: 0
})
const newTopic = reactive({
@@ -315,156 +323,83 @@
]
}
- const forumSections = ref([
- {
- id: 1,
- name: '电影讨论',
- description: '分享和讨论电影资源，交流观影心得',
- icon: 'Film',
- color: '#409eff',
- topics: 3256,
- replies: 18934,
- latestTopic: {
- title: '2024年最佳科幻电影推荐',
- author: 'MovieFan',
- time: '2025-06-03T14:30:00'
- }
- },
- {
- id: 2,
- name: '音乐分享',
- description: '音乐资源分享，音乐制作技术交流',
- icon: 'Headphones',
- color: '#67c23a',
- topics: 1892,
- replies: 9567,
- latestTopic: {
- title: '无损音乐格式对比分析',
- author: 'AudioExpert',
- time: '2025-06-03T13:45:00'
- }
- },
- {
- id: 3,
- name: '软件技术',
- description: '软件资源分享，技术问题讨论',
- icon: 'Monitor',
- color: '#e6a23c',
- topics: 2134,
- replies: 12456,
- latestTopic: {
- title: 'Adobe 2025 新功能体验分享',
- author: 'TechGuru',
- time: '2025-06-03T12:20:00'
- }
- },
- {
- id: 4,
- name: '游戏天地',
- description: '游戏资源分享，游戏攻略讨论',
- icon: 'GamePad',
- color: '#f56c6c',
- topics: 1567,
- replies: 8234,
- latestTopic: {
- title: '年度游戏大作盘点',
- author: 'GameMaster',
- time: '2025-06-03T11:50:00'
- }
- },
- {
- id: 5,
- name: '站务公告',
- description: '网站公告，规则说明，意见建议',
- icon: 'Bell',
- color: '#909399',
- topics: 234,
- replies: 1567,
- latestTopic: {
- title: '网站维护通知',
- author: 'Admin',
- time: '2025-06-03T10:00:00'
- }
- },
- {
- id: 6,
- name: '新手求助',
- description: '新手问题解答，使用教程分享',
- icon: 'QuestionFilled',
- color: '#606266',
- topics: 456,
- replies: 2890,
- latestTopic: {
- title: '新手如何提高分享率？',
- author: 'Newbie123',
- time: '2025-06-03T09:30:00'
- }
- }
- ])
+ const forumSections = ref([])
- const hotTopics = ref([
- {
- id: 1,
- title: '2024年度最佳PT站点推荐与对比分析',
- author: 'PTExpert',
- views: 2856,
- replies: 147,
- lastReply: '2025-06-03T14:25:00',
- tags: ['PT站点', '推荐', '对比'],
- pinned: true,
- hot: true
- },
- {
- id: 2,
- title: '如何安全高效地使用BT下载工具',
- author: 'SafeDownloader',
- views: 1932,
- replies: 89,
- lastReply: '2025-06-03T13:50:00',
- tags: ['BT工具', '安全', '教程'],
- hot: true
- },
- {
- id: 3,
- title: '分享率提升技巧与经验总结',
- author: 'SeedMaster',
- views: 1654,
- replies: 76,
- lastReply: '2025-06-03T12:40:00',
- tags: ['分享率', '技巧', '经验']
- }
- ])
+ const hotTopics = ref([])
+ const recentReplies = ref([])
- const recentReplies = ref([
- {
- id: 1,
- author: 'MovieLover88',
- topicId: 1,
- topicTitle: '阿凡达2观影感受分享',
- content: '画面效果确实震撼，特别是水下的场景...',
- time: '2025-06-03T14:45:00'
- },
- {
- id: 2,
- author: 'TechEnthusiast',
- topicId: 2,
- topicTitle: '最新版Photoshop使用技巧',
- content: '新的AI功能确实很强大，大大提高了工作效率...',
- time: '2025-06-03T14:30:00'
- },
- {
- id: 3,
- author: 'GameFan2024',
- topicId: 3,
- topicTitle: '赛博朋克2077最新更新体验',
- content: '修复了很多bug，现在游戏体验好多了...',
- time: '2025-06-03T14:15:00'
+ const loadForumData = async () => {
+ try {
+ // 获取所有论坛
+ const forums = await getAllForums()
+ forumSections.value = forums.map(forum => ({
+ id: forum.id,
+ name: forum.name,
+ description: forum.description,
+ icon: getForumIcon(forum.name),
+ color: getForumColor(forum.name),
+ topics: forum.topicCount || 0,
+ replies: forum.replyCount || 0,
+ latestTopic: forum.latestTopic ? {
+ title: forum.latestTopic.title,
+ author: forum.latestTopic.user?.username || '匿名用户',
+ time: forum.latestTopic.createTime
+ } : null
+ }))
+
+ // 获取所有主题
+ const topics = await getAllTopics()
+ hotTopics.value = topics.slice(0, 3).map(topic => ({
+ id: topic.id,
+ title: topic.title,
+ author: topic.user?.username || '匿名用户',
+ views: topic.views || 0,
+ replies: topic.replies || 0,
+ lastReply: topic.lastReplyTime,
+ tags: topic.tags || [],
+ pinned: topic.pinned || false,
+ hot: topic.views > 1000
+ }))
+
+ // 更新统计数据
+ forumStats.totalTopics = topics.length
+ forumStats.totalReplies = topics.reduce((sum, topic) => sum + (topic.replies || 0), 0)
+ forumStats.activeUsers = new Set(topics.map(topic => topic.user?.id)).size
+ forumStats.todayPosts = topics.filter(topic => {
+ const topicDate = new Date(topic.createTime)
+ const today = new Date()
+ return topicDate.toDateString() === today.toDateString()
+ }).length
+
+ } catch (error) {
+ console.error('加载论坛数据失败:', error)
+ ElMessage.error('加载论坛数据失败')
}
- ])
+ }
- onMounted(() => {
- // 初始化论坛数据
- })
+ const getForumIcon = (name) => {
+ const iconMap = {
+ '电影讨论': 'Film',
+ '音乐分享': 'Headphones',
+ '软件技术': 'Monitor',
+ '游戏天地': 'GamePad',
+ '站务公告': 'Bell',
+ '新手求助': 'QuestionFilled'
+ }
+ return iconMap[name] || 'ChatLineRound'
+ }
+
+ const getForumColor = (name) => {
+ const colorMap = {
+ '电影讨论': '#409eff',
+ '音乐分享': '#67c23a',
+ '软件技术': '#e6a23c',
+ '游戏天地': '#f56c6c',
+ '站务公告': '#909399',
+ '新手求助': '#606266'
+ }
+ return colorMap[name] || '#409eff'
+ }
const formatTime = (timeString) => {
const date = new Date(timeString)
@@ -537,18 +472,28 @@
submitting.value = true
- // 模拟提交过程
- await new Promise(resolve => setTimeout(resolve, 1500))
+ const topicData = {
+ title: newTopic.title,
+ content: newTopic.content,
+ forumId: newTopic.sectionId,
+ tags: newTopic.tags
+ }
+
+ const response = await createTopic(topicData)
ElMessage.success('主题发布成功！')
resetForm()
showNewTopicDialog.value = false
+ // 刷新论坛数据
+ await loadForumData()
+
// 跳转到新创建的主题页面
- router.push('/forum/topic/new')
+ router.push(`/forum/topic/${response.id}`)
} catch (error) {
- console.error('表单验证失败:', error)
+ console.error('发布主题失败:', error)
+ ElMessage.error('发布主题失败')
} finally {
submitting.value = false
}
@@ -562,6 +507,10 @@
newTopic.tags = []
}
+ onMounted(() => {
+ loadForumData()
+ })
+
return {
showNewTopicDialog,
submitting,
@@ -594,7 +543,10 @@
Monitor,
GamePad,
Bell,
- QuestionFilled
+ QuestionFilled,
+ loadForumData,
+ getForumIcon,
+ getForumColor
}
}
}