<template>
  <div class='jyht'>
    <el-form :model="formData" ref="formData">
      <el-row :gutter="10">
        <el-col :span="8">
          <el-form-item label="行政区">
            <el-input disabled v-model="formData.areaCode"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="业务号">
            <el-input disabled v-model="formData.ywh"></el-input>
          </el-form-item>
        </el-col>       
        <el-col :span="8">
          <el-form-item label="用户编号" prop="cons_no" :rules="[{ required: true, message: '请输入用户编号', trigger: 'blur' }]">
            <el-input v-model="formData.cons_no"></el-input>
          </el-form-item>
        </el-col>       
      </el-row>
      <el-row :gutter="10">
        <el-col :span="8">
          <el-form-item label="房产证编号">
            <el-input disabled v-model="formData.fczbh"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="16">
          <el-form-item label="房屋坐落（地址）">
            <el-input disabled v-model="formData.fwzl"></el-input>
          </el-form-item>
        </el-col>           
      </el-row>
    </el-form>
    <div class="slxx_title title-block">
      原户主信息
          <div class="triangle"></div>
        </div>
    <lb-table ref="table" @row-click="handleRowClick" :pagination="false" :key="key"
      :column="tableData.columns"
      :data="ywrData">
    </lb-table>
    <div class="slxx_title title-block">
      新户主信息
          <div class="triangle"></div>
        </div>
    <lb-table ref="table" @row-click="handleRowClick" :pagination="false" :key="key"
      :column="tableData.columns"
      :data="tableData.data">
    </lb-table>
    
    <div class="text-center">
      <el-button @click="$popupCacel">取消</el-button>
      <el-button type="primary" @click="saveDlxx">保存</el-button>
    </div>
  </div>
</template>
<script>
  import store from '@/store/index.js'
  import { loadQlrxx,loadYwrxx,saveDlxx } from "@/api/workflow/swhtxx.js";
  export default {
    props: {
      formData: {
        type: Object,
        default: {}
      }
    },
    components: {},
    data () {
      return {
        key: 0,
        radioVal: '',
        queryForm: {
          htbh: '',
          sfzjhm: '',
          ywh: ''
        },
        tableData: {
          data: [],
          columns: [
            {
              label: '选择',
              width: '50px',
              render: (h, scope) => {
                return (
                  <div class="orgColumn">
                    <el-radio onChange={() => { this.handleChange(scope.row) }} v-model={this.radioVal} label={scope.row.bsmSqr}>
                      &ensp;
                    </el-radio>
                  </div>
                )
              }
            },
            {
              prop: 'sqrmc',
              label: '权利人名称',
            },
            {
              prop: 'zjzlmc',
              label: '证件种类'
            },
            {
              prop: 'zjh',
              label: '证件号码'
            },
            {
              prop: 'dh',
              label: '联系电话'
            }
          ]
        },
        ywrData:[]
      }
    },
    mounted () {
      this.loadData()
    },
    methods: {
      handleRowClick (val) {
        this.radioVal = row.bsmSqr;
        this.queryForm.nsrmc= row.sqrmc;
        this.queryForm.sfzjhm= row.zjh;
      },
      saveDlxx () { 
        this.$refs['formData'].validate((valid) => {
          if (valid) {
             saveDlxx(this.formData).then(res => {
             if (res.code === 200 && res.result){
            
             }else{
              this.$message({
              showClose: true,
              message: res.message,
              type: "error"
            })
             }
           })
          } else {  
            return false
          }
        })        
       
      },
      handleChange (row) {
        this.radioVal = row.bsmSqr;
        this.queryForm.nsrmc= row.sqrmc;
        this.queryForm.sfzjhm= row.zjh;
      },
      loadData () {
        function findValueByKey (array, keyToFind) {
          var foundItem = array.find(function (item) {
            return item.dcode === keyToFind;
          });

          return foundItem ? foundItem.dname : undefined;
        }        
        loadQlrxx(this.formData.bsmSldy).then(res => {
          let arr = store.getters.dictData['A30']
          this.tableData.data = res.result
          this.tableData.data.forEach(item => {
            if (item.zjzl) {
              item.zjzlmc = findValueByKey(arr, item.zjzl);
            }
          })
          this.key++
        });
        loadYwrxx(this.formData.bsmSldy).then(res => {
          let arr = store.getters.dictData['A30']
          this.ywrData = res.result
          this.ywrData.forEach(item => {
            if (item.zjzl) {
              item.zjzlmc = findValueByKey(arr, item.zjzl);
            }
          })
          this.key++
        })
      }
    }
  }
</script>
<style scoped lang='scss'>
  @import "~@/styles/public.scss";
</style>