<template>
	<div>
		<el-dialog :title="title" :visible.sync="showFormDia" width="85%" height="600px" :before-close="handleClose">
			<el-form ref="formInfo" :rules="rules" :model="params" label-width="150px">
				<el-row>
					<el-col :span="8">
						<el-form-item label="关联测站" prop="stcd">
							<el-select size="mini" style="width: 100%" filterable v-model="params.stcd" clearable
								placeholder="请选择关联测站">
								<el-option v-for="item in stnms" :key="item.id" :label="item.stnm" :value="item.stcd">
								</el-option>
							</el-select>
						</el-form-item>
					</el-col>
					<!-- <el-col :span="8">
						<el-form-item label="水库名称" prop="rscd">
							<el-select size="mini" style="width: 100%" filterable v-model="params.rscd" clearable  @change="changeRsnm"
								placeholder="请选择水库名称">
								<el-option v-for="item in rsnms" :key="item.id" :label="item.rsnm" :value="item.rscd">
								</el-option>
							</el-select>
						</el-form-item>
					</el-col>
					<el-col :span="8">
						<el-form-item label="生态站类型" prop="sstp">
							<el-select size="mini" v-model="params.sstp" clearable style="width: 100%"
								placeholder="请选择生态站类型">
								<el-option v-for="item in stzlxList" :key="item.id" :label="item.name"
									:value="item.value"></el-option>
							</el-select>
						</el-form-item>
					</el-col> -->
					<el-col :span="8">
						<el-form-item label="预警等级：" prop="gradeCode">
							<el-select style="width: 100%" size="mini" v-model="params.gradeCode" clearable
								@change="changeYjdj" placeholder="请选择预警等级">
								<el-option v-for="item in yjdjList" :key="item.id" :label="item.name"
									:value="item.value"></el-option>
							</el-select>
						</el-form-item>
					</el-col>
					<el-col :span="8">
						<el-form-item label="是否短信预警通知：" prop="isNoteMsg">
							<el-radio v-model="params.isNoteMsg" label="1">是</el-radio>
							<el-radio v-model="params.isNoteMsg" label="0">否</el-radio>
						</el-form-item>
					</el-col>

				</el-row>
				<el-row>

					<el-col :span="8">
						<el-form-item label="生态流量核定值(m³/s)：" prop="fsltdz">
							<el-input size="mini" placeholder="请输入生态流量核定值" v-model="params.fsltdz"></el-input>
						</el-form-item>
					</el-col>
				</el-row>
			</el-form>
			<span slot="footer" class="dialog-footer">
				<el-button type="primary" @click="goInfo">保 存</el-button>
				<el-button @click="handleClose">取 消</el-button>
			</span>
		</el-dialog>
	</div>
