diff --git a/src/router/routes.ts b/src/router/routes.ts
index 1c40ba7..8950d82 100644
--- a/src/router/routes.ts
+++ b/src/router/routes.ts
@@ -115,13 +115,13 @@ export const routes: Array<RouteRecordRaw> = [
 					icon:IconComputer
 				},
 			},{
-				path: "/history/question/",
+				path: "/forum/index/",
 				name: "交流论坛",
-				component: () => import("../views/question/SubmitQuestion.vue"),
+				component: () => import("../views/forum/ForumView.vue"),
 				meta: {
 					hidden: false,
 					access: ACCESS_ENMU.NOT_LOGIN,
-					meta:IconUserGroup
+					icon:IconUserGroup
 				},
 			},
 			{
@@ -145,6 +145,13 @@ export const routes: Array<RouteRecordRaw> = [
 				meta:{
 					hidden: true,
 				}
+			},{
+				path: "/forum/publish",
+				name: "发布帖子",
+				component: () => import("../views/forum/ForumPublish.vue"),
+				meta:{
+					hidden: true,
+				}
 			},
 		]
 	}
diff --git a/src/views/forum/ForumPublish.vue b/src/views/forum/ForumPublish.vue
new file mode 100644
index 0000000..5833229
--- /dev/null
+++ b/src/views/forum/ForumPublish.vue
@@ -0,0 +1,83 @@
+<template>
+  <div class="forum-publish">
+    <h1>发布新帖子</h1>
+    <a-form :model="form" layout="vertical" @submit="handleSubmit">
+      <a-form-item
+        label="标题"
+        field="title"
+        :rules="[{ required: true, message: '请输入帖子标题' }]"
+      >
+        <a-input v-model="form.title" placeholder="请输入帖子标题" />
+      </a-form-item>
+      
+      <a-form-item
+        label="内容"
+        field="content"
+        :rules="[{ required: true, message: '请输入帖子内容' }]"
+      >
+        <a-textarea
+          v-model="form.content"
+          placeholder="请输入帖子内容"
+          rows="4"
+        />
+      </a-form-item>
+
+      <a-button type="primary" html-type="submit">发布</a-button>
+    </a-form>
+    
+    <a-message v-if="message" :type="messageType" :content="message" />
+  </div>
+</template>
+
+<script lang="ts" setup>
+import { ref } from 'vue';
+import { Message } from '@arco-design/web-vue';
+
+const form = ref({
+  title: '',
+  content: ''
+});
+
+const message = ref('');
+const messageType = ref('info'); // 'info' | 'success' | 'error'
+
+const handleSubmit = async (event: Event) => {
+  event.preventDefault();
+
+  // 简单验证示例
+  if (!form.value.title || !form.value.content) {
+    message.value = '请填写所有必填项';
+    messageType.value = 'error';
+    return;
+  }
+
+  // 这里可以添加 API 调用
+  try {
+    // 假设这是一个异步操作，比如调用 API
+    await new Promise((resolve) => setTimeout(resolve, 1000));
+    
+    // 提交成功
+    message.value = '帖子发布成功！';
+    messageType.value = 'success';
+    
+    // 重置表单
+    form.value.title = '';
+    form.value.content = '';
+  } catch (error) {
+    message.value = '发布帖子失败，请稍后重试';
+    messageType.value = 'error';
+  }
+};
+</script>
+
+<style scoped>
+.forum-publish {
+  padding: 20px;
+  background-color: #f0f2f5; /* 背景颜色 */
+  border-radius: 8px; /* 圆角 */
+}
+
+h1 {
+  margin-bottom: 20px; /* 标题与表单间距 */
+}
+</style>
diff --git a/src/views/forum/ForumView.vue b/src/views/forum/ForumView.vue
new file mode 100644
index 0000000..c2f6de1
--- /dev/null
+++ b/src/views/forum/ForumView.vue
@@ -0,0 +1,157 @@
+<template>
+  <div class="forum-home">
+    <!-- 顶部导航栏 -->
+    <a-layout>
+     
+
+      <a-layout-content>
+        <div class="content">
+          <a-row gutter={24}>
+            <!-- 侧边栏 -->
+            <a-col span="6">
+              <a-card title="分类" class="sidebar">
+                <a-menu mode="inline" theme="light">
+                  <a-menu-item key="category1">分类 1</a-menu-item>
+                  <a-menu-item key="category2">分类 2</a-menu-item>
+                  <a-menu-item key="category3">分类 3</a-menu-item>
+                </a-menu>
+              </a-card>
+            </a-col>
+
+            <!-- 主内容区域 -->
+						<a-list
+    class="list-demo-action-layout"
+    :bordered="false"
+    :data="dataSource"
+    :pagination-props="paginationProps"
+  >
+    <template #item="{ item }">
+      <a-list-item class="list-demo-item" action-layout="vertical">
+        <template #actions>
+          <span><icon-heart />83</span>
+          <span><icon-star />{{ item.index }}</span>
+          <span><icon-message />Reply</span>
+        </template>
+        <template #extra>
+          <div className="image-area">
+            <img alt="arco-design" :src="item.imageSrc" />
+          </div>
+        </template>
+        <a-list-item-meta
+          :title="item.title"
+          :description="item.description"
+        >
+          <template #avatar>
+            <a-avatar shape="square">
+              <img alt="avatar" :src="item.avatar" />
+            </a-avatar>
+          </template>
+        </a-list-item-meta>
+      </a-list-item>
+    </template>
+  </a-list>
+          </a-row>
+        </div>
+      </a-layout-content>
+
+      
+    </a-layout>
+  </div>
+</template>
+
+<script lang="ts" setup>
+import { ref,reactive } from 'vue';
+import { useRouter } from 'vue-router';
+const names = ['Socrates', 'Balzac', 'Plato'];
+const avatarSrc = [
+  '//p1-arco.byteimg.com/tos-cn-i-uwbnlip3yd/a8c8cdb109cb051163646151a4a5083b.png~tplv-uwbnlip3yd-webp.webp',
+  '//p1-arco.byteimg.com/tos-cn-i-uwbnlip3yd/e278888093bef8910e829486fb45dd69.png~tplv-uwbnlip3yd-webp.webp',
+  '//p1-arco.byteimg.com/tos-cn-i-uwbnlip3yd/9eeb1800d9b78349b24682c3518ac4a3.png~tplv-uwbnlip3yd-webp.webp',
+];
+const imageSrc = [
+  '//p1-arco.byteimg.com/tos-cn-i-uwbnlip3yd/29c1f9d7d17c503c5d7bf4e538cb7c4f.png~tplv-uwbnlip3yd-webp.webp',
+  '//p1-arco.byteimg.com/tos-cn-i-uwbnlip3yd/04d7bc31dd67dcdf380bc3f6aa07599f.png~tplv-uwbnlip3yd-webp.webp',
+  '//p1-arco.byteimg.com/tos-cn-i-uwbnlip3yd/1f61854a849a076318ed527c8fca1bbf.png~tplv-uwbnlip3yd-webp.webp',
+];
+
+const dataSource = new Array(15).fill(null).map((_, index) => {
+  return {
+    index: index,
+    avatar: avatarSrc[index % avatarSrc.length],
+    title: names[index % names.length],
+    description:
+      'Beijing ByteDance Technology Co., Ltd. is an enterprise located in China. ByteDance has products such as TikTok, Toutiao, volcano video and Douyin (the Chinese version of TikTok).',
+    imageSrc: imageSrc[index % imageSrc.length],
+  };
+});
+const paginationProps=reactive({
+        defaultPageSize: 3,
+        total: dataSource.length
+      })
+</script>
+
+<style scoped>
+.forum-home {
+  /* background-color: #f0f2f5; 背景颜色 */
+}
+.list-demo-action-layout {
+  width: 60%;
+  
+  border-radius: 2px;
+  overflow: hidden;
+}
+.list-demo-action-layout .image-area {
+  width: 183px;
+  height: 119px;
+  border-radius: 2px;
+  overflow: hidden;
+}
+
+.list-demo-action-layout .list-demo-item {
+  padding: 20px 0;
+  border-bottom: 1px solid var(--color-fill-3);
+}
+
+.list-demo-action-layout .image-area img {
+  width: 100%;
+}
+
+.list-demo-action-layout .arco-list-item-action .arco-icon {
+  margin: 0 4px;
+}
+.header {
+  background: #ffffff;
+  padding: 0 20px;
+  display: flex;
+  align-items: center;
+}
+
+.logo {
+  font-size: 24px;
+  font-weight: bold;
+  margin-right: 20px;
+}
+
+.nav-menu {
+  flex-grow: 1;
+}
+
+.content {
+  padding: 80px;
+}
+
+.sidebar {
+  background: #ffffff;
+  border-radius: 8px;
+}
+
+.post-list {
+  background: #ffffff;
+  border-radius: 8px;
+}
+.footer {
+  text-align: center;
+  padding: 10px;
+  background: #ffffff;
+}
+</style>