feat(webui): display number of pages left on book details view

Closes: #1012
This commit is contained in:
Gauthier Roebroeck 2023-01-17 15:11:14 +08:00
parent 4d9717287a
commit 77424b1b1c
3 changed files with 18 additions and 1 deletions

View file

@ -14,3 +14,10 @@ export function getReadProgressPercentage (book: BookDto): number {
}
return 0
}
export function getPagesLeft (book: BookDto): number {
if (book.readProgress?.completed === false) {
return book.media.pagesCount - book.readProgress?.page
}
return 0
}

View file

@ -219,6 +219,7 @@
"page": "Page",
"page_number": "Page number",
"pages": "pages",
"pages_left": "No pages left | 1 page left | {count} pages left",
"pages_n": "No pages | 1 page | {count} pages",
"password": "Password",
"pending_tasks": "No pending tasks | 1 pending task | {count} pending tasks",

View file

@ -111,6 +111,12 @@
no-link
:action-menu="false"
></item-card>
<div v-if="isInProgress"
class="text-caption text-center mt-1"
:title="$t('common.read_on', {date: readProgressDate})"
>
{{ $tc('common.pages_left', pagesLeft) }}
</div>
</v-col>
<v-col cols="8">
@ -395,7 +401,7 @@ import ItemCard from '@/components/ItemCard.vue'
import ToolbarSticky from '@/components/bars/ToolbarSticky.vue'
import {groupAuthorsByRole} from '@/functions/authors'
import {getBookFormatFromMediaType} from '@/functions/book-format'
import {getReadProgress, getReadProgressPercentage} from '@/functions/book-progress'
import {getPagesLeft, getReadProgress, getReadProgressPercentage} from '@/functions/book-progress'
import {getBookTitleCompact} from '@/functions/book-title'
import {bookFileUrl, bookThumbnailUrl} from '@/functions/urls'
import {MediaStatus, ReadStatus} from '@/types/enum-books'
@ -504,6 +510,9 @@ export default Vue.extend({
isInProgress(): boolean {
return getReadProgress(this.book) === ReadStatus.IN_PROGRESS
},
pagesLeft(): number {
return getPagesLeft(this.book)
},
readProgressPercentage(): number {
return getReadProgressPercentage(this.book)
},