<!--
 * @Author: ch
 * @Date: 2022-03-21 10:31:54
 * @LastEditors: ch
 * @LastEditTime: 2022-04-02 11:12:11
 * @Description: file content
-->
<template>
	<view>
		<view class="header">
			<UiPageHeader>
				<u--input slot="custom" class="search--input" prefixIconStyle="font-size:48rpx;color:#ccc"
					prefixIcon="search" placeholderClass="search--input__placeholder" clearable
					:placeholder="placeholder" :value="$Route.query.search"   
					@focus="$Router.push('/search')"/>
			</UiPageHeader>
			<!-- 排序标签 -->
			<Sort></Sort>
		</view>
		<BsGoodsGroup class="goods-group" ref="goodsGroup" ></BsGoodsGroup>
	</view>
</template>
<script>
import BsGoodsGroup from "@/components/BsGoodsGroup.vue";
import Sort from "./components/Sort.vue";
import UiPageHeader from '@/components/UiPageHeader.vue';
export default {
	components: { BsGoodsGroup, Sort, UiPageHeader },
	data() {
		return {
			sortType: "all", // 排序类型
			sortPrice: false, // 价格排序 (true高到低 false低到高)
		};
	},
	mounted(){

		// console.log(getCurrentPages())
	},
	onReachBottom(){
		this.$refs.goodsGroup.next()
	},
	onHide(){
		// console.log(getCurrentPages());
	}
};
</script>
<style lang="scss" scoped>
page {
	background: #f8f8f8;
}
.header {
	position: sticky;
	top: var(--window-top);
	z-index: 99;
}
.search--input{
	display: block;
	margin-left:20rpx;
	height: 70rpx;
	border:none;
	box-sizing: border-box;
	background: #F8F8F8;
	&__placeholder{
		font-size: 26rpx;
		color: #666;
	}
}
.goods-group {
	padding-top: 30rpx;
}
</style>