<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 {
				queryParam: {
					pageSize: 10,
					pageNum: 1
				},
				queryTitle: null,
				imgUrl: null,
				productList: [],
				tagsArray: [],
			}
		},
		onLoad(options) {
			this.imgUrl = uni.getStorageSync('img_url')
			this.queryTitle = options.title
			this.goSearch()
		},
		methods: {
			goSearch() {
				const data = {
					...this.queryParam,
					title: this.queryTitle
				}

				this.$apiServe.getProductList(data).then(res => {
					let tags = res.data.data
					if (tags) {
						for (const item of tags) {
							let tag = item.tags
							this.tagsArray = tag.split(',')
							item.tags = this.tagsArray[0]
						}
						this.productList = tags
					}
				}).finally(_ => {})
			},
			//点击图片跳转到详情页
			toDetailPage(item) {
				uni.navigateTo({
					url: '/pages/detail/productsDetail/productsDetail?id=' + item.id
				})
			}
		}
	}
</script>

<style>

</style>
