完善聚合搜索逻辑
parent
c12bbc7f0f
commit
ef9eb83a75
|
@ -79,7 +79,7 @@ export default {
|
||||||
query: {
|
query: {
|
||||||
text: this.text,
|
text: this.text,
|
||||||
},
|
},
|
||||||
})
|
}).catch(_ => _)
|
||||||
},
|
},
|
||||||
handleInput() {
|
handleInput() {
|
||||||
if (this.text === '') {
|
if (this.text === '') {
|
||||||
|
|
|
@ -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 = ''
|
||||||
},
|
},
|
||||||
}
|
}
|
||||||
|
|
|
@ -43,6 +43,7 @@ export const b64DecodeUnicode = str => {
|
||||||
export const decodeName = str => str.replace(/'/g, '\'')
|
export const decodeName = str => str.replace(/'/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
|
||||||
|
|
|
@ -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',
|
||||||
})
|
})
|
||||||
})
|
})
|
||||||
|
|
|
@ -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;
|
||||||
|
|
Loading…
Reference in New Issue