</template>
<script>
	import ecologicalFlow from '@/api/stManager/ecologicalFlow.js'
	import portal from '@/api/portal.js'
	import req from '@/request.js'
	import dictUtils from '@/components/dict/DictSelectUtils.js'

	export default {
		name: 'deviceForm-dialog',
		props: {
			showFormDia: {
				type: Boolean,
				default: false
			},
			title: {
				type: String,
				default: ''
			},
			pId: {
				type: String,
				default: ''
			}
		},
		data() {
			return {
				params: {
					isNoteMsg: '0',
					gradeCode: null,
					gradeName: null,
					// rscd: null,
					// rsrd: null,
					stcd: null,
					fsltdz: null,
					// sstp: null
				},
				stzlxList: [],
				yjdjList: [],
				rsnms: [],
				stnms: [],
				rules: {
					stcd: [{
						required: true,
						message: '请选择关联测站',
						trigger: 'change'
					}],
					// rscd: [{
					// 	required: true,
					// 	message: '请选择水库名称',
					// 	trigger: 'change'
					// }],
					// sstp: [{
					// 	required: true,
					// 	message: '请选择生态站类型',
					// 	trigger: 'change'
					// }],
					fsltdz: [{
						required: true,
						message: '请输入生态流量核定值',
						trigger: 'blur'
					}],
					gradeCode: [{
						required: true,
						message: '请选择预警等级',
						trigger: 'blur'
					}],
					isNoteMsg: [{
						required: true,
						message: '请选择是否预警通知',
						trigger: 'blur'
					}],

				}
			}
		},
		created() {
			this.stzlxList = dictUtils.getDictItemsFromCache('czlb-stzlx')
			this.yjdjList = dictUtils.getDictItemsFromCache('yjdj')
			this.getFindAll()
			this.getStation()
			this.getDetailInfo()
		},
		methods: {
			getStation() {
				ecologicalFlow.staion({
					sttp: "SS"
				}, res => {
					if (res.state) {
						this.stnms = res.value
					}
				})
			},
			getFindAll() {
				ecologicalFlow.findAll({}, res => {
					if (res.state) {
						this.rsnms = res.value
					}
				})
			},
			// changeRsnm(val) {
			// 	this.rsnms.forEach(e => {
			// 		if (val == e.rscd) {
			// 			this.params.rsrd = e.rsrd
			// 		}
			// 	})
			// },
			changeYjdj(val) {
				this.yjdjList.forEach(e => {
					if (val == e.value) {
						this.params.gradeName = e.name
						console.log(this.params.gradeName);
					}
				})
			},
			changeregion(val) {
				if (val) {
					this.params.stcd = val[val.length - 1]
				} else {
					this.params.stcd = null
				}
			},
			// 根据ID查询
			getDetailInfo() {
				if (this.title === '修改') {
					ecologicalFlow.detailId(this.pId, res => {
						this.params = res.value
						this.params.gradeCode = String(res.value.gradeCode)
						// this.params.sstp = String(res.value.sstp)
						this.$set(this.params)
					})
				} else {
					this.params = {
						isNoteMsg: '0',
						gradeCode: null,
						gradeName: null,
						stcd: null,
						// rsrd: null,
						// rscd: null,
						fsltdz: null,
						// sstp: null
					}
				}
			},
			handleClose() {
				this.params = {
					isNoteMsg: '0',
					gradeCode: null,
					gradeName: null,
					stcd: null,
					// rsrd: null,
					// rscd: null,
					fsltdz: null,
					// sstp: null
				}
				this.$emit('closeFormDiao')
			},
			goInfo(e) {
				this.$refs.formInfo.validate(valid => {
					if (valid) {
						if (this.title === '新增') {
							ecologicalFlow.addSave(this.params, response => {
								if (response.state) {
									this.$notify({
										type: 'success',
										message: '新增成功',
										duration: 2000
										// offset: 80
									})
									this.$emit('closeFormDiao')
									this.$emit('refList')
								} else {}
							})
						}
						if (this.title === '修改') {
							// console.log(this.params.gradeCode);
							// console.log(this.params);
							let a=this.params.gradeCode
							this.yjdjList.forEach(e => {
								if (a == e.value) {
									console.log(e);
									this.params.gradeName = e.name
								}
							})
							
							console.log(this.params);
							// return
							ecologicalFlow.upData(this.params, response => {
								if (response.state) {
									this.$notify({
										type: 'success',
										message: '修改成功',
										duration: 2000
										// offset: 80
									})
									this.$emit('closeFormDiao')
									this.$emit('refList')
								} else {}
							})
						}
					} else {
						return false
					}
				})
			}
		}
	}
</script>
<style lang="scss" scoped>
	.el-divider--horizontal {
		margin: 24px 0 5px 0;
		height: 7px !important;
		background: #88b4dd !important;

		.el-divider__text {
			font-size: 16px !important;
		}
	}

	// ::v-deep .el-input__inner {
	//   border: 1px solid orange;
	// }
	// ::v-deep .el-textarea__inner {
	//   border: 1px solid orange;
	// }
</style>
