<template>
  <section class="Add">
    <ai-detail v-if="!id || isEdit==true">
      <template #title>
        <ai-title :title="params.id ? '编辑宅基地所有权登记' : '新增宅基地所有权登记'" :isShowBack="true" :isShowBottomBorder="true" @onBackClick="cancel(false)" />
      </template>
      <template #content>
        <ai-card title="合同信息">
          <template #right v-if="params.id">
            <span style="color:#2266FF;margin-left: 16px;cursor: pointer;font-size: 12px;" v-if="isEdit==true" @click="isEdit=false">取消</span>
            <span style="color:#2266FF;margin-left: 16px;cursor: pointer;font-size: 12px;" v-if="isEdit==true" @click="confirm()">保存</span>
          </template>
          <template #content>
            <el-form ref="form" :model="form" :rules="rules" size="small"  label-width="150px">
              <el-form-item label="每亩年租金" prop="unifiedCode">
                <el-input v-model="form.unifiedCode" placeholder="请输入宅基地使用证书号"></el-input>
              </el-form-item>
              <el-form-item label="土地流出方" prop="unifiedCode">
                <el-radio-group v-model="radioFrom">
                  <el-radio :label="1">企业组织</el-radio>
                  <el-radio :label="2">个人农户</el-radio>
                </el-radio-group>
              </el-form-item>

              <!-- <el-form-item label="所在地区" prop="unifiedCode">
                <ai-area-select v-model="areaId" provinceAction="/api/area/queryProvinceListContainCity" always-show clearable :instance="$request" :areaLevel="5" @fullname="(name) => (this.formJobWant.employmentAreaName = name)"></ai-area-select>
              </el-form-item> -->
            </el-form>
          </template>
        </ai-card>
      </template>
    </ai-detail>
  </section>
</template>

<script>
import {mapState} from 'vuex'
export default {
  name: "Add",
  props: {
    instance: Function,
    dict: Object,
    permissions: Function,
    params: Object,
  },
  data() {
    return { 
      id: '',
      form: {
        unifiedCode: '',
      },
      isEdit: false,
      radioFrom: ''
    }
  }, 
  computed: {
    rules() {
      return {
        unifiedCode: [{required: true, message: '请输入', trigger: 'blur'}]
      }
    },
    ...mapState(['user'])
  },
  created() {
    if (this.params && this.params.id) {
      this.id = this.params.id
      this.getDetail(this.params.id)
    }
  },
  method: {
    cancel(isRefresh) {
      this.$emit('change', {
        type: 'List',
        isRefresh: !!isRefresh,
      })
    },
    getDetail(id) {
      // this.instance.post(`/appcreditadminstrativelicense/queryDetailById?id=${id}`).then(res => {
      //   if (res.code === 0) {
      //     this.data = res.data
      //   }
      // })
    },
    confirm() {
      // this.$refs.form.validate((valid) => {
      //   if (valid) {
      //     this.instance.post(`/appcreditadminstrativelicense/addOrUpdate`, {
      //       ...this.forms,
      //       id: this.params.id || '',
      //     }).then(res => {
      //       if (res.code == 0) {
      //         this.$message.success('提交成功')
      //         setTimeout(() => {
      //           this.cancel(true)
      //         }, 600)
      //       }
      //     })
      //   }
      // })
    },
  },
}
</script>

<style>

</style>