diff --git a/komga-webui/src/components/CardSeries.vue b/komga-webui/src/components/CardSeries.vue index 50c83a38e..473d9958c 100644 --- a/komga-webui/src/components/CardSeries.vue +++ b/komga-webui/src/components/CardSeries.vue @@ -1,34 +1,61 @@ - diff --git a/komga-webui/src/components/EditSeriesDialog.vue b/komga-webui/src/components/EditSeriesDialog.vue index 7f1f1f477..0d8f8c2a3 100644 --- a/komga-webui/src/components/EditSeriesDialog.vue +++ b/komga-webui/src/components/EditSeriesDialog.vue @@ -9,7 +9,7 @@ mdi-close - Edit {{ $_.get(series, 'metadata.title') }} + {{ dialogTitle }} Save changes @@ -18,7 +18,7 @@ mdi-pencil - Edit {{ $_.get(series, 'metadata.title') }} + {{ dialogTitle }} @@ -34,7 +34,7 @@ - + - + capitalize(x)), form: { status: '', statusLock: false, @@ -144,7 +143,7 @@ export default Vue.extend({ props: { value: Boolean, series: { - type: Object, + type: Array as () => SeriesDto[], required: true } }, @@ -160,18 +159,34 @@ export default Vue.extend({ } }, computed: { - libraries (): LibraryDto[] { - return this.$store.state.komgaLibraries.libraries + multiple (): boolean { + return this.series.length > 1 + }, + seriesStatus (): string[] { + return Object.keys(SeriesStatus).map(x => capitalize(x)) + }, + dialogTitle (): string { + return this.multiple + ? `Edit ${this.series.length} series` + : `Edit ${this.$_.get(this.series[0], 'metadata.title')}` } }, methods: { - dialogReset (series: SeriesDto) { - this.form.status = capitalize(series.metadata.status) - this.form.statusLock = series.metadata.statusLock - this.form.title = series.metadata.title - this.form.titleLock = series.metadata.titleLock - this.form.titleSort = series.metadata.titleSort - this.form.titleSortLock = series.metadata.titleSortLock + dialogReset (series: SeriesDto[]) { + if (series.length === 0) return + if (series.length > 1) { + const status = this.$_.uniq(series.map(x => x.metadata.status)) + this.form.status = status.length > 1 ? '' : capitalize(status[0]) + const statusLock = this.$_.uniq(series.map(x => x.metadata.statusLock)) + this.form.statusLock = statusLock.length > 1 ? false : statusLock[0] + } else { + this.form.status = capitalize(series[0].metadata.status) + this.form.statusLock = series[0].metadata.statusLock + this.form.title = series[0].metadata.title + this.form.titleLock = series[0].metadata.titleLock + this.form.titleSort = series[0].metadata.titleSort + this.form.titleSortLock = series[0].metadata.titleSortLock + } }, dialogCancel () { this.$emit('input', false) @@ -186,21 +201,34 @@ export default Vue.extend({ this.snackbar = true }, async editSeries () { - try { - const metadata = { - status: this.form.status.toUpperCase(), - statusLock: this.form.statusLock, - title: this.form.title, - titleLock: this.form.titleLock, - titleSort: this.form.titleSort, - titleSortLock: this.form.titleSortLock - } as SeriesMetadataUpdateDto + const updated = [] as SeriesDto[] + for (const s of this.series) { + try { + if (this.form.status === '') { + return + } + const metadata = { + status: this.form.status.toUpperCase(), + statusLock: this.form.statusLock + } as SeriesMetadataUpdateDto - const updatedSeries = await this.$komgaSeries.updateMetadata(this.series.id, metadata) - this.$emit('update:series', updatedSeries) - } catch (e) { - this.showSnack(e.message) + if (!this.multiple) { + this.$_.merge(metadata, { + title: this.form.title, + titleLock: this.form.titleLock, + titleSort: this.form.titleSort, + titleSortLock: this.form.titleSortLock + }) + } + + const updatedSeries = await this.$komgaSeries.updateMetadata(s.id, metadata) + updated.push(updatedSeries) + } catch (e) { + this.showSnack(e.message) + updated.push(s) + } } + this.$emit('update:series', updated) } } }) diff --git a/komga-webui/src/components/ToolbarSticky.vue b/komga-webui/src/components/ToolbarSticky.vue index 4ad12e874..316b816d2 100644 --- a/komga-webui/src/components/ToolbarSticky.vue +++ b/komga-webui/src/components/ToolbarSticky.vue @@ -1,8 +1,9 @@ @@ -136,6 +136,14 @@ export default mixins(VisibleElements).extend({ }, thumbnailUrl (): string { return seriesThumbnailUrl(this.seriesId) + }, + seriesArray: { + get (): SeriesDto[] { + return [this.series] + }, + set (val: SeriesDto[]) { + this.series = val[0] + } } }, props: { diff --git a/komga-webui/src/views/Dashboard.vue b/komga-webui/src/views/Dashboard.vue index 3153aeac0..b0010aafe 100644 --- a/komga-webui/src/views/Dashboard.vue +++ b/komga-webui/src/views/Dashboard.vue @@ -1,6 +1,10 @@ @@ -80,17 +86,20 @@ import CardBook from '@/components/CardBook.vue' import CardSeries from '@/components/CardSeries.vue' import HorizontalScroller from '@/components/HorizontalScroller.vue' import Vue from 'vue' +import EditSeriesDialog from '@/components/EditSeriesDialog.vue' export default Vue.extend({ name: 'Dashboard', - components: { CardSeries, CardBook, HorizontalScroller }, + components: { CardSeries, CardBook, HorizontalScroller, EditSeriesDialog }, data: () => { const pageSize = 20 return { newSeries: Array(pageSize).fill(null) as SeriesDto[], updatedSeries: Array(pageSize).fill(null) as SeriesDto[], books: Array(pageSize).fill(null) as BookDto[], - pageSize: pageSize + pageSize: pageSize, + editSeriesSingle: [] as SeriesDto[], + dialogEditSingle: false } }, mounted () { @@ -102,6 +111,16 @@ export default Vue.extend({ this.loadLatestBooks() } }, + watch: { + editSeriesSingle (val: SeriesDto[]) { + val.forEach(s => { + const index = this.newSeries.findIndex(x => x.id === s.id) + if (index !== -1) { + this.newSeries[index] = s + } + }) + } + }, methods: { async loadNewSeries () { this.newSeries = (await this.$komgaSeries.getNewSeries()).content @@ -116,6 +135,10 @@ export default Vue.extend({ } as PageRequest this.books = (await this.$komgaBooks.getBooks(undefined, pageRequest)).content + }, + singleEdit (series: SeriesDto) { + this.editSeriesSingle = [series] + this.dialogEditSingle = true } } })