style:权利人名称

 <!--
  * @Description:
  * @Autor: renchao
- * @LastEditTime: 2023-08-30 16:14:24
+ * @LastEditTime: 2023-09-01 10:10:15
 -->
 <template>
   <dialogBox
     title="申请人信息"
-    width="60%"
+    width="75%"
     isMain
     v-model="myValue"
     :isFullscreen="false"
     @submitForm="submitForm"
     @closeDialog="closeDialog"
     :isButton="showButton">
+
+    <el-tabs v-model="activeName" @tab-click="handleClick" class="from-clues-header">
+      <el-tab-pane label="基本信息" name="1"></el-tab-pane>
+      <el-tab-pane label="个人信息备案" name="2"></el-tab-pane>
+      <el-tab-pane label="企业信息备案" name="3"></el-tab-pane>
+    </el-tabs>
+
     <el-form
+      v-if="activeName==1"
       :model="ruleForm"
       :rules="rules"
       ref="ruleForm"
@@ -244,12 +252,75 @@
         </el-col>
       </el-row>
     </el-form>
+    <div v-if="activeName==2">
+      <el-form :model="queryForm">
+        <el-row>
+          <el-col :span="8">
+            <el-form-item label="证件号">
+              <el-input placeholder="证件号" maxlength="28" v-model="queryForm.zjh" clearable class="width100">
+              </el-input>
+            </el-form-item>
+          </el-col>
+          <el-col :span="8">
+            <el-form-item label="姓名/名称">
+              <el-input placeholder="" v-model.trim="queryForm.sqrmc" clearable class="width100">
+              </el-input>
+            </el-form-item>
+          </el-col>
+          <el-col :span="8" class="btnColRight">
+            <el-form-item>
+              <el-button type="primary" @click="handleSearch">查询</el-button>
+            </el-form-item>
+          </el-col>
+        </el-row>
+      </el-form>
+      <lb-table
+        :page-size="pageData.pageSize" :calcHeight="435"
+        :current-page.sync="pageData.currentPage" :total="tableDataGr.total" @size-change="handleSizeChange"
+        @p-current-change="handleCurrentChange" :column="tableDataGr.columns"
+        :data="tableDataGr.data">
+      </lb-table>
+    </div>
+
+    <div v-if="activeName==3">
+      <el-form :model="queryForm">
+        <el-row>
+          <el-col :span="8">
+            <el-form-item label="证件号">
+              <el-input placeholder="证件号" maxlength="28" v-model="queryForm.zjh" clearable class="width100">
+              </el-input>
+            </el-form-item>
+          </el-col>
+          <el-col :span="8">
+            <el-form-item label="姓名/名称">
+              <el-input placeholder="" v-model.trim="queryForm.sqrmc" clearable class="width100">
+              </el-input>
+            </el-form-item>
+          </el-col>
+          <el-col :span="8" class="btnColRight">
+            <el-form-item>
+              <el-button type="primary" @click="handleSearch">查询</el-button>
+            </el-form-item>
+          </el-col>
+        </el-row>
+      </el-form>
+      <lb-table
+        :page-size="pageData.pageSize" :calcHeight="435"
+        :current-page.sync="pageData.currentPage" :total="tableDataQy.total" @size-change="handleSizeChange"
+        @p-current-change="handleCurrentChange" :column="tableDataQy.columns"
+        :data="tableDataQy.data">
+      </lb-table>
+    </div>
+
   </dialogBox>
 </template>
 <script>
   import { mapGetters } from "vuex";
+  import table from "@/utils/mixin/table";
   import { getIdCardInfo } from '@/utils/operation.js'
