Skip to content

M
mallapp
Commit 8225a660 authored by 黄奎's avatar 黄奎
Browse files
Options

支付宝

parent fead8c28
Hide whitespace changes
Inline Side-by-side
Showing with 274 additions and 41 deletions
components/pay/submit2Pay.vue
View file @ 8225a660
......@@ -2,18 +2,31 @@
<view>
<u-popup v-if="pay" close-icon-color="red" v-model="show" mode="center" :mask-close-able="false" length="auto"
:closeable="true" close-icon="close" :border-radius="20" :z-index="9999">
<view style="background:#fff;width:550rpx;padding:40rpx;border-radius:20px">
<view style="background:#fff;width:550rpx;padding:40rpx;border-radius:20px">
<u-icon @click="closePay" name="close" style="float:right;font-size:40rpx"></u-icon>
<p style="text-align: center;font-size: 26rpx;">支付方式</p>
<p style="font-size: 36rpx;font-weight: 700;text-align: center;margin:30px 0">
支付金额{{ payInfo.total_price }}元</p>
<view>
<view v-for="(item,index) in payList" @click="payType=item.Id"
style="display: flex;justify-content: space-between;">
<p v-if="item.Name=='微信'||(item.Name=='支付宝'&&isAlipay==1)">
<!-- <view v-for="(item,index) in payList" @click="payType=item.Id" -->
<view style="display: flex;justify-content: space-between;">
<!-- <p v-if="item.Name=='微信'||(item.Name=='支付宝'&&isAlipay==1)">
<img style="width:50rpx;height:50rpx;margin-right:10px" :src="item.src" alt="" />
<span style="position:relative;top:-7px">{{item.Name}}</span>
</p>
</p> -->
<u-radio-group v-model="payment" :size="36" :active-color='mc' @change="radioChange">
<u-radio shape="circle" :name="0">
<img style="width:50rpx;height:50rpx;margin-right:10px"
src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/wx.png" alt="" />
<span style="position:relative;top:-7px">微信</span>
</u-radio>
<u-radio v-if="u.TenantId==27" shape="circle" :name="1">
<img style="width:50rpx;height:50rpx;margin-right:10px"
src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/zhifubao.png"
alt="" />
<span style="position:relative;top:-7px">支付宝</span>
</u-radio>
</u-radio-group>
<u-icon v-if="isAlipay==1" :name="payType==item.Id?'checked':'circle'"
:style="{'color':payType==item.Id?'red':''}"></u-icon>
</view>
......@@ -23,15 +36,49 @@
</view>
</view>
</u-popup>
<!-- 支付宝 -->
<u-popup v-model="AlipayMask" mode="center" length="90%">
<view class="Alipay-box">
<view class="Alipay-box2">
<view class="Alipay-text">支付宝付款说明</view>
<u-icon name="cross" color="#9F9F9F" @click="cloGood()" size="40"> </u-icon>
</view>
<view class="Alipay-box3">
<view class="Alipay-text2">1</view>
<view class="Alipay-text3">发送“支付”获取支付宝付款链接</view>
</view>
<view class="Alipay-box33">
<image class="Alipay-image" src="../../static/images/zhifu.png"></image>
</view>
<view class="Alipay-text4" @click="send()" style="margin-bottom: 86rpx;">
去发送
</view>
<view>
<view class="Alipay-box3">
<view class="Alipay-text2">2</view>
<view class="Alipay-text3">复制支付宝链接，使用浏览器打开连接</view>
</view>
<view class="Alipay-text5">wwww.baidu.com</view>
<view class="Alipay-text4" @click="copy()">
复制链接
</view>
</view>
</view>
</u-popup>
</view>
</template>
<script>
import uniCopy from '@/js_sdk/xb-copy/uni-copy.js'
export default {
props: ['payInfo', 'isAlipay', 'StuId', 'TeacherIds'],
data() {
return {
pay:true,
AlipayMask: false,
mc: {},
payment: 0,
pay: true,
u: {},
loading: false,
show: true,
......@@ -54,6 +101,7 @@
created() {
console.log(wx)
this.u = uni.getStorageSync('mall_UserInfo')
this.mc = this.$uiConfig.mainColor;
},
wacth: {
payInfo: {
......@@ -64,43 +112,84 @@
}
},
methods: {
radioChange(e) {
if (e == 0) {
this.payType = 'wx_lite'
} else {
// this.AlipayMask = true
// this.pay = false
}
},
cloGood() {
this.AlipayMask = false
this.pay = true
},
// 支付宝发送发送
send() {
},
copy() {
uniCopy({
content: '地址复制',
success: (res) => {
uni.showToast({
title: res,
icon: 'none'
})
},
error: (e) => {
uni.showToast({
title: e,
icon: 'none',
duration: 3000,
})
}
})
},
closePay() {
this.$emit('closePay');
},
Pay() {
let msg = {
'pay_channel': this
.payType, //网页打开支付宝支付：alipay_wap 支付宝正扫：alipay_qr 支付宝app：alipay 微信小程序：wx_lite 微信公众号：wx_pub
'open_id': this.payType == 'wx_lite' ? this.payInfo.OpenId : '',
'hb_fq_num': '',
'orderId': this.payInfo.OrderId,
};
this.loading = true
uni.showLoading({
title: '正在调起支付'
})
this.request2({
url: '/api/Adapay/GetAdapayInfo',
data: msg
},
res => {
this.loading = false
uni.hideLoading()
if (res.data != '') {
if (this.payType != 'wx_lite') {
this.aliPay(res.data)
if (this.payment == 0) {
let msg = {
'pay_channel': this
.payType, //网页打开支付宝支付：alipay_wap 支付宝正扫：alipay_qr 支付宝app：alipay 微信小程序：wx_lite 微信公众号：wx_pub
'open_id': this.payType == 'wx_lite' ? this.payInfo.OpenId : '',
'hb_fq_num': '',
'orderId': this.payInfo.OrderId,
};
this.loading = true
uni.showLoading({
title: '正在调起支付'
})
this.request2({
url: '/api/Adapay/GetAdapayInfo',
data: msg
},
res => {
this.loading = false
uni.hideLoading()
if (res.data != '') {
if (this.payType != 'wx_lite') {
this.aliPay(res.data)
} else {
this.wxPay(JSON.parse(res.data))
}
} else {
this.wxPay(JSON.parse(res.data))
uni.showToast({
title: "调起支付失败，请重试",
icon: 'error'
})
}
} else {
uni.showToast({
title: "调起支付失败，请重试",
icon: 'error'
})
// uni.hideNavigationBarLoading();
}
// uni.hideNavigationBarLoading();
}
);
);
} else {
this.AlipayMask = true
this.pay = false
}
},
// 支付宝支付
aliPay(url) {
......@@ -156,4 +245,85 @@
};
</script>
<style></style>
<style>
.Alipay-box {
/* height: 930rpx; */
background: #FFFFFF;
border: 1px solid #FFFFFF;
border-radius: 50rpx;
padding: 47rpx 54rpx 62rpx 56rpx;
}
.Alipay-text {
margin: auto;
}
.Alipay-box2 {
display: flex;
justify-content: space-between;
margin-bottom: 49rpx;
}
.Alipay-box3 {
display: flex;
padding-bottom: 27rpx;
}
.Alipay-box33 {
padding-left: 68rpx;
padding-bottom: 12rpx;
}
.Alipay-text4 {
margin-left: 68rpx;
width: 230rpx;
height: 70rpx;
background: #C91727;
border-radius: 35rpx;
font-size: 30rpx;
font-family: PingFang SC;
font-weight: 500;
color: #FFFFFF;
display: flex;
justify-content: center;
align-items: center;
/* padding-bottom: 76rpx; */
}
.Alipay-text2 {
margin-right: 29rpx;
width: 41rpx;
height: 41rpx;
background: #2B2B2B;
border-radius: 10rpx;
display: flex;
justify-content: center;
align-items: center;
font-size: 26rpx;
font-family: PingFang SC;
font-weight: bold;
color: #FFFFFF;
}
.Alipay-text3 {
font-size: 26rpx;
font-family: PingFang SC;
font-weight: 500;
color: #2B2B2B;
}
.Alipay-image {
width: 442rpx;
height: 271rpx;
}
.Alipay-text5 {
font-size: 26rpx;
font-family: PingFang SC;
font-weight: bold;
color: #3A22CB;
line-height: 5rpx;
margin-left: 68rpx;
margin-bottom: 59rpx;
}
</style>
js_sdk/xb-copy/uni-copy.js 0 → 100644
View file @ 8225a660
export default function uniCopy({content,success,error}) {
if(!content) return error('复制的内容不能为空 !')
content = typeof content === 'string' ? content : content.toString() // 复制内容，必须字符串，数字需要转换为字符串
/**
* 小程序端 和 app端的复制逻辑
*/
//#ifndef H5
uni.setClipboardData({
data: content,
success: function() {
success("复制成功~")
console.log('success');
},
fail:function(){
success("复制失败~")
}
});
//#endif
/**
* H5端的复制逻辑
*/
// #ifdef H5
if (!document.queryCommandSupported('copy')) { //为了兼容有些浏览器 queryCommandSupported 的判断
// 不支持
error('浏览器不支持')
}
let textarea = document.createElement("textarea")
textarea.value = content
textarea.readOnly = "readOnly"
document.body.appendChild(textarea)
textarea.select() // 选择对象
textarea.setSelectionRange(0, content.length) //核心
let result = document.execCommand("copy") // 执行浏览器复制命令
if(result){
success("复制成功~")
}else{
error("复制失败，请检查h5中调用该方法的方式，是不是用户点击的方式调用的，如果不是请改为用户点击的方式触发该方法，因为h5中安全性，不能js直接调用！")
}
textarea.remove()
// #endif
}
pages/order-submit/order-submit2.vue
View file @ 8225a660
......@@ -28,6 +28,10 @@
<view class="pay">
<view>支付方式</view>
<view style="text-align: right;">在线支付</view>
<!-- <u-radio-group v-model="IsQZJC" :size="36" :active-color='mc'>
<u-radio shape="circle" :name="0">微信支付</u-radio>
<u-radio shape="circle" :name="1">支付宝支付</u-radio>
</u-radio-group> -->
</view>
<!-- <view class="discountbox" style="padding: 15px 0;margin-bottom: 12px;" v-if="ds.total_price >0">
<view class="filed" style="justify-content: space-between;">
......@@ -307,25 +311,34 @@
</view>
</view>
</u-popup>
<!-- 支付宝弹窗 -->
<!-- <Alipay v-if="AlipayMask" :AlipayMask='AlipayMask' :payInfo="payInfo" :isAlipay="isAlipay" :StuId='JJSWStuId' :TeacherIds='mrk' @closePay="closePay">
</Alipay> -->
</view>
</template>
<script>
import payCom from '@/components/pay/submit2Pay';
// import Alipay from '@/components/pay/Alipay';//支付宝弹窗
import peisong from '@/components/peisong/index';
import coupon from '@/components/coupon/index';
import cashCard from '@/components/coupon/cashCard'; //储蓄卡
import goodList from '@/components/goods/order-good-list';
export default {
components: {
payCom,
peisong,
coupon,
goodList,
cashCard
cashCard,
// Alipay
},
data() {
return {
AlipayMask:false,
IsQZJC:0,
mrk:'',
isAlipay: 2,//1微信 2微信支付宝
JJSWStuId: "",
......@@ -487,6 +500,7 @@
closePay() {
this.payBtn = false;
this.payExit = true;
this.AlipayMask =false
},
closeGoodListHandler() {
this.goodData = [];
......@@ -597,7 +611,12 @@
JSON.stringify(that.payInfo)
})
} else { //没使用的话 就弹出支付页面
that.payBtn = true;
if(that.IsQZJC==1) {
that.AlipayMask =true
} else {
that.payBtn = true;
}
}
}
}
......@@ -849,6 +868,7 @@
</script>
<style>
.add-info2{
width: 1px;
flex: 1;
......@@ -1035,12 +1055,13 @@
height: 50px;
color: #232323;
display: flex;
justify-content: space-between;
}
.ordersubmit .pay view {
/* .ordersubmit .pay view {
flex: 1;
}
*/
.ordersubmit .goods {
padding: 20px 10px;
margin-bottom: 12px;
......
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