<template>
	<view class="content">
		<view :style="{ height: `calc(${globalData.statusBarHeight}rpx + 130rpx)` }"></view>

		<view v-if="articleList.length" class="friends-list-box">
			<evaluateList :list="articleList" @getId="handleDetail"></evaluateList>
		</view>
		<view v-else class="diagram">
			<image src="@/static/icon/qst.png" mode=""></image>
			<view class="">
				暂无数据
			</view>
		</view>
		<u-loadmore iconSize="50px" @loadmore="loadMore" color="#6A6C6F" fontSize="24rpx" :nomore-text="nomoreText" :loading-text="loadingText" line :status="loadStatus" />
		
		<com-navbar :leftIcon="false" :homeShow="false" bgColor="#fff" title="动态"
			:titleStyle="{ color: '#000', fontSize: '32rpx',scrollTopHeader: scrollTopHeader }" />
		<com-tabbar :list=" [{
					name: '首页',
					icon: '/static/tabbar/tb1.png', 
					selectIcon:'/static/tabbar/td1.png', 
					url: '/pages/home/index',
					type: 'type'
				}, {
					name: '我的需求', 
					icon: '/static/tabbar/tb2.png',
					selectIcon: '/static/tabbar/td2.png', 
					url: '/pages/demand/index',
					type: 'type'
				}, {
					name: '发布', 
					icon: '/static/tabbar/fb.png',
					selectIcon:'/static/tabbar/fb.png', 
					url: '/pages/release/index', 
					type: 'type'
				}, {
					name: '动态',
					icon: '/static/tabbar/tb3.png', 
					selectIcon: '/static/tabbar/td3.png', 
					url: '/pages/order/index',
					type: 'order'
				}, {
					name:'我的' ,
					icon:'/static/tabbar/tb4.png' ,
					selectIcon:'/static/tabbar/td4.png', 
					url: '/pages/my/index',
					type: 'type'
				}]"></com-tabbar>
	</view>
</template>

<script>
	import {userArticleGet} from '../../api/order/index.js'
	import evaluateList from '../../components/evaluate.vue'
	export default {
		components: {
			evaluateList,
		},
		data() {
			return {
				globalData: getApp().globalData,
				queryParams:{
					pageNum:1,//当前页数
					pageSize:10,//分页大小
				},
				articleList:[],//文章列表
				total:0,//总数
				loadStatus:'loading',//加载时的状态(loadmore/ loading / nomore)
				loadingText: '正在加载',
				nomoreText: '已经到底了'
			}
		},
		onReachBottom() {
			let that = this
			if(that.total <= that.queryParams.pageNum * that.queryParams.pageSize) return that.loadStatus = 'nomore'
			that.queryParams.pageNum++
			that.getArticleList()
		},
		onShow() {
			this.getArticleList()
		},
		methods: {
			async getArticleList(){
				let that = this
				const data_back = await userArticleGet(that.queryParams);
				const {code,total,rows} = data_back;
				if(code === 200 && total > 0) {
					that.total = total
					if(that.total < that.queryParams.pageSize){
						that.loadStatus = 'nomore'
					}else{
						that.loadStatus = 'loading'
					}
					if(that.queryParams.pageNum == 1){
						that.articleList = rows
					}else{
						that.articleList = [...that.articleList,...rows]
					}
				}
			},
			
			
			handleDetail(id) {
				let that = this
				that.$uniGo.navigateTo({
					url: `/order/detail/detail?id=${id}`
				})

			}
		}
	}
</script>

<style lang="scss" scoped>
	.friends-list-box {
		/* background-color: #FFFFFF;
		padding: 30rpx 20rpx;
		border-radius: 10rpx;
		margin: 10px 20rpx 0 20rpx;
		box-shadow: 0px 0px 8px 0px rgba(0, 0, 0, 0.1); */
	}
	.diagram {
		text-align: center;
		margin-top: 335rpx;
	
		>image {
			width: 396rpx;
			height: 243rpx;
		}
	
		>view {
			margin-top: 20rpx;
			font-size: 24rpx;
			font-weight: 400;
			color: #444444;
		}
	}
</style>
