From 866f292bc1c3f343d992779e33ad235f51add07e Mon Sep 17 00:00:00 2001
From: wangliang <wangliang0612@dhcc.com.cn>
Date: Thu, 15 Sep 2022 15:03:25 +0800
Subject: [PATCH] =?UTF-8?q?=E4=B8=8B=E6=8B=89=E5=88=B7=E6=96=B0=E9=A1=B5?=
 =?UTF-8?q?=E9=9D=A2=E6=94=B9=E5=A5=BD,=E4=B8=80=E4=BA=9B=E9=A1=B5?=
 =?UTF-8?q?=E9=9D=A2=E8=B0=83=E6=95=B4?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/common/PicketAcced.vue   |  24 ++--
 src/components/general/ScrollerView.vue |   4 +-
 src/router/workbench.routing.ts         |   7 ++
 src/views/workbench/AccommodDetails.vue |   2 +-
 src/views/workbench/AccommodMain.vue    |   4 +-
 src/views/workbench/Accommodation.vue   |  20 ++--
 src/views/workbench/BillDetails.vue     | 142 ++++++++++++++++++++++++
 7 files changed, 176 insertions(+), 27 deletions(-)
 create mode 100644 src/views/workbench/BillDetails.vue

diff --git a/src/components/common/PicketAcced.vue b/src/components/common/PicketAcced.vue
index 45a2312..37a14fb 100644
--- a/src/components/common/PicketAcced.vue
+++ b/src/components/common/PicketAcced.vue
@@ -16,21 +16,21 @@
 
             <van-col span="24" class="priductName">{{ item.productname }}</van-col>
             <van-col style="    width: 100%; margin-left: 8%; line-height: 2;">
-              <van-row gutter="20">
-                <van-col span="12" class="lable"><span>申请金额：万元</span></van-col>
-                <van-col span="12" class="money" style="color:rgb(255, 204, 0);">{{ item.money }}</van-col>
+              <van-row gutter="10">
+                <van-col span="10" class="lable"><span>借款金额</span></van-col>
+                <van-col span="14" class="money" style="color:#FBAF20;font-size: 14px">{{ item.money }}</van-col>
               </van-row>
-              <van-row gutter="20">
-                <van-col span="12" class="lable"><span>担保方式</span></van-col>
-                <van-col span="12" class="guarantee">{{ item.guarantee }}</van-col>
+              <van-row gutter="10">
+                <van-col span="10" class="lable"><span>担保方式</span></van-col>
+                <van-col span="14" class="guarantee">{{ item.guarantee }}</van-col>
               </van-row>
-              <van-row gutter="20">
-                <van-col span="12" class="lable"><span>申请日期（月）</span></van-col>
-                <van-col span="12" class="month">{{ item.month }}</van-col>
+              <van-row gutter="10">
+                <van-col span="10" class="lable"><span>借款日期</span></van-col>
+                <van-col span="14" class="month">{{ item.month }}</van-col>
               </van-row>
-              <van-row>
-                <van-col span="12" class="lable"><span>申请时间</span></van-col>
-                <van-col span="12" class="time">{{ item.time }}</van-col>
+              <van-row gutter="10">
+                <van-col span="10" class="lable"><span>到期日期</span></van-col>
+                <van-col span="14" class="time">{{ item.time }}</van-col>
               </van-row>
 
             </van-col>
