<template>
  <div class="tableDivCss">
    <table cellpadding="0" cellspacing="0" class="tableCss">
      <tr>
        <th colspan="5" class="title">宗地基本信息</th>
      </tr>
      <tr>
        <td>单位</td>
        <td colspan="4">{{ zdjbxx.mjdw | dictionary('A7') }}</td>
      </tr>
      <tr>
        <td>不动产类型</td>
        <td colspan="4">{{ bdclxList[zdjbxx.bdclx] }}</td>
      </tr>
      <tr>
        <td>坐落</td>
        <td colspan="4">{{ zdjbxx.zl }}</td>
      </tr>
      <tr>
        <td rowspan="8">土地状况</td>
      </tr>
      <tr>
        <td style="width:15%">宗地面积</td>
        <td style="width:30%">{{ zdjbxx.zdmj }}</td>
        <td style="width:15%">用途</td>
        <td style="width:30%">{{ zdjbxx.ghytmc }}</td>
      </tr>
      <tr>
        <td>等级</td>
        <td>{{ zdjbxx.djmc }}</td>
        <td>价格</td>
        <td>{{ zdjbxx.jg }}</td>
      </tr>
      <tr>
        <td>权利类型</td>
        <td>{{ zdjbxx.qllxmc }}</td>
        <td>权利性质</td>
        <td>{{ zdjbxx.qlxzmc }}</td>
      </tr>
      <tr>
        <td>权利设定方式</td>
        <td>{{zdjbxx.qlsdfs | dictionary('A10')}}</td>
        <td>容积率</td>
        <td>{{ zdjbxx.rjl }}</td>
      </tr>
      <tr>
        <td>建筑密度</td>
        <td>{{ zdjbxx.jzmd }}</td>
        <td>建筑限高</td>
        <td>{{ zdjbxx.jzxg }}</td>
      </tr>
      <tr>
        <td>图幅号</td>
        <td>{{ zdjbxx.tfh }}</td>
        <td>地籍号</td>
        <td>{{ zdjbxx.djh }}</td>
      </tr>
      <tr>
        <td>档案号</td>
        <td>{{ zdjbxx.dah }}</td>
        <td>地块代码</td>
        <td>{{ zdjbxx.dkdm }}</td>
      </tr>
      <tr>
        <td rowspan="5">宗地四至</td>
      </tr>

      <tr>
        <td>东</td>
        <td colspan="3">{{ zdjbxx.zdszd }}</td>
      </tr>
      <tr>
        <td>南</td>
        <td colspan="3">{{ zdjbxx.zdszn }}</td>
      </tr>
      <tr>
        <td>西</td>
        <td colspan="3">{{ zdjbxx.zdszx }}</td>
      </tr>
      <tr>
        <td>北</td>
        <td colspan="3">{{ zdjbxx.zdszb }}</td>
      </tr>
      <tr>
        <td>登记时间</td>
        <td colspan="2">{{ zdjbxx.bz }}</td>
        <td>登簿人</td>
        <td>{{ zdjbxx.bz }}</td>
      </tr>

      <tr>
        <td>附记</td>
        <td colspan="4">{{ zdjbxx.fj }}</td>
      </tr>
      <!-- <tr>
        <td>状态</td>
        <td colspan="2">{{ zdjbxx.zt }}</td>
        <td>区县代码</td>
        <td>{{ zdjbxx.qxdm }}</td>
      </tr> -->
      <tr v-if="showGroup">
        <td rowspan="4">变化情况</td>

        <!-- <table cellspacing="0" cellpadding="0" :width="bhqkTableWidth">
            <tr v-for="(item, index) in bhqkColumns" :key="index">
              <td class="bhqkTh">{{ item.label }}</td>
            </tr>
          </table> -->

      </tr>

      <tr v-if="showGroup">
        <td>变化原因</td>
        <td>变化内容</td>
        <td>登记时间</td>
        <td>登簿人</td>
      </tr>
      <!-- <tr >
        <td>{{ zdbhqks[0].bhyy }}</td>
        <td>{{ zdbhqks[0].bhnr }}</td>
        <td>{{ zdbhqks[0].djsj }}</td>
        <td>{{ zdbhqks[0].dbr }}</td>
      </tr> -->

    </table>
  </div>
</template>

<script>
  import store from '@/store/index.js'
  import { getZdjjxxBybdcdyid } from "@/api/registerBook.js";

  export default {
    data () {
      return {
        bhqkColumns: [
          {
            prop: "ssywh",
            label: "上手业务号",
          },
          {
            prop: "zddm",
            label: "宗地代码",
          },
          {
            prop: "bhqzddm",
            label: "变化前宗地代码",
          },
          {
            prop: "bhnr",
            label: "变化内容",
          },
          {
            prop: "bhyy",
            label: "变化原因",
          },
          {
            prop: "djsj",
            label: "登记时间",
          },
          {
            prop: "dbr",
            label: "登簿人",
          },
          {
            prop: "fj",
            label: "附记",
          },
        ],
        bhqkTableWidth: 745,
        zdjbxx: {},
        zdbhqks: [],
        propsParam: this.$attrs,
        showGroup: false,
        bdclxList: ["", "宗地", "宗海", "自然幢", "多幢", "构筑物", "林权", "户"]
      }
    },
    filters: {
      dictionary: function (value, param) {
        const foundItem = store.getters.dictData[param].find(item => item.dcode === String(value))
        if (foundItem) {
          return foundItem.dname
        }
      }
    },
    created () {
      this.loadData()
    },
    methods: {
      loadData () {
        getZdjjxxBybdcdyid({ bdcdyid: this.propsParam.bdcdyid }).then((res) => {
          if (res.code === 200) {
            this.zdjbxx = res.result.zdjbxx;
            this.zdbhqks = res.result.zdbhqkList;
            if (this.zdbhqks != null && this.zdbhqks.length > 0) {
              this.showGroup = true;
            }
          }
        })
      }
    }
  }
</script>
<style lang="scss" scoped>
  @import "~@/styles/tablecss.scss";
</style>