提交 543358b0 编写于 作者: donghuawangliang0612's avatar donghuawangliang0612

试算修改

上级 57b0c8ce
...@@ -9,14 +9,14 @@ ...@@ -9,14 +9,14 @@
<template> <template>
<!-- <div> --> <!-- <div> -->
<div class="roolsolt" style="background-image:url(require('@/assets/images/mycard.png'))"> <div class="roolsolt">
<div > <div >
<van-row type="flex" class="title"> <van-row type="flex" class="title">
<van-col span="24" >累计贷款金额(元)</van-col> <van-col span="24" style="text-align: left">合同累计金额(元)</van-col>
</van-row> </van-row>
<van-row type="flex" class="mumMoney"> <van-row type="flex" class="mumMoney">
<van-col offset="4" span="11" class="money">100,000,00</van-col> <van-col span="24" class="money">100,000,00</van-col>
<van-col span="9" class="moneytitle">壹佰元整</van-col> <!-- <van-col span="9" class="moneytitle">壹佰元整</van-col>-->
</van-row> </van-row>
<!-- <van-row type="flex" class="title"> <!-- <van-row type="flex" class="title">
<van-col span="24" >已使用贷款金额(元)</van-col> <van-col span="24" >已使用贷款金额(元)</van-col>
...@@ -26,8 +26,12 @@ ...@@ -26,8 +26,12 @@
<van-col span="9" class="moneytitle">壹佰元整</van-col> <van-col span="9" class="moneytitle">壹佰元整</van-col>
</van-row> --> </van-row> -->
<van-row type="flex" justify="center" class="integral"> <van-row type="flex" justify="center" class="integral">
<van-col span="12">已使用贷款金额(元)</van-col> <van-col span="12" style="text-align: left; padding-left: 20px; color: #999999; font-size: 12px">合同已使用金额(元)</van-col>
<van-col span="12">6,0000壹佰元整</van-col> <van-col span="12" style="text-align: left; color: #999999; font-size: 12px">合同未使用金额(元)</van-col>
</van-row>
<van-row type="flex" justify="center" class="integral">
<van-col span="12" style="font-weight: 700; text-align: left; padding-left: 20px">1000000.00</van-col>
<van-col span="12" style="font-weight: 700; text-align: left">1000000.00</van-col>
</van-row> </van-row>
<!-- <van-row type="flex" justify="center" class="integrall"> <!-- <van-row type="flex" justify="center" class="integrall">
<van-col span="8">我的积分</van-col> <van-col span="8">我的积分</van-col>
...@@ -52,9 +56,10 @@ export default class CardPottom extends Vue { ...@@ -52,9 +56,10 @@ export default class CardPottom extends Vue {
</script> </script>
<style scoped lang="scss"> <style scoped lang="scss">
.roolsolt{ .roolsolt{
background-image:url("../../assets/images/mycard.png"); background:url("../../assets/images/mycard.png");
width:100%; width:100%;
height:40%; height:40%;
background-size: cover;
} }
.title { .title {
font-size: 14px; font-size: 14px;
...@@ -63,20 +68,22 @@ export default class CardPottom extends Vue { ...@@ -63,20 +68,22 @@ export default class CardPottom extends Vue {
font-weight: 400; font-weight: 400;
font-style: normal; font-style: normal;
color: #999999; color: #999999;
margin-left: 10%;
margin-top: 5%; margin-top: 5%;
margin-left: 20px;
} }
.mumMoney{ .mumMoney{
margin:5% auto;
} }
.money { .money {
font-family: '思源黑体 Bold', '思源黑体 Regular', '思源黑体', sans-serif; font-family: '思源黑体 Bold', '思源黑体 Regular', '思源黑体', sans-serif;
font-style: normal; font-style: normal;
font-weight: 700;
font-size: 28px; font-size: 28px;
color: #FF9921; color: #FF9921;
margin-left: 10%; text-align: left;
margin-left: 20px;
margin-top: -6px;
} }
.moneytitle { .moneytitle {
...@@ -96,7 +103,7 @@ export default class CardPottom extends Vue { ...@@ -96,7 +103,7 @@ export default class CardPottom extends Vue {
font-size: 16px; font-size: 16px;
letter-spacing: normal; letter-spacing: normal;
color: #333333; color: #333333;
margin-top: 4px;
} }
.integrall { .integrall {
......
...@@ -47,7 +47,7 @@ export default class LittleCard extends Vue { ...@@ -47,7 +47,7 @@ export default class LittleCard extends Vue {
</script> </script>
<style scoped lang="scss"> <style scoped lang="scss">
.d-tattle { .d-tattle {
margin-top: 28%; margin-top: 34%;
} }
.priductName{ .priductName{
padding-top: 2%; padding-top: 2%;
...@@ -69,7 +69,7 @@ export default class LittleCard extends Vue { ...@@ -69,7 +69,7 @@ export default class LittleCard extends Vue {
} }
.vanrow { .vanrow {
margin-top: 6%; margin-top: 3%;
margin-left: 2%; margin-left: 2%;
} }
......
...@@ -10,11 +10,16 @@ ...@@ -10,11 +10,16 @@
<template> <template>
<!-- <div> --> <!-- <div> -->
<div class ="d-tatle"> <div class ="d-tatle">
<van-row > <!-- <van-row >-->
<van-col span="9" v-if="tatleflag"><van-icon name="arrow-left" @click="retyen()" /></van-col> <!-- <van-col span="9" v-if="tatleflag"><van-icon name="arrow-left" @click="retyen()" /></van-col>-->
<van-col span="15">{{tatle}}</van-col> <!-- <van-col span="15">{{tatle}}</van-col>-->
<!-- <slot></slot>-->
<!-- </van-row>-->
<div style="padding-top: 12px; text-align: center; z-index: 0">
<span style="font-size: 18px; color: #FFFFFF">{{tatle}}</span>
</div>
<div style="z-index: 1; margin-top: -26px; margin-left: 4px"><span v-if="tatleflag" style="font-size: 18px; color: #FFFFFF"><van-icon name="arrow-left" @click="retyen()" /></span></div>
<slot></slot> <slot></slot>
</van-row>
</div> </div>
</template> </template>
......
...@@ -25,5 +25,19 @@ const depositInterestTrialRoutes = [ ...@@ -25,5 +25,19 @@ const depositInterestTrialRoutes = [
props: propsConvert, props: propsConvert,
meta: { keepAlive: false, requiresAuth: true, name: "试算结果" }, meta: { keepAlive: false, requiresAuth: true, name: "试算结果" },
}, },
{
path: `/DepositRate`,
name: 'DepositRate',
component: () => import(/* webpackChunkName: "customer-mgt" */ "@/views/DepositInterestTrial/DepositRate.vue"),
props: propsConvert,
meta: { keepAlive: false, requiresAuth: true, name: "存款利率" },
},
{
path: `/RepayPlan`,
name: 'RepayPlan',
component: () => import(/* webpackChunkName: "customer-mgt" */ "@/views/DepositInterestTrial/RepayPlan.vue"),
props: propsConvert,
meta: { keepAlive: false, requiresAuth: true, name: "还款计划" },
},
]; ];
export default depositInterestTrialRoutes; export default depositInterestTrialRoutes;
...@@ -10,23 +10,53 @@ ...@@ -10,23 +10,53 @@
</tatle-bar> </tatle-bar>
</div> </div>
<div class="card"> <div class="card">
<div style="margin-top: 4%;text-align: center"><span style="color: #9e9e9e">贷款利息试算金额</span></div> <div style="margin-top: 4%; margin-left: 20px"><span style="color: #9e9e9e">贷款利息(元)</span><span style="margin-left: 130px; color: #3672F1" @click="toSeeRepayPlan">查看还款计划</span></div>
<div style="margin-top: 4%;text-align: center;z-index: 1"><span style="color: #FFA121;font-size: 36px;font-family: '思源黑体 Bold', '思源黑体 Regular', '思源黑体'; <div style="margin-top: 0px; margin-left: 20px"><span style="color: #FFA121;font-size: 24px;font-family: '思源黑体 Bold', '思源黑体 Regular', '思源黑体';
font-weight: 700; font-weight: 700;
font-style: normal;">¥{{result}}</span></div> font-style: normal;">{{result}}</span></div>
<div style="margin-top: 4%;text-align: center"><span style="color: #FFA121">{{result}}</span></div> <div style="margin-top: 4%; margin-left: 20px"><span style="color: #9e9e9e">本息合计(元)</span></div>
<div class="d-flex" style="margin-top: 6%;margin-left: 5%;width: 90%"><span>贷款金额(元)</span><span style="margin-left: auto">{{loanAmt}}</span></div> <div style="margin-top: 0px; margin-left: 20px"><span style="color: #FFA121;font-size: 24px;font-family: '思源黑体 Bold', '思源黑体 Regular', '思源黑体';
<div class="d-flex" style="margin-top: 6%;margin-left: 5%;width: 90%"><span>贷款期限(月)</span><span style="margin-left: auto">{{loanTime}}</span></div> font-weight: 700;
<div class="d-flex" style="margin-top: 6%;margin-left: 5%;margin-bottom: 6%;width: 90%"><span>贷款利率(%)</span><span style="margin-left: auto">{{loanRate}}</span></div> font-style: normal;">{{resultPlus}}</span></div>
<div class="d-flex" style="margin-top: -2%;margin-left: 5%;margin-bottom: 6%;width: 90%"><span>计划月还款(元)</span><span style="margin-left: auto">{{result/loanTime}}</span></div> </div>
<!-- <div class="d-flex" style="margin-top: -2%;margin-left: 5%;margin-bottom: 6%;width: 90%"><span>贷款种类</span><span style="margin-left: auto">一般经营贷款</span></div>--> <div style="margin-top: 50px; margin-left: 30px; margin-right: 30px">
<div class="d-flex" style="margin-top: -2%;margin-left: 5%;margin-bottom: 6%;width: 90%"><span>还款方式</span><span style="margin-left: auto">{{choice}}</span></div> <van-row>
<div style="margin-top: 17%;height: 20%;position: absolute;width: 100%;align-self: center;z-index: 0"> <van-col span="12" style="color: #999999">贷款金额(元)</van-col>
<van-divider v-for="count in 12" :key="count" style="background-color: #c6c8ca;margin-top: -11px;margin-left: 10%;height: 0.5px;width: 80%;"/> <van-col span="12" style="text-align: right">{{loanAmt}}</van-col>
</van-row>
</div>
<div style="margin-top: 20px; margin-left: 30px; margin-right: 30px">
<van-row>
<van-col span="12" style="color: #999999">贷款期限(月)</van-col>
<van-col span="12" style="text-align: right">{{loanTime}}</van-col>
</van-row>
</div>
<div style="margin-top: 20px; margin-left: 30px; margin-right: 30px">
<van-row>
<van-col span="12" style="color: #999999">贷款利率(%)</van-col>
<van-col span="12" style="text-align: right">{{loanRate}}</van-col>
</van-row>
</div> </div>
<div style="margin-top: 20px; margin-left: 30px; margin-right: 30px">
<van-row>
<van-col span="12" style="color: #999999">计划月还款</van-col>
<van-col span="12" style="text-align: right">{{planMonthRepay}}</van-col>
</van-row>
</div> </div>
<van-button style="width: 90%;margin-left: 5%;background-color: #1890ff;position: absolute;margin-top: 86%;height: 6%;border-radius: 5px;" type="primary">确定</van-button> <div style="margin-top: 20px; margin-left: 30px; margin-right: 30px">
<van-button style="width: 90%;margin-left: 5%;position: absolute;margin-top: 102%;height: 6%;border-radius: 5px;border-color: #1890ff" @click="returnCount"><span style="color: #1890ff">重新计算</span></van-button> <van-row>
<van-col span="12" style="color: #999999">贷款种类</van-col>
<van-col span="12" style="text-align: right">{{loanType}}</van-col>
</van-row>
</div>
<div style="margin-top: 20px; margin-left: 30px; margin-right: 30px">
<van-row>
<van-col span="12" style="color: #999999">还款方式</van-col>
<van-col span="12" style="text-align: right">{{repayType}}</van-col>
</van-row>
</div>
<van-button style="width: 90%;margin-left: 5%;background-color: #1890ff;position: absolute;margin-top: 16%;height: 6%;border-radius: 5px;" type="primary">确定</van-button>
<van-button style="width: 90%;margin-left: 5%;position: absolute;margin-top: 28%;height: 6%;border-radius: 5px;border-color: #1890ff" @click="returnCount"><span style="color: #1890ff">重新计算</span></van-button>
</div> </div>
</div> </div>
</template> </template>
...@@ -37,23 +67,32 @@ import {Component, Prop, Vue} from "vue-property-decorator"; ...@@ -37,23 +67,32 @@ import {Component, Prop, Vue} from "vue-property-decorator";
name: "CountResult", name: "CountResult",
}) })
export default class CountResult extends Vue{ export default class CountResult extends Vue{
choice=""; resultPlus="";
result=""; result="";
loanAmt=""; loanAmt="";
loanRate=""; loanRate="";
planMonthRepay = "";
loanTime=""; loanTime="";
repayType = "";
loanType = "";
titleName="试算结果"; titleName="试算结果";
titleflag=true; titleflag=true;
mounted() { mounted() {
this.result = this.$route.params.result; this.result = this.$route.params.result;
this.loanAmt = this.$route.params.loanAmt; this.loanAmt = this.$route.params.loanAmt;
this.resultPlus = (parseInt(this.result) + parseInt(this.loanAmt)).toString();
this.loanRate = this.$route.params.loanRate; this.loanRate = this.$route.params.loanRate;
this.loanTime = this.$route.params.loanTime; this.loanTime = this.$route.params.loanTime;
this.choice = this.$route.params.choice; this.repayType = this.$route.params.repayType;
this.planMonthRepay = this.$route.params.planMonthRepay;
this.loanType = this.$route.params.loanType;
} }
returnCount() { returnCount() {
this.$router.back();
}
toSeeRepayPlan() {
this.$router.push({ this.$router.push({
name: "DepositInterestTrial", name: "RepayPlan",
}); });
} }
} }
......
...@@ -10,21 +10,47 @@ ...@@ -10,21 +10,47 @@
</tatle-bar> </tatle-bar>
</div> </div>
<div class="card"> <div class="card">
<div style="margin-top: 4%;text-align: center"><span style="color: #9e9e9e">存款收益后账户金额</span></div> <div style="margin-top: 4%; margin-left: 20px"><span style="color: #9e9e9e">所得利息(元)</span></div>
<div style="margin-top: 4%;text-align: center;z-index: 1"><span style="color: #FFA121;font-size: 36px;font-family: '思源黑体 Bold', '思源黑体 Regular', '思源黑体'; <div style="margin-top: 0px; margin-left: 20px"><span style="color: #FFA121;font-size: 24px;font-family: '思源黑体 Bold', '思源黑体 Regular', '思源黑体';
font-weight: 700; font-weight: 700;
font-style: normal;">¥{{countResult}}</span></div> font-style: normal;">{{countResult}}</span></div>
<div style="margin-top: 4%;text-align: center"><span style="color: #FFA121">{{countResult}}</span></div> <div style="margin-top: 4%; margin-left: 20px"><span style="color: #9e9e9e">本息合计(元)</span></div>
<div class="d-flex" style="margin-top: 6%;margin-left: 5%;width: 90%"><span>存款金额(元)</span><span style="margin-left: auto">{{depositAmt}}</span></div> <div style="margin-top: 0px; margin-left: 20px"><span style="color: #FFA121;font-size: 24px;font-family: '思源黑体 Bold', '思源黑体 Regular', '思源黑体';
<div class="d-flex" style="margin-top: 6%;margin-left: 5%;width: 90%"><span>存款时长(月)</span><span style="margin-left: auto">{{depositTime}}</span></div> font-weight: 700;
<div class="d-flex" style="margin-top: 6%;margin-left: 5%;margin-bottom: 6%;width: 90%"><span>存款利率(%)</span><span style="margin-left: auto">{{depositRate}}</span></div> font-style: normal;">{{result}}</span></div>
<div class="d-flex" style="margin-top: -2%;margin-left: 5%;margin-bottom: 6%;width: 90%"><span>共计收益(元)</span><span style="margin-left: auto">{{countResult-depositAmt}}</span></div> </div>
<div style="margin-top: 17%;height: 20%;position: absolute;width: 100%;align-self: center;z-index: 0"> <div style="margin-top: 50px; margin-left: 30px; margin-right: 30px">
<van-divider v-for="count in 12" :key="count" style="background-color: #c6c8ca;margin-top: -11px;margin-left: 10%;height: 0.5px;width: 80%;"/> <van-row>
<van-col span="12" style="color: #999999">储蓄方式</van-col>
<van-col span="12" style="text-align: right">{{saveType}}</van-col>
</van-row>
</div>
<div style="margin-top: 20px; margin-left: 30px; margin-right: 30px">
<van-row>
<van-col span="12" style="color: #999999">定期类型</van-col>
<van-col span="12" style="text-align: right">{{timeType}}</van-col>
</van-row>
</div>
<div style="margin-top: 20px; margin-left: 30px; margin-right: 30px">
<van-row>
<van-col span="12" style="color: #999999">期限</van-col>
<van-col span="12" style="text-align: right">{{time}}</van-col>
</van-row>
</div>
<div style="margin-top: 20px; margin-left: 30px; margin-right: 30px">
<van-row>
<van-col span="12" style="color: #999999">年利率(%)</van-col>
<van-col span="12" style="text-align: right">{{yearRate}}</van-col>
</van-row>
</div> </div>
<div style="margin-top: 20px; margin-left: 30px; margin-right: 30px">
<van-row>
<van-col span="12" style="color: #999999">存入金额(元)</van-col>
<van-col span="12" style="text-align: right">{{depositAmt}}</van-col>
</van-row>
</div> </div>
<van-button style="width: 90%;margin-left: 5%;background-color: #1890ff;position: absolute;margin-top: 86%;height: 6%;border-radius: 5px;" type="primary">确定</van-button> <van-button style="width: 90%;margin-left: 5%;background-color: #1890ff;position: absolute;margin-top: 26%;height: 6%;border-radius: 5px;" type="primary">确定</van-button>
<van-button style="width: 90%;margin-left: 5%;position: absolute;margin-top: 102%;height: 6%;border-radius: 5px;border-color: #1890ff" @click="returnCount"><span style="color: #1890ff">重新计算</span></van-button> <van-button style="width: 90%;margin-left: 5%;position: absolute;margin-top: 40%;height: 6%;border-radius: 5px;border-color: #1890ff" @click="returnCount"><span style="color: #1890ff">重新计算</span></van-button>
</div> </div>
</div> </div>
</template> </template>
...@@ -35,10 +61,13 @@ import {Component, Prop, Vue} from "vue-property-decorator"; ...@@ -35,10 +61,13 @@ import {Component, Prop, Vue} from "vue-property-decorator";
name: "CountResultB", name: "CountResultB",
}) })
export default class CountResultB extends Vue{ export default class CountResultB extends Vue{
countResult=""; result="0";
depositAmt=""; countResult="100";
depositTime=""; saveType="";
depositRate=""; timeType="";
time="";
yearRate="";
depositAmt= "";
titleName="试算结果"; titleName="试算结果";
titleflag=true; titleflag=true;
returnCount() { returnCount() {
...@@ -47,10 +76,13 @@ export default class CountResultB extends Vue{ ...@@ -47,10 +76,13 @@ export default class CountResultB extends Vue{
}); });
} }
mounted() { mounted() {
this.countResult = this.$route.params.countResult; this.saveType = this.$route.params.saveType;
this.timeType = this.$route.params.timeType;
this.time = this.$route.params.time=="1"?"一年":this.$route.params.time=="2"?"两年":"三年";
this.yearRate = this.$route.params.yearRate;
this.depositAmt = this.$route.params.depositAmt; this.depositAmt = this.$route.params.depositAmt;
this.depositTime = parseInt(this.$route.params.depositTime).toString(); this.countResult = this.$route.params.result;
this.depositRate = this.$route.params.depositRate; this.result = (parseInt(this.$route.params.result)+parseInt(this.depositAmt)).toString();
} }
} }
</script> </script>
......
/**
* @Author wangliang
* @date 20220825
*/
<template>
<div class="body d-page" style="background-color: #ffffff">
<div class="rarle">
<tatle-bar :tatle="tatleName"></tatle-bar>
</div>
<div style="background-color: #FFFFFF; height: 50px">
<van-row span="24">
<van-col span="12" style="text-align: center; margin-top: 10px">项目</van-col>
<van-col span="12" style="text-align: center; margin-top: 10px">年利率(%)</van-col>
</van-row>
</div>
<div style="background-color: rgba(241, 244, 255, 1); height: 40px; padding-top: 10px">
<span style="font-size: 14px; font-weight: 700; margin-left: 14px">一、城乡居民及单位存款</span>
</div>
<div style="background-color: #FFFFFF; height: 40px">
<van-row span="24">
<van-col span="12" style="text-align: center; margin-top: 10px">(一)&nbsp;&nbsp;活期</van-col>
<van-col span="12" style="text-align: center; margin-top: 10px">0.3</van-col>
</van-row>
</div>
<div style="background-color: rgba(241, 244, 255, 1); height: 40px">
<van-row span="24">
<van-col span="12" style="text-align: center; margin-top: 10px">(一)&nbsp;&nbsp;定期</van-col>
</van-row>
</div>
<div style="background-color: #FFFFFF; height: 40px">
<van-row span="24">
<van-col span="12" style="text-align: center; margin-top: 10px; color: red">1.整存整取</van-col>
</van-row>
</div>
<div style="background-color: rgba(241, 244, 255, 1); height: 40px">
<van-row span="24">
<van-col span="12" style="text-align: center; margin-top: 10px">三个月</van-col>
<van-col span="12" style="text-align: center; margin-top: 10px">1.35</van-col>
</van-row>
</div>
<div style="background-color: #FFFFFF; height: 40px">
<van-row span="24">
<van-col span="12" style="text-align: center; margin-top: 10px">半年</van-col>
<van-col span="12" style="text-align: center; margin-top: 10px">1.55</van-col>
</van-row>
</div>
<div style="background-color: rgba(241, 244, 255, 1); height: 40px">
<van-row span="24">
<van-col span="12" style="text-align: center; margin-top: 10px">一年</van-col>
<van-col span="12" style="text-align: center; margin-top: 10px">1.75</van-col>
</van-row>
</div>
<div style="background-color: #FFFFFF; height: 40px">
<van-row span="24">
<van-col span="12" style="text-align: center; margin-top: 10px">两年</van-col>
<van-col span="12" style="text-align: center; margin-top: 10px">2.25</van-col>
</van-row>
</div>
<div style="background-color: rgba(241, 244, 255, 1); height: 40px">
<van-row span="24">
<van-col span="12" style="text-align: center; margin-top: 10px">三年</van-col>
<van-col span="12" style="text-align: center; margin-top: 10px">2.75</van-col>
</van-row>
</div>
<div style="background-color: #FFFFFF; height: 40px">
<van-row span="24">
<van-col span="12" style="text-align: center; margin-top: 10px">五年</van-col>
<van-col span="12" style="text-align: center; margin-top: 10px">2.75</van-col>
</van-row>
</div>
<div style="background-color: rgba(241, 244, 255, 1); height: 40px; padding-top: 10px; padding-left: 60px">
<span style="color: red">2.零存整取、整存零取、存本取息</span>
</div>
<div style="background-color: #FFFFFF; height: 40px">
<van-row span="24">
<van-col span="12" style="text-align: center; margin-top: 10px">一年</van-col>
<van-col span="12" style="text-align: center; margin-top: 10px">1.35</van-col>
</van-row>
</div>
<div style="background-color: rgba(241, 244, 255, 1); height: 40px">
<van-row span="24">
<van-col span="12" style="text-align: center; margin-top: 10px">三年</van-col>
<van-col span="12" style="text-align: center; margin-top: 10px">1.55</van-col>
</van-row>
</div>
<div style="background-color: #FFFFFF; height: 40px">
<van-row span="24">
<van-col span="12" style="text-align: center; margin-top: 10px">五年</van-col>
<van-col span="12" style="text-align: center; margin-top: 10px">1.55</van-col>
</van-row>
</div>
</div>
</template>
<script lang="ts">
import {Component, Vue} from "vue-property-decorator";
@Component({
name: "DepositRate"
})
export default class DepositRate extends Vue {
tatleName="人民币存款基准利率";
}
</script>
<style scoped lang="scss">
</style>
<!--
@Author wangliang
@date 20220826
-->
<template>
<div class="body d-page" style="background-color: #ffffff">
<div class="rarle">
<tatle-bar :tatle="tatleName"></tatle-bar>
</div>
<a-table :columns="columns" :row-key="(record) => record.times" :data-source="repayPlans">
</a-table>
</div>
</template>
<script lang="ts">
import {Component, Vue} from "vue-property-decorator";
@Component({
name: "RepayPlan"
})
export default class RepayPlan extends Vue{
tatleName="还款计划";
columns: any[] = [
{title: "期次", dataIndex: "times", className: "fontSize", ellipsis: true, align: "center"},
{title: "还款日期", dataIndex: "repayDate", className: "fontSize", ellipsis: true, align: "center"},
{title: "偿还利息", dataIndex: "repayInterest", className: "fontSize", ellipsis: true, align: "center"},
{title: "偿还本金", dataIndex: "repayCapital", className: "fontSize", ellipsis: true, align: "center"},
{title: "偿还本息", dataIndex: "repayAmt", className: "fontSize", ellipsis: true, align: "center"},
{title: "剩余本金", dataIndex: "surplusAmt", className: "fontSize", ellipsis: true, align: "center"},
];
repayPlans: any[] = [
{times: "1", repayDate: "20220707", repayInterest: "100", repayCapital: "100", repayAmt: "100", surplusAmt: "100"},
{times: "2", repayDate: "20220707", repayInterest: "100", repayCapital: "100", repayAmt: "100", surplusAmt: "100"},
{times: "3", repayDate: "20220707", repayInterest: "100", repayCapital: "100", repayAmt: "100", surplusAmt: "100"},
{times: "4", repayDate: "20220707", repayInterest: "100", repayCapital: "100", repayAmt: "100", surplusAmt: "100"},
{times: "5", repayDate: "20220707", repayInterest: "100", repayCapital: "100", repayAmt: "100", surplusAmt: "100"},
{times: "6", repayDate: "20220707", repayInterest: "100", repayCapital: "100", repayAmt: "100", surplusAmt: "100"},
{times: "7", repayDate: "20220707", repayInterest: "100", repayCapital: "100", repayAmt: "100", surplusAmt: "100"},
{times: "8", repayDate: "20220707", repayInterest: "100", repayCapital: "100", repayAmt: "100", surplusAmt: "100"},
{times: "9", repayDate: "20220707", repayInterest: "100", repayCapital: "100", repayAmt: "100", surplusAmt: "100"},
{times: "10", repayDate: "20220707", repayInterest: "100", repayCapital: "100", repayAmt: "100", surplusAmt: "100"},
{times: "11", repayDate: "20220707", repayInterest: "100", repayCapital: "100", repayAmt: "100", surplusAmt: "100"},
{times: "12", repayDate: "20220707", repayInterest: "100", repayCapital: "100", repayAmt: "100", surplusAmt: "100"},
{times: "13", repayDate: "20220707", repayInterest: "100", repayCapital: "100", repayAmt: "100", surplusAmt: "100"},
];
}
</script>
<style scoped lang="scss">
::v-deep .ant-table-thead > tr > th, ::v-deep .ant-table-tbody > tr > td {
padding: 16px 0px;
overflow-wrap: break-word;
}
::v-deep .fontSize {
font-size: 12px;
}
</style>
export class Test { export class Test {
depositAmt: string; depositAmt: string; //存款金额
depositRate: string; yearRate: string;
putDate: string; putDate: string;
getDate: string; getDate: string;
saveType: string | undefined;
timeType: string | undefined;
time: string | undefined;
constructor( constructor(
options: { options: {
depositAmt?: string; depositAmt?: string;
depositRate?: string; yearRate?: string;
putDate?: string; putDate?: string;
getDate?: string; getDate?: string;
saveType?: string | undefined;
timeType?: string | undefined;
time?: string | undefined;
} = {} } = {}
) { ) {
this.depositAmt = options.depositAmt || ""; this.depositAmt = options.depositAmt || "";
this.depositRate = options.depositRate || ""; this.yearRate = options.yearRate || "";
this.putDate = options.putDate || ""; this.putDate = options.putDate || "";
this.getDate = options.getDate || ""; this.getDate = options.getDate || "";
this.saveType = options.saveType;
this.timeType = options.timeType;
this.time = options.time;
} }
} }
...@@ -12,6 +12,18 @@ ...@@ -12,6 +12,18 @@
<person-bar :title="tatleName" :param="param" :login="true" style="width:100%;height: calc(35vh);"> <person-bar :title="tatleName" :param="param" :login="true" style="width:100%;height: calc(35vh);">
</person-bar> </person-bar>
</div> </div>
<div style="margin-top: 160px; position: absolute; width: 100%">
<van-row span="24">
<van-col span="8" style="text-align: center; color: #FFFFFF; font-weight: 600">2456</van-col>
<van-col span="8" style="text-align: center; color: #FFFFFF; font-weight: 600">12</van-col>
<van-col span="8" style="text-align: center; color: #FFFFFF; font-weight: 600">10</van-col>
</van-row>
<van-row span="24">
<van-col span="8" style="text-align: center; color: #FFFFFF">我的积分</van-col>
<van-col span="8" style="text-align: center; color: #FFFFFF">卡券</van-col>
<van-col span="8" style="text-align: center; color: #FFFFFF">特权</van-col>
</van-row>
</div>
<div> <div>
<card-bar class="card"></card-bar> <card-bar class="card"></card-bar>
<!-- <uncard-bar class="card"></uncard-bar> --> <!-- <uncard-bar class="card"></uncard-bar> -->
...@@ -108,11 +120,11 @@ export default class MyPage extends Vue { ...@@ -108,11 +120,11 @@ export default class MyPage extends Vue {
.card { .card {
position: absolute; position: absolute;
top: 21%; top: 30%;
left: 3%; left: 3%;
right: 3%; right: 3%;
width: 90%; width: 90%;
height: 25%; height: 20%;
margin: 2% auto; margin: 2% auto;
border-radius: 15px; border-radius: 15px;
display: flex; display: flex;
......
...@@ -8,7 +8,7 @@ ...@@ -8,7 +8,7 @@
<!--上部分--> <!--上部分-->
<div style="width:100%;height: calc(35vh);background: linear-gradient(90deg, #76befa 0%, #3672f1 99%);"> <div style="width:100%;height: calc(35vh);background: linear-gradient(90deg, #76befa 0%, #3672f1 99%);">
<tatle-bar :tatle="titleName" :tatleflag="titleflag" > <tatle-bar :tatle="titleName" :tatleflag="titleflag" >
<van-col span="15" class="jfNumber">2134</van-col> <div class="jfNumber">2134</div>
</tatle-bar> </tatle-bar>
</div> </div>
......
Markdown 格式
0% or
您添加了 0 到此讨论。请谨慎行事。
先完成此消息的编辑!
想要评论请 注册