改需求

06527d13 · 刘雅文 · 41449a11 · 06527d13 · 06527d13 · 06527d13
Commit 06527d13 authored Jul 13, 2022 by 刘雅文
8 changed files
--- a/src/components/byh/componments/ApplyInfo.vue
+++ b/src/components/byh/componments/ApplyInfo.vue
 <template>
  <div class="page-com">
-    <block-header :title="title"></block-header>
+    <!-- <block-header :title="title"></block-header> -->
    <table class="table">
      <tr>
        <td>申请日期:</td>
@@ -51,7 +51,7 @@ export default {
  props: {
    title: {
      type: String,
-      required: true,
+      required: false,
    },
    params: {
      type: Object,
@@ -76,8 +76,8 @@ export default {
    if(this.params){
      console.log(this.params,'哈哈');
      const {applyVo} = this.params;
-      this.loanModel = applyVo
+      this.loanModel = applyVo;
-      this.productNameFormat(this.loanModel.productName)
+      this.productNameFormat(this.loanModel.productName);
    }
  },

--- a/src/components/byh/componments/BillList.vue
+++ b/src/components/byh/componments/BillList.vue
 <template>
  <div class="page-com">
-    <block-header title="账单详情"/>
+    <!-- <block-header title="账单详情"/> -->
    <div class="block-box">
      <table class="table">
        <tr>
@@ -33,7 +33,7 @@
    </div>
    <div class="tables">
-      <block-header :title="title"></block-header>
+      <!-- <block-header :title="title"></block-header> -->
      <el-table
          @filter-change="handleFilterChange"
          border
@@ -162,7 +162,7 @@ export default {
  props: {
    title: {
      type: String,
-      required: true,
+      required: false,
    },
    params: {
      type: Object,

--- a/src/components/byh/componments/ContractList.vue
+++ b/src/components/byh/componments/ContractList.vue
 <template>
  <div class="page-com">
-    <block-header :title="title"></block-header>
+    <!-- <block-header :title="title"></block-header> -->
    <el-table
        border
        size="mini"
@@ -25,7 +25,7 @@ export default {
  props: {
    title: {
      type: String,
-      required: true,
+      required: false,
    },
    params: {
      type: Object,

--- a/src/components/byh/componments/LoanDetail copy.vue
+++ b/src/components/byh/componments/LoanDetail copy.vue
+<template>
+  <el-drawer
+    :title="title"
+    size="70%"
+    :wrapperClosable="false"
+    :visible.sync="dialogVisible"
+    direction="rtl"
+    :before-close="handleClose"
+  >
+    <div class="page">
+      <div class="loan-detail">
+        <el-tabs
+          class="loan-tabs"
+          tab-position="left"
+          v-model="activeComponents"
+          @tab-click="handleTabClick"
+        >
+          <el-tab-pane name="ApplyInfo" label="申请信息"></el-tab-pane>
+          <el-tab-pane
+            v-if="$permissionUtils.rolePermission('customBoss')"
+            name="ContractList"
+            label="借款合同"
+          ></el-tab-pane>
+          <el-tab-pane name="BillList" label="账单详情"></el-tab-pane>
+          <el-tab-pane name="RePayList" label="还款情况"></el-tab-pane>
+          <el-tab-pane name="ReliefList" label="减免记录"></el-tab-pane>
+        </el-tabs>
+        <div class="loan-detail-content">
+          <template v-if="visible">
+            <component
+              @handleClose="visible = false"
+              :is="activeComponents"
+              :params="items"
+              :title="dTitle"
+            />
+          </template>
+        </div>
+      </div>
+    </div>
+  </el-drawer>
+</template>
+<script>
+import BlockHeader from "@/components/byh/componments/blockHeader";
+import ApplyInfo from "./ApplyInfo";
+import ContractList from "./ContractList";
+import RePayList from "./RePayList";
+import BillList from "./BillList";
+import ReliefList from "./ReliefList";
+import * as moment from "moment";
+export default {
+  name: "AddUserServiceDialog",
+  components: {
+    BlockHeader,
+    ApplyInfo,
+    ContractList,
+    RePayList,
+    BillList,
+    ReliefList,
+  },
+  props: {
+    dialogVisible: {
+      type: Boolean,
+      required: true,
+    },
+    title: {
+      type: String,
+      required: true,
+    },
+    params: {
+      type: Object,
+      required: true,
+    },
+  },
+  data() {
+    return {
+      visible: false,
+      activeComponents: "",
+      dTitle: "",
+      active: "",
+      items: {},
+      loan: {},
+    };
+  },
+  async created() {
+    if (this.params) {
+      const { loanNo } = this.params;
+      this.items = this.params;
+      await this.initLoanInfo(loanNo);
+    }
+  },
+  methods: {
+    headerStyle() {
+      return "tableHeaderStyle";
+    },
+    //根据借款信息查借款所有信息
+    async initLoanInfo(loanNo) {
+      const res = await this.$$get("/detail/customer/" + loanNo);
+      const { success, result } = res.data;
+      if (success && result != null) {
+        this.loan = result;
+        this.handleTabClick({
+          name: "ApplyInfo",
+          label: "申请信息",
+        });
+      }
+    },
+    /*日期*/
+    dateFormats: function (row, column) {
+      let date = row[column.property];
+      if (date === undefined) return "";
+      return moment(date).format("YYYY-MM-DD");
+    },
+    handleClose() {
+      this.$emit("handleClose");
+    },
+    // 切换选项卡
+    handleTabClick(tab) {
+      this.activeComponents = tab.name;
+      this.visible = true;
+      this.dTitle = tab.label;
+      this.items = {
+        ...this.loan,
+        ...this.params,
+      };
+    },
+  },
+};
+</script>
+<style scoped lang="less">
+.page,
+.loan-detail {
+  height: 100%;
+  overflow: auto;
+}
+.page {
+  padding-right: 0;
+}
+.loan-detail {
+  display: flex;
+  position: relative;
+  .loan-tabs {
+    position: sticky;
+    top: 0;
+    right: 0;
+    width: 100px;
+  }
+  .loan-detail-content {
+    width: calc(100% - 100px);
+    box-sizing: border-box;
+    padding-left: 20px;
+  } .loan-detail-content {
+    width: calc(100% - 100px);
+    box-sizing: border-box;
+    padding-left: 20px;
+  }
+}
+</style>
--- a/src/components/byh/componments/LoanDetail.vue
+++ b/src/components/byh/componments/LoanDetail.vue
 <template>
+  <!-- 修改内容 -->
  <el-drawer
    :title="title"
    size="70%"
    :wrapperClosable="false"
    :visible.sync="dialogVisible"
    direction="rtl"
-      :before-close="handleClose">
+    :before-close="handleClose"
+  >
  <div class="page">
    <div class="loan-detail">
-        <el-tabs
+      <el-collapse  v-model="activeNames" @change="handleChange">
-            class="loan-tabs"
+        <el-collapse-item title="申请信息" name="1">
-            tab-position="left"
+          <ApplyInfo :params="items"></ApplyInfo>
-            v-model="activeComponents"
+        </el-collapse-item>
-            @tab-click="handleTabClick">
+        <el-collapse-item title="借款合同" name="2">
-          <el-tab-pane name="ApplyInfo" label="申请信息"></el-tab-pane>
+          <ContractList :params="items"
-          <el-tab-pane v-if="$permissionUtils.rolePermission('customBoss')" name="ContractList"
+            v-if="$permissionUtils.rolePermission('customBoss')"
-                       label="借款合同"></el-tab-pane>
+          ></ContractList>
-          <el-tab-pane name="BillList" label="账单详情"></el-tab-pane>
+        </el-collapse-item>
-          <el-tab-pane name="RePayList" label="还款情况"></el-tab-pane>
+        <el-collapse-item title="账单详情" name="3">
-          <el-tab-pane name="ReliefList" label="减免记录"></el-tab-pane>
+          <BillList  :params="items"></BillList>
-        </el-tabs>
+        </el-collapse-item>
-        <div class="loan-detail-content">
+        <el-collapse-item title="还款情况" name="4">
-          <template v-if="visible">
+          <RePayList  :params="items"></RePayList>
-            <component
+        </el-collapse-item>
-                @handleClose="visible = false"
+        <el-collapse-item title="减免记录" name="5">
-                :is="activeComponents"
+          <ReliefList  :params="items"></ReliefList>
-                :params="items"
+        </el-collapse-item>
-                :title="dTitle"/>
+      </el-collapse>
-          </template>
-        </div>
    </div>
  </div>
  </el-drawer>
@@ -44,46 +44,46 @@ import ReliefList from "./ReliefList";
 import * as moment from "moment";
 export default {
-  name: 'AddUserServiceDialog',
+  name: "AddUserServiceDialog",
  components: {
    BlockHeader,
    ApplyInfo,
    ContractList,
    RePayList,
    BillList,
-    ReliefList
+    ReliefList,
  },
  props: {
    dialogVisible: {
      type: Boolean,
      required: true,
    },
-    title: {
+    title:{
-      type: String,
+      type:String,
-      required: true,
+      required:true,
    },
    params: {
      type: Object,
-      required: true
+      required: true,
    },
  },
  data() {
    return {
      visible: false,
-      activeComponents: '',
-      dTitle: '',
      active: "",
      items: {},
-      loan: {}
+      loan: {},
-    }
+      activeNames: ["1"],
+    };
  },
  async created() {
    if (this.params) {
-      const {loanNo} = this.params;
+      const { loanNo } = this.params;
      this.items = this.params;
-      await this.initLoanInfo(loanNo)
+      console.log(this.items,'111');
-    }
+      await this.initLoanInfo(loanNo);
+    }
  },
  methods: {
    headerStyle() {
@@ -91,63 +91,56 @@ export default {
    },
    //根据借款信息查借款所有信息
    async initLoanInfo(loanNo) {
-      const res = await this.$$get('/detail/customer/' + loanNo);
+      const res = await this.$$get("/detail/customer/" + loanNo);
-      const {success, result} = res.data;
+      const { success, result } = res.data;
+      console.log(res.data,'222');
      if (success && result != null) {
        this.loan = result;
+        this.handleChange({
-        this.handleTabClick({
          name: "ApplyInfo",
-          label: "申请信息"
+          label: "申请信息",
        });
      }
    },
    /*日期*/
    dateFormats: function (row, column) {
-      let date = row[column.property]
+      let date = row[column.property];
-      if (date === undefined) return '';
+      if (date === undefined) return "";
-      return moment(date).format("YYYY-MM-DD")
+      return moment(date).format("YYYY-MM-DD");
    },
    handleClose() {
      this.$emit("handleClose");
    },
    // 切换选项卡
-    handleTabClick(tab) {
+    handleChange(val) {
-      this.activeComponents = tab.name;
+      console.log(val,'333');
-      this.visible = true;
-      this.dTitle = tab.label;
      this.items = {
        ...this.loan,
-        ...this.params
+        ...this.params,
      };
-    }
+    },
-  }
+  },
-}
+};
 </script>
 <style scoped lang="less">
-.page, .loan-detail {
+.page,
+.loan-detail {
  height: 100%;
  overflow: auto;
 }
-.page{
+.page {
  padding-right: 0;
 }
+.el-collapse {
+  width: 100%;
+}
 .loan-detail {
  display: flex;
  position: relative;
-  .loan-tabs {
+  .el-collapse-item {
-    position: sticky;
+    width:100%;
-    top: 0;
-    right: 0;
-    width: 100px;
-  }
-  .loan-detail-content {
-    width: calc(100% - 100px);
    box-sizing: border-box;
    padding-left: 20px;
  }

--- a/src/components/byh/componments/RePayList.vue
+++ b/src/components/byh/componments/RePayList.vue
 <template>
  <div class="page-com">
    <div class="tables">
-      <block-header :title="title"></block-header>
+      <!-- <block-header :title="title"></block-header> -->
      <el-table
          @filter-change="handleFilterChange"
          border
@@ -58,7 +58,7 @@ export default {
  props: {
    title: {
      type: String,
-      required: true,
+      required: false,
    },
    params: {
      type: Object,

--- a/src/components/byh/componments/ReliefList.vue
+++ b/src/components/byh/componments/ReliefList.vue
 <template>
  <div class="page-com">
    <div class="tables">
-      <block-header :title="title"></block-header>
+      <!-- <block-header :title="title"></block-header> -->
      <el-table
          @filter-change="handleFilterChange"
          border
@@ -53,7 +53,7 @@ export default {
  props: {
    title: {
      type: String,
-      required: true,
+      required: false,
    },
    params: {
      type: Object,

--- a/yarn.lock
+++ b/yarn.lock