<template>
  <div class="app-content" style="max-height:450px;overflow:auto;">
    <a-spin :spinning="loading" style="width: 100%;height: 100%;">
      <a-form-model ref="form" :model="formData" :rules="rules" class="from-table">
        <a-row>
          <a-col :span="24">
            <div class="tb-title">
              <span>单位信息</span>
            </div>
          </a-col>
        </a-row>
        <a-row>
          <a-col :span="4" class="bg-gray">
            <div class="required">单位名称</div>
          </a-col>
          <a-col :span="20">
            <a-form-model-item prop="unitName">
              <a-input v-model="formData.unitName" placeholder="单位名称" style="width:400px" />
            </a-form-model-item>
          </a-col>
        </a-row>
        <a-row>
          <a-col :span="4" class="bg-gray">
            <div class="required">单位类型</div>
          </a-col>
          <a-col :span="20">
            <a-form-model-item prop="unitType">
              <base-select v-model="formData.unitType" :type="6" :isAll="true" />
            </a-form-model-item>
          </a-col>
        </a-row>
        <a-row>
          <a-col :span="4" class="bg-gray">
            <div class="required">单位性质</div>
          </a-col>
          <a-col :span="20">
            <a-form-model-item prop="unitNature">
              <para-select v-model="formData.unitNature" :typeId="58" :isAll="true" :width="180" />
            </a-form-model-item>
          </a-col>
        </a-row>
        <a-row>
          <a-col :span="4" class="bg-gray">
            <div class="required">单位地址</div>
          </a-col>
          <a-col :span="20">
            <a-form-model-item prop="unitAddress">
              <a-input v-model="formData.unitAddress" :maxLength="30" style="width:400px" />
            </a-form-model-item>
          </a-col>
        </a-row>
        <div v-if="managersState">
          <manager-add :managers.sync="formData.managers" />
        </div>
      </a-form-model>
    </a-spin>
  </div>
</template>

<script>
import { isEmptyParams } from "@/views/utils/common"
import unitTreeSelect from '@/views/components/common/unitTreeSelect'
import managerAdd from './managerAdd.vue'

export default {
  name: "unitEdit",
  components: {
     unitTreeSelect, managerAdd
  },
  data () {
    return {
      formData: {
        id: null, unitName: null, unitType: null, unitNature: null, unitAddress: null, managers: [{ personName: null, certId: null, mobile: null, username: null, password: null }],
      },
      rules: {
        unitName: [{ required: true, message: '请输入单位名称' }],
        unitType: [{ required: true, message: '请选择单位类型' }],
        unitNature: [{ required: true, message: '请选择单位性质' }],
        unitAddress: [{ required: true, message: '请输入单位地址' }],
      },
      managersState: true,
      loading: false
    }
  },
  props: {
    value: {
      type: String,
      default: () => {
        return null
      }
    },
  },
  created () {
    if (this.value) {
      this.loading = true
      this.getUnitById()
      this.managersState = false
    }
  },
  methods: {
    getUnitById () {
      let pars = { id: this.value }
      this.$api.unit.getUnitById(pars).then(({ data = {} }) => {
        if (data) {
          this.formData.id = data.id
          this.formData.unitName = data.unitName
          this.formData.unitType = data.unitType + ''
          this.formData.unitNature = data.unitNature
          this.formData.unitAddress = data.unitAddress
        }
        this.loading = false
      }).catch(() => { this.loading = false })
    },
    submit () {
      if (this.formData.managers.length == 0) {
        this.$message.warn('至少添加一位单位管理员！')
        return
      }
      //提交单位数据
      this.$refs.form.validate(valid => {
        if (valid) {
          this.loading = true
          let pars = isEmptyParams(this.formData)
          let par = { ...pars }
          if (!this.value) {
            this.$api.unit.addUnit(par).then(({ data = {} }) => {
              if (data) {
                this.$message.success('添加成功！')
                this.$emit('close', 'edit')
              }
              this.loading = false
            }).catch(() => { this.loading = false })
          }
          else {
            this.$api.unit.updateUnit(par).then(({ data = {} }) => {
              if (data) {
                this.$message.success('修改成功！')
                this.$emit('close', 'edit')
              }
            }).catch(() => { this.loading = false })
          }
        }
      })
    }
  }
}
</script>