<template>
  <div>
    <el-dialog
      :title="title+'(取水户)'"
      :visible.sync="showFormDia"
      width="65%"
      :before-close="handleClose"
    >
          <el-form
            ref="formInfo"
        :rules="rules"
            :model="params"
            label-width="150px"
          >
            <el-row>
              <el-col :span="11">
                <el-form-item label="取水户编码：" prop="waterCode">
                  <el-input
                    size="mini"
                    clearable
                    placeholder="请输入取水户编码"
                    v-model="params.waterCode"
                  ></el-input>
                </el-form-item>
              </el-col>
              <el-col :span="11">
                <el-form-item label="取水户名称：" prop="waterName">
                  <el-input
                    size="mini"
                    placeholder="请输入取水户名称"
					clearable
                    v-model="params.waterName"
                    maxlength="18"
                  ></el-input>
                </el-form-item>
              </el-col>
             
            </el-row>
			<el-row>
				<el-col :span="11">
					<el-form-item label="重点监控：">
						<el-radio-group v-model="params.isImportant">
						  <el-radio :label="1">是</el-radio>
						  <el-radio :label="0">否</el-radio>
						</el-radio-group>
					</el-form-item>
				</el-col>
				<el-col :span="11">
					<el-form-item label="监控级别：" prop="">
					  <el-select
					    style="width: 100%"
					    size="mini"
					    v-model="params.monitorLevel"
					    clearable
					    placeholder="请选择监控级别"
					  >
					    <el-option
					      v-for="item in monitorLevels"
					      :key="item.id"
					      :label="item.name"
					      :value="item.value"
					    ></el-option>
					  </el-select>
					</el-form-item>
				</el-col>
			</el-row>
			<el-row>
				<el-col :span="22">
				  <el-form-item label="行政区划：" prop="addvcd">
					<el-cascader
					filterable
					size="mini"
					  style="width: 100%"
                    :show-all-levels="false"
					  :options="addvcds"
					  v-model="params.addvcd"
					  :props="{value: 'code', label: 'name', children: 'children'}"
					  @change="onhouChange"
					  placeholder="请选择所属行政区"
					  clearable
					></el-cascader>
				  </el-form-item>
				  
				</el-col>
			</el-row>
			<el-row>
				<el-col :span="11">
					<el-form-item label="行业类别：" prop="">
					  <el-input
					  clearable
					    size="mini"
					    placeholder="请输入行业类别"
					    v-model="params.industryType"
					    maxlength="18"
					  ></el-input>
					</el-form-item>
				</el-col>
				<el-col :span="11">
					<el-form-item label="法人代表：" prop="">
					  <el-input
					    size="mini"
					    placeholder="请输入法人代表"
					    v-model="params.waterLeader"
						clearable
					  ></el-input>
					</el-form-item>
				</el-col>
				
			</el-row>
			<el-row>
				<el-col :span="11">
					<el-form-item label="取水类型：" prop="">
					  <el-select
					    style="width: 100%"
					    size="mini"
					    v-model="params.waterType"
					    clearable
					    placeholder="请选择取水类型"
					  >
					    <el-option
					      v-for="item in waterTypes"
					      :key="item.id"
					      :label="item.name"
					      :value="item.value"
					    ></el-option>
					  </el-select>
					</el-form-item>
				</el-col>
				<el-col :span="11">
					<el-form-item label="办公电话：" prop="">
					  <el-input
					    size="mini"
						oninput="value=value.replace(/[^\d]/g,'')"
					    placeholder="请输入办公电话"
					    v-model="params.officeTel"
						clearable
					    maxlength="11"
					  ></el-input>
					</el-form-item>
				</el-col>
			</el-row>
			<el-row>
				<el-col :span="11">
					<el-form-item label="经度：" prop="">
					  <el-input
					    size="mini"
						 @input="deadLevs('1')"
					    placeholder="请输入经度"
					    v-model="params.lgtd"
						clearable
					    maxlength="11"
					  ></el-input>
					</el-form-item>
				</el-col>
				<el-col :span="11">
					<el-form-item label="纬度：" prop="">
					  <el-input
					    size="mini"
						 @input="deadLevs('2')"
					    placeholder="请输入纬度"
					    v-model="params.lttd"
						clearable
					    maxlength="11"
					  ></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 {mapState} from 'vuex'
