<template>
	<view class="fullHeight">
		<headers :showBack="true">
			<view class="headerName">
				{{pageTitle}}
			</view>
		</headers>
		<view class="formBox">
			<form @submit="formSubmit">
				<view class="uni-form-item">
					<view class="uni-form-label">
						<text class="star">*</text>任务名称
					</view>
					<view class="uni-form-input">
						<input class="uni-input" placeholder-class="cl" name="taskName" :value="form.taskName"
							placeholder="请输入" />
					</view>
				</view>
				<view class="uni-form-item">
					<view class="uni-form-label">
						<text class="star">*</text>任务类型
					</view>
					<view class="uni-form-input">
						<picker @change="bindPickerChange" :value="tastTypeIndex" :range="tastTypeList"
							range-key="typeName">
							<view class="uni-input uni-select cl" v-if="tastTypeIndex==null">
								请选择 <image class="icon-down" src="/static/icon-down-black.png" mode=""></image>
							</view>
							<view class="uni-input uni-select" v-else>{{tastTypeList[tastTypeIndex]}}
								<image class="icon-down" src="/static/icon-down-black.png" mode=""></image>
							</view>
						</picker>
					</view>
				</view>
				<view class="uni-form-item">
					<view class="uni-form-label">
						<text class="star">*</text>优先级
					</view>
					<view class="uni-form-input">
						<picker @change="bindPickerChange2" :value="priorityIndex" :range="priorityList"
							range-key="floorName">
							<view class="uni-input uni-select cl" v-if="priorityIndex==null">
								请选择 <image class="icon-down" src="/static/icon-down-black.png" mode=""></image>
							</view>
							<view class="uni-input uni-select" v-else>{{priorityList[priorityIndex]}}
								<image class="icon-down" src="/static/icon-down-black.png" mode=""></image>
							</view>
						</picker>
					</view>
				</view>
				<view class="uni-form-item">
					<view class="uni-form-label">
						<text class="star">*</text>区域代码
					</view>
					<view class="uni-form-input">
						<input class="uni-input" placeholder-class="cl" name="areaCode" :value="form.areaCode"
							placeholder="请输入" />
					</view>
				</view>
				<view class="uni-form-item">
					<view class="uni-form-label">
						<text class="star">*</text>任务描述
					</view>
					<view class="uni-form-input">
						<input class="uni-input" placeholder-class="cl" name="taskDescribe" :value="form.taskDescribe"
							placeholder="请输入" />
					</view>
				</view>
				<view class="uni-form-item">
					<view class="uni-form-label">
						<text class="star">*</text>指派人
					</view>
					<view class="uni-form-input">
						<picker @change="bindPickerChangeLeader" :value="leaderIndex" :range="leaderList"
							range-key="floorName">
							<view class="uni-input uni-select cl" v-if="leaderIndex==null">
								请选择 <image class="icon-down" src="/static/icon-down-black.png" mode=""></image>
							</view>
							<view class="uni-input uni-select" v-else>{{leaderList[leaderIndex]}}
								<image class="icon-down" src="/static/icon-down-black.png" mode=""></image>
							</view>
						</picker>
					</view>
				</view>
				<view class="uni-form-item">
					<view class="uni-form-label">
						截止日期
					</view>
					<view class="uni-form-input">
						<picker mode="date" :value="form.endDate" @change="bindDateChange">
							<view class="uni-input uni-select cl" v-if="form.endDate==''">
								请选择 <image class="icon-down" src="/static/icon-down-black.png" mode=""></image>
							</view>
							<view class="uni-input uni-select" v-else>{{form.endDate}}
								<image class="icon-down" src="/static/icon-down-black.png" mode=""></image>
							</view>
						</picker>
					</view>
				</view>
				<view class="uni-form-item">
					<view class="uni-form-label">
						任务编号
					</view>
					<view class="uni-form-input">
						<input class="uni-input" placeholder-class="cl" name="taskCode" :value="form.taskCode"
							placeholder="请输入" />
					</view>
				</view>
				<button form-type="submit" type="primary" class="btn submitBtn big">保存</button>
			</form>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				pageTitle: '添加任务',
				leaderIndex: null,
				tastTypeIndex: null,
				priorityIndex: null,
				selectList: [{
						name: 'C15'
					}, {
						name: 'C20'
					}, {
						name: 'C25'
					}, {
						name: 'C30'
					}, {
						name: 'C35'
					},
					{
						name: 'C40'
					}, {
						name: 'C45'
					}, {
						name: 'C50'
					}, {
						name: 'C55'
					}, {
						name: 'C60'
					}
				],
				selectArr: [],
				tastTypeList: ["结构截面积尺寸", "表面平整度", "表面垂直度", "顶板水平度", "楼板厚度", "混凝土回弹", "门窗洞口", "保护层厚度", "角度"],
				priorityList: ["一级","二级","三级"],
				leaderList: ["董事长","项目经理"],
				form: {
					taskName: '',
					taskType: "",
					priority: "",
					areaCode: '',
					taskDescribe: "",
					leaderPerson: "",
					endDate: "",
					taskCode: ""
				},
				personList: [],
				projectDetail: {},
				isAdd: true
			}
		},
		onLoad(options) {},
		onShow() {

		},
		methods: {
			goSelectPersonFn() {
				uni.navigateTo({
					url: './personList'
					// url:'../../selectPerson/selectPerson2'
				})
			},
			getDetails(id) {
				this.sendRequest({
					url: 'xmgl/electronPourOrder/queryById',
					data: {
						id: id
					},
					method: "POST",
					success: (res) => {
						this.form = res.result

						if (this.form.designStrength) {
							var items = this.selectList,
								values = [];
							if (this.form.designStrength.indexOf(',') != -1) {
								values = this.form.designStrength.split(',')
							} else {
								values = [this.form.designStrength]
							}
							for (var i = 0, lenI = this.selectList.length; i < lenI; ++i) {
								const item = this.selectList[i]
								if (values.includes(item.name)) {
									this.$set(item, 'checked', true)
								} else {
									this.$set(item, 'checked', false)
								}
							}
							// console.log(this.selectList)
						}
					}
				})
			},
			bindPickerChange: function(e) {
				this.tastTypeIndex = e.target.value
				this.form.taskType = e.target.value
			},
			bindPickerChangeLeader: function(e) {
				this.leaderIndex = e.target.value
				this.form.leaderPerson = e.target.value
			},
			bindPickerChange2: function(e) {
				this.priorityIndex = e.target.value
				this.form.priority = e.target.value
			},
			bindDateChange: function(e) {
				this.form.endDate = e.target.value
			},
			checkboxChange: function(e) {
				// var items = this.selectList,
				// 	values = e.detail.value;
				this.selectArr = e.detail.value;
				// for (var i = 0, lenI = items.length; i < lenI; ++i) {
				// 	const item = items[i]
				// 	if(values.includes(item.value)){
				// 		this.$set(item,'checked',true)
				// 	}else{
				// 		this.$set(item,'checked',false)
				// 	}
				// }
			},
			formSubmit(e) {
				var that = this
				console.log(e)
				var params = e.detail.value
				params.projectSn = this.projectDetail.projectSn
				if (params.concreteTab == '') {
					uni.showToast({
						title: '请输入混泥土标号',
						icon: 'none'
					})
					return false;
				}
				if (this.tastTypeIndex == null) {
					uni.showToast({
						title: '请选择楼栋',
						icon: 'none'
					})
					return false;
				}
				if (this.priorityIndex == null) {
					uni.showToast({
						title: '请选择楼层',
						icon: 'none'
					})
					return false;
				}


				params.buildId = this.tastTypeList[this.tastTypeIndex].id
				params.floorId = this.priorityList[this.priorityIndex].floorId
				params.pourTime = this.form.pourTime
				params.designStrength = this.selectArr.join(',')


				var url = 'xmgl/electronPourOrder/edit'
				if (this.isAdd) {
					url = 'xmgl/electronPourOrder/add'

				} else {
					params.id = this.form.id
				}
				this.sendRequest({
					url: url,
					data: params,
					method: "POST",
					success(res) {
						uni.showToast({
							title: '保存成功！'
						})
						uni.navigateBack({

						})
					}
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	.personListBox {
		// background-color: #f7f7f7;
		border-radius: 4px;
		overflow: hidden;
		border-left: 1px dashed #e6e6e6;
		position: relative;

		.personLeft {
			width: calc(100% - 20rpx);
		}

		.personItem {
			float: left;
			width: calc(33.33% - 21px);
			height: 54px;
			text-align: center;
			font-size: 24rpx;
			border-bottom: 1px dashed #e6e6e6;
			padding: 0px 20rpx 0;
			border-right: 1px dashed #e6e6e6;
			border-top: 1px dashed #e6e6e6;
			background-color: #f7f7f7;

			.name {
				font-size: 30rpx;
				padding-top: 16rpx;
			}

			.txt {
				overflow: hidden;
				white-space: nowrap;
				text-overflow: ellipsis;
			}

			&.total {
				display: inline-flex;
				align-items: center;
				font-size: 30rpx;
				justify-content: center;
			}

			// &:nth-child(3n){
			// 	border-right: none;
			// }
		}

		.icon-right {
			position: absolute;
			right: 0;
			top: calc(50% - 7px);
			width: 16rpx;
			height: 28rpx;
		}
	}

	.designBox {
		background-color: #f9f9f9;
		border-radius: 4px;
		padding: 20rpx 20rpx 0;
		overflow: hidden;
		margin-bottom: 40rpx;

		.uni-list-cell {
			width: 20%;
			float: left;
			margin-bottom: 20rpx;
		}
	}
</style>