mirror/advplyr.audiobookshelf
1
0
Fork 0
mirror of https://github.com/advplyr/audiobookshelf.git synced 2025-08-03 01:35:08 +02:00
Code Issues Projects Releases Packages Wiki Activity Actions 9

Add:Multi-select for podcast episodes and batch delete, Update:Episode row ui for mobile screens

Browse source
This commit is contained in:
advplyr 2022-08-14 12:34:21 -05:00
parent 9f200ece99
commit 2c0c53bbf1
3 changed files with 100 additions and 37 deletions
Download patch file Download diff file Expand all files Collapse all files

54
client/components/modals/podcast/RemoveEpisode.vue
View file

@ -7,16 +7,17 @@
</template>
<div ref="wrapper" class="px-8 py-6 w-full text-sm rounded-lg bg-bg shadow-lg border border-black-300 relative overflow-hidden">
<div class="mb-4">
<p class="text-lg text-gray-200 mb-4">
<p v-if="episode" class="text-lg text-gray-200 mb-4">
Are you sure you want to remove episode<br /><span class="text-base">{{ episodeTitle }}</span
>?
</p>
<p v-else class="text-lg text-gray-200 mb-4">Are you sure you want to remove {{ episodes.length }} episodes?</p>
<p class="text-xs font-semibold text-warning text-opacity-90">Note: This does not delete the audio file unless toggling "Hard delete file"</p>
</div>
<div class="flex justify-between items-center pt-4">
<ui-checkbox v-model="hardDeleteFile" label="Hard delete file" check-color="error" checkbox-bg="bg" small label-class="text-base text-gray-200 pl-3" />
<ui-btn @click="submit">{{ hardDeleteFile ? 'Delete episode' : 'Remove episode' }}</ui-btn>
<ui-btn @click="submit">{{ btnText }}</ui-btn>
</div>
</div>
</modals-modal>
@ -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() {}