<template>
  <div>
    <el-dialog
      :titles="titles"
      :visible.sync="showFormDias"
      width="75%"
      :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="name">
              <el-input
                size="small"
                clearable
                placeholder="请输入组织名称"
                v-model="params.name"
              ></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="所属行政区：" prop="areaCode">
              <el-cascader
                :show-all-levels="false"
                style="width: 100%"
                :options="basAdNames"
                v-model="params.areaCode"
                :props="{value: 'code', label: 'name', children: 'children'}"
                @change="onhouChange"
                placeholder="请选择所属行政区"
                clearable
              ></el-cascader>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="部门职责：" prop="responsibilities">
              <el-input
                size="small"
                style="width: 100%"
                placeholder="请输入部门职责"
                v-model="params.responsibilities"
              ></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="8">
            <el-form-item label="组织编码：" prop="code">
              <el-input
                size="small"
                maxlength="18"
                placeholder="请输入组织编码"
                v-model="params.code"
              ></el-input>
            </el-form-item>
          </el-col>
          <el-col v-if="this.titles != '新增一级组织'" :span="8">
            <el-form-item label="上级组织：" prop="parentId">
              <el-input
                v-model="orgName"
                :disabled="showParentId"
              />
              <!-- <el-cascader
                v-if="!showParentId"
                :show-all-levels="false"
                style="width: 100%"
                :options="parentIds"
                v-model="params.parentId"
                :props="{value: 'id', label: 'name', children: 'children'}"
                @change="onparentIds"
                placeholder="请选择上级组织"
                clearable
              ></el-cascader> -->
            </el-form-item>
          </el-col>
        </el-row>
        <el-form-item label="备注：" prop="note">
          <el-input
            type="textarea"
            :autosize="{minRows: 3, maxRows: 4}"
            placeholder="请输入内容"
            v-model="params.note"
          >
          </el-input>
        </el-form-item>
      </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 orgPerson from '@/api/orgPerson.js'
import req from '@/request.js'
// import { addCodeInfo,getCodeInfoById,editCodeInfo } from "@/api/cold-chain-info";
export default {
  name: 'FormDialog',
  props: {
    showFormDias: {
      type: Boolean,
      default: false,
    },
    titles: {
      type: String,
      default: '',
    },
    pId: {
      type: String,
      default: '',
    },
  },
  data() {
    return {
      params: {
        areaCode: '', //组织所属行政区划代码
        code: '', //组织编码
        name: '', //组织名称
        note: '',
        parentId: '', //父级_ID
        responsibilities: '', //部门职责
        areaName: '',
      },
      orgName: '',
      showParentId: true,
      parentIds: [], //组织树数组
      basAdNames: [], //行政下拉
      parentIdAll: null, //接受每次选中的值
      AdName: null, //接受每次选中的值
      rules: {
        name: [
          {
            required: true,
            message: '请输入组织名称',
            trigger: 'blur',
          },
        ],
        code: [{required: true, message: '请输入组织代码', trigger: 'blur'}],
      },
    }
  },
  created() {
    this.getDetailInfo()
    this.getId()
    // 行政区查询
    orgPerson.getbasAdName({}, (res) => {
      this.basAdNames = res.value
    })
  },
  methods: {
    // 根据ID查询
    getDetailInfo() {
      if (this.titles === '新增组织') {
        orgPerson.getPerson({}, (res) => {
          this.parentIds = res.value
        })
      }
    },

    calleArr2(array, val) {
      for (let i in array) {
        let item = array[i]
        console.log(item.id,val)
        if (item.id == val) {
          this.orgName = item.name
        } else {
          this.calleArr2(item.children, val) //自己调用自己
        }
      }
    },
    getId() {
      // 组织树查询
      if (this.titles === '新增组织') {
        orgPerson.detailId(this.pId, (res) => {
          if (res.state) {
            this.params.parentId = res.value.id;
            this.calleArr2(this.parentIds, res.value.id)
          }
        })
      }
    },

    onparentIds(val) {
      if (val) {
        this.params.parentId = val[val.length - 1]
      }
    },
    onhouChange(val) {
      if (val) {
        this.params.areaCode = val[val.length - 1]
        let arr = this.basAdNames.filter((ite) => ite.code === val[0])
        this.calleArr(arr, val[val.length - 1])
      }
    },
    calleArr(array, val) {
      for (let i in array) {
        let item = array[i]
        if (item.children) {
          this.calleArr(item.children, val) //自己调用自己
        } else {
          if (item.code === val) {
            this.params.areaName = item.fullName
          }
        }
      }
    },
    handleClose() {
      this.params = {
        areaCode: '', //组织所属行政区划代码
        code: '', //组织编码
        name: '', //组织名称
        note: '',
        parentId: '', //父级_ID
        responsibilities: '', //部门职责
      }
      this.$emit('closeFormDiaos')
    },
    goInfo(e) {
      this.$refs.formInfo.validate((valid) => {
        if (valid) {
          if (this.titles === '新增组织') {
            orgPerson.addSave(this.params, (response) => {
              if (response.state) {
                this.$notify({
                  type: 'success',
                  message: '新增成功',
                  duration: 2000,
                  // offset: 80
                })
                this.$emit('closeFormDiaos')
                this.$emit('refList')
              } else {
                this.$message.success(response.message)
              }
              // this.$emit('closeFormDiao')
              // this.$router.go(-1)
            })
          }
          if (this.titles === '新增一级组织') {
            delete this.params['parentId']
            orgPerson.addSave(this.params, (response) => {
              if (response.state) {
                this.$notify({
                  type: 'success',
                  message: '新增成功',
                  duration: 2000,
                  // offset: 80
                })
                this.$emit('closeFormDiaos')
                this.$emit('refList')
              } else {
                this.$message.success(response.message)
              }
            })
          }
        } else {
          return false
        }
      })
    },
  },
}
</script>
<style lang="scss" scoped>
// ::v-deep .el-input__inner {
//   border: 1px solid orange;
// }
// ::v-deep .el-textarea__inner {
//   border: 1px solid orange;
// }
</style>
