fix: wire up EndingGallery click to open ChapterRecap via chapterId

This commit is contained in:
2026-06-09 17:57:21 +08:00
parent 9297117544
commit 906965c963
4 changed files with 18 additions and 4 deletions

View File

@@ -92,6 +92,7 @@ export interface EndingDef {
id: string id: string
label: string label: string
sceneId: string sceneId: string
chapterId?: string
thumbnail?: string thumbnail?: string
} }

View File

@@ -32,9 +32,9 @@
} }
], ],
"endings": [ "endings": [
{ "id": "trust_end", "label": "信任的伙伴", "sceneId": "trust_ending", "thumbnail": "/images/end_trust.jpg" }, { "id": "trust_end", "label": "信任的伙伴", "sceneId": "trust_ending", "chapterId": "ch1", "thumbnail": "/images/end_trust.jpg" },
{ "id": "alone_end", "label": "独行之路", "sceneId": "alone_ending", "thumbnail": "/images/end_alone.jpg" }, { "id": "alone_end", "label": "独行之路", "sceneId": "alone_ending", "chapterId": "ch1", "thumbnail": "/images/end_alone.jpg" },
{ "id": "continue_end", "label": "继续前行", "sceneId": "continue_ending", "thumbnail": "/images/end_continue.jpg" } { "id": "continue_end", "label": "继续前行", "sceneId": "continue_ending", "chapterId": "ch3", "thumbnail": "/images/end_continue.jpg" }
], ],
"chapters": [ "chapters": [
{ {

View File

@@ -240,6 +240,7 @@ init()
:endings="store.endings" :endings="store.endings"
:visited-ids="store.visitedSceneIds" :visited-ids="store.visitedSceneIds"
@close="showEndingGallery = false" @close="showEndingGallery = false"
@select-chapter="(chId: string) => { showEndingGallery = false; recapChapterId = chId }"
/> />
<ChapterRecap <ChapterRecap
v-if="recapChapterId" v-if="recapChapterId"

View File

@@ -8,6 +8,7 @@ defineProps<{
const emit = defineEmits<{ const emit = defineEmits<{
close: [] close: []
selectChapter: [chapterId: string]
}>() }>()
function isUnlocked(ending: EndingDef, visitedIds: Set<string>): boolean { function isUnlocked(ending: EndingDef, visitedIds: Set<string>): boolean {
@@ -25,7 +26,8 @@ function isUnlocked(ending: EndingDef, visitedIds: Set<string>): boolean {
v-for="end in endings" v-for="end in endings"
:key="end.id" :key="end.id"
class="ending-card" class="ending-card"
:class="{ locked: !isUnlocked(end, visitedIds) }" :class="{ locked: !isUnlocked(end, visitedIds), clickable: isUnlocked(end, visitedIds) && !!end.chapterId }"
@click="isUnlocked(end, visitedIds) && end.chapterId && emit('selectChapter', end.chapterId)"
> >
<div class="ending-thumb"> <div class="ending-thumb">
<img v-if="end.thumbnail" :src="end.thumbnail" class="thumb-img" /> <img v-if="end.thumbnail" :src="end.thumbnail" class="thumb-img" />
@@ -89,6 +91,16 @@ function isUnlocked(ending: EndingDef, visitedIds: Set<string>): boolean {
opacity: 0.4; opacity: 0.4;
} }
.ending-card.clickable {
cursor: pointer;
}
.ending-card.clickable:hover {
opacity: 0.85;
transform: scale(1.05);
transition: transform 0.15s ease;
}
.ending-thumb { .ending-thumb {
width: 120px; width: 120px;
height: 68px; height: 68px;