贷款审批调整界面

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

@@ -24,7 +24,7 @@ export default {
     }
   },
   created() {
-    this.dict.load("productRepaymentTimeline", "financialFundPurpose", "enterpriseAuditStatus", "financialLoanApplyStatus")
+    this.dict.load("productRepaymentTimeline", "financialFundPurpose", "enterpriseAuditStatus", "financialLoanApplyStatus","financialOrganizationType")
   }
 }
 </script>

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

@@ -1,44 +1,46 @@
 <template>
   <section class="loanList">
-    <ai-detail>
+    <ai-list tabs>
-      <ai-title slot="title" title="贷款审核" isShowBottomBorder/>
+      <ai-title slot="title" title="贷款审核"/>
-      <template #content>
+      <template #tabs>
-        <el-row type="flex">
+        <el-tabs>
-          <div class="staCard fill" v-for="(op,label) in sta" :key="label">
+          <el-tab-pane label="信贷审核">
-            <h2 v-text="op"/>
+            <ai-card hideTitle class="mar-t16">
-            <span v-text="label"/>
+              <template #content>
-          </div>
+                <ai-search-bar class="mar-t8">
-        </el-row>
+                  <template #left>
-        <ai-card hideTitle>
+                    <ai-select placeholder="机构类型" :selectList="dict.getDict('financialOrganizationType')"
-          <template #content>
+                               v-model="search.organizationType" @change="page.current=1,getTableData()"/>
-            <ai-search-bar class="mar-t8">
+                    <ai-select placeholder="审批状态" :selectList="dict.getDict('financialLoanApplyStatus')"
-              <template #left>
+                               v-model="search.status" @change="page.current=1,getTableData()"/>
-                <ai-select v-model="search.status" :selectList="dict.getDict('financialLoanApplyStatus')"
+                    <ai-search label="申请时间">
-                           placeholder="审批状态"
+                      <el-date-picker size="small" v-model="search.applyTime" type="daterange"
-                           @change="page.current=1,getTableData()"/>
+                                      @change="handleFilterApplyTime"
-                <ai-search label="申请时间">
+                                      :default-time="['00:00:00','23:59:59']" value-format="yyyy-MM-dd HH:mm:ss"/>
-                  <el-date-picker size="small" v-model="search.applyTime" type="daterange"
+                    </ai-search>
-                                  @change="handleFilterApplyTime"
+                  </template>
-                                  :default-time="['00:00:00','23:59:59']" value-format="yyyy-MM-dd HH:mm:ss"/>
+                  <template #right>
-                </ai-search>
+                    <el-input size="small" placeholder="搜索产品名称、身份证、企业、贷款机构" v-model="search.enterpriseName" clearable
+                              @change="page.current=1,getTableData()"/>
+                  </template>
+                </ai-search-bar>
+                <ai-table :tableData="tableData" :total="page.total" :current.sync="page.current" :size.sync="page.size"
+                          @getList="getTableData" :col-configs="colConfigs" :dict="dict">
+                  <el-table-column slot="options" label="操作" fixed="right" align="center">
+                    <template slot-scope="{row}">
+                      <el-button type="text" @click="showDetail(row.id)">详情</el-button>
+                    </template>
+                  </el-table-column>
+                </ai-table>
               </template>
-              <template #right>
+            </ai-card>
-                <el-input size="small" placeholder="搜索产品名称、企业主体、贷款银行" v-model="search.enterpriseName" clearable
+          </el-tab-pane>
-                          @change="page.current=1,getTableData()"/>
+          <el-tab-pane label="信贷统计" lazy>
-              </template>
+
-            </ai-search-bar>
+          </el-tab-pane>
-            <ai-table :tableData="tableData" :total="page.total" :current.sync="page.current" :size.sync="page.size"
+        </el-tabs>
-                      @getList="getTableData" :col-configs="colConfigs" :dict="dict">
-              <el-table-column slot="options" label="操作" fixed="right" align="center">
-                <template slot-scope="{row}">
-                  <el-button type="text" @click="showDetail(row.id)">详情</el-button>
-                </template>
-              </el-table-column>
-            </ai-table>
-          </template>
-        </ai-card>
       </template>
-    </ai-detail>
+    </ai-list>
   </section>
 </template>
 
@@ -53,25 +55,28 @@ export default {
     permissions: Function
   },
   computed: {
-    ...mapState(['user'])
+    ...mapState(['user']),
+    colConfigs() {
+      return [
+        {label: "产品名称", prop: "productName"},
+        {label: "联系人", prop: "name"},
+        {label: "联系方式", prop: "phone"},
+        {label: "身份证号", render: (h, {row}) => h('p', this.idCardNoUtil.hideId(row.idNumber)), width: 160},
+        {label: "企业主体", prop: "enterpriseName"},
+        {label: "贷款金额(万)", prop: "loanAmount"},
+        {label: "申请时间", prop: "createTime"},
+        {label: "贷款机构", prop: "organizationName"},
+        {label: "机构类型", prop: "organizationType", dict: "financialOrganizationType"},
+        {label: "状态", prop: "status", align: "center", dict: "financialLoanApplyStatus"},
+        {slot: "options"}
+      ]
+    }
   },
   data() {
     return {
       search: {name: ""},
       page: {current: 1, size: 10, total: 0},
-      tableData: [],
+      tableData: []
-      colConfigs: [
-        {label: "产品名称", prop: "productName"},
-        {label: "企业主体", prop: "enterpriseName"},
-        {label: "贷款金额(万)", prop: "loanAmount"},
-        {label: "申请时间", prop: "createTime"},
-        {label: "联系人", prop: "name"},
-        {label: "联系方式", prop: "phone"},
-        {label: "贷款银行", prop: "organizationName"},
-        {label: "状态", prop: "status", align: "center", dict: "financialLoanApplyStatus"},
-        {slot: "options"}
-      ],
-      sta: {}
     }
   },
   methods: {
@@ -94,17 +99,9 @@ export default {
       this.search.applyEndDate = this.search.applyTime?.[1].substring(0, 10)
       this.getTableData()
     },
-    getStaData() {
-      this.instance.post("/appfinancialloanapply/staticFinancialLoanApply").then(res => {
-        if (res?.data) {
-          this.sta = res.data
-        }
-      })
-    }
   },
   created() {
     this.getTableData()
-    this.getStaData()
   }
 }
 </script>
@@ -117,14 +114,22 @@ export default {
     margin-top: 8px;
   }
 
+  .mar-t16 {
+    margin-top: 16px;
+  }
+
   .staCard {
     text-align: center;
-    margin: 0 8px 16px;
+    margin: 0 16px 16px 0;
     box-shadow: 0 4px 6px -2px rgba(15, 15, 21, 0.15);
     border-radius: 4px;
     padding: 16px;
     box-sizing: border-box;
     background: #fff;
+
+    &:last-of-type {
+      margin-right: 0;
+    }
   }
 }
 </style>