|
|
@@ -2,15 +2,16 @@
|
|
|
<el-container>
|
|
|
<el-main>
|
|
|
<nav-bar-no-search />
|
|
|
- <el-row class="center">
|
|
|
+ <el-row style="padding: 5px">
|
|
|
<el-input
|
|
|
v-model="keyword"
|
|
|
- placeholder="想要搜点神马呢"
|
|
|
+ :fetch-suggestions="querySearchAsync"
|
|
|
+ :placeholder="searchHint"
|
|
|
class="input-with-select"
|
|
|
clearable
|
|
|
@focus="focus"
|
|
|
@blur="blur"
|
|
|
- @keyup.enter.native="searchHandler"
|
|
|
+ @keyup.enter.native="handleOnSearch"
|
|
|
>
|
|
|
<el-select
|
|
|
slot="prepend"
|
|
|
@@ -21,7 +22,7 @@
|
|
|
<el-option label="视频" value="2" />
|
|
|
<el-option label="文书" value="3" />
|
|
|
</el-select>
|
|
|
- <el-button slot="append" icon="el-icon-search" @click="searchHandler" />
|
|
|
+ <el-button slot="append" icon="el-icon-search" @click="handleOnSearch" />
|
|
|
</el-input>
|
|
|
<!---设置z-index优先级,防止被走马灯效果遮挡-->
|
|
|
<el-card
|
|
|
@@ -45,17 +46,14 @@
|
|
|
@close="closeHandler(search)"
|
|
|
>{{ search.name }}</el-tag>
|
|
|
<dt class="search-title">热门搜索</dt>
|
|
|
- <dd v-for="search in hotSearchList" :key="search.id">{{ search }}</dd>
|
|
|
+ <dd v-for="search in hotSearchList" :key="search.rank">{{ search.keyword }}</dd>
|
|
|
</dl>
|
|
|
<dl v-if="isSearchList">
|
|
|
- <dd v-for="search in searchList" :key="search.id">{{ search }}</dd>
|
|
|
+ <dd v-for="search in searchList" :key="search.rank">{{ search.keyword }}</dd>
|
|
|
</dl>
|
|
|
</el-card>
|
|
|
</el-row>
|
|
|
- <el-row>
|
|
|
- <el-col :md="6" class="movie-list">
|
|
|
- <hot-search :card-prop="cardProp" />
|
|
|
- </el-col>
|
|
|
+ <el-row style="padding: 5px">
|
|
|
<el-col v-loading="loading" :md="18">
|
|
|
<el-row v-if="videoSearch" class="movie-list">
|
|
|
<el-col v-for="(video,index) in dataList" :key="index" :md="6" :sm="8" :xs="12">
|
|
|
@@ -118,11 +116,11 @@
|
|
|
</el-row>
|
|
|
</el-col>
|
|
|
</el-row>
|
|
|
- <el-row v-if="showEmpty" class="not-result">
|
|
|
- <el-col :span="12" :offset="6">
|
|
|
+ <el-row v-if="showEmpty" style="padding: 5px">
|
|
|
+ <div>
|
|
|
<img src="@/assets/img/icon/not-result.png">
|
|
|
- <div>没有结果</div>
|
|
|
- </el-col>
|
|
|
+ <span>没有结果</span>
|
|
|
+ </div>
|
|
|
</el-row>
|
|
|
</el-main>
|
|
|
|
|
|
@@ -243,7 +241,7 @@ import SearchVideoCard from '@/components/card/SearchVideoCard'
|
|
|
import HotSearch from '@/components/card/HotSearch'
|
|
|
import RandomUtil from '@/utils/random-util'
|
|
|
import Store from '@/utils/store'
|
|
|
-import { videoQuery, hotKeyword, getWenshuDetail, wenshuQuery } from '@/api/search'
|
|
|
+import { videoQuery, hotKeyword, getWenshuDetail, wenshuQuery, keywordSuggest } from '@/api/search'
|
|
|
|
|
|
export default {
|
|
|
name: 'SearchIndex',
|
|
|
@@ -260,6 +258,8 @@ export default {
|
|
|
pageSize: 10,
|
|
|
totalSize: 0,
|
|
|
dataList: [],
|
|
|
+ restaurants: [],
|
|
|
+ searchHint: '想要搜点神马呢',
|
|
|
showEmpty: false,
|
|
|
cardProp: {
|
|
|
title: '热搜排行',
|
|
|
@@ -293,13 +293,14 @@ export default {
|
|
|
}
|
|
|
},
|
|
|
mounted() {
|
|
|
- hotKeyword().then(resp => {
|
|
|
+ /* hotKeyword().then(resp => {
|
|
|
if (resp.code === 0) {
|
|
|
this.cardProp.title = '热搜排行'
|
|
|
this.cardProp.type = 'hotSearch'
|
|
|
this.cardProp.dataList = resp.data
|
|
|
+ this.hotSearchList = resp.data
|
|
|
}
|
|
|
- })
|
|
|
+ })*/
|
|
|
},
|
|
|
created() {
|
|
|
this.keyword = this.$route.query.keyword
|
|
|
@@ -320,6 +321,41 @@ export default {
|
|
|
})
|
|
|
this.$router.go(0)
|
|
|
},
|
|
|
+ handleOnSearch() {
|
|
|
+ this.$router.push({
|
|
|
+ path: '/search',
|
|
|
+ query: {
|
|
|
+ searchType: this.searchType,
|
|
|
+ keyword: this.keyword,
|
|
|
+ pn: 1
|
|
|
+ }
|
|
|
+ })
|
|
|
+ this.$router.go(0)
|
|
|
+ },
|
|
|
+ querySearchAsync(queryString, cb) {
|
|
|
+ if (queryString === '') {
|
|
|
+ return
|
|
|
+ }
|
|
|
+
|
|
|
+ setTimeout(() => {
|
|
|
+ keywordSuggest(queryString).then(res => {
|
|
|
+ if (res.code === 0) {
|
|
|
+ this.restaurants = res.data.map((item) => {
|
|
|
+ return {
|
|
|
+ value: item.keyword,
|
|
|
+ rank: 1
|
|
|
+ }
|
|
|
+ })
|
|
|
+
|
|
|
+ // 如果 cb 返回一个空数组, 那么模糊搜索输入建议的下拉选项会因为 length 为 0 而消失
|
|
|
+ // cb([])
|
|
|
+ cb(this.restaurants)
|
|
|
+ // eslint-disable-next-line no-empty
|
|
|
+ } else {
|
|
|
+ }
|
|
|
+ })
|
|
|
+ }, 500)
|
|
|
+ },
|
|
|
focus() {
|
|
|
// this.$message.info('input focus')
|
|
|
this.isFocus = true
|
