diff --git a/client/components/modals/podcast/RemoveEpisode.vue b/client/components/modals/podcast/RemoveEpisode.vue index b7839dae..de4e0ea7 100644 --- a/client/components/modals/podcast/RemoveEpisode.vue +++ b/client/components/modals/podcast/RemoveEpisode.vue @@ -7,16 +7,17 @@
-

+

Are you sure you want to remove episode
{{ episodeTitle }}?

+

Are you sure you want to remove {{ episodes.length }} episodes?

Note: This does not delete the audio file unless toggling "Hard delete file"

- {{ hardDeleteFile ? 'Delete episode' : 'Remove episode' }} + {{ btnText }}
@@ -30,9 +31,9 @@ export default { type: Object, default: () => {} }, - episode: { - type: Object, - default: () => {} + episodes: { + type: Array, + default: () => [] } }, data() { @@ -55,34 +56,49 @@ export default { this.$emit('input', val) } }, + episode() { + if (this.episodes.length === 1) return this.episodes[0] + return null + }, title() { + if (this.episodes.length > 1) return `Remove ${this.episodes.length} episodes` return 'Remove Episode' }, - episodeId() { - return this.episode ? this.episode.id : null + btnText() { + if (this.episodes.length > 1) return this.hardDeleteFile ? `Delete ${this.episodes.length} episodes` : `Remove ${this.episodes.length} episodes` + return this.hardDeleteFile ? 'Delete episode' : 'Remove episode' }, episodeTitle() { return this.episode ? this.episode.title : null } }, methods: { - submit() { + async submit() { this.processing = true var queryString = this.hardDeleteFile ? '?hard=1' : '' - this.$axios - .$delete(`/api/podcasts/${this.libraryItem.id}/episode/${this.episodeId}${queryString}`) - .then(() => { + for (const episode of this.episodes) { + const success = await this.$axios + .$delete(`/api/podcasts/${this.libraryItem.id}/episode/${episode.id}${queryString}`) + .then(() => true) + .catch((error) => { + var errorMsg = error.response && error.response.data ? error.response.data : 'Failed to remove episode' + console.error('Failed to remove episode', error) + this.$toast.error(errorMsg) + return false + }) + if (!success) { this.processing = false - this.$toast.success('Podcast episode removed') this.show = false - }) - .catch((error) => { - var errorMsg = error.response && error.response.data ? error.response.data : 'Failed remove episode' - console.error('Failed update episode', error) - this.processing = false - this.$toast.error(errorMsg) - }) + this.$emit('clearSelected') + return + } + } + + this.processing = false + this.$toast.success(`${this.episodes.length} episode${this.episodes.length > 1 ? 's' : ''} removed`) + this.show = false + this.$emit('clearSelected') } }, mounted() {} diff --git a/client/components/tables/podcast/EpisodeTableRow.vue b/client/components/tables/podcast/EpisodeTableRow.vue index a29e0dc4..31509954 100644 --- a/client/components/tables/podcast/EpisodeTableRow.vue +++ b/client/components/tables/podcast/EpisodeTableRow.vue @@ -1,6 +1,6 @@ @@ -28,7 +32,9 @@ export default { sortKey: 'publishedAt', sortDesc: true, selectedEpisode: null, - showPodcastRemoveModal: false + showPodcastRemoveModal: false, + selectedEpisodes: [], + episodesToRemove: [] } }, watch: { @@ -37,6 +43,9 @@ export default { } }, computed: { + isSelectionMode() { + return this.selectedEpisodes.length > 0 + }, userCanUpdate() { return this.$store.getters['user/getUserCanUpdate'] }, @@ -59,8 +68,31 @@ export default { } }, methods: { + removeEpisodeModalToggled(val) { + if (!val) this.episodesToRemove = [] + }, + clearSelected() { + const episodeRows = this.$refs.episodeRow + if (episodeRows && episodeRows.length) { + for (const epRow of episodeRows) { + if (epRow) epRow.isSelected = false + } + } + this.selectedEpisodes = [] + }, + removeSelectedEpisodes() { + this.episodesToRemove = this.selectedEpisodes + this.showPodcastRemoveModal = true + }, + episodeSelected({ isSelected, episode }) { + if (isSelected) { + this.selectedEpisodes.push(episode) + } else { + this.selectedEpisodes = this.selectedEpisodes.filter((ep) => ep.id !== episode.id) + } + }, removeEpisode(episode) { - this.selectedEpisode = episode + this.episodesToRemove = [episode] this.showPodcastRemoveModal = true }, editEpisode(episode) {