Skip to content

H
hls-rljj-wx
Commit 29a71db8 authored by 5359's avatar 5359
Browse files
Options

dev测试环境跳转接口调整

parent 98ca0260
Hide whitespace changes
Inline Side-by-side
Showing with 374 additions and 239 deletions
src/pages/applications/cmbPolyPay/cmbPolyPay.vue
View file @ 29a71db8
<template> <template>
<h-view style="overflow:auto;" title="招行扫码支付"> <h-view style="overflow:auto;" title="招行扫码支付">
<div class="page-box" style="padding: 20px; height: 100%"> <div class="page-box" style="padding: 20px; height: 100%">
<div style="height:12%; width:100%"> <div style="height:12%; width:100%">
<div class="title" style="height:42%; width:100%"> <div class="title" style="height:42%; width:100%">
<div>合同信息</div> <div>合同信息</div>
</div> </div>
<div class="search" style="height:40%; width:100%"> <div class="search" style="height:40%; width:100%">
<div class="searchInput"> <div class="searchInput">
<input v-model="searchCondition.input" placeholder="请输入机号信息" onfocus="this.placeholder=''" onblur="this.placeholder='请输入机号信息'"> <input
<button style="position:absolute;right:10px" @click="detectSearchCondition()">搜索</button> v-model="searchCondition.input" placeholder="请输入机号信息" onfocus="this.placeholder=''"
</div> onblur="this.placeholder='请输入机号信息'">
<button style="position:absolute;right:10px" @click="detectSearchCondition()">搜索</button>
</div> </div>
</div> </div>
<div v-if="ListNum != 0" class="billList"> </div>
<article v-for="(item, index) in massages" :key="item.id" class="article" style="margin-top:10px"> <div v-if="ListNum != 0" class="billList">
<img slot="left-icon" src="../../../assets\electronicContract\contract-icon.png" class="icon"> <article v-for="(item, index) in massages" :key="item.id" class="article" style="margin-top:10px">
<div slot="name" class="text" style="width: 80%;font-size: 12px;"> <img slot="left-icon" src="../../../assets\electronicContract\contract-icon.png" class="icon">
<div class="cont-type" style="color: #000;font-size: 14px;font-weight:700">承租人：{{ item.customername }} <div slot="name" class="text" style="width: 80%;font-size: 12px;">
</div> <div class="cont-type" style="color: #000;font-size: 14px;font-weight:700">承租人：{{ item.customername }}
<div class="cont-type" style="color: #5a5959;font-size: 14px">代理店：{{ item.dealername }}</div>
<div class="cont-type" style="color: #5a5959;font-size: 14px">产品名称：{{ item.modelname }}</div>
<div class="cont-type" style="color: #5a5959;font-size: 14px">合同号：{{ item.contractno }}</div>
<div class="cont-type" style="color: #5a5959;font-size: 14px">机号：{{ item.serialno }}</div>
<div class="cont-type" style="color: #5a5959;font-size: 14px">租金总额：{{ item.contractamt }}</div>
<div class="cont-type" style="color: #5a5959;font-size: 14px">租赁开始日：{{ item.leasebgndt }}</div>
<div class="cont-type" style="color: #5a5959;font-size: 14px">状态：<span style="font-weight: 700;
color: rgba(198, 0, 0, 0.5);">{{ item.status }}</span></div>
</div> </div>
<router-link :to="{name:'CmbPolyPayDetail',query:{contractno:item.contractno}}" class="more"> <div class="cont-type" style="color: #5a5959;font-size: 14px">代理店：{{ item.dealername }}</div>
<img src="../../../assets\image\right-arrow@2x.png" alt=""> <div class="cont-type" style="color: #5a5959;font-size: 14px">产品名称：{{ item.modelname }}</div>
</router-link> <div class="cont-type" style="color: #5a5959;font-size: 14px">合同号：{{ item.contractno }}</div>
<button @click="download(index)">账单下载</button> <div class="cont-type" style="color: #5a5959;font-size: 14px">机号：{{ item.serialno }}</div>
</article> <div class="cont-type" style="color: #5a5959;font-size: 14px">租金总额：{{ item.contractamt }}</div>
</div> <div class="cont-type" style="color: #5a5959;font-size: 14px">租赁开始日：{{ item.leasebgndt }}</div>
<div v-else-if="ListNum == 0" class="billList"> <div class="cont-type" style="color: #5a5959;font-size: 14px">状态：<span
<div style=" style="font-weight: 700;
color: rgba(198, 0, 0, 0.5);">{{ item.status }}</span></div>
</div>
<router-link :to="{ name: 'CmbPolyPayDetail', query: { contractno: item.contractno } }" class="more">
<img src="../../../assets\image\right-arrow@2x.png" alt="">
</router-link>
<button @click="download(index)">账单下载</button>
</article>
</div>
<div v-else-if="ListNum == 0" class="billList">
<div
style="
width: 200px; width: 200px;
height: 160px; height: 160px;
position: relative; position: relative;
...@@ -42,11 +46,11 @@ ...@@ -42,11 +46,11 @@
top: 100px; top: 100px;
transform: translateX(-100px); transform: translateX(-100px);
"> ">
<img src="../../../assets\image\nobill.png" style="width: 200px; height: 160px" alt=""> <img src="../../../assets\image\nobill.png" style="width: 200px; height: 160px" alt="">
<p style="text-align: center; color:#555;">暂无相关合同信息</p> <p style="text-align: center; color:#555;">暂无相关合同信息</p>
</div>
</div> </div>
</div> </div>
</div>
</h-view> </h-view>
</template> </template>
...@@ -64,67 +68,64 @@ export default { ...@@ -64,67 +68,64 @@ export default {
}, },
created () { created () {
if (window.localStorage.openId) { if (window.localStorage.openId) {
this.searchBill(window.localStorage.openId); this.searchBill(window.localStorage.openId)
} }
}, },
mounted () { }, mounted () { },
methods: { methods: {
searchBill (openId) { searchBill (openId) {
let vm = this; let vm = this
let value = vm.searchCondition.input; let value = vm.searchCondition.input
let url = process.env.basePath + 'getCmbConList'; let url = process.env.basePath + 'getCmbConList'
console.log("请求数据") // console.log('请求数据')
// http://sign.hitachics.com/core/r/api?sysName=HCL_UPLOAD_FILE&apiName=getCmbConList
let params = { let params = {
openId:"oBdoRwAgUiwsQvNGYhBYks6JJLPE", openId: 'oBdoRwAgUiwsQvNGYhBYks6JJLPE',
serialno:"JAEB0T100610",
// openId: openId, // openId: openId,
// serialno: value, serialno: value,
}; }
// console.log("请求"); // console.log("请求");
vm.hlsPopup.showLoading('请稍候') vm.hlsPopup.showLoading('请稍候')
vm.hlsHttp.post(url, params).then(function (res) { vm.hlsHttp.post(url, params).then(function (res) {
vm.hlsPopup.hideLoading(); vm.hlsPopup.hideLoading()
console.log(res) // console.log(res)
if (res.result.respCode === 'S') { if (res.result.respCode === 'S') {
console.log(params);
console.log(res);
var dataInfo = JSON.parse(res.result.json) var dataInfo = JSON.parse(res.result.json)
// console.log('请求成功', dataInfo.lists) vm.ListNum = dataInfo.lists.length
vm.ListNum = dataInfo.lists.length; vm.massages = dataInfo.lists
vm.massages = dataInfo.lists;
} else { } else {
vm.ListNum = 0; vm.ListNum = 0
vm.hlsPopup.showLongCenter('查询合同列表失败' + res.result.respMsg) vm.hlsPopup.showLongCenter('查询合同列表失败' + res.result.respMsg)
} }
}) })
}, },
download (index) { download (contractno) {
console.log('下载') // console.log('下载')
window.open('http://sign.hitachics.com:8091/report/ReportServer?reportlet=/report/PAR015.cpt&CONTRACTNO=' + contractno + '&format=PDF&extype=simple', '_system')
},
detectSearchCondition () {
this.searchBill(window.localStorage.openId)
}, },
detectSearchCondition(){
this.searchBill (window.localStorage.openId);
}
}, },
} }
</script> </script>
<style lang="less" type="text/less" scoped> <style lang="less" type="text/less" scoped>
.title{ .title {
border-radius: 5px; border-radius: 5px;
background-color: #ddd; background-color: #ddd;
display: flex; display: flex;
justify-content: space-around; justify-content: space-around;
align-items: center; align-items: center;
div{
div {
height: 20px; height: 20px;
line-height: 20px; line-height: 20px;
font-size: 16px; font-size: 16px;
font-weight:bolder; font-weight: bolder;
color: #11111187; color: #11111187;
} }
} }
.search { .search {
display: flex; display: flex;
//height: 50px; //height: 50px;
...@@ -134,6 +135,7 @@ export default { ...@@ -134,6 +135,7 @@ export default {
position: relative; position: relative;
border: 1px solid #cccccc; border: 1px solid #cccccc;
border-radius: 20px; border-radius: 20px;
.searchInput { .searchInput {
margin-left: 5%; margin-left: 5%;
display: -webkit-flex; display: -webkit-flex;
...@@ -145,6 +147,7 @@ export default { ...@@ -145,6 +147,7 @@ export default {
-webkit-box-align: center; -webkit-box-align: center;
align-items: center; align-items: center;
-webkit-align-items: center; -webkit-align-items: center;
input { input {
text-align: center; text-align: center;
width: 90%; width: 90%;
...@@ -158,7 +161,8 @@ export default { ...@@ -158,7 +161,8 @@ export default {
//padding-left: 11px; //padding-left: 11px;
} }
} }
button{
button {
margin-right: -10px; margin-right: -10px;
background-color: rgb(230, 230, 230); background-color: rgb(230, 230, 230);
border: 1px solid #cccccc; border: 1px solid #cccccc;
...@@ -169,11 +173,13 @@ export default { ...@@ -169,11 +173,13 @@ export default {
padding: 0px; padding: 0px;
} }
} }
// 账单卡片列表 // 账单卡片列表
.billList { .billList {
//账单卡片 //账单卡片
width: 100%; width: 100%;
padding-bottom: 30px; padding-bottom: 30px;
.article { .article {
position: relative; position: relative;
border: 1px solid #d0d0d0; border: 1px solid #d0d0d0;
...@@ -181,20 +187,23 @@ export default { ...@@ -181,20 +187,23 @@ export default {
margin: 0 auto 12px; margin: 0 auto 12px;
height: 200px; height: 200px;
width: 98%; width: 98%;
.text { .text {
float: left; float: left;
line-height: 16px; line-height: 16px;
margin-left: 5px; margin-left: 5px;
margin-right: 0px; margin-right: 0px;
position: relative; position: relative;
top:50%; top: 50%;
transform: translateY(-50%); transform: translateY(-50%);
.cont-type{
.cont-type {
padding-top: 2px; padding-top: 2px;
width: 97%; width: 97%;
word-wrap:break-word; word-wrap: break-word;
} }
} }
.icon { .icon {
//左侧图标 //左侧图标
position: relative; position: relative;
...@@ -204,11 +213,13 @@ export default { ...@@ -204,11 +213,13 @@ export default {
margin-right: 0; margin-right: 0;
top: 50%; top: 50%;
transform: translateY(-20px); transform: translateY(-20px);
img { img {
width: 40px; width: 40px;
height: 40px; height: 40px;
} }
} }
button { button {
position: absolute; position: absolute;
bottom: 12px; bottom: 12px;
...@@ -220,14 +231,17 @@ export default { ...@@ -220,14 +231,17 @@ export default {
background-color: rgb(0, 200, 0); background-color: rgb(0, 200, 0);
border: 2px solid rgb(0, 200, 0); border: 2px solid rgb(0, 200, 0);
border-radius: 5px; border-radius: 5px;
}; padding-right: 1px;
padding-left: 1px;
}
.more { .more {
top:50%; top: 50%;
transform: translateY(-50%); transform: translateY(-50%);
position: relative; position: relative;
float: left; float: left;
}; }
box-shadow: 3px 3px 3px 3px #b6b6b6; box-shadow: 3px 3px 3px 3px #b6b6b6;
}; }
} }
</style> </style>
src/pages/applications/cmbPolyPay/cmbPolyPayDetail.vue
View file @ 29a71db8
<template> <template>
<h-view style="overflow:auto;" title="还款明细"> <h-view style="overflow:auto;" title="还款明细">
<div class="page-box" style="width:100% height:100%" > <div class="page-box" style="width:100% height:100%">
<ul id="box" style="margin-bottom: 150px;"> <ul id="box" style="margin-bottom: 150px;">
<li v-for="(item, index) in Lists" :key="index" class="items"> <li v-for="(item, index) in Lists" :key="index" class="items">
<input v-model="checked[index]" class="" type="checkbox" @mouseup="onClickHander(index)"> <input v-model="checked[index]" class="" type="checkbox" @mouseup="onClickHander(index)">
<ul class=""> <ul class="">
<li><span>期数：</span>{{ item.times }}</li> <li><span>期数：</span>{{ item.times }}</li>
<li><span>还款日期：</span>{{ item.recduedt_char }}</li> <li><span>还款日期：</span>{{ item.recduedt_char }}</li>
<li><span>租金金额：</span>{{ item.recdueamt }}</li> <li><span>租金金额：</span>{{ item.recdueamt }}</li>
<li><span>违约金金额：</span>{{ item.ovducmpsamt }}</li> <li><span>违约金金额：</span>{{ item.ovducmpsamt }}</li>
<li><span>剩余应还金额：</span>{{ item.recdueamt_total_str }}</li> <li><span>剩余应还金额：</span>{{ item.recdueamt_total_str }}</li>
<li><span>收款类别：</span>{{ item.characterid_n }}</li> <li><span>收款类别：</span>{{ item.characterid_n }}</li>
</ul> </ul>
</li> </li>
</ul> </ul>
</div> </div>
<!-- 总计还款金额 --> <!-- 总计还款金额 -->
<div v-if="bottomType == 0" class="bottomBox"> <div v-if="bottomType == 0" class="bottomBox">
<div class="total"> <div class="total">
<div class="counter"><span>合计还款金额：{{ total }}</span></div> <div class="counter"><span>合计还款金额：{{ total }}</span></div>
<input id="payamount" type="number" placeholder="请输入支付金额" required oninvalid="setCustomValidity('请输入支付金额！');" <input
oninput="setCustomValidity('');" onfocus="this.placeholder=''" onblur="this.placeholder='请输入支付金额'"> id="payamount" type="number" placeholder="请输入支付金额" required
</div> oninvalid="setCustomValidity('请输入支付金额！');"
<button @click="pay">支付</button> oninput="setCustomValidity('');" onfocus="this.placeholder=''" onblur="this.placeholder='请输入支付金额'">
</div>
<button @click="pay">支付</button>
</div> </div>
<!-- 二维码遮罩 --> <!-- 二维码遮罩 -->
<div v-if="bottomType == 1" class="ermPage"> <div v-if="bottomType == 1" class="ermPage">
<div class="topBlack" /> <div class="topBlack" />
<div id="bottomErm" class="bottomErm"> <div id="bottomErm" class="bottomErm">
<div class="ermTitle"> <div class="ermTitle">
<button class="close" @click="close"> <button class="close" @click="close">
<p>x</p> <p>x</p>
</button> </button>
<p>扫码支付</p> <p>扫码支付</p>
</div> </div>
<div id="qrcode"></div> <div class="ermTotal"><span>￥{{ showPayamount }}</span></div>
<div id="qrcode" />
<div class="ermBottom"><span>支持微信/支付宝/银联支付</span></div>
<div class="ermImage">
<img src="../../../assets\image\wechart.png" alt="">
<img src="../../../assets\image\wechart.png" alt="">
<img src="../../../assets\image\wechart.png" alt="">
</div> </div>
</div>
</div> </div>
</h-view> </h-view>
</template> </template>
<script> <script>
import QRCode from 'qrcodejs2' import QRCode from 'qrcodejs2'
export default { export default {
data () { data () {
return { return {
...@@ -52,27 +62,30 @@ export default { ...@@ -52,27 +62,30 @@ export default {
total: 0, // 总计金额 total: 0, // 总计金额
ListNum: 0, // 总共有多少项 ListNum: 0, // 总共有多少项
Lists: [], // 原始数据 Lists: [], // 原始数据
payamount: 0, //支付金额 payamount: 0, // 支付金额
showPayamount: 0, //后续支付结果页面显示 showPayamount: 0, // 后续支付结果页面显示
recamt_id: '', // 获得的账单二维码 recamt_id: '', // 获得的账单二维码
counter:[15,30,1],//前十次请求间隔,后十次请求间隔,间隔一/二 counter: [10, 10, 1], // 前十次请求间隔,后十次请求间隔,间隔一/二
timer: '',
timer2: '',
} }
}, },
created () { created () {
// 当数据拿到之后给checked初始值； // 当数据拿到之后给checked初始值；
var name = this.$route.query.contractno; var name = this.$route.query.contractno
console.log('传值', name); // console.log('传值', name)
// this.contractno = "L20RJ00313"; // this.contractno = "L20RJ00313";
this.contractno = name; this.contractno = name
this.getData(); this.getData()
},
beforeMount () {
}, },
methods: { methods: {
getData () { getData () {
console.log("获取最新账单"); // console.log('获取最新账单')
let vm = this let vm = this
let url = process.env.basePath + 'getCmbConDetail' let url = process.env.basePath + 'getCmbConDetail'
let params = { let params = {
// L20RJ00313
'contractno': this.contractno, 'contractno': this.contractno,
} }
// console.log("请求"); // console.log("请求");
...@@ -84,11 +97,10 @@ export default { ...@@ -84,11 +97,10 @@ export default {
// 给checked和unchecked初始值 // 给checked和unchecked初始值
for (let i = 0; i < vm.ListNum; i++) { for (let i = 0; i < vm.ListNum; i++) {
// console.log('给checked初始值'); // console.log('给checked初始值');
vm.checked[i] = false; vm.checked[i] = false
vm.unchecked[i] = dataInfo.lists[i].select_flag === 'N'; vm.unchecked[i] = dataInfo.lists[i].select_flag === 'N'
} }
vm.Lists = dataInfo.lists; vm.Lists = dataInfo.lists
console.log(vm.Lists);
} else { } else {
vm.hlsPopup.showLongCenter('获取合同还款计划失败，请联系管理员') vm.hlsPopup.showLongCenter('获取合同还款计划失败，请联系管理员')
} }
...@@ -98,7 +110,7 @@ export default { ...@@ -98,7 +110,7 @@ export default {
}) })
// console.log(vm.Lists); // console.log(vm.Lists);
}, },
//点击支付 // 点击支付
pay () { pay () {
let vm = this let vm = this
let $input = document.getElementById('payamount') let $input = document.getElementById('payamount')
...@@ -106,6 +118,7 @@ export default { ...@@ -106,6 +118,7 @@ export default {
if ($input.value <= this.total && $input.value != 0) { if ($input.value <= this.total && $input.value != 0) {
// console.log($input.value); // console.log($input.value);
this.payamount = $input.value this.payamount = $input.value
this.showPayamount = $input.value
// 请求支付 // 请求支付
let vm = this let vm = this
let url = process.env.basePath + 'createLd037' let url = process.env.basePath + 'createLd037'
...@@ -114,22 +127,26 @@ export default { ...@@ -114,22 +127,26 @@ export default {
'amount': this.payamount, 'amount': this.payamount,
} }
vm.$post(url, params).then(function (res) { vm.$post(url, params).then(function (res) {
if (res.result.return_status === 'S') { if (res.result.return_status == 'S') {
var dataInfo = res.result var dataInfo = res.result
vm.recamt_id = dataInfo.recamt_id vm.recamt_id = dataInfo.recamt_id
// console.log('获取支付id', vm.recamt_id) // console.log('获取支付id', vm.recamt_id)
vm.bottomType = 1; vm.bottomType = 1
vm.showRecamt(); $input.value = ''
$input.placeholder = '请输入支付金额'
vm.payamount = 0
vm.total = 0
vm.showRecamt()
} else { } else {
vm.hlsPopup.showLongCenter(res.result.return_message) vm.hlsPopup.showLongCenter(res.result.return_message)
} }
}) })
} else if (this.total === 0) { } else if (this.total == 0) {
$input.value = '' $input.value = ''
$input.placeholder = '请选择要支付的款项' $input.placeholder = '请选择要支付的款项'
} else if ($input.value > this.total) { } else if ($input.value > this.total) {
$input.value = '' $input.value = ''
$input.placeholder = '您输入的支付金额过多！' $input.placeholder = '您输入的支付款过多！'
} else if ($input.value === '') { } else if ($input.value === '') {
$input.placeholder = '请输入支付金额' $input.placeholder = '请输入支付金额'
} else if ($input.value === 0) { } else if ($input.value === 0) {
...@@ -138,125 +155,181 @@ export default { ...@@ -138,125 +155,181 @@ export default {
}, },
showRecamt () { showRecamt () {
let vm = this let vm = this
let url = 'http://sign.hitachics.com/core/r/api/cmb/poly/get/qrcode' let url = process.env.rootPath + '/cmb/poly/get/qrcode'
console.log('支付id', this.recamt_id) // console.log('支付id', this.recamt_id)
let params = { let params = {
'recamt_id': this.recamt_id, 'recamt_id': this.recamt_id,
} }
console.log('params', params); // console.log('params', params)
vm.$post(url, params).then(function (res) { vm.$post(url, params).then(function (res) {
console.log(res); // console.log(res)
document.getElementById("qrcode").innerHTML = ""; document.getElementById('qrcode').innerHTML = ''
if (res.respCode == 'SUCCESS') { if (res.respCode == 'SUCCESS') {
let dataInfo = res.qrCode; let dataInfo = res.qrCode
let qrcode = new QRCode("qrcode", let qrcode = new QRCode('qrcode',
{ {
text: dataInfo, text: dataInfo,
width: 128, width: 128,
height: 128, height: 128,
colorDark : '#000000', colorDark: '#000000',
colorLight : '#ffffff', colorLight: '#ffffff',
correctLevel: QRCode.CorrectLevel.H // 容错等级 correctLevel: QRCode.CorrectLevel.H, // 容错等级
} }
); )
console.log(qrcode); // console.log(qrcode)
} else { } else {
vm.hlsPopup.showLongCenter(res.respMsg); vm.hlsPopup.showLongCenter(res.respMsg)
} }
}).then(function(res){ }).then(function (res) {
vm.waitResult(params); vm.waitResult(params)
}) })
}, },
waitResult(params){ waitResult (params) {
var number = this.counter[0]; var num = this.counter[0]// 记录请求次数
var num = number; var frequency = this.counter[1]// 记录请求次数
var frequency = 0;//记录一种间隔请求次数 clearInterval(this.timer)
clearInterval(this.timer); clearInterval(this.timer2)
let vm = this; let vm = this
let url = 'http://sign.hitachics.com/core/r/api/cmb/poly/query/order/status'; let url = process.env.rootPath + '/cmb/poly/query/order/status'
let urlp = "http://sign.hitachics.com/core/r/api/cmb/poly/close/order"; let urlp = process.env.rootPath + '/cmb/poly/close/order'
this.timer = setInterval(()=>{ // this.timer = setInterval(() => {
// // console.log(num);
// num--
// if (num === 0) {
// num = number
// frequency++
// // 间隔x秒请求结果
// console.log(this.counter[2], frequency)
// vm.$post(url, params).then(function (res) {
// if (res.respCode == 'SUCCESS') {
// console.log('成功')
// // 接口文档上有状态，但实际没有;
// if (res.tradeState != 'P') {
// clearInterval(vm.timer)// 判断订单已支付暂停定时器
// };
// // 支付成功应该不需要前端主动关闭订单吧;
// // vm.closeBill(urlp, params);
// console.log(res.respMsg)
// } else {
// console.log(res.respMsg)
// }
// })
// };
// // 每15/30秒请求一次，每种间隔请求frequency次
// if (frequency === 10) {
// if (this.counter[2] === 1) {
// number = this.counter[1]
// frequency = 0
// this.counter[2] = 2
// } else {
// this.counter[2] = 1
// console.log('停止查询')
// clearInterval(this.timer)
// this.closeBill(urlp, params)// 关闭订单
// }
// }
// }, 1000)
// },
this.timer = setInterval(() => {
// console.log(num); // console.log(num);
num -- ; if (num !== 0) {
if(num === 0){ num--
num = number; // 间隔15秒请求结果
frequency++; // console.log('查询1', num)
//间隔x秒请求结果
console.log(this.counter[2],frequency)
vm.$post(url, params).then(function (res) { vm.$post(url, params).then(function (res) {
if (res.respCode == 'SUCCESS') { if (res.respCode == 'SUCCESS') {
console.log("成功"); // console.log('成功')
clearInterval(vm.timer);//判断订单已支付暂停定时器 // 接口文档上有状态，但实际没有;
// if(res.tradeState != "P"){};//接口文档上有状态，但实际没有; if (res.tradeState != 'P') {
//支付成功应该不需要前端主动关闭订单吧; clearInterval(vm.timer)// 判断订单已支付暂停定时器
// vm.closeBill(urlp, params); if (res.tradeState == 'S') {
console.log(res.respMsg); vm.hlsPopup.showLongCenter('支付完成')
}else{ }
console.log(res.respMsg); };
// 支付成功应该不需要前端主动关闭订单吧;
// vm.closeBill(urlp, params);
console.log(res.respMsg)
// vm.hlsPopup.showLongCenter(res.respMsg)
} else {
console.log(res.respMsg)
// vm.hlsPopup.showLongCenter(res.respMsg)
} }
}); })
}; } else {
//每15/30秒请求一次，每种间隔请求frequency次 // 运行10次关闭定时器
if(frequency === 10){ clearInterval(vm.timer)// 判断订单已支付暂停定时器
if(this.counter[2] === 1){ this.timer2 = setInterval(() => {
number = this.counter[1]; if (frequency !== 0) {
frequency = 0 ; frequency--
this.counter[2] = 2; // 间隔x秒请求结果
}else{ // console.log('查询2', frequency)
this.counter[2] = 1; vm.$post(url, params).then(function (res) {
console.log("停止查询"); if (res.respCode == 'SUCCESS') {
clearInterval(this.timer) ; // console.log('成功')
this.closeBill(urlp, params);//关闭订单 // 接口文档上有状态，但实际没有;
} if (res.tradeState != 'P') {
clearInterval(vm.timer2)// 判断订单已支付暂停定时器
};
console.log(res.respMsg)
// vm.hlsPopup.showLongCenter(res.respMsg)
} else {
console.log(res.respMsg)
// vm.hlsPopup.showLongCenter(res.respMsg)
}
})
} else { clearInterval(vm.timer2) }
}, 30000)
} }
},1000); }, 15000)
}, },
closeBill(urlp, params){ closeBill (urlp, params) {
let vm = this; let vm = this
vm.$post(urlp, params).then(function (res) { vm.$post(urlp, params).then(function (res) {
console.log(res,"订单关闭"); // console.log(res, '订单关闭')
if(res.respCode == 'SUCCESS'){ if (res.respCode == 'SUCCESS') {
console.log(res.respMsg); // console.log(res.respMsg)
vm.hlsPopup.showLongCenter(res.respMsg)
} }
}); })
}, },
close () { close () {
// 点击关闭二维码页面; // 点击关闭二维码页面;
this.bottomType = 0 this.bottomType = 0
this.getData(); this.total = 0
this.total= 0; this.showPayamount = 0
this.payamount = 0
clearInterval(this.timer)
clearInterval(this.timer2)
this.getData()
}, },
//选择账单后把总计金额显示在底部 // 选择账单后把总计金额显示在底部
onClickHander (index) { onClickHander (index) {
if (this.Lists[index].select_flag == 'N') { if (this.Lists[index].select_flag == 'N') {
return return
} }
var num = this.total; var num = this.total
// 计算 // 计算
if (this.checked[index] == false) { if (this.checked[index] == false) {
num += this.Lists[index].recdueamt_total; num = Math.round((num + this.Lists[index].recdueamt_total) * 100) / 100
} else if (this.checked[index] == true) { } else if (this.checked[index] == true) {
num -= this.Lists[index].recdueamt_total; num = Math.round((num - this.Lists[index].recdueamt_total) * 100) / 100
} }
num = Number(num.toFixed(2)); this.total = num
// console.log(Number(num.toFixed(2))); document.getElementById('payamount').value = this.total
this.total = num; // console.log(index)
document.getElementById('payamount').value = num;
console.log(index);
}, },
//根据getData时 生成的 unchecked:[] 给checkbox添加样式，true为不可选 // 根据getData时 生成的 unchecked:[] 给checkbox添加样式，true为不可选
addClass () { addClass () {
// console.log("add");
for (var i = 0; i < this.ListNum; i++) { for (var i = 0; i < this.ListNum; i++) {
let $input = document.getElementById('box').children[i].children[0]; let $input = document.getElementById('box').children[i].children[0]
let $ul = document.getElementById('box').children[i].children[1]; let $ul = document.getElementById('box').children[i].children[1]
// console.log($input.className); // console.log($input.className);
if (this.unchecked[i] === true) { if (this.unchecked[i] == true) {
$input.className = 'uncheck-box'; $input.className = 'uncheck-box'
$ul.className = 'uncheck-ul'; $ul.className = 'uncheck-ul'
} else { } else {
$input.className = 'check-box'; $input.className = 'check-box'
$ul.className = 'check-ul'; $ul.className = 'check-ul'
} }
} }
}, },
...@@ -271,7 +344,7 @@ export default { ...@@ -271,7 +344,7 @@ export default {
width: 100%; width: 100%;
justify-content: space-between; justify-content: space-between;
font-size: 12px; font-size: 12px;
//可选和不可选的项目样式可能要不一样 //可选和不可选的项目样式可能要不一样
ul { ul {
margin-right: 3%; margin-right: 3%;
...@@ -279,24 +352,29 @@ export default { ...@@ -279,24 +352,29 @@ export default {
border: 2px solid #afafaf; border: 2px solid #afafaf;
border-radius: 8px; border-radius: 8px;
background-color: #ffffff; background-color: #ffffff;
li { li {
padding-left: 8px; padding-left: 8px;
padding-top: 15px; padding-top: 15px;
float: left; float: left;
width: 50%; width: 50%;
span { span {
font-weight: 700; font-weight: 700;
} }
} }
} }
.uncheck-ul{
.uncheck-ul {
background-color: #ffffff; background-color: #ffffff;
} }
.check-ul{
.check-ul {
background-color: #ffffff; background-color: #ffffff;
} }
//复选框样式 //复选框样式
input[type="checkbox"] { input[type="checkbox"] {
cursor: pointer; cursor: pointer;
position: relative; position: relative;
...@@ -308,43 +386,47 @@ export default { ...@@ -308,43 +386,47 @@ export default {
transform: translateY(-5px); transform: translateY(-5px);
visibility: hidden; visibility: hidden;
} }
//可选时选中和未选中两种状态 //可选时选中和未选中两种状态
.check-box[type="checkbox"]:checked::after { .check-box[type="checkbox"]:checked::after {
height: 18px; height: 18px;
line-height: 15px; line-height: 15px;
content: "✓"; content: "✓";
color: rgb(255, 255, 255); color: rgb(255, 255, 255);
background-color: #7aae3b; background-color: #7aae3b;
border: 2px solid #7aae3b; border: 2px solid #7aae3b;
font-size: 15px; font-size: 15px;
font-weight: bold; font-weight: bold;
} }
.check-box[type="checkbox"]::after { .check-box[type="checkbox"]::after {
position: absolute; position: absolute;
background-color: #ffffff; background-color: #ffffff;
border: 2px solid #dab2b2; border: 2px solid #dab2b2;
width: 18px; width: 18px;
height: 18px; height: 18px;
display: inline-block; display: inline-block;
visibility: visible; visibility: visible;
text-align: center; text-align: center;
content: " "; content: " ";
border-radius: 50%; border-radius: 50%;
} }
//不可选的样式 //不可选的样式
.uncheck-box[type="checkbox"]::after { .uncheck-box[type="checkbox"]::after {
position: absolute; position: absolute;
background-color: #d9d9d9; background-color: #d9d9d9;
border: 2px solid #bfbfbf; border: 2px solid #bfbfbf;
width: 18px; width: 18px;
height: 18px; height: 18px;
display: inline-block; display: inline-block;
visibility: visible; visibility: visible;
text-align: center; text-align: center;
content: " "; content: " ";
border-radius: 50%; border-radius: 50%;
} }
} }
.bottomBox { .bottomBox {
position: absolute; position: absolute;
bottom: 0px; bottom: 0px;
...@@ -352,21 +434,24 @@ export default { ...@@ -352,21 +434,24 @@ export default {
height: 18%; height: 18%;
background-color: #fffffe; background-color: #fffffe;
border-top: 2px solid #7aae3b; border-top: 2px solid #7aae3b;
.total { .total {
font-size: 14px; font-size: 14px;
font-weight: bolder; font-weight: bolder;
color: rgb(180, 0, 0); color: rgb(180, 0, 0);
width: 90%; width: 90%;
// height: 20%; // height: 20 %;
margin: 20px auto; margin: 20px auto;
display: flex; display: flex;
justify-content: space-around; justify-content: space-around;
align-items: flex-end; align-items: flex-end;
.counter{
.counter {
vertical-align: bottom; vertical-align: bottom;
position: relative; position: relative;
bottom: 0px; bottom: 0px;
} }
input { input {
font-size: 12px; font-size: 12px;
position: relative; position: relative;
...@@ -379,11 +464,12 @@ export default { ...@@ -379,11 +464,12 @@ export default {
padding-right: 2%; padding-right: 2%;
} }
} }
button{
button {
position: relative; position: relative;
width: 20%; width: 20%;
height: 25%; height: 25%;
// top: -10px; //top: - 10 px;
left: 50%; left: 50%;
transform: translateX(-50%); transform: translateX(-50%);
font-size: 16px; font-size: 16px;
...@@ -393,18 +479,21 @@ export default { ...@@ -393,18 +479,21 @@ export default {
background-color: rgb(0, 200, 0); background-color: rgb(0, 200, 0);
} }
} }
.ermPage { .ermPage {
position: absolute; position: absolute;
width: 100%; width: 100%;
height: 100%; height: 100%;
top: 0px; top: 0px;
left: 0px; left: 0px;
.topBlack { .topBlack {
width: 100%; width: 100%;
height: 70%; height: 70%;
background-color: rgb(140, 140, 140); background-color: rgb(140, 140, 140);
opacity: 0.7; opacity: 0.7;
} }
.bottomErm { .bottomErm {
position: absolute; position: absolute;
bottom: 0px; bottom: 0px;
...@@ -414,6 +503,7 @@ export default { ...@@ -414,6 +503,7 @@ export default {
border: 1px solid #dab2b2; border: 1px solid #dab2b2;
border-top-left-radius: 18px; border-top-left-radius: 18px;
border-top-right-radius: 18px; border-top-right-radius: 18px;
p { p {
font-weight: 700; font-weight: 700;
margin-top: 15px; margin-top: 15px;
...@@ -421,6 +511,7 @@ export default { ...@@ -421,6 +511,7 @@ export default {
font-size: 16px; font-size: 16px;
text-align: center; text-align: center;
} }
.close { .close {
position: relative; position: relative;
float: left; float: left;
...@@ -432,6 +523,7 @@ export default { ...@@ -432,6 +523,7 @@ export default {
border-radius: 50%; border-radius: 50%;
border: 3px solid #dab2b2; border: 3px solid #dab2b2;
font-size: 14px; font-size: 14px;
p { p {
position: relative; position: relative;
top: 0px; top: 0px;
...@@ -444,16 +536,42 @@ export default { ...@@ -444,16 +536,42 @@ export default {
text-align: center; text-align: center;
} }
} }
#qrcode{
.ermTotal {
font-weight: 700;
margin-top: 10px;
font-size: 16px;
text-align: center;
}
.ermBottom {
font-weight: 700;
margin-top: 40%;
font-size: 16px;
text-align: center;
color: rgb(55, 69, 197);
}
.ermImage {
position: absolute;
left: 38%;
margin-top: 1%;
img {
width: 12%;
height: 11%;
}
}
#qrcode {
position: absolute; position: absolute;
width: 128px; width: 128px;
height: 128px; height: 128px;
top: 30%; top: 25%;
left: 50%; left: 50%;
transform: translateX(-50%); transform: translateX(-50%);
// background-color:#72a03c ; //background-color: #72a03c;
} }
} }
} }
</style> </style>
src/pages/home.vue
View file @ 29a71db8
...@@ -225,7 +225,8 @@ export default { ...@@ -225,7 +225,8 @@ export default {
// vm.getWxUserInfo(window.localStorage.openId); // vm.getWxUserInfo(window.localStorage.openId);
vm.hlsHttp.post(url, param).then(function (res) { vm.hlsHttp.post(url, param).then(function (res) {
if (res.resultCode == '00') { if (res.resultCode == '00') {
window.localStorage.openId = res.result //window.localStorage.openId = res.result
window.localStorage.openId = 'oBdoRwAgUiwsQvNGYhBYks6JJLPE'
if (window.localStorage.openId) { if (window.localStorage.openId) {
vm.getWxUserInfo(window.localStorage.openId) vm.getWxUserInfo(window.localStorage.openId)
vm.getUserInfo(window.localStorage.openId) vm.getUserInfo(window.localStorage.openId)
......
src/router/index.js
View file @ 29a71db8
...@@ -44,6 +44,7 @@ import UploadImage from '@/pages/applications/userRegisters/uploadImage' ...@@ -44,6 +44,7 @@ import UploadImage from '@/pages/applications/userRegisters/uploadImage'
import ChinaUnionPay from '@/pages/applications/chinaUnionPay/chinaUnionPay' import ChinaUnionPay from '@/pages/applications/chinaUnionPay/chinaUnionPay'
// 招行聚合支付 // 招行聚合支付
import CmbPolyPay from '@/pages/applications/cmbPolyPay/cmbPolyPay' import CmbPolyPay from '@/pages/applications/cmbPolyPay/cmbPolyPay'
// 招行聚合支付明细
import CmbPolyPayDetail from '@/pages/applications/cmbPolyPay/cmbPolyPayDetail' import CmbPolyPayDetail from '@/pages/applications/cmbPolyPay/cmbPolyPayDetail'
Vue.use(Router) Vue.use(Router)
...@@ -225,6 +226,7 @@ export default new Router({ ...@@ -225,6 +226,7 @@ export default new Router({
keepAlive: false, keepAlive: false,
}, },
}, },
// 招行聚合支付合同明细
{ {
path: '/CmbPolyPayDetail', path: '/CmbPolyPayDetail',
component: CmbPolyPayDetail, component: CmbPolyPayDetail,
......
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