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

fix(webui): filter panel would not display values properly

Browse source
This commit is contained in:
Gauthier Roebroeck 2021-02-26 10:38:08 +08:00
parent 70318fb617
commit 0c5a7447f8
2 changed files with 21 additions and 42 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

51
komga-webui/src/views/BrowseCollection.vue
View file

@ -143,17 +143,7 @@ export default Vue.extend({
seriesCopy: [] as SeriesDto[],
selectedSeries: [] as SeriesDto[],
editElements: false,
// we need to define all the possible values, else the properties are not reactive when changed
filters: {
status: [],
readStatus: [],
library: [],
genre: [],
tag: [],
language: [],
ageRating: [],
releaseDate: [],
} as FiltersActive,
filters: {} as FiltersActive,
filterUnwatch: null as any,
drawer: false,
filterOptions: {
@ -212,13 +202,6 @@ export default Vue.extend({
await this.resetParams(this.$route, to.params.collectionId)
this.series = []
this.editElements = false
this.filterOptions.library = []
this.filterOptions.genre = []
this.filterOptions.tag = []
this.filterOptions.publisher = []
this.filterOptions.language = []
this.filterOptions.ageRating = []
this.filterOptions.releaseDate = []
this.loadCollection(to.params.collectionId)
@ -262,27 +245,27 @@ export default Vue.extend({
methods: {
async resetParams(route: any, collectionId: string) {
// load dynamic filters
this.filterOptions.library = this.$store.state.komgaLibraries.libraries.map((x: LibraryDto) => ({
this.$set(this.filterOptions, 'library', this.$store.state.komgaLibraries.libraries.map((x: LibraryDto) => ({
name: x.name,
value: x.id,
}))
this.filterOptions.genre = toNameValue(await this.$komgaReferential.getGenres(undefined, collectionId))
this.filterOptions.tag = toNameValue(await this.$komgaReferential.getTags(undefined, undefined, collectionId))
this.filterOptions.publisher = toNameValue(await this.$komgaReferential.getPublishers(undefined, collectionId))
this.filterOptions.language = (await this.$komgaReferential.getLanguages(undefined, collectionId))
this.filterOptions.ageRating = toNameValue(await this.$komgaReferential.getAgeRatings(undefined, collectionId))
this.filterOptions.releaseDate = toNameValue(await this.$komgaReferential.getSeriesReleaseDates(undefined, collectionId))
})))
this.$set(this.filterOptions, 'genre', toNameValue(await this.$komgaReferential.getGenres(undefined, collectionId)))
this.$set(this.filterOptions, 'tag', toNameValue(await this.$komgaReferential.getTags(undefined, undefined, collectionId)))
this.$set(this.filterOptions, 'publisher', toNameValue(await this.$komgaReferential.getPublishers(undefined, collectionId)))
this.$set(this.filterOptions, 'language', (await this.$komgaReferential.getLanguages(undefined, collectionId)))
this.$set(this.filterOptions, 'ageRating', toNameValue(await this.$komgaReferential.getAgeRatings(undefined, collectionId)))
this.$set(this.filterOptions, 'releaseDate', toNameValue(await this.$komgaReferential.getSeriesReleaseDates(undefined, collectionId)))
// filter query params with available filter values
if (route.query.status || route.query.readStatus || route.query.genre || route.query.tag || route.query.language || route.query.ageRating || route.query.library) {
this.filters.status = parseQueryFilter(route.query.status, Object.keys(SeriesStatus))
this.filters.readStatus = parseQueryFilter(route.query.readStatus, Object.keys(ReadStatus))
this.filters.library = parseQueryFilter(route.query.library, this.filterOptions.library.map(x => x.value))
this.filters.genre = parseQueryFilter(route.query.genre, this.filterOptions.genre.map(x => x.value))
this.filters.tag = parseQueryFilter(route.query.tag, this.filterOptions.tag.map(x => x.value))
this.filters.language = parseQueryFilter(route.query.language, this.filterOptions.language.map(x => x.value))
this.filters.ageRating = parseQueryFilter(route.query.ageRating, this.filterOptions.ageRating.map(x => x.value))
this.filters.releaseDate = parseQueryFilter(route.query.releaseDate, this.filterOptions.releaseDate.map(x => x.value))
this.$set(this.filters, 'status', parseQueryFilter(route.query.status, Object.keys(SeriesStatus)))
this.$set(this.filters, 'readStatus', parseQueryFilter(route.query.readStatus, Object.keys(ReadStatus)))
this.$set(this.filters, 'library', parseQueryFilter(route.query.library, this.filterOptions.library.map(x => x.value)))
this.$set(this.filters, 'genre', parseQueryFilter(route.query.genre, this.filterOptions.genre.map(x => x.value)))
this.$set(this.filters, 'tag', parseQueryFilter(route.query.tag, this.filterOptions.tag.map(x => x.value)))
this.$set(this.filters, 'language', parseQueryFilter(route.query.language, this.filterOptions.language.map(x => x.value)))
this.$set(this.filters, 'ageRating', parseQueryFilter(route.query.ageRating, this.filterOptions.ageRating.map(x => x.value)))
this.$set(this.filters, 'releaseDate', parseQueryFilter(route.query.releaseDate, this.filterOptions.releaseDate.map(x => x.value)))
} else {
this.filters = this.$cookies.get(this.cookieFilter(route.params.collectionId)) || {} as FiltersActive
}

12
komga-webui/src/views/BrowseSeries.vue
View file

@ -326,10 +326,7 @@ export default Vue.extend({
totalElements: null as number | null,
sortActive: {} as SortActive,
sortDefault: {key: 'metadata.numberSort', order: 'asc'} as SortActive,
filters: {
readStatus: [],
tag: [],
} as FiltersActive,
filters: {} as FiltersActive,
sortUnwatch: null as any,
filterUnwatch: null as any,
pageUnwatch: null as any,
@ -451,7 +448,6 @@ export default Vue.extend({
this.totalElements = null
this.books = []
this.collections = []
this.filterOptions.tag = []
this.loadSeries(to.params.seriesId)
@ -465,11 +461,11 @@ export default Vue.extend({
this.sortActive = this.parseQuerySortOrDefault(route.query.sort)
// load dynamic filters
this.filterOptions.tag = toNameValue(await this.$komgaReferential.getTags(undefined, this.seriesId))
this.$set(this.filterOptions, 'tag', toNameValue(await this.$komgaReferential.getTags(undefined, seriesId)))
// filter query params with available filter values
this.filters.readStatus = parseQueryFilter(this.$route.query.readStatus, Object.keys(ReadStatus))
this.filters.tag = parseQueryFilter(this.$route.query.tag, this.filterOptions.tag.map(x => x.value))
this.$set(this.filters, 'readStatus', parseQueryFilter(this.$route.query.readStatus, Object.keys(ReadStatus)))
this.$set(this.filters, 'tag', parseQueryFilter(this.$route.query.tag, this.filterOptions.tag.map(x => x.value)))
},
setWatches() {
this.sortUnwatch = this.$watch('sortActive', this.updateRouteAndReload)