+  import { dataGr, dataQy, sendThis } from "../../javascript/addQlrData";
   export default {
+    mixins: [table],
     props: {
       value: { type: Boolean, default: false },
       details: { type: Object, default: {} },
@@ -260,6 +331,7 @@
     },
     data () {
       return {
+        activeName: '1',
         myValue: this.value,
         ruleForm: {
           sqrlx: "",
@@ -290,7 +362,24 @@
           zjzl: [{ required: true, message: "证件种类", trigger: "change" }],
           zjh: [{ required: true, message: "证件号", trigger: "blur" }],
         },
-      };
+        tableDataGr: {
+          total: 0,
+          columns: dataGr.columns(),
+          data: [],
+        },
+        queryForm: {
+          zjh: "",
+          sqrmc: ""
+        },
+        tableDataQy: {
+          total: 0,
+          columns: dataQy.columns(),
+          data: [],
+        },
+      }
+    },
+    mounted () {
+      sendThis(this);
     },
     watch: {
       value (val) {
@@ -304,6 +393,9 @@
       }
     },
     methods: {
+      handleClick (event, tab) { },
+      handlesGrSelect () { },
+      handleSearch () { },
       /**
        * @description: 身份证打卡器
        * @param {*} row

+/*
+ * @Description:
+ * @Autor: renchao
+ * @LastEditTime: 2023-08-29 13:09:45
+ */
+import filter from '@/utils/filter.js'
+let vm = null
+
+const sendThis = (_this) => {
+  vm = _this
+}
+class data1 extends filter {
+  constructor() {
+    super()
+  }
+  columns () {
+    return [
+      {
+        label: '序号',
+        type: 'index',
+        width: '50',
+        render: (h, scope) => {
+          return (
+            <div>
+              {(vm.pageData.currentPage - 1) * vm.pageData.pageSize + scope.$index + 1}
+            </div>
+          )
+        }
+      },
+      {
+        prop: "sqrmc",
+        label: "姓名/名称",
+      },
+      {
+        prop: "zjzl",
+        label: "证件种类",
+        render: (h, scope) => {
+          return (
+            <el-select
+              class="width100"
+              clearable
+              value={scope.row[scope.column.property]}
+              onChange={(val) => {
+                scope.row[scope.column.property] = val;
+              }}
+            >
+              {vm.dictData["A30"].map((option) => {
+                return (
+                  <el-option
+                    label={option.dname}
+                    value={option.dcode}
+                  ></el-option>
+                );
+              })}
+            </el-select>
+          );
+        },
+      },
+      {
+        prop: "zjh",
+        label: "证件号",
+      },
+      {
+        prop: "frmc",
+        label: "法人名称",
+      },
+      {
+        prop: "txdz",
+        label: "地址",
+      },
+      {
+        prop: "dh",
+        label: "联系电话",
+      },
+      {
+        label: '操作',
+        width: '80',
+        align: 'center',
+        fixed: 'right',
+        render: (h, scope) => {
+          return (
+            <div>
+              <el-button type="text" onClick={() => { this.handlesGrSelect(scope.row) }}>使用</el-button>
+            </div>
+          )
+        }
+      },
+    ]
+  }
+
+}
+class data2 extends filter {
+  constructor() {
+    super()
+  }
+
+  columns () {
+    return [
+      {
+        label: '序号',
+        type: 'index',
+        width: '50',
+        render: (h, scope) => {
+          return (
+            <div>
+              {(vm.pageData.currentPage - 1) * vm.pageData.pageSize + scope.$index + 1}
+            </div>
+          )
+        }
+      },
+      {
+        prop: "sqrmc",
+        label: "姓名/名称",
+      },
+      {
+        prop: "zjzl",
+        label: "证件种类",
+        render: (h, scope) => {
+          return (
+            <el-select
+              class="width100"
+              clearable
+              value={scope.row[scope.column.property]}
+              onChange={(val) => {
+                scope.row[scope.column.property] = val;
+              }}
+            >
+              {vm.dictData["A30"].map((option) => {
+                return (
+                  <el-option
+                    label={option.dname}
+                    value={option.dcode}
+                  ></el-option>
+                );
+              })}
+            </el-select>
+          );
+        },
+      },
+      {
+        prop: "zjh",
+        label: "证件号",
+      },
+      {
+        prop: "frmc",
+        label: "法人名称",
+      },
+      {
+        prop: "txdz",
+        label: "地址",
+      },
+      {
+        prop: "dh",
+        label: "联系电话",
+      },
+      {
+        label: '操作',
+        width: '80',
+        align: 'center',
+        fixed: 'right',
+        render: (h, scope) => {
+          return (
+            <div>
+              <el-button type="text" onClick={() => { this.handlesGrSelect(scope.row) }}>使用</el-button>
+            </div>
+          )
+        }
+      },
+    ]
+  }
+
+}
+let dataGr = new data1()
+let dataQy = new data2()
+export {
+  dataGr,
+  dataQy,
+  sendThis
+}