Skip to content

Commit e780b72

Browse files
KunMoeKunMoe
committed
feat: migrate the search page
1 parent 801d998 commit e780b72

13 files changed

Lines changed: 187 additions & 104 deletions

File tree

‎components/search/CommentCard.vue‎

Lines changed: 42 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,42 @@
1+
<script setup lang="ts">
2+
import type { SearchResultComment } from '~/types/api/search'
3+
4+
defineProps<{
5+
comment: SearchResultComment
6+
}>()
7+
</script>
8+
9+
<template>
10+
<KunLink
11+
color="default"
12+
underline="none"
13+
:to="`/topic/${comment.topicId}`"
14+
class="flex-col items-start"
15+
>
16+
<div class="flex items-center gap-2">
17+
<KunIcon class="text-primary h-5 w-5" name="uil:comment-dots" />
18+
<span class="text-lg">{{ comment.topicTitle }}</span>
19+
<span class="text-default-500 ml-auto text-sm">
20+
{{ formatTimeDifference(comment.created) }}
21+
</span>
22+
</div>
23+
24+
<div
25+
class="border-primary bg-primary/10 my-2 rounded border-l-3 p-2 text-sm"
26+
>
27+
{{ comment.content }}
28+
</div>
29+
30+
<div class="flex flex-wrap items-center gap-2">
31+
<div class="flex items-center">
32+
<KunAvatar :user="comment.user" />
33+
<span class="ml-2 text-sm">{{ comment.user.name }}</span>
34+
</div>
35+
<KunIcon name="lucide:arrow-right" class="h-4 w-4" />
36+
<div class="flex items-center">
37+
<KunAvatar :user="comment.targetUser" />
38+
<span class="ml-2 text-sm">{{ comment.targetUser.name }}</span>
39+
</div>
40+
</div>
41+
</KunLink>
42+
</template>

