kitchendDevice/pages/search/list.vue

120 lines
2.6 KiB
Vue

<template>
<view class="content">
<search :name="search_value"></search>
<view class="footbox footlist" v-if="food_search_list.length">
<view class="list" v-for="(it,ind) in food_search_list" :key="ind" @click="handleDetail(it.id)">
<view class="topimg">
<image :src="it.cover" class="img" mode="aspectFill"></image>
</view>
<view class="item">
<view class="title">{{it.title}}</view>
<view class="name">
<image :src="it.create_user_head_pic"></image>
<text class="overflow">{{it.create_user_nickname}}</text>
</view>
<view class="zan">
<icon class="iconfont" :class="[it.is_me_like_it=='yes'?'icon-icon3':'icon-icon_collect']">
</icon>
<text>{{it.likes_num}}</text>
</view>
</view>
</view>
</view>
<view class="endtext" v-if="!lastPage || Page >= lastPage">—— 到底了,看看别的吧 ——</view>
<view v-if="!food_search_list.length" class="nolist">
<icon class="iconfont icon-wancan"></icon>
<text>还没有记录哦</text>
</view>
</view>
</template>
<script>
import search from '@/components/search2.vue';
export default {
name: "list",
data() {
return {
Page: 1,
lastPage: 1,
search_value: "",
food_search_list: [],
};
},
props: {
title: {
type: String,
default: ''
},
},
components: {
search
},
onLoad(options) {
let that = this
that.search_value = options.name
that.handleSearchColumn()
},
onReachBottom() {
let that = this
console.log("onReachBottom", this.lastPage)
if (!this.lastPage || this.Page >= this.lastPage) {
uni.showToast({
title: '没有更多数据!',
icon: 'none'
})
return
}
this.Page++
this.handleSearchColumn()
},
methods: {
handleSearchColumn() {
let that = this
that.$model.getMenuSearchColumn({
page: that.Page,
search_data: that.search_value
}).then(res => {
if (res.code != 0 || res.data instanceof Array) return
that.food_search_list = that.food_search_list.concat(res.data.content_list)
that.lastPage = res.data.page_total
})
},
// 商品详情
handleDetail(id) {
uni.navigateTo({
url: "/pageTwo/me/menudetail?id=" + id
})
},
}
}
</script>
<style scoped lang="scss">
.content {
background: #fff;
min-height: calc(100vh - 40rpx);
}
.footlist {
position: relative;
margin-top: 68px;
padding: 30rpx;
width: calc(100% - 60rpx);
background: #fff;
border-radius: 30rpx 30rpx 0 0;
}
.list {
border: 1px solid #f7f7f7;
.item {
background: #f7f7f7;
border-top: 1px solid #f7f7f7;
}
}
.topimg {
width: 100%;
}
</style>