diff --git a/src/components/general/ScrollerView.vue b/src/components/general/ScrollerView.vue
index ed6ec36..6732d32 100644
--- a/src/components/general/ScrollerView.vue
+++ b/src/components/general/ScrollerView.vue
@@ -54,7 +54,7 @@ export default class ScrollerView extends Vue {
   /**
    * 滚动高度
    */
-  @Prop({ default: 0 }) height: number | undefined;
+  @Prop({ default: "" }) height: string | undefined;
   /**
    * 是否派发滚动到底部的事件，用于上拉加载
    */
@@ -179,7 +179,7 @@ export default class ScrollerView extends Vue {
   initHeight() {
     const el: any = this.$el;
     if (this.height) {
-      el.style.height = this.height + "vh";
+      el.style.height = this.height;
     }
   }
 }
diff --git a/src/router/workbench.routing.ts b/src/router/workbench.routing.ts
index 923f99e..b243aff 100644
--- a/src/router/workbench.routing.ts
+++ b/src/router/workbench.routing.ts
@@ -11,6 +11,13 @@ import { propsConvert } from "@/services/props-convert";
 const prefix = "/workbench";
 
 const workbenchRoutes = [
+  {
+    path: `/BillDetails`,
+    name: 'BillDetails',
+    component: () => import(/* webpackChunkName: "customer-mgt" */ "@/views/workbench/BillDetails.vue"),
+    props: propsConvert,
+    meta: { keepAlive: false, requiresAuth: true, name: "借据详情" },
+  },
   {
     path: `/ContractDetail`,
     name: 'ContractDetail',
diff --git a/src/views/workbench/AccommodDetails.vue b/src/views/workbench/AccommodDetails.vue
index cf8a204..51c7487 100644
--- a/src/views/workbench/AccommodDetails.vue
+++ b/src/views/workbench/AccommodDetails.vue
@@ -209,7 +209,7 @@ export default class AccommodDetails extends Vue {
   intentionOrg="哈尔滨农信社松北区枝江大道分社"
   businessArea="黑龙江省-哈尔滨市-松北区"
   loanType="一般经营性贷款"
-  tatleName = "我的贷款"
+  tatleName = "贷款详情"
   //状态
   status = 2;
   statusl: any ;
diff --git a/src/views/workbench/AccommodMain.vue b/src/views/workbench/AccommodMain.vue
index 981c486..d91a72d 100644
--- a/src/views/workbench/AccommodMain.vue
+++ b/src/views/workbench/AccommodMain.vue
@@ -12,8 +12,8 @@
     <div class="rarle">
       <tatle-bar :tatle="tatleName"></tatle-bar>
     </div>
-    <div style="height: calc(100vh - 200vh);">
-      <scroller-view :pullup="true" :pulldown="true" :height="100">
+    <div>
+      <scroller-view :pullup="true" :pulldown="true" height="calc(100vh - 50px)">
       <div class="cardA" v-for="(item, index) in productParam" :key="index">
         <div>
           <van-row @click="onClickDetails(item)">
diff --git a/src/views/workbench/Accommodation.vue b/src/views/workbench/Accommodation.vue
index 473ff66..15444d9 100644
--- a/src/views/workbench/Accommodation.vue
+++ b/src/views/workbench/Accommodation.vue
@@ -39,34 +39,34 @@ export default class Accommodation extends Vue {
   tatleName = "我的贷款"
   //未结清贷款计划
   productParam = [{
-    productname: "'企业之星'流动之星贷款",
-    money: "30",
+    productname: "1192 8746 2774 5038",
+    money: "￥30,000,000.00",
     guarantee: "担保",
-    month: "12",
+    month: "2022-02-18",
     status: 1,
     time: "2022-02-18"
   }, {
-    productname: "'企业之星'流动之星贷款",
-    money: "30",
+    productname: "1192 8746 2774 5038",
+    money: "￥30,000,000.00",
     guarantee: "担保",
-    month: "12",
+    month: "2022-02-18",
     status: 1,
     time: "2022-02-18"
   }]
   //已结清
   productParamlist = [{
-    productname: "'llll'流动之星贷款",
-    money: "30",
+    productname: "1192 8746 2774 5038",
+    money: "￥30,000,000.00",
     guarantee: "担保",
     status: 3,
-    month: "12",
+    month: "2022-02-18",
     time: "2022-02-18"
   }]
 
   //点击还款计划事件
   onClickDetails(status:any) {
     this.$router.push({
-      name: "AccommodDetails",
+      name: "BillDetails",
       params:{
         status:status
       }
diff --git a/src/views/workbench/BillDetails.vue b/src/views/workbench/BillDetails.vue
new file mode 100644
index 0000000..aeafa9d
--- /dev/null
+++ b/src/views/workbench/BillDetails.vue
@@ -0,0 +1,142 @@
+<template>
+  <div class="body">
+    <div class="rarle">
+      <tatle-bar :tatle="tatleName"></tatle-bar>
+    </div>
+    <div class="layout">
+      <van-row type="flex" class="CoolName">
+        <van-col span="24" class="coollayout">个人信息</van-col>
+      </van-row>
+      <div class="layoutbody">
+        <van-row type="flex" class="layoutName">
+          <van-col span="24">
+            <van-cell-group>
+              <van-field label="姓名" :value="name" readonly input-align="right" />
+            </van-cell-group>
+          </van-col>
+        </van-row>
+        <van-row type="flex" class="layoutName">
+          <van-col span="24">
+            <van-cell-group>
+              <van-field label="身份证号" :value="idCard" readonly input-align="right" />
+            </van-cell-group>
+          </van-col>
+        </van-row>
+        <van-row type="flex" class="layoutName">
+          <van-col span="24">
+            <van-cell-group>
+              <van-field label="手机号码" :value="phone" readonly input-align="right" />
+            </van-cell-group>
+          </van-col>
+        </van-row>
+      </div>
+      <van-row type="flex" class="CoolName">
+        <van-col span="24" class="coollayout">借款信息</van-col>
+      </van-row>
+      <div class="layoutbody">
+        <van-row type="flex" class="layoutName">
+          <van-col span="24">
+            <van-cell-group>
+              <van-field label="贷款账号" :value="loanNo" readonly input-align="right" />
+            </van-cell-group>
+          </van-col>
+        </van-row>
+        <van-row type="flex" class="layoutName">
+          <van-col span="24">
+            <van-cell-group>
+              <van-field label="借款金额" :value="loanAmt" readonly input-align="right" />
+            </van-cell-group>
+          </van-col>
+        </van-row>
+        <van-row type="flex" class="layoutName">
+          <van-col span="24">
+            <van-cell-group>
+              <van-field label="借款日期" :value="loanStartDate" readonly input-align="right" />
+            </van-cell-group>
+          </van-col>
+        </van-row>
+        <van-row type="flex" class="layoutName">
+          <van-col span="24">
+            <van-cell-group>
+              <van-field label="到期日期" :value="loanEndDate" readonly input-align="right" />
+            </van-cell-group>
+          </van-col>
+        </van-row>
+        <van-row type="flex" class="layoutName">
+          <van-col span="24">
+            <van-cell-group>
+              <van-field label="借款用途" :value="loanUse" readonly input-align="right" />
+            </van-cell-group>
+          </van-col>
+        </van-row>
+        <van-row type="flex" class="layoutName">
+          <van-col span="24">
+            <van-cell-group>
+              <van-field label="担保方式" :value="grtType" readonly input-align="right" />
+            </van-cell-group>
+          </van-col>
+        </van-row>
+        <van-row type="flex" class="layoutName">
+          <van-col span="24">
+            <van-cell-group>
+              <van-field label="还款方式" label-width="120" :value="repayType" readonly input-align="right" />
+            </van-cell-group>
+          </van-col>
+        </van-row>
+        <van-row type="flex" class="layoutName">
+          <van-col span="24">
+            <van-cell-group>
+              <van-field label="借款利率" label-width="120" :value="loanRate" readonly input-align="right" />
+            </van-cell-group>
+          </van-col>
+        </van-row>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+import {Component, Vue} from "vue-property-decorator";
+@Component({
+  name: "BillDetails"
+})
+export default class BillDetails extends Vue{
+  tatleName = "借据详情";
+  name = "刘明明";
+  idCard = "122323232323232323";
+  phone = "13223232323";
+  loanNo = "3746 8827 8849 0002";
+  loanAmt = "￥5,000,000.00";
+  loanStartDate = "2022-09-01";
+  loanEndDate = "2022-09-09";
+  loanUse = "企业经营";
+  grtType = "抵押";
+  repayType = "等额本息";
+  loanRate = "5.51%";
+}
+</script>
+
+<style scoped lang="scss">
+.layout {
+  background: rgba(249, 249, 249, 1);
+}
+
+.coollayout {
+  margin: 3%;
+}
+
+.CoolName {
+  font-family: 'Arial Negreta', 'Arial Normal', 'Arial';
+  font-weight: 700;
+  font-style: normal;
+  font-size: 16px;
+}
+
+.layoutName {
+  font-family: 'Arial Normal', 'Arial';
+  font-weight: 400;
+  font-style: normal;
+  font-size: 13px;
+  color: #333333;
+}
+</style>
-- 
2.22.0