2.申办业务时查看个人的报告信息（信息待定）

project/xiushan/apps/finance/AppLoanAudit/loanDetail.vue

@@ -32,7 +32,12 @@
                 </el-form-item>
                 <el-form-item label="资金用途">{{ dict.getLabel('financialFundPurpose', detail.fundPurpose) }}
                 </el-form-item>
-                <el-form-item label="联系人">{{ detail.name }}</el-form-item>
+                <el-form-item label="联系人">
+                  <el-row type="flex">
+                    {{ detail.name }}
+                    <person-credit-report :person="detail" :instance="instance" :dict="dict"/>
+                  </el-row>
+                </el-form-item>
                 <el-form-item label="身份证号">{{ detail.idNumber }}</el-form-item>
                 <el-form-item label="联系方式">{{ detail.phone }}</el-form-item>
                 <el-form-item label="申请时间">{{ detail.createTime }}</el-form-item>
@@ -94,16 +99,24 @@
         <el-button @click="isShow=false">关闭</el-button>
       </template>
     </ai-dialog>
+    <ai-dialog class="dialog" :title="detail.enterpriseName||'企业详情'" :visible.sync="isShow" width="1200px" customFooter>
+      <enterprise-dialog v-if="detail.enterpriseId" :enterprise-id="detail.enterpriseId" :instance="instance"
+                         :dict="dict"/>
+      <template #footer>
+        <el-button @click="isShow=false">关闭</el-button>
+      </template>
+    </ai-dialog>
   </section>
 </template>
 
 <script>
 import {mapState} from "vuex";
 import EnterpriseDialog from "../../../components/enterpriseDialog";
