From f00cc9a28e89e142d7f57927b8baf2510996fbf2 Mon Sep 17 00:00:00 2001
From: jeremygan2021 <jeremygan2021@gmail.com>
Date: Thu, 12 Feb 2026 14:20:03 +0800
Subject: [PATCH] new

---
 .../migrations/0005_topic_category.py         |  18 ++
 backend/community/models.py                   |   9 +
 backend/db.sqlite3                            | Bin 393216 -> 397312 bytes
 .../shop/__pycache__/models.cpython-312.pyc   | Bin 27346 -> 27594 bytes
 .../__pycache__/serializers.cpython-312.pyc   | Bin 15100 -> 15125 bytes
 ...027_wechatuser_is_star_wechatuser_title.py |  23 ++
 backend/shop/models.py                        |   5 +
 backend/shop/serializers.py                   |   4 +-
 frontend/src/App.jsx                          |   4 +
 frontend/src/api.js                           |  14 ++
 frontend/src/components/CreateTopicModal.jsx  |  77 +++++++
 frontend/src/components/Layout.jsx            |   7 +-
 frontend/src/pages/ForumDetail.jsx            | 205 ++++++++++++++++++
 frontend/src/pages/ForumList.jsx              | 190 ++++++++++++++++
 14 files changed, 553 insertions(+), 3 deletions(-)
 create mode 100644 backend/community/migrations/0005_topic_category.py
 create mode 100644 backend/shop/migrations/0027_wechatuser_is_star_wechatuser_title.py
 create mode 100644 frontend/src/components/CreateTopicModal.jsx
 create mode 100644 frontend/src/pages/ForumDetail.jsx
 create mode 100644 frontend/src/pages/ForumList.jsx

