<template>
	<view>
		<view v-if="list[0]">
			<view class="collection-box" v-for="(item,index) in list" :key="index" @click="jumppolicy(item.collectId)">
				<text class="collection-title">{{item.title}}</text>
			</view>			
		</view>
		<view v-else class="noData">
			暂时没有收藏过政策
		</view>
	</view>
</template>

<script>
	import { querySelf } from 'api/querySelf'
	export default {
		onShareAppMessage(res) {
			if (res.from === 'button') {// 来自页面内分享按钮
				console.log(res.target)
			}
			return {
				title: '',
				path: '/pages/MyPages/CollectionPage'
			}
		},
		data() {
			return {
				pageNum:1,
				pageSize:20,
				list:[],
				hasNextPage:true
			}
		},
		async onLoad(){
			const that = this
			try{
				const params = {
					param:{
						pageNum:that.pageNum,
						pageSize:that.pageSize
					}
				}
				const data = await querySelf(params)
				that.hasNextPage = data.hasNextPage
				that.list = data.list
			}catch(err){
				//TODO handle the exception
				console.log(err)
			}
		},
		onReachBottom: function () {
			this.pageNum ++
		},
		methods: {
			jumppolicy(id){
				uni.navigateTo({
					url:`/pages/Policy/PolicyDetails?id=${id}&token=${this.$store.state.user.token}`
				})
			}
		},
		watch:{
			async pageNum(val){
				uni.showToast({
					title:'正在加载',
					icon:'loading'
				})
				const that = this
				console.log(val)
				if(that.hasNextPage === true){
					try{
						const params = {
							param:{
								pageNum:val,
								pageSize:that.pageSize
							}
						}
						const data = await querySelf(params)
						that.hasNextPage = data.hasNextPage
						console.log(data)
						that.list = that.list.concat(data.list) 
					}catch(err){
						//TODO handle the exception
						console.log(err)
					}
				}else{
					uni.showToast({
						title:'到底了',
						icon:'none'
					})
				}
			}
		}
	}
</script>

<style lang="scss" scoped>
.collection-box{
	height: 40px;
	display: flex;
	align-items: center;
	padding:0 15px;
	background-color: $white;
	margin-top: 6px;
}
.collection-title{
	flex: 4;
	white-space:nowrap;
	overflow: hidden;
  text-overflow:ellipsis;
	-webkit-line-clamp: 1;
}
.noData{
	margin-top: 300upx;
	color: $gray;
	text-align: center;
}
</style>
