style:家庭房产

+/*
+ * @Description: 
+ * @Autor: renchao
+ * @LastEditTime: 2023-06-14 15:05:38
+ */
 import Vue from 'vue'
 import Popup from './index.vue'
 const PopupBox = Vue.extend(Popup)
@@ -36,9 +41,9 @@ const Popup1 = (title, editItem, data, formData) => {
   document.body.appendChild(instance.$el)
   Vue.nextTick(() => {
     instance.isShow = true
+    // 将组件实例赋值给loading
+    popuping = instance
   })
-  // 将组件实例赋值给loading
-  popuping = instance
   return instance
 }
 export default Popup1

@@ -26,9 +26,67 @@
       </lb-table>
       <!-- 权利人 -->
       <b class="title">权利人</b>
-      <lb-table :column="qlrColumns" :data="form.qlrList" heightNumSetting :heightNum="300"
-        :pagination="false">
-      </lb-table>
+      <el-table
+        :data="form.qlrList"
+        height="160"
+        border
+        :cell-style="{ textAlign: 'center' }"
+        :header-cell-style="{textAlign: 'center'}"
+        style="width: 100%">
+        <el-table-column width="60">
+          <template slot="header">
+            <i class="el-icon-plus pointer" @click="handleAddqlr"></i>
+          </template>
+          <template slot-scope="scope">
+            <i class="el-icon-minus pointer" @click="remove(scope.$index, scope.row, 'qlr')"></i>
+          </template>
+        </el-table-column>
+        <el-table-column
+          label="身份证读卡器"
+          width="150">
+          <template slot-scope="scope">
+            <el-button
+              type="text"
+              icon="el-icon-edit-outline"
+              @click="handleRead(scope.row, 'qlr')">
+              读取
+            </el-button>
+          </template>
+        </el-table-column>
+        <el-table-column
+          label="姓名/名称"
+          width="150">
+          <template slot-scope="scope">
+            <el-input v-model="scope.row.sqrxm"></el-input>
+          </template>
+        </el-table-column>
+        <el-table-column
+          label="证件种类">
+          <template slot-scope="scope">
+            <el-select v-model="scope.row.sqrzjlxbm" class="width100">
+              <el-option
+                v-for="item in zjzlData"
+                :key="item.value"
+                :label="item.label"
+                :value="item.value">
+              </el-option>
+            </el-select>
+          </template>
+        </el-table-column>
+        <el-table-column
+          label="证件号">
+          <template slot-scope="scope">
+            <el-input v-model="scope.row.sqrzjhm"></el-input>
+          </template>
+        </el-table-column>
+
+        <el-table-column
+          label="联系电话">
+          <template slot-scope="scope">
+            <el-input type="tel" v-model="scope.row.lxdh"></el-input>
+          </template>
+        </el-table-column>
+      </el-table>
       <div v-show="isSearch">
         <b class="title">查询结果</b>
         <p>查询编号：{{ form.djSqcxDO.cxbh }}</p>
@@ -71,6 +129,7 @@
     data () {
       return {
         key: 0,
+        zjzlData: store.getters.dictData['A30'],
         //是否查询
         isSearch: false,
         //查询结果列表字段
@@ -210,140 +269,6 @@
             );
           },
         }],
-        //权利人列表字段
-        qlrColumns: [{
-          width: "60",
-          renderHeader: (h, scope) => {
-            return (
-              <i
-                class="el-icon-plus pointer"
-                onClick={() => {
-                  this.handleAddqlr();
-                }}
-                style="color:#409EFF"
-              ></i>
-            );
-          },
-          render: (h, scope) => {
-            return (
-              <i
-                class="el-icon-minus pointer"
-                onClick={() => {
-                  this.remove(scope.$index, scope.row, "qlr");
-                }}
-              ></i>
-            );
-          },
-        },
-        {
-          width: "150",
-          label: "身份证读卡器",
-          render: (h, scope) => {
-            return (
-              <div>
-                <el-button
-                  type="text"
-                  icon="el-icon-edit-outline"
-                  onClick={() => {
-                    this.handleRead(scope.row, 'qlr');
-                  }}
-                >
-                  读取
-                </el-button>
-              </div>
-            );
-          },
-        },
-        {
-          width: "150",
-          prop: "sqrxm",
-          label: "姓名/名称",
-          render: (h, scope) => {
-            return (
-              <el-input
-                placeholder="姓名/名称"
-                value={scope.row[scope.column.property]}
-                onInput={(val) => {
-                  scope.row[scope.column.property] = val;
-                }}
-              ></el-input>
-            );
-          },
-        },
-        {
-          prop: "sqrzjlxbm",
-          label: "证件种类",
-          render: (h, scope) => {
-            return (
-              <el-select
-                class="width100"
-                value={scope.row[scope.column.property]}
-                onChange={(val) => {
-                  scope.row[scope.column.property] = val;
-                }}
-              >
-                {this.getDictData('A30').map((option) => {
-                  return (
-                    <el-option
-                      label={option.dname}
-                      value={option.dcode}
-                    ></el-option>
-                  );
-                })}
-              </el-select>
-            );
-          },
-        },
-        {
-          prop: "sqrzjhm",
-          label: "证件号",
-          render: (h, scope) => {
-            return (
-              <el-input
-                placeholder="证件号"
-                value={scope.row[scope.column.property]}
-                onInput={(val) => {
-                  scope.row[scope.column.property] = val;
-                }}
-                maxlength="21"
-              ></el-input>
-            );
-          },
-        },
-        {
-          prop: "lxdh",
-          label: "联系电话",
-          render: (h, scope) => {
-            return (
-              <div class="typePhone">
-                <el-input
-                  placeholder="联系电话"
-                  value={scope.row[scope.column.property]}
-                  onInput={(val) => {
-                    scope.row[scope.column.property] = val;
-                  }}
-                  onBlur={(val) => {
-                    this.teltest(scope.row);
-                  }}
-                  type="tel"
-                  maxlength="11"
-                ></el-input>
-                <span
-                  v-show={scope.row.inputErr}
-                  style={{
-                    fontSize: "12px",
-                    color: "red",
-                    position: "absolute",
-                    bottom: "-2px",
-                    left: "0",
-                  }}
-                >
-                  请输入正确手机号
-                </span>
-              </div>
-            );
-          },
-        }],
         newData: {
           sqrxm: "",
           sqrzjlxbm: "",