<!--
  @description: 新增部门
  @author: change by sunxinman
  @routerPath: /systemManagement/addSectors
  @date: 2019/10/45-03:33
-->
<template>
  <div>
    <div class="title p0-16 clearfix">
      <div class="title-back pointer" @click="back">
        <i class="iconfont icon-fanhui mr10" />{{ show | formatText }}部门
      </div>
    </div>
    <section class="p0-16">
      <el-form ref="form" :model="formData" label-width="160px">
        <el-row :gutter="20">
          <el-col :span="12">
            <el-form-item ref="parentName" label="上级单位" prop="parentName">
              <el-input v-model="formData.parentName" placeholder="请输入" disabled />
            </el-form-item>
            <el-form-item ref="departname" label="机构名称" prop="departname">
              <el-input
                v-model="formData.departname"
                :disabled="inputDisabled"
                placeholder="请输入"
              />
            </el-form-item>
            <el-form-item ref="linkname" label="联系人" prop="linkname">
              <el-input v-model="formData.linkname" :disabled="inputDisabled" placeholder="请输入" />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item ref="orgType" label="机构类型" prop="orgType">
              <el-radio-group v-model="formData.orgType">
                <el-radio label="1" disabled>
                  公司
                </el-radio>
                <el-radio label="2">
                  部门
                </el-radio>
              </el-radio-group>
            </el-form-item>
            <el-form-item ref="orgCode" label="机构代码" prop="orgCode">
              <el-input v-model="formData.orgCode" :disabled="inputDisabled" placeholder="请输入" />
            </el-form-item>
            <el-form-item ref="linktel" label="联系电话" prop="linktel">
              <el-input v-model="formData.linktel" :disabled="inputDisabled" placeholder="请输入" />
            </el-form-item>
          </el-col>
          <el-col :span="24">
            <el-form-item
              ref="descr"
              label="机构描述"
              prop="descr"
              class="textarea"
              placeholder="请输入"
              style="width: 100%"
            >
              <el-input
                v-model="formData.descr"
                :disabled="inputDisabled"
                type="textarea"
                style="width: 100%"
              />
            </el-form-item>
          </el-col>
        </el-row>
        <div v-if="show!=='03'" class="but_footer">
          <div class="but_footer-h">
            <div class="but_footer-but">
              <el-button type="primary" @click="saveForm('form')">
                保 存
              </el-button>
              <el-button @click="back">
                返 回
              </el-button>
            </div>
          </div>
        </div>
      </el-form>
    </section>
  </div>
</template>
<script>
import { addDepart, refDepart } from '@/api/rolemanagment/organization'

export default {
  filters: {
    formatText(val) {
      let text = ''
      switch (val) {
        case '01':
          text = '新增'
          break
        case '02':
          text = '编辑'
          break
        case '03':
          text = '查看'
          break
      }
      return text
    }
  },
  data() {
    return {
      show: '', // 01新增 02编辑 03查看 控制是编辑还是增加
      formData: {
        id: '',
        departname: '', // 机构名称
        parentName: '', // 上级单位
        parentdepartid: '', // 上级单位id
        linkname: '', // 联系人
        orgCode: '', // 机构编码
        orgType: '2', // 机构类型
        linktel: '', // 联系电话
        descr: '' // 区域
      },
      inputDisabled: false
    }
  },
  created() {
    this.show = this.$route.query.isAddOrEdit
    this.formData.parentName = this.$route.query.parentName
    this.formData.parentdepartid = this.$route.query.id
  },
  mounted() {
    // this.show !== '01' 为编辑则调用初始化接口
    if (this.show !== '01') {
      this.refDepart()
    }
    // 查看
    if (this.show === '03') {
      this.inputDisabled = true
    }
  },
  methods: {
    // 新增部门
    saveForm() {
      // 新增
      if (this.show === '01') {
        this.formData.id = ''
      } else {
        // 编辑
        this.formData.id = this.$route.query.id
      }
      addDepart(this.formData).then(response => {
        this.$message.success(response.header.msg)
        this.$router.replace({
          path: '/systemManagement/organization'
        })
      })
    },
    // 编辑 回显数据
    refDepart() {
      const id = this.$route.query.id
      if (this.show !== '01') {
        refDepart(id).then(res => {
          this.formData = { ...res.data }
          this.formData.id = res.data.id
        }).catch(() => {
        })
      }
    },
    back() {
      this.$router.push('/systemManagement/organization')
    }
  }
}
</script>
<style lang="less" scoped>
</style>
