mirror of
				https://github.com/advplyr/audiobookshelf.git
				synced 2025-10-27 11:18:14 +01:00 
			
		
		
		
	Add:Progress bar on series covers #1734
This commit is contained in:
		
							parent
							
								
									4db26f9f79
								
							
						
					
					
						commit
						5286b53334
					
				| @ -7,7 +7,7 @@ | ||||
| 
 | ||||
|     <div class="absolute z-10 top-1.5 right-1.5 rounded-md leading-3 text-sm p-1 font-semibold text-white flex items-center justify-center" style="background-color: #cd9d49dd">{{ books.length }}</div> | ||||
| 
 | ||||
|     <div v-if="isSeriesFinished" class="absolute bottom-0 left-0 h-1 shadow-sm max-w-full z-10 rounded-b bg-success w-full" /> | ||||
|     <div v-if="seriesPercentInProgress > 0" class="absolute bottom-0 left-0 h-1 shadow-sm max-w-full z-10 rounded-b w-full" :class="isSeriesFinished ? 'bg-success' : 'bg-yellow-400'" :style="{ width: seriesPercentInProgress * 100 + '%' }" /> | ||||
| 
 | ||||
|     <div v-if="hasValidCovers" class="bg-black bg-opacity-60 absolute top-0 left-0 w-full h-full flex items-center justify-center text-center transition-opacity" :class="isHovering ? '' : 'opacity-0'" :style="{ padding: `${sizeMultiplier}rem` }"> | ||||
|       <p :style="{ fontSize: 1.2 * sizeMultiplier + 'rem' }">{{ displayTitle }}</p> | ||||
| @ -87,10 +87,10 @@ export default { | ||||
|         case 'totalDuration': | ||||
|           return `${this.$strings.LabelDuration} ${this.$elapsedPrettyExtended(this.totalDuration, false)}` | ||||
|         case 'lastBookUpdated': | ||||
|           const lastUpdated = Math.max(...(this.books).map(x => x.updatedAt), 0) | ||||
|           const lastUpdated = Math.max(...this.books.map((x) => x.updatedAt), 0) | ||||
|           return `${this.$strings.LabelLastBookUpdated} ${this.$formatDate(lastUpdated, this.dateFormat)}` | ||||
|         case 'lastBookAdded': | ||||
|           const lastBookAdded = Math.max(...(this.books).map(x => x.addedAt), 0) | ||||
|           const lastBookAdded = Math.max(...this.books.map((x) => x.addedAt), 0) | ||||
|           return `${this.$strings.LabelLastBookAdded} ${this.$formatDate(lastBookAdded, this.dateFormat)}` | ||||
|         default: | ||||
|           return null | ||||
| @ -115,6 +115,14 @@ export default { | ||||
|     seriesBooksFinished() { | ||||
|       return this.seriesBookProgress.filter((p) => p.isFinished) | ||||
|     }, | ||||
|     hasSeriesBookInProgress() { | ||||
|       return this.seriesBookProgress.some((p) => !p.isFinished && p.progress > 0) | ||||
|     }, | ||||
|     seriesPercentInProgress() { | ||||
|       let totalFinishedAndInProgress = this.seriesBooksFinished.length | ||||
|       if (this.hasSeriesBookInProgress) totalFinishedAndInProgress += 1 | ||||
|       return Math.min(1, Math.max(0, totalFinishedAndInProgress / this.books.length)) | ||||
|     }, | ||||
|     isSeriesFinished() { | ||||
|       return this.books.length === this.seriesBooksFinished.length | ||||
|     }, | ||||
|  | ||||
		Loading…
	
		Reference in New Issue
	
	Block a user