diff --git a/backend/community/migrations/0005_topic_category.py b/backend/community/migrations/0005_topic_category.py
new file mode 100644
index 0000000..f101bac
--- /dev/null
+++ b/backend/community/migrations/0005_topic_category.py
@@ -0,0 +1,18 @@
+# Generated by Django 6.0.1 on 2026-02-12 06:19
+
+from django.db import migrations, models
+
+
+class Migration(migrations.Migration):
+
+    dependencies = [
+        ('community', '0004_activity_banner_url_alter_activity_banner'),
+    ]
+
+    operations = [
+        migrations.AddField(
+            model_name='topic',
+            name='category',
+            field=models.CharField(choices=[('discussion', '技术讨论'), ('help', '求助问答'), ('share', '经验分享'), ('notice', '官方公告')], default='discussion', max_length=20, verbose_name='分类'),
+        ),
+    ]
diff --git a/backend/community/models.py b/backend/community/models.py
index 1c756f4..bbdd21d 100644
--- a/backend/community/models.py
+++ b/backend/community/models.py
@@ -71,6 +71,15 @@ class Topic(models.Model):
     论坛帖子/主题
     """
     title = models.CharField(max_length=200, verbose_name="标题")
+    
+    CATEGORY_CHOICES = (
+        ('discussion', '技术讨论'),
+        ('help', '求助问答'),
+        ('share', '经验分享'),
+        ('notice', '官方公告'),
+    )
+    category = models.CharField(max_length=20, choices=CATEGORY_CHOICES, default='discussion', verbose_name="分类")
+    
     content = models.TextField(verbose_name="内容", help_text="支持Markdown格式，支持插入图片")
     author = models.ForeignKey(WeChatUser, on_delete=models.CASCADE, related_name='topics', verbose_name="作者")
     
diff --git a/backend/db.sqlite3 b/backend/db.sqlite3
index 7c09cf05a082ff2c547d5100f6c2e69b1b3d5775..ba9ff15a30fa8ed25e3f477f1c36c156cd235ffb 100644
GIT binary patch
delta 957
zcmZuv-)~cO6#xF@w!6Lewp|8WG}~p@vazo4-R*wZjfFPL*aHYY%;<x9TbD+PTf40#
zWIVXuMHG2}+coeVWUQo#TZl&ED!u4X`(Q#$Obma4NCZhFga=|m<iR`33^9IBJ~=1n
zd(O%EoP6^6=KPgr>jmE(06^jy2msJs=nlg>U&cRBgn*MCF@429loqVR`J&)W5cm_E
zugrKG;rv0Jf~L1(*`t|h#`FQ>L~`P2B6mESoHbHeBb!UiKA*~^a+67&>HQ(5hkA6C
z^$+$$27B3_0lhyGi465n&=!tOWTvK$r&GB(##o<`%S@*xjEO`p`EF)*?mx|9y_*g6
z4n!($|6daJ%BPEh+DcE$%W}Hni@q&y_Xly%_3zO7z{XHzWlsV^eSv+*;3`9`$}sWT
zWEwsFe$gT>Bwqr`EAl00#96t?WXKPKKx#9wOOm8m3}~(Z|1pggciuabzqkCwZ`X@=
zKd+h${!dvtgBCr{mz8g;)i@TSwrb(umBJPO`Xl09BQ+d<(E~Lg9rT<PZ;6^Py6uN;
zVOpj>VxjM#R){t6K9xMQe<_kF%*&U_g6$8Ghl8+T4aNxzxO;(!o&Z^sKJq;F2;x{n
zQ7E_{xJT(N^h78)wuE0U&UnY|lNOmr;;C^nAnXVR;TeNRRieQ@zEdO3+*%^k&R!(P
zkl3xZZ=IgU&Y>N4yh>}3?_VPKdF>c>bK@JjPUNqFj|Yq7D}M7jU9+cePz!Tyg<ROw
z(wL)^5m>Hy*K5REA-A6z<wxpjl&ZGR!hb4TN6@yu+qxvF6S##W@GOeIis6O@;jZwB
zkW^|4Ls#qOXwrG;Y9+>o1Uzi^a4V1Y5o6e7n^8AEQl&oeRExRyAATRFcx#1fcEm&q
z;;&w#oh=TrX98_k-^pYq)x$@|)x)nHI>g^g!dAN544J$6w=3i&9@(Jn9G6JPX4J^f
zZ%_t1`TG_b<)4;F8}GV7$8gB(*sMMP$M~BYbQkX`krB9yr%PlQ_Vdq5WZXFgayk1F
zL`{zw7WmvG9)ulyCP*6j%}G4$(9rA4|9p-5R%<lcT&D@J<KJ-bx`QDH9gZmPD}Mv?
C>mF?Y

delta 841
zcma)4OK1~O6rDHkzD%Z*nf%mLs_i6GNo`c7Xhf{BDIyBGP;j9XOzH>x+v-AE6*E?)
zD@_}kYorvdkbo}K20GYA8br{A3%eF=5JB-9bf<#8wmaRpIE!=7;c__lrf$}zQnl$i
zZ$%J<Bu6U;<@hnMVl}BeNM3SF3pm|mxiTN!i>WEf8OhUGY|(F#qU`&rQnxmok@R{p
zT=d3IX^ucMjryC5Bda<IF)x}|Op-T6)1~qqqBbtLJG60byrcQ8kmwO2g4$qFr>d&$
z?Sg^#Hqt>Zkbi`IZFDf-C6)(YKmn4XrwEl_4dY2F#Z{4SUds{XSi@I;a*tKPQ-Cr}
zE|Hm6P`A0RD$|M~ZFW3ytY)Lk3u$hS4zw@Cs19H3cNus_T+4aBWm2G}g<L+0tAY@~
z??d1tVf-9|TCC4P51v6-gk4#vLCnG<`&uJ(w-U8Ll3*^AwhI!S5!6vR%zEjJ`-t{X
zGc-flQj-yS<u}eY={jAP>Gtfhd(&`1%%nVRxH$&}+X%vO3d(EplB-+s6QAJ#!u!9n
zktcK6u0;MP+biVR`mk{Xh7@b1<(C5cBgEQ+J94lfTVfG>KEc8$mzW<9mYC`ENr9c*
z5S=sNgAxnjxk=W5-%4!l*nQAv+fIyD^?aP^q^3wJzZ=HNFn@$5mGuZ7u}^Rx(5BV5
zYNM-5d8~Nl6V9hj-I1hzht4YOrr5_{rbA?w%W9Oc=NMg2)?jx8{P^@3jVYJ*S-KR6
zL`eTxtlG@LlT*xzP5q(|H#UP}@3q7a1Va<7$;l5TgaaK>3?3%6%87$#5{c7?PR1+)
z(<yNUew|`o8nZ&PYy%`>R&aj)GbMV+UVC~7$^<OKs>f;$g7%RdEGITE{5F}bs_w6<
jWV|!MLS#3lbFh?GH^=?xm}DlNPs3e1a|6;eUuN+?KIr)x

diff --git a/backend/shop/__pycache__/models.cpython-312.pyc b/backend/shop/__pycache__/models.cpython-312.pyc
index 50cf5ab16f6e1737eb90a57da304ca79605f47d5..183b20640c1c620c834af1919cc8ece9557dd82a 100644
GIT binary patch
delta 5678
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
GHU9<wfoKE(

delta 5652
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
L+kO?44wL;4_;Pn#

diff --git a/backend/shop/__pycache__/serializers.cpython-312.pyc b/backend/shop/__pycache__/serializers.cpython-312.pyc
index f41f618df36f7ece3372de7da3e84b76f984e49d..a0437bfed9bd83019011a1876871f2d89ac5f724 100644
GIT binary patch
delta 1560
zcmaKsUrgIo6vum@|4SWz)&lM5C@qvyER#4Ch9H`C6U8A_2@LWJV^x~KV86nMxPcOa
z%xy3@HqJzYG3pDtg#2LCX-rH^e9#!351PhgF~<0`7?ve!^uhbR#j)Vx@8Q#P&OPUz
zdwak4{ymmFW&hG{x9Y@aIe8)e{HlH0#OFh1p0XJDO_Q6foHDig(x!MqNsRWXX~SrI
zbTAgws}513HUI~JMh;t@yw`kRLB4QjbU);}<_zh)$vI=%eUJytkL2GY<G*KR8zOX5
z2WnT%-Q+ri^25MmKoQUiJT9heqJunSjTj>c__-ygz}O74nXg%^shK}B7ju#AQ)-v(
zZ`dm72s?AC=pmWfhSWCh&hb#2Otoc4`InreL2VQx{Ib1|p4NW0Pm!%t&JXm;$_|(v
zJiDurI%MT_?@{f6Ts={r)|jVcg}X#TFk9^wKWTlufB1yjgOVzNM3z8lsp><ZS74%y
zcR4)#Yr!|v#i`vD)Wg?ze@&fy*|FCa|2In=k)0Lz3U4}M2AKVec@7?N{zNTWN1>PK
zv^HAw8qqXcTyARRa@X;F)2NsQ<^<9fMd=^xOC%H}VHAETzLzqKnHT<qcd5{&edo%d
z+)32PYCo)b{>|-hUKD161Rl=RjA3YuU3-oiU~a8vfjuQpSzAOPqK*r)V%m3GH&;rc
zG{shrS1hyIbA(>kPJ5oADcR`~rV9Ww0G1szt7l=K6G$6I)OdePH6idSa2~h-VD&+x
z8iKt5Y)>e6FIRroEtf=N>M8b><nyu8Yxggr_Kn*UWcChs31ERc_n$;C$phYAN^U9P
z7RLhn+3YK(V_fE|r+2u=w=Rx0-|v@4>(HL?J82Ijq7DK7QN;*PmhY#NyjI?9Odw;C
z|19?y--nrz!7|KcuB#ZJW!W}W@gY6R&js2=(~UqqUFOZey7&Kjh#4lrTpDojkCh(L
z?61lyhioRr9YX`T_e{eT_$wR@9x}khIcsadF*4$i#lKe*3eq@tg_ewG5SZl6(6i!v
z4_8NXKSH1wNC7YKN_7`$n&I9_GOi(VhR=ov=qld~H`6(;tqE*}HKpc{EHm~XG_b}>
zt<!Y^`NM#`PqNp$aNpAwYG<;iGV>v@0q6nf;K?1LQeVLcE=15Gm6g%hTZrxummRTf
zg<0-U*p6<~I`N2YUp4h2zg<^I^IEEIoI0hf)-jj7S2eJ%03QRN0NZ!%bGTmsQ1#uF
zw~CQfo_%nGR=KJE#di7fwIM1`P`(uMdP<E-#mG~Xg<j;90eFYf=EkAn<70!dCiN@f
g;(jM?u%)3sH$s;VeDALN)?If?r>6*Ud&39+0NP7(3IG5A

delta 1504
zcmZvce@t6d6vul?`&!yQ>;kk<3beKqo@HwwlMFhjI%S*7I+Sc~mQkD1KuHJWwxDif
z6@P5(2Rb>ZBswyqCX;PR@rj%IkI}?`8i)SnteMedf0*na<BUHR|L~sMWe{SM_vyLk
z+;h%-Ip6!<nD}>G&dah%!+$?-Jd+G9$uAl#1KNR-LG9Dh^EyS3ZyTIo#H)tK4Xl#y
zVjcLK*@i)5OO>53U)Ef=I;Qo74a3vYb*Jn6rf+LnFl&6oZV|!1v?co1-!&ZUeoAh^
z8}4fLwy^^okI}lDu$@pv*g@DS8XPn=!8SZ@>V`-08&j3kNuf@>Wom{_DuNg6Wf(H&
zAk4RS!EOv#9)KYJB9}MpqOAlkf6}W5>7s*l6%VpY)VOH*)lkr9l9^Nj=j9kYsos&Z
zVBSXsD4F$9L8*t#9z1v7R_Nh*88vLx0X(DjZis5j_w%4q!Vd7if-V^!9bpm7HdI0%
z{#bq+_Tx&04<h(y#Wjh_7AkP5p#p!Zl*~g^wU00=y7ZITk49Sp`f<c|2SRGn?glub
zp01h$m_nDM26o_9$AEc?w!T6*ffpV1Fr(%jeh5yIN5sV8XZW%pN2BpnES-)gQmJV4
zLtw9QZyGorVjkL`5x^E_1Twts1$?mf2}6iGyV(TJ)FK>1cb%KJ-&VH=-c+$}FJwiJ
zw<xiZ@DhQJqZrvV*{3)P`Z1P_Czyd8CkdwsX9#pMMPh!kUnQ&-6mKQYDDi-celHXc
zN=b)ndlURvgRYyK&r;s}z2tju%w8woEXUfnoFnHPX59y2PQBrl0YW(0xEbp`)eyra
zlMVNHJn$~2J<EJ%iq{JfHSG0+MB`;Cny56&&BK12^w!TR7U>cN#xUOyk{Fq1(dw&{
zJ|MF=&jm6UaJO#=7KGYXe3#*2-nHj$$D55FxQxc8<uy%U6n|*iVj81dx-nr4xSg1*
z)Y+KmBBVG#QSrjXPK&f&#9?JSEb<Xnt9fM{B$^=`$8Ns@6FBCdm5!2Q5{=FK_%x%<
zz1FMbs3u$?JcnO4AApZk=f-0ospL6|=Qj<(r&t;Y!71DsXuRuICjx(KgF^X6Mmr1E
zbS9Qb#-qtYvB5-ioTb<yDlkHbh*E_22=8;?wKBW<MeA@$w%CXKpAd8eQbTy1wAgWq
zoZwJOg}#bPdxyO1Bqoz@RcEDZbhfVBl*Y%m7B3Pd3Eh=)OXzNm^wgEMXW=O!xsPe1
zxM=~hmI<E`J|_qvi_v^V%dZI}-2Yc)jv_fcx8(}taBuq&MSSJN_e%^~d=kV375Wv5
p62s2nKkc=qJWmJyq;H|CqrI$kKKOl2+jli>e`s{jiph>k{{iy0b*KOU

diff --git a/backend/shop/migrations/0027_wechatuser_is_star_wechatuser_title.py b/backend/shop/migrations/0027_wechatuser_is_star_wechatuser_title.py
new file mode 100644
index 0000000..9fdc0ae
--- /dev/null
+++ b/backend/shop/migrations/0027_wechatuser_is_star_wechatuser_title.py
@@ -0,0 +1,23 @@
+# Generated by Django 6.0.1 on 2026-02-12 06:19
+
+from django.db import migrations, models
+
+
+class Migration(migrations.Migration):
+
+    dependencies = [
+        ('shop', '0026_wechatuser_phone_number'),
+    ]
+
+    operations = [
+        migrations.AddField(
+            model_name='wechatuser',
+            name='is_star',
+            field=models.BooleanField(default=False, verbose_name='是否明星技术用户'),
+        ),
+        migrations.AddField(
+            model_name='wechatuser',
+            name='title',
+            field=models.CharField(blank=True, default='技术专家', max_length=50, verbose_name='专家头衔'),
+        ),
+    ]
diff --git a/backend/shop/models.py b/backend/shop/models.py
index f2e5d88..d0a30c0 100644
--- a/backend/shop/models.py
+++ b/backend/shop/models.py
@@ -20,6 +20,11 @@ class WeChatUser(models.Model):
     country = models.CharField(max_length=64, verbose_name="国家", blank=True)
     province = models.CharField(max_length=64, verbose_name="省份", blank=True)
     city = models.CharField(max_length=64, verbose_name="城市", blank=True)
+    
+    # 明星技术用户/专家标识
+    is_star = models.BooleanField(default=False, verbose_name="是否明星技术用户")
+    title = models.CharField(max_length=50, default="技术专家", verbose_name="专家头衔", blank=True)
+    
     created_at = models.DateTimeField(auto_now_add=True, verbose_name="创建时间")
     updated_at = models.DateTimeField(auto_now=True, verbose_name="更新时间")
 
diff --git a/backend/shop/serializers.py b/backend/shop/serializers.py
index 61ea115..7715f9d 100644
--- a/backend/shop/serializers.py
+++ b/backend/shop/serializers.py
@@ -22,8 +22,8 @@ class CommissionLogSerializer(serializers.ModelSerializer):
 class WeChatUserSerializer(serializers.ModelSerializer):
     class Meta:
         model = WeChatUser
-        fields = ['id', 'nickname', 'avatar_url', 'gender', 'country', 'province', 'city', 'phone_number']
-        read_only_fields = ['id', 'phone_number']
+        fields = ['id', 'nickname', 'avatar_url', 'gender', 'country', 'province', 'city', 'phone_number', 'is_star', 'title']
+        read_only_fields = ['id', 'phone_number', 'is_star', 'title']
 
 class DistributorSerializer(serializers.ModelSerializer):
     user_info = WeChatUserSerializer(source='user', read_only=True)
diff --git a/frontend/src/App.jsx b/frontend/src/App.jsx
index 0095f11..b218974 100644
--- a/frontend/src/App.jsx
+++ b/frontend/src/App.jsx
@@ -10,6 +10,8 @@ import ServiceDetail from './pages/ServiceDetail';
 import VCCourses from './pages/VCCourses';
 import VCCourseDetail from './pages/VCCourseDetail';
 import MyOrders from './pages/MyOrders';
+import ForumList from './pages/ForumList';
+import ForumDetail from './pages/ForumDetail';
 import 'antd/dist/reset.css';
 import './App.css';
 
@@ -24,6 +26,8 @@ function App() {
             <Route path="/services/:id" element={<ServiceDetail />} />
             <Route path="/courses" element={<VCCourses />} />
             <Route path="/courses/:id" element={<VCCourseDetail />} />
+            <Route path="/forum" element={<ForumList />} />
+            <Route path="/forum/:id" element={<ForumDetail />} />
             <Route path="/my-orders" element={<MyOrders />} />
             <Route path="/product/:id" element={<ProductDetail />} />
             <Route path="/payment/:orderId" element={<Payment />} />
diff --git a/frontend/src/api.js b/frontend/src/api.js
index e6aa74e..fa0f3c1 100644
--- a/frontend/src/api.js
+++ b/frontend/src/api.js
@@ -47,4 +47,18 @@ export const getUserInfo = () => {
     return api.post('/wechat/update/', {}); 
 };
 
+// Community / Forum API
+export const getTopics = (params) => api.get('/topics/', { params });
+export const getTopicDetail = (id) => api.get(`/topics/${id}/`);
+export const createTopic = (data) => api.post('/topics/', data);
+export const getReplies = (params) => api.get('/replies/', { params });
+export const createReply = (data) => api.post('/replies/', data);
+export const uploadMedia = (data) => {
+    return api.post('/media/', data, {
+        headers: {
+            'Content-Type': 'multipart/form-data',
+        }
+    });
+};
+
 export default api;
diff --git a/frontend/src/components/CreateTopicModal.jsx b/frontend/src/components/CreateTopicModal.jsx
new file mode 100644
index 0000000..9cd27e4
--- /dev/null
+++ b/frontend/src/components/CreateTopicModal.jsx
@@ -0,0 +1,77 @@
+import React, { useState } from 'react';
+import { Modal, Form, Input, Button, message, Upload } from 'antd';
+import { InboxOutlined } from '@ant-design/icons';
+import { createTopic } from '../api';
+
+const { TextArea } = Input;
+const { Dragger } = Upload;
+
+const CreateTopicModal = ({ visible, onClose, onSuccess }) => {
+  const [form] = Form.useForm();
+  const [loading, setLoading] = useState(false);
+
+  const handleSubmit = async (values) => {
+    setLoading(true);
+    try {
+      await createTopic(values);
+      message.success('发布成功');
+      form.resetFields();
+      if (onSuccess) onSuccess();
+      onClose();
+    } catch (error) {
+      console.error(error);
+      message.error('发布失败: ' + (error.response?.data?.detail || '网络错误'));
+    } finally {
+      setLoading(false);
+    }
+  };
+
+  return (
+    <Modal
+      title="发布新帖"
+      open={visible}
+      onCancel={onClose}
+      footer={null}
+      destroyOnClose
+    >
+      <Form
+        form={form}
+        layout="vertical"
+        onFinish={handleSubmit}
+        style={{ marginTop: 20 }}
+      >
+        <Form.Item
+          name="title"
+          label="标题"
+          rules={[{ required: true, message: '请输入标题' }, { max: 100, message: '标题最多100字' }]}
+        >
+          <Input placeholder="请输入清晰的问题或讨论标题" />
+        </Form.Item>
+
+        <Form.Item
+          name="content"
+          label="内容"
+          rules={[{ required: true, message: '请输入内容' }]}
+        >
+          <TextArea 
+            rows={6} 
+            placeholder="请详细描述您的问题，支持 Markdown 格式" 
+            showCount 
+            maxLength={5000}
+          />
+        </Form.Item>
+
+        <Form.Item>
+          <div style={{ display: 'flex', justifyContent: 'flex-end', gap: 10 }}>
+            <Button onClick={onClose}>取消</Button>
+            <Button type="primary" htmlType="submit" loading={loading}>
+              立即发布
+            </Button>
+          </div>
+        </Form.Item>
+      </Form>
+    </Modal>
+  );
+};
+
+export default CreateTopicModal;
diff --git a/frontend/src/components/Layout.jsx b/frontend/src/components/Layout.jsx
index 06d2592..3297921 100644
--- a/frontend/src/components/Layout.jsx
+++ b/frontend/src/components/Layout.jsx
@@ -1,6 +1,6 @@
 import React, { useState, useEffect } from 'react';
 import { Layout as AntLayout, Menu, ConfigProvider, theme, Drawer, Button, Avatar, Dropdown } from 'antd';
-import { RobotOutlined, MenuOutlined, AppstoreOutlined, EyeOutlined, SearchOutlined, UserOutlined, LogoutOutlined, WechatOutlined } from '@ant-design/icons';
+import { RobotOutlined, MenuOutlined, AppstoreOutlined, EyeOutlined, SearchOutlined, UserOutlined, LogoutOutlined, WechatOutlined, TeamOutlined } from '@ant-design/icons';
 import { useNavigate, useLocation, useSearchParams } from 'react-router-dom';
 import ParticleBackground from './ParticleBackground';
 import LoginModal from './LoginModal';
@@ -59,6 +59,11 @@ const Layout = ({ children }) => {
       icon: <EyeOutlined />,
       label: 'VC 课程',
     },
+    {
+      key: '/forum',
+      icon: <TeamOutlined />,
+      label: '技术论坛',
+    },
     {
       key: '/my-orders',
       icon: <SearchOutlined />,
diff --git a/frontend/src/pages/ForumDetail.jsx b/frontend/src/pages/ForumDetail.jsx
new file mode 100644
index 0000000..6703378
--- /dev/null
+++ b/frontend/src/pages/ForumDetail.jsx
@@ -0,0 +1,205 @@
+import React, { useState, useEffect } from 'react';
+import { useParams, useNavigate } from 'react-router-dom';
+import { Typography, Card, Avatar, Tag, Space, Button, Divider, Input, message, Breadcrumb, Tooltip } from 'antd';
+import { UserOutlined, ClockCircleOutlined, EyeOutlined, CheckCircleFilled, LeftOutlined, LikeOutlined } from '@ant-design/icons';
+import { getTopicDetail, createReply } from '../api';
+import { useAuth } from '../context/AuthContext';
+import LoginModal from '../components/LoginModal';
+
+const { Title, Text, Paragraph } = Typography;
+const { TextArea } = Input;
+
+const ForumDetail = () => {
+  const { id } = useParams();
+  const navigate = useNavigate();
+  const { user } = useAuth();
+  
+  const [loading, setLoading] = useState(true);
+  const [topic, setTopic] = useState(null);
+  const [replyContent, setReplyContent] = useState('');
+  const [submitting, setSubmitting] = useState(false);
+  const [loginModalVisible, setLoginModalVisible] = useState(false);
+
+  const fetchTopic = async () => {
+    try {
+      const res = await getTopicDetail(id);
+      setTopic(res.data);
+    } catch (error) {
+      console.error(error);
+      message.error('加载失败');
+    } finally {
+      setLoading(false);
+    }
+  };
+
+  useEffect(() => {
+    fetchTopic();
+  }, [id]);
+
+  const handleSubmitReply = async () => {
+    if (!user) {
+      setLoginModalVisible(true);
+      return;
+    }
+    if (!replyContent.trim()) {
+      message.warning('请输入回复内容');
+      return;
+    }
+
+    setSubmitting(true);
+    try {
+      await createReply({
+        topic: id,
+        content: replyContent
+      });
+      message.success('回复成功');
+      setReplyContent('');
+      fetchTopic(); // Refresh to show new reply
+    } catch (error) {
+      console.error(error);
+      message.error('回复失败');
+    } finally {
+      setSubmitting(false);
+    }
+  };
+
+  if (loading) return <div style={{ padding: 100, textAlign: 'center', color: '#fff' }}>Loading...</div>;
+  if (!topic) return <div style={{ padding: 100, textAlign: 'center', color: '#fff' }}>Topic not found</div>;
+
+  return (
+    <div style={{ padding: '40px 20px', minHeight: '100vh', maxWidth: 1000, margin: '0 auto' }}>
+      <Button 
+        type="text" 
+        icon={<LeftOutlined />} 
+        style={{ color: '#fff', marginBottom: 20 }}
+        onClick={() => navigate('/forum')}
+      >
+        返回列表
+      </Button>
+
+      {/* Topic Content */}
+      <Card
+        style={{ 
+          background: 'rgba(20,20,20,0.8)', 
+          border: '1px solid rgba(255,255,255,0.1)',
+          backdropFilter: 'blur(10px)',
+          marginBottom: 30
+        }}
+        bodyStyle={{ padding: '30px' }}
+      >
+        <div style={{ marginBottom: 20 }}>
+          {topic.is_pinned && <Tag color="red" style={{ marginRight: 10 }}>置顶</Tag>}
+          {topic.product_info && <Tag color="blue">{topic.product_info.name}</Tag>}
+          <Title level={2} style={{ color: '#fff', margin: '10px 0' }}>{topic.title}</Title>
+          
+          <Space size="large" style={{ color: '#888', marginTop: 10 }}>
+            <Space>
+               <Avatar src={topic.author_info?.avatar_url} icon={<UserOutlined />} />
+               <span style={{ color: '#ccc' }}>{topic.author_info?.nickname}</span>
+               {topic.is_verified_owner && (
+                 <Tooltip title="已验证购买过相关产品">
+                    <CheckCircleFilled style={{ color: '#00b96b' }} />
+                 </Tooltip>
+               )}
+            </Space>
+            <Space>
+               <ClockCircleOutlined />
+               <span>{new Date(topic.created_at).toLocaleString()}</span>
+            </Space>
+            <Space>
+               <EyeOutlined />
+               <span>{topic.view_count} 阅读</span>
+            </Space>
+          </Space>
+        </div>
+
+        <Divider style={{ borderColor: 'rgba(255,255,255,0.1)' }} />
+
+        <div style={{ 
+            color: '#ddd', 
+            fontSize: 16, 
+            lineHeight: 1.8, 
+            minHeight: 200,
+            whiteSpace: 'pre-wrap' // Preserve formatting
+        }}>
+            {topic.content}
+        </div>
+      </Card>
+
+      {/* Replies List */}
+      <div style={{ marginBottom: 30 }}>
+         <Title level={4} style={{ color: '#fff', marginBottom: 20 }}>
+             {topic.replies?.length || 0} 条回复
+         </Title>
+         
+         {topic.replies?.map((reply, index) => (
+             <Card
+                key={reply.id}
+                style={{ 
+                  background: 'rgba(255,255,255,0.05)', 
+                  border: 'none',
+                  marginBottom: 16,
+                  borderRadius: 8
+                }}
+             >
+                <div style={{ display: 'flex', gap: 16 }}>
+                    <Avatar src={reply.author_info?.avatar_url} icon={<UserOutlined />} />
+                    <div style={{ flex: 1 }}>
+                        <div style={{ display: 'flex', justifyContent: 'space-between', marginBottom: 8 }}>
+                            <Space>
+                                <Text style={{ color: '#aaa', fontWeight: 'bold' }}>{reply.author_info?.nickname}</Text>
+                                <Text style={{ color: '#666', fontSize: 12 }}>{new Date(reply.created_at).toLocaleString()}</Text>
+                            </Space>
+                            <Text style={{ color: '#444' }}>#{index + 1}</Text>
+                        </div>
+                        <div style={{ color: '#eee', whiteSpace: 'pre-wrap' }}>{reply.content}</div>
+                    </div>
+                </div>
+             </Card>
+         ))}
+      </div>
+
+      {/* Reply Form */}
+      <Card
+        style={{ 
+            background: 'rgba(20,20,20,0.8)', 
+            border: '1px solid rgba(255,255,255,0.1)' 
+        }}
+      >
+        <Title level={5} style={{ color: '#fff', marginBottom: 16 }}>发表回复</Title>
+        {user ? (
+            <>
+                <TextArea 
+                    rows={4} 
+                    value={replyContent}
+                    onChange={e => setReplyContent(e.target.value)}
+                    placeholder="友善回复，分享你的见解..."
+                    style={{ marginBottom: 16, background: '#111', border: '1px solid #333', color: '#fff' }}
+                />
+                <div style={{ textAlign: 'right' }}>
+                    <Button type="primary" onClick={handleSubmitReply} loading={submitting}>
+                        提交回复
+                    </Button>
+                </div>
+            </>
+        ) : (
+            <div style={{ textAlign: 'center', padding: 20 }}>
+                <Text style={{ color: '#888' }}>登录后参与讨论</Text>
+                <br/>
+                <Button type="primary" style={{ marginTop: 10 }} onClick={() => setLoginModalVisible(true)}>
+                    立即登录
+                </Button>
+            </div>
+        )}
+      </Card>
+
+      <LoginModal 
+        visible={loginModalVisible}
+        onClose={() => setLoginModalVisible(false)}
+        onLoginSuccess={() => {}}
+      />
+    </div>
+  );
+};
+
+export default ForumDetail;
diff --git a/frontend/src/pages/ForumList.jsx b/frontend/src/pages/ForumList.jsx
new file mode 100644
index 0000000..792f817
--- /dev/null
+++ b/frontend/src/pages/ForumList.jsx
@@ -0,0 +1,190 @@
+import React, { useState, useEffect } from 'react';
+import { Typography, Input, Button, List, Tag, Avatar, Card, Space, Spin, message, Badge, Tooltip } from 'antd';
+import { SearchOutlined, PlusOutlined, UserOutlined, MessageOutlined, EyeOutlined, CheckCircleFilled, FireOutlined } from '@ant-design/icons';
+import { useNavigate } from 'react-router-dom';
+import { motion } from 'framer-motion';
+import { getTopics } from '../api';
+import { useAuth } from '../context/AuthContext';
+import CreateTopicModal from '../components/CreateTopicModal';
+import LoginModal from '../components/LoginModal';
+
+const { Title, Text, Paragraph } = Typography;
+
+const ForumList = () => {
+  const navigate = useNavigate();
+  const { user } = useAuth();
+  
+  const [loading, setLoading] = useState(true);
+  const [topics, setTopics] = useState([]);
+  const [searchText, setSearchText] = useState('');
+  const [createModalVisible, setCreateModalVisible] = useState(false);
+  const [loginModalVisible, setLoginModalVisible] = useState(false);
+
+  const fetchTopics = async (search = '') => {
+    setLoading(true);
+    try {
+      const params = {};
+      if (search) params.search = search;
+      const res = await getTopics(params);
+      setTopics(res.data.results || res.data); // Support pagination result or list
+    } catch (error) {
+      console.error(error);
+      message.error('获取帖子列表失败');
+    } finally {
+      setLoading(false);
+    }
+  };
+
+  useEffect(() => {
+    fetchTopics();
+  }, []);
+
+  const handleSearch = (value) => {
+    setSearchText(value);
+    fetchTopics(value);
+  };
+
+  const handleCreateClick = () => {
+    if (!user) {
+      setLoginModalVisible(true);
+      return;
+    }
+    setCreateModalVisible(true);
+  };
+
+  return (
+    <div style={{ minHeight: '100vh', paddingBottom: 60 }}>
+      {/* Hero Section */}
+      <div style={{ 
+        textAlign: 'center', 
+        padding: '80px 20px 40px', 
+        background: 'linear-gradient(180deg, rgba(0,0,0,0) 0%, rgba(0,185,107,0.1) 100%)'
+      }}>
+        <motion.div
+          initial={{ opacity: 0, y: -20 }}
+          animate={{ opacity: 1, y: 0 }}
+          transition={{ duration: 0.6 }}
+        >
+          <Title level={1} style={{ color: '#fff', fontFamily: "'Orbitron', sans-serif", marginBottom: 10 }}>
+            <span style={{ color: '#00b96b' }}>Quant Speed</span> Developer Community
+          </Title>
+          <Text style={{ color: '#888', fontSize: 18, maxWidth: 600, display: 'block', margin: '0 auto 30px' }}>
+            技术交流 · 硬件开发 · 官方支持
+          </Text>
+        </motion.div>
+
+        <div style={{ maxWidth: 600, margin: '0 auto', display: 'flex', gap: 10 }}>
+          <Input 
+            size="large" 
+            placeholder="搜索感兴趣的话题..." 
+            prefix={<SearchOutlined style={{ color: '#666' }} />}
+            style={{ borderRadius: 8, background: 'rgba(255,255,255,0.1)', border: '1px solid #333', color: '#fff' }}
+            onChange={(e) => setSearchText(e.target.value)}
+            onPressEnter={(e) => handleSearch(e.target.value)}
+          />
+          <Button 
+            type="primary" 
+            size="large" 
+            icon={<PlusOutlined />} 
+            onClick={handleCreateClick}
+            style={{ height: 'auto', borderRadius: 8 }}
+          >
+            发布新帖
+          </Button>
+        </div>
+      </div>
+
+      {/* Content Section */}
+      <div style={{ maxWidth: 1000, margin: '0 auto', padding: '0 20px' }}>
+        <List
+          loading={loading}
+          itemLayout="vertical"
+          dataSource={topics}
+          renderItem={(item) => (
+            <motion.div
+              initial={{ opacity: 0, y: 10 }}
+              whileInView={{ opacity: 1, y: 0 }}
+              viewport={{ once: true }}
+            >
+              <Card
+                hoverable
+                style={{ 
+                  marginBottom: 16, 
+                  background: 'rgba(20,20,20,0.6)', 
+                  border: '1px solid rgba(255,255,255,0.1)',
+                  backdropFilter: 'blur(10px)'
+                }}
+                bodyStyle={{ padding: '20px 24px' }}
+                onClick={() => navigate(`/forum/${item.id}`)}
+              >
+                <div style={{ display: 'flex', justifyContent: 'space-between', alignItems: 'flex-start' }}>
+                  <div style={{ flex: 1 }}>
+                    <div style={{ marginBottom: 8 }}>
+                      {item.is_pinned && <Tag color="red">置顶</Tag>}
+                      {item.is_verified_owner && (
+                        <Tooltip title="已验证购买过相关产品">
+                          <Tag icon={<CheckCircleFilled />} color="#00b96b">认证用户</Tag>
+                        </Tooltip>
+                      )}
+                      <Text style={{ color: '#fff', fontSize: 18, fontWeight: 'bold', cursor: 'pointer' }}>
+                        {item.title}
+                      </Text>
+                    </div>
+                    
+                    <Paragraph 
+                      ellipsis={{ rows: 2 }} 
+                      style={{ color: '#aaa', marginBottom: 12, fontSize: 14 }}
+                    >
+                      {item.content.replace(/[#*`]/g, '')} {/* Simple markdown strip */}
+                    </Paragraph>
+
+                    <Space size="middle" style={{ color: '#666', fontSize: 13 }}>
+                      <Space>
+                        <Avatar src={item.author_info?.avatar_url} icon={<UserOutlined />} size="small" />
+                        <Text style={{ color: '#888' }}>{item.author_info?.nickname || '匿名用户'}</Text>
+                      </Space>
+                      <span>•</span>
+                      <span>{new Date(item.created_at).toLocaleDateString()}</span>
+                      {item.product_info && (
+                         <Tag color="blue" style={{ marginLeft: 8 }}>{item.product_info.name}</Tag>
+                      )}
+                    </Space>
+                  </div>
+
+                  <div style={{ display: 'flex', flexDirection: 'column', alignItems: 'flex-end', gap: 8, minWidth: 80 }}>
+                    <div style={{ textAlign: 'center' }}>
+                       <MessageOutlined style={{ fontSize: 16, color: '#00b96b' }} />
+                       <div style={{ color: '#fff', fontWeight: 'bold' }}>{item.replies?.length || 0}</div>
+                    </div>
+                    <div style={{ textAlign: 'center', marginTop: 5 }}>
+                       <EyeOutlined style={{ fontSize: 16, color: '#666' }} />
+                       <div style={{ color: '#888', fontSize: 12 }}>{item.view_count || 0}</div>
+                    </div>
+                  </div>
+                </div>
+              </Card>
+            </motion.div>
+          )}
+          locale={{ emptyText: <div style={{ color: '#666', padding: 40 }}>暂无帖子，来发布第一个吧！</div> }}
+        />
+      </div>
+
+      <CreateTopicModal 
+        visible={createModalVisible}
+        onClose={() => setCreateModalVisible(false)}
+        onSuccess={() => fetchTopics(searchText)}
+      />
+      
+      <LoginModal
+        visible={loginModalVisible}
+        onClose={() => setLoginModalVisible(false)}
+        onLoginSuccess={() => {
+             // 登录成功后自动打开发布框
+             setCreateModalVisible(true);
+        }}
+      />
+    </div>
+  );
+};
+
+export default ForumList;