+import PersonCreditReport from "../../../components/personCreditReport";
 
 export default {
   name: "loanDetail",
-  components: {EnterpriseDialog},
+  components: {PersonCreditReport, EnterpriseDialog},
   props: {
     instance: Function,
     dict: Object,
@@ -133,7 +146,8 @@ export default {
         loanDate: [{required: true, message: "请选择 放款日期"}],
         auditDescription: [{required: true, message: "请输入 审批意见"}],
       },
-      isShow: false
+      isShow: false,
+      personCR: false
     }
   },
   methods: {

project/xiushan/apps/financing/AppGrabLog/grabDetail.vue

@@ -23,13 +23,15 @@
                 </el-form-item>
                 <el-form-item label="企业主体" v-if="detail.applyType==1">
                   {{ detail.enterpriseName }}
-                  <el-link type="primary"
+                  <el-link type="primary" @click="showEnterpriseDetail=true">
-                           @click="showEnterpriseDetail=true">
                     企业详情
                   </el-link>
                 </el-form-item>
                 <el-form-item v-else/>
-                <el-form-item label="联系人">{{ detail.createUserName }}</el-form-item>
+                <el-form-item label="联系人">
+                  {{ detail.createUserName }}
+                  <person-credit-report :person="detail" :instance="instance" :dict="dict"/>
+                </el-form-item>
                 <el-form-item label="所在地区">{{ detail.areaName }}</el-form-item>
                 <el-form-item label="联系方式">{{ detail.phone }}</el-form-item>
                 <el-form-item label="身份证号">{{ detail.idNumber }}</el-form-item>
@@ -85,10 +87,11 @@
 <script>
 import {mapState} from "vuex";
 import EnterpriseDialog from "../../../components/enterpriseDialog";
+import PersonCreditReport from "../../../components/personCreditReport";
 
 export default {
   name: "grabDetail",
-  components: {EnterpriseDialog},
+  components: {PersonCreditReport, EnterpriseDialog},
   props: {
     instance: Function,
     dict: Object,

project/xiushan/components/personCreditReport.vue

@@ -0,0 +1,215 @@
+<template>
+  <section class="personCreditReport">
+    <el-link v-if="hasIdNumber" type="primary" @click.stop="handleShow">个人产权</el-link>
+    <el-dialog :visible.sync="dialog" title="个人产权信息" width="1200px" customFooter>
+      <div class="top">
+        <div class="top-left">
+          <el-image v-if="info.avatar"/>
+          <div v-else v-html="txtLogo"/>
+        </div>
+        <div class="top-right">
+          <div class="top-right__top">
+            <h2 v-text="person.name"/>
+          </div>
+          <div class="top-right__bottom">
+            <ai-wrapper
+                label-width="130px">
+              <ai-info-item label="手机号码：" :value="person.phone"/>
+              <ai-info-item label="身份证号：" :value="person.idNumber"/>
+            </ai-wrapper>
+          </div>
+        </div>
+      </div>
+      <el-tabs type="border-card" stretch>
+        <el-tab-pane label="企业信息">
+          <ai-table :dict="dict" :tableData="info.enterpriseList" :col-configs="colConfigs1"
+                    :isShowPagination="false" border tableSize="small"/>
+        </el-tab-pane>
+        <el-tab-pane label="宅基地信息" lazy>
+          <ai-table :dict="dict" :tableData="info.homesteadInfoList" :col-configs="colConfigs2"
+                    :isShowPagination="false" border tableSize="small"/>
+        </el-tab-pane>
+        <el-tab-pane label="集体经济组织股权" lazy>
+          <ai-table :dict="dict" :tableData="info.shareholderList" :col-configs="colConfigs3"
+                    :isShowPagination="false" border tableSize="small"/>
+        </el-tab-pane>
+        <el-tab-pane label="土地流转经营" lazy>
+          <ai-table :dict="dict" :tableData="info.landCirculateInfoList" :col-configs="colConfigs4"
+                    :isShowPagination="false" border tableSize="small"/>
+        </el-tab-pane>
+      </el-tabs>
+      <template #footer>
+        <el-button @click.stop="dialog=false">关闭</el-button>
+      </template>
+    </el-dialog>
+  </section>
+</template>
+
+<script>
+import {mapState} from "vuex";
+
+export default {
+  name: "personCreditReport",
+  computed: {
+    ...mapState(['user']),
+    isFinanceUser() {
+      return !!this.user.financeUser?.id
+    },
+    txtLogo() {
+      return this.person.name?.substring(0, 1) || ""
+    },
+    hasIdNumber() {
+      return !!this.person.idNumber
+    }
+  },
+  data() {
+    return {
+      dialog: false,
+      info: {},
+      currIndex: 0,
+      colConfigs1: [
+        {prop: 'enterpriseName', label: '企业名称'},
+        {prop: 'enterpriseType', label: '企业类型', dict: "enterpriseType", align: 'center'},
+        {prop: 'areaName', label: '所属区域', align: 'center'},
+        {prop: 'businessScope', label: '经营范围', align: 'center'},
+        {prop: 'operationPeriod', label: '营业期限', align: 'center'},
+      ],
+      colConfigs2: [
+        {prop: 'usePerson', label: '使用人'},
+        {prop: 'houseNumber', label: '家庭人口', align: 'center'},
+        {prop: 'areaName', label: '所在地区', align: 'center'},
+        {prop: 'landArea', label: '土地面积/㎡', align: 'center'},
+        {prop: 'landOwnership', label: '土地所有权', align: 'center'},
+      ],
+      colConfigs3: [
+        {prop: 'organizationName', label: '集体经济组织名称'},
+        {prop: 'areaName', align: 'center', label: '所在地区'},
+        {prop: 'name', align: 'center', label: '持股人'},
+        {prop: 'shareholdingNumber', align: 'center', label: '股权总数'},
+        {prop: 'shareholdingAmount', align: 'center', label: '股金总额'}
+      ],
+      colConfigs4: [
+        {prop: 'landOutflowType', label: '土地流出方'},
+        {prop: 'landArea', align: 'center', label: '土地面积/㎡'},
+        {prop: 'landUndertakeType', align: 'center', label: '土地承接方'},
+        {prop: 'circulateType', align: 'center', label: '流转形式'},
+        {prop: 'startDate', align: 'center', label: '开始日期'},
+      ],
+    }
+  },
+  created() {
+    this.dict.load("enterpriseType")
+  },
+  methods: {
+    getPCR() {
+      let {idNumber, createUserId: id} = this.person
+      return this.instance.post(`/appportaluser/queryPersonPropertyRight`, null, {
+        params: {idNumber, id}
+      }).then(res => {
+        if (res?.data) {
+          return this.info = res.data
+        }
+      })
+    },
+    handleShow() {
+      this.getPCR().then(() => this.dialog = true)
+    }
+  },
+  props: {
+    instance: Function,
+    dict: Object,
+    permissions: Function,
+    person: {required: true, default: () => ({})}
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.personCreditReport {
+  margin-left: 16px;
+
+  .table-item {
+    h2 {
+      margin-bottom: 16px;
+      color: #333333;
+      font-size: 18px;
+      font-weight: 600;
+    }
+  }
+
+  .top {
+    display: flex;
+    margin-bottom: 20px;
+    padding: 34px 30px 16px;
+    border: 1px solid #EEEEEE;
+    border-radius: 4px;
+
+    .top-left {
+      margin-right: 16px;
+      padding: 12px 16px;
+      background: #8CA3CD;
+      color: #FFFFFF;
+      font-size: 22px;
+      line-height: 30px;
+      border-radius: 8px;
+      height: fit-content;
+    }
+
+    .top-right {
+      flex: 1;
+
+      .top-right__top {
+        display: flex;
+        align-items: center;
+        justify-content: space-between;
+        margin-bottom: 16px;
+
+        h2 {
+          color: #333333;
+          font-size: 22px;
+        }
+
+        .right {
+          display: flex;
+          align-items: center;
+          justify-content: center;
+          width: 97px;
+          height: 32px;
+          background: #E8F4FF;
+          border: 1px solid #A3D3FF;
+          border-radius: 3px;
+          color: #1890FF;
+          font-size: 13px;
+          cursor: pointer;
+
+          &:hover {
+            opacity: 0.6;
+          }
+        }
+      }
+
+      .top-right__bottom {
+        padding: 16px 10px 10px 0;
+        background: #F6FBFF;
+      }
+    }
+  }
+
+  ::v-deep.el-tabs {
+    .el-tabs__header {
+      padding: unset;
+
+      .el-tabs__item {
+        background: #f3f6f9;
+        border-bottom-color: #ddd;
+        margin-left: 0;
+
+        &.is-active {
+          background: #fff;
+          border-bottom-color: transparent;
+        }
+      }
+    }
+  }
+}
+</style>