<template>
  <div class="parcelBaseInfo itemForm">
    <el-form :model="ruleForm" :rules="rules" ref="formList" label-width="120px" :key="key">
      <el-row>
        <el-col :span="8">
          <el-form-item class="borderTopNone">
            <span slot="label">
              标识码： <br />
              <p class="label-detail">（BSM）</p>
            </span>
            <p :class="{ 'disabled': $store.state.business.Edit }">
              {{ ruleForm.BSM }}
            </p>
          </el-form-item>
        </el-col>

        <el-col :span="8">
          <el-form-item prop="YSDM" class="borderTopNone">
            <span slot="label">
              要素代码： <br />
              <p class="label-detail">（YSDM）</p>
            </span>
            <el-input :disabled="$store.state.business.Edit" v-model="ruleForm.YSDM" placeholder="要素代码"></el-input>
          </el-form-item>
        </el-col>

        <el-col :span="8">
          <el-form-item prop="ZDDM" class="borderTopNone">
            <span slot="label">
              宗地代码： <br />
              <p class="label-detail">（ZDDM）</p>
            </span>
            <el-input :disabled="$store.state.business.Edit" v-model="ruleForm.ZDDM" placeholder="宗地代码"></el-input>
          </el-form-item>
        </el-col>
      </el-row>

      <el-row>
        <el-col :span="8">
          <el-form-item prop="BDCDYH">
            <span slot="label">
              不动产单元号： <br />
              <p class="label-detail">（BDCDYH）</p>
            </span>
            <el-input :disabled="$store.state.business.Edit" v-model="ruleForm.BDCDYH" placeholder="不动产单元号"></el-input>
          </el-form-item>
        </el-col>

        <el-col :span="8">
          <el-form-item prop="ZDTZM">
            <span slot="label">
              宗地特征码： <br />
              <p class="label-detail">（ZDTZM）</p>
            </span>
            <el-input :disabled="$store.state.business.Edit" v-model="ruleForm.ZDTZM" placeholder="宗地特征码"></el-input>
          </el-form-item>
        </el-col>

        <el-col :span="8">
          <el-form-item prop="ZL">
            <span slot="label">
              坐落： <br />
              <p class="label-detail">（ZL）</p>
            </span>
            <el-input :disabled="$store.state.business.Edit" v-model="ruleForm.ZL" placeholder="坐落"></el-input>
          </el-form-item>
        </el-col>
      </el-row>

      <el-row>
        <el-col :span="8">
          <el-form-item prop="ZDMJ" :rules="{ type: 'number' }">
            <span slot="label">
              宗地面积： <br />
              <p class="label-detail">（ZDMJ）</p>
            </span>
            <el-input :disabled="$store.state.business.Edit" v-model.number="ruleForm.ZDMJ" type="number"
              v-only-number="{ max: 99999, min: 0, precision: 2 }" placeholder="宗地面积">
            </el-input>
          </el-form-item>
        </el-col>

        <el-col :span="8">
          <el-form-item prop="MJDW">
            <span slot="label">
              面积单位： <br />
              <p class="label-detail">（MJDW）</p>
            </span>
            <el-select :disabled="$store.state.business.Edit" v-model="ruleForm.MJDW" placeholder="面积单位">
              <el-option v-for="item in dictData['A7']" :key="item.DCODE" :label="item.DNAME" :value="item.DCODE">
              </el-option>
            </el-select>
          </el-form-item>
        </el-col>

        <el-col :span="8">
          <el-form-item prop="YT">
            <span slot="label">
              用途： <br />
              <p class="label-detail">（YT）</p>
            </span>
            <el-input :disabled="$store.state.business.Edit" v-model="ruleForm.YT" placeholder="用途"></el-input>
          </el-form-item>
        </el-col>
      </el-row>

      <el-row>
        <!-- <el-col :span="8">
          <el-form-item prop="DJ">
            <span slot="label">
              等级： <br />
              <p class="label-detail">（DJ）</p>
            </span>
            <el-select :disabled="$store.state.business.Edit" v-model="ruleForm.DJ" placeholder="等级">
              <el-option v-for="item in dicData['A50']" :key="item.DCODE" :label="item.DNAME" :value="item.DCODE">
              </el-option>
            </el-select>
          </el-form-item>
        </el-col> -->

        <el-col :span="8">
          <el-form-item prop="JG" :rules="{ type: 'number' }">
            <span slot="label">
              价格： <br />
              <p class="label-detail">（JG）</p>
            </span>
            <el-input :disabled="$store.state.business.Edit" v-model.number="ruleForm.JG" type="number"
              v-only-number="{ max: 99999, min: 0, precision: 2 }" placeholder="价格"></el-input>
          </el-form-item>
        </el-col>

        <!-- <el-col :span="8">
          <el-form-item prop="QLLX">
            <span slot="label">
              权利类型： <br />
              <p class="label-detail">（QLLX）</p>
            </span>
            <el-select :disabled="$store.state.business.Edit" v-model="ruleForm.QLLX" placeholder="权利性质">
              <el-option v-for="item in dicData['A8']" :key="item.DCODE" :label="item.DNAME" :value="item.DCODE">
              </el-option>
            </el-select>
          </el-form-item>
        </el-col> -->
      </el-row>

      <el-row>
        <!-- <el-col :span="8">
          <el-form-item prop="QLXZ">
            <span slot="label">
              权利性质： <br />
              <p class="label-detail">（QLXZ）</p>
            </span>
            <tree-select :disabled="$store.state.business.Edit" :options="dicData['A9']" v-model="ruleForm.QLXZ"
              placeholder="权利性质" />
          </el-form-item>
        </el-col> -->

        <!-- <el-col :span="8">
          <el-form-item prop="QLSDFS">
            <span slot="label">
              权利设定方式： <br />
              <p class="label-detail">（QLSDFS）</p>
            </span>
            <el-select :disabled="$store.state.business.Edit" v-model="ruleForm.QLSDFS" placeholder="权利设定方式">
              <el-option v-for="item in dicData['A10']" :key="item.DCODE" :label="item.DNAME" :value="item.DCODE">
              </el-option>
            </el-select>
          </el-form-item>
        </el-col> -->

        <el-col :span="8">
          <el-form-item prop="RJL">
            <span slot="label">
              容积率： <br />
              <p class="label-detail">（RJL）</p>
            </span>
            <el-input :disabled="$store.state.business.Edit" v-model="ruleForm.RJL"
              v-only-number="{ max: 99999, min: 0, precision: 0 }" placeholder="容积率"></el-input>
          </el-form-item>
        </el-col>
      </el-row>

      <el-row>
        <el-col :span="8">
          <el-form-item prop="JZMD" :rules="{ type: 'number' }">
            <span slot="label">
              建筑密度： <br />
              <p class="label-detail">（JZMD）</p>
            </span>
            <el-input :disabled="$store.state.business.Edit" type="number" v-model.number="ruleForm.JZMD"
              placeholder="建筑密度">
            </el-input>
          </el-form-item>
        </el-col>

        <el-col :span="8">
          <el-form-item prop="JZXG" :rules="{ type: 'number' }">
            <span slot="label">
              建筑限高： <br />
              <p class="label-detail">（JZXG）</p>
            </span>
            <el-input :disabled="$store.state.business.Edit" type="number" v-model.number="ruleForm.JZXG"
              v-only-number="{ max: 99999, min: 1, precision: 2 }" placeholder="建筑限高">
            </el-input>
          </el-form-item>
        </el-col>

        <el-col :span="8">
          <el-form-item prop="ZDSZD">
            <span slot="label">
              宗地四至-东: <br />
              <p class="label-detail">（ZDSZD）</p>
            </span>
            <el-input :disabled="$store.state.business.Edit" v-model="ruleForm.ZDSZD" placeholder="宗地四至-东">
            </el-input>
          </el-form-item>
        </el-col>
      </el-row>

      <el-row>
        <el-col :span="8">
          <el-form-item prop="ZDSZN">
            <span slot="label">
              宗地四至-南： <br />
              <p class="label-detail">（ZDSZN）</p>
            </span>
            <el-input :disabled="$store.state.business.Edit" v-model="ruleForm.ZDSZN" placeholder="宗地四至-南">
            </el-input>
          </el-form-item>
        </el-col>

        <el-col :span="8">
          <el-form-item prop="ZDSZX">
            <span slot="label">
              宗地四至-西： <br />
              <p class="label-detail">（ZDSZX）</p>
            </span>
            <el-input :disabled="$store.state.business.Edit" v-model="ruleForm.ZDSZX" placeholder="宗地四至-西">
            </el-input>
          </el-form-item>
        </el-col>

        <el-col :span="8">
          <el-form-item prop="ZDSZB">
            <span slot="label">
              宗地四至-北： <br />
              <p class="label-detail">（ZDSZB）</p>
            </span>
            <el-input :disabled="$store.state.business.Edit" v-model="ruleForm.ZDSZB" placeholder="宗地四至-北">
            </el-input>
          </el-form-item>
        </el-col>
      </el-row>

      <el-row>
        <el-col :span="8">
          <el-form-item prop="ZDT">
            <span slot="label">
              宗地图： <br />
              <p class="label-detail">（ZDT）</p>
            </span>
            <el-input :disabled="$store.state.business.Edit" v-model="ruleForm.ZDT" placeholder="宗地图">
            </el-input>
          </el-form-item>
        </el-col>

        <el-col :span="8">
          <el-form-item prop="TFH">
            <span slot="label">
              图幅号： <br />
              <p class="label-detail">（TFH）</p>
            </span>
            <el-input :disabled="$store.state.business.Edit" v-model="ruleForm.TFH" placeholder="图幅号">
            </el-input>
          </el-form-item>
        </el-col>

        <el-col :span="8">
          <el-form-item prop="DJh">
            <span slot="label">
              地籍号：<br />
              <p class="label-detail">（DJH）</p>
            </span>
            <el-input :disabled="$store.state.business.Edit" v-model="ruleForm.DJh" placeholder="地籍号">
            </el-input>
          </el-form-item>
        </el-col>
      </el-row>

      <el-row>
        <el-col :span="8">
          <el-form-item prop="DAH" class="borderTopNone">
            <span slot="label">
              档案号： <br />
              <p class="label-detail">（DAH）</p>
            </span>
            <el-input :disabled="$store.state.business.Edit" v-model="ruleForm.DAH" placeholder="档案号">
            </el-input>
          </el-form-item>
        </el-col>

        <el-col :span="8">
          <el-form-item prop="BZ" class="borderTopNone">
            <span slot="label">
              备注： <br />
              <p class="label-detail">（BZ）</p>
            </span>
            <el-input :disabled="$store.state.business.Edit" v-model="ruleForm.BZ" placeholder="备注">
            </el-input>
          </el-form-item>
        </el-col>

        <el-col :span="8">
          <el-form-item prop="ZT" class="borderTopNone">
            <span slot="label">
              状态： <br />
              <p class="label-detail">（ZT）</p>
            </span>
            <el-select :disabled="$store.state.business.Edit" v-model="ruleForm.ZT" placeholder="状态">
              <el-option v-for="item in dictData['A11']" :key="item.DCODE" :label="item.DNAME" :value="item.DCODE">
              </el-option>
            </el-select>
          </el-form-item>
        </el-col>
      </el-row>

      <el-row>
        <el-col :span="8">
          <el-form-item prop="QXDM">
            <span slot="label">
              区县代码：<br />
              <p class="label-detail">（QXDM）</p>
            </span>
            <el-input :disabled="$store.state.business.Edit" v-model="ruleForm.QXDM" placeholder="区县代码">
            </el-input>
          </el-form-item>
        </el-col>

        <el-col :span="8">
          <el-form-item prop="DJSJ">
            <span slot="label">
              登记时间： <br />
              <p class="label-detail">（DJSJ）</p>
            </span>
            <el-date-picker :disabled="$store.state.business.Edit" placeholder="选择日期" type="datetime" clearable
              v-model="ruleForm.DJSJ" value-format="yyyy-MM-dd HH:mm:ss">
            </el-date-picker>
          </el-form-item>
        </el-col>

        <el-col :span="8">
          <el-form-item prop="DBR">
            <span slot="label">
              登簿人: <br />
              <p class="label-detail">（DBR）</p>
            </span>
            <el-input :disabled="$store.state.business.Edit" v-model="ruleForm.DBR" placeholder="登簿人">
            </el-input>
          </el-form-item>
        </el-col>
      </el-row>

      <el-row>
        <el-col :span="8">
          <el-form-item prop="FJ">
            <span slot="label">
              附记： <br />
              <p class="label-detail">（FJ）</p>
            </span>
            <el-input :disabled="$store.state.business.Edit" v-model="ruleForm.FJ" placeholder="附记">
            </el-input>
          </el-form-item>
        </el-col>

        <el-col :span="8">
          <el-form-item prop="DJJGBM">
            <span slot="label">
              登记机构编码： <br />
              <p class="label-detail">（DJJGBM）</p>
            </span>
            <el-input :disabled="$store.state.business.Edit" v-model="ruleForm.DJJGBM" placeholder="登记机构编码">
            </el-input>
          </el-form-item>
        </el-col>

        <el-col :span="8">
          <el-form-item prop="DJJGMC">
            <span slot="label">
              登记机构名称： <br />
              <p class="label-detail">（DJJGMC）</p>
            </span>
            <el-input :disabled="$store.state.business.Edit" v-model="ruleForm.DJJGMC" placeholder="登记机构名称">
            </el-input>
          </el-form-item>
        </el-col>
      </el-row>

      <el-row>
        <el-col :span="8">
          <el-form-item prop="JDH">
            <span slot="label">
              街道（乡、镇）： <br />
              <p class="label-detail">（JDH）</p>
            </span>
            <el-input :disabled="$store.state.business.Edit" v-model="ruleForm.JDH" placeholder="街道（乡、镇）">
            </el-input>
          </el-form-item>
        </el-col>

        <el-col :span="8">
          <el-form-item prop="JFH">
            <span slot="label">
              街坊（村）: <br />
              <p class="label-detail">（JFH）</p>
            </span>
            <el-input :disabled="$store.state.business.Edit" v-model="ruleForm.JFH" placeholder="街坊（村）">
            </el-input>
          </el-form-item>
        </el-col>

        <el-col :span="8">
          <el-form-item prop="ZH">
            <span slot="label">
              组： <br />
              <p class="label-detail">（ZH）</p>
            </span>
            <el-input :disabled="$store.state.business.Edit" v-model="ruleForm.ZH" placeholder="组">
            </el-input>
          </el-form-item>
        </el-col>
      </el-row>
    </el-form>
    <message-tips ref="msg" />
  </div>
