<template>
	<view class="container">
		<!-- 搜索列表 -->
		<view class="searchlist">
			<!-- 搜索人 -->

			<view class="searchitem flextwo">
				<view class="searchitemleft flexone">
					<image :src="info.image" mode="" class="headimg"></image>
					<view>
						<view class="searchheadname">{{info.name}}</view>
						<view class="dingtixing flexone">
							<view class="dingtixingitem" style="margin-right:20rpx" >订阅提醒</view>
							
							<view class="dingtixingitem">品类预告微信提醒</view>
						</view>
					</view>

				</view>
				<view class="dingyue" v-if="info.user_cate==0" @click="dingyue">订阅直播</view>
				<view class="dingyue" v-if="info.user_cate==1" @click="dingyue">取消订阅</view>

			</view>
			<view class="want flextwo">
				<view class="wantleft flexone">
					<image src="../../static/jinzhibo.png" mode="" class="likeimg"></image>
					近期直播
				</view>
				<view class="more flexone">
					更多
					<img src="../../static/yourow.png" alt="" class="yourow">
				</view>
			</view>
			<goodlist :zhigoodlist="zhigoodlist" :notixing="notixing" @tixing="tixing" :dingyuenum="dingyuenum"></goodlist>
			<view class="seemore" v-if="jinshowpull" @click="seejinmore">点击查看更多></view>
			<view class="want flextwo">
				<view class="wantleft flexone">
					<image src="../../static/history.png" mode="" class="likeimg"></image>
					历史直播
				</view>
				<view class="more flexone">
					更多
					<img src="../../static/yourow.png" alt="" class="yourow">
				</view>
			</view>
			<goodlistone :listshilist="listshilist" :notixing="notixing" @litixing="litixing" :dingyuenumk="dingyuenumk"></goodlistone>
			<view class="seemore" v-if="hisshowpull" @click="seehismore">点击查看更多></view>

			<view class="want flextwo" @click="hotmore">
				<view class="wantleft flexone" >
					<image src="../../static/hot.png" mode="" class="likeimg"></image>
					热门品类推荐
				</view>
				<view class="more flexone">
					更多
					<img src="../../static/yourow.png" alt="" class="yourow">
				</view>
			</view>
			<goodkind :wantlist="wantlist"></goodkind>

		</view>
	</view>