import waterCompany from '@/api/waterCompany.js'
import latitude from '@/mixins/latitude'
import req from '@/request.js'
export default {
  name: 'FormDialog',
  props: {
    showFormDia: {
      type: Boolean,
      default: false,
    },
    title: {
      type: String,
      default: '',
    },
    pId: {
      type: String,
      default: '',
    },
  },
  data() {
    return {
     params:{
		 addvcd:null,//行政区划编码
		 industryType:null,//行业类别
		 isImportant:0,//重点监控
		 monitorLevel:null,//监控级别
		 monthIntake:null,//月取水量（万m³）
		 officeTel:null,//办公电话
		 waterCode:null,//取水户编码
		 waterIntake:null,//年取水量
		 waterLeader:null,//法人代表
		 waterName:null,//取水户名称
		 waterType:null,//取水类型
		 yearPlan:null,//年计划量（万m³）
		 id:null,
	 },
	 addvcds:[],//行政区划列表
	 monitorLevels:[],//监控级别列表
	 waterTypes:[],
	 rules: {
	   waterCode: [
	     {
	       required: true,
	       message: '请输入取水户编码',
	       trigger: 'blur',
	     },
	   ],
	   waterName: [
	     {
	       required: true,
	       message: '请输入取水户名称',
	       trigger: 'blur',
	     },
	   ],
	   addvcd:[
		    {
	       required: true,
	       message: '请选择行政区划',
	       trigger: 'blur',
	     },
	   ]
	 },
    }
  },
  created() {
    this.getDetailInfo()
    this.getSysDict()
    // 行政区查询
    waterCompany.getbasAdName({}, (res) => {
      this.addvcds = res.value
      console.log(this.addvcds)
    })
    // 河流下拉
    waterCompany.getParentIds({}, (res) => {
      this.parentIds = res.value
      console.log(this.parentIds)
    })
    // 乡镇信息区划
    waterCompany.getAreaIds({}, (res) => {
      this.areaIds = res.value
    })
  },
  methods: {
	deadLevs(val) {
	  switch (val) {
	    case '1':
	      this.params.lgtd = latitude.TreeFour(this.params.lgtd)
	      break
	    case '2':
	      this.params.lttd = latitude.TreeFour(this.params.lttd)
	      break
	   
	  }
	},
	onhouChange(val) { 
		console.log(val[val.length-1]);
		
	 
	  this.params.addvcd = val[val.length-1]
	},
	//取消
	handleClose() {
	  this.params = {
	   addvcd:null,//行政区划编码
	   industryType:null,//行业类别
	   isImportant:0,//重点监控
	   monitorLevel:null,//监控级别
	   monthIntake:null,//月取水量（万m³）
	   officeTel:null,//办公电话
	   waterCode:null,//取水户编码
	   waterIntake:null,//年取水量
	   waterLeader:null,//法人代表
	   waterName:null,//取水户名称
	   waterType:null,//取水类型
	   yearPlan:null,//年计划量（万m³）
	  }
	  this.$emit('closeFormDiao')
	},

    // 根据ID查询
    getDetailInfo() {
      if (this.title === '修改') {
		   waterCompany.getbasAdName({}, (res) => {
			   this.addvcds = res.value;
			   waterCompany.detailId(this.pId, (res) => {
				  if(res.state) {
					  this.params.addvcd = res.value.addvcd
					  this.params.industryType=res.value.industryType
					  this.params.isImportant=res.value.isImportant
					  this.params.monitorLevel=res.value.monitorLevel
					  this.params.monthIntake=res.value.monthIntake
					  this.params.officeTel=res.value.officeTel
					  this.params.waterCode=res.value.waterCode
					  this.params.waterIntake=res.value.waterIntake
					  this.params.waterLeader=res.value.waterLeader
					  this.params.waterName=res.value.waterName
					  this.params.waterType=res.value.waterType
					  this.params.yearPlan=res.value.yearPlan
					  this.params.lgtd=res.value.lgtd 
					  this.params.lttd=res.value.lttd
					  this.params.id=res.value.id
				  }
			   })
		   })
  
   
      } else {
		  
      }
    },
    
    goInfo(e) {
      this.$refs.formInfo.validate((valid) => {
        if (valid) {
          if (this.title === '新增') {
            let arr = JSON.parse(JSON.stringify(this.params))
            waterCompany.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);
            waterCompany.upData(this.params, (response) => {
              if (response.state) {
                this.$notify({
                  type: 'success',
                  message: '修改成功',
                  duration: 2000,
                })
                this.$emit('closeFormDiao')
                this.$emit('refList')
            } else {
            }
            })
          }
        } else {
          return false
        }
      })
    },
    //获取字典数据
    getSysDict() {
      let portal = window.context.portal
      return new Promise((resolve, reject) => {
        req.post(portal + '/sys/sysDictionary/v1/queryAllDictItems').then(
          (response) => {
            resolve(response.data)
			console.log(response.data);
			this.monitorLevels=response.data.jkjb
			this.waterTypes=response.data.qslx
          },
          (error) => {
            reject(error)
          }
        )
      })
    },
    getRowKey(row) {
      return row.id
    },
  },
}
</script>
<style lang="scss" scoped>
.redBull {
  border: 1px solid red;
}
</style>
