<template>
	<view>
		<u-navbar title="我的巡检" :background="{ background: '#1669e6' }" title-color="#FFFFFF" back-icon-color="#FFFFFF">
			<view slot="right" v-if="deptName != '外部用户'" style="margin-right: 20rpx;color: #FFFFFF;" @click="addCamera">
				创建巡检</view>
		</u-navbar>
		<view style="box-shadow: 0px 0px 8px 0px rgba(165, 189, 251, 0.4);margin-bottom: 20rpx">
			<u-tabs :list="list" :is-scroll="false" :current="current" @change="changetwo"></u-tabs>
		</view>
		<view v-for="(item,index) in dataList" :key="index"
			style="box-shadow: 0px 0px 8px 0px rgba(165, 189, 251, 0.4);width: 96%;border-top-right-radius: 10rpx;margin: 10rpx auto;padding-top: 10rpx;">
			<span
				style="width: 10rpx;height: 40rpx;background-color: #2979ff;display: block;float: left;margin-top: 10rpx;"></span>
			<h4
				style="width: 140rpx;border-radius: 200rpx;text-align: center;color: #2979ff;border: 2rpx solid #1785FF;float: right;margin-right: 10rpx;margin-top: 10rpx;">
				{{item.fInspectorName}}
			</h4>
			<view style="width: 90%;margin: 0 auto;margin: 0 auto;">
				<view style="display: flex;justify-content: space-between;height: 60rpx;line-height: 60rpx;border-bottom: 1rpx solid #eff4ff;">
					<h4>{{item.fWarehouseName}}</h4>
				</view>
				<view>
					<view style="width: 100%;height: 60rpx;line-height: 60rpx;">
						<view style="float: left;">计划日期</view>
						<view style="float: right;">{{item.fInspectionDatetime}}</view>
					</view>
					<view style="width: 100%;height: 60rpx;line-height: 60rpx;">
						<view style="float: left;">最新巡查日期</view>
						<view style="float: right;">{{item.fUpdateTime}}</view>
					</view>
					<view style="width: 100%;">
						<u-form-item label="备注" style="margin: 0;padding: 0;">
							<u-input v-model="item.fRemark" :disabled="true" height="70rpx" type="textarea"
								placeholder="" />
						</u-form-item>
					</view>
				</view>
				<view
					style="width: 100%;margin: 0 auto;height: 80rpx;margin: 0 auto;line-height: 80rpx;border-top: 1rpx solid #eff4ff;"
					@click="expenseDetails(item)">
					<view style="float: left;">
						<h3>{{deptName != '外部用户'?'立即巡检':'查看巡检'}}</h3>
					</view>
					<view style="float: right;">
						<u-icon name="arrow-right"></u-icon>
					</view>
				</view>
			</view>
		</view>
		<u-toast ref="uToast" />
		<u-loadmore :status="status" :icon-type="iconType" :load-text="loadText" />
		<u-calendar :closeable="false" v-model="show" z-index="10076" mode="range" @change="change" :mask-close-able="false">
		</u-calendar>
		<!-- <u-action-sheet :list="warehouseList" @click="click" @close="close" :mask-close-able="false" v-model="warehouse"></u-action-sheet> -->
		<u-calendar :mask-close-able="false" :closeable="false" v-model="range" mode="range" @change="changeRange">
		</u-calendar>
		<u-picker v-model="warehouse" z-index="10076" mode="selector" :range="warehouseList" range-key="fName" @confirm="confirm" @cancel="close"></u-picker>
		<u-popup v-model="screen" @close="closeScreen" mode="bottom" length="60%" border-radius="40" :closeable="true">
			<view>
				<view style="text-align: center;height: 100rpx;line-height: 100rpx;">
					<text style="font-weight: bold;font-size: 32rpx;">全部筛选</text>
				</view>
				<view style="width: 96%;margin: 0 auto;">
					<text style="font-size: 32rpx;">仓库选择</text>
					<u-field
							style="margin: 20rpx auto;"
							v-model="warehouseName"
							label="仓库"
							placeholder="请选择仓库"
							disabled
							@click="warehouse = true"
							/>
					<text style="font-size: 32rpx;">计划日期</text>
					<u-field
							style="margin: 20rpx auto;"
							v-model="datatime"
							label="计划日期"
							placeholder="请选择计划日期"
							disabled
							@click="show = true"
							/>
					<view
						style="width: 100%;position:fixed; bottom:0;background-color: #FFFFFF;padding-left: 20px;padding-right: 20px;padding-bottom: 30rpx;z-index: 9999;">
						<u-button type="primary" @click="confirmCompletion">确认完成</u-button>
					</view>
				</view>
			</view>
		</u-popup>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				show: false,
				range: false,
				screen: false,
				status: 'loadmore',
				warehouseName:'',
				warehouseId:'',
				datatime:'',
				inspectionBeginDate:'',
				inspectionEndDate:'',
				warehouseList: [],
				warehouse: false,
				loadText: {
					loadmore: uni.getStorageSync('deptName') == '外部用户' ? '请切换选择仓库' : '轻轻上拉',
					loading: '努力加载中',
					nomore: '实在没有了'
				},
				iconType: 'flower',
				dataList: [],
				list: [{
					name: '全部'
				}, {
					name: '仓库'
				}, {
					name: '计划日期'
				}, {
					name: '今日计划'
				}, {
					name: '筛选'
				}],
				form: {
					pageNum: 1,
					pageSize: 10,
				},
				current: 3,
				total: 0,
				deptName: uni.getStorageSync('deptName')
			}
		},
		created() {
			if (uni.getStorageSync('deptName') == '外部用户') {
				this.list = [{
					name: '选择仓库'
				}, {
					name: '选择日期'
				}, {
					name: '筛选'
				}]
				delete this.form.fInspectionDatetime
			} else {
				this.query()
			}
			
			this.$u.get('/basicdata/warehouse/appList', {
				fStatus: 0,
				delFlag: 0
			}).then(res => {
				console.log(res)
				this.warehouseList = res.rows
				// res.rows.forEach((item, index) => {
				// 	this.warehouse.push({
				// 		id: item.fId,
				// 		text: item.fName
				// 	})
				// })
			})
		},
		onReachBottom() {
			this.status = 'loading'
			if (this.dataList.length < this.total) {
				this.form.pageNum++
				this.query()
			} else {
				this.status = 'nomore'
			}
		},
		methods: {
			//确定
			confirm(index) {
				// console.log(index)
				if(this.screen === true){
					this.warehouseName = this.warehouseList[index].fName
					this.warehouseId = this.warehouseList[index].fId
				}else{
					this.form = {
						pageNum: 1,
						pageSize: 10,
						fWarehouseFid:this.warehouseList[index].fId
					}
					this.dataList = []
					this.current = null
					this.query()
				}
			},
			confirmCompletion(){
				this.form = {
					pageNum: 1,
					pageSize: 10,
					fWarehouseFid:this.warehouseId,
					inspectionBeginDate:this.inspectionBeginDate,
					inspectionEndDate:this.inspectionEndDate
				}
				this.dataList = []
				this.current = null
				this.screen = false
				this.query()
			},
			//创建巡检
			addCamera() {
				this.$u.route('/pages/home/patrolInspection/createPatrol');
			},
			close() {
				// this.deptName = uni.getStorageSync('deptName')
				this.current = null
			},
			//弹出框收起触发
			closeScreen(){
				this.current = null
				this.screen = false
			},
			click(index) {
				console.log(index)
				this.form.fWarehouseFid = this.warehouseList[index].fId
				this.dataList = []
				this.current = null
				this.query()
			},
			query() {
				// this.current = null
				if (uni.getStorageSync('deptName') == '外部用户') {
					this.$u.get('/warehouse/checkitems/appListByUser', this.form).then(res => {
						console.log(res)
						this.dataList = this.dataList.concat(res.rows)
						this.total = res.total
						if (res.total === 0) this.status = 'nomore'
					})
				} else {
					this.$u.get('/warehouse/checkitems/listByUser', this.form).then(res => {
						console.log(res)
						this.dataList = this.dataList.concat(res.rows)
						this.total = res.total
						if (res.total === 0) this.status = 'nomore'
					})
				}
			},
			change(e) {
				if(this.screen == true){
					this.current = null
					this.datatime = e.startDate + e.endDate
					this.inspectionBeginDate = e.startDate+' 00:00:00'
					this.inspectionEndDate = e.endDate +' 23:59:59'
				}else{
					this.current = null
					// this.form.inspectionDate = e.startDate+' 00:00:00' + ',' + e.endDate +' 23:59:59'
					// this.form.inspectionBeginDate = e.startDate+' 00:00:00'
					// this.form.inspectionEndDate = e.endDate +' 23:59:59'
					this.form = {
						pageNum: 1,
						pageSize: 10,
						inspectionBeginDate:e.startDate+' 00:00:00',
						inspectionEndDate:e.endDate +' 23:59:59'
					}
					this.dataList = []
					this.query()
				}
			},
			changeRange(e) {
				this.current = null
				if (this.form.fWarehouseFid) {
					this.form.inspectionDate = e.startDate + ',' + e.endDate
					this.dataList = []
					this.query()
				} else {
					this.$refs.uToast.show({
						title: '请选择仓库',
					})
				}
			},
			changetwo(index) {
				console.log(index)
				if (uni.getStorageSync('deptName') == '外部用户') {
					if (index === 0) this.warehouse = true
					if (index === 1) this.range = true
					if (index === 2) this.screen = true
				} else {
					if (index === 0) {
						this.dataList = []
						this.form = {
							pageNum: 1,
							pageSize: 10
						}
						this.query()
					}
					if (index === 1) this.warehouse = true
					if (index === 2) this.show = true
					if (index === 3) {
						delete this.form.inspectionDate
						this.form.fInspectionDatetime = new Date().toLocaleDateString().replace(/\//g, "-")
						this.dataList = []
						this.query()
					}
					if(index === 4) this.screen = true
				}
				this.current = index;
			},
			expenseDetails(item) {
				this.$u.route('/pages/home/patrolInspection/patrolDetails', {
					form: JSON.stringify(item)
				});
			},
		}
	}
</script>

<style lang="scss" scoped>
	.wrap {
		padding: 24rpx;
	}

	.item {
		padding: 24rpx 0;
		color: $u-content-color;
		font-size: 28rpx;
	}
</style>
