Add filter parameter in search.

Closes #1117
This commit is contained in:
Kavin 2022-07-19 21:46:50 +05:30
parent 7ec18073a1
commit c0ff289076
No known key found for this signature in database
GPG Key ID: 49451E4482CC5BCD

View File

@ -4,13 +4,7 @@
<label for="ddlSearchFilters"> <label for="ddlSearchFilters">
<strong v-text="`${$t('actions.filter')}:`" /> <strong v-text="`${$t('actions.filter')}:`" />
</label> </label>
<select <select id="ddlSearchFilters" v-model="selectedFilter" default="all" class="select w-auto" @change="updateFilter()">
id="ddlSearchFilters"
v-model="selectedFilter"
default="all"
class="select w-auto"
@change="updateResults()"
>
<option v-for="filter in availableFilters" :key="filter" :value="filter" v-t="`search.${filter}`" /> <option v-for="filter in availableFilters" :key="filter" :value="filter" v-t="`search.${filter}`" />
</select> </select>
@ -77,7 +71,7 @@ export default {
"music_albums", "music_albums",
"music_playlists", "music_playlists",
], ],
selectedFilter: "all", selectedFilter: this.$route.query.filter ?? "all",
}; };
}, },
mounted() { mounted() {
@ -98,13 +92,21 @@ export default {
async fetchResults() { async fetchResults() {
return await await this.fetchJson(this.apiUrl() + "/search", { return await await this.fetchJson(this.apiUrl() + "/search", {
q: this.$route.query.search_query, q: this.$route.query.search_query,
filter: this.selectedFilter, filter: this.$route.query.filter ?? "all",
}); });
}, },
async updateResults() { async updateResults() {
document.title = this.$route.query.search_query + " - Piped"; document.title = this.$route.query.search_query + " - Piped";
this.results = this.fetchResults().then(json => (this.results = json)); this.results = this.fetchResults().then(json => (this.results = json));
}, },
updateFilter() {
this.$router.replace({
query: {
search_query: this.$route.query.search_query,
filter: this.selectedFilter,
},
});
},
handleScroll() { handleScroll() {
if (this.loading || !this.results || !this.results.nextpage) return; if (this.loading || !this.results || !this.results.nextpage) return;
if (window.innerHeight + window.scrollY >= document.body.offsetHeight - window.innerHeight) { if (window.innerHeight + window.scrollY >= document.body.offsetHeight - window.innerHeight) {
@ -112,7 +114,7 @@ export default {
this.fetchJson(this.apiUrl() + "/nextpage/search", { this.fetchJson(this.apiUrl() + "/nextpage/search", {
nextpage: this.results.nextpage, nextpage: this.results.nextpage,
q: this.$route.query.search_query, q: this.$route.query.search_query,
filter: this.selectedFilter, filter: this.$route.query.filter ?? "all",
}).then(json => { }).then(json => {
this.results.nextpage = json.nextpage; this.results.nextpage = json.nextpage;
this.results.id = json.id; this.results.id = json.id;