新增综合收银台

This commit is contained in:
唐明明
2023-07-11 17:26:07 +08:00
parent 375448411f
commit 6d1382e2c5
6 changed files with 481 additions and 58 deletions

View File

@@ -155,6 +155,14 @@ const synDiffDg = (diff_price_id, data) =>{
} }
// 公共收银台支付 // 公共收银台支付
const payInfo = data => {
return request({
url : "pay/cashier_desk/info",
method : 'POST',
data
})
}
const payWechat = data => { const payWechat = data => {
return request({ return request({
url : "pay/cashier_desk/wechat", url : "pay/cashier_desk/wechat",
@@ -201,6 +209,7 @@ export {
synDiffDg, synDiffDg,
// 综合收银台 // 综合收银台
payInfo,
payWechat, payWechat,
payUms, payUms,
payDg payDg

View File

@@ -606,7 +606,8 @@
"style": { "style": {
"navigationBarTitleText": "增收赋能", "navigationBarTitleText": "增收赋能",
"enablePullDownRefresh": false, "enablePullDownRefresh": false,
"navigationBarBackgroundColor": "#FFF" "navigationBarBackgroundColor": "#FFF",
"navigationStyle": "custom"
} }
}, { }, {
"path": "pages/empower/buy", "path": "pages/empower/buy",
@@ -615,7 +616,8 @@
"style": { "style": {
"navigationBarTitleText": "报名", "navigationBarTitleText": "报名",
"enablePullDownRefresh": false, "enablePullDownRefresh": false,
"navigationBarBackgroundColor": "#FFF" "navigationBarBackgroundColor": "#FFF",
"navigationStyle": "custom"
} }
}, { }, {
"path": "pages/empower/verification", "path": "pages/empower/verification",
@@ -642,7 +644,17 @@
"style": { "style": {
"navigationBarTitleText": "赋能订单", "navigationBarTitleText": "赋能订单",
"enablePullDownRefresh": false, "enablePullDownRefresh": false,
"navigationBarBackgroundColor": "#FFFFFF" "navigationBarBackgroundColor": "#FFFFFF",
"navigationStyle": "custom"
}
}, {
"path": "pages/pay/pay",
"aliasPath": "/pay",
"name": "Pay",
"style": {
"navigationBarTitleText": "收银台",
"enablePullDownRefresh": false,
"navigationStyle": "custom"
} }
} }
], ],

View File

@@ -112,12 +112,11 @@
}).then(res => { }).then(res => {
let { order_type, order_id } = res; let { order_type, order_id } = res;
this.$Router.replace({ this.$Router.replace({
name: 'FeePay', name: 'Pay',
params: { params: {
orderId : order_id, orderId : order_id,
orderType : order_type, orderType : order_type,
price : this.allPrice, price : this.allPrice
payForm : 'entrust',
} }
}) })
}).catch(err => { }).catch(err => {

View File

@@ -1,7 +1,7 @@
<template> <template>
<view class="content"> <view class="content">
<!-- tabs --> <!-- tabs -->
<u-sticky bgColor="#FFF" zIndex="9" > <u-sticky bgColor="#FFF" zIndex="9" customNavHeight="0" >
<view class="screen-flex"> <view class="screen-flex">
<view class="screen-picker"> <view class="screen-picker">
<picker :range="statusArr" range-key="title" :value="statusIndex" @change="onPickerChange($event, 'statusIndex')"> <picker :range="statusArr" range-key="title" :value="statusIndex" @change="onPickerChange($event, 'statusIndex')">
@@ -231,17 +231,12 @@
}, },
// 订单支付 // 订单支付
onPay(obj){ onPay(obj){
let { order_id, order_type, price } = obj let { order_id, order_type } = obj
this.$Router.push({
console.log(obj) name: 'Pay',
this.$Router.replace({
name: 'FeePay',
params: { params: {
orderId : order_id, orderId : order_id,
orderType : order_type, orderType : order_type
price : price,
payForm : 'entrust',
} }
}) })
} }

408
pages/pay/pay.vue Normal file
View File

@@ -0,0 +1,408 @@
<template>
<view class="content">
<view class="paymentTop">
<view class="paymentTop-name">
需支付金额
</view>
<view class="paymentTop-price">
<text></text>{{payPrice}}
</view>
<view class="paymentTop-text">订单号{{orderNo}}</view>
</view>
<view class="paymentList">
<view class="paymentList-label" @click="payType('wechat')">
<view class="paymentList-left">
<image class="paymentList-icon" src="@/static/imgs/payWechat.png" mode="widthFix"></image>微信支付
</view>
<view class="paymentList-right">
<image class="paymentList-img" :src="Payment == 'wechat' ? '/static/imgs/payCheck_active.png' : '/static/imgs/payCheck.png'" mode="widthFix"></image>
</view>
</view>
<view class="paymentList-label" @click="payType('umsMp')">
<view class="paymentList-left">
<image class="paymentList-icon" src="https://douhuo-storage.oss-cn-beijing.aliyuncs.com/images/2023/06/06/2a4ea8f9f714e39088648383d5c52f32.png" mode="widthFix"></image>微信银联商务
</view>
<view class="paymentList-right">
<image class="paymentList-img" :src="Payment == 'umsMp' ? '/static/imgs/payCheck_active.png' : '/static/imgs/payCheck.png'" mode="widthFix"></image>
</view>
</view>
<view class="paymentList-label" @click="payType('umsAli')">
<view class="paymentList-left">
<image class="paymentList-icon" src="https://douhuo-storage.oss-cn-beijing.aliyuncs.com/images/2023/06/06/4aaf302e9d8a90c21c39b3d2f39cebc2.png" mode="widthFix"></image>支付宝银联商务
</view>
<view class="paymentList-right">
<image class="paymentList-img" :src="Payment == 'umsAli' ? '/static/imgs/payCheck_active.png' : '/static/imgs/payCheck.png'" mode="widthFix"></image>
</view>
</view>
</view>
<view class="paymentBtn" v-if="Payment == 'umsMp'">
<!-- web.douhuotest.douhuofalv dev=0是线上 dev=1是线下 -->
<wx-open-launch-weapp
username="gh_918c81628d6f"
:path="'pages/pay/pay?type=h5&dev=0&trade_id=' + tradeId + '&token=' + token"
>
<script type="text/wxtag-template">
<style>
.gobtn {
width: 280px;
background-color: #da2b56;
color: #ffffff;
border-radius: 5px;
height: 50px;
line-height: 50px;
font-size: 18px;
border: none;
}
</style>
<button type="default" class="gobtn">打开小程序收银台</button>
</script>
</wx-open-launch-weapp>
</view>
<view class="paymentBtn" v-else-if="Payment == 'dgwx'">
<button type="default" class="paymentBtn-go" :disabled="disabled" @click="payChickDg">
打开小程序收银台
</button>
</view>
<view class="paymentBtn" v-else>
<button class="paymentBtn-go" type="default" @click="payClick" :disabled="disabled">立即支付</button>
</view>
<!-- 支付成功弹出 -->
<view class="payMakeBack" :class="{active: payMakePop}" catchtouchmove='true'></view>
<view class="payMakeCont" :class="{active: payMakePop}" catchtouchmove='true'>
<image class="payMakeCont-img" src="https://douhuo-storage.oss-cn-beijing.aliyuncs.com/images/2023/06/06/5be61f2fb4f14736867078de48e09355.png" mode="widthFix"></image>
<view class="payMakeCont-title">
支付成功
</view>
<view class="payMakeCont-price">
<text></text>{{payPrice}}
</view>
<view class="payMakeCont-tips">
微信支付
</view>
<view class="payMakeCont-btn">
<view class="payMakeCont-go" @click="payMakeSkip">完成</view>
</view>
</view>
</view>
</template>
<script>
const jweixin = require('jweixin-module');
import { Apply, Wechat, authFollow } from '@/apis/interfaces/index'
import { payInfo, payWechat, payUms } from '@/apis/interfaces/pay'
export default {
data() {
return {
tradeId : '',
token : this.$store.getters.getToken,
orderNo : '',
orderId : '',
orderType : '',
payPrice : '0.00',
Payment : 'wechat',
payMakePop : false,
disabled : false
}
},
onShow() {
let { orderId, orderType } = this.$Route.query
uni.showLoading({
title: '加载中...',
mask : true
})
payInfo({
order_type : orderType,
order_id : orderId
}).then(res => {
let { price, order_no, order_id } = res;
this.orderId = order_id
this.orderNo = order_no
this.orderType = orderType
this.payPrice = price
uni.hideLoading()
}).catch(err => {
uni.showToast({
title: err.message,
icon : 'none'
})
})
},
methods: {
// 选择支付方式
payType(type) {
if(this.Payment === type) return
this.Payment = type
if(type === 'umsMp') this.umsPay()
},
// 微信支付
wechatPay(){
let openId = uni.getStorageSync('openId')
if(openId){
payWechat({
order_type: this.orderType,
order_id : this.orderId,
openid : openId,
use_fire : 0,
fire : 0,
type : payType
}).then(res => {
let wxConfig = JSON.parse(res.wechat)
jweixin.config({
appId : wxConfig.appId,
debug : false,
jsApiList : ['chooseWXPay'],
signature : wxConfig.signature,
nonceStr : wxConfig.nonceStr,
timestamp : wxConfig.timestamp,
})
jweixin.ready(() => {
jweixin.chooseWXPay({
timestamp : wxConfig.timeStamp,
nonceStr : wxConfig.nonceStr,
package : wxConfig.package,
signType : wxConfig.signType,
paySign : wxConfig.paySign,
success : payRes => {
this.payMakePop = true
},
fail: () => {
uni.showToast({
title: '取消支付',
icon: 'none'
})
}
});
});
})
}
// 获取微信授权信息-获取oppid
authFollow({
url: 'https://web.douhuofalv.com/webWechat/index'
// url: 'https://web.douhuotest.douhuofalv.com/webWechat/index'
}).then(res => {
window.location.href = res
}).catch(err => {
uni.showToast({
title: err.message,
icon: "none"
})
})
},
// 银联支付
umsPay(){
let payType = this.Payment === 'umsMp' ? 'mp' : 'mp_alipay'
payUms({
order_type: this.orderType,
order_id : this.orderId,
use_fire : 0,
fire : 0,
type : payType
}).then(res => {
let { trade_id } = res;
this.tradeId = trade_id
switch (payType){
case 'mp':
this.tradeId = res.trade_id
break;
case 'mp_alipay':
this.tradeId = res.trade_id
window.location.href = res.alipay
break;
}
}).catch(err => {
uni.showToast({
title: err.message,
icon : 'none'
})
})
},
// 提交支付
payClick(){
switch(this.Payment){
case 'umsAli':
this.umsPay()
break;
case 'wechat':
this.wechatPay()
break;
}
},
// 支付成功弹出
payMakeSkip() {
this.payMakePop = false
this.$Router.back()
},
}
}
</script>
<style lang="scss" scoped>
.content{
background: #f4f4f4;
height: 100vh;
overflow-y: scroll;
}
.paymentTop {
padding: $padding * 4 $padding;
box-sizing: border-box;
text-align: center;
color: #666666;
.paymentTop-name {
padding-left: $padding;
box-sizing: border-box;
}
.paymentTop-price {
color: $mian-color;
font-size: $title-size + 40;
font-weight: 600;
margin: $margin - 10 0;
text {
font-size: $title-size + 10;
}
}
}
.paymentList {
padding: 0 $padding;
box-sizing: border-box;
.paymentList-label {
background-color: #ffffff;
border-radius: $radius;
padding: $padding + 10 $padding;
box-sizing: border-box;
margin-bottom: $margin + 10;
display: flex;
.paymentList-left {
flex: 1;
display: flex;
line-height: 40rpx;
.paymentList-icon {
width: 40rpx;
height: 40rpx;
margin-right: $margin - 10;
}
}
.paymentList-right {
display: flex;
.paymentList-price {
color: $mian-color;
font-weight: 600;
}
.paymentList-tips {
background-image: linear-gradient(to left, #FF4646, #FF7676);
height: 44rpx;
line-height: 44rpx;
font-size: $title-size-sm;
color: #ffffff;
opacity: .9;
border-radius: $radius * 2;
padding: 0 10rpx;
}
.paymentList-arrow {
width: 14rpx;
margin: 10rpx 0 0 20rpx;
}
.paymentList-img {
width: 32rpx;
height: 32rpx;
margin-top: 4rpx;
margin-left: $margin;
}
}
}
}
.paymentBtn {
text-align: center;
padding: 0 $padding 100rpx;
box-sizing: border-box;
width: 100%;
.paymentBtn-go {
position: relative;
width: 280px;
background-color: #da2b56;
color: #ffffff;
border-radius: 5px;
height: 50px;
line-height: 50px;
font-size: 18px;
&[disabled] {
background-color: #eba5a5;
}
}
}
// 支付成功弹出
.payMakeBack {
position: fixed;
z-index: 1000;
left: 0;
top: 0;
width: 100vw;
height: 100vh;
background-color: rgba(0, 0, 0, .6);
display: none;
&.active {
display: block;
}
}
.payMakeCont {
position: fixed;
z-index: 1001;
left: 0;
bottom: -10000%;
height: 70vh;
width: 100vw;
background-color: #f7f7f7;
border-radius: 40rpx 40rpx 0 0;
padding-top: 100rpx;
box-sizing: border-box;
text-align: center;
transition: .2;
&.active {
bottom: 0;
}
.payMakeCont-img {
width: 80rpx;
height: 80rpx;
margin-left: 40rpx;
}
.payMakeCont-title {
margin: 5rpx 0 30rpx 40rpx;
font-size: 34rpx;
}
.payMakeCont-price {
font-size: 78rpx;
font-weight: 600;
text {
font-size: 36rpx;
width: 40rpx;
display: inline-block;
}
}
.payMakeCont-tips {
font-size: 28rpx;
margin-left: 40rpx;
}
.payMakeCont-btn {
position: absolute;
bottom: 0;
width: 100%;
left: 0;
padding: 80rpx 30rpx 100rpx;
box-sizing: border-box;
.payMakeCont-go {
background-color: #da2b56;
line-height: 98rpx;
border-radius: 20rpx;
color: #ffffff;
font-size: 34rpx;
}
}
}
</style>

View File

@@ -1,7 +1,8 @@
<template> <template>
<view class="content"> <view class="content">
<!-- 临时 style="padding-top: 22%;" --> <!-- 临时 style="padding-top: 22%;" -->
<view class="userTop" :class="{active : !userLogin}"> <view class="userTop" >
<!-- :class="{active : !userLogin}" -->
<img class="userTop-back" src="https://douhuo-storage.oss-cn-beijing.aliyuncs.com/images/2023/06/06/04e656417170e100efdd3443b0b8a6c8.png"> <img class="userTop-back" src="https://douhuo-storage.oss-cn-beijing.aliyuncs.com/images/2023/06/06/04e656417170e100efdd3443b0b8a6c8.png">
<view class="userTop-cont"> <view class="userTop-cont">
<view class="userTop-height" v-if="userLogin"> <view class="userTop-height" v-if="userLogin">
@@ -86,7 +87,6 @@
</view> </view>
</view> </view>
</view> </view>
<!-- 临时 style="display: none;" --> <!-- 临时 style="display: none;" -->
<view class="board" v-if="userLogin"> <view class="board" v-if="userLogin">
<view class="board-title"> <view class="board-title">
@@ -179,7 +179,7 @@
export default { export default {
data() { data() {
return { return {
userLogin : '', //登录状态 userLogin : false, //登录状态
userData : {}, //用户数据 userData : {}, //用户数据
synthesisAll : '', // 综法数量 synthesisAll : '', // 综法数量
listArr : [], // 文章列表 listArr : [], // 文章列表
@@ -191,7 +191,6 @@
onShow() { onShow() {
if(this.$store.getters.getToken) { if(this.$store.getters.getToken) {
this.userLogin = true this.userLogin = true
// 获取用户信息 // 获取用户信息
this.userInfo(); this.userInfo();
@@ -260,12 +259,10 @@
.userTop { .userTop {
position: relative; position: relative;
width: 100%; width: 100%;
height: 620rpx;
&.active { &.active {
padding-top: 22%; padding-top: 22%;
} }
.userTop-back, .userTop-back{
.userTop-cont {
position: absolute; position: absolute;
left: 0; left: 0;
top: 0; top: 0;
@@ -299,6 +296,8 @@
margin-left: 30rpx; margin-left: 30rpx;
padding-top: $padding - 20; padding-top: $padding - 20;
box-sizing: border-box; box-sizing: border-box;
position: relative;
z-index: 1;
.userTop-login { .userTop-login {
line-height: 90rpx; line-height: 90rpx;
font-weight: 600; font-weight: 600;
@@ -332,14 +331,15 @@
} }
} }
.userTop-see { .userTop-see {
margin: $margin -15rpx; margin: 0 -10rpx;
padding-top: 20rpx;
flex-wrap: wrap; flex-wrap: wrap;
justify-content: flex-start; justify-content: flex-start;
.userTop-label { .userTop-label {
display: inline-block; display: inline-block;
background-color: #ffffff; background-color: #ffffff;
border-radius: $radius-lg; border-radius: $radius-lg;
margin: 10rpx; margin: 10rpx 10rpx 0;
width: calc(50% - 20rpx); width: calc(50% - 20rpx);
padding: $padding - 10 $padding - 10 $padding - 5; padding: $padding - 10 $padding - 10 $padding - 5;
box-sizing: border-box; box-sizing: border-box;