mirror of
https://github.com/VueTorrent/VueTorrent.git
synced 2025-03-14 12:10:18 +03:00
Number of items in Dashboard view [#42]
This commit is contained in:
parent
e78d5da7f2
commit
03b33d79f5
6 changed files with 40 additions and 7 deletions
|
@ -36,6 +36,12 @@
|
|||
@input="setCategoryFilter"
|
||||
height="55"
|
||||
></v-select>
|
||||
<div
|
||||
style="font-size: 0.9em"
|
||||
class="download--text text-uppercase text-center"
|
||||
>
|
||||
{{ torrentCountString }}
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
|
@ -62,7 +68,7 @@ export default {
|
|||
selectedCategory: null
|
||||
}),
|
||||
computed: {
|
||||
...mapGetters(['getCategories']),
|
||||
...mapGetters(['getCategories', 'getTorrentCountString']),
|
||||
availableCategories() {
|
||||
const categories = ['All', 'Uncategorized']
|
||||
categories.push(...Object.keys(this.getCategories()))
|
||||
|
@ -77,6 +83,9 @@ export default {
|
|||
default:
|
||||
return this.selectedCategory
|
||||
}
|
||||
},
|
||||
torrentCountString() {
|
||||
return this.getTorrentCountString()
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
|
|
|
@ -50,7 +50,7 @@
|
|||
/>
|
||||
<FilterSelect />
|
||||
</v-flex>
|
||||
<v-container>
|
||||
<v-container class="mt-12">
|
||||
<BottomActions />
|
||||
</v-container>
|
||||
</v-navigation-drawer>
|
||||
|
|
|
@ -13,5 +13,12 @@ export default {
|
|||
getCategories: state => () => state.categories,
|
||||
getModals: state => () => state.modals,
|
||||
getTorrents: state => () => state.torrents,
|
||||
getAuthenticated: state => () => state.authenticated
|
||||
getAuthenticated: state => () => state.authenticated,
|
||||
getTorrentCountString: state => () => {
|
||||
if (state.selected_torrents && state.selected_torrents.length) {
|
||||
return `${state.selected_torrents.length} of ${state.filteredTorrentsCount} torrents`
|
||||
}
|
||||
|
||||
return `${state.filteredTorrentsCount} torrents`
|
||||
}
|
||||
}
|
||||
|
|
|
@ -48,7 +48,8 @@ export default new Vuex.Store({
|
|||
showCurrentSpeed: true,
|
||||
showGlobalRemoveResumePause: true
|
||||
},
|
||||
categories: []
|
||||
categories: [],
|
||||
filteredTorrentsCount: 0
|
||||
},
|
||||
getters: {
|
||||
...getters
|
||||
|
|
|
@ -71,5 +71,6 @@ export default {
|
|||
FETCH_CATEGORIES: async state => {
|
||||
const { data } = await qbit.getCategories()
|
||||
state.categories = data
|
||||
}
|
||||
},
|
||||
SET_CURRENT_ITEM_COUNT: (state, count) => (state.filteredTorrentsCount = count)
|
||||
}
|
||||
|
|
|
@ -2,7 +2,14 @@
|
|||
<div class="pl-5 pr-5" color="background" @click.self="resetSelected">
|
||||
<h1 style="font-size: 1.1em !important" class="subtitle-1 grey--text">
|
||||
Dashboard
|
||||
<p
|
||||
style="float: right; font-size: 0.7em"
|
||||
class="grey--text text-uppercase"
|
||||
>
|
||||
{{ torrentCountString }}
|
||||
</p>
|
||||
</h1>
|
||||
|
||||
<v-container
|
||||
color="background"
|
||||
class="my-4 pt-5 pa-0"
|
||||
|
@ -20,7 +27,7 @@
|
|||
></v-text-field>
|
||||
</v-flex>
|
||||
<div v-if="torrents.length === 0" class="mt-5 text-xs-center">
|
||||
<p class="grey--text">No active Torrents!</p>
|
||||
<p class="grey--text">Nothing to see here!</p>
|
||||
</div>
|
||||
<div v-else>
|
||||
<div
|
||||
|
@ -56,7 +63,7 @@ export default {
|
|||
},
|
||||
computed: {
|
||||
...mapState(['mainData']),
|
||||
...mapGetters(['getTorrents']),
|
||||
...mapGetters(['getTorrents', 'getTorrentCountString']),
|
||||
torrents() {
|
||||
if (this.input.length === 0) return this.getTorrents()
|
||||
|
||||
|
@ -74,6 +81,9 @@ export default {
|
|||
}
|
||||
const fuse = new Fuse(this.getTorrents(), options)
|
||||
return fuse.search(this.input).map(el => el.item)
|
||||
},
|
||||
torrentCountString() {
|
||||
return this.getTorrentCountString()
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
|
@ -87,6 +97,11 @@ export default {
|
|||
},
|
||||
beforeDestroy() {
|
||||
this.$store.commit('REMOVE_INTERVALS')
|
||||
},
|
||||
watch: {
|
||||
torrents: function (torrents) {
|
||||
this.$store.commit('SET_CURRENT_ITEM_COUNT', torrents.length)
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
|
Loading…
Add table
Reference in a new issue