Commit d6f1c52d authored by 李晓兵's avatar 李晓兵

Merge branch 'develop' of https://hel.hand-china.com/xugong/hls-xcmg-vue-app into develop

parents 8585fa3a cfc44b72
......@@ -13,7 +13,7 @@
<div class="title">当前应付</div>
<div class="data">
<span></span>
{{ moneyToFix |currency }}
{{ money |currency }}
</div>
</div>
</div>
......@@ -27,7 +27,7 @@
</div>
<div class="pay-input">
<span>应还首付款</span>
<input v-model="moneyToFix" type="text" placeholder="请输入支付金额" >
<input v-model="money" type="text" placeholder="请输入支付金额" >
<div @click="createOrder">
<img src="@/assets/payment/into.png" >
</div>
......@@ -73,11 +73,6 @@ export default {
}
})
},
computed: {
moneyToFix () {
return parseFloat(this.money).toFixed(2)
},
},
watch: {},
methods: {
getDownPayment () {
......@@ -90,8 +85,8 @@ export default {
vm.$post(url, param).then(function (res) {
vm.hlsPopup.hideLoading()
if (res.result === 'S') {
vm.money = res.info.down_payment
vm.default = res.info.down_payment
vm.money = parseFloat(res.info.down_payment).toFixed(2)
vm.default = parseFloat(res.info.down_payment).toFixed(2)
} else {
hlsPopup.showLongCenter(res.message)
}
......
......@@ -178,7 +178,6 @@ export default {
data () {
return {
money: '',
rate: 0.03,
select: 'three0',
name: '',
sectctNong: false,
......@@ -201,6 +200,9 @@ export default {
serviceCharge () {
return (this.money * (this.rate / 100)).toFixed(2)
},
rate () {
return this.checkType.bank_full_name.indexOf('农业') !== -1 ? 0.00 : 0.18
},
sumMoney () {
return (parseFloat(this.serviceCharge) + parseFloat(this.money)).toFixed(
2
......@@ -372,18 +374,18 @@ export default {
.down {
height: 466px;
width: 100%;
position: absolute;
bottom: 0px;
position: relative;
bottom: -18%;
background-color: #fff;
border-radius: 12px 12px 0 0;
overflow: scroll;
.top {
position: fixed;
left: 24px;
padding-left:24px;
width: 330px;
height: 54px;
display: flex;
z-index: 999;
z-index: 900;
align-items: center;
background-color: #fff;
img {
......@@ -399,9 +401,70 @@ export default {
}
}
.info {
margin-top: 60px;
width: 100%;
height: 226px;
background-color: #fff;
margin-top:65px;
.info-item {
height: 46px;
width: 335px;
margin: 0 auto;
position: relative;
display: flex;
justify-content: space-between;
align-items: center;
.arrow {
margin-right: -10px;
}
img {
width: 17px;
margin-right: 10px;
}
span:first-child {
font-family: PingFangSC-Regular;
font-size: 14px;
color: rgba(56, 63, 69, 0.6);
letter-spacing: 0;
line-height: 18px;
}
span:last-child {
font-family: Verdana;
font-size: 14px;
color: #383f45;
letter-spacing: 0;
line-height: 18px;
display: flex;
align-items: center;
}
}
.info-item:nth-of-type(1)::after {
content: "";
display: block;
position: absolute;
right: 20px;
top: 25px;
border: 10px solid #fff;
border-left-color: transparent;
border-right-color: transparent;
border-top-color: transparent;
border-bottom-color: rgba(75, 74, 75, 0.1);
}
.info-item:nth-of-type(1) {
border-top: 1px solid #d9dbdf;
}
.interest {
width: 100%;
height: 37px;
line-height: 37px;
font-family: PingFangSC-Medium;
font-size: 11px;
color: #4b4a4b;
letter-spacing: 0;
text-indent: 215px;
background-color: rgba(75, 74, 75, 0.1);
}
}
}
}
.modal-show-bank {
width: 100%;
......@@ -415,14 +478,14 @@ export default {
.down {
height: 466px;
width: 100%;
position: absolute;
bottom: 0px;
position: relative;
bottom: -18%;
background-color: #fff;
border-radius: 12px 12px 0 0;
overflow: scroll;
.top {
position: fixed;
left: 24px;
padding-left: 24px;
width: 330px;
height: 54px;
display: flex;
......@@ -488,75 +551,13 @@ export default {
}
}
}
.info {
width: 100%;
height: 226px;
background-color: #fff;
.info-item {
height: 46px;
width: 335px;
margin: 0 auto;
position: relative;
display: flex;
justify-content: space-between;
align-items: center;
.arrow {
margin-right: -10px;
}
img {
width: 17px;
margin-right: 10px;
}
span:first-child {
font-family: PingFangSC-Regular;
font-size: 14px;
color: rgba(56, 63, 69, 0.6);
letter-spacing: 0;
line-height: 18px;
}
span:last-child {
font-family: Verdana;
font-size: 14px;
color: #383f45;
letter-spacing: 0;
line-height: 18px;
display: flex;
align-items: center;
}
}
.info-item:nth-of-type(1)::after {
content: "";
display: block;
position: absolute;
right: 20px;
top: 25px;
border: 10px solid #fff;
border-left-color: transparent;
border-right-color: transparent;
border-top-color: transparent;
border-bottom-color: rgba(75, 74, 75, 0.1);
}
.info-item:nth-of-type(1) {
border-top: 1px solid #d9dbdf;
}
.interest {
width: 100%;
height: 37px;
line-height: 37px;
font-family: PingFangSC-Medium;
font-size: 11px;
color: #4b4a4b;
letter-spacing: 0;
text-indent: 215px;
background-color: rgba(75, 74, 75, 0.1);
}
}
.modal-show {
width: 100%;
height: 100%;
position: absolute;
display: flex;
z-index: 999;
z-index: 910;
background-color: rgba(56, 63, 69, 0.3);
justify-content: center;
align-items: center;
......@@ -630,6 +631,69 @@ export default {
margin-top: 10px;
}
}
.info {
width: 100%;
height: 226px;
background-color: #fff;
.info-item {
height: 46px;
width: 335px;
margin: 0 auto;
position: relative;
display: flex;
justify-content: space-between;
align-items: center;
.arrow {
margin-right: -10px;
}
img {
width: 17px;
margin-right: 10px;
}
span:first-child {
font-family: PingFangSC-Regular;
font-size: 14px;
color: rgba(56, 63, 69, 0.6);
letter-spacing: 0;
line-height: 18px;
}
span:last-child {
font-family: Verdana;
font-size: 14px;
color: #383f45;
letter-spacing: 0;
line-height: 18px;
display: flex;
align-items: center;
}
}
.info-item:nth-of-type(1)::after {
content: "";
display: block;
position: absolute;
right: 20px;
top: 25px;
border: 10px solid #fff;
border-left-color: transparent;
border-right-color: transparent;
border-top-color: transparent;
border-bottom-color: rgba(75, 74, 75, 0.1);
}
.info-item:nth-of-type(1) {
border-top: 1px solid #d9dbdf;
}
.interest {
width: 100%;
height: 37px;
line-height: 37px;
font-family: PingFangSC-Medium;
font-size: 11px;
color: #4b4a4b;
letter-spacing: 0;
text-indent: 215px;
background-color: rgba(75, 74, 75, 0.1);
}
}
}
.foot {
background-color: @headerColor;
......
<template>
<h-view id="payment-first-pay" class="public-style">
<h-header :proportion="[5,1,1]" class="bar-custom">
<div slot="left" class="h-header-btn">
<img src="@/assets/userBind/arrow.png" @click="goHome">
<span>还款明细</span>
</div>
</h-header>
<div class="center">
<div class="now-pay">
<div>当前应付</div>
<div><span></span>{{ money |currency }}</div>
</div>
</div>
<h-content style="margin-top:-1px">
<div class="pay-money">
<div class="pay-icon"><img src="@/assets/payment/first-pay.png" alt="">租金支付</div>
<div class="pay-input">
<span>应还租金</span>
<input v-model="pay_rent" type="text" placeholder="请输入支付金额">
<div @click="createOrder"><i class="icon ion-ios-arrow-right"/></div>
</div>
</div>
<div class="pay-money">
<div class="pay-icon"><img src="@/assets/payment/first-pay.png" alt="">逾期利息</div>
<div class="pay-input">
<span>应还利息</span>
<input v-model="liquidated_damages" readonly type="text" placeholder="请输入支付金额">
</div>
</div>
</h-content>
<div class="prompt">
<div><img src="@/assets/payment/prompt.png" alt=""></div>
<div>
<p>温馨提示</p>
<p>推荐使用农行卡,农行卡支付免收手续费!</p>
</div>
</div>
<bottom-tab>
<tab-button class="footer" @click.native="toPay">
&nbsp;&nbsp;
</tab-button>
</bottom-tab>
</h-view>
</template>
<script>
export default {
name: 'PaymentFirstPay',
components: {
},
data () {
return {
money: 0,
liquidated_damages: 0,
pay_rent: 0,
}
},
beforeRouteEnter (to, from, next) {
next(vm => {
if (from.name === 'MyInfo') {
vm.getRent()
} else if (from.name === 'Success') {
vm.money = parseInt(vm.default) - parseInt(window.sessionStorage.getItem('money'))
vm.default = vm.money
vm.pay_rent = vm.money
}
})
},
computed: {},
watch: {
'pay_rent': {
handler () {
this.money = parseFloat(parseFloat(this.pay_rent) + parseFloat(this.liquidated_damages))
},
immediate: true,
},
},
activated () {
// this.money = this.pay_rent
},
methods: {
goHome () {
this.$router.replace({
name: 'MyInfo',
})
},
getRent () {
let vm = this
let url = process.env.basePath + 'rent_repayment_query'
let param = {
bp_id: window.sessionStorage.getItem('bp_id'),
}
hlsPopup.showLoading('请稍候')
vm.$post(url, param).then(function (res) {
vm.hlsPopup.hideLoading()
if (res.result === 'S') {
vm.default = parseFloat(res.info.rental_amount) + parseFloat(res.info.overdue_amount)
vm.pay_rent = res.info.rental_amount
vm.liquidated_damages = res.info.overdue_amount
} else {
hlsPopup.showLongCenter(res.message)
}
})
},
toPay () {
let vm = this
let url = process.env.basePath + 'create_order_1_amount'
let param = {
info: {
bp_id: window.sessionStorage.getItem('bp_id'),
},
}
hlsPopup.showLoading('请稍候')
vm.$post(url, param).then(function (res) {
vm.hlsPopup.hideLoading()
if (res.result === 'S') {
vm.toPayEntry(vm.money)
} else {
hlsPopup.showLongCenter(res.message)
}
})
},
createOrder () {
let vm = this
let url = process.env.basePath + 'do_order_1_con'
let param = {
info: {
bp_id: window.sessionStorage.getItem('bp_id'),
},
}
hlsPopup.showLoading('请稍候')
vm.$post(url, param).then(function (res) {
vm.hlsPopup.hideLoading()
if (res.result === 'S') {
window.sessionStorage.setItem('order_id', res.order_id)
vm.toContractRecord(vm.liquidated_damages)
} else {
hlsPopup.showLongCenter(res.message)
}
})
},
toPayEntry () {
this.$router.push({
name: 'PaymentPayEntry',
params: {
money: this.money,
},
})
},
toContractRecord (money) {
this.$router.push({
name: 'PaymentContractRecord',
params: {
money: this.liquidated_damages,
},
})
},
},
}
</script>
<style lang='less' >
#payment-first-pay {
.h-header {
background-color: #00469C;
.h-header-btn {
img {
width: 16px;
height: 16px;
margin-left: 4px;
}
span {
font-family: PingFangSC-Semibold;
margin-left: 16px;
font-size: 17px;
letter-spacing: 0.61px;
line-height: 24px;
}
}
}
.center {
position: relative;
height: 50px;
background-color: #00469C;
.now-pay {
// background: url('../../../assets/payment/background.png');
background-size: 365px;
background-position: -5px;
position: absolute;
left: 10px;
z-index: 2;
text-align: center;
width: 355px;
height: 89px;
border-radius: 4px;
box-shadow: 0 1px 3px 2px rgba(168,168,168,0.14);
:first-child {
font-family: PingFangSC-Regular;
font-size: 14px;
color: #383F45;
height: 35px;
line-height: 42px;
}
:last-child {
font-family: DIN-Bold;
font-size: 24px;
color: #FF8300;
font-weight: 700;
span {
font-size: 16px;
margin-right: 5px;
}
}
}
}
.pay-money {
height: 74px;
background-color: #fff;
padding-left: 16px;
margin-bottom: 8px;
.pay-icon {
font-family: PingFangSC-Regular;
font-size: 14px;
color: #00469C;
padding-top: 12px;
img{
width: 18px;
display: block;
float: left;
margin-right: 9px;
}
}
.pay-input {
margin-top: 11px;
display: flex;
font-family: PingFangSC-Regular;
font-size: 14px;
color: #656464;
height: 37px;
span {
flex: 2;
text-align: left;
line-height: 37px;
}
p {
flex: 3;
line-height: 37px;
font-size: 14px;
margin-right: 5px;
text-align: right;
}
input {
flex: 3;
text-align: right;
padding-right: 16px;
}
div{
flex: 1;
text-align: center;
line-height: 37px;
background: rgba(0,70,156,0.08);
i {
color: #00469C;
font-size: 16px;
}
}
input::placeholder {
font-family: PingFangSC-Regular;
font-size: 14px;
color: #B4B4B5;
}
}
}
.prompt {
background: rgba(142,195,30,0.10);
height: 77px;
display: flex;
div:first-child {
flex: 1;
padding: 16px 0 0 16px;
img {
width: 16px;
height: 16px;
}
}
div:last-child {
flex:12;
p:first-child {
padding-top: 16px;
font-family: PingFangSC-Semibold;
font-size: 14px;
color: #8EC31E;
letter-spacing: 0.5px;
}
p:last-child {
padding-top: 15px;
font-family: PingFangSC-Regular;
font-size: 12px;
color: rgba(101,100,100,0.80);
letter-spacing: 0.37px;
}
}
}
.bottom-tab-button{
background: #00469C;
border-radius: 4px;
color:white;
height: 40px;
margin: 4px 2% 0 2%;
}
}
</style>
......@@ -86,7 +86,7 @@ export default {
},
computed: {},
watch: {
'liquidated_damages': {
'pay_rent': {
handler () {
this.money = parseFloat(parseFloat(this.pay_rent) + parseFloat(this.liquidated_damages))
},
......@@ -113,8 +113,8 @@ export default {
vm.hlsPopup.hideLoading()
if (res.result === 'S') {
vm.default = parseFloat(res.info.rental_amount) + parseFloat(res.info.overdue_amount)
vm.pay_rent = res.info.rental_amount
vm.liquidated_damages = res.info.overdue_amount
vm.pay_rent = parseFloat(res.info.rental_amount).toFixed(2)
vm.liquidated_damages = parseFloat(res.info.overdue_amount).toFixed(2)
} else {
hlsPopup.showLongCenter(res.message)
}
......
......@@ -180,7 +180,6 @@ export default {
return {
money: '',
select: 'one',
rate: 0.03,
name: '',
sectctNong: false,
checkType: {
......@@ -201,6 +200,9 @@ export default {
serviceCharge () {
return (this.money * (this.rate / 100)).toFixed(2)
},
rate () {
return this.checkType.bank_full_name.indexOf('农业') !== -1 ? 0.00 : 0.18
},
sumMoney () {
return (parseFloat(this.serviceCharge) + parseFloat(this.money)).toFixed(
2
......@@ -379,8 +381,8 @@ export default {
.down {
height: 466px;
width: 100%;
position: absolute;
bottom: 0px;
position: relative;
bottom: -18%;
background: #fff;
border-radius: 12px 12px 0 0;
overflow: scroll;
......@@ -388,7 +390,7 @@ export default {
justify-content: center;
.top {
position: fixed;
left: 24px;
padding-left: 24px;
width: 330px;
height: 54px;
display: flex;
......@@ -424,8 +426,8 @@ export default {
.down {
height: 466px;
width: 100%;
position: absolute;
bottom: 0px;
position: relative;
bottom: -18%;
background: #fff;
border-radius: 12px 12px 0 0;
overflow: scroll;
......
......@@ -56,7 +56,6 @@ import PayEntry from '@/pages/pay/firstPay/pay-entry'
import ContractRecord from '@/pages/pay/firstPay/contract-record'
import Success from '@/pages/pay/success'
// 款项支付
import PaymentFirstPay from '@/pages/pay/payment/first-pay'
import PaymentPayEntry from '@/pages/pay/payment/pay-entry'
import PaymentContractRecord from '@/pages/pay/payment/contract-record'
import NewList from '@/pages/pay/payment/new-list'
......@@ -211,7 +210,6 @@ export default new Router({
{path: '/contract-record', component: ContractRecord, name: 'ContractRecord', meta: {keepAlive: true}},
{path: '/success', component: Success, name: 'Success', meta: {keepAlive: false}},
// 款项支付
{path: '/payment-first-pay', component: PaymentFirstPay, name: 'PaymentFirstPay', meta: {keepAlive: true}},
{path: '/payment-pay-entry', component: PaymentPayEntry, name: 'PaymentPayEntry', meta: {keepAlive: false}},
{path: '/new-list', component: NewList, name: 'NewList', meta: {keepAlive: true}},
{path: '/payment-contract-record', component: PaymentContractRecord, name: 'PaymentContractRecord', meta: {keepAlive: true}},
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment