<template>
  <div>
    <el-form :model="formData" style="width: 100%;" ref="dataForm" :rules="formRules"
             label-width="auto"
    >
      <el-row :gutter="24" class="el-row">
        <el-col :span="12" class="el-col">
          <el-form-item label="区域编号:" prop="mac" class="query-form-item">
            <el-input
              :disabled="type == 2"
              v-model="formData.regionCode" style="width: 80%"
              auto-complete="off"
              placeholder="请输入区域编号"
            ></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="12" class="el-col">
          <el-form-item label="区域名称:" prop="remark" class="query-form-item">
            <el-input
              v-model="formData.regionName" style="width: 80%"
              auto-complete="off"
              placeholder="请输入区域名称"
            ></el-input>
          </el-form-item>
        </el-col>
      </el-row>


    </el-form>
    <div slot="footer" class="dialog-footer" style="margin-top: 50px">
      <el-button @click.native="hideForm">取消</el-button>
      <el-button
        type="primary"
        @click.native="formSubmit()"
      >提交
      </el-button
      >
    </div>
  </div>
</template>

<script>


import { addRegion, editRegion } from '@/api/basic/workPlace/regionManage'
import { isBlank } from '@/utils/strUtil'

export default {
  props: {
    closeDialog: {
      type: Function,
      required: true
    },
    rowData: {
      type: Object,
      required: true
    },
    type: {
      type: Object,
      required: true
    }
  },
  data() {
    return {
      formData: {
        regionCode: null,
        regionName: ''
      }
    }
  },
  methods: {
    formSubmit() {
      if (isBlank(this.formData.regionCode) || isBlank(this.formData.regionName)) {
        return this.$message.error('区域编码或区域名称为空')
      }
      if (this.type == 2) {
        editRegion(this.formData).then(res => {
          if (res.code == 20000) {
            this.$message.success('修改成功')
            this.closeDialog()
          } else {
            this.closeDialog()
            return this.$message.error(res.message)
          }
        })
      } else {
        addRegion(this.formData).then(res => {
          if (res.code == 20000) {
            this.$message.success('新增成功')
            this.closeDialog()
          } else {
            this.closeDialog()
            return this.$message.error(res.message)
          }
        })
      }

    },
    hideForm() {
      this.closeDialog()
    }
  },
  created() {
    if (this.type == 2) {
      this.formData = this.rowData
    } else {
      this.formData = {
        regionCode: null,
        regionName: ''
      }
    }
  }

}
</script>

<style scoped>
.dialog-footer {
  display: flex;
  justify-content: center;
}
</style>