</template>
<script>
// 宗地基本信息
import business from '@/api/business'
import ruleMixin from '@/mixins/ruleMixin.js'
import treeSelect from '@/components/treeSelect/index.vue'
export default {
  mixins: [ruleMixin],
  components: {
    treeSelect
  },
  props: {
    bsmSjsb: {
      type: String,
      default: ''
    },
    bsmYwsjb: {
      type: String,
      default: ''
    }
  },
  data () {
    return {
      ruleForm: {
        BSM: '',
        YSDM: '',
        ZDDM: '',
        BDCDYH: '',
        ZDTZM: '',
        ZL: '',
        ZDMJ: '',
        MJDW: '',
        YT: '',
        DJ: '',
        JG: '',
        QLLX: '',
        QLXZ: '',
        QLSDFS: '',
        RJL: '',
        JZMD: '',
        JZXG: '',
        ZDSZD: '',
        ZDSZN: '',
        ZDSZX: '',
        ZDSZB: '',
        ZDT: '',
        TFH: '',
        DJh: '',
        DAH: '',
        BZ: '',
        ZT: '',
        QXDM: '',
        DJSJ: '',
        DBR: '',
        FJ: '',
        DJJGBM: '',
        DJJGMC: '',
        JDH: '',
        JFH: '',
        ZH: ''
      }
    }
  },
  methods: {
    async featchData () {
      try {
        let { result: res } = await business.kttZdjbxxDetail(this.bsmSjsb)
        this.ruleForm = res
        this.featchRule()
      } catch (error) {
        this.$refs.msg.messageShow()
      }
    },
    handleUpdateForm () {
      return new Promise(async (resolve) => {
        try {
          let res = await business.updateKttZdjbxx(this.ruleForm)
          // this.$refs['formList'].resetFields();
          resolve(res.code)
        } catch (error) {
          this.$refs.msg.messageShow()
        }
      })
    }
  }
}
</script>
<style scoped lang="scss">
@import "./css/itemForm.scss";
</style>