zsxg.vue 7.35 KB
<!--
 * @Description:
 * @Autor: renchao
 * @LastEditTime: 2023-11-15 15:41:43
-->
<template>
  <div class="from-clues loadingtext" v-Loading="loading" element-loading-text="拼命加载中...">
    <!-- 表单部分 -->
    <el-tabs v-model="activeName" @tab-click="handleClick" v-if="headTabBdcqz.length >1" style="margin-top:-15px">
      <el-tab-pane :label="item.qlr + (item.bdcqzh !== null ? '(' + item.bdcqzh + ')' : '')" :name="item.bsmBdcqz"
        v-for="(item, index) in headTabBdcqz" :key="index">
      </el-tab-pane>
    </el-tabs>
    <el-empty description="暂无数据" v-if="headTabBdcqz.length == 0 && noData"></el-empty>
    <div v-else>
      <div style="height:540px">
        <el-form class="zs" :model="bdcqz" v-if="this.bdcqz.bdcqzlx==1" ref="ruleForm" label-width="100px">
          <el-row>
            <el-col :span="24">
              <el-form-item label="权利人">
                <el-input v-model="bdcqz.qlr"></el-input>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="24">
              <el-form-item label="共有情况">
                <el-select v-model="bdcqz.gyqk" class="width100" placeholder="请选择">
                  <el-option
                    v-for="item in gyqkList"
                    :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="24">
              <el-form-item label="坐落">
                <el-input v-model="bdcqz.zl"></el-input>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="24">
              <el-form-item label="不动产单元号">
                <el-input v-model="bdcqz.bdcdyh"></el-input>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="24">
              <el-form-item label="权利类型">
                <el-input v-model="bdcqz.qllx"></el-input>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="24">
              <el-form-item label="权利性质 ">
                <el-input v-model="bdcqz.qlxz"></el-input>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="24">
              <el-form-item label="用途">
                <el-input v-model="bdcqz.yt"></el-input>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="24">
              <el-form-item label="面积">
                <el-input v-model="bdcqz.mj"></el-input>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="24">
              <el-form-item label="使用期限 ">
                <el-input v-model="bdcqz.syqx"></el-input>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="24">
              <el-form-item label="权利其他状况">
                <el-input v-model="bdcqz.qlqtzk" :rows="4" type="textarea"></el-input>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="24">
              <el-form-item label="附记">
                <el-input v-model="bdcqz.fj" :rows="4" type="textarea"></el-input>
              </el-form-item>
            </el-col>
          </el-row>
        </el-form>
        <el-form :model="bdcqz" class="zm" v-else ref="ruleForm" label-width="110px">
          <el-row>
            <el-col :span="24">
              <el-form-item label="证明权利或事项">
                <el-input v-model="bdcqz.zmqlhsx"></el-input>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="24">
              <el-form-item label="权利人(申请人)">
                <el-input v-model="bdcqz.qlr"></el-input>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="24">
              <el-form-item label="义务人">
                <el-input v-model="bdcqz.ywr"></el-input>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="24">
              <el-form-item label="坐落">
                <el-input v-model="bdcqz.zl"></el-input>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="24">
              <el-form-item label="不动产单元号">
                <el-input v-model="bdcqz.bdcdyh"></el-input>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="24">
              <el-form-item label="其他状况">
                <el-input v-model="bdcqz.qlqtzk" :rows="6" type="textarea"></el-input>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="24">
              <el-form-item label="附记">
                <el-input v-model="bdcqz.fj" :rows="6" type="textarea"></el-input>
              </el-form-item>
            </el-col>
          </el-row>
        </el-form>
      </div>
      <div style="text-align:center">
        <el-button @click="$popupCacel">取消</el-button>
        <el-button type="primary" @click="handleSubmit">保存</el-button>
      </div>
    </div>
  </div>
</template>

<script>
  import store from '@/store/index.js'
  import { getSlsqBdcqzList, editBdcqz } from "@/api/bdcqz.js"
  export default {
    name: "zsxg",
    props: {
      formData: {
        type: Object,
        default: {}
      }
    },
    data () {
      return {
        gyqkList: store.getters.dictData['A34'],
        key: 0,
        noData: false,
        loading: false,
        bdcqz: {},
        //tab切换栏数组
        headTabBdcqz: [],
        //tab选择绑定值
        activeName: '',
      }
    },
    mounted () {
      this.getHeadTabBdcqz()
    },
    methods: {
      /**
       * @description: 获取受理申请下全部不动产权证
       * @author: renchao
       */
      getHeadTabBdcqz () {
        this.loading = true
        getSlsqBdcqzList({ bsmSlsq: this.formData.bsmSlsq }).then(res => {
          if (res.code == 200) {
            this.noData = true
            if (res.result && res.result.length > 0) {
              this.bdcqz = res.result[0]
              this.headTabBdcqz = _.cloneDeep(res.result)
              if (this.formData.bsmBdcqz) {
                this.activeName = this.formData.bsmBdcqz
              } else {
                this.activeName = res.result[0].bsmBdcqz
              }
            }
          }
          this.loading = false
        })
      },
      handleClick (tab) {
        this.bdcqz = _.cloneDeep(this.headTabBdcqz[tab.index])
      },
      handleSubmit () {
        editBdcqz(this.bdcqz).then(res => {
          if (res.code == 200) {
            this.$message.success('保存成功');
            //刷新列表
            this.$popupCacel()
          } else {
            this.$message.error(res.message)
          }
        })
      }
    }
  }
</script>
<style scoped lang="scss">
  @import "~@/styles/mixin.scss";
</style>