Backup_Repos/komga
1
0
Fork 0
mirror of https://github.com/gotson/komga.git synced 2025-12-22 00:13:30 +01:00
Code Issues Projects Releases Wiki Activity

refactor: proper parameter passing

Browse source 
use beforeRouteUpdate
remove chip in toolbar
This commit is contained in:
Gauthier Roebroeck 2021-04-27 21:29:21 +08:00
parent 34b2beb993
commit 2a3398f768
3 changed files with 92 additions and 85 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

12
komga-webui/src/services/komga-books.service.ts
View file

@ -1,5 +1,5 @@
import { AxiosInstance } from 'axios'
import { BookDto, BookMetadataUpdateDto, PageDto, ReadProgressUpdateDto } from '@/types/komga-books'
import {AxiosInstance} from 'axios'
import {BookDto, BookMetadataUpdateDto, PageDto, ReadProgressUpdateDto} from '@/types/komga-books'
const qs = require('qs')
@ -40,10 +40,14 @@ export default class KomgaBooksService {
}
}
async getBooksOnDeck (pageRequest?: PageRequest): Promise<Page<BookDto>> {
async getBooksOnDeck (libraryId?: string, pageRequest?: PageRequest): Promise<Page<BookDto>> {
try {
const params = { ...pageRequest } as any
if (libraryId) {
params.library_id = libraryId
}
return (await this.http.get(`${API_BOOKS}/ondeck`, {
params: { ...pageRequest },
params: params,
})).data
} catch (e) {
let msg = 'An error occurred while trying to retrieve books on deck'

10
komga-webui/src/services/komga-series.service.ts
View file

@ -43,9 +43,12 @@ export default class KomgaSeriesService {
}
}
async getNewSeries (pageRequest?: PageRequest): Promise<Page<SeriesDto>> {
async getNewSeries (libraryId?: string, pageRequest?: PageRequest): Promise<Page<SeriesDto>> {
try {
const params = { ...pageRequest } as any
if (libraryId) {
params.library_id = libraryId
}
return (await this.http.get(`${API_SERIES}/new`, {
params: params,
})).data
@ -58,9 +61,12 @@ export default class KomgaSeriesService {
}
}
async getUpdatedSeries (pageRequest?: PageRequest): Promise<Page<SeriesDto>> {
async getUpdatedSeries (libraryId?: string, pageRequest?: PageRequest): Promise<Page<SeriesDto>> {
try {
const params = { ...pageRequest } as any
if (libraryId) {
params.library_id = libraryId
}
return (await this.http.get(`${API_SERIES}/updated`, {
params: params,
})).data

155
komga-webui/src/views/Dashboard.vue
View file

@ -1,19 +1,13 @@
<template>
<div :style="libraryId && $vuetify.breakpoint.name === 'xs' ? 'margin-bottom: 56px' : undefined">
<div v-if="libraryId">
<toolbar-sticky v-if="selectedSeries.length === 0">
<div :style="$vuetify.breakpoint.name === 'xs' ? 'margin-bottom: 56px' : undefined">
<toolbar-sticky v-if="showLibraryBar && selectedSeries.length === 0">
<!-- Action menu -->
<library-actions-menu v-if="library"
:library="library"/>
<library-actions-menu
v-if="library"
:library="library"
/>
<v-toolbar-title>
<span>{{ library ? library.name : $t('common.all_libraries') }}</span>
<v-chip label class="mx-4" v-if="totalElements">
<span style="font-size: 1.1rem">{{ totalElements }}</span>
</v-chip>
</v-toolbar-title>
<v-toolbar-title>
<span>{{ library ? library.name : $t('common.all_libraries') }}</span>
</v-toolbar-title>
</toolbar-sticky>
@ -138,6 +132,7 @@ import {BookDto} from '@/types/komga-books'
import {BOOK_CHANGED, LIBRARY_DELETED, SERIES_CHANGED} from '@/types/events'
import Vue from 'vue'
import {SeriesDto} from "@/types/komga-series";
import {LIBRARIES_ALL} from "@/types/library";
export default Vue.extend({
name: 'Dashboard',
@ -163,68 +158,80 @@ export default Vue.extend({
selectedBooks: [] as BookDto[],
}
},
created () {
created() {
this.$eventHub.$on(LIBRARY_DELETED, this.libraryDeleted)
this.$eventHub.$on(SERIES_CHANGED, this.loadAll)
this.$eventHub.$on(BOOK_CHANGED, this.loadAll)
this.$eventHub.$on(SERIES_CHANGED, this.reload)
this.$eventHub.$on(BOOK_CHANGED, this.reload)
},
beforeDestroy () {
beforeDestroy() {
this.$eventHub.$off(LIBRARY_DELETED, this.libraryDeleted)
this.$eventHub.$off(SERIES_CHANGED, this.loadAll)
this.$eventHub.$off(BOOK_CHANGED, this.loadAll)
this.$eventHub.$off(SERIES_CHANGED, this.reload)
this.$eventHub.$off(BOOK_CHANGED, this.reload)
},
mounted () {
this.loadAll()
mounted() {
this.reload()
},
props: {
libraryId: {
type: String,
default: LIBRARIES_ALL,
},
},
watch: {
selectedSeries (val: SeriesDto[]) {
selectedSeries(val: SeriesDto[]) {
val.forEach(i => this.replaceSeries(i))
},
selectedBooks (val: BookDto[]) {
selectedBooks(val: BookDto[]) {
val.forEach(i => this.replaceBook(i))
},
'$route.path': function(val, oldVal){
this.loadAll()
},
},
beforeRouteUpdate(to, from, next) {
if (to.params.libraryId !== from.params.libraryId) {
this.loadAll(to.params.libraryId)
}
next()
},
computed: {
fixedCardWidth (): number {
fixedCardWidth(): number {
return this.$vuetify.breakpoint.name === 'xs' ? 120 : 150
},
allEmpty (): boolean {
allEmpty(): boolean {
return this.newSeries.length === 0 &&
this.updatedSeries.length === 0 &&
this.latestBooks.length === 0 &&
this.inProgressBooks.length === 0 &&
this.onDeckBooks.length === 0
},
showLibraryBar(): boolean {
return this.libraryId !== LIBRARIES_ALL
},
},
methods: {
libraryDeleted () {
getRequestLibraryId(libraryId: string): string | undefined {
return libraryId !== LIBRARIES_ALL ? libraryId : undefined
},
libraryDeleted() {
if (this.$store.state.komgaLibraries.libraries.length === 0) {
this.$router.push({ name: 'welcome' })
this.$router.push({name: 'welcome'})
} else {
this.loadAll()
this.reload()
}
},
loadAll () {
if(this.libraryId){
this.loadLibrary(this.libraryId)
}
reload() {
this.loadAll(this.libraryId)
},
loadAll(libraryId: string) {
this.library = this.getLibraryLazy(libraryId)
this.selectedSeries = []
this.selectedBooks = []
this.loadNewSeries()
this.loadUpdatedSeries()
this.loadLatestBooks()
this.loadInProgressBooks()
this.loadOnDeckBooks()
this.loadNewSeries(libraryId)
this.loadUpdatedSeries(libraryId)
this.loadLatestBooks(libraryId)
this.loadInProgressBooks(libraryId)
this.loadOnDeckBooks(libraryId)
},
replaceSeries (series: SeriesDto) {
replaceSeries(series: SeriesDto) {
let index = this.newSeries.findIndex(x => x.id === series.id)
if (index !== -1) {
this.newSeries.splice(index, 1, series)
@ -234,7 +241,7 @@ export default Vue.extend({
this.updatedSeries.splice(index, 1, series)
}
},
replaceBook (book: BookDto) {
replaceBook(book: BookDto) {
let index = this.latestBooks.findIndex(x => x.id === book.id)
if (index !== -1) {
this.latestBooks.splice(index, 1, book)
@ -248,48 +255,36 @@ export default Vue.extend({
this.onDeckBooks.splice(index, 1, book)
}
},
async loadNewSeries () {
const pageRequest = {
library_id: this.libraryId,
} as PageRequest
this.newSeries = (await this.$komgaSeries.getNewSeries(pageRequest)).content
async loadNewSeries(libraryId: string) {
this.newSeries = (await this.$komgaSeries.getNewSeries(this.getRequestLibraryId(libraryId))).content
},
async loadUpdatedSeries () {
const pageRequest = {
library_id: this.libraryId,
} as PageRequest
this.updatedSeries = (await this.$komgaSeries.getUpdatedSeries(pageRequest)).content
async loadUpdatedSeries(libraryId: string) {
this.updatedSeries = (await this.$komgaSeries.getUpdatedSeries(this.getRequestLibraryId(libraryId))).content
},
async loadLatestBooks () {
async loadLatestBooks(libraryId: string) {
const pageRequest = {
sort: ['createdDate,desc'],
library_id: this.libraryId,
} as PageRequest
this.latestBooks = (await this.$komgaBooks.getBooks(undefined, pageRequest)).content
this.latestBooks = (await this.$komgaBooks.getBooks(this.getRequestLibraryId(libraryId), pageRequest)).content
},
async loadInProgressBooks () {
async loadInProgressBooks(libraryId: string) {
const pageRequest = {
sort: ['readProgress.lastModified,desc'],
library_id: this.libraryId,
} as PageRequest
this.inProgressBooks = (await this.$komgaBooks.getBooks(undefined, pageRequest, undefined, undefined, [ReadStatus.IN_PROGRESS])).content
this.inProgressBooks = (await this.$komgaBooks.getBooks(this.getRequestLibraryId(libraryId), pageRequest, undefined, undefined, [ReadStatus.IN_PROGRESS])).content
},
async loadOnDeckBooks () {
const pageRequest = {
library_id: this.libraryId,
} as PageRequest
this.onDeckBooks = (await this.$komgaBooks.getBooksOnDeck(pageRequest)).content
async loadOnDeckBooks(libraryId: string) {
this.onDeckBooks = (await this.$komgaBooks.getBooksOnDeck(this.getRequestLibraryId(libraryId))).content
},
singleEditSeries (series: SeriesDto) {
singleEditSeries(series: SeriesDto) {
this.$store.dispatch('dialogUpdateSeries', series)
},
singleEditBook (book: BookDto) {
singleEditBook(book: BookDto) {
this.$store.dispatch('dialogUpdateBooks', book)
},
async markSelectedSeriesRead () {
async markSelectedSeriesRead() {
await Promise.all(this.selectedSeries.map(s =>
this.$komgaSeries.markAsRead(s.id),
))
@ -297,7 +292,7 @@ export default Vue.extend({
this.$komgaSeries.getOneSeries(s.id),
))
},
async markSelectedSeriesUnread () {
async markSelectedSeriesUnread() {
await Promise.all(this.selectedSeries.map(s =>
this.$komgaSeries.markAsUnread(s.id),
))
@ -305,27 +300,27 @@ export default Vue.extend({
this.$komgaSeries.getOneSeries(s.id),
))
},
addToCollection () {
addToCollection() {
this.$store.dispatch('dialogAddSeriesToCollection', this.selectedSeries)
},
editMultipleSeries () {
editMultipleSeries() {
this.$store.dispatch('dialogUpdateSeries', this.selectedSeries)
},
editMultipleBooks () {
editMultipleBooks() {
this.$store.dispatch('dialogUpdateBooks', this.selectedBooks)
},
addToReadList () {
addToReadList() {
this.$store.dispatch('dialogAddBooksToReadList', this.selectedBooks)
},
async markSelectedBooksRead () {
async markSelectedBooksRead() {
await Promise.all(this.selectedBooks.map(b =>
this.$komgaBooks.updateReadProgress(b.id, { completed: true }),
this.$komgaBooks.updateReadProgress(b.id, {completed: true}),
))
this.selectedBooks = await Promise.all(this.selectedBooks.map(b =>
this.$komgaBooks.getBook(b.id),
))
},
async markSelectedBooksUnread () {
async markSelectedBooksUnread() {
await Promise.all(this.selectedBooks.map(b =>
this.$komgaBooks.deleteReadProgress(b.id),
))
@ -333,9 +328,11 @@ export default Vue.extend({
this.$komgaBooks.getBook(b.id),
))
},
loadLibrary(libraryId: string) {
if (libraryId) {
this.library = this.$store.getters.getLibraryById(libraryId)
getLibraryLazy(libraryId: string): LibraryDto | undefined {
if (libraryId !== LIBRARIES_ALL) {
return this.$store.getters.getLibraryById(libraryId)
} else {
return undefined
}
},
},