diff --git a/src/apis/comment/comment-interfaces.ts b/src/apis/comment/comment-interfaces.ts
index ae1cf901..14527a8f 100644
--- a/src/apis/comment/comment-interfaces.ts
+++ b/src/apis/comment/comment-interfaces.ts
@@ -18,6 +18,7 @@ export interface NewCommentReq {
   text: string;
   id: string;
   firstLevelId?: string;
+  replyToUserId?: string;
   type: CommentType;
 }
 
diff --git a/src/pages/moment/CommentBox.vue b/src/pages/moment/CommentBox.vue
index d4562767..5a334888 100644
--- a/src/pages/moment/CommentBox.vue
+++ b/src/pages/moment/CommentBox.vue
@@ -6,10 +6,7 @@
       @click="showDeleteDialogue"
     />
     <view class="commenter-info-box">
-      <view
-        class="d-flex a-start"
-        @click="toPersonInfo(comment.user.id, myUserId)"
-      >
+      <view class="d-flex a-start" @click="toPersonInfo(comment.user.id)">
         <image
           :src="getThumbnail(comment.user.avatarUrl)"
           class="commenter-profile"
@@ -17,14 +14,11 @@
       </view>
       <view style="margin-top: 12rpx; margin-left: 12rpx; width: 100%">
         <view class="d-flex a-center">
-          <view
-            class="commenter-name"
-            @click="toPersonInfo(comment.user.id, myUserId)"
-          >
+          <view class="commenter-name" @click="toPersonInfo(comment.user.id)">
             {{ comment.user.nickname }}
           </view>
           <view class="comment-time">
-            · {{ displayTime(comment.createAt) }}
+            · {{ displayDetailTime(comment.createAt) }}
           </view>
         </view>
         <view>
@@ -81,7 +75,7 @@
 
 <script lang="ts" setup>
 import { Comment } from "@/apis/schemas";
-import { displayTime } from "@/utils/time";
+import { displayDetailTime, displayTime } from "@/utils/time";
 import { deleteComment } from "@/apis/comment/comment";
 import { ref } from "vue";
 import { toPersonInfo } from "@/pages/profile/utils";
diff --git a/src/pages/moment/Reply.vue b/src/pages/moment/Reply.vue
index 95715970..4a4ad188 100644
--- a/src/pages/moment/Reply.vue
+++ b/src/pages/moment/Reply.vue
@@ -1,113 +1,138 @@
 <template>
   <view class="background" @click="closeSelf" @touchmove.stop.prevent />
   <scroll-view class="frame" scroll-y="true" @touchmove.stop>
-    <view class="main">
-      <view class="comment">
-        <view
-          :style="{
-            backgroundImage: 'url( ' + mainComment.user.avatarUrl + ')'
-          }"
-          class="avatar"
-        />
-        <view class="thread">
-          <view class="content">
-            <view class="left">
-              <view class="upper">
-                <view class="username">{{ mainComment.user.nickname }}</view>
-                <view class="timestamp"
-                  >· {{ displayTime(mainComment.createAt) }}
+    <view class="container">
+      <!-- 主评论 -->
+      <view class="main main-comment">
+        <view class="comment">
+          <view
+            :style="{
+              backgroundImage: 'url( ' + mainComment.user.avatarUrl + ')'
+            }"
+            class="avatar"
+            @click="toPersonInfo(mainComment.user.id)"
+          />
+          <view class="thread">
+            <view class="content">
+              <view class="left">
+                <view class="upper">
+                  <view class="username">{{ mainComment.user.nickname }}</view>
+                  <view class="timestamp"
+                    >· {{ displayDetailTime(mainComment.createAt) }}
+                  </view>
                 </view>
+                <view class="lower">{{ mainComment.text }}</view>
               </view>