</template>
<script>
	import app from "../../App.vue";
	import goodkind from "../../compontent/goodkind.vue"
	import goodlist from "../../compontent/goodlist.vue"
	import goodlistone from "../../compontent/goodlistone.vue"
	export default {
		components: {
			goodkind,
			goodlist,
			goodlistone
		},
		data() {
			return {
				search: false,
				havesou: true,
				goodshow: false,
				cate_one_id:'',//一级级id
				cate_two_id:'',//二级id
				cate_three_id:'',
				wantlist:[],
				zhigoodlist:[],
				listshilist:[],
				jinpage:1,
				hispage:1,
				jinshowpull:true,
				hisshowpull:true,
				info:'',//品类详情
				notixing:'',
				dingyuenum:[],//近期直播
				dingyuenumk:[],//历史直播
			}
		},
		onLoad(options) {
			console.log(options.sanid)
			
			if(options.id){
				this.cate_one_id=options.id//一级级id
				this.gethislist();
				this.getnearlist();
			}
			 if(options.secid){
				this.cate_two_id=options.secid //二级id
				this.gethislist();
				this.getnearlist();
			}
			 if(options.sanid){
				this.cate_three_id=options.sanid //三级级id
				this.gethislist();
				this.getnearlist();
			}
			console.log(this.cate_three_id,'三级ID')
			this.getsanji();
			
			// 品类详情
			this.getsanjidetail()
		},
		onShow() {
			let notixing = uni.getStorageSync("notixing");
			this.notixing = notixing;
			
		},
		methods: {
			// 获取子组件的值
			tixing(e){
				this.zhigoodlist=e
			},
			litixing(e){
				this.listshilist=e
			},
			// 订阅和取消订阅
			dingyue(){
				console.log(9999)
				let that = this;
				var url = "category/addUserCate"
				let param = {
					cate_id: that.cate_three_id
				}
				app.post(url, param, "post").then(res => {
					console.log('主播订阅', res)
					if(that.info.user_cate==0){
						that.info.user_cate=1
						uni.showToast({
							title:"订阅成功",
							icon:'none'
						})
					}else{
						that.info.user_cate=0
						uni.showToast({
							title:"取消订阅成功",
							icon:'none'
						})
					}
					that.info=that.info;
					that.$forceUpdate()
				
				
				}).catch(err => {
					console.log(err)
				})
			},
			// 获取三级详情
			getsanjidetail(){
				let that = this;
				var url = "category/getCategoryInfo"
				let param={
					cate_id:that.cate_three_id
					
				}
				app.post(url, param, "post").then(res => {
					console.log('品类详情', res)
					that.info=res
				
				
				}).catch(err => {
					console.log(err)
				})
			},
			
			// 获取热门品类
			getsanji(){
				let that = this;
				var url = "category/getRandCategory"
				let param={
					// cate_one_id:that.cate_one_id,
					type:2,
					
				}
				app.post(url, param, "post").then(res => {
					console.log('列表信息', res)
					that.wantlist=res;
					console.log(that.wantlist)
				
				}).catch(err => {
					console.log(err)
				})
			},
			// 近期美妆直播
			getnearlist(){
				let that = this;
				var url = "goods/getAnchorTimeGoods"
				var param={
					cate_one_id:that.cate_one_id,
					cate_two_id:that.cate_two_id,
					cate_three_id:that.cate_three_id,
					type:1,
					page:that.jinpage,
					per_page:20
				}
				app.post(url, param, "post").then(res => {
					console.log('商品列表', res)
					if(res.data.length==0){
						this.jinshowpull=false
					}
					that.zhigoodlist=that.zhigoodlist.concat(res.data);
					that.zhigoodlist.forEach(function(value,index,array){
						if(value.user_goods==1){
								if(that.dingyuenum.indexOf(value.id)==-1){
									that.dingyuenum.push(value.id);
									that.dingyuenum=that.dingyuenum
							}
						}
					})
					console.log(that.zhigoodlist)
				
				}).catch(err => {
					console.log(err)
				})
			},
			// 获取历史直播
			gethislist(){
				let that = this;
				var url = "goods/getAnchorTimeGoods"
				var param={
					cate_one_id:that.cate_one_id,
					cate_two_id:that.cate_two_id,
					cate_three_id:that.cate_three_id,
					type:2,
					page:that.hispage,
					per_page:20
				}
				app.post(url, param, "post").then(res => {
					console.log('商品列表', res)
					if(res.data.length==0){
						that.hisshowpull=false
					}
					that.listshilist=that.listshilist.concat(res.data);
					that.listshilist.forEach(function(value,index,array){
						if(value.user_goods==1){
								if(that.dingyuenumk.indexOf(value.id)==-1){
									that.dingyuenumk.push(value.id);
									that.dingyuenumk=that.dingyuenumk
							}
						}
					})
				
				}).catch(err => {
					console.log(err)
				})
			},
			// 近期直播查看更多
			seejinmore(){
				let newjinpage=this.jinpage;
				newjinpage++;
				this.jinpage=newjinpage;
				if(this.jinshowpull==true){
					this.getnearlist()
				}
				
			},
			//历史美妆查看更多
			seehismore(){
				let newhispage=this.hispage;
				newhispage++;
				this.hispage=newhispage;
				if(this.hisshowpull==true){
					this.gethislist()
				}
			},
			// 热门品类推荐查看更多
			hotmore(){
				uni.navigateTo({
					url:'/pages/xinyuan/zhiboknow'
				})
			}
				
				

		}

	}
</script>

<style>
	@import url('../../style/xinyuan');

	page {
		padding: 0 32rpx;
		box-sizing: border-box;
	}
	.searchlist{
		margin-top:0
	}
	
		
	.seemore{
		color: #FF0000;
		font-size: 28rpx;
		text-align: center;
		margin-top:20rpx;
	}

	.searhtoppage {
		padding: 0 32rpx;
		box-sizing: border-box;
	}

	.fuzhi {
		margin-top: 92rpx
	}

	.copybtn {
		margin: 64rpx auto 32rpx
	}

	.fuzhitext {
		text-align: center;
	}
</style>