<template>
<div>
	<common @asynCallBack="asynCallBack"></common>
	<loading :visible="isLoading"></loading>
	
    <header class="mui-bar mui-bar-nav">
				<a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
				<h1 class="mui-title">放行记录</h1>
			</header>
			<div class="mui-content">
				<div class="fyy-temper-date margin10">
					<a   class="mui-col-xs-12"  @click="selectData()">{{listForm.date}}
					<span class="mui-icon mui-icon-arrowdown" ></span></a>
				</div>
				<ul class="mui-table-view vongi-list-text">
					<li class="mui-table-view-cell mui-media" v-for="item,i in recordList"  @click="gotoItem(item.id)">
						<a href="javascript:;" class="mui-navigate-right">
							申请人：{{item.personName}}
						</a>
						<p class="mui-ellipsis flew-sp">
							出厂时间：{{showtime(item.releaseTime)}}
							<span>核验人：{{item.releasePerson}} {{item.releaseCompany}}</span>
						</p>
					</li>
				</ul>	
				<NullList :remark="'暂无申请记录'" v-if="!recordList.length"></NullList>
				
			</div>
</div>
</template>


<script>
	require('$project/assets/js/mui.picker.min.js');
	
	import * as API from '@/apis-xsy/scan'
 
	import  Common from '$project/components/Common.vue'
 	import Loading from '$project/components/Loading.vue'
	import TopHeader from '$project/components/TopHeader.vue'
	import NullList from '$project/components/NullList.vue'
	import isReachBottom from '$project/utils/isReachBottom'
	
	import {
		mapGetters,
		mapMutations
	} from 'vuex'
	import {
		currentTimeStamp,
		parseUnixTime,
		hourDistanceArr
	} from '$project/utils'
	export default {
		name: '',
		components: {
			Common,
			Loading,
			TopHeader,NullList
		},
		data() {
			return {
			 
			 
				pageTitle: '携物出厂',
			 
				isLoading: false,			
				listForm: {
					date:'',
					pageIndex: 1,
					pageSize: 10,
					totalPage: 1,
				},
				recordList: [],
				
			  
			}
		},
		created() {
			 this.listForm.date = parseUnixTime(currentTimeStamp(), '{y}-{m}-{d}');
			 
		},
		methods: {
			showtime(time){
				if(time){
					time=time.substring(5)
				}
				return time;
			},
			//选择日期
			selectData() {
				var vdate = parseUnixTime(currentTimeStamp(), '{y}-{m}-{d}');
				 vdate=new Date(vdate)
				 //var vdata=currentTimeStamp();
				var _this = this;
				
			 
				var picker = new mui.DtPicker({
					"type": "date",
					"beginYear": 2020,
					"endYear": 2040,
					"endDate": vdate,
			    
					"value": _this.listForm.date
				});
				picker.show(function(rs) {
					_this.listForm.date = rs.text;
					_this.listForm.pageIndex = 1
					_this.getList()
					picker.dispose();
					
				});
			},
			gotoItem(id){
							  this.$router.push({
							      name: "XsyScanInfo",
									query:{id:id,
									scan:'scan'
									}
							  })
			},
			gotoUrl(){
				 this.$router.push({
				     name: "XsyCommerceAdd",
				 })
			},
			 //获取列表
			 getList() {
			 	this.isLoading = true;
			 	API.indexData(this.listForm).then(response => {
			 		if (response) {
			 			if (this.listForm.pageIndex == 1) {
			 				this.recordList = response.map.data;
			 				this.listForm.pageIndex = response.map.pageNumber;
			 				this.listForm.totalPage = response.map.totalPage;
							
			 			} else {
			 				this.recordList = [
			 					...this.recordList,
			 					...response.map.data
			 				];
			 			}
			 		}
			 		this.listForm.pageIndex++;
			 		this.isLoading = false;
			 	}).catch(error => {
			 		this.isLoading = false;
			 		mui.toast(error);
			 	})
			 },
			 //下拉事件
			 handleScrool() {
				 
			 	if (isReachBottom()) {
			 		console.log('到达底部')
					if (this.listForm.pageIndex <= this.listForm.totalPage && this.isLoading == false) {
						this.getList();
					} else {
						return;
					}
				
			 	}
			 },
		 
			asynCallBack() {

			},
		
		},
	mounted() {
			this.getList();
		
		//监控下拉加载事件
		var _this = this;
		window.addEventListener('scroll', _this.handleScrool);
	},
	destroyed() {
		//销毁监听事件
		var _this = this;
		window.removeEventListener('scroll', _this.handleScrool);
	},
	
	}
</script>

<style src="$project/assets/css/iconfont.css"></style>
<style scoped src="$project/assets/css/xpwyfyy.css"></style>
<style src="$project/assets/css/xsy.css"></style>
<style src="$project/assets/css/mui.picker.min.css"></style>

<style>
</style>
