首页搜索，暂无数据时显示的页面
This commit is contained in:
duan
parent
4775d0d24d
commit
a1e15f3c00
|
|
@ -28,139 +28,147 @@
|
|||
</view>
|
||||
|
||||
</view>
|
||||
|
||||
<view style="display: flex;flex-direction: column;align-items: center;" v-if="!datas.isSearch&&datas.keywordList.length==0">
|
||||
<image src="/static/index/none.png" style="width: 341rpx;height: 341rpx;" mode=""></image>
|
||||
<text style=";">暂无数据</text>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { selectCourseTitles } from '@/api/index/index.js'
|
||||
import videoList from './videoList.vue'
|
||||
import {
|
||||
reactive
|
||||
} from 'vue';
|
||||
import {
|
||||
onShow, onReachBottom
|
||||
} from '@dcloudio/uni-app'
|
||||
let datas = reactive({
|
||||
hotKeywordList: [], //热搜
|
||||
keywordList: [],// 搜索列表
|
||||
keyword: "",// 搜索关键字
|
||||
page: 1,
|
||||
isSearch: true,
|
||||
})
|
||||
onShow(() => {
|
||||
getList()
|
||||
})
|
||||
|
||||
function posterSuccess() {
|
||||
|
||||
}
|
||||
function getList() {
|
||||
if (uni.getStorageSync('moreSearch')) {
|
||||
datas.hotKeywordList = (uni.getStorageSync('moreSearch')).split(',')
|
||||
} else {
|
||||
datas.hotKeywordList = []
|
||||
}
|
||||
}
|
||||
onReachBottom(() => {
|
||||
++datas.page
|
||||
doSearch()
|
||||
})
|
||||
function doSearchs(keyWord) {
|
||||
datas.keyword = keyWord
|
||||
doSearch()
|
||||
}
|
||||
// 搜索
|
||||
async function doSearch() {
|
||||
datas.isSearch = false
|
||||
let res = await selectCourseTitles({
|
||||
title: datas.keyword,
|
||||
limit: 20,
|
||||
page: datas.page,
|
||||
import {
|
||||
selectCourseTitles
|
||||
} from '@/api/index/index.js'
|
||||
import videoList from './videoList.vue'
|
||||
import {
|
||||
reactive
|
||||
} from 'vue';
|
||||
import {
|
||||
onShow,
|
||||
onReachBottom
|
||||
} from '@dcloudio/uni-app'
|
||||
let datas = reactive({
|
||||
hotKeywordList: [], //热搜
|
||||
keywordList: [], // 搜索列表
|
||||
keyword: "", // 搜索关键字
|
||||
page: 1,
|
||||
isSearch: true,
|
||||
})
|
||||
if (datas.page == 1) {
|
||||
datas.keywordList = res.list
|
||||
} else {
|
||||
datas.keywordList = [...datas.keywordList, ...res.list]
|
||||
onShow(() => {
|
||||
getList()
|
||||
})
|
||||
|
||||
function posterSuccess() {
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
function getList() {
|
||||
if (uni.getStorageSync('moreSearch')) {
|
||||
datas.hotKeywordList = (uni.getStorageSync('moreSearch')).split(',')
|
||||
} else {
|
||||
datas.hotKeywordList = []
|
||||
}
|
||||
}
|
||||
onReachBottom(() => {
|
||||
++datas.page
|
||||
doSearch()
|
||||
})
|
||||
|
||||
// 取消返回首页
|
||||
function goBack() {
|
||||
uni.navigateBack()
|
||||
}
|
||||
function doSearchs(keyWord) {
|
||||
datas.keyword = keyWord
|
||||
doSearch()
|
||||
}
|
||||
// 搜索
|
||||
async function doSearch() {
|
||||
datas.isSearch = false
|
||||
let res = await selectCourseTitles({
|
||||
title: datas.keyword,
|
||||
limit: 20,
|
||||
page: datas.page,
|
||||
})
|
||||
if (datas.page == 1) {
|
||||
datas.keywordList = res.list
|
||||
} else {
|
||||
datas.keywordList = [...datas.keywordList, ...res.list]
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
// 取消返回首页
|
||||
function goBack() {
|
||||
uni.navigateBack()
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.search-box {
|
||||
width: 100%;
|
||||
/* background-color: rgb(242, 242, 242); */
|
||||
padding: 15upx 2.5%;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
// position: sticky;
|
||||
// top: 0;
|
||||
background-color: #ffffff;
|
||||
}
|
||||
|
||||
.search-keyword {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.keyword-block {
|
||||
padding: 10rpx 0;
|
||||
}
|
||||
|
||||
.keyword {
|
||||
width: 94%;
|
||||
padding: 3px 3%;
|
||||
display: flex;
|
||||
flex-flow: wrap;
|
||||
justify-content: flex-start;
|
||||
|
||||
>view {
|
||||
.search-box {
|
||||
width: 100%;
|
||||
/* background-color: rgb(242, 242, 242); */
|
||||
padding: 15upx 2.5%;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
border-radius: 60upx;
|
||||
padding: 0 20upx;
|
||||
margin: 10upx 20upx 10upx 0;
|
||||
height: 60upx;
|
||||
font-size: 28upx;
|
||||
// background-color: rgb(242, 242, 242);
|
||||
background: #E6EBFF;
|
||||
color: #6b6b6b;
|
||||
}
|
||||
}
|
||||
|
||||
.keyword-block .keyword-list-header {
|
||||
width: 94%;
|
||||
padding: 10rpx 3%;
|
||||
font-size: 27rpx;
|
||||
color: #333;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.keyword-block .keyword-list-header image {
|
||||
width: 40rpx;
|
||||
height: 40rpx;
|
||||
}
|
||||
|
||||
.search-list {
|
||||
width: 100%;
|
||||
margin-top: 20rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
|
||||
.search-list-box {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
flex-wrap: wrap;
|
||||
width: 686rpx;
|
||||
height: 100%;
|
||||
// position: sticky;
|
||||
// top: 0;
|
||||
background-color: #ffffff;
|
||||
}
|
||||
|
||||
.search-keyword {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.keyword-block {
|
||||
padding: 10rpx 0;
|
||||
}
|
||||
|
||||
.keyword {
|
||||
width: 94%;
|
||||
padding: 3px 3%;
|
||||
display: flex;
|
||||
flex-flow: wrap;
|
||||
justify-content: flex-start;
|
||||
|
||||
>view {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
border-radius: 60upx;
|
||||
padding: 0 20upx;
|
||||
margin: 10upx 20upx 10upx 0;
|
||||
height: 60upx;
|
||||
font-size: 28upx;
|
||||
// background-color: rgb(242, 242, 242);
|
||||
background: #E6EBFF;
|
||||
color: #6b6b6b;
|
||||
}
|
||||
}
|
||||
|
||||
.keyword-block .keyword-list-header {
|
||||
width: 94%;
|
||||
padding: 10rpx 3%;
|
||||
font-size: 27rpx;
|
||||
color: #333;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.keyword-block .keyword-list-header image {
|
||||
width: 40rpx;
|
||||
height: 40rpx;
|
||||
}
|
||||
|
||||
.search-list {
|
||||
width: 100%;
|
||||
margin-top: 20rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
|
||||
.search-list-box {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
flex-wrap: wrap;
|
||||
width: 686rpx;
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
Binary file not shown.
|
After Width: | Height: | Size: 42 KiB |
Loading…
Reference in New Issue