<template>
	<view class="page">
		<view style="flex:1" v-if="list.length>0">
			<view class="uni-list" >
				<view class="uni-list-cell" hover-class="uni-list-cell-hover" v-for="(value,index) in list" :key="index" @click="chooseFile(index)">
					<view class="uni-media-list">
						<!-- <view class="uni-media-list-logo">
							<image :src="value.img"></image>
						</view> -->
						<view class="uni-media-list-body mediaBox">
							<view class="uni-media-list-text-top">{{value.name}}</view>
							<view class="uni-media-list-text-bottom uni-ellipsis">{{value.content?"文档类型："+value.content:''}}   &emsp;{{value.sourcename?'来源：'+value.sourcename:''}}</view>
							<view class="uni-media-list-text-bottom uni-ellipsis">于{{value.up_time|| '未知时间'}} XX上传</view>
						</view>
						<view class="mediaRadio">
							<radio color="#3382FF" :checked="value.checked"   style="transform:scale(0.7)"/>
						</view>
					</view>
				</view>
			</view>		
			<uni-load-more  :loadingType="loadingType" :contentText="contentText" ></uni-load-more>
		</view>
		<view v-else>
			<view class="example-body">
				<no-record ></no-record>
			</view>
		</view>
		<view class="fixMargin"></view>
		<view class="fixBottom">
			<view class="uni-flex uni-row">
				<view style="-webkit-flex:1;flex: 1;">
					<button type="primary" style="width: 90%;" @click="downloadFiles">下载</button>
				</view>
			</view>
		</view>
		<view class="goHome" @click='goMain()'>
			<img src="../../static/img/gohome.png">
		</view>
		<!-- <view  style="width:100%; position: absolute; bottom: 5px;" v-if="download" >
			<button type="primary" @click="downloadFiles">下载</button>
		</view> -->
	</view>
</template>
<script>
	
	import uniLoadMore from '@/components/uni-load-more/uni-load-more.vue';
	import noRecord from '@/components/xinsoft-no-record/xinsoft-no-record';
	
	export default {
		components: {
			uniLoadMore,noRecord
		},
		data() {
			return {
				deviceId:'', //设备id
				pageSize:5, //一页多少条记录
				page:1,
				title: 'list-triplex-row',
				list: [],
				//上拉刷新，下拉加载
				loadingText: '加载中...',
				loadingType: 0,//定义加载方式 0---contentdown  1---contentrefresh 2---contentnomore
				contentText: {
					contentdown:'上拉显示更多',
					contentrefresh: '正在加载...',
					contentnomore: '没有更多数据了'
				},
				selectFileLength:0,
				download:false
			}
		},
		onLoad(options) {
			this.deviceId = options.deviceId;
			//初始化当前列表。
			this.getDocument(this.deviceId);
		},
		onPullDownRefresh: function() {
		// 	//下拉刷新的时候请求一次数据
		    this.getDocument(this.deviceId);
		},
		onReachBottom: function() {
			this.getDocumentMore(this.deviceId);
		},
		methods: {
			chooseFile(index){
				this.list[index].checked = !this.list[index].checked;
				//修改当前选择的个数。
				this.getSelectFileLength();
				this.changeTitleView();
			},
			changeTitleView(){
				// var webView = this.$mp.page.$getAppWebview();  
				// // index: 按钮索引, style {WebviewTitleNViewButtonStyles }  
				// var _this = this;
				// webView.setTitleNViewButtonStyle(0, {  
				//     text: this.selectFileLength==this.list.length ?'全不选': this.selectFileLength?'全选':' ', 
				// 	 onclick:function(e){
				// 		 if(e.text == '全选'){
				// 			 //进行全选操作
				// 			 _this.list.forEach((vals,index)=>{
				// 			 	vals.checked = true;
				// 			 });
				// 			 _this.selectFileLength = _this.list.length;
				// 		 }else{
				// 			 //全不选操作。
				// 			 _this.list.forEach((vals,index)=>{
				// 			 	vals.checked = false;
				// 			 });
				// 			 _this.selectFileLength = 0;
				// 		 }
				// 		 _this.changeTitleView();
				// 	 }
				// }); 
				// webView.setTitleNViewButtonStyle(1, {
				//     text: this.selectFileLength ?'取消' :' ', 
				// 	onclick:function(){
				// 		_this.list.forEach((vals,index)=>{
				// 			vals.checked = false;
				// 		});
				// 		_this.selectFileLength = 0;
				// 		_this.changeTitleView();
				// 	}
				// }); 
				
				// webView.setStyle({
				// 	titleNView:{
				// 		autoBackButton:this.selectFileLength?'false':'true',
				// 	}
				// })
				this.download = this.selectFileLength?true:false;
				
				// uni.setNavigationBarTitle({
				// 	title:this.selectFileLength>0?("已选择"+this.selectFileLength+"个文件"):"文档资料"
				// })
			},
			getSelectFileLength(){
				//判断当前选择的文件个数。
				var num = 0;
				this.list.forEach((vals,index)=>{
					if(vals.checked){
						num++;
					}
				});
				this.selectFileLength = num;
			},
			//下载文件的方法。
			downloadFiles(){
				//暂时提示下，下载文档资料
				uni.showModal({
					title:'提示',
				    content: '下载文档资料功能暂未开放',
					showCancel:false
				});
			},
			getDocument(deviceId){
				this.loadingType = 0;		
				this.$http.request({
				  url: '/apis/deviceDocument/listDocPage',
				  params:{
					  pageno: this.page,
					  pagesize: this.pageSize,
					  device_id:deviceId
				  },
				}).then(res=>{
					if (!res.data.data || res.data.data.length ==0) {//没有数据
						this.loadingType = 2;
						uni.hideNavigationBarLoading();//关闭加载动画
						return;
					}
					if(res.data.code == 0){
						this.page++;//得到数据之后page+1
						uni.hideNavigationBarLoading();
						uni.stopPullDownRefresh();//得到数据后停止下拉刷新
						
						if(res.data.data.datas.length>0){
							res.data.data.datas.forEach((vals,index)=>{
								vals.checked = false;
							})
							this.list = res.data.data.datas;
						}
					}
				}).catch(err=>{
				});
			},
			getDocumentMore(deviceId){
				if (this.loadingType !== 0) {//loadingType!=0;直接返回
					return false;
				}
				this.loadingType = 1;
				uni.showNavigationBarLoading();//显示加载动画
				this.$http.request({
				  url: '/apis/deviceDocument/listDocPage',
				  params:{
					  pageno: this.page,
					  pagesize: this.pageSize,
					  device_id:deviceId
				  },
				}).then(res=>{
					if (!res.data.data|| res.data.data.length ==0) {//没有数据
						this.loadingType = 2;
						uni.hideNavigationBarLoading();//关闭加载动画
						return;
					}
					if(res.data.code == 0){
						this.page++;//每触底一次 page +1
						this.loadingType = 0;//将loadingType归0重置
						uni.hideNavigationBarLoading();//关闭加载动画
						res.data.data.datas.forEach((vals,index)=>{
							vals.checked = false;
						})
						this.list = [...this.list,...res.data.data.datas];
					}
				}).catch(err=>{
				});
			}
		}
	}
</script>
<style>
	.mediaBox{height: 65px;}
	.mediaRadio{
		width: 30px;
		line-height: 65px;
	}
</style>