diff --git a/Touchkebao/src/pages/pc/ckbox/weChat/components/ChatWindow/components/MessageEnter/MessageEnter.module.scss b/Touchkebao/src/pages/pc/ckbox/weChat/components/ChatWindow/components/MessageEnter/MessageEnter.module.scss
index 744a1e76..e65d7823 100644
--- a/Touchkebao/src/pages/pc/ckbox/weChat/components/ChatWindow/components/MessageEnter/MessageEnter.module.scss
+++ b/Touchkebao/src/pages/pc/ckbox/weChat/components/ChatWindow/components/MessageEnter/MessageEnter.module.scss
@@ -436,3 +436,41 @@
     opacity: 1;
   }
 }
+
+// 加载文字和取消按钮同行容器
+.aiLoadingTextRow {
+  display: flex;
+  align-items: center;
+  gap: 12px;
+}
+
+// 取消AI按钮（显眼版）
+.cancelAiButton {
+  height: 28px;
+  padding: 0 12px;
+  font-size: 13px;
+  border-radius: 6px;
+  border: 1px solid #ff7875;
+  background: #fff;
+  color: #ff4d4f;
+  font-weight: 500;
+  transition: all 0.2s ease;
+  box-shadow: 0 2px 4px rgba(255, 77, 79, 0.15);
+
+  &:hover {
+    color: #fff;
+    background: #ff4d4f;
+    border-color: #ff4d4f;
+    box-shadow: 0 4px 8px rgba(255, 77, 79, 0.3);
+    transform: translateY(-1px);
+  }
+
+  &:active {
+    transform: translateY(0);
+    box-shadow: 0 2px 4px rgba(255, 77, 79, 0.2);
+  }
+
+  .anticon {
+    font-size: 12px;
+  }
+}
diff --git a/Touchkebao/src/pages/pc/ckbox/weChat/components/ChatWindow/components/MessageEnter/index.tsx b/Touchkebao/src/pages/pc/ckbox/weChat/components/ChatWindow/components/MessageEnter/index.tsx
index ca6de5bb..b6733e5c 100644
--- a/Touchkebao/src/pages/pc/ckbox/weChat/components/ChatWindow/components/MessageEnter/index.tsx
+++ b/Touchkebao/src/pages/pc/ckbox/weChat/components/ChatWindow/components/MessageEnter/index.tsx
@@ -1,5 +1,5 @@
 import React, { useEffect, useState } from "react";
-import { Layout, Input, Button, Modal } from "antd";
+import { Layout, Input, Button, Modal, message } from "antd";
 import {
   SendOutlined,
   FolderOutlined,
@@ -46,12 +46,27 @@ const MessageEnter: React.FC<MessageEnterProps> = ({ contract }) => {
     state => state.quoteMessageContent,
   );
   const isLoadingAiChat = useWeChatStore(state => state.isLoadingAiChat);
+  const updateIsLoadingAiChat = useWeChatStore(
+    state => state.updateIsLoadingAiChat,
+  );
+  const updateQuoteMessageContent = useWeChatStore(
+    state => state.updateQuoteMessageContent,
+  );
   useEffect(() => {
     if (quoteMessageContent) {
       setInputValue(quoteMessageContent);
     }
   }, [quoteMessageContent]);
 
+  // 取消AI生成
+  const handleCancelAi = () => {
+    // 停止AI加载状态
+    updateIsLoadingAiChat(false);
+    // 清空AI回复内容
+    updateQuoteMessageContent("");
+    message.info("已取消AI生成");
+  };
+
   const handleSend = async () => {
     if (!inputValue.trim()) return;
     const messageId = +Date.now();
@@ -219,13 +234,23 @@ const MessageEnter: React.FC<MessageEnterProps> = ({ contract }) => {
                   <div className={styles.wave3}></div>
                 </div>
               </div>
-              <div className={styles.aiLoadingText}>
-                <span className={styles.loadingTextMain}>AI 正在思考</span>
-                <span className={styles.loadingDots}>
-                  <span>.</span>
-                  <span>.</span>
-                  <span>.</span>
-                </span>
+              <div className={styles.aiLoadingTextRow}>
+                <div className={styles.aiLoadingText}>
+                  <span className={styles.loadingTextMain}>AI 正在思考</span>
+                  <span className={styles.loadingDots}>
+                    <span>.</span>
+                    <span>.</span>
+                    <span>.</span>
+                  </span>
+                </div>
+                <Button
+                  className={styles.cancelAiButton}
+                  onClick={handleCancelAi}
+                  size="small"
+                  icon={<CloseOutlined />}
+                >
+                  取消生成
+                </Button>
               </div>
               <div className={styles.aiLoadingSubText}>
                 正在分析消息内容，为您生成智能回复