Chapter lookup modal add back button to clear lookup results

This commit is contained in:
advplyr 2025-08-14 16:03:32 -05:00
parent 3e423839a1
commit 7dcb9b98a0

View file

@ -180,6 +180,7 @@
<ui-loading-indicator /> <ui-loading-indicator />
</div> </div>
<!-- audible chapter lookup modal -->
<modals-modal v-model="showFindChaptersModal" name="edit-book" :width="500" :processing="findingChapters"> <modals-modal v-model="showFindChaptersModal" name="edit-book" :width="500" :processing="findingChapters">
<template #outer> <template #outer>
<div class="absolute top-0 left-0 p-5 w-2/3 overflow-hidden pointer-events-none"> <div class="absolute top-0 left-0 p-5 w-2/3 overflow-hidden pointer-events-none">
@ -205,12 +206,16 @@
</div> </div>
</div> </div>
<div v-else class="w-full p-4"> <div v-else class="w-full p-4">
<div class="flex justify-between mb-4"> <div class="flex mb-4">
<button class="w-7 h-7 rounded-full flex items-center justify-center text-gray-300 hover:text-white flex-shrink-0" :aria-label="$strings.ButtonBack" @click="resetChapterLookupData">
<span class="material-symbols text-lg">arrow_back</span>
</button>
<p> <p>
{{ $strings.LabelDurationFound }} <span class="font-semibold">{{ $secondsToTimestamp(chapterData.runtimeLengthSec) }}</span> {{ $strings.LabelDurationFound }} <span class="font-semibold">{{ $secondsToTimestamp(chapterData.runtimeLengthSec) }}</span>
<br /> <br />
<span class="font-semibold" :class="{ 'text-warning': chapters.length !== chapterData.chapters.length }">{{ chapterData.chapters.length }}</span> {{ $strings.LabelChaptersFound }} <span class="font-semibold" :class="{ 'text-warning': chapters.length !== chapterData.chapters.length }">{{ chapterData.chapters.length }}</span> {{ $strings.LabelChaptersFound }}
</p> </p>
<div class="grow" />
<p> <p>
{{ $strings.LabelYourAudiobookDuration }}: <span class="font-semibold">{{ $secondsToTimestamp(mediaDurationRounded) }}</span {{ $strings.LabelYourAudiobookDuration }}: <span class="font-semibold">{{ $secondsToTimestamp(mediaDurationRounded) }}</span
><br /> ><br />
@ -256,6 +261,8 @@
</div> </div>
</div> </div>
</modals-modal> </modals-modal>
<!-- create bulk chapters modal -->
<modals-modal v-model="showBulkChapterModal" name="bulk-chapters" :width="400"> <modals-modal v-model="showBulkChapterModal" name="bulk-chapters" :width="400">
<template #outer> <template #outer>
<div class="absolute top-0 left-0 p-5 w-2/3 overflow-hidden pointer-events-none"> <div class="absolute top-0 left-0 p-5 w-2/3 overflow-hidden pointer-events-none">
@ -660,6 +667,9 @@ export default {
this.isLoadingChapter = false this.isLoadingChapter = false
this.stopElapsedTimeTracking() this.stopElapsedTimeTracking()
}, },
resetChapterLookupData() {
this.chapterData = null
},
saveChapters() { saveChapters() {
this.checkChapters() this.checkChapters()