<template>
	<!-- 公告 消息 提示 页面 -->
	<view class="notice">
		<view class="head">
			<view class="head_l">消息中心</view> 
		</view>
	  <block v-for="(item,index) of list" :key="index">
		<view class="list" @tap="todetailes"> 
			<view class="msgboxs">
				<view class="list_l twoline">{{item.title}} </view> 
				<view class="list_l">{{item.msg_text.content}}</view> 
			</view>
			<view class="list_03">
				<view class="list_l">{{item.day}} {{item.time}}</view> 
			</view>
		</view>
	  </block>	
	  
	  <pageScrollTo v-if="isshowtop" ></pageScrollTo>
	  <!-- 返回顶部 -->
	</view>
</template>

<script>
	import {storeAdvices} from "@/utils/api/api.js";
	import pageScrollTo from "@/components/pageScrollTo/pageScrollTo.vue"
	export default {
		components:{
			pageScrollTo
		},
		data() {
			return {
				list:[],
				page:0,//分页
				istoall:true,//瀑布流开关
				isshowtop:false,
			};
		},
		onLoad() {
			this.storeAdvicesfun()
		},
		//下拉刷新
		onPullDownRefresh(){
			this.list=[];
			this.page=0;//分页
			this.istoall=true;//瀑布流开关
			this.storeAdvicesfun();
			// uni.stopPullDownRefresh();//结束下拉刷新
		},
		//处理瀑布流
		onReachBottom() {
			
			if(this.istoall){
				
				this.storeAdvicesfun();
			}
		},
		//监听滚动
		onPageScroll(e){
			//console.log(e.scrollTop);
			//处理返回顶部
			if(e.scrollTop>400){
				this.isshowtop = true;
			}else{
				this.isshowtop = false;
			}
		},
		methods:{
			//查看消息详情 处理消息
			todetailes(){
				//做不了 ~~~
				
				// if(true){//type==1
				// 	uni.navigateTo({
				// 		url:"/pages/order/detail/detail",
				// 	})
				// }
				
			},
			async storeAdvicesfun(){
				this.page++;
				let res = await storeAdvices({
					page:this.page,
				});
				uni.stopPullDownRefresh();//结束下拉刷新
				if(res.code==0){

					if(res.data){
						if(res.data.length!=0){
							this.list = [...this.list,...res.data]
						}else{
							this.istoall = false;
							this.$api.msg("没有更多了哦~");
						}
					}else{
						this.istoall = false;
						this.$api.msg("没有更多了哦~");
					}
				}else{
					this.$api.msg(res.msg);
				}
			}
		}
	}
</script>

<style lang="scss">
	

.notice{
	.msgboxs{
		.list_l{
			margin-bottom: 10upx;
		}
	}
	.head{display: flex;background-color:$base_color ;justify-content: space-between;padding: 50upx 24upx}
	.head_l{color: #fff;font-size: 40upx;}
	.head_r{background-color: #fff;color: #E2481D;height: 60upx;line-height: 60upx;width: 200upx;border-radius: 40upx;text-align: center;font-size: 32upx;}
	.list{margin: 20upx; background-color: #fff;padding: 20upx;}
	.list_01{color: #C1C1C1;padding-bottom: 20upx;}
	.list_02{display: flex;justify-content: space-between;font-size: 28upx;padding-bottom: 20upx;}
	.list_03{color: #C1C1C1;display: flex;justify-content: space-between;}
}
</style>
