Skip to content

H
hls-rljj-wx
Commit 9b2a02a8 authored by liangliang.wang01's avatar liangliang.wang01 🤸🏽
Browse files
Options

完善样式

parent 422c42d1
Show whitespace changes
Inline Side-by-side
Showing with 112 additions and 151 deletions
src/assets/image/nobill.png
View replaced file @ 422c42d1 View file @ 9b2a02a8
src/assets/image/nobill.png

2.6 KB | W: | H:

src/assets/image/nobill.png

202 KB | W: | H:

src/assets/image/nobill.png
src/assets/image/nobill.png
src/assets/image/nobill.png
src/assets/image/nobill.png
  • 2-up
  • Swipe
  • Onion skin
src/pages/applications/cmbPolyPay/cmbPolyPay.vue
View file @ 9b2a02a8
......@@ -23,9 +23,9 @@
</div>
<div v-if="ListNum != 0" class="billList">
<article v-for="(item, index) in massages" :key="item.id" class="article" style="margin-top:10px">
<img slot="left-icon" src="../../../assets\electronicContract\contract-icon.png" class="icon">
<div slot="name" class="text" style="width: 82%;font-size: 12px;margin-top:15px">
<div class="cont-type" style="color: #5a5959;font-size: 14px;font-weight:bold">承租人：{{ item.customername }}
<img slot="left-icon" src="../../../assets\electronicContract\contract-list.png" class="icon">
<div slot="name" class="text" style="width: 62%;font-size: 12px;">
<div class="cont-type" style="color: #000;font-size: 14px;font-weight:700">承租人：{{ item.customername }}
</div>
<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>
......@@ -36,21 +36,22 @@
<div class="cont-type" style="color: #5a5959;font-size: 14px">状态：<span>{{ item.status }}</span></div>
</div>
<button @click="download(index)">账单下载</button>
<router-link :to="{name:'CmbPolyPayDetail',query:{contractno:item.contractno}}"><span class="more">﹥</span>
<router-link :to="{name:'CmbPolyPayDetail',query:{contractno:item.contractno}}">
<img src="../../../assets\image\right-arrow@2x.png" class="more" alt="">
</router-link>
</article>
</div>
<div v-else-if="ListNum == 0" class="billList">
<div style="
width: 160px;
height: 120px;
width: 200px;
height: 160px;
position: relative;
left: 50%;
top: 100px;
transform: translateX(-80px);
transform: translateX(-100px);
">
<img src="../../../assets\image\nobill.png" style="width: 160px; height: 120px" alt="">
<p style="text-align: center">暂无相关合同信息</p>
<img src="../../../assets\image\nobill.png" style="width: 200px; height: 160px" alt="">
<p style="text-align: center; color:#555;">暂无相关合同信息</p>
</div>
</div>
</div>
......@@ -70,32 +71,35 @@ export default {
},
created () {
if (window.localStorage.openId) {
// this.searchBill(window.localStorage.openId)
this.searchBill(window.localStorage.openId);
}
},
mounted () { },
methods: {
searchBill (openId) {
let vm = this
let vm = this;
let value = vm.searchCondition.input
let url = process.env.basePath + 'getCmbConList'
let url = process.env.basePath + 'getCmbConList';
console.log("请求数据")
// http://sign.hitachics.com/core/r/api?sysName=HCL_UPLOAD_FILE&apiName=getCmbConList
let params = {
openId:"oBdoRwI9gj9Brbe9iqlDCg5G2dDc",
// openId: openId,
// serialno: value,
}
// openId:"oBdoRwAgUiwsQvNGYhBYks6JJLPE",
// serialno:"JAEB0T100610",
openId: openId,
serialno: value,
};
// console.log("请求");
vm.hlsPopup.showLoading('请稍候')
vm.hlsHttp.post(url, params).then(function (res) {
vm.hlsPopup.hideLoading();
console.log(res)
if (res.result.respCode === 'S') {
console.log(params);
console.log(res);
var dataInfo = JSON.parse(res.result.json)
// console.log('请求成功', dataInfo.lists)
vm.ListNum = dataInfo.lists.length
vm.massages = dataInfo.lists
vm.ListNum = dataInfo.lists.length;
vm.massages = dataInfo.lists;
} else {
vm.ListNum = 0;
vm.hlsPopup.showLongCenter('查询合同列表失败' + res.result.respMsg)
......@@ -165,16 +169,30 @@ export default {
border: 1px solid #d0d0d0;
border-radius: 8px;
margin: 0 auto 12px;
height: 170px;
height: 200px;
width: 98%;
.text {
margin-left: 50px;
margin-left: 45px;
position: relative;
top:50%;
transform: translateY(-50%);
.cont-type{
padding-top: 2px;
width: 100%;
word-wrap:break-word;
}
:nth-child(8){
span{
font-weight: 700;
color: rgba(198, 0, 0, 0.5);
}
}
}
.icon {
//左侧图标
position: relative;
float: left;
width: 50px;
width: 40px;
padding-left: 5px;
top: 50%;
transform: translateY(-20px);
......@@ -189,24 +207,23 @@ export default {
}
button {
position: absolute;
top: 5px;
top: 15px;
right: 5px;
width: 75px;
height: 25px;
font-size: 14px;
background-color: #999999;
background-color: #cecece;
border: 2px solid #999999;
border-radius: 5px;
}
};
.more {
font-size: 32px;
position: absolute;
right: 5px;
top: 50%;
transform: translateY(-16px);
}
};
box-shadow: 3px 3px 3px 3px #b6b6b6;
}
};
padding-bottom: 30px;
.text {
margin-left: 15px;
......
src/pages/applications/cmbPolyPay/cmbPolyPayDetail.vue
View file @ 9b2a02a8
......@@ -35,27 +35,7 @@
<div id="qrcode"></div>
</div>
</div>
<!-- 支付账单遮罩 -->
<div v-show="payPage" class="payPage">
<div class="payPagebox">
<div class="payPage-title">
<p>×</p>
<p>支付</p>
<p>使用密码</p>
</div>
<div class="payPage-total">
<p>￥{{ showPayamount }}</p>
</div>
<div id="payPage-payCode" class="payPage-payCode">
<img src="" alt="">
<p>**银行卡（{{ tailNum }}）</p>
<span>›</span>
</div>
<div class="payPage-button">
<button>确认支付</button>
</div>
</div>
</div>
</div>
</template>
......@@ -71,11 +51,10 @@ export default {
total: 0, // 总计金额
ListNum: 0, // 总共有多少项
Lists: [], // 原始数据
payamount: 0,
showPayamount: 0,
payamount: 0, //支付金额
showPayamount: 0, //后续支付结果页面显示
recamt_id: '', // 获得的账单二维码
payPage: false, // 支付确认页面
tailNum: '0000', // 银行卡尾部号码
counter:[15,30,1],//前十次请求间隔,后十次请求间隔,间隔一/二
}
},
computed: {
......@@ -85,14 +64,15 @@ export default {
// 当数据拿到之后给checked初始值；
var name = this.$route.query.contractno;
console.log('传值', name);
this.contractno = "L20RJ00313";
// this.contractno = name;
// this.contractno = "L20RJ00313";
this.contractno = name;
this.getData();
},
beforeMount () {
},
methods: {
getData () {
console.log("获取最新账单");
let vm = this
let url = process.env.basePath + 'getCmbConDetail'
let params = {
......@@ -141,8 +121,8 @@ export default {
var dataInfo = res.result
vm.recamt_id = dataInfo.recamt_id
// console.log('获取支付id', vm.recamt_id)
vm.bottomType = 1
vm.showRecamt()
vm.bottomType = 1;
vm.showRecamt();
} else {
vm.hlsPopup.showLongCenter(res.result.return_message)
}
......@@ -182,10 +162,65 @@ export default {
);
console.log(qrcode);
} else {
vm.hlsPopup.showLongCenter(res.respMsg)
vm.hlsPopup.showLongCenter(res.respMsg);
}
}).then(function(res){
vm.waitResult(params);
})
},
waitResult(params){
var number = this.counter[0];
var num = number;
var frequency = 0;//记录一种间隔请求次数
clearInterval(this.timer);
let vm = this;
let url = 'http://sign.hitachics.com/core/r/api/cmb/poly/query/order/status';
let urlp = "http://sign.hitachics.com/core/r/api/cmb/poly/close/order";
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("成功");
clearInterval(vm.timer);//判断订单已支付暂停定时器
// if(res.tradeState != "P"){};//接口文档上有状态，但实际没有;
//支付成功应该不需要前端主动关闭订单吧;
// 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);
},
closeBill(urlp, params){
let vm = this;
vm.$post(urlp, params).then(function (res) {
console.log(res,"订单关闭");
if(res.respCode == 'SUCCESS'){
console.log(res.respMsg);
}
});
},
showPaypage () {
},
......@@ -421,96 +456,5 @@ input[type="checkbox"] {
// }
}
}
.payPage {
width: 100%;
height: 100%;
background-color: #989898;
}
.payPagebox {
position: absolute;
width: 80%;
height: 40%;
top: 25%;
left: 10%;
border: 1px solid green;
border-radius: 15px;
background-color: #ffffff;
.payPage-title {
margin-top: 5%;
width: 100%;
height: 14%;
display: flex;
justify-content: space-between;
border-bottom: 1px solid rgb(149, 149, 149);
:nth-child(1) {
padding-left: 16px;
font-size: 24px;
}
:nth-child(2) {
line-height: 100%;
padding-left: 30%;
font-size: 20px;
font-weight: 700;
}
:nth-child(3) {
padding-top: 2px;
padding-left: 15%;
padding-right: 5%;
font-size: 16px;
color: blue;
}
}
.payPage-total {
padding-top: 10%;
width: 100%;
height: 35%;
border-bottom: 1px solid rgb(149, 149, 149);
font-size: 32px;
font-weight: 700;
text-align: center;
}
.payPage-payCode {
display: flex;
justify-content: space-between;
padding-top: 3%;
width: 100%;
height: 15%;
border-bottom: 1px solid rgb(149, 149, 149);
font-size: 18px;
text-align: center;
:nth-child(1) {
padding-left: 10px;
width: 20px;
height: 20px;
}
:nth-child(2) {
width: 80%;
font-size: 18px;
padding-left: 10px;
text-align: left;
}
:nth-child(3) {
font-size: 32px;
margin-top: -9px;
padding-right: 4px;
color: #989898;
}
}
.payPage-button {
margin-top: 5%;
width: 100%;
height: 35%;
button {
position: relative;
left: 6%;
width: 88%;
height: 50%;
font-size: 20px;
color: #ffffff;
background-color: #72a03c;
border: 1px solid #8ac443;
border-radius: 8px;
}
}
}
</style>
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