<template>
	<view class="container">
		 <uni-list v-for="item in dataList" class="uniListItem">
			 <!-- #169316 -->
			 <uni-icons v-if="item.state==2" custom-prefix="iconfont" color="#ea7878" type="icon-yijieshu4" size="35" class="stateIcon yiwancheng"></uni-icons>
			 <uni-icons v-if="item.state==1" custom-prefix="iconfont" color="#659fed" type="icon-jinhangzhong" size="35" class="stateIcon"></uni-icons>
			 <uni-icons v-if="item.state==0" custom-prefix="iconfont" color="#7ed47e" type="icon-weikaishi2" size="35" class="stateIcon"></uni-icons>
		 	<uni-list-item :title="item.title" :note="'预约时间：'+item.mdate" :rightText="item.mroom_name">
				<text>预约时间段;</text>
			</uni-list-item>
			
		</uni-list>
		<!-- <uni-list-chat  v-for="item in dataList" :title="item.meetingName"  note="您收到一条新的消息" time="2020-02-02 20:20" >
			<view class="chat-custom-right">
				<text class="chat-custom-text">刚刚</text>
				<uni-icons type="star-filled" color="#999" size="18"></uni-icons>
			</view>
		</uni-list-chat> -->
	</view>
</template>

<script>
	export default {
		data(){
			return{
				page:1,
				page_size:10,
				dataList:[],
			}
		},
		mounted() {
			this.getlistData();
		},
		methods:{
			getlistData(){
				let that = this;
				that.$api.bookingList({page:that.page,page_size:that.page_size}).then(res=>{
					that.dataList = res.results;
				})
			},
		},
	}
</script>

<style scoped>
	.container{
		height: 100%;
		padding: 0!important;
		background-color: #ffffff;
	}
	.chat-custom-right {
		flex: 1;
		/* #ifndef APP-NVUE */
		display: flex;
		/* #endif */
		flex-direction: column;
		justify-content: space-between;
		align-items: flex-end;
	}
	
	.chat-custom-text {
		font-size: 12px;
		color: #999;
	}
	.uniListItem{
		position: relative;
	}
	.stateIcon{
		position: absolute;
		top: 0;
		right: 0;
		z-index: 1;
	}
	.yiwancheng{
		color: #ff0000;
	}
</style>