<template>
  <div v-loading="loading">
    <el-form ref="ruleForm" :model="ruleForm" :rules="rules" label-width="150px" class>
      <el-form-item label="父级分类" prop="parentids">
        <el-cascader
          v-model="parentids"
          :options="typeDropDatas"
          :props="props"
          placeholder="请选择父级分类,默认是顶级分类"
          clearable
          filterable
          change-on-select
          :disabled="addEditJudgment"
          style="width: 100%;"
        />
      </el-form-item>
      <el-form-item label="分类名称" prop="deptname">
        <el-input v-model="ruleForm.deptname" placeholder="请输入分类名称" />
      </el-form-item>
      <!-- <el-form-item v-if="addEditLock" label="是否锁定:" prop="islock" >
        <el-radio-group v-model="ruleForm.islock">
          <el-radio label="0">否</el-radio>
          <el-radio label="1">是</el-radio>
        </el-radio-group>
      </el-form-item>-->
      <el-form-item label="任务额" prop="targetmoney">
        <el-input v-model.number="ruleForm.targetmoney" maxlength="20" placeholder="请输入任务额" />
      </el-form-item>
      <!-- <el-form-item label="排列序号" prop="sort">
        <el-input v-model.number="ruleForm.sort" maxlength="20" placeholder="请输入排列序号"/>
      </el-form-item>-->
      <el-form-item>
        <el-button type="primary" @click="submitForm">保存</el-button>
      </el-form-item>
    </el-form>
  </div>
</template>

<script>
import { getTreeList, addType, editType, getTypeDetail } from '@/api/systemSetup/roleSetting/department'
export default {
  name: 'AddOrEditKnowledge',
  props: {
    rowid: {
      type: String,
      default: ''
    },
    layerid: {
      type: String,
      default: ''
    }
  },
  data () {
    return {
      loading: false,
      parentids: [],
      ruleForm: {
        parentid: '', // 父节点id
        deptid: '', // 当前节点id
        // sort: '', // 序号
        deptname: '', // 分类名称
        // islock: '', //是否锁定
        targetmoney: '', //任务额
      },
      rules: {
        sort: [
          { required: true, message: '排列序号不能为空' },
          { type: 'number', message: '排列序号必须为数字' }
        ],
        deptname: [
          { required: true, message: '分类名称不能为空' }
        ],
        targetmoney: [
          { type: 'number', message: '任务额必须为数字' }
        ]

      },
      typeDropDatas: [], // 下拉分类
      // 自定义菜单下拉数据的key值
      props: {
        value: 'id',
        label: 'text'
      },
      addEditJudgment: false, // 添加flase 编辑true
      addEditLock: true, //添加true 编辑false
    }
  },
  created () {
    this.getTypeDrop().then(() => {
      if (this.rowid) {
        this.addEditJudgment = true
        this.addEditLock = false
        this.ruleForm.deptid = this.rowid
        this.getTypeDetails(this.rowid)
      }
    })
  },
  methods: {
    // 获取分类下拉
    getTypeDrop () {
      return new Promise(resolve => {
        getTreeList().then(response => {
          if (response.state.toLowerCase() === 'success') {
            this.typeDropDatas = response.data
          }
        })
        resolve()
      })
    },
    // 获取菜单详情
    getTypeDetails (rid) {
      getTypeDetail(rid).then(response => {
        if (response.state.toLowerCase() === 'success') {
          const res = response.data.model
          this.ruleForm.deptname = res.F_DeptName // 分类名称
          // this.ruleForm.sort = res.F_Sort // 排序
          // this.ruleForm.islock = res.F_Lock + '' // 排序
          this.ruleForm.targetmoney = res.F_TargetMoney // 排序
          this.ruleForm.parentid = res.F_ParentId // 父节点id
          const len = response.data.levelid.length
          const levelid = response.data.levelid
          levelid.splice(len - 1, 1)
          this.parentids = levelid
        }
      })
    },
    submitForm () {
      this.$refs.ruleForm.validate((valid) => {
        if (valid) {
          this.loading = true
          if (!this.rowid) {
            // 添加
            this.ruleForm.parentid = this.parentids[this.parentids.length - 1]
            addType(this.ruleForm).then(response => {
              this.loading = false
              if (response.state.toLowerCase() === 'success') {
                this.$parent.$layer.close(this.layerid)
                this.$parent.getDepList() // 重新加载父级数据
                this.$message.success('恭喜你，添加成功!')
              }
            }).catch(() => {
              this.loading = false
            })
            return
          }
          // 编辑
          editType(this.ruleForm).then(response => {
            this.loading = false
            if (response.state.toLowerCase() === 'success') {
              this.$parent.treeclickId = 0;
              this.$parent.$layer.close(this.layerid)
              this.$parent.getDepList() // 重新加载父级数据
              this.$message.success('恭喜你，编辑成功!')
            }
          }).catch(() => {
            this.loading = false
          })
        } else {
          this.$message.error('请输入有效的必填项信息!')
          return false
        }
      })
    }
  }
}
</script>

<style lang="scss" scoped></style>

