<template>
	<view class="content">

		<view style="flex: 1;width: 750upx;overflow: hidden;">
			<scroll-view v-show="currentTab===0" enableBackToTop="true" scroll-y style="height: 100%;" @scrolltolower="loadMore()">
				<view class="publicity-content" v-if="pageList.length>0">
					<view class="reading-list" v-for="(item,i) in pageList" :key="i">
						<view class="uni-flex" style="justify-content: space-between; margin-bottom: 12upx;">
							<view>
								<text class="comment-name-text">{{item.READING_STAFF}}</text>
								<text class="text-gray fs12" v-if="item.ISDOWN==1">【已下载】</text>
							</view>
							<view  v-if="item.PRESCRIPTION">
								<text class="fs12 reader-text">【{{getDealTime(item.PRESCRIPTION)}}】</text>
								<text class="text-gray ml30 fs12" v-if="item.PREVIEWDATE">{{$util.cutDate(item.PREVIEWDATE,'MM-DD hh:mm') }}</text>
							</view>
							<view  v-else>
								<text class="fs12 reader-text">【未阅】</text>
								
							</view>
						</view>
						<view class="uni-read-content" v-if="item.SUGGESTION">
							<text>{{item.SUGGESTION}}</text>
						</view>
						<view class="reader-cell" v-for="(person,i) in item.childList" :key="i">
							<view class="uni-flex fs12" >
								<view class="uni-flex" style="align-items: center;">
									<image src="../../static/images/reader/read-ico.png" mode="aspectFit"></image>
									<text class="fs12">{{person.READING_STAFF}}：</text>
								</view>
								<view class="reader-text fs12" style="flex:1;" v-if="person.SUGGESTION">{{person.SUGGESTION}}</view>
							</view>
							<view class="fs12" v-if="person.PREVIEWDATE"  style="text-align: right;">
								<text class="reader-text">【{{getDealTime(person.PRESCRIPTION)}}】</text>
								<text class="text-gray ml30" >{{$util.cutDate(person.PREVIEWDATE,'MM-DD hh:mm') }}</text>
							</view>
							<view class="reader-cell pl32" v-for="(child,i) in person.detilsList" :key="i">
								<view class="uni-flex fs12" >
									<view class="uni-flex" style="align-items: center;">
										<image src="../../static/images/reader/read-ico.png" mode="aspectFit"></image>
										<text class="fs12">{{child.READING_STAFF}}：</text>
									</view>
									<view class="reader-text fs12" style="flex:1;" v-if="child.SUGGESTION">{{child.SUGGESTION}}</view>
									
								</view>
								<view class="fs12" v-if="child.PREVIEWDATE"  style="text-align: right;">
									<text class="reader-text">【{{getDealTime(child.PRESCRIPTION)}}】</text>
									<text class="text-gray ml30" >{{$util.cutDate(child.PREVIEWDATE,'MM-DD hh:mm')}}</text>
								</view>
							</view>
						</view>
						
						
					</view>
				</view>
							
				<view v-else-if="pageData.isLoading===false" >
					<noFound :nodata="pageList.length>0 ? false : true"/>
				</view>
				<view class="load-more" v-if="pageList.length>0">
					<text>{{!pageData.isEnd ? '正在加载,请稍后...':'——— 我是有底线的 ———'}}</text>
				</view>
			</scroll-view>
			
		</view>
		
		
	</view>
</template>

<script>
	import ListUnit from './components/listUnit.vue'
	
	export default {
		data() {
			return {
				pageData: {
					pageIndex:1,
					pageSize:10,
					sendPageIndex:1,
					sendPageSize:10,
					isEnd: false,
					isLoading: true
				},
				documentId:'',
				documentListType:'',
				currentTab: 0,
				pageList:[]
			}
		},
		components:{
			ListUnit
		},
		onLoad(option) {
			uni.showLoading({
				title:'正在加载'
			})
			this.documentListType =option.type
			this.documentId = option.id
			this.pageData.isLoading = true
			this.getList()
		},
		methods: {
			getDealTime(_time){
				
				_time = _time/60
				if(_time<1){
					return '1小时内'
				}
				
				else if(_time>1 && _time<24){
					
					return parseInt(_time)+'小时内'
					
				}
				else if(_time>24){
					return parseInt(_time/24)+'天内'
				} else {
					return parseInt(_time)+'小时内'
				}
			},
			getList() {
				let _this = this
				
				_this.$request.$get('getReadingDetails',{
					
					pageIndex: this.pageData.pageIndex,
					pageSize: this.pageData.pageSize,
					documentListType: this.documentListType,
					documentId: this.documentId
				}).then(res => {
					
					if(!res.ResultCode ||res.ResultCode!='100'){
						
						_this.pageList = []
					}else{
						let list = res.Data.List
						if (list.length > 0) {
							if( this.pageData.pageIndex==1 ) {
								
								_this.pageList = list
								
							}else{
								_this.pageList = [..._this.pageList,...list]
							}
							
						}
				
						if (list.length < _this.pageData.pageSize) { // 返回条数小于每页条数
							_this.pageData.isEnd = true
						}
						_this.$forceUpdate()
					}
					uni.hideLoading()
					setTimeout(function(){
						_this.pageData.isLoading = false
					},500)
					
				})
			},
			loadMore(){
				if(!this.pageData.isEnd) {
					this.pageData.pageIndex += 1
					this.getList()
				}
			},
			downFresh() { // 下拉刷新
				let _this = this
				_this.pageMsg.pageIndex = 1
				_this.getList()
				_this.$forceUpdate()
				
			},
			
		},
		onPullDownRefresh() {
			uni.showLoading({
				title:'正在加载'
			})
			this.pageData.pageIndex = 1
			this.pageData.isEnd = false
			this.getList()
			setTimeout(function() {
				uni.stopPullDownRefresh()
			}, 1000)
		},
		onReachBottom(){
			this.loadMore()
		},
		onUnload() {
			this.$util.addUserBehavior()
		}
	}
</script>

<style scoped>
	.content {
		display: flex;
		flex-direction: column;
		overflow: hidden;
		height: 100%;
		width: 750upx;
	}
	.fs12 {
		font-size: 24upx;
	} 
	.publicity-content {
		
		font-size: 26upx;
		padding-bottom: 24upx;
	}
	.pl32 {
		padding-left: 32upx;
	}
	.ml30 {
		margin-left: 12upx;
	}
	.reading-list {
		padding: 24upx;
		background-color: #fff;
	}
	.text-gray  {
		color: #B1B3B8;
		
	}
	 .comment-name-text {
		color: #E49641;
	}
	.uni-read-content{
		word-break: break-all;
		font-size: 26upx;
		margin: 0 0 12upx;
	}
	.reader-text {
		color: #74838E;
	}
	.reading-list image {
		width: 10upx;
		height: 11upx;
		margin-right: 12upx;
		margin-left: 2upx;
	}
	.reading-list+.reading-list {
		margin-top: 24upx;
	}
	.reader-cell + .reader-cell{
		margin-top: 12upx;
	}
</style>
