high-mini/physical-merchants/classify/goods-search/goods-search.vue

<template>
	<!-- <view class="backcor9" style="height: 100vh;overflow: hidden;"> -->
		<view class="search-container backcor9">
			<!-- 搜索框 -->
			<block>
				<view class="nav-search jianbian">
					<component-search @onsearch="search_button_event"  :propIsRequired="false"
						propPlaceholder="输入商品名称搜索"></component-search>
				</view>
			</block>
			<!-- 搜索列表 -->
			<view class="search-list">
				<goodsList ref="goodsList" typeList="goodsSearch" @loadData="loadData" :propData="data_list"
					:paddBottom="0">
				</goodsList>

			</view>


		</view>
	<!-- </view> -->
</template>

<script>
	import componentSearch from "@/components/search/search.vue";
	import goodsList from '@/components/goods-list/goods-list.vue';
	import {
		getListGoodsDetail
	} from '@/Utils/physicalObject.js' 
	
	const app = getApp()
	export default {

		data() {
			return {
				data_list: [],
				keywordsSearh: '',
				page: {
					pageStart: 1, //页码
					pageNum: 20, //每页有多少条数据
					navigateLastPage: 1, //总共有几页
					allData: 0 //总共有多少条数据
				},
				
				companyId :app.globalData.companyId,
				goodsLabel:''

			}
		},
		onLoad(options){
			// console.log(options,"options") 
			
			if(options.goodsLabel){
				this.goodsLabel = options.goodsLabel	
			}
			
			this.search_button_event("")
			
		},
		components: {
			componentSearch,
			goodsList
		},
		onShow() {
			this.$nextTick(() => {
				if (this.$refs.goodsList) {
					this.$refs.goodsList.refreshCartNum()
				}
			})
		},
		methods: {
			//搜索事件
			search_button_event(keywords) {
				if(keywords==null){keywords=''}
				this.keywordsSearh = keywords;
				this.data_list = [];
				this.page = {
					pageStart: 1, //页码
					pageNum: 20, //每页有多少条数据
					navigateLastPage: 1, //总共有几页
					allData: 0 //总共有多少条数据
				}
				this.searchData()
				// console.log(this.keywordsSearh, "子组件弹射的keywords")
			},
			loadData() {
				let _this = this;
				if (_this.page.pageStart < _this.page.navigateLastPage) {
					_this.page.pageStart = _this.page.pageStart + 1;
					_this.searchData()
				}
			},
			// 加载数据
			searchData() {

				// if (!this.keywordsSearh) {
				// 	uni.showToast({
				// 		title: '请输入商品名称',
				// 		duration: 1000,
				// 		icon: 'none'
				// 	});

				// 	return
				// }
				let _this = this
				let params = {
					title: _this.keywordsSearh,
					pageNum: _this.page.pageStart,
					pageSize: _this.page.pageNum,
					price: 0,
					companyId:_this.companyId,
					goodsLabel:_this.goodsLabel
				}
				// params = JSON.stringify(params) 
				// console.log(params)


				uni.showLoading({
					title: '加载中',
					mask: true,
				});


				getListGoodsDetail(params).then(res => {
					setTimeout(()=>{
						uni.hideLoading();
						if (res.return_code == '000000') {

							if (res.return_data.list.length > 0) {
								_this.data_list = _this.data_list.concat(res.return_data.list);
								this.page.pageStart = res.return_data.pageNum;
								this.page.pageSize = res.return_data.pageSize;
								this.page.total = res.return_data.total;
								this.page.navigateLastPage = res.return_data.navigateLastPage

							} else {
								_this.data_list = []
							}

						} else {
							uni.showToast({
								title: res.return_msg,
								icon: 'none',
								duration: 2000
							})
						}
					},100)
					
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	.search-container {


		.search-list {
			height: calc(100vh - 80px - var(--window-top));
			// padding: 20rpx;
		}
	}

	.nav-search {
		padding: 20px;
		background: linear-gradient(to bottom, #3da7e7, #FFFFFF) no-repeat;
	}
</style>