-              <view class="lower">{{ mainComment.text }}</view>
-            </view>
-            <view class="right">
-              <view class="likes-frame" @click="likeComment(mainComment)">
-                <view v-if="mainComment.isLiked" class="thumb liked" />
-                <view v-else class="thumb" />
-                <view class="likes">{{ mainComment.likeCount }}</view>
+              <view class="right">
+                <view class="likes-frame" @click="likeComment(mainComment)">
+                  <view v-if="mainComment.isLiked" class="thumb liked" />
+                  <view v-else class="thumb" />
+                  <view class="likes">{{ mainComment.likeCount }}</view>
+                </view>
               </view>
             </view>
           </view>
         </view>
       </view>
-      <view v-for="(comment, index) in comments" :key="index" class="reply">
-        <view
-          :style="{
-            backgroundImage: 'url( ' + comment.user.avatarUrl + ')'
-          }"
-          class="avatar"
-          style="margin-left: calc(42 / 390 * 100vw)"
-        />
-        <view class="thread">
-          <view class="content">
-            <view class="left">
-              <view class="upper">
-                <view class="username">{{ comment.user.nickname }}</view>
-                <view class="timestamp"
-                  >· {{ displayTime(comment.createAt) }}
+
+      <!-- 二级评论 -->
+      <view v-for="(comment, index) in comments" :key="index" class="main">
+        <view class="comment">
+          <view
+            :style="{
+              backgroundImage: 'url( ' + comment.user.avatarUrl + ')'
+            }"
+            class="avatar"
+            @click="toPersonInfo(comment.user.id)"
+          />
+          <view class="thread">
+            <view class="content">
+              <view class="left">
+                <view class="upper">
+                  <view class="username">
+                    <view>{{ comment.user.nickname }}</view>
+                    <template v-if="comment.replyUser">
+                      <image
+                        class="right-triangle-grey"
+                        src="/static/images/right-triangle-grey.png"
+                      />
+                      <view>{{ comment.replyUser?.nickname }}</view>
+                    </template>
+                  </view>
+                  <view class="timestamp"
+                    >· {{ displayDetailTime(comment.createAt) }}
+                  </view>
                 </view>
+                <view class="lower" @click="onReplyComment(comment)">{{
+                  comment.text
+                }}</view>
               </view>
-              <view class="lower">{{ comment.text }}</view>
-            </view>
-            <view v-if="comment.likeCount >= 0" class="right">
-              <view class="likes-frame" @click="likeComment(comment)">
-                <view v-if="comment.isLiked" class="thumb liked" />
-                <view v-else class="thumb" />
-                <view class="likes">{{ comment.likeCount }}</view>
+              <view class="right">
+                <view class="likes-frame" @click="likeComment(comment)">
+                  <view v-if="comment.isLiked" class="thumb liked" />
+                  <view v-else class="thumb" />
+                  <view class="likes">{{ comment.likeCount }}</view>
+                </view>
               </view>
             </view>
           </view>
         </view>
       </view>
+      <view
+        v-if="isCommentsLoaded && !allCommentsLoaded"
+        class="more-sub-replies"
+        @click="localGetCommentsData"
+      >
+        展开查看更多
+        <view class="down-arrow" />
+      </view>
     </view>
   </scroll-view>
 </template>
 
 <script lang="ts" setup>
-import { Comment } from "@/apis/schemas";
-import { displayTime } from "@/utils/time";
+import { Comment, FishAward, Moment } from "@/apis/schemas";
+import { displayDetailTime, displayTime } from "@/utils/time";
 import { ref } from "vue";
-import { getCommentsData, likeComment } from "@/pages/moment/utils";
-import { onReachBottom } from "@dcloudio/uni-app";
+import { getCommentsData, likeComment, likeMoment } from "@/pages/moment/utils";
 import { CommentType } from "@/apis/comment/comment-interfaces";
+import { EventEmitter } from "@/utils/utils";
+import { toPersonInfo } from "@/pages/profile/utils";
 
 const props = defineProps<{
   mainComment: Comment;
+  moment?: Moment;
+  fishAwardEmitter: EventEmitter<FishAward>;
+  onReplyComment: (comment: Comment) => void;
 }>();
 
 const comments = ref<Comment[]>([]);
 
