jiazhizhong/OpenIsle
1
0
Fork 0
mirror of https://github.com/nagisa77/OpenIsle.git synced 2026-03-10 05:50:45 +08:00
Code Issues Packages Projects Releases Wiki Activity

Merge pull request #461 from nagisa77/codex/improve-comment-box-scroll-behavior

Browse Source 
fix comment reply editor visibility
This commit is contained in:
Tim
2025-08-10 12:27:45 +08:00
committed by GitHub
parent 2a5bff1086 f50541bff7
commit f6f4f198b0
1 changed files with 9 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files

12
frontend_nuxt/components/CommentItem.vue
View File

@@ -42,7 +42,7 @@
</div> </div>
</ReactionsGroup> </ReactionsGroup>
</div> </div>
<div class="comment-editor-wrapper"> <div class="comment-editor-wrapper" ref="editorWrapper">
<CommentEditor v-if="showEditor" @submit="submitReply" :loading="isWaitingForReply" :disabled="!loggedIn" <CommentEditor v-if="showEditor" @submit="submitReply" :loading="isWaitingForReply" :disabled="!loggedIn"
:show-login-overlay="!loggedIn" :parent-user-name="comment.userName" /> :show-login-overlay="!loggedIn" :parent-user-name="comment.userName" />
</div> </div>
@@ -65,7 +65,7 @@
</template> </template>
<script> <script>
import { ref, watch, computed } from 'vue' import { ref, watch, computed, nextTick } from 'vue'
import VueEasyLightbox from 'vue-easy-lightbox' import VueEasyLightbox from 'vue-easy-lightbox'
import { useRouter } from 'vue-router' import { useRouter } from 'vue-router'
import CommentEditor from './CommentEditor.vue' import CommentEditor from './CommentEditor.vue'
@@ -106,6 +106,7 @@ const CommentItem = {
} }
) )
const showEditor = ref(false) const showEditor = ref(false)
const editorWrapper = ref(null)
const isWaitingForReply = ref(false) const isWaitingForReply = ref(false)
const lightboxVisible = ref(false) const lightboxVisible = ref(false)
const lightboxIndex = ref(0) const lightboxIndex = ref(0)
@@ -118,6 +119,11 @@ const CommentItem = {
} }
const toggleEditor = () => { const toggleEditor = () => {
showEditor.value = !showEditor.value showEditor.value = !showEditor.value
if (showEditor.value) {
nextTick(() => {
editorWrapper.value?.scrollIntoView({ behavior: 'smooth', block: 'nearest' })
})
}
} }
// 合并所有子回复为一个扁平数组 // 合并所有子回复为一个扁平数组
@@ -241,7 +247,7 @@ const CommentItem = {
lightboxVisible.value = true lightboxVisible.value = true
} }
} }
return { showReplies, toggleReplies, showEditor, toggleEditor, submitReply, copyCommentLink, renderMarkdown, isWaitingForReply, commentMenuItems, deleteComment, lightboxVisible, lightboxIndex, lightboxImgs, handleContentClick, loggedIn, replyCount, replyList, getMedalTitle } return { showReplies, toggleReplies, showEditor, toggleEditor, submitReply, copyCommentLink, renderMarkdown, isWaitingForReply, commentMenuItems, deleteComment, lightboxVisible, lightboxIndex, lightboxImgs, handleContentClick, loggedIn, replyCount, replyList, getMedalTitle, editorWrapper }
} }
} }