You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
146 lines
3.8 KiB
146 lines
3.8 KiB
<template>
|
|
<view>
|
|
<lf-nav :spreadOut="true" :showIcon="true" bgColor="#fff" title="确认金额"></lf-nav>
|
|
<view class="lf-p-30" style="margin: 0 auto;">
|
|
<view class="confirm-card">
|
|
<view class="lf-font-32 lf-color-555">
|
|
请核对支付金额
|
|
</view>
|
|
<view style="font-size: 72rpx;color: #15716E;">¥{{ amount }}</view>
|
|
<view class="lf-flex">
|
|
<view class="lf-font-24 lf-m-r-10" style="color:#FF9D9D">
|
|
剩余支付时间
|
|
</view>
|
|
<!-- <countdown-timer :time="time" :autoStart="true" @finish="dateFinish">
|
|
<template v-slot="{minute, second}">
|
|
<view class="lf-flex">
|
|
<view class="lf-font-24" style="color:#FF9D9D">{{ minute >= 10 ? minute : "0" + minute }}</view>
|
|
<view class="lf-font-24" style="color:#FF9D9D">:</view>
|
|
<view class="lf-font-24" style="color:#FF9D9D">{{ second >= 10 ? second : "0" + second }}</view>
|
|
</view>
|
|
</template>
|
|
</countdown-timer> -->
|
|
<countdown-time minute="5" second="0" :showDay="false" :showHour="false">
|
|
|
|
</countdown-time>
|
|
</view>
|
|
<view>
|
|
<button class="confirmcash-btn" hover-class="lf-opacity" @click="confirm">确认</button>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<lf-pay-password v-if="show_pay" @comfirm="payComfirm" title="请输入支付密码"></lf-pay-password>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
import countdownTime from '@/components/uni-countdown/uni-countdown.vue';
|
|
import lfPayPassword from '@/components/lf-payPassword/lf-payPassword.vue'
|
|
export default {
|
|
components: {
|
|
countdownTime,
|
|
lfPayPassword
|
|
},
|
|
data() {
|
|
return {
|
|
time: new Date('2021/09/8 14:15:00').getTime() - new Date('2021/09/8 14:10:00').getTime(),
|
|
amount: 0,
|
|
clerk_id: 0,
|
|
brand_id: 0,
|
|
is_date_end: false,
|
|
show_pay: false,
|
|
pay_pwd: '' // 支付密码
|
|
}
|
|
},
|
|
onLoad(options){
|
|
this.amount = options.amount || 0;
|
|
this.clerk_id = options.clerk_id;
|
|
this.brand_id = options.brand_id;
|
|
},
|
|
methods: {
|
|
dateFinish(){
|
|
console.log("倒计时结束");
|
|
this.is_date_end = true;
|
|
},
|
|
// 确认
|
|
confirm(){
|
|
if(this.amount == 0){
|
|
return this.$msg('支付金额不能为0');
|
|
}
|
|
if(this.is_date_end){
|
|
uni.showModal({
|
|
title: '温馨提示',
|
|
content: '支付时间已结束, 请重新操作',
|
|
showCancel: false,
|
|
confirmColor: '#1c8482'
|
|
});
|
|
return;
|
|
};
|
|
this.show_pay = true;
|
|
},
|
|
// 密码输入完毕
|
|
payComfirm(event){
|
|
this.show_pay = false;
|
|
this.pay_pwd = event;
|
|
this.offlinePay();
|
|
},
|
|
offlinePay(){
|
|
uni.showLoading({
|
|
title: '正在支付中'
|
|
})
|
|
let token = this.$cookieStorage.get('user_token');
|
|
this.$http.post({
|
|
api: 'api/offline/pay',
|
|
data: {
|
|
clerk_id: this.clerk_id,
|
|
brand_id: this.brand_id,
|
|
amount: this.amount,
|
|
pay_pwd: this.pay_pwd
|
|
},
|
|
header: {
|
|
Authorization: token
|
|
}
|
|
}).then(res => {
|
|
uni.hideLoading();
|
|
if(res.data.code == 200){
|
|
this.$url('/pages/aboutpay/paystate?payState=1&amount='+ this.amount, {type: 'redirect'});
|
|
}else{
|
|
this.$msg(res.data.message || res.data.data || '支付失败').then(() => {
|
|
this.$url('/pages/aboutpay/paystate?payState=0', {type: 'redirect'});
|
|
})
|
|
}
|
|
}).catch(err => uni.hideLoading())
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style>
|
|
page {
|
|
background-color: #F8F8F8;
|
|
}
|
|
</style>
|
|
<style scoped lang="scss">
|
|
.confirmcash-btn {
|
|
width: 550rpx;
|
|
height: 100rpx;
|
|
background: #15716E;
|
|
border-radius: 50rpx;
|
|
display: flex;
|
|
justify-content: center;
|
|
font-size: 32rpx;
|
|
color: white;
|
|
align-items: center;
|
|
}
|
|
.confirm-card {
|
|
padding: 30rpx 0;
|
|
width: 686rpx;
|
|
height: 475rpx;
|
|
background: #FFFFFF;
|
|
border-radius: 20rpx;
|
|
display: flex;
|
|
justify-content: space-around;
|
|
align-items: center;
|
|
flex-direction: column;
|
|
}
|
|
</style>
|