<template>
	<view class="main">
		<view class="tabar">
			<view>
				<image class="icblack" src="../../static/hoem/icon_back.png" @click="$wskj.goBack(1)"></image>
			</view>
			<view>设置巡查</view>
		</view>

		<view class="common">
			<view class="patrol">
				<view @click="showOne = true" class="settignsInspect">
					<view class="titleName">巡查人员</view>
					<view class="inspectionName">
						<view>{{name==''?'请选择':name}}</view>
						<view>
							<image class="left" src="../../static/hoem/ic_left.png">
						</view>
					</view>
				</view>
				<view @click="showTwo = true" class="settignsInspect">
					<view class="titleName">巡查公厕</view>
					<view class="inspectionName">
						<view>{{number==''?'请选择':number}}</view>
						<view>
							<image class="left" src="../../static/hoem/ic_left.png">
						</view>
					</view>
				</view>
				<view @click="showThree = true" class="settignsInspect">
					<view class="titleName">巡查周期</view>
					<view class="inspectionName">
						<view>{{cycle==''?'请选择':cycle}}</view>
						<view>
							<image class="left" src="../../static/hoem/ic_left.png">
						</view>
					</view>
				</view>
			</view>
			<view @click="onSubmit" class="butSubmit">
				提交
			</view>
		</view>
		<u-picker keyName="nickName" :show="showOne" :columns="oneList" :closeOnClickOverlay="true" @close="showOne = false"
			@cancel="showOne = false" @confirm="onOne"></u-picker>
		<u-picker keyName="toiletId" :show="showTwo" :columns="twoList" :closeOnClickOverlay="true" @close="showTwo = false"
			@cancel="showTwo = false" @confirm="onTwo"></u-picker>
		<u-picker :show="showThree" :columns="threeList" :closeOnClickOverlay="true" @close="showThree = false"
			@cancel="showThree = false" @confirm="onThree"></u-picker>
	</view>

</template>

<script>
	export default {
		data() {
			return {
				showOne: false,
				showTwo: false,
				showThree: false,
				name: '',
				number: '',
				cycle: '',
				nameId: '',
				numberId: '',
				cycleId: '',
				oneList: [
					// ['张三', '李四', '王二', "麻子"]
				],
				twoList: [
					['G001', 'G002', 'G003', "G004"]
				],
				threeList: [
					['每一天一次', '每两天一次', '每三天一次', '每四天一次', '每五天一次', '每六天一次', '每七天一次']
				],
				daydata: "",
				managerList: [],
				type: "",
				id: "",
			}
		},
		onLoad(data) {
			this.type = data.type;
			if (this.type == 2) {
				this.id = data.id;
				this.getitem(data.id);
			}
		},
		onShow() {
			this.getXxryList()
			this.getGcList()
		},
		methods: {
			getitem(){
				console.log("getitem")
			},
			//选择巡查人员列表
			getXxryList() {
				const params = {
					url: '/system/province/setuser',
					data: {
						role: 2
					},
				}
				this.$request(params).then(res => {
					this.managerList = res.data;
					this.oneList = [];
					this.oneList.push(res.data);
					console.log(this.oneList)
				})
			},
			//选择公厕列表
			getGcList() {
				const params = {
					url: '/app/system/toilets/toiletslist',
					data: {},
				}
				this.$request(params).then(res => {
					this.twoList = [];
					this.twoList.push(res.rows);
				})
			},
			onOne(e) {
				this.name = e.value[0].nickName;
				this.nameId = e.value[0].userId;
				this.showOne = false;
			},
			onTwo(e) {
				this.number = e.value[0].toiletId
				this.numberId = e.value[0].id
				this.showTwo = false
			},
			onThree(e) {
				console.log(e)
				this.cycle = e.value[0];
				e.values[0].forEach((item,index)=>{
					if(item == this.cycle){
						this.daydata = index + 1;
					}
				});
				console.log(this.daydata)
				this.showThree = false
			},
			onSubmit() {
				if (this.name.length==0) {
					this.$u.toast('请选择巡查人')
					return
				}
				if (this.number.length==0) {
					this.$u.toast('请选择巡查公测')
					return
				}
				if (this.cycle.length==0) {
					this.$u.toast('请选择巡查周期')
					return
				}
				const params = {
					url: '/app/system/toilets/edit',
					data: {
						setInspectorsid: this.nameId,
						setInspectors: this.name,
						id: this.numberId,
						toiletId: this.number,
						setInspectioncycle: this.daydata,
					},
				}
				// console.log(params)
				// return
				this.$request(params).then(res => {
					this.$u.toast('设置成功')
					setTimeout(() => {
						uni.navigateBack({
							delta: 1
						})
					}, 800)
				})
			}
		}
	}
</script>

<style lang="scss">
	.main {
		background: linear-gradient(91deg, #FDEDEE 0%, #FFFFFF 100%);
		height: 100%;
		width: 100%;

		.common {
			padding: 24rpx;
			background-color: #F8F4F4;
			.butSubmit {
				height: 88rpx;
				margin-top: 71rpx;
				background: linear-gradient(89deg, #FFBFBC 0%, #FB262A 100%);
				border-radius: 44rpx 44rpx 44rpx 44rpx;
				font-weight: 800;
				font-size: 32rpx;
				line-height: 88rpx;
				text-align: center;
				color: #FFFFFF;
			}

			.patrol {
				background: #FFFFFF;
				border-radius: 14rpx 14rpx 14rpx 14rpx;

				.settignsInspect {
					display: flex;
					justify-content: space-between;


					padding: 20rpx;

					.inspectionName {
						display: flex;
						padding-right: 20rpx;
						font-size: 28rpx;
						color: #999999;

						.titleName {
							font-size: 28rpx;
							color: #333333;
						}

						.left {
							margin-left: 20rpx;
							width: 8rpx;
							height: 16rpx;
						}
					}

					.titleName {
						display: flex;
					}

					.inspcet {}

				}
			}

		}

		.tabar {
			height: 99rpx;
			color: #333333;
			display: flex;
			align-items: center;
			font-weight: 800;
			font-size: 36rpx;
			padding: 10rpx;
			background: linear-gradient(91deg, #FDEDEE 0%, #FFFFFF 100%);

			.icblack {
				width: 36rpx;
				text-align: center;
				margin-top: 15rpx;
				height: 36rpx;
			}
		}
	}
</style>