1

src/other_pages/comment_reply/index.scss

@@ -12,44 +12,43 @@
   .navbar {
     height: 100px;
     background: #FFFFFF;
-    position: sticky;
+    flex-shrink: 0;
-    top: 0;
     z-index: 100;
 
     .navbar-content {
       height: 56px;
       display: flex;
       align-items: center;
-      justify-content: center;
       padding: 0 15px;
       margin-top: 44px;
-      position: relative;
+      gap: 12px;
 
       .back-button {
-        position: absolute;
+        width: 24px;
-        left: 10px;
+        height: 24px;
-        width: 32px;
-        height: 32px;
         display: flex;
         align-items: center;
         justify-content: center;
         cursor: pointer;
+        flex-shrink: 0;
+        margin-top: 2px;
 
         .back-icon {
-          width: 8px;
+          width: 10px;
-          height: 16px;
+          height: 10px;
           position: relative;
+          display: flex;
+          align-items: center;
+          justify-content: center;
 
           &::before {
             content: '';
             position: absolute;
-            top: 0;
+            width: 10px;
-            left: 0;
+            height: 10px;
-            width: 8px;
+            border-left: 2px solid #000000;
-            height: 8px;
+            border-bottom: 2px solid #000000;
-            border-left: 2.67px solid #000000;
+            transform: rotate(45deg) translateY(-1px);
-            border-bottom: 2.67px solid #000000;
-            transform: rotate(45deg);
           }
         }
       }
@@ -61,6 +60,7 @@
         line-height: 1.4;
         letter-spacing: 0.019em;
         color: #000000;
+        flex: 1;
       }
     }
   }
@@ -68,8 +68,10 @@
   // 评论列表滚动区域
   .comment-scroll {
     flex: 1;
-    height: 100%;
+    height: 0;
     padding: 0 15px;
+    box-sizing: border-box;
+    overflow-y: auto;
   }
 
   // 评论列表
@@ -84,6 +86,7 @@
     gap: 12px;
     padding: 16px 0;
     border-bottom: 0.5px solid rgba(0, 0, 0, 0.08);
+    box-sizing: border-box;
 
     .comment-left {
       display: flex;

src/other_pages/comment_reply/index.tsx

@@ -19,6 +19,8 @@ interface CommentReplyItem {
   activity_image: string;
   activity_id: number;
   activity_title: string;
+  parent_id: number | null; // 父评论ID，用于回复
+  game_id: number; // 球局ID
 }
 
 const CommentReply = () => {
@@ -56,9 +58,11 @@ const CommentReply = () => {
           time: item.create_time,
           content: item.content || "",
           original_comment: item.parent_comment?.content || "",
-          activity_image: item.game?.image_list?.[0] || "",
+          activity_image: item.game?.image || "",
           activity_id: item.game_id,
           activity_title: item.game?.title || "",
+          parent_id: item.parent_id,
+          game_id: item.game_id,
         }));
 
         setCommentList(mappedList);
