<template>
  <div class='slxx'>
    <el-form :model="ruleForm" :rules="rules" ref="ruleForm" label-width="100px">
      <div class="slxx_title">受理信息</div>
      <el-row>
        <el-col :span="8">
          <el-form-item label="业务号：" prop="ywh">
            <el-input v-model="ruleForm.ywh"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="受理人员：" prop="slry">
            <el-input v-model="ruleForm.slry"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="受理时间：" prop="slsj">
            <el-input v-model="ruleForm.slsj"></el-input>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="8">
          <el-form-item label="权利类型：" prop="qllx">
            <el-select v-model="ruleForm.qllx" filterable clearable placeholder="请选择权利类型">
              <el-option v-for="item in qllxOption" :key="item.value" :label="item.label" :value="item.value">
              </el-option>
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="登记类型：" prop="djlx">
            <el-select v-model="ruleForm.djlx" filterable clearable placeholder="请选择登记类型">
              <el-option v-for="item in djlxOption" :key="item.value" :label="item.label" :value="item.value">
              </el-option>
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="登记情形：" prop="djqx">
            <el-select v-model="ruleForm.djqx" filterable clearable placeholder="请选择登记情形">
              <el-option v-for="item in djqxOption" :key="item.value" :label="item.label" :value="item.value">
              </el-option>
            </el-select>
          </el-form-item>
        </el-col>
      </el-row>
      <div class="slxx_title">不动产单元情况</div>
      <el-row>
        <el-col :span="8">
          <el-form-item label="宗地代码：" prop="zddm">
            <el-input v-model="ruleForm.zddm"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="不动产单元号：" prop="bdcdyh">
            <el-input v-model="ruleForm.bdcdyh"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="权利性质：" prop="qlxz">
            <el-select v-model="ruleForm.qlxz" filterable clearable placeholder="请选择登记情形">
              <el-option v-for="item in qlxzOption" :key="item.value" :label="item.label" :value="item.value">
              </el-option>
            </el-select>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="8">
          <el-form-item label="宗地面积：" prop="zdmj">
            <el-input v-model="ruleForm.zdmj"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="16">
          <el-form-item label="坐落：" prop="zl">
            <el-input v-model="ruleForm.zl"></el-input>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="8">
          <el-form-item label="土地用途：" prop="tdyt">
            <el-select v-model="ruleForm.tdyt" filterable clearable placeholder="请选择登记情形">
              <el-option v-for="item in tdytOption" :key="item.value" :label="item.label" :value="item.value">
              </el-option>
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="权利设定方式：" prop="qlsdfs">
            <el-select v-model="ruleForm.qlsdfs" filterable clearable placeholder="请选择登记情形">
              <el-option v-for="item in qlsdfsOption" :key="item.value" :label="item.label" :value="item.value">
              </el-option>
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="取得价格：" prop="qdjg">
            <el-input v-model="ruleForm.qdjg"></el-input>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="8">
          <el-form-item label="使用权起始时间：" prop="syqqssj">
            <el-date-picker v-model="ruleForm.syqqssj" type="datetime" placeholder="选择起始时间"
            value-format="yyyy-MM-dd" >
          </el-date-picker>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="使用权结束时间：" prop="syqjssj">
            <el-date-picker v-model="ruleForm.syqjssj" type="datetime" placeholder="选择结束时间"
            value-format="yyyy-MM-dd" >
          </el-date-picker>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="使用期限：" prop="syqx">
            <el-date-picker v-model="ruleForm.syqx" type="datetime" placeholder="选择使用期限"
            value-format="yyyy-MM-dd" >
          </el-date-picker>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col>
          <el-form-item label="附记：" prop="fj">
            <el-input type="textarea" v-model="ruleForm.fj"></el-input>
          </el-form-item>
        </el-col>
      </el-row>
      <div class="slxx_title">权利人信息</div>
      <el-row>
        <el-col>
          <el-form-item label="共有方式：">
            <el-radio-group v-model="ruleForm.gyfs">
              <el-radio label="单独所有"></el-radio>
              <el-radio label="共同共有"></el-radio>
              <el-radio label="按份所有"></el-radio>
            </el-radio-group>
          </el-form-item>
        </el-col>
        <el-col>
           <InformationTable   />
        </el-col>
      </el-row>
      <div class="slxx_title">登记原因</div>
      <el-row>
        <el-col>
          <el-form-item label="登记原因：" prop="djyy">
            <el-input type="textarea" v-model="ruleForm.djyy"></el-input>
          </el-form-item>
        </el-col>
      </el-row>
    </el-form>
  </div>
</template>
<script>
import InformationTable from './InformationTable'
export default {
  /**注册组件*/
  components: {},
  data () {
    return {
      qllxOption:[],
      djlxOption:[],
      djqxOption:[],
      qlxzOption:[],
      tdytOption:[],
      qlsdfsOption:[],
      ruleForm: {
        ywh: '',
        slry:"",
        slsj:"",
        qllx:"",
        djlx:"",
        djqx:"",
        zddm:"",
        bdcdyh:"",
        qlxz:"",
        zdmj:"",
        zl:"",
        tdyt:"",
        qlsdfs:"",
        qdjg:"",
        syqqssj:"",
        syqjssj:"",
        syqx:"",
        fj:"",
        djyy:"",
        gyfs:"",
      },
      rules: {
        ywh: [
          { required: true, message: '业务号', trigger: 'blur' }
        ],
      }
    };
  },
  components:{
    InformationTable
  },
  methods: {

  },
}
</script>
<style scoped lang='scss'>
.slxx_title {
  border-bottom: 1px solid $borderColor;
  padding-left: 10px;
  padding-bottom: 15px;
  margin-bottom: 15px;
}
</style>