Compare commits

...

3 Commits

Author SHA1 Message Date
Tim
680e44e743 feat: 给出仅重启后台的vibe coding方式 2026-02-04 20:23:19 +08:00
Tim
657b76bb1e feat: 评论分页 2026-02-04 20:14:46 +08:00
Tim
f695db62c6 Clear filters on logo click 2026-02-04 19:03:58 +08:00
4 changed files with 131 additions and 23 deletions

View File

@@ -57,6 +57,14 @@ cd OpenIsle
--profile dev up -d --force-recreate
```
仅重启后端容器(不重建镜像、不影响前端):
```shell
docker compose \
-f docker/docker-compose.yaml \
--env-file .env \
--profile dev restart springboot websocket-service
```
数据初始化sql会创建几个帐户供大家测试使用
> username:admin/user1/user2 password:123456

View File

@@ -112,7 +112,9 @@ public class CommentController {
)
public List<TimelineItemDto<?>> listComments(
@PathVariable Long postId,
@RequestParam(value = "sort", required = false, defaultValue = "OLDEST") CommentSort sort
@RequestParam(value = "sort", required = false, defaultValue = "OLDEST") CommentSort sort,
@RequestParam(value = "page", required = false, defaultValue = "0") int page,
@RequestParam(value = "pageSize", required = false, defaultValue = "20") int pageSize
) {
log.debug("listComments called for post {} with sort {}", postId, sort);
List<CommentDto> commentDtoList = commentService
@@ -183,8 +185,23 @@ public class CommentController {
createdAtComparator = createdAtComparator.reversed();
}
itemDtoList.sort(comparator.thenComparing(createdAtComparator));
log.debug("listComments returning {} comments", itemDtoList.size());
return itemDtoList;
int safePage = Math.max(0, page);
int safePageSize = Math.max(1, pageSize);
int fromIndex = safePage * safePageSize;
int toIndex = Math.min(fromIndex + safePageSize, itemDtoList.size());
List<TimelineItemDto<?>> pagedItems =
fromIndex >= itemDtoList.size() ? List.of() : itemDtoList.subList(fromIndex, toIndex);
log.debug(
"listComments returning {} items for post {} page {} size {} (total {})",
pagedItems.size(),
postId,
safePage,
safePageSize,
itemDtoList.size()
);
return pagedItems;
}
@GetMapping("/comments/{commentId}/context")

View File

@@ -159,6 +159,12 @@ const selectedTags = ref([])
const route = useRoute()
const tagOptions = ref([])
const categoryOptions = ref([])
const clearFilters = () => {
selectedCategory.value = ''
selectedTags.value = []
selectedCategoryGlobal.value = ''
selectedTagsGlobal.value = []
}
const topics = ref(['最新回复', '最新', '精选', '排行榜' /*, '热门', '类别'*/])
const selectedTopicCookie = useCookie('homeTab')
@@ -218,8 +224,18 @@ watch(
(query) => {
const category = query.category
const tags = query.tags
category && selectedCategorySet(category)
tags && selectedTagsSet(tags)
if (category) {
selectedCategorySet(category)
} else {
selectedCategory.value = ''
selectedCategoryGlobal.value = ''
}
if (tags) {
selectedTagsSet(tags)
} else {
selectedTags.value = []
selectedTagsGlobal.value = []
}
},
)
@@ -367,12 +383,18 @@ watch(selectedTopic, (val) => {
if (import.meta.server) {
await loadOptions()
}
const handleRefreshHome = () => {
clearFilters()
refreshFirst()
}
onMounted(() => {
if (categoryOptions.value.length === 0 && tagOptions.value.length === 0) loadOptions()
window.addEventListener('refresh-home', refreshFirst)
window.addEventListener('refresh-home', handleRefreshHome)
})
onBeforeUnmount(() => {
window.removeEventListener('refresh-home', refreshFirst)
window.removeEventListener('refresh-home', handleRefreshHome)
})
/** 供 InfiniteLoadMore 重建用的 key筛选/Tab 改变即重建内部状态 */

View File

@@ -181,6 +181,12 @@
<PostChangeLogItem v-else :log="item" :title="title" />
</template>
</BaseTimeline>
<InfiniteLoadMore
v-if="timelineItems.length > 0"
:key="commentSort"
:on-load="loadMoreTimeline"
:pause="isLoadingMoreComments || isFetchingComments"
/>
</div>
</div>
@@ -211,6 +217,7 @@ import CommentEditor from '~/components/CommentEditor.vue'
import BaseTimeline from '~/components/BaseTimeline.vue'
import BasePlaceholder from '~/components/BasePlaceholder.vue'
import PostChangeLogItem from '~/components/PostChangeLogItem.vue'
import InfiniteLoadMore from '~/components/InfiniteLoadMore.vue'
import ArticleTags from '~/components/ArticleTags.vue'
import ArticleCategory from '~/components/ArticleCategory.vue'
import ReactionsGroup from '~/components/ReactionsGroup.vue'
@@ -276,6 +283,10 @@ const currentIndex = ref(1)
const subscribed = ref(false)
const commentSort = ref('NEWEST')
const isFetchingComments = ref(false)
const commentPage = ref(0)
const commentPageSize = 10
const hasMoreComments = ref(true)
const isLoadingMoreComments = ref(false)
const isMobile = useIsMobile()
const timelineItems = ref([])
@@ -869,17 +880,33 @@ const fetchCommentSorts = () => {
])
}
const fetchCommentsAndChangeLog = async () => {
isFetchingComments.value = true
console.info('Fetching comments and chang log', { postId, sort: commentSort.value })
const fetchCommentsAndChangeLog = async ({ pageNo = 0, append = false } = {}) => {
if (isLoadingMoreComments.value) return false
if (!append) {
hasMoreComments.value = true
commentPage.value = 0
}
if (pageNo === 0) {
isFetchingComments.value = true
} else {
isLoadingMoreComments.value = true
}
console.info('Fetching comments and chang log', {
postId,
sort: commentSort.value,
page: pageNo,
pageSize: commentPageSize,
})
let done = false
try {
const token = getToken()
const res = await fetch(
`${API_BASE_URL}/api/posts/${postId}/comments?sort=${commentSort.value}`,
{
headers: { Authorization: token ? `Bearer ${token}` : '' },
},
)
const url = new URL(`${API_BASE_URL}/api/posts/${postId}/comments`)
url.searchParams.set('sort', commentSort.value)
url.searchParams.set('page', String(pageNo))
url.searchParams.set('pageSize', String(commentPageSize))
const res = await fetch(url.toString(), {
headers: { Authorization: token ? `Bearer ${token}` : '' },
})
console.info('Fetch comments response status', res.status)
if (res.ok) {
const data = await res.json()
@@ -902,23 +929,48 @@ const fetchCommentsAndChangeLog = async () => {
}
}
comments.value = commentList
changeLogs.value = changeLogList
timelineItems.value = newTimelineItemList
if (append) {
comments.value.push(...commentList)
changeLogs.value.push(...changeLogList)
timelineItems.value.push(...newTimelineItemList)
commentPage.value = pageNo
} else {
comments.value = commentList
changeLogs.value = changeLogList
timelineItems.value = newTimelineItemList
commentPage.value = 0
}
isFetchingComments.value = false
done = data.length < commentPageSize
hasMoreComments.value = !done
await nextTick()
gatherPostItems()
return done
}
} catch (e) {
console.debug('Fetch comments error', e)
hasMoreComments.value = false
return true
} finally {
isFetchingComments.value = false
isLoadingMoreComments.value = false
}
}
const fetchTimeline = async () => {
await fetchCommentsAndChangeLog()
hasMoreComments.value = true
commentPage.value = 0
comments.value = []
changeLogs.value = []
timelineItems.value = []
await fetchCommentsAndChangeLog({ pageNo: 0, append: false })
}
const loadMoreTimeline = async () => {
if (!hasMoreComments.value || isLoadingMoreComments.value) return true
const nextPage = commentPage.value + 1
const done = await fetchCommentsAndChangeLog({ pageNo: nextPage, append: true })
return done || !hasMoreComments.value
}
watch(commentSort, async () => {
@@ -929,8 +981,17 @@ const jumpToHashComment = async () => {
const hash = location.hash
if (hash.startsWith('#comment-')) {
const id = hash.substring('#comment-'.length)
await new Promise((resolve) => setTimeout(resolve, 500))
const el = document.getElementById('comment-' + id)
await new Promise((resolve) => setTimeout(resolve, 300))
let el = document.getElementById('comment-' + id)
// 若未加载到目标评论,尝试继续分页加载直到找到或无更多
while (!el && hasMoreComments.value) {
const done = await loadMoreTimeline()
await nextTick()
el = document.getElementById('comment-' + id)
if (done) break
}
if (el) {
const top = el.getBoundingClientRect().top + window.scrollY - headerHeight - 20 // 20 for beauty
window.scrollTo({ top, behavior: 'smooth' })