@@ -136,26 +140,38 @@ const CommentReply = () => {
     }
 
     try {
-      // TODO: 调用回复接口
+      // 调用回复接口
-      // await commentService.replyComment(replyTarget.id, replyContent);
+      // 如果是回复评论，parent_id 使用评论的 parent_id 或 id
+      // 如果是顶级评论，parent_id 为 null，则使用评论的 id 作为 parent_id
+      const parentId = replyTarget.parent_id || replyTarget.id;
+      
+      const res = await commentService.replyComment(
+        parentId,
+        replyTarget.user_id,
+        replyContent.trim()
+      );
 
+      if (res.code === 0) {
+        Taro.showToast({
+          title: "回复成功",
+          icon: "success",
+          duration: 2000,
+        });
+
+        // 关闭输入框
+        setShowReplyInput(false);
+        setReplyTarget(null);
+        setReplyContent("");
+        setInputFocus(false);
+
+        // 刷新列表
+        getCommentReplyList();
+      } else {
+        throw new Error(res.message || "回复失败");
+      }
+    } catch (e: any) {
       Taro.showToast({
-        title: "回复成功",
+        title: e.message || "回复失败",
-        icon: "success",
-        duration: 2000,
-      });
-
-      // 关闭输入框
-      setShowReplyInput(false);
-      setReplyTarget(null);
-      setReplyContent("");
-      setInputFocus(false);
-
-      // 刷新列表
-      getCommentReplyList();
-    } catch (e) {
-      Taro.showToast({
-        title: "回复失败",
         icon: "none",
         duration: 2000,
       });
@@ -173,9 +189,9 @@ const CommentReply = () => {
   // 输入框失去焦点
   const handleInputBlur = () => {
     // 延迟执行，避免点击发送按钮时输入框先失焦导致发送失败
-    // setTimeout(() => {
+    setTimeout(() => {
-    //   handleCancelReply();
+      handleCancelReply();
-    // }, 200);
+    }, 200);
   };
 
   // 处理返回
@@ -202,9 +218,11 @@ const CommentReply = () => {
           time: item.create_time,
           content: item.content || "",
           original_comment: item.parent_comment?.content || "",
-          activity_image: item.game?.image_list?.[0] || "",
+          activity_image: item.game?.image || "",
           activity_id: item.game_id,
           activity_title: item.game?.title || "",
+          parent_id: item.parent_id,
+          game_id: item.game_id,
         }));
 
         setCommentList(mappedList);
@@ -277,6 +295,12 @@ const CommentReply = () => {
           className="activity-image"
           src={item.activity_image}
           mode="aspectFill"
+          onClick={(e) => {
+            e.stopPropagation();
+            Taro.navigateTo({
+              url: `/game_pages/detail/index?id=${item.game_id}`,
+            });
+          }}
         />
       </View>
     );

src/other_pages/new_follow/index.scss

@@ -12,44 +12,43 @@
   .navbar {
     height: 100px;
     background: #FFFFFF;
-    position: sticky;
+    flex-shrink: 0;
-    top: 0;
     z-index: 100;
 
     .navbar-content {
       height: 56px;
       display: flex;
       align-items: center;
-      justify-content: center;
       padding: 0 15px;
       margin-top: 44px;
-      position: relative;
+      gap: 12px;
 
       .back-button {
-        position: absolute;
+        width: 24px;
-        left: 10px;
+        height: 24px;
-        width: 32px;
-        height: 32px;
         display: flex;
         align-items: center;
         justify-content: center;
         cursor: pointer;
+        flex-shrink: 0;
+        margin-top: 2px;
 
         .back-icon {
-          width: 8px;
+          width: 10px;
-          height: 16px;
+          height: 10px;
           position: relative;
+          display: flex;
+          align-items: center;
+          justify-content: center;
 
           &::before {
             content: '';
             position: absolute;
-            top: 0;
+            width: 10px;
-            left: 0;
+            height: 10px;
-            width: 8px;
+            border-left: 2px solid #000000;
-            height: 8px;
+            border-bottom: 2px solid #000000;
-            border-left: 2.67px solid #000000;
+            transform: rotate(45deg) translateY(-1px);
-            border-bottom: 2.67px solid #000000;
-            transform: rotate(45deg);
           }
         }
       }
@@ -61,6 +60,7 @@
         line-height: 1.4;
         letter-spacing: 0.019em;
         color: #000000;
+        flex: 1;
       }
     }
   }
@@ -68,7 +68,8 @@
   // 关注列表滚动区域
   .follow-scroll {
     flex: 1;
-    height: 100%;
+    height: 0;
+    overflow-y: auto;
   }
 
   // 关注列表

src/services/commentService.ts

@@ -23,6 +23,7 @@ export interface CommentActivity {
     title: string;
     start_time: string;
     location_name: string;
+    image?: string;
     image_list?: string[];
   };
   reply_to_user: {