<template>
	<view class="container">
		<!-- <u-navbar autoBack placeholder bgColor="transparent"
			style="background: linear-gradient(91deg, #FDEDEE 0%, #FFFFFF 100%);">
			<view class="navSlot" slot="left">
				<u-icon name="arrow-left" size="19"></u-icon>
				<text class="title" v-if="type == 1">添加公厕</text>
				<text class="title" v-else-if="type == 2">编辑公厕</text>
			</view>
		</u-navbar> -->
		<view class="main">
			<view @click="showcont=true" class="flex ptb-20 flex-center-center"
				style="border-bottom: 1px solid #F0F0F0;">
				<text style="color: red;">*</text>
				<text style="color: black;">巡查内容</text>
				<text
					style="color: black;flex: 1;text-align: end;color: #999999;">{{dataParams.inspectionContent?dataParams.inspectionContent:"选择巡查内容"}}</text>
				<image class="left w-8 h-15 ml-10" src="../../static/hoem/ic_left.png"></image>
			</view>
			<view class="flex-column ptb-20" style="border-bottom: 1px solid #F0F0F0;">
				<view class="flex mb-20">
					<text style="color: red;">*</text>
					<text style="color: black;">公厕编号</text>
				</view>
				<input style="color: black;flex: 1;margin-left: 15rpx;" placeholder="" v-model="dataParams.toiletId"
					disabled />
			</view>
			<view class="ptb-20" style="border-bottom: 1px solid #F0F0F0;">
				<view class="flex ptb-20 flex-center-center">
					<text style="color: red;">*</text>
					<text style="color: black;">公厕坑位设备</text>
					<text style="color: black;flex: 1;text-align: end;color: #999999;"></text>
					<image class="left w-8 h-15 ml-10" src="../../static/hoem/ic_left.png"></image>
				</view>
				<input style="color: black;flex: 1;margin-left: 15rpx;" placeholder="" v-model="dataParams.equipmentId"
					disabled />
			</view>
			<view class="flex-column ptb-20">
				<view class="flex mb-20">
					<text style="color: red;">*</text>
					<text style="color: black;">公厕照片</text>
				</view>
				<upload-image v-model="images" maxCount="3" width="100" height="100" type="fullurl"
					@uploadImages="uploadImages"></upload-image>
			</view>
			<view class="flex-column">
				<text style="color: black;">备注信息</text>
				<textarea v-model="dataParams.notes" class="h-200 mt-20"
					style="width: 100%;padding: 10rpx; background: #F8F4F4;border-radius: 4px;box-sizing: border-box;"
					:adjust-position="false" placeholder="请输入详细地址"
					placeholder-style="color:#c0c4cc;font-size: 30rpx"></textarea>
			</view>
		</view>
		<view class="btn-group flex-center-center" @click="onSubmit">
			<text>提交</text>
		</view>
		<u-picker keyName="ruleContent" :show="showcont" :columns="inspeclist" :closeOnClickOverlay="true"
			@close="showcont = false" @cancel="showcont = false" @confirm="oncont"></u-picker>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				userInfo: {},
				showcont: false,
				images: '',
				dataParams: {
					"toiletId": "", //公厕编号
					"equipmentId": "", //设备编号
					"inspector": "", //管理员id
					"inspectorId": "", //管理员
					// "images": [], //图片url数组
					"notes": "", //备注信息
					"status": "1", //
					"inspectionContent": "", //
					"inspectionFile": "", //
					"id": "", //
				},
				inspeclist: [
					[]
				],
			};
		},
		onLoad(data) {
			console.log(data)
			this.dataParams.toiletId = data.toiletId;
			this.dataParams.equipmentId = data.equipmentId;
			this.dataParams.id = data.id;
		},
		onShow() {
			this.getinspectioncont();
			const params = {
				url: '/getInfo',
				data: {},
				method: 'GET',
			}
			this.$request(params).then(res => {
				this.userInfo = res.user;
				this.dataParams.inspector = res.user.nickName;
				this.dataParams.inspectorId = res.user.userId;
			})
		},
		methods: {
			oncont(e) {
				console.log(e)
				this.showcont = false
				this.dataParams.inspectionContent = e.value[0].ruleContent
			},
			//获取巡查内容
			getinspectioncont() {
				const params = {
					url: '/app/system/rule/inspectioncont',
					data: {},
				}
				this.$request(params).then(res => {
					this.inspeclist = [];
					this.inspeclist.push(res.rows)
					// this.zoneList[0].length = 0
					// for (var i = 0; i < res.rows.length; i++) {
					// 	this.zoneList[0].push(res.rows[i].name)
					// }
				})
			},
			uploadImages(images) {
				console.log(images)
				this.images = images
			},
			onSubmit() {
				console.log(this.images)
				this.dataParams.inspectionFile = this.images;
				if (!this.dataParams.inspectionContent) {
					this.$u.toast('选择巡查内容')
					return
				}
				const params = {
					url: "/system/changepaper/addpaper",
					data: this.dataParams,
				}
				this.$request(params).then(res => {
					this.$u.toast('添加成功')
					setTimeout(() => {
						uni.navigateBack({
							delta: 1
						})
					}, 800)
				})
				// return
				// this.dataParams.toiletId = this.number
				// this.dataParams.area = this.area
				// for (var i = 0; i < this.deviceList.length; i++) {
				// 	if (this.deviceList[i].device.length != 0) {
				// 		this.dataParams.equipmentBindings.push(this.deviceList[i].device)
				// 	}
				// }
				// if (this.type == 2) {
				// 	this.dataParams.equipmentChanges = this.dataParams.equipmentBindings;
				// 	this.dataParams.equipmentBindings = this.equipmentBinding;
				// }
				// let images = this.images.split(",")
				// for (var i = 0; i < images.length; i++) {
				// 	if (images[i].length != 0) {
				// 		this.dataParams.images.push(images[i])
				// 	}
				// }
				// if (this.dataParams.locationlat.length == 0) {
				// 	this.$u.toast('请选择公厕位置')
				// 	return
				// }
				// if (this.dataParams.managerName.length == 0) {
				// 	this.$u.toast('请选择管理员')
				// 	return
				// }
				// if (this.dataParams.toiletId.length == 0) {
				// 	this.$u.toast('请输入公厕编号')
				// 	return
				// }
				// if (this.dataParams.area.length == 0) {
				// 	this.$u.toast('请输入公厕面积')
				// 	return
				// }
				// if (this.dataParams.equipmentBindings.length == 0) {
				// 	this.$u.toast('请添加并选择公厕设备')
				// 	return
				// }
				// if (this.dataParams.images.length == 0) {
				// 	this.$u.toast('请添加公厕照片')
				// 	return
				// }
				// let url = "";
				// if (this.type == 1) {
				// 	url = '/app/system/toilets/addtoilets'
				// } else if (this.type == 2) {
				// 	url = '/app/system/toilets/edit'
				// }
				// const params = {
				// 	url: url,
				// 	data: this.dataParams,
				// }
				// // console.log(this.dataParams)
				// // return
				// this.$request(params).then(res => {
				// 	this.$u.toast('添加成功')
				// 	setTimeout(() => {
				// 		uni.navigateBack({
				// 			delta: 1
				// 		})
				// 	}, 800)
				// })
			},


		},
	};
</script>

<style lang="scss">
	::v-deep .u-navbar {
		position: fixed;
		left: 0;
		right: 0;
		top: 0;
		z-index: 11;
	}

	.container {
		width: 100%;
		background: #F8F4F4;
		display: flex;
		flex-direction: column;
		padding-bottom: 20rpx;
	}

	.main {
		padding: 20rpx 24rpx;
		background: #FFFFFF;
		border-radius: 14rpx 14rpx 14rpx 14rpx;
		flex: 1;
		margin: 20rpx 24rpx;
	}

	.btn-group {
		background: linear-gradient(89deg, #FFBFBC 0%, #FB262A 100%);
		margin: 0 20rpx;
		border-radius: 44rpx;
		height: 88rpx;
		background: linear-gradient(89deg, #FFBFBC 0%, #FB262A 100%);
		border-radius: 44rpx 44rpx 44rpx 44rpx;
		font-family: Microsoft YaHei, Microsoft YaHei;
		font-weight: bold;
		font-size: 32rpx;
		color: #FFFFFF;
		line-height: 88rpx;
	}
</style>