<template>
	<view class="content">

		<view v-if="pageList.length>0">

			<list-unit v-for="(item,index) in pageList" :key="index" :item="item" :i="index" @goDetail="goDetail"></list-unit>

		</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>
		<navigator class="applyLeave" url="/pages/askForLeave/newLeave" @click="$util.addUserBehaviorNew({intoRoute:'/pages/askForLeave/newLeave'})">
			<image src="/static/images/leave/leave-btn.png" mode="aspectFit"></image>
			<text>我要请假</text>
		</navigator>

	</view>
</template>

<script>
	import {mapGetters,mapMutations} from 'vuex'
	import ListUnit from './components/leaveUnit.vue'

	export default {
		data() {
			return {
				pageData: {
					pageIndex:1,
					pageSize:10,
					isEnd: false,
					isLoading: true
				},
				pageList:[]
			}
		},
		components:{
			ListUnit
		},
		computed:{
			...mapGetters({reloading:'shouldReLoadingList'})
		},
		methods: {
			...mapMutations(['shouldReLoadingList']),
			getList() {
				let _this = this

				_this.$request.$get('GetStaffLeaveList',{
					pageIndex: this.pageData.pageIndex,
					pageSize: this.pageData.pageSize,
				}).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()
				}
			},
			goDetail(item){
				this.$util.toNextRoute('navigateTo', '/pages/askForLeave/detail?id='+item.FINANCEPROINST_ID)
				// uni.navigateTo({
				// 	url: '/pages/askForLeave/detail?id='+item.FINANCEPROINST_ID
				// })
			}
		},
		onPullDownRefresh() {
			uni.showLoading({
				title:'正在加载'
			})
			this.pageData.pageIndex = 1
			this.pageData.isEnd = false
			this.getList()
			setTimeout(function() {
				uni.stopPullDownRefresh()
			}, 1000)
		},
		onReachBottom(){
			this.loadMore()
		},
		onShow() {
			let _this = this

			if(this.reloading) {
				uni.showLoading({
					title:'正在加载'
				})
				_this.pageData.pageIndex = 1
				_this.pageData.isEnd = false
				_this.getList()
				this.shouldReLoadingList(false)
			}

		},
		onLoad() {
			uni.showLoading({
				title:'正在加载'
			})
			this.pageData.isLoading = true
			this.getList()
		},
		onUnload() {
			this.$util.addUserBehaviorNew()

		},

	}
</script>

<style scoped>
	.content {
		padding-top: 6upx;
		display: flex;
		flex-direction: column;
		justify-content: center;
		/* height: 100%; */
		/* box-sizing: border-box; */
	}
	.applyLeave {
		position: fixed;
		background-image: linear-gradient(to right, #306FD9, #5DA7FA);
		color: #fff;
		font-size: 26upx;
		height: 62upx;
		width: 182upx;
		bottom: 200upx;
		right: -10upx;
		line-height: 62upx;
		padding-left: 28upx;
		border-radius: 32upx 0 0 32upx;
		box-shadow: 0 2upx 16upx 0 #91C3FB;
		display: flex;
		align-items: center;

	}
	.applyLeave image {
		width: 26upx;
		height: 26upx;
		margin-right: 10upx;
		line-height: 62upx;
	}
</style>
