Skip to content

H
hls-xcmg-vue-app
Commit 6fd67cbc authored by linxin's avatar linxin
Browse files
Options

修改支付部分

parent a9be0084
Hide whitespace changes
Inline Side-by-side
Showing with 168 additions and 88 deletions
src/pages/pay/firstPay/pay-entry.vue
View file @ 6fd67cbc
......@@ -81,60 +81,6 @@
</div>
</div>
</transition>
<transition name="trans">
<div v-show="showOutside" class="modal-show-bank">
<div class="down">
<div class="top">
<img src="@/assets/payment/back.png" @click="showOutside=false" >
<span>支付方式</span>
</div>
<scroll>
<list-item :item-height="56" class="pay-way">
<item
v-for="(item,index) in nongBank"
:proportion="[7,1,1]"
:key="item.bank_account_num"
@click.native="isSelect(`nong${index}`);ischeck(item);confirmToPay(item)"
>
<div slot="name" style="flex=3">
<img :src="selectImg(item)" alt class="icon" >
{{ item.bank_full_name }}({{ selectLast(item) }})
<img
v-show="item.recommand"
class="push"
src="@/assets/payment/push.png"
>
</div>
<section slot="content">
<img v-show="select === `nong${index}`" src="@/assets/payment/select.png" alt >
<img v-show="select !== `nong${index}`" src="@/assets/payment/unselect.png" alt >
</section>
</item>
<item
v-for="(item,index) in newList"
:proportion="[7,1,1]"
:key="index"
@click.native="isSelect(`three${index}`);ischeck(item);confirmToPay(item)"
>
<div slot="name" style="flex=3">
<img :src="selectImg(item)" alt class="icon" >
{{ item.bank_full_name }}({{ selectLast(item) }})
<img
v-show="item.recommand"
class="push"
src="@/assets/payment/push.png"
>
</div>
<section slot="content">
<img v-show="select === `three${index}`" src="@/assets/payment/select.png" alt >
<img v-show="select !== `three${index}`" src="@/assets/payment/unselect.png" alt >
</section>
</item>
</list-item>
</scroll>
</div>
</div>
</transition>
<transition name="trans">
<div v-show="confirm" class="modal-show-confirm">
<div class="down">
......@@ -193,7 +139,7 @@
<span>手续费</span>
<span>+¥{{ serviceCharge }}</span>
</div>
<div class="info-item" @click="showOutside=true">
<div class="info-item" @click="show=true">
<span>付款方式</span>
<span>
<img :src="checkType.img" >
......@@ -205,7 +151,7 @@
</div>
</h-content>
<bottom-tab>
<tab-button class="foot" @click.native="affirm();pay()">确认支付</tab-button>
<tab-button class="foot" @click.native="affirm">确认支付</tab-button>
</bottom-tab>
</h-view>
</template>
......@@ -233,7 +179,6 @@ export default {
components: {},
data () {
return {
url: '',
money: '',
timer: null,
select: 'three0',
......@@ -386,8 +331,6 @@ export default {
let vm = this
if (parseFloat(vm.sumMoney) === 0) {
hlsPopup.showLongCenter('您支付的金额为0元')
} else if (parseFloat(vm.sumMoney) > 0 && vm.pay_type === 'ABC') {
window.open(vm.url)
} else {
vm.pay()
}
......@@ -405,13 +348,13 @@ export default {
if (res.return_code !== '0000') {
hlsPopup.showLongCenter(res.error_message)
} else {
// vm.$router.push({
// name: 'PayPage',
// params: {
// url: res.paymentURL,
// },
// })
vm.url = res.paymentURL
vm.$router.push({
name: 'PayPage',
params: {
url: res.paymentURL,
order_id: vm.$route.params.order_id,
},
})
}
} else {
hlsPopup.showLongCenter(res.message)
......
src/pages/pay/pay-page.vue
View file @ 6fd67cbc
......@@ -6,12 +6,55 @@
<span>支付中心</span>
</div>
</h-header>
<h-content>
<iframe
:src="url" sandbox="allow-scripts" frameborder="0"
scrolling="no"
width="100%" height="100%"/>
<!-- <object :data="url" width="100%" height="100%" type="text/html"/> -->
<h-content class="box">
<div v-if="isSuccess" class="my-content">
<img class="flag" src="@/assets/payment/success.png" >
<h3>支付成功</h3>
<p>感谢您的还款，我们将尽快为您结清金额</p>
<div class="info">
<div class="left">
<list-item :item-height="30">
<item>
<div slot="name" class="name">时间</div>
<div slot="content">{{ date }}</div>
</item>
<item>
<div slot="name" class="name">姓名</div>
<div slot="content">{{ userName }}</div>
</item>
<item>
<div slot="name" class="name">还款金额</div>
<div slot="content">{{ money|currency }}</div>
</item>
</list-item>
</div>
</div>
</div>
<div v-if="isFaild" class="my-content">
<img class="flag" src="@/assets/payment/faild.png" >
<h3>支付失败</h3>
<p>对不起，支付失败，请您重新尝试！</p>
<div class="info">
<div class="left">
<list-item :item-height="30">
<item>
<div slot="name" class="name">时间</div>
<div slot="content">{{ date }}</div>
</item>
<item>
<div slot="name" class="name">姓名</div>
<div slot="content">{{ userName }}</div>
</item>
<item>
<div slot="name" class="name">还款金额</div>
<div slot="content">{{ money|currency }}</div>
</item>
</list-item>
</div>
</div>
</div>
<button v-if="showpay" @click="pay">立即支付</button>
<button v-if="showSelect" @click="searchResult">查询支付结果</button>
</h-content>
</h-view>
</template>
......@@ -21,31 +64,125 @@ export default {
return {
name: '',
url: '',
showSelect: false,
showpay: true,
isSuccess: false,
isFaild: false,
}
},
beforeRouteEnter (to, from, next) {
next(vm => {
vm.showSelect = false
vm.showpay = true
vm.isSuccess = false
vm.isFaild = false
vm.name = from.name
vm.url = vm.$route.params.url
})
},
methods: {
changePage () {
let toPath
if (this.name === 'PayEntry') {
toPath = 'FirstPay'
} else if (this.name === 'PaymentPayEntry') {
toPath = 'NewList'
this.$router.push({
name: 'MyInfo',
})
},
pay () {
let vm = this
window.open(this.url)
setTimeout(() => {
vm.showSelect = true
vm.showpay = false
}, 1000)
},
searchResult () {
let vm = this
let url = process.env.basePath + 'merchant_query_order'
let param = {
order_id: vm.$route.params.order_id,
}
this.$router.replace({
name: toPath,
hlsPopup.showLoading('请稍候')
vm.$post(url, param).then(function (res) {
vm.hlsPopup.hideLoading()
if (res.result === 'S') {
if (res.return_code !== '0000') {
vm.isFaild = true
vm.isSuccess = false
hlsPopup.showLongCenter(res.error_message)
} else {
vm.isSuccess = true
vm.isFaild = false
hlsPopup.showLongCenter('交易成功')
}
} else {
hlsPopup.showLongCenter(res.message)
}
})
},
},
}
</script>
<style lang="less" scoped>
<style lang="less">
#pay-page {
.box{
display: flex;
justify-content: center;
align-items: center;
flex-wrap:wrap;
}
button{
color: #fff;
background-color: @headerColor;
width:50%;
height:40px;
border-radius: 5px;
}
.my-content {
height: 400px;
.flag {
display: block;
margin: 0 auto;
width: 72px;
padding-top: 48px;
}
h3 {
margin: 0 auto;
margin-top: 32px;
width: 83px;
font-weight: 600;
font-family: PingFangSC-Semibold;
font-size: 20px;
color: #383f45;
letter-spacing: 0.71px;
}
p {
margin: 0 auto;
margin-top: 10px;
width: 234px;
font-family: PingFangSC-Regular;
font-size: 13px;
color: rgba(56, 63, 69, 0.6);
letter-spacing: 0;
display: flex;
justify-content: center;
}
.info {
width: 343px;
margin: 0 auto;
border-top: 1px solid #d9dbdf;
margin-top: 48px;
.name {
font-family: PingFangSC-Regular;
font-size: 14px;
color: rgba(56, 63, 69, 0.6);
letter-spacing: 0.5px;
}
.left {
padding-top: 10px;
}
}
}
.content{
background-color: #fff;
}
}
</style>
src/pages/pay/payment/pay-entry.vue
View file @ 6fd67cbc
......@@ -286,13 +286,13 @@ export default {
if (res.return_code !== '0000') {
hlsPopup.showLongCenter(res.error_message)
} else {
// vm.$router.push({
// name: 'PayPage',
// params: {
// url: res.paymentURL,
// },
// })
window.open(res.paymentURL)
vm.$router.push({
name: 'PayPage',
params: {
url: res.paymentURL,
order_id: vm.$route.params.order_id,
},
})
}
} else {
hlsPopup.showLongCenter(res.message)
......
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