<template>
	<view class="message">
		<view class="font">
			<!-- <uni-icons style="padding-left: 11px;color: white;" type="arrow-left" size="30" @click="back"></uni-icons> -->
			<uni-icons style="padding-left: 11px;color: white;font-weight: 100;" type="back" size="30" @click="back"></uni-icons>
			<text style="margin-left: 30%;color: white;">Message</text>
		</view>
		<view class="body">
			<view class="body-i">
				<!-- <image src="../../static/img/message.png" mode=""></image> -->
			</view>
			<button class="body-btn">Continue shopping</button>
		</view>
	</view>
</template>

<script>
	import {defaultRequest} from '../../api/index.js'
	export default {
		data() {
			return {
				list:[],
				//个人信息
				myMes:{
					_action:'getmessagelist',
					type:1,
					importance:'',
					label:'',
					title:'',
					page_index:1,
					page_size:100
				},
				//系统信息
				myMes1:{
					_action:'getmessagelist',
					type:0,
					importance:'',
					label:'',
					title:'',
					page_index:1,
					page_size:100
				},
				app_Mes:[],
				
			}
		},
		filters:{
			Mes(e){
				let str = e
				str=str.substring(0,10);
				const year = str.substring(0,4)
				let date = str.substring(5,10)
				date = date.replace('-','/')
				let time = date + '/'+year
				return time
			}
		},
		methods:{
			// getList(){
			// 	let data={_action:'getfavourableactivities'}
			// 	defaultRequest(data).then(res=>{
			// 		console.info(res)
			// 		if(res.error==0){
			// 			// this.list=res.data
						
			// 		}
			// 	})
			// },
			getMes(){
				let data ={ _action:'getpagedata',pagecode:'006-PERSONALCENTERPAGE'
					
				}
				
				defaultRequest(data).then(res =>{
					
					let list = res.data.zones
					
					list.map(item =>{
						if(item.zone_code =='XIAOXI'){
							this.list = item
							console.log(this.list)
						}
					})
					
					
				})
				defaultRequest(this.myMes).then(res =>{
					console.log(res)
					let i = 0
					if(res.error ==0){
						this.app_Mes = res.data.message_list
					  this.app_Mes.map( item =>{
					   	// console.log(item)
					   	if(item.unread == 1){
					   		i++
					   	}
					   })
					   console.log(i)
					}
				
				
				})
				defaultRequest(this.myMes1).then(res =>{
					// console.log(res)
					
					if(res.error == 0){
						this.app_Mes = res.data.message_list
						console.log(this.app_Mes)
					}
				
				})
			},
			gotopage(item){
				let data ={
					_action:'readmessage',
					message_id:''
				}
				console.log(item)
				if(item.id){
					data.message_id = item.id
				}
				// else{
				// 	data.message_id = item.block_id
				// }
				
				defaultRequest(data).then(res =>{
					if(res.error == 0){
						uni.showToast({
							title:'Read',
							icon:'none'
						})
						console.log(res)
						this.getMes()
					}
				})
				if(item.block_link){
					if(item.block_link.includes('goodslist')){
						const i = item.block_link.indexOf('?')
						const src = item.block_link.substring(i)
						uni.navigateTo({
							url:'../category/productList'+src
						})
					}else{
						uni.navigateTo({
							url:'../productDetails/index'+src
						})
					}
				}
				
			},
			back(){
				uni.navigateBack()
			}
		},
		onLoad() {
			// this.getList()
			this.getMes()
		}
	}
</script>
<style>
	page{
		height: 100vh;
		background-color: #f6f5fa !important;
	}
</style>
<style lang="scss" scoped>
	.font {
	    display: flex;
	    position: fixed;
	    background-color: #000;
	    height: 56px;
	    width: 100%;
	    z-index: 999;
	    // padding-top: 28px;
	    align-items: center;
	    text-align: center;
	    top: 0;
	    left: 0;
	    font-size: 20px;
	    font-weight: bold;
	}
	.body {
		margin-top: 56px;
		display: flex;
		justify-content: center;
		align-items: center;
		flex-direction: column;
		height: 100%;
		.body-i {
			object-fit: cover;
			width: 336px;
			height: 106px;
			margin-top: 61px;
			background: url('../../static/img/message.png') center;
			background-size: auto;
			background-repeat: no-repeat;
		}
		&-btn {
			margin-top: 42px;
			background: #000;
			border-radius: 8px;
			color: #fff;
		}
	}
</style>