<template>
	<view>
		<view class="products_box">
			<u-grid :border="false" col="2">
				<u-grid-item v-for="(item,index) in productList" :key="index" @click="toDetailPage(item)">
					<u-image src="/static/products/sy_bb.png" width="354rpx" height="539rpx" :lazy-load="true">
					</u-image>
					<view class="bgContent">
						<view>
							<u-image :src="imgUrl+item.cover" width="346rpx" height="320rpx" :lazy-load="true">
							</u-image>
							<view class="img_tag">{{item.cate_name}}</view>
						</view>
						<view style="padding: 14rpx 24rpx 14rpx 16rpx;">
							<view class="title_box">
								<text class="title">{{item.name}}</text>
								<u-tag :text="item.tags" type="warning" shape="circle"></u-tag>
							</view>
							<view class="product_desc">
								{{item.title}}
							</view>
							<view class="releaseDate">
								<u-image src="/static/products/xp_icon_sjf.png" width="22rpx" height="22rpx"
									:lazy-load="true">
								</u-image>
								<text class="release">发布日期：</text>
								<text>{{item.pub_time_str}}</text>
							</view>
						</view>
					</view>
				</u-grid-item>
			</u-grid>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				imgUrl: '',
				tagsArray: [],
				productList: [],
				pageNum: 1, // 当前页
				pageSize: 4, // 每页条数
			}
		},
		created() {
			// uni.$on("getCurrent", data => {
			// 	if (data == 0) {
			// 		this.sortType = 1
			// 	} else if (data == 1) {
			// 		this.sortType = 2
			// 	}
			// })
			this.imgUrl = uni.getStorageSync('img_url')
			this.getProductsByThumb()
		},
		methods: {
			//获取按点赞量排列的产品列表
			getProductsByThumb() {
				this.$apiServe.getProducts({
					sortType: 2,
					pageSize: this.pageSize,
					pageNum: this.pageNum
				}).then(res => {
					console.log('产品列表2', res.data);
					let tags = res.data.data
					for (const item of tags) {
						let tag = item.tags
						this.tagsArray = tag.split(',')
						item.tags = this.tagsArray[0]
					}
					this.$emit("getThumbLength", tags.length);
					// 用于触底刷新  为数据赋值：通过展开运算符的形式，进行新旧数据的拼接 
					this.productList = [...this.productList, ...res.data.data]
					//这用于上架时间和点赞量的数据切换
					// this.productList = res.data.data
				}).finally(_ => {

				})
			},
			//点击图片跳转到详情页
			toDetailPage(item) {
				uni.navigateTo({
					url: '/pages/detail/productsDetail/productsDetail?id=' + item.id
				})
			}
		}
	}
</script>

<style lang="scss">

</style>
