<!-- * @Author: wangliang * @date 20220727 --> <template> <div> <div class="rarle"> <div style="width:100%;height: calc(25vh);background: linear-gradient(#0B54E0 50px , #ffffff);"> <tatle-bar :tatle="titleName" :tatleflag="titleflag" style="background: #0B54E0" > </tatle-bar> </div> <div class="card"> <div style="margin-top: 27px; margin-left: 20px"><span style="color: #9e9e9e">贷款利息(元)</span><span v-if="flag" style="margin-left: 130px; color: #3672F1" @click="toSeeRepayPlan">查看还款计划</span></div> <div style="margin-top: 0px; margin-left: 20px"><span style="color: #FFA121;font-size: 24px;font-family: '思源黑体 Bold', '思源黑体 Regular', '思源黑体'; font-weight: 700; font-style: normal;">{{result}}</span></div> <div style="margin-top: 4%; margin-left: 20px"><span style="color: #9e9e9e">本息合计(元)</span></div> <div style="margin-top: 0px; margin-left: 20px"><span style="color: #FFA121;font-size: 24px;font-family: '思源黑体 Bold', '思源黑体 Regular', '思源黑体'; font-weight: 700; font-style: normal;">{{resultPlus}}</span></div> </div> <div style="margin-top: 125px; 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">{{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 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 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">{{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> <!-- <div style="margin-top:20px;"> --> <van-button style="width: 90%;margin-left: 5%;margin-top:30px;background-color: #3672F1;border-radius: 5px;border:0px;" type="primary" @click="returnCount">确定</van-button> <!-- </div> --> <!-- <div style="margin-top:20px;"> --> <van-button style="width: 90%;margin-left: 5%;margin-top:20px;border-radius: 5px;border-color: #3672F1" @click="returnCountReset"><span style="color: #3672F1">重新计算</span></van-button> <!-- </div> --> </div> </div> </template> <script lang="ts"> import {Component, Prop, Vue} from "vue-property-decorator"; import router from "@/router"; import VueRouter, { Route, RouteConfig } from "vue-router"; import {RouteMeta} from "vue-router/types/router"; import eventBus from "@/services/goBackEntity"; Vue.use(VueRouter); @Component({ name: "CountResult", }) export default class CountResult extends Vue{ resultData:any={}; flag=true; resultPlus:any=""; result:any=""; loanAmt:any=""; loanRate:any=""; planMonthRepay = ""; loanTime:any=""; repayType:any = ""; loanType = ""; titleName="试算结果"; titleflag=true; mounted() { if(this.$route.params.routeName=="aaa"){ this.result = this.$route.params.result; this.loanAmt = this.$route.params.loanAmt; this.resultPlus = (parseInt(this.result) + parseInt(this.loanAmt)).toString(); this.loanRate = this.$route.params.loanRate; this.loanTime = this.$route.params.loanTime; this.repayType = this.$route.params.repayType; }else{ this.result = window.localStorage.getItem("result"); this.loanAmt= window.localStorage.getItem("loanAmt"); this.resultPlus=window.localStorage.getItem("resultPlus"); this.loanRate=window.localStorage.getItem("loanRate"); this.loanTime=window.localStorage.getItem("loanTime"); this.repayType=window.localStorage.getItem("repayType"); } if(this.repayType=="利随本清"){ this.flag=false; } } //router.beforeEach((to,from,next) => {}); //beforeRouteLeave(to:any,from,next){} // mounted() { // this.result = window.localStorage.getItem("result"); // //this.result = "1100"; // this.loanAmt= window.localStorage.getItem("loanAmt"); // this.resultPlus=window.localStorage.getItem("resultPlus"); // this.loanRate=window.localStorage.getItem("loanRate"); // this.loanTime=window.localStorage.getItem("loanTime"); // this.repayType=window.localStorage.getItem("repayType"); // let getStoreData = this.$store.getters["CountResultStore/getResultData"]; // console.log("获取到getStoreData的数据"); // console.log(getStoreData); // } returnCount() { this.$router.back(); } returnCountReset() { // this.$router.push({ // name: "DepositInterestTrial", // params: { // reset: "1", // }, // }); eventBus.$emit("reset",-1); this.$router.back(); } toSeeRepayPlan() { window.localStorage.setItem("result",this.result); window.localStorage.setItem("loanAmt",this.loanAmt); window.localStorage.setItem("resultPlus",this.resultPlus); window.localStorage.setItem("loanRate",this.loanRate); window.localStorage.setItem("loanTime",this.loanTime); window.localStorage.setItem("repayType",this.repayType); // this.resultData.result = this.result; // this.resultData.loanAmt = this.loanAmt; // this.resultData.resultPlus = this.resultPlus; // this.resultData.loanRate = this.loanRate; // this.resultData.loanTime = this.loanTime; // this.resultData.repayType = this.repayType; //this.$store.commit("CountResultStore/setResultData",this.resultData); this.$router.push({ name: "RepayPlan", }); } } </script> <style scoped lang="scss"> ::v-deep .card{ position: absolute; background-color: #ffffff; width: 90%; margin-left: 5%; margin-top: -12vh; height: 180px; border-radius: 10px; } </style>