zenghuapei
/
cyywl_server
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

feat: 新增支付页面

pull/2/head
TianYu 2023-05-23 16:23:09 +08:00
parent ec8c740a3b
commit 0c1eb5e969
3 changed files with 798 additions and 715 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
yudao-ui-app/components/countDown/index.vue
View File

@ -3,8 +3,10 @@
<text class="red" v-if="tipText">{{ tipText }}</text> <text class="red" v-if="tipText">{{ tipText }}</text>
<text class="styleAll" :style="'background-color:'+ bgColor +';color:'+ colors +';'" v-if="isDay === true">{{ day }}</text> <text class="styleAll" :style="'background-color:'+ bgColor +';color:'+ colors +';'" v-if="isDay === true">{{ day }}</text>
<text class="timeTxt red" v-if="dayText">{{ dayText }}</text> <text class="timeTxt red" v-if="dayText">{{ dayText }}</text>
<template v-if="isShowHour">
<text class="styleAll" :style="'background-color:'+ bgColor +';color:'+ colors +';'">{{ hour }}</text> <text class="styleAll" :style="'background-color:'+ bgColor +';color:'+ colors +';'">{{ hour }}</text>
<text class="timeTxt red" v-if="hourText">{{ hourText }}</text> <text class="timeTxt red" v-if="hourText">{{ hourText }}</text>
</template>
<text class="styleAll" :style="'background-color:'+ bgColor +';color:'+ colors +';'">{{ minute }}</text> <text class="styleAll" :style="'background-color:'+ bgColor +';color:'+ colors +';'">{{ minute }}</text>
<text class="timeTxt red" v-if="minuteText">{{ minuteText }}</text> <text class="timeTxt red" v-if="minuteText">{{ minuteText }}</text>
<text class="styleAll" :style="'background-color:'+ bgColor +';color:'+ colors +';'">{{ second }}</text> <text class="styleAll" :style="'background-color:'+ bgColor +';color:'+ colors +';'">{{ second }}</text>
@ -49,6 +51,10 @@
type: Boolean, type: Boolean,
default: true default: true
}, },
isShowHour: {
type: Boolean,
default: true
},
bgColor:{ bgColor:{
type: String, type: String,
default: "" default: ""

135
yudao-ui-app/pages/goods_cashier/index.vue
View File

@ -1,13 +1,14 @@
<template> <template>
<view class="page" v-if="payPriceShow"> <view class="page" v-if="payPriceShow">
<view class="pay-price"> <view class="pay-price">
<view class="title">实付金额</view>
<view class="price"> <view class="price">
<text class="unit">￥</text> <text class="unit">￥</text>
<numberScroll :num='payPriceShow' color="#E93323" width='30' height='50' fontSize='50'></numberScroll> <numberScroll :num='payPriceShow' color="#F12A65" width='30' height='50' fontSize='50'></numberScroll>
</view> </view>
<view class="count-down"> <view class="count-down">
支付剩余时间： 支付剩余时间
<countDown :is-day="false" :tip-text="' '" :day-text="' '" :hour-text="' : '" :minute-text="' : '" <countDown :is-day="false" :is-show-hour='false' :tip-text="''" :day-text="''" :hour-text="''" :minute-text="' : '"
:second-text="' '" :datatime="invalidTime"></countDown> :second-text="' '" :datatime="invalidTime"></countDown>
</view> </view>
</view> </view>
@ -24,17 +25,33 @@
<view class="info" v-if="item.value == 'yue'"> <view class="info" v-if="item.value == 'yue'">
{{item.title}} <span class="money">￥{{ item.number }}</span> {{item.title}} <span class="money">￥{{ item.number }}</span>
</view> </view>
<view class="info" v-else>{{item.title}}</view> <!-- <view class="info" v-else>{{item.title}}</view> -->
</view> </view>
</view> </view>
<view class="iconfont" :class="active==index?'icon-xuanzhong11 font-num':'icon-weixuan'"></view> <view class="iconfont" :class="active==index?'icon-xuanzhong11 font-num':'icon-weixuan'"></view>
</view> </view>
</view> </view>
<view class="btn"> <view class="btn">
<view class="button acea-row row-center-wrapper" @click='goPay(number, paytype)'>确认支付</view> <view class="button acea-row row-center-wrapper pay-button" @click='goPay(number, paytype)'>确认支付</view>
<view class="wait-pay" @click="waitPay">暂不支付</view> <view class="wait-pay" @click="waitPay">暂不支付</view>
</view> </view>
<view v-show="false" v-html="formContent"></view> <view v-show="false" v-html="formContent"></view>
<u-modal :show="cancelPayModalShow" width="519rpx">
<view class="modal-wrap">
<view class="count-down">
支付剩余时间
<countDown :is-day="false" :is-show-hour='false' :tip-text="''" :day-text="''" :hour-text="''" :minute-text="' : '"
:second-text="' '" :datatime="invalidTime"></countDown>
</view>
<view class="model-content">确认要放弃付款吗？</view>
</view>
<view slot="confirmButton">
<view class="modal-btn-wrap">
<u-button class="give-up-btn" @click="onGiveUpPay">放弃</u-button>
<u-button class="continue-btn">继续支付</u-button>
</view>
</view>
</u-modal>
</view> </view>
</view> </view>
</template> </template>
@ -53,8 +70,8 @@
}, },
data() { data() {
return { return {
cancelPayModalShow: false,
checked: false, checked: false,
datatime: 1676344056,
//支付方式 //支付方式
cartArr: [{ cartArr: [{
"name": '微信支付', "name": '微信支付',
@ -74,11 +91,11 @@
orderId: 0, orderId: 0,
fromType: '', fromType: '',
active: 0, active: 0,
payPrice: 10, payPrice: 10.00,
payPriceShow: 10, payPriceShow: 10.00,
payPostage: 0, payPostage: 0,
offlinePostage: false, offlinePostage: false,
invalidTime: 1684748596, invalidTime: 1684836534,
initIn: false, initIn: false,
jumpData: { jumpData: {
orderId: '', orderId: '',
@ -152,6 +169,10 @@
} }
}, },
methods: { methods: {
onGiveUpPay() {
this.cancelPayModalShow = false
// uni.navigateBack()
},
getCashierOrder() { getCashierOrder() {
uni.showLoading({ uni.showLoading({
title: '创建订单中' title: '创建订单中'
@ -219,10 +240,11 @@
}) })
}, },
waitPay() { waitPay() {
uni.reLaunch({ this.cancelPayModalShow = true
url: '/pages/goods/order_pay_status/index?order_id=' + this.orderId + '&msg=取消支付&type=3' + // uni.reLaunch({
'&status=2&totalPrice=' + this.payPriceShow // url: '/pages/goods/order_pay_status/index?order_id=' + this.orderId + '&msg=取消支付&type=3' +
}) // '&status=2&totalPrice=' + this.payPriceShow
// })
}, },
goPay(number, paytype) { goPay(number, paytype) {
let that = this; let that = this;
@ -572,24 +594,74 @@
} }
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.page { .page {
.count-down .time {
margin-left: 10rpx;
}
.modal-btn-wrap {
display: flex;
justify-content: space-between;
.give-up-btn,
.continue-btn {
flex: 1;
height: 71rpx;
line-height: 71rpx;
background: #F3F3F3;
border: 1px solid #BFBFBF;
border-radius: 35rpx;
text-align: center
}
.continue-btn {
margin-left: 47rpx;
border: none;
color: #fff;
background: linear-gradient(0deg, #E83769 0%, #FE7E9D 100%);
}
}
.modal-wrap {
width: 100%;
text-align: center;
.count-down{
display: flex;
justify-content: center;
font-size: 32rpx;
color: #F4356B;
margin-bottom: 42rpx;
margin-top: 57rpx;
}
.model-content {
font-size: 30rpx;
color: #000;
}
}
.pay-price { .pay-price {
display: flex; display: flex;
justify-content: center; justify-content: center;
flex-direction: column; flex-direction: column;
align-items: center; align-items: center;
padding: 50rpx 0 40rpx 0; padding: 88rpx 0 56rpx 0;
.title {
font-size: 28rpx;
color: #000;
margin-bottom: 34rpx;
}
.price { .price {
color: #E93323; color: #F12A65;
margin-bottom: 20rpx; margin-bottom: 29rpx;
display: flex; display: flex;
align-items: flex-end; align-items: flex-end;
.unit { .unit {
font-size: 34rpx; font-size: 30rpx;
font-weight: 500; font-weight: 500;
line-height: 41rpx; line-height: 41rpx;
} }
@ -603,11 +675,8 @@
.count-down { .count-down {
display: flex; display: flex;
align-items: center; align-items: center;
background-color: #fff; font-size: 28rpx;
padding: 8rpx 28rpx; color: #7A7A7A;
border-radius: 40rpx;
font-size: 24rpx;
color: #E93323;
.time { .time {
margin-top: 0 !important; margin-top: 0 !important;
@ -627,9 +696,10 @@
margin: 0 30rpx; margin: 0 30rpx;
.title { .title {
color: #666666; color: #000;
font-size: 26rpx; font-size: 32rpx;
padding: 30rpx 0 0 30rpx; font-weight: 400;
padding: 30rpx 0 25rpx 30rpx;
} }
.payMoney { .payMoney {
@ -659,8 +729,7 @@
} }
.payment .item { .payment .item {
border-bottom: 1rpx solid #eee; height: 80rpx;
height: 130rpx;
margin-left: 30rpx; margin-left: 30rpx;
padding-right: 30rpx; padding-right: 30rpx;
} }
@ -724,13 +793,21 @@
.btn { .btn {
position: fixed; position: fixed;
left: 30rpx; left: 50rpx;
right: 50rpx;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
align-items: center; align-items: center;
bottom: 30rpx; bottom: 30rpx;
bottom: calc(30rpx + constant(safe-area-inset-bottom)); ///兼容 IOS<11.2/ bottom: calc(30rpx + constant(safe-area-inset-bottom)); ///兼容 IOS<11.2/
bottom: calc(30rpx + env(safe-area-inset-bottom)); ///兼容 IOS>11.2/ bottom: calc(30rpx + env(safe-area-inset-bottom)); ///兼容 IOS>11.2/
.pay-button {
width: 100%;
height: 87rpx;
background: linear-gradient(0deg, #E63163 0%, #FF819F 100%);
border-radius: 44px;
}
} }
.wait-pay { .wait-pay {

20
yudao-ui-app/pages/users/user_spread_code/index.vue
View File

@ -86,16 +86,16 @@
}; };
}, },
computed: mapGetters(['isLogin', 'uid', 'userInfo','tenantId']), computed: mapGetters(['isLogin', 'uid', 'userInfo','tenantId']),
watch: { // watch: {
isLogin: { // isLogin: {
handler: function(newV, oldV) { // handler: function(newV, oldV) {
if (newV) { // if (newV) {
this.userSpreadBannerList(); // this.userSpreadBannerList();
} // }
}, // },
deep: true // deep: true
} // }
}, // },
onLoad() { onLoad() {
if (this.isLogin) { if (this.isLogin) {
this.userSpreadBannerList(); this.userSpreadBannerList();