‎components/search/Container.vue‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -94,12 +94,12 @@ const handleLoadMore = async () => {
9494
<slot />
9595
<KunButton
9696
variant="flat"
97-
v-if="!isLoading && !isLoadComplete"
97+
:loading="isLoading"
98+
:disabled="isLoading || isLoadComplete"
9899
@click="handleLoadMore"
99100
>
100101
加载更多
101102
</KunButton>
102-
<span v-if="isLoading">少女祈祷中...</span>
103103
<span v-if="isLoadComplete">被榨干了呜呜呜呜呜, 一滴也不剩了</span>
104104
</KunDivider>
105105

‎components/search/ReplyCard.vue‎

Lines changed: 56 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,56 @@
1+
<script setup lang="ts">
2+
import type { SearchResultReply } from '~/types/api/search'
3+
4+
defineProps<{
5+
reply: SearchResultReply
6+
}>()
7+
</script>
8+
9+
<template>
10+
<KunLink
11+
color="default"
12+
underline="none"
13+
:to="`/topic/${reply.topicId}`"
14+
class="flex-col items-start"
15+
>
16+
<div class="flex items-center gap-2">
17+
<KunIcon class="text-primary h-5 w-5" name="carbon:reply" />
18+
<span class="text-lg">{{ reply.topicTitle }}</span>
19+
<span class="text-default-500 ml-auto text-sm">
20+
{{ formatTimeDifference(reply.created) }}
21+
</span>
22+
</div>
23+
24+
<div v-if="reply.content" class="my-2 rounded">
25+
<div class="mb-2 flex items-center">
26+
<KunAvatar :user="reply.user" />
27+
<span class="ml-2 text-sm">{{ reply.user.name }}</span>
28+
</div>
29+
{{ reply.content }}
30+
</div>
31+
32+
<template v-for="(target, index) in reply.targets" :key="index">
33+
<div
34+
class="border-primary bg-primary/10 my-2 rounded border-l-3 p-2 text-sm"
35+
>
36+
<div class="flex items-center gap-2">
37+
<div class="flex items-center">
38+
<KunAvatar :user="reply.user" />
39+
<span class="ml-2 text-sm">{{ reply.user.name }}</span>
40+
</div>
41+
<KunIcon name="lucide:arrow-right" class="h-4 w-4" />
42+
<div class="flex items-center">
43+
<KunAvatar :user="target.user" />
44+
<span class="ml-2 text-sm">{{ target.user.name }}</span>
45+
</div>
46+
</div>
47+
48+
<p class="text-default-500 mt-1 line-clamp-2 text-sm italic">
49+
{{ target.contentPreview }}
50+
</p>
51+
52+
{{ target.content }}
53+
</div>
54+
</template>
55+
</KunLink>
56+
</template>

‎components/search/ReplyCommentCard.vue‎

Lines changed: 0 additions & 52 deletions
This file was deleted.

‎components/search/Result.vue‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -48,13 +48,13 @@ const isCommentResults = (
4848

4949
<div v-if="isReplyResults(results)" class="space-y-3">
5050
<KunCard v-for="(reply, index) in results" :key="index">
51-
<SearchReplyCommentCard :data="reply" type="reply" />
51+
<SearchReplyCard :reply="reply" />
5252
</KunCard>
5353
</div>
5454

5555
<div v-if="isCommentResults(results)" class="space-y-3">
5656
<KunCard v-for="(comment, index) in results" :key="index">
57-
<SearchReplyCommentCard :data="comment" type="comment" />
57+
<SearchCommentCard :comment="comment" />
5858
</KunCard>
5959
</div>
6060
</div>

‎components/search/UserCard.vue‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@ defineProps<{
77
</script>
88

99
<template>
10-
<KunCard :is-pressable="true" :href="`/user/${user.uid}/info`">
10+
<KunCard :is-pressable="true" :href="`/user/${user.id}/info`">
1111
<div class="flex items-center">
1212
<KunAvatar :user="user" />
1313
<span class="ml-2">{{ user.name }}</span>
@@ -23,7 +23,7 @@ defineProps<{
2323
{{ user.moemoepoint }}
2424
</div>
2525
<span class="text-default-700">
26-
{{ formatDate(user.time, { isShowYear: true }) }}
26+
{{ formatDate(user.created, { isShowYear: true }) }}
2727
</span>
2828
</div>
2929
</KunCard>

‎components/topic/reply/Panel.vue‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -43,7 +43,7 @@ const handleRemoveTarget = (id: number) => {
4343
v-if="isEdit && currentData"
4444
>
4545
<div
46-
class="bg-background w-full max-w-4xl space-y-2 rounded-t-lg p-3 shadow-2xl"
46+
class="bg-background scrollbar-hide w-full max-w-4xl space-y-2 overflow-scroll rounded-t-lg p-3 shadow-2xl"
4747
>
4848
<div class="scrollbar-hide flex items-center gap-1 overflow-x-auto">
4949
<KunButton

‎components/topic/reply/Target.vue‎

Lines changed: 11 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -20,12 +20,12 @@ const handleClick = () => {
2020
</script>
2121

2222
<template>
23-
<div
23+
<blockquote
2424
@click="handleClick"
25-
class="group hover:border-primary-500 dark:hover:border-primary-400 border-default-300 bg-default-100 hover:bg-default-200/60 dark:border-default-600 dark:bg-default-700/50 dark:hover:bg-default-700 cursor-pointer rounded-md border-l-2 p-3 transition-all duration-200"
25+
class="group border-primary/30 bg-default-100/50 hover:border-primary/80 hover:bg-default-100 cursor-pointer rounded-lg border-l-4 p-3 transition-all hover:shadow-lg"
2626
>
2727
<div class="flex flex-wrap items-center gap-x-2 text-sm">
28-
<span class="text-default-600 dark:text-default-300">回复</span>
28+
<span class="text-default-600">回复</span>
2929
<KunLink
3030
underline="hover"
3131
size="sm"
@@ -35,20 +35,15 @@ const handleClick = () => {
3535
>
3636
@{{ target.user.name }}
3737
</KunLink>
38-
<span class="text-default-500 font-semibold"> #{{ target.floor }} </span>
38+
<span class="text-primary font-semibold">#{{ target.floor }}</span>
3939
</div>
4040

41-
<div class="text-default-700 dark:text-default-200 mt-2 text-sm">
42-
<KunContent
43-
v-if="target.replyContentHtml"
44-
:content="target.replyContentHtml"
45-
class="prose prose-sm dark:prose-invert max-w-none"
46-
/>
47-
<p v-else class="line-clamp-2 italic">
48-
{{ target.contentPreview }}
49-
</p>
50-
</div>
41+
<p class="text-default-500 mt-1 line-clamp-2 text-sm italic">
42+
{{ target.contentPreview }}
43+
</p>
44+
45+
<KunLoading v-if="isLoading" description="正在加载完整回复内容" />
5146

52-
<KunLoading v-if="isLoading" description="正在获取完整评论内容..." />
53-
</div>
47+
<KunContent :content="target.replyContentHtml" class="mt-2" />
48+
</blockquote>
5449
</template>

‎package.json‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "kun-galgame-nuxt3",
3-
"version": "4.0.30",
3+
"version": "4.0.31",
44
"packageManager": "pnpm@10.4.1",
55
"private": true,
66
"scripts": {

‎server/api/search/_search.ts‎

Lines changed: 51 additions & 24 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,12 @@
11
import prisma from '~/prisma/prisma'
2+
import { markdownToText } from '~/utils/markdownToText'
23
import type {
34
SearchResultTopic,
45
SearchResultGalgame,
56
SearchResultUser,
6-
SearchResultReply
7+
SearchResultReplyTarget,
8+
SearchResultReply,
9+
SearchResultComment
710
} from '~/types/api/search'
811

912
export const searchTopic = async (
@@ -14,10 +17,10 @@ export const searchTopic = async (
1417
const data = await prisma.topic.findMany({
1518
where: {
1619
status: { not: 1 },
17-
category: { in: keywords },
18-
tag: { hasSome: keywords },
1920
AND: keywords.map((kw) => ({
2021
OR: [
22+
{ category: { in: keywords } },
23+
{ tag: { hasSome: keywords } },
2124
{ title: { contains: kw, mode: 'insensitive' } },
2225
{ content: { contains: kw, mode: 'insensitive' } }
2326
]
@@ -82,16 +85,10 @@ export const searchGalgame = async (
8285
orderBy: { created: 'desc' },
8386
where: {
8487
status: { not: 1 },
85-
vndb_id: { in: keywords },
86-
tag: {
87-
some: {
88-
tag: {
89-
name: { in: keywords }
90-
}
91-
}
92-
},
9388
AND: keywords.map((kw) => ({
9489
OR: [
90+
{ vndb_id: { in: keywords } },
91+
{ tag: { some: { tag: { name: { in: keywords } } } } },
9592
{ name_en_us: { contains: kw, mode: 'insensitive' } },
9693
{ name_ja_jp: { contains: kw, mode: 'insensitive' } },
9794
{ name_zh_cn: { contains: kw, mode: 'insensitive' } },
@@ -200,11 +197,22 @@ export const searchReply = async (
200197
avatar: true
201198
}
202199
},
203-
target_user: {
200+
target: {
201+
orderBy: {
202+
target_reply: { floor: 'asc' }
203+
},
204204
select: {
205-
id: true,
206-
name: true,
207-
avatar: true
205+
content: true,
206+
target_reply: {
207+
select: {
208+
id: true,
209+
floor: true,
210+
content: true,
211+
user: {
212+
select: { id: true, name: true, avatar: true }
213+
}
214+
}
215+
}
208216
}
209217
},
210218
topic: {
@@ -215,14 +223,33 @@ export const searchReply = async (
215223
}
216224
})
217225

218-
const replies: SearchResultReply[] = data.map((reply) => ({
219-
topicId: reply.topic_id,
220-
topicTitle: reply.topic.title,
221-
content: reply.content.slice(0, 233),
222-
user: reply.user,
223-
targetUser: reply.target_user,
224-
created: reply.created
225-
}))
226+
const replies: SearchResultReply[] = data.map((reply) => {
227+
const targets: SearchResultReplyTarget[] = reply.target.map(
228+
(targetRelation) => {
229+
const targetReply = targetRelation.target_reply
230+
const content = markdownToText(targetRelation.content)
231+
const contentPreviewText = markdownToText(targetReply.content)
232+
return {
233+
id: targetReply.id,
234+
user: targetReply.user,
235+
content: content.slice(0, 150) + (content.length > 150 ? '...' : ''),
236+
contentPreview:
237+
contentPreviewText.slice(0, 150) +
238+
(contentPreviewText.length > 150 ? '...' : '')
239+
}
240+
}
241+
)
242+
243+
return {
244+
topicId: reply.topic_id,
245+
topicTitle: reply.topic.title,
246+
content: markdownToText(reply.content).slice(0, 233),
247+
user: reply.user,
248+
floor: reply.floor,
249+
targets,
250+
created: reply.created
251+
}
252+
})
226253

227254
return replies
228255
}
@@ -262,7 +289,7 @@ export const searchComment = async (
262289
}
263290
})
264291

265-
const comments: SearchResultReply[] = data.map((comment) => ({
292+
const comments: SearchResultComment[] = data.map((comment) => ({
266293
topicId: comment.topic_id,
267294
topicTitle: comment.topic.title,
268295
content: comment.content.slice(0, 233),

0 commit comments

Comments
 (0)