<!--
  @description: 数据字典-字典编辑录入
  @Modifier: haofengxian
  @routerPath:
  @date: 2020-7-31-11:15
-->
<template>
  <el-dialog
    :title="textMap[dialogStatus]"
    :visible.sync="dialogFormVisible"
    :close-on-click-modal="false"
    width="500px"
  >
    <el-form
      ref="dataForm"
      :rules="dictionaryRules"
      :model="dictionaryData"
      label-width="98px"
      style="width: 400px; margin-left:50px;"
    >
      <el-form-item label="编码" prop="typegroupcode">
        <el-input v-model="dictionaryData.typegroupcode" />
      </el-form-item>
      <el-form-item label="名称" prop="typegroupname">
        <el-input v-model="dictionaryData.typegroupname" />
      </el-form-item>
    </el-form>
    <div slot="footer" class="dialog-footer">
      <el-button v-if="dialogStatus==='create'" type="primary" @click="createData">
        确 定
      </el-button>
      <el-button v-else type="primary" @click="updateData">
        确 定
      </el-button>
      <el-button @click="dialogFormVisible = false">
        取 消
      </el-button>
    </div>
  </el-dialog>
</template>

<script>
// 接口
import { saveTypeGroup, updateTypeGroup } from '@api/common/tools'
import { cloneObject } from '@/assets/js/utils' // 深拷贝
export default {
  name: 'DictionaryEdit',
  data() {
    return {
      dialogFormVisible: false, // 字典分类录入弹框是否打开
      dialogStatus: '', // 新增/编辑状态
      // dialog title显示
      textMap: {
        update: '编辑',
        create: '字典分类录入'
      },
      // 字典分类录入数据
      dictionaryData: {
        typegroupcode: '', // 字典Code
        typegroupname: '' // 字典名称
      },
      dictionaryRules: { // 字典分类录入校验
        typegroupname: [{ required: true, message: '名字范围在2~8位字符', trigger: 'blur' }],
        typegroupcode: [{ required: true, message: '编码范围在2~8位字符', trigger: 'blur' }]
      }
    }
  },
  methods: {
    // 打开字典编辑
    openDictionaryEdit(dialogStatus, row) {
      this.dialogStatus = dialogStatus
      // dialogStatus为新增 清空初始化表单
      if (dialogStatus === 'create') {
        // 清空
        Object.keys(this.dictionaryData).forEach((val, inx) => {
          this.dictionaryData[val] = ''
        })
        this.$nextTick(() => {
          this.$refs['dataForm'].clearValidate()
        })
      } else {
        // 修改
        this.dictionaryData = cloneObject(row)
      }
      this.dialogFormVisible = true
    },
    // 字典分类录入确定-保存
    createData() {
      saveTypeGroup(this.dictionaryData).then(res => {
        this.$message.success(res.header.msg)
        this.$emit('typeGroupLoadData') // 获取列表数据
        this.dialogFormVisible = false
      }).catch(() => {
      })
    },
    // 字典分类录入确定-修改
    updateData() {
      updateTypeGroup(this.dictionaryData).then(res => {
        this.$message.success(res.header.msg)
        this.$emit('typeGroupLoadData') // 获取列表数据
        this.dialogFormVisible = false
      }).catch(() => {
      })
    }
  }
}
</script>

<style scoped>

</style>
