完善聚合搜索逻辑

pull/96/head
lyswhut 2019-09-21 13:41:19 +08:00
parent c12bbc7f0f
commit ef9eb83a75
5 changed files with 58 additions and 43 deletions

View File

@ -79,7 +79,7 @@ export default {
query: { query: {
text: this.text, text: this.text,
}, },
}) }).catch(_ => _)
}, },
handleInput() { handleInput() {
if (this.text === '') { if (this.text === '') {

View File

@ -3,15 +3,7 @@ const sources = [{
id: 'all', id: 'all',
name: '聚合搜索', name: '聚合搜索',
}] }]
const sourceList = { const sourceList = {}
all: {
page: 1,
allPage: 0,
limit: 30,
total: 0,
list: [],
},
}
const sourceMaxPage = {} const sourceMaxPage = {}
for (const source of music.sources) { for (const source of music.sources) {
const musicSearch = music[source.id].musicSearch const musicSearch = music[source.id].musicSearch
@ -44,7 +36,7 @@ const getters = {
sources: () => sources, sources: () => sources,
sourceList: state => state.sourceList || [], sourceList: state => state.sourceList || [],
searchText: state => state.text, searchText: state => state.text,
allList: state => ({ list: state.list, allPage: state.allPage, total: state.total, limit: state.limit, sourceMaxPage: state.sourceMaxPage }), allList: state => ({ list: state.list, allPage: state.allPage, page: state.page, total: state.total, limit: state.limit, sourceMaxPage: state.sourceMaxPage }),
} }
// actions // actions
@ -52,13 +44,14 @@ const actions = {
search({ commit, rootState }, { text, page, limit }) { search({ commit, rootState }, { text, page, limit }) {
if (rootState.setting.search.searchSource == 'all') { if (rootState.setting.search.searchSource == 'all') {
let task = [] let task = []
for (const source of sources) task.push(music[source.id].musicSearch.search(text, page, limit)) for (const source of sources) {
Promise.all(task).then((...results) => { if (source.id == 'all') continue
commit('setLists', { results, text, page }) task.push(music[source.id].musicSearch.search(text, page))
}) }
Promise.all(task).then(results => commit('setLists', { results, text, page }))
} else { } else {
return music[rootState.setting.search.searchSource].musicSearch.search(text, page, limit) return music[rootState.setting.search.searchSource].musicSearch.search(text, page, limit)
.then(data => commit('setList', { list: data.list, allPage: data.allPage, total: data.total, text, page })) .then(data => commit('setList', { text, page, ...data }))
} }
}, },
} }
@ -66,37 +59,47 @@ const actions = {
// mitations // mitations
const mutations = { const mutations = {
setList(state, datas) { setList(state, datas) {
state.list = datas.list let source = state.sourceList[datas.source]
state.total = datas.total source.list = datas.list
state.allPage = datas.allPage source.total = datas.total
state.page = datas.page source.allPage = datas.allPage
source.page = datas.page
source.limit = datas.limit
state.text = datas.text state.text = datas.text
}, },
setLists(state, { results, text, page }) { setLists(state, { results, text, page }) {
let pages = [] let pages = []
let total = 0 let total = 0
let limit = 0 let limit = 0
let list = []
for (const source of results) { for (const source of results) {
state[source.source].list = source.list state.sourceMaxPage[source.source] = source.allPage
state[source.source].total = source.total if (source.allPage < page) continue
state[source.source].allPage = source.allPage list.push(...source.list)
state[source.source].page = page
pages.push(source.allPage) pages.push(source.allPage)
total += source.total total += source.total
limit += source.limit limit += source.limit
} }
list.sort()
state.allPage = Math.max(...pages) state.allPage = Math.max(...pages)
state.total = total state.total = total
state.limit = limit state.limit = limit
state.page = page
state.text = text state.text = text
state.list = list
}, },
clearList(state) { clearList(state) {
for (const source of state.list) { for (const source of Object.keys(state.sourceList)) {
source.list.length = 0 state.sourceList[source].list.length = 0
source.list.page = 0 state.sourceList[source].page = 0
source.list.allPage = 0 state.sourceList[source].allPage = 0
source.list.total = 0 state.sourceList[source].total = 0
state.sourceMaxPage[source] = 0
} }
state.list.length = 0
state.page = 0
state.allPage = 0
state.total = 0
state.text = '' state.text = ''
}, },
} }

View File

@ -43,6 +43,7 @@ export const b64DecodeUnicode = str => {
export const decodeName = str => str.replace(/&apos;/g, '\'') export const decodeName = str => str.replace(/&apos;/g, '\'')
export const scrollTo = (element, to, duration = 300, fn = function() {}) => { export const scrollTo = (element, to, duration = 300, fn = function() {}) => {
if (!element) return
const start = element.scrollTop || element.scrollY const start = element.scrollTop || element.scrollY
const change = to - start const change = to - start
const increment = 10 const increment = 10

View File

@ -121,7 +121,7 @@ export default {
} }
return result return result
}, },
search(str, page = 1, { limit }) { search(str, page = 1, { limit } = {}) {
if (limit != null) this.limit = limit if (limit != null) this.limit = limit
// http://newlyric.kuwo.cn/newlyric.lrc?62355680 // http://newlyric.kuwo.cn/newlyric.lrc?62355680
return this.musicSearch(str, page).then(result => { return this.musicSearch(str, page).then(result => {
@ -138,6 +138,7 @@ export default {
list, list,
allPage: this.allPage, allPage: this.allPage,
total: this.total, total: this.total,
limit: this.limit,
source: 'kw', source: 'kw',
}) })
}) })

View File

@ -1,9 +1,9 @@
<template lang="pug"> <template lang="pug">
div(:class="$style.search") div(:class="$style.search")
//- transition //- transition
div(v-if="listInfo.list.length" :class="$style.list")
div(:class="$style.header") div(:class="$style.header")
material-tab(:class="$style.tab" :list="sources" align="left" item-key="id" item-name="name" v-model="searchSourceId") material-tab(:class="$style.tab" :list="sources" align="left" item-key="id" item-name="name" v-model="searchSourceId")
div(v-if="listInfo.list.length" :class="$style.list")
div(:class="$style.thead") div(:class="$style.thead")
table table
thead thead
@ -32,7 +32,7 @@
material-list-buttons(:index="index" :remove-btn="false" @btn-click="handleListBtnClick") material-list-buttons(:index="index" :remove-btn="false" @btn-click="handleListBtnClick")
td(style="width: 10%;") {{item.interval}} td(style="width: 10%;") {{item.interval}}
div(:class="$style.pagination") div(:class="$style.pagination")
material-pagination(:count="info.total" :limit="limit" :page="page" @btn-click="handleTogglePage") material-pagination(:count="listInfo.total" :limit="listInfo.limit" :page="page" @btn-click="handleTogglePage")
div(v-else :class="$style.noitem") div(v-else :class="$style.noitem")
p 搜我所想~~😉 p 搜我所想~~😉
material-download-modal(:show="isShowDownload" :musicInfo="musicInfo" @select="handleAddDownload" @close="isShowDownload = false") material-download-modal(:show="isShowDownload" :musicInfo="musicInfo" @select="handleAddDownload" @close="isShowDownload = false")
@ -64,20 +64,16 @@ export default {
}, },
beforeRouteUpdate(to, from, next) { beforeRouteUpdate(to, from, next) {
if (to.query.text === undefined) return if (to.query.text === undefined) return
if (to.query.text === '') {
this.clearList()
} else {
this.text = to.query.text this.text = to.query.text
this.page = 1 this.page = 1
this.handleSearch(this.text, this.page) this.handleSearch(this.text, this.page)
}
next() next()
}, },
mounted() { mounted() {
// console.log('mounted') // console.log('mounted')
this.searchSourceId = this.setting.search.searchSource this.searchSourceId = this.setting.search.searchSource
if (this.$route.query.text === undefined) { if (this.$route.query.text === undefined) {
this.text = this.$store.getters['search/text'] this.text = this.$store.getters['search/searchText']
this.page = this.listInfo.page this.page = this.listInfo.page
} else if (this.$route.query.text === '') { } else if (this.$route.query.text === '') {
this.clearList() this.clearList()
@ -104,6 +100,10 @@ export default {
}, },
searchSourceId(n) { searchSourceId(n) {
if (n === this.setting.search.searchSource) return if (n === this.setting.search.searchSource) return
this.$nextTick(() => {
this.page = 1
this.handleSearch(this.text, this.page)
})
this.setSearchSource({ this.setSearchSource({
searchSource: n, searchSource: n,
}) })
@ -125,7 +125,9 @@ export default {
...mapMutations('list', ['defaultListAdd', 'defaultListAddMultiple']), ...mapMutations('list', ['defaultListAdd', 'defaultListAddMultiple']),
...mapMutations('player', ['setList']), ...mapMutations('player', ['setList']),
handleSearch(text, page) { handleSearch(text, page) {
this.search({ text, page, limit: this.limit }).then(data => { if (text === '') return this.clearList()
this.search({ text, page, limit: this.listInfo.limit }).then(data => {
this.page = page this.page = page
this.$nextTick(() => { this.$nextTick(() => {
scrollTo(this.$refs.dom_scrollContent, 0) scrollTo(this.$refs.dom_scrollContent, 0)
@ -224,6 +226,11 @@ export default {
.search { .search {
overflow: hidden; overflow: hidden;
height: 100%; height: 100%;
display: flex;
flex-flow: column nowrap;
}
.header {
flex: none;
} }
.list { .list {
position: relative; position: relative;
@ -231,6 +238,8 @@ export default {
font-size: 14px; font-size: 14px;
display: flex; display: flex;
flex-flow: column nowrap; flex-flow: column nowrap;
flex: auto;
overflow: hidden;
} }
.thead { .thead {
flex: none; flex: none;
@ -258,8 +267,9 @@ export default {
// transform: translateX(-50%); // transform: translateX(-50%);
} }
.noitem { .noitem {
flex: auto;
overflow: hidden;
position: relative; position: relative;
height: 100%;
display: flex; display: flex;
flex-flow: column nowrap; flex-flow: column nowrap;
justify-content: center; justify-content: center;