整合全文检索接口
This commit is contained in:
@@ -41,9 +41,9 @@
|
||||
}
|
||||
}
|
||||
.page-modal {
|
||||
//display: none;
|
||||
display: none;
|
||||
position: fixed;
|
||||
top: 24%;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
z-index: 1001;
|
||||
padding: 20px;
|
||||
@@ -53,21 +53,16 @@
|
||||
border-radius: 4px;
|
||||
box-shadow: 0 2px 5px 0 rgba(0,0,0,0.16),0 2px 10px 0 rgba(0,0,0,0.12);
|
||||
opacity: 0;
|
||||
transform: translate(-50%, -200%);
|
||||
transform: translate(-50%, -50%);
|
||||
transition: .3s;
|
||||
p {
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
&.ready {
|
||||
visibility: hidden;
|
||||
display: block;
|
||||
transform: translate(-50%, -100%);
|
||||
transition: .3s;
|
||||
}
|
||||
|
||||
&.in {
|
||||
display: block;
|
||||
visibility: visible;
|
||||
opacity: 1;
|
||||
transform: translate(-50%, 0);
|
||||
}
|
||||
|
||||
.close {
|
||||
|
||||
@@ -243,4 +243,45 @@ label.bui-switch-label {
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.js-search-box {
|
||||
.search {
|
||||
border-bottom: 1px solid #ccc;
|
||||
background: #f5f5f5;
|
||||
border-top-left-radius: 5px;
|
||||
border-top-right-radius: 5px;
|
||||
width: 500px;
|
||||
display: flex;
|
||||
line-height: 40px;
|
||||
.search-input-icon {
|
||||
padding: 0 10px;
|
||||
}
|
||||
.search-input {
|
||||
flex-grow: 1;
|
||||
input[type=text] {
|
||||
padding: 5px 0;
|
||||
width: 100%;
|
||||
outline: 0;
|
||||
border: none;
|
||||
background: 0 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
.search-result {
|
||||
height: 700px;
|
||||
.search-result-item {
|
||||
text-align: left;
|
||||
border-bottom: 1px dashed $colorC;
|
||||
padding: 10px 10px 0;
|
||||
&:hover {
|
||||
border-bottom-color: $colorA;
|
||||
}
|
||||
}
|
||||
.more-item {
|
||||
cursor: pointer;
|
||||
text-align: center;
|
||||
transform: rotate(180deg)
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -11,7 +11,7 @@ function showWXModal() {
|
||||
})
|
||||
qrcodeInit = true
|
||||
}
|
||||
wx.classList.add('in', 'ready')
|
||||
wx.classList.add('in')
|
||||
mask.classList.add('in')
|
||||
}
|
||||
|
||||
@@ -19,7 +19,7 @@ function hideModal() {
|
||||
let modals = document.querySelectorAll('.page-modal')
|
||||
let mask = document.querySelector('.mask')
|
||||
Array.prototype.forEach.call(modals, modal => {
|
||||
modal.classList.remove('in', 'ready')
|
||||
modal.classList.remove('in')
|
||||
})
|
||||
mask.classList.remove('in')
|
||||
}
|
||||
|
||||
@@ -14,7 +14,7 @@ function setScrollZero() {
|
||||
em.scrollTop = 0
|
||||
})
|
||||
}
|
||||
var waifuTipTimer = null
|
||||
var waifuTipTimer = null, fullTextSearchTimer = null
|
||||
new Vue({
|
||||
el: '#container',
|
||||
data: {
|
||||
@@ -28,6 +28,12 @@ new Vue({
|
||||
showCategories: false,
|
||||
search: null,
|
||||
searchItems: [],
|
||||
fullTextSearch: {
|
||||
pageNum: 1,
|
||||
limit: 10,
|
||||
words: null
|
||||
},
|
||||
fullTextSearchItems: [],
|
||||
waifu: {
|
||||
tip: null, // 提示语文字
|
||||
tipOpacity: 0, // 提示语框透明度
|
||||
@@ -81,6 +87,19 @@ new Vue({
|
||||
}
|
||||
this.search = null
|
||||
},
|
||||
openFullTextSearch() {
|
||||
this.hideSlider()
|
||||
this.$refs.fullTextSearch.classList.add('in')
|
||||
this.$refs.mask.classList.add('in')
|
||||
},
|
||||
loadMoreSearchResult() {
|
||||
this.fullTextSearch.pageNum ++
|
||||
axios.get(window.themeConfig.root + 'api/common/search', {params: this.fullTextSearch}).then(res => {
|
||||
let result = res.data
|
||||
this.fullTextSearchItems.hasMore = (result.total > this.fullTextSearch.pageNum * this.fullTextSearch.limit)
|
||||
this.fullTextSearchItems.push(...result.data)
|
||||
})
|
||||
},
|
||||
searchKeydown(event) {
|
||||
if(event.keyCode == 13){ // 回车键
|
||||
this.addSearchItem(this.search)
|
||||
@@ -117,6 +136,25 @@ new Vue({
|
||||
item.isHide = false
|
||||
})
|
||||
}
|
||||
},
|
||||
fullTextSearch: {
|
||||
deep: true,
|
||||
handler(newVal, oldVal) {
|
||||
if(!newVal.words) {
|
||||
return
|
||||
}
|
||||
if(fullTextSearchTimer) {
|
||||
clearTimeout(fullTextSearchTimer)
|
||||
}
|
||||
fullTextSearchTimer = setTimeout(() => {
|
||||
this.fullTextSearchItems.length = 0
|
||||
axios.get(window.themeConfig.root + 'api/common/search', {params: newVal}).then(res => {
|
||||
let result = res.data
|
||||
this.fullTextSearchItems.hasMore = (result.total > this.fullTextSearch.pageNum * this.fullTextSearch.limit)
|
||||
this.fullTextSearchItems.push(...result.data)
|
||||
})
|
||||
}, 1000)
|
||||
}
|
||||
}
|
||||
},
|
||||
mounted () {
|
||||
|
||||
Reference in New Issue
Block a user