-let allCommentsLoaded = false;
-let isCommentsLoaded = true;
+let allCommentsLoaded = ref(false);
+let isCommentsLoaded = ref(true);
 let page = 0;
 const localGetCommentsData = () => {
-  isCommentsLoaded = false;
+  isCommentsLoaded.value = false;
   getCommentsData({
     id: props.mainComment.id,
     type: CommentType.Comment,
     page: page
   }).then((res) => {
-    for (const data of res.data) {
-      comments.value.push(data);
-    }
-    isCommentsLoaded = true;
+    comments.value.push(...res.data);
+    isCommentsLoaded.value = true;
     page += 1;
-    if (res.data.length < 10) allCommentsLoaded = true;
+    if (!res.data.length) {
+      allCommentsLoaded.value = true;
+    }
   });
 };
 
 localGetCommentsData();
 
-onReachBottom(() => {
-  if (isCommentsLoaded && !allCommentsLoaded) {
-    localGetCommentsData();
-  }
-});
-
-const emits = defineEmits(["closeReply"]);
+const emits = defineEmits(["close"]);
 
 function closeSelf() {
-  emits("closeReply");
+  emits("close");
 }
 </script>
 
@@ -125,7 +150,7 @@ function closeSelf() {
 .frame {
   overflow: scroll;
   position: fixed;
-  bottom: 0;
+  bottom: 16vw;
   left: 0;
   width: 100vw;
   max-height: 75vh;
@@ -134,10 +159,18 @@ function closeSelf() {
   border-radius: 5vw 5vw 0 0;
 }
 
+.container {
+  padding: calc(10 / 390 * 100vw) 0;
+}
+
 .main {
-  padding: calc(20 / 390 * 100vw);
+  padding: calc(10 / 390 * 100vw) calc(20 / 390 * 100vw);
   box-sizing: border-box;
 
+  &-comment {
+    border-bottom: 5px #eee solid;
+  }
+
   .comment,
   .reply {
     display: flex;
@@ -168,6 +201,13 @@ function closeSelf() {
 
             .username {
               margin-right: calc(10 / 390 * 100vw);
+              display: flex;
+              align-items: center;
+              .right-triangle-grey {
+                width: 15rpx;
+                height: 15rpx;
+                margin: 0 5px;
+              }
             }
           }
 
@@ -189,13 +229,13 @@ function closeSelf() {
             align-items: center;
 
             .thumb {
-              background-image: url("../../static/images/like_grey_0.png");
+              background-image: url("/static/images/like_grey_0.png");
               width: calc(12 / 390 * 100vw);
               height: calc(12 / 390 * 100vw);
               background-size: 100% 100%;
 
               &.liked {
-                background-image: url("../../static/images/like_grey_1.png");
+                background-image: url("/static/images/like_grey_1.png");
               }
             }
 
@@ -228,30 +268,24 @@ function closeSelf() {
           }
         }
       }
-
-      .more-sub-replies {
-        color: #696969;
-        margin-left: calc(33 / 390 * 100vw);
-        display: flex;
-        align-items: center;
-
-        .down-arrow {
-          background-image: url("../../static/images/down-black.png");
-          width: calc(8 / 390 * 100vw);
-          height: calc(5 / 390 * 100vw);
-          background-size: 100% 100%;
-          margin-left: calc(8 / 390 * 100vw);
-        }
-      }
     }
   }
-
-  .comment {
-    margin-bottom: calc(20 / 390 * 100vw);
-  }
-
-  .reply {
-    margin: calc(20 / 390 * 100vw) 0;
+}
+.more-sub-replies {
+  position: relative;
+  color: #696969;
+  margin-left: 0;
+  display: flex;
+  left: 50rpx;
+  align-items: center;
+  font-size: calc(12 / 390 * 100vw);
+
+  .down-arrow {
+    background-image: url("/static/images/down-black.png");
+    width: calc(8 / 390 * 100vw);
+    height: calc(5 / 390 * 100vw);
+    background-size: 100% 100%;
+    margin-left: calc(8 / 390 * 100vw);
   }
 }
 </style>
diff --git a/src/pages/moment/WriteCommentBox.vue b/src/pages/moment/WriteCommentBox.vue
index 931ace18..43f89347 100644
--- a/src/pages/moment/WriteCommentBox.vue
+++ b/src/pages/moment/WriteCommentBox.vue
@@ -3,9 +3,10 @@
     <input
       ref="input"
       v-model="text"
-      :placeholder="placeholderText"
+      :placeholder="placeholder"
       class="write-comment"
       type="text"
+      :focus="focus"
       @blur="blur"
     />
     <view v-if="likeCount >= 0" class="like-box">
@@ -20,27 +21,43 @@
 </template>
 
 <script lang="ts" setup>
-import { CommentType, NewCommentResp } from "@/apis/comment/comment-interfaces";
+import {
+  CommentType,
+  NewCommentReq,
+  NewCommentResp
+} from "@/apis/comment/comment-interfaces";
 import { createComment } from "@/pages/moment/utils";
-import { ref } from "vue";
+import { computed, ref } from "vue";
+import { Comment, User } from "@/apis/schemas";
 
 const props = defineProps<{
   parentId: string;
   parentType: CommentType;
-  firstLevelId?: string;
+  firstLevelComment?: Comment;
+  replyComment?: Comment;
   likeCount?: number;
   isLiked: boolean;
-  placeholderText: string;
   commentCallback: (res: NewCommentResp) => void;
+  focus: boolean;
 }>();
 const text = ref("");
-const emit = defineEmits(["doLike", "afterCreateComment", "cancelReply"]);
+const placeholder = computed(() => {
+  let placeholder = "";
+  if (props.replyComment) {
+    placeholder = "回复 @" + props.replyComment.user?.nickname + ": ";
+  } else if (props.firstLevelComment) {
+    return "回复 @" + props.firstLevelComment.user?.nickname + ": ";
+  }
+  return placeholder || "发布评论";
+});
+const emit = defineEmits(["doLike", "afterCreateComment", "blur"]);
 
 const localCreateComment = async () => {
-  const req = {
+  const req: NewCommentReq = {
     text: text.value,
     type: props.parentType,
-    firstLevelId: props.firstLevelId,
+    firstLevelId: props.firstLevelComment?.id,
+    replyToUserId: props.replyComment?.user?.id,
     id: props.parentId
   };
   text.value = "";
@@ -52,7 +69,7 @@ const blur = () => {
   if (text.value) {
     return;
   }
-  emit("cancelReply");
+  emit("blur");
 };
 </script>
 
@@ -63,7 +80,7 @@ const blur = () => {
   position: fixed;
   bottom: 0;
   left: 0;
-  z-index: 50;
+  z-index: 102;
   display: flex;
   width: 100vw;
   box-sizing: border-box;
@@ -86,11 +103,12 @@ const blur = () => {
   }
 
   .like-box {
+    margin-top: 20rpx;
     display: flex;
     align-items: center;
     justify-content: center;
     flex-direction: column;
-    margin-right: 12px;
+    margin-right: 24rpx;
 
     .like-icon {
       width: calc(20 / 390 * 100vw);
diff --git a/src/pages/moment/moment.vue b/src/pages/moment/moment.vue
index f630199e..42d32ab1 100644
--- a/src/pages/moment/moment.vue
+++ b/src/pages/moment/moment.vue
@@ -6,7 +6,7 @@
 
   <view
     v-if="moment"
-    :style="{ height: 'calc(100vh - 16vw - ' - keyboardHeight + 'px)' }"
+    :style="{ height: 'calc(100vh - 16vw - ' + keyboardHeight + 'px)' }"
     class="content-frame"
   >
     <view class="container">
@@ -15,12 +15,9 @@
           <image
             :src="getThumbnail(moment.user.avatarUrl)"
             class="poster-profile"
-            @click="toPersonInfo(moment.user.id, myUserId)"
+            @click="toPersonInfo(moment.user.id)"
           />
-          <text
-            class="poster-name"
-            @click="toPersonInfo(moment.user.id, myUserId)"
-          >
+          <text class="poster-name" @click="toPersonInfo(moment.user.id)">
             {{ moment.user.nickname }}
           </text>
           <text class="post-time"> · {{ displayTime(moment.createAt) }} </text>
@@ -84,20 +81,27 @@
   </view>
   <WriteCommentBox
     v-if="moment"
-    :placeholder-text="placeholderText"
     :like-count="moment.likeCount"
     :is-liked="moment.isLiked"
     :parent-id="moment.id"
     :parent-type="CommentType.Moment"
-    :first-level-id="firstLevelId"
+    :first-level-comment="firstLevelComment"
+    :reply-comment="replyComment"
+    :focus="writeBoxFocus"
     :comment-callback="(res) => fishAwardEmitter.triggerCallbacks(res)"
     @do-like="likeMoment(moment, fishAwardEmitter)"
     @after-create-comment="init"
-    @cancel-reply="afterBlur"
+    @blur="afterBlur"
   />
 
-  <view v-if="isReplyOpened && selectComment" class="reply">
-    <Reply :main-comment="selectComment" @close-reply="closeReply" />
+  <view v-if="isReplyOpened && selectComment">
+    <Reply
+      :main-comment="selectComment"
+      :moment="moment"
+      :fish-award-emitter="fishAwardEmitter"
+      :on-reply-comment="onReplyComment"
+      @close="closeReply"
+    />
   </view>
   <view
     v-if="isShowDeleteDialogue"
@@ -130,7 +134,7 @@
 
 <script lang="ts" setup>
 import ToastBoxWithShadow from "@/components/ToastBoxWithShadow.vue";
-import { reactive, ref } from "vue";
+import { nextTick, reactive, ref } from "vue";
 import TopBar from "@/components/TopBar.vue";
 import {
   chooseImageClass,
@@ -168,6 +172,7 @@ const fishAwardEmitter = new EventEmitter((res: FishAward) => {
   }
 });
 
+const writeBoxFocus = ref(false);
 const keyboardHeight = ref(0);
 
 const getMomentDetailReq = reactive<GetMomentDetailReq>({
@@ -215,21 +220,24 @@ const localGetCommentsData = () => {
     }
     isCommentsLoaded = true;
     page += 1;
-    if (res.data?.length < 10) allCommentsLoaded = true;
+    if (!res.data?.length) allCommentsLoaded = true;
   });
 };
 
-const defaultPlaceholderText = "发布评论";
-const placeholderText = ref(defaultPlaceholderText);
-const firstLevelId = ref();
+const firstLevelComment = ref<Comment>();
 const afterBlur = () => {
-  placeholderText.value = defaultPlaceholderText;
-  firstLevelId.value = undefined;
+  writeBoxFocus.value = false;
+  replyComment.value = undefined;
+  if (!selectComment.value) {
+    firstLevelComment.value = undefined;
+  } else {
+    firstLevelComment.value = selectComment.value;
+  }
 };
 
 const focusReplyComment = (comment: Comment) => {
-  placeholderText.value = "回复 @" + comment.user.nickname + ": ";
-  firstLevelId.value = comment.id;
+  writeBoxFocus.value = true;
+  firstLevelComment.value = comment;
 };
 
 const showDeleteDialogue = () => {
@@ -262,16 +270,23 @@ const relaunchCurrentPage = () => {
 
 let initLock = false;
 const init = () => {
-  if (initLock) return;
-  initLock = true;
-  getData();
-  page = 0;
-  getCommentsReq.page = 0;
-  comments.value = [];
-  allCommentsLoaded = false;
-  isCommentsLoaded = true;
-  localGetCommentsData();
-  initLock = false;
+  if (!isReplyOpened.value) {
+    if (initLock) return;
+    initLock = true;
+    getData();
+    page = 0;
+    getCommentsReq.page = 0;
+    comments.value = [];
+    allCommentsLoaded = false;
+    isCommentsLoaded = true;
+    localGetCommentsData();
+    initLock = false;
+  } else {
+    isReplyOpened.value = false;
+    nextTick(() => {
+      isReplyOpened.value = true;
+    });
+  }
 };
 
 const wcbHeight = ref(81);
@@ -299,9 +314,12 @@ onPullDownRefresh(() => {
   }
 });
 
-init();
-
 const selectComment = ref<Comment>();
+const replyComment = ref<Comment>();
+const onReplyComment = (comment: Comment) => {
+  writeBoxFocus.value = true;
+  replyComment.value = comment;
+};
 
 let enterMaskData = ref(null);
 let enterReplyData = ref(null);
@@ -310,10 +328,15 @@ const isReplyOpened = ref(false);
 
 function onClickReplies(comment: Comment) {
   selectComment.value = comment;
+  firstLevelComment.value = comment;
   isReplyOpened.value = true;
 }
 
 function closeReply() {
+  writeBoxFocus.value = false;
+  selectComment.value = undefined;
+  firstLevelComment.value = undefined;
+  replyComment.value = undefined;
   isReplyOpened.value = false;
 }
 
@@ -323,6 +346,7 @@ function leaveReply() {
   enterReply.height("0%").step();
   enterReplyData.value = enterReply.export();
 }
+init();
 </script>
 
 <style lang="scss" scoped>
diff --git a/src/pages/post/post.vue b/src/pages/post/post.vue
index ffd825ed..cc70673c 100644
--- a/src/pages/post/post.vue
+++ b/src/pages/post/post.vue
@@ -6,7 +6,7 @@
 
   <view
     v-if="post"
-    :style="{ height: 'calc(100vh - 16vw - ' - keyboardHeight + 'px)' }"
+    :style="{ height: 'calc(100vh - 16vw - ' + keyboardHeight + 'px)' }"
     class="content-frame"
   >
     <view class="header">
@@ -30,11 +30,7 @@
     </view>
 
     <view class="post">
-      <view
-        v-if="post.user"
-        class="user"
-        @click="toPersonInfo(post.user.id, myUserId)"
-      >
+      <view v-if="post.user" class="user" @click="toPersonInfo(post.user.id)">
         <image :src="getThumbnail(post.user.avatarUrl)" class="avatar" />
         <view class="name">
           {{ post.user.nickname }}
@@ -51,9 +47,7 @@
         @click="onClickImage(post.coverUrl)"
       />
       <view v-if="comments.data.length === 0" class="commentNum"> 评论</view>
-      <view v-else class="commentNum">
-        评论 {{ comments.data.length + comments.replyNumber }}
-      </view>
+      <view v-else class="commentNum"> 评论 {{ post.comments }} </view>
       <view v-if="comments.data.length === 0">
         <view class="nomore">这里还没有评论，快发布第一条评论吧！</view>
       </view>
@@ -72,20 +66,26 @@
   </view>
   <WriteCommentBox
     v-if="post"
-    v-model:placeholder-text="placeholderText"
     :is-liked="post.isLiked || false"
     :like-count="post.likes"
     :parent-type="CommentType.Post"
     :parent-id="post.id"
-    :first-level-id="firstLevelId"
+    :first-level-comment="firstLevelComment"
+    :reply-comment="replyComment"
+    :focus="writeBoxFocus"
     :comment-callback="(res) => fishAwardEmitter.triggerCallbacks(res)"
     @do-like="likePost(post, fishAwardEmitter)"
     @after-create-comment="init"
-    @cancel-reply="afterBlur"
+    @blur="afterBlur"
   />
 
   <view v-if="isReplyOpened && selectComment" class="reply">
-    <reply :main-comment="selectComment" @close-reply="closeReply" />
+    <reply
+      :main-comment="selectComment"
+      :fish-award-emitter="fishAwardEmitter"
+      :on-reply-comment="onReplyComment"
+      @close="closeReply"
+    />
   </view>
   <view
     v-if="isShowDeleteDialogue"
@@ -116,7 +116,7 @@
   />
 </template>
 <script lang="ts" setup>
-import { reactive, ref } from "vue";
+import { nextTick, reactive, ref } from "vue";
 import TopBar from "@/components/TopBar.vue";
 import {
   enterMask,
@@ -216,16 +216,21 @@ const localGetCommentsData = async () => {
   });
 };
 
-const placeholderText = ref("发布评论");
-const firstLevelId = ref<string>();
-
+const firstLevelComment = ref<Comment>();
+const writeBoxFocus = ref(false);
 const afterBlur = () => {
-  firstLevelId.value = undefined;
+  writeBoxFocus.value = false;
+  replyComment.value = undefined;
+  if (!selectComment.value) {
+    firstLevelComment.value = undefined;
+  } else {
+    firstLevelComment.value = selectComment.value;
+  }
 };
 
 const focusReplyComment = (comment: Comment) => {
-  placeholderText.value = "回复 @" + comment.user.nickname + ": ";
-  firstLevelId.value = comment.id;
+  writeBoxFocus.value = true;
+  firstLevelComment.value = comment;
 };
 
 const showDeleteDialogue = () => {
@@ -254,16 +259,23 @@ const deleteThisPost = () => {
 
 let initLock = false;
 const init = async () => {
-  if (initLock) return;
-  initLock = true;
-  await getData();
-  page = 0;
-  getCommentsReq.page = 0;
-  comments.data = [];
-  allCommentsLoaded = false;
-  isCommentsLoaded = true;
-  await localGetCommentsData();
-  initLock = false;
+  if (!isReplyOpened.value) {
+    if (initLock) return;
+    initLock = true;
+    await getData();
+    page = 0;
+    getCommentsReq.page = 0;
+    comments.data = [];
+    allCommentsLoaded = false;
+    isCommentsLoaded = true;
+    await localGetCommentsData();
+    initLock = false;
+  } else {
+    isReplyOpened.value = false;
+    nextTick(() => {
+      isReplyOpened.value = true;
+    });
+  }
 };
 
 const wcbHeight = ref(81);
@@ -290,6 +302,11 @@ uni.onKeyboardHeightChange((res) => {
 });
 
 const selectComment = ref<Comment>();
+const replyComment = ref<Comment>();
+const onReplyComment = (comment: Comment) => {
+  writeBoxFocus.value = true;
+  replyComment.value = comment;
+};
 
 let enterMaskData = ref(null);
 let enterReplyData = ref(null);
@@ -298,10 +315,15 @@ const isReplyOpened = ref(false);
 
 function onClickReplies(comment: Comment) {
   selectComment.value = comment;
+  firstLevelComment.value = comment;
   isReplyOpened.value = true;
 }
 
 function closeReply() {
+  writeBoxFocus.value = false;
+  selectComment.value = undefined;
+  firstLevelComment.value = undefined;
+  replyComment.value = undefined;
   isReplyOpened.value = false;
 }
 
diff --git a/src/pages/profile/utils.ts b/src/pages/profile/utils.ts
index 35587c61..bff16420 100644
--- a/src/pages/profile/utils.ts
+++ b/src/pages/profile/utils.ts
@@ -1,4 +1,5 @@
 import { Pages } from "@/utils/url";
+import { StorageKeys } from "@/utils/const";
 
 export function CopyToClipboard(res: string) {
   uni.setClipboardData({
@@ -24,8 +25,8 @@ export function showPage() {
   }, 1500);
 }
 
-export function toPersonInfo(id: string, ownid: string) {
-  if (id === ownid)
+export function toPersonInfo(id: string) {
+  if (id === uni.getStorageSync(StorageKeys.UserId))
     uni.switchTab({
       url: `${Pages.Profile}`
     });
diff --git a/src/static/images/right-triangle-grey.png b/src/static/images/right-triangle-grey.png
new file mode 100644
index 00000000..0054395a
Binary files /dev/null and b/src/static/images/right-triangle-grey.png differ
diff --git a/src/utils/time.ts b/src/utils/time.ts
index 6d01a16b..645885e6 100644
--- a/src/utils/time.ts
+++ b/src/utils/time.ts
@@ -21,6 +21,17 @@ export function displayTime(timestamp: number) {
     return time.format("MM-DD");
   }
 }
+
+export function displayDetailTime(timestamp: number) {
+  timestamp = adaptTime(timestamp);
+  const now = new Date().getTime();
+  if (now < timestamp) {
+    timestamp = now;
+  }
+  const time = moment(timestamp);
+  return time.fromNow();
+}
+
 export function displayTimeTotal(timestamp: number) {
   timestamp = adaptTime(timestamp);
   const now = new Date().getTime();