源文件
This commit is contained in:
25
jeepay-ui-uapp-cashier/pages/H5/H5.vue
Normal file
25
jeepay-ui-uapp-cashier/pages/H5/H5.vue
Normal file
@@ -0,0 +1,25 @@
|
||||
<template>
|
||||
<web-view :src="src" update-title />
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { onLoad } from '@dcloudio/uni-app'
|
||||
import { ref } from 'vue'
|
||||
const src = ref('')
|
||||
onLoad((options) => {
|
||||
src.value = options.url
|
||||
// #ifdef H5 || MP-WEIXIN
|
||||
uni.setNavigationBarTitle({
|
||||
title: ' '
|
||||
})
|
||||
// #endif
|
||||
// 条件编译 支付宝
|
||||
// #ifdef H5 || MP-ALIPAY
|
||||
my.setNavigationBar({
|
||||
title: ' '
|
||||
})
|
||||
// #endif
|
||||
})
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped></style>
|
||||
58
jeepay-ui-uapp-cashier/pages/error/index.vue
Normal file
58
jeepay-ui-uapp-cashier/pages/error/index.vue
Normal file
@@ -0,0 +1,58 @@
|
||||
<template>
|
||||
<view class="error">
|
||||
<image src="/static/img/fail.svg" class="error-icon"></image>
|
||||
<text class="error-err">提示</text>
|
||||
<view class="error-msg" v-if="errorInfo">
|
||||
<view class="msg">{{errorInfo}}</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import theme from '@/config/theme.js'
|
||||
import { onLoad } from '@dcloudio/uni-app'
|
||||
import { ref } from 'vue'
|
||||
|
||||
let errorInfo = ref('')
|
||||
|
||||
onLoad((params) => {
|
||||
theme.changeColors()
|
||||
errorInfo.value = params.errInfo;
|
||||
})
|
||||
|
||||
|
||||
</script>
|
||||
<style lang="scss">
|
||||
.error {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
}
|
||||
.error-icon {
|
||||
padding-top: 200rpx;
|
||||
width: 240rpx;
|
||||
height: 166rpx;
|
||||
}
|
||||
.error-err {
|
||||
padding-top: 50rpx;
|
||||
font-size: 34rpx;
|
||||
font-weight: 600;
|
||||
color: #242526;
|
||||
}
|
||||
.error-msg {
|
||||
width: 75%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
padding-top: 70rpx;
|
||||
color: #999999;
|
||||
word-wrap:break-word;
|
||||
text-align: center;
|
||||
.msg {
|
||||
width: 100%;
|
||||
line-height: 42rpx;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
27
jeepay-ui-uapp-cashier/pages/hub/default.vue
Normal file
27
jeepay-ui-uapp-cashier/pages/hub/default.vue
Normal file
@@ -0,0 +1,27 @@
|
||||
<template>
|
||||
<view></view>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
|
||||
import { onLoad } from '@dcloudio/uni-app'
|
||||
import navigateUtil from '@/util/navigateUtil.js'
|
||||
|
||||
onLoad( (toPageParams) => {
|
||||
|
||||
// #ifdef H5
|
||||
navigateUtil.to('/pages/hub/h5', toPageParams)
|
||||
// #endif
|
||||
|
||||
// #ifdef MP-WEIXIN || MP-ALIPAY
|
||||
navigateUtil.to('/pages/hub/lite', toPageParams)
|
||||
// #endif
|
||||
|
||||
} )
|
||||
|
||||
|
||||
</script>
|
||||
|
||||
<style>
|
||||
|
||||
</style>
|
||||
42
jeepay-ui-uapp-cashier/pages/hub/h5.vue
Normal file
42
jeepay-ui-uapp-cashier/pages/hub/h5.vue
Normal file
@@ -0,0 +1,42 @@
|
||||
<template>
|
||||
<view></view>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { onLoad } from '@dcloudio/uni-app'
|
||||
import appConfig from '@/config/appConfig.js'
|
||||
import { setToken } from '@/util/jeepayTokenUtil.js'
|
||||
import { $getRedirectUrl } from '@/http/apiManager.js'
|
||||
import navigateUtil from '@/util/navigateUtil.js'
|
||||
import storageManage from '@/util/storageManage.js'
|
||||
import { onMounted } from 'vue'
|
||||
import { navigateTo } from "@/util/member.js"
|
||||
|
||||
// uniapp 的钩子事件(同步)， 一般用作获取到页面传参
|
||||
// 通用放置token & 如果获取异常 将跳转到错误页面；
|
||||
onLoad( (toPageParams) => setToken(toPageParams) )
|
||||
|
||||
// vue的挂载钩子
|
||||
onMounted( (opt) => {
|
||||
$getRedirectUrl().then( ({bizData}) => {
|
||||
// 如果缓存包含该渠道用户ID, 那么直接跳转。
|
||||
if(bizData.channelUserIdCacheKey && storageManage.channelUserId(bizData.channelUserIdCacheKey)){
|
||||
navigateTo(storageManage.channelUserId(bizData.channelUserIdCacheKey))
|
||||
return false
|
||||
}
|
||||
// 需要重定向
|
||||
if(bizData.redirectFlag){
|
||||
location.href = bizData.redirectUrl
|
||||
return false;
|
||||
}else{ // 无需获取
|
||||
navigateUtil.redirectTo('/pages/payway/index') // 跳转到输入金额 页面；
|
||||
}
|
||||
|
||||
})
|
||||
})
|
||||
|
||||
</script>
|
||||
|
||||
<style>
|
||||
|
||||
</style>
|
||||
124
jeepay-ui-uapp-cashier/pages/hub/lite.vue
Normal file
124
jeepay-ui-uapp-cashier/pages/hub/lite.vue
Normal file
@@ -0,0 +1,124 @@
|
||||
<template>
|
||||
<view>
|
||||
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { onLoad, onShow } from '@dcloudio/uni-app'
|
||||
import appConfig from '@/config/appConfig.js'
|
||||
import { setToken, setPageType, setLiteToken } from '@/util/jeepayTokenUtil.js'
|
||||
import { reactive } from 'vue'
|
||||
import { $getChannelUserId } from '@/http/apiManager.js'
|
||||
import { toErrPageFunc } from '@/util/toErrorPageUtil.js'
|
||||
import storageManage from '@/util/storageManage.js'
|
||||
// import { Base64 } from 'js-base64'
|
||||
import { navigateTo } from "@/util/member.js"
|
||||
onLoad((options) => {
|
||||
|
||||
setPageType()
|
||||
|
||||
if (appConfig.currentPageType == appConfig.PAGE_TYPE_ENUM.WECHAT_LITE) {
|
||||
getWxParams(options)
|
||||
} else if (appConfig.currentPageType == appConfig.PAGE_TYPE_ENUM.ALIPAY_LITE) {
|
||||
getAliParams(options)
|
||||
}
|
||||
})
|
||||
|
||||
// 微信登录
|
||||
function getWxParams(options) {
|
||||
|
||||
let query = options.q || ''
|
||||
setLiteToken(decodeURIComponent(query))
|
||||
|
||||
uni.showLoading({title: '加载中...'})
|
||||
|
||||
// 获取openId
|
||||
wx.login({
|
||||
success(res) {
|
||||
commonGetChannelUserIdFunc(appConfig.PAGE_TYPE_ENUM.WECHAT_LITE, res.code, { 'code': res.code })
|
||||
},
|
||||
fail() {
|
||||
uni.hideLoading()
|
||||
toErrPageFunc('登录失败')
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
// 支付宝登录
|
||||
function getAliParams(options) {
|
||||
|
||||
// 首页扫码进入
|
||||
if (options && options.isNeedParseQrc) {
|
||||
let query = options.q || ''
|
||||
setLiteToken(decodeURIComponent(query))
|
||||
}
|
||||
|
||||
uni.showLoading({title: '加载中...'})
|
||||
|
||||
my.getAuthCode({
|
||||
success: (res) => {
|
||||
commonGetChannelUserIdFunc(appConfig.PAGE_TYPE_ENUM.ALIPAY_LITE, res.authCode, { 'auth_code': res.authCode })
|
||||
},
|
||||
fail: (res) => {
|
||||
uni.hideLoading()
|
||||
toErrPageFunc('登录失败')
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
|
||||
function commonGetChannelUserIdFunc(pageType, authCode, reqParams){
|
||||
|
||||
if (authCode) {
|
||||
|
||||
// 缓存KEY: jeepayChannelUserId_pageType
|
||||
// 此处不再查询后端的缓存KEY, 不同小程序之间做了隔离， 与浏览器有区别。 所以此处不需要根据appID做区分。
|
||||
// 此小程序内， 获取到的只能是此服务商该小程序APPID的openID
|
||||
let channelUserIdCacheKey = 'jeepayChannelUserId_' + pageType;
|
||||
// let jeepayChannelUniIdKey = 'jeepayChannelUniId_' + pageType;
|
||||
// 存在缓存
|
||||
if(storageManage.channelUserId(channelUserIdCacheKey)){
|
||||
navigateTo(storageManage.channelUserId(channelUserIdCacheKey))
|
||||
uni.hideLoading()
|
||||
return
|
||||
}
|
||||
// 传输是否为特约商户的小程序账号
|
||||
if(reqParams){
|
||||
reqParams.isUseSubmchAccount = appConfig.isUseSubmchAccount
|
||||
}
|
||||
// 以下为不存在缓存数据
|
||||
$getChannelUserId(reqParams).then(({ bizData }) => {
|
||||
console.log('channelUserId',bizData);
|
||||
// 放置 userID缓存。
|
||||
if(bizData){
|
||||
storageManage.channelUserId(channelUserIdCacheKey, bizData)
|
||||
}
|
||||
navigateTo(bizData)
|
||||
uni.hideLoading()
|
||||
|
||||
}).catch(err => {
|
||||
uni.hideLoading()
|
||||
console.log(err);
|
||||
})
|
||||
} else {
|
||||
uni.hideLoading()
|
||||
return toErrPageFunc('登录失败')
|
||||
}
|
||||
}
|
||||
// 跳转至收银台
|
||||
function setChannelUserIdAndToPaywayPage() {
|
||||
uni.redirectTo({
|
||||
url: '/pages/payway/index',
|
||||
success() {
|
||||
uni.hideLoading()
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
|
||||
</script>
|
||||
|
||||
<style>
|
||||
|
||||
</style>
|
||||
137
jeepay-ui-uapp-cashier/pages/index/index.vue
Normal file
137
jeepay-ui-uapp-cashier/pages/index/index.vue
Normal file
@@ -0,0 +1,137 @@
|
||||
<template>
|
||||
<view class="content" style="background: url('/static/syb_bg.png') no-repeat;background-size: 100%;">
|
||||
<button class="scan-btn fixed-box" hover-class="scan-btn-hover" :style="{'backgroundColor': vdata.primaryColor}" @click="scanQrcFunc">扫码买单</button>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup >
|
||||
import { reactive } from 'vue'
|
||||
import { onLoad } from '@dcloudio/uni-app'
|
||||
import theme from '@/config/theme.js'
|
||||
import navigateUtil from '@/util/navigateUtil.js'
|
||||
import {toErrPageFunc} from '@/util/toErrorPageUtil.js'
|
||||
|
||||
const vdata = reactive({
|
||||
primaryColor: ''
|
||||
})
|
||||
|
||||
onLoad(() => {
|
||||
vdata.primaryColor = theme.changeColors()
|
||||
})
|
||||
|
||||
function scanQrcFunc() {
|
||||
uni.scanCode({
|
||||
success({ result }) {
|
||||
if (result.includes("pages/hub/lite") || result.includes("pages/hub/default")) {
|
||||
navigateUtil.to('/pages/hub/lite', { q: result, isNeedParseQrc: true })
|
||||
}else {
|
||||
return toErrPageFunc('不支持的二维码类型！');
|
||||
}
|
||||
}
|
||||
})
|
||||
}
|
||||
const toPayMember =()=> navigateUtil.to('/pages/payway/index')
|
||||
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.content {
|
||||
// background:;
|
||||
background-size: cover;
|
||||
height: 100vh;
|
||||
position: relative;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
// background: #ffffff;
|
||||
// background-size: auto;
|
||||
|
||||
.content-top-bg {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
width: 100%;
|
||||
height: 212rpx;
|
||||
border-radius: 0 0 30rpx 30rpx;
|
||||
z-index: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.tips {
|
||||
position: relative;
|
||||
width: 650rpx;
|
||||
margin-top: 20rpx;
|
||||
border-radius: 30rpx;
|
||||
background: #fff;
|
||||
z-index: 1;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
padding: 70rpx 0;
|
||||
|
||||
.tips-title {
|
||||
font-weight: bold;
|
||||
font-size: 33rpx;
|
||||
letter-spacing: 0.04em;
|
||||
}
|
||||
.tips-image {
|
||||
height: 150rpx;
|
||||
width: 150rpx;
|
||||
padding-top: 100rpx;
|
||||
}
|
||||
image {
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
}
|
||||
.tips-content {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
padding-top: 70rpx;
|
||||
font-size: 27rpx;
|
||||
letter-spacing: 0.04em;
|
||||
line-height: 51rpx;
|
||||
text-align: center;
|
||||
color: #000;
|
||||
}
|
||||
}
|
||||
.scan-btn {
|
||||
width: 80%;
|
||||
margin-top: 100rpx;
|
||||
border-radius: 10rpx;
|
||||
color: #fff;
|
||||
}
|
||||
.scan-btn-hover {
|
||||
color: #fff;
|
||||
opacity: 0.8;
|
||||
}
|
||||
.payment-no-keyboard {
|
||||
width: 500rpx;
|
||||
height: 120rpx;
|
||||
position: fixed;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 240rpx;
|
||||
margin: 0 auto;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
font-size: 36rpx;
|
||||
color: $uni-text-color-inverse;
|
||||
border-radius: 8rpx;
|
||||
}
|
||||
.fixed-box {
|
||||
position: fixed !important;
|
||||
bottom: 0 !important;
|
||||
left: 0 !important;
|
||||
width: 90% !important;
|
||||
// background-color: #07C160 !important;
|
||||
background-color: #1678FF !important;
|
||||
padding: 3px !important;
|
||||
margin-left: 5%;
|
||||
margin-bottom: 5%;
|
||||
border-radius: 10px;
|
||||
}
|
||||
</style>
|
||||
141
jeepay-ui-uapp-cashier/pages/index/index_back.vue
Normal file
141
jeepay-ui-uapp-cashier/pages/index/index_back.vue
Normal file
@@ -0,0 +1,141 @@
|
||||
<template>
|
||||
<view class="content">
|
||||
<view class="content-top-bg" :style="{'backgroundColor': vdata.primaryColor}"></view>
|
||||
<view class="tips">
|
||||
<view class="tips-title" :style="{'color': vdata.primaryColor}">欢迎使用Jeepay收银台</view>
|
||||
<view class="tips-image"><image src="/static/img/scan.svg"></image></view>
|
||||
<!-- #ifdef H5 -->
|
||||
<view class="tips-content">
|
||||
<text>请使用手机</text>
|
||||
<text>扫描Jeepay收款码进入</text>
|
||||
</view>
|
||||
<!-- #endif -->
|
||||
|
||||
<!-- #ifdef MP-ALIPAY || MP-WEIXIN -->
|
||||
<button class="scan-btn" hover-class="scan-btn-hover" :style="{'backgroundColor': vdata.primaryColor}" @click="scanQrcFunc">扫码买单</button>
|
||||
<!-- #endif -->
|
||||
</view>
|
||||
<!-- <view
|
||||
v-if="appConfig.currentPageType != appConfig.PAGE_TYPE_ENUM.OTHER_H5"
|
||||
class="payment-no-keyboard"
|
||||
:style="{'backgroundColor': vdata.primaryColor}"
|
||||
@tap="pay">
|
||||
跳转至测试付款页
|
||||
</view> -->
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup >
|
||||
import { reactive } from 'vue'
|
||||
import { onLoad } from '@dcloudio/uni-app'
|
||||
import theme from '@/config/theme.js'
|
||||
import navigateUtil from '@/util/navigateUtil.js'
|
||||
import {toErrPageFunc} from '@/util/toErrorPageUtil.js'
|
||||
|
||||
const vdata = reactive({
|
||||
primaryColor: ''
|
||||
})
|
||||
|
||||
onLoad(() => {
|
||||
vdata.primaryColor = theme.changeColors()
|
||||
})
|
||||
|
||||
function scanQrcFunc() {
|
||||
uni.scanCode({
|
||||
success({ result }) {
|
||||
if (result.includes("pages/hub/lite") || result.includes("pages/hub/default")) {
|
||||
navigateUtil.to('/pages/hub/lite', { q: result, isNeedParseQrc: true })
|
||||
}else {
|
||||
return toErrPageFunc('不支持的二维码类型！');
|
||||
}
|
||||
}
|
||||
})
|
||||
}
|
||||
const toPayMember =()=> navigateUtil.to('/pages/payway/index')
|
||||
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.content {
|
||||
position: relative;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
|
||||
.content-top-bg {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
width: 100%;
|
||||
height: 212rpx;
|
||||
border-radius: 0 0 30rpx 30rpx;
|
||||
z-index: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.tips {
|
||||
position: relative;
|
||||
width: 650rpx;
|
||||
margin-top: 20rpx;
|
||||
border-radius: 30rpx;
|
||||
background: #fff;
|
||||
z-index: 1;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
padding: 70rpx 0;
|
||||
|
||||
.tips-title {
|
||||
font-weight: bold;
|
||||
font-size: 33rpx;
|
||||
letter-spacing: 0.04em;
|
||||
}
|
||||
.tips-image {
|
||||
height: 150rpx;
|
||||
width: 150rpx;
|
||||
padding-top: 100rpx;
|
||||
}
|
||||
image {
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
}
|
||||
.tips-content {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
padding-top: 70rpx;
|
||||
font-size: 27rpx;
|
||||
letter-spacing: 0.04em;
|
||||
line-height: 51rpx;
|
||||
text-align: center;
|
||||
color: #000;
|
||||
}
|
||||
}
|
||||
.scan-btn {
|
||||
width: 80%;
|
||||
margin-top: 100rpx;
|
||||
border-radius: 10rpx;
|
||||
color: #fff;
|
||||
}
|
||||
.scan-btn-hover {
|
||||
color: #fff;
|
||||
opacity: 0.8;
|
||||
}
|
||||
.payment-no-keyboard {
|
||||
width: 500rpx;
|
||||
height: 120rpx;
|
||||
position: fixed;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 240rpx;
|
||||
margin: 0 auto;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
font-size: 36rpx;
|
||||
color: $uni-text-color-inverse;
|
||||
border-radius: 8rpx;
|
||||
}
|
||||
</style>
|
||||
73
jeepay-ui-uapp-cashier/pages/oauth2/callback.vue
Normal file
73
jeepay-ui-uapp-cashier/pages/oauth2/callback.vue
Normal file
@@ -0,0 +1,73 @@
|
||||
<template>
|
||||
<view>
|
||||
<p style="font-size:16px; text-align: center;" @tap="bugbugbug">正在跳转...</p>
|
||||
<view v-if="vdata.showBizData">
|
||||
<p style="font-size:12px; text-align: center;">bizData：{{ vdata.bizData }}</p>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { onLoad } from '@dcloudio/uni-app'
|
||||
import appConfig from '@/config/appConfig.js'
|
||||
import { setToken } from '@/util/jeepayTokenUtil.js'
|
||||
import { $getChannelUserId } from '@/http/apiManager.js'
|
||||
import storageManage from '@/util/storageManage.js'
|
||||
import { navigateTo } from "@/util/member.js"
|
||||
import { onMounted, reactive } from 'vue'
|
||||
|
||||
const vdata = reactive({
|
||||
showBizData:false,
|
||||
bizData: {}
|
||||
})
|
||||
|
||||
// uniapp 的钩子事件(同步)， 一般用作获取到页面传参
|
||||
// 通用放置token & 如果获取异常 将跳转到错误页面；
|
||||
onLoad( (toPageParams) => setToken(toPageParams) )
|
||||
|
||||
// vue mounted 钩子事件
|
||||
onMounted( () => {
|
||||
|
||||
// 获取userId
|
||||
|
||||
$getChannelUserId(Object.assign({jeepayResType: 'channelUserJSON'}, searchToObject())).then( ({bizData}) => {
|
||||
appConfig.channelUserId = bizData.channelUserId;
|
||||
|
||||
// 保存到localStorage
|
||||
if(bizData.channelUserIdCacheKey){
|
||||
storageManage.channelUserId(bizData.channelUserIdCacheKey, bizData.channelUserId)
|
||||
}
|
||||
navigateTo(bizData.channelUserId)
|
||||
|
||||
vdata.bizData = bizData
|
||||
})
|
||||
})
|
||||
|
||||
function searchToObject() {
|
||||
|
||||
if(!window.location.search){
|
||||
return {};
|
||||
}
|
||||
|
||||
var pairs = window.location.search.substring(1).split("&"),
|
||||
result = {},
|
||||
pair,
|
||||
i;
|
||||
for ( i in pairs ) {
|
||||
if ( pairs[i] === "" ) continue;
|
||||
pair = pairs[i].split("=");
|
||||
result[ decodeURIComponent( pair[0] ) ] = decodeURIComponent( pair[1] );
|
||||
}
|
||||
return result;
|
||||
}
|
||||
|
||||
function bugbugbug() {
|
||||
vdata.showBizData = true
|
||||
}
|
||||
|
||||
</script>
|
||||
|
||||
|
||||
<style>
|
||||
</style>
|
||||
1138
jeepay-ui-uapp-cashier/pages/pay/index.vue
Normal file
1138
jeepay-ui-uapp-cashier/pages/pay/index.vue
Normal file
File diff suppressed because it is too large
Load Diff
1119
jeepay-ui-uapp-cashier/pages/pay/lite.vue
Normal file
1119
jeepay-ui-uapp-cashier/pages/pay/lite.vue
Normal file
File diff suppressed because it is too large
Load Diff
146
jeepay-ui-uapp-cashier/pages/pay/result.vue
Normal file
146
jeepay-ui-uapp-cashier/pages/pay/result.vue
Normal file
@@ -0,0 +1,146 @@
|
||||
<!-- 支付结果页 -->
|
||||
<template>
|
||||
<view class="success-page">
|
||||
|
||||
<view class="success-box u-flex-col u-row-center u-col-center">
|
||||
<view><image class="pay-img" :src="payImg[payState]" mode=""></image></view>
|
||||
<view><text class="notice">{{ payText[payState] }}</text></view>
|
||||
<view><text class="pay-money" v-if="payState === 'success' && orderDetail.total_fee">￥{{ orderDetail.total_fee }}</text></view>
|
||||
<view class="btn-box u-flex u-row-between" v-if="showModal == 'app'">
|
||||
<button class="u-reset-button base-btn" open-type="launchApp" app-parameter="wechat" binderror="launchAppError" >返回APP </button>
|
||||
</view>
|
||||
|
||||
<view class="btn-box u-flex u-row-between" v-if="showModal == 'xcx'">
|
||||
<button class="u-reset-button base-btn" @click="getLos()" >返回 </button>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { mapMutations, mapActions, mapState, mapGetters } from 'vuex';
|
||||
let payTimer = null;
|
||||
const payCount = 5;
|
||||
export default {
|
||||
components: {},
|
||||
data() {
|
||||
return {
|
||||
showModal: 'h5',
|
||||
messageType: '',
|
||||
templateIds: [],
|
||||
wxOpenTags: '',
|
||||
orderDetail: {}, //订单详情
|
||||
orderType: '', //订单类型
|
||||
payText: {
|
||||
fail: '支付失败',
|
||||
success: '支付成功',
|
||||
paying: '查询中...'
|
||||
},
|
||||
payImg: {
|
||||
fail: '/static/syb/order_pay_fail.gif',
|
||||
success: '/static/syb/order_pay_success.gif',
|
||||
paying:'/static/syb/order_paying.gif'
|
||||
},
|
||||
payState: '' //支付状态
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
...mapGetters(['subscribeMessageIdsMap'])
|
||||
},
|
||||
onLoad(opt) {
|
||||
var that = this;
|
||||
that.payState = opt.pay_state
|
||||
that.showModal = opt.show_modal
|
||||
console.log(that.showModal,'that.showModal')
|
||||
},
|
||||
methods: {
|
||||
...mapActions(['getCartList']),
|
||||
getLos(){
|
||||
wx.navigateBackMiniProgram({
|
||||
extraData: {
|
||||
name: '半屏小程序返回',
|
||||
status: this.payState
|
||||
},
|
||||
success(res) {
|
||||
// 返回成功
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss" scopeds>
|
||||
.success-box {
|
||||
text-align: center;
|
||||
background: #fff;
|
||||
width: 750rpx;
|
||||
padding: 40rpx 0;
|
||||
|
||||
.pay-img {
|
||||
width: 130rpx;
|
||||
height: 130rpx;
|
||||
}
|
||||
|
||||
.notice {
|
||||
font-size: 30rpx;
|
||||
|
||||
font-weight: bold;
|
||||
color: rgba(51, 51, 51, 1);
|
||||
line-height: 30rpx;
|
||||
margin-top: 30rpx;
|
||||
}
|
||||
|
||||
.pay-money {
|
||||
font-size: 36rpx;
|
||||
color: #ff3000;
|
||||
font-weight: 600;
|
||||
margin-top: 20rpx;
|
||||
}
|
||||
|
||||
.btn-box {
|
||||
margin-top: 30rpx;
|
||||
// width: 660rpx;
|
||||
|
||||
.base-btn {
|
||||
width: 320rpx;
|
||||
line-height: 70rpx;
|
||||
background: rgba(255, 255, 255, 1);
|
||||
border: 1rpx solid rgba(223, 223, 223, 0.5);
|
||||
border-radius: 35rpx;
|
||||
font-size: 28rpx;
|
||||
|
||||
font-weight: 400;
|
||||
color: rgba(153, 153, 153, 1);
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.again-pay {
|
||||
width: 320rpx;
|
||||
line-height: 70rpx;
|
||||
background: linear-gradient(90deg, rgba(233, 180, 97, 1), rgba(238, 204, 137, 1));
|
||||
box-shadow: 0px 7rpx 6rpx 0px rgba(229, 138, 0, 0.22);
|
||||
border-radius: 35rpx;
|
||||
font-size: 28rpx;
|
||||
|
||||
font-weight: 400;
|
||||
color: rgba(255, 255, 255, 0.8);
|
||||
padding: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.hot-box {
|
||||
background: #fff;
|
||||
padding: 20rpx;
|
||||
margin-top: 20rpx;
|
||||
|
||||
.hot-title {
|
||||
font-size: 30rpx;
|
||||
|
||||
font-weight: 500;
|
||||
color: rgba(51, 51, 51, 1);
|
||||
height: 80rpx;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
175
jeepay-ui-uapp-cashier/pages/paySuccess/paySuccess.vue
Normal file
175
jeepay-ui-uapp-cashier/pages/paySuccess/paySuccess.vue
Normal file
@@ -0,0 +1,175 @@
|
||||
<template>
|
||||
<view class="pay-result">
|
||||
<image src="/static/img/success.svg" class="pay-result-icon"></image>
|
||||
<text class="pay-result-err">支付成功</text>
|
||||
<text style="margin-top: 30rpx ; color:#00000059 ;">{{ vdata.member?'会员支付':'普通支付' }}</text>
|
||||
<view class="pay-result-amount">
|
||||
<text class="pay-result-amount-text">金额：<text style="color: #FC0100;">￥</text></text>
|
||||
<text class="pay-result-amount-value">{{ doubleToThousands(vdata.amount) }}</text>
|
||||
</view>
|
||||
|
||||
<view class="ad-wrapper" v-if="vdata.advertUrl" @tap="toH5">
|
||||
<image mode="aspectFill" :src="vdata.advertUrl"></image>
|
||||
</view>
|
||||
<!-- #ifdef MP-WEIXIN -->
|
||||
<button v-if="appConfig.scene == 1069" class="back-btn" :style="{'backgroundColor': vdata.primaryColor || '#F1F1F1'}" open-type="launchApp" :app-parameter="'success'" @error="launchAppError">完 成</button>
|
||||
<button v-else-if="appConfig.scene == 1037" class="back-btn" :style="{'backgroundColor': vdata.primaryColor || '#F1F1F1'}" @click="backMiniFunc">完 成</button>
|
||||
<navigator v-else open-type="exit" target="miniProgram" class="back-btn" :style="{'backgroundColor': vdata.primaryColor || '#F1F1F1'}">完 成</navigator>
|
||||
<!-- #endif -->
|
||||
<!-- #ifdef MP-ALIPAY -->
|
||||
<navigator open-type="exit" target="miniProgram" class="back-btn" :style="{'backgroundColor': vdata.primaryColor || '#F1F1F1'}">完 成</navigator>
|
||||
<!-- #endif -->
|
||||
<!-- #ifndef MP-WEIXIN || MP-ALIPAY -->
|
||||
<view class="back-btn" :style="{'backgroundColor': vdata.primaryColor || '#F1F1F1'}" @click="back">完 成</view>
|
||||
<!-- #endif -->
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { doubleToThousands } from '@/util/amount.js'
|
||||
import { onLoad,onUnload } from '@dcloudio/uni-app'
|
||||
import { reactive } from 'vue'
|
||||
import { $getAdvert } from '@/http/apiManager.js'
|
||||
import appConfig from '@/config/appConfig.js'
|
||||
import theme from '@/config/theme.js'
|
||||
|
||||
const vdata = reactive({
|
||||
amount: '0', // 订单金额
|
||||
payOrderId: '', // 订单号
|
||||
doubleToThousands: doubleToThousands(),
|
||||
primaryColor: '',
|
||||
advertUrl: ''
|
||||
})
|
||||
|
||||
onLoad((params) => {
|
||||
console.log(appConfig.video,'appConfigvideo')
|
||||
vdata.amount = params.amount
|
||||
vdata.primaryColor = theme.changeColors()
|
||||
vdata.member = params.member
|
||||
|
||||
if (params.payOrderId) {
|
||||
vdata.payOrderId = params.payOrderId
|
||||
}
|
||||
sphGet()
|
||||
|
||||
$getAdvert().then(({bizData}) => {
|
||||
if(bizData) {
|
||||
vdata.advertUrl = bizData.imgUrl || ''
|
||||
vdata.linkUrl = bizData.linkUrl || ''
|
||||
}
|
||||
}).catch(err => {
|
||||
console.log(err);
|
||||
})
|
||||
})
|
||||
//视频号数据
|
||||
function sphGet(){
|
||||
if(appConfig.currentPageType == 'alipayLite' || appConfig.currentPageType == 'alipayH5' || appConfig.video == undefined || appConfig.video == null){
|
||||
|
||||
}else{alipayLite
|
||||
uni.openChannelsActivity({
|
||||
finderUserName: appConfig.video.uniqueId,//视频号ID
|
||||
feedId: appConfig.video.exportId,//视频ID
|
||||
complete (res) {
|
||||
console.log(res)
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
}
|
||||
function back() {
|
||||
uni.navigateBack()
|
||||
}
|
||||
function backMiniFunc() {
|
||||
uni.navigateBackMiniProgram({
|
||||
extraData: {
|
||||
'amount': vdata.amount,
|
||||
'payOrderId': vdata.payOrderId
|
||||
},
|
||||
success(res) {
|
||||
console.log('返回成功')
|
||||
}
|
||||
})
|
||||
}
|
||||
const toH5 = ()=>{
|
||||
if(!vdata.linkUrl) return
|
||||
uni.navigateTo({
|
||||
url: '/pages/H5/H5?url='+ vdata.linkUrl
|
||||
})
|
||||
}
|
||||
onUnload(()=>{
|
||||
console.log('页面卸载');
|
||||
uni.$emit('onRechargeSuccess',true)
|
||||
})
|
||||
</script>
|
||||
<style lang="scss">
|
||||
.pay-result {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
}
|
||||
.pay-result-icon {
|
||||
padding-top: 120rpx;
|
||||
width: 240rpx;
|
||||
height: 166rpx;
|
||||
}
|
||||
.pay-result-err {
|
||||
// padding-top: 30rpx;
|
||||
font-size: 34rpx;
|
||||
font-weight: 600;
|
||||
color: #242526;
|
||||
}
|
||||
.pay-result-msg {
|
||||
width: 75%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
padding-top: 70rpx;
|
||||
color: #999999;
|
||||
|
||||
.msg {
|
||||
line-height: 42rpx;
|
||||
}
|
||||
}
|
||||
.pay-result-amount {
|
||||
padding-top: 34rpx;
|
||||
|
||||
.pay-result-amount-text{
|
||||
font-size: 28rpx;
|
||||
font-family: HiraginoSansGB-W3, HiraginoSansGB;
|
||||
color: #303132;
|
||||
}
|
||||
.pay-result-amount-value {
|
||||
font-size: 36rpx;
|
||||
font-family: HiraginoSansGB-W3, HiraginoSansGB;
|
||||
font-weight: 600;
|
||||
color: #FC0100;
|
||||
}
|
||||
}
|
||||
.back-btn {
|
||||
position: fixed;
|
||||
bottom: 260rpx;
|
||||
width: 350rpx;
|
||||
height: 80rpx;
|
||||
border-radius: 6rpx 6rpx 6rpx 6rpx;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
color: #FFFFFF;
|
||||
}
|
||||
.ad-wrapper{
|
||||
margin: 50rpx auto;
|
||||
margin-top: 100rpx;
|
||||
width: 700rpx;
|
||||
min-height: 380rpx;
|
||||
display: flex;
|
||||
border-radius: 10rpx;
|
||||
justify-content: center;
|
||||
overflow: hidden;
|
||||
image {
|
||||
width: 100%;
|
||||
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
167
jeepay-ui-uapp-cashier/pages/paySuccess/redSuccess.vue
Normal file
167
jeepay-ui-uapp-cashier/pages/paySuccess/redSuccess.vue
Normal file
@@ -0,0 +1,167 @@
|
||||
<template>
|
||||
<view class="page-view" :style="{'background-image': `url(${vdata.sysBgUrl})`}" >
|
||||
<view class="page-text-title" @click="goToPreviousPage()">
|
||||
<view> ＜返回 </view>
|
||||
</view>
|
||||
<view class="page-view-weapper" :style="{'background-image': `url(${vdata.sysBgUrl2})`}">
|
||||
<view class="price-box">
|
||||
<text class="price-ico">￥</text>
|
||||
<text class="price-text">{{vdata.rewardAmt}}</text>
|
||||
</view>
|
||||
<view class="order-text">
|
||||
<view class="order-text-box">
|
||||
<text class="price-ico">订单金额</text>
|
||||
<text class="price-text">￥{{vdata.transAmt}}</text>
|
||||
</view>
|
||||
<view class="order-text-box">
|
||||
<text class="price-ico">红包抵扣</text>
|
||||
<text class="price-text">￥{{vdata.changeAmt}}</text>
|
||||
</view>
|
||||
<view class="order-text-box order-text-box-price">
|
||||
<text class="price-ico">实际支付</text>
|
||||
<text class="price-text">￥{{vdata.findAmt}}</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
<script setup>
|
||||
import { doubleToThousands } from '@/util/amount.js'
|
||||
import { onLoad,onUnload } from '@dcloudio/uni-app'
|
||||
import { reactive } from 'vue'
|
||||
import { $getAdvert,$getMarketingConfig,$getDiscountDetail } from '@/http/apiManager.js'
|
||||
import appConfig from '@/config/appConfig.js'
|
||||
import theme from '@/config/theme.js'
|
||||
|
||||
const vdata = reactive({
|
||||
amount: '0', // 订单金额
|
||||
payOrderId: '', // 订单号
|
||||
doubleToThousands: doubleToThousands(),
|
||||
primaryColor: '',
|
||||
advertUrl: '',
|
||||
sysBgUrl:"",
|
||||
sysBgUrl2:"",
|
||||
rewardAmt:0,
|
||||
transAmt:0,
|
||||
changeAmt:0,
|
||||
findAmt:0,
|
||||
})
|
||||
|
||||
onLoad((params) => {
|
||||
//获取平台红包功能
|
||||
// getMarketingConfig();
|
||||
// vdata.amount = params.amount
|
||||
vdata.primaryColor = theme.changeColors()
|
||||
// vdata.member = params.member
|
||||
console.log(params,'paramsparamsparams')
|
||||
|
||||
if (params.payOrderId) {
|
||||
vdata.payOrderId = params.payOrderId
|
||||
}
|
||||
vdata.sysBgUrl = appConfig.marketingConfig.sysBgUrl
|
||||
vdata.sysBgUrl2 = appConfig.marketingConfig.sysBgUrl2
|
||||
|
||||
$getDiscountDetail(vdata.payOrderId).then(({bizData}) => {
|
||||
|
||||
//订单金额
|
||||
vdata.transAmt = (bizData.order.amount/100).toFixed(2)
|
||||
//红包抵扣
|
||||
vdata.changeAmt = (bizData.order.discountAmt/100).toFixed(2)
|
||||
//实际支付
|
||||
vdata.findAmt = (bizData.order.findAmt/100).toFixed(2)
|
||||
if(bizData.redPacketInfo){
|
||||
//红包奖励
|
||||
vdata.rewardAmt = (bizData.redPacketInfo.rewardAmt/100).toFixed(2)
|
||||
}
|
||||
}).catch(err => {
|
||||
console.log(err);
|
||||
})
|
||||
})
|
||||
function back() {
|
||||
uni.navigateBack()
|
||||
}
|
||||
function getMarketingConfig(){
|
||||
$getMarketingConfig('marketingConfig').then(({bizData}) => {
|
||||
vdata.sysBgUrl = bizData.marketingConfig.sysBgUrl
|
||||
// console.log(vdata.sysBgUrl,'vdata.sysBgUrl')
|
||||
vdata.sysBgUrl2 = bizData.marketingConfig.sysBgUrl2
|
||||
})
|
||||
}
|
||||
// 点击按钮时触发的事件处理函数
|
||||
function goToPreviousPage() {
|
||||
uni.navigateTo({
|
||||
url: '/pages/payway/index'
|
||||
})
|
||||
}
|
||||
onUnload(()=>{
|
||||
console.log('页面卸载');
|
||||
uni.$emit('onRechargeSuccess',true)
|
||||
})
|
||||
</script>
|
||||
<style lang="scss">
|
||||
.page-text-title{
|
||||
position: absolute;
|
||||
color: #090909;
|
||||
font-family: 600;
|
||||
font-size: 36rpx;
|
||||
width: 100%;
|
||||
top: 5%;
|
||||
left: 5%;
|
||||
}
|
||||
//https://syb-jq-public.oss-cn-hangzhou.aliyuncs.com/oem/5999e9eb-6839-4608-869c-f6f39cef7bc1.png
|
||||
// https://syb-jq-public.oss-cn-hangzhou.aliyuncs.com/oem/a86ccec4-ed2a-46bc-b5b5-bb42b9e8939d.png
|
||||
// https://syb-jq-public.oss-cn-hangzhou.aliyuncs.com/oem/eecc2da4-9e9e-4ee2-a206-900e38298224.png
|
||||
.page-view{
|
||||
// background-image: url('https://syb-jq-public.oss-cn-hangzhou.aliyuncs.com/oem/a86ccec4-ed2a-46bc-b5b5-bb42b9e8939d.png') ;
|
||||
background-size: cover;
|
||||
height: 100vh;
|
||||
position: relative;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
.page-view-weapper{
|
||||
// background-image: url('https://syb-jq-public.oss-cn-hangzhou.aliyuncs.com/oem/eecc2da4-9e9e-4ee2-a206-900e38298224.png') ;
|
||||
// background-image: url('https://syb-jq-public.oss-cn-hangzhou.aliyuncs.com/oem/ae73fd83-89dc-4b47-838e-6d67b150f7ee.png') ;
|
||||
background-size: cover;
|
||||
height: 50vh;
|
||||
width: 50vh;
|
||||
position: relative;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
z-index: 9999;
|
||||
top: 30px;
|
||||
}
|
||||
.price-box{
|
||||
// margin-top: 10%;
|
||||
position: absolute;
|
||||
top: 10%;
|
||||
background: linear-gradient(to right, #FF7300, #FF312B); /* 设置线性渐变色 */
|
||||
-webkit-background-clip: text; /* 使用文本作为背景剪辑 */
|
||||
color: transparent; /* 隐藏实际文本颜色 */
|
||||
.price-ico{
|
||||
font-size: 100rpx;
|
||||
font-weight: 600;
|
||||
}
|
||||
.price-text{
|
||||
font-size: 140rpx;
|
||||
font-weight: 600;
|
||||
}
|
||||
}
|
||||
.order-text{
|
||||
margin-top: 8%;
|
||||
.order-text-box{
|
||||
font-size: 35rpx;
|
||||
color: #CD5E18;
|
||||
text{
|
||||
padding: 20rpx 100rpx;
|
||||
}
|
||||
}
|
||||
.order-text-box-price{
|
||||
color: #9F4A14;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
1292
jeepay-ui-uapp-cashier/pages/payment/index.vue
Normal file
1292
jeepay-ui-uapp-cashier/pages/payment/index.vue
Normal file
File diff suppressed because it is too large
Load Diff
1119
jeepay-ui-uapp-cashier/pages/payment/lite.vue
Normal file
1119
jeepay-ui-uapp-cashier/pages/payment/lite.vue
Normal file
File diff suppressed because it is too large
Load Diff
146
jeepay-ui-uapp-cashier/pages/payment/result.vue
Normal file
146
jeepay-ui-uapp-cashier/pages/payment/result.vue
Normal file
@@ -0,0 +1,146 @@
|
||||
<!-- 支付结果页 -->
|
||||
<template>
|
||||
<view class="success-page">
|
||||
|
||||
<view class="success-box u-flex-col u-row-center u-col-center">
|
||||
<view><image class="pay-img" :src="payImg[payState]" mode=""></image></view>
|
||||
<view><text class="notice">{{ payText[payState] }}</text></view>
|
||||
<view><text class="pay-money" v-if="payState === 'success' && orderDetail.total_fee">￥{{ orderDetail.total_fee }}</text></view>
|
||||
<view class="btn-box u-flex u-row-between" v-if="showModal == 'app'">
|
||||
<button class="u-reset-button base-btn" open-type="launchApp" app-parameter="wechat" binderror="launchAppError" >返回APP </button>
|
||||
</view>
|
||||
|
||||
<view class="btn-box u-flex u-row-between" v-if="showModal == 'xcx'">
|
||||
<button class="u-reset-button base-btn" @click="getLos()" >返回 </button>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { mapMutations, mapActions, mapState, mapGetters } from 'vuex';
|
||||
let payTimer = null;
|
||||
const payCount = 5;
|
||||
export default {
|
||||
components: {},
|
||||
data() {
|
||||
return {
|
||||
showModal: 'h5',
|
||||
messageType: '',
|
||||
templateIds: [],
|
||||
wxOpenTags: '',
|
||||
orderDetail: {}, //订单详情
|
||||
orderType: '', //订单类型
|
||||
payText: {
|
||||
fail: '支付失败',
|
||||
success: '支付成功',
|
||||
paying: '查询中...'
|
||||
},
|
||||
payImg: {
|
||||
fail: '/static/syb/order_pay_fail.gif',
|
||||
success: '/static/syb/order_pay_success.gif',
|
||||
paying:'/static/syb/order_paying.gif'
|
||||
},
|
||||
payState: '' //支付状态
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
...mapGetters(['subscribeMessageIdsMap'])
|
||||
},
|
||||
onLoad(opt) {
|
||||
var that = this;
|
||||
that.payState = opt.pay_state
|
||||
that.showModal = opt.show_modal
|
||||
console.log(that.showModal,'that.showModal')
|
||||
},
|
||||
methods: {
|
||||
...mapActions(['getCartList']),
|
||||
getLos(){
|
||||
wx.navigateBackMiniProgram({
|
||||
extraData: {
|
||||
name: '半屏小程序返回',
|
||||
status: this.payState
|
||||
},
|
||||
success(res) {
|
||||
// 返回成功
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss" scopeds>
|
||||
.success-box {
|
||||
text-align: center;
|
||||
background: #fff;
|
||||
width: 750rpx;
|
||||
padding: 40rpx 0;
|
||||
|
||||
.pay-img {
|
||||
width: 130rpx;
|
||||
height: 130rpx;
|
||||
}
|
||||
|
||||
.notice {
|
||||
font-size: 30rpx;
|
||||
|
||||
font-weight: bold;
|
||||
color: rgba(51, 51, 51, 1);
|
||||
line-height: 30rpx;
|
||||
margin-top: 30rpx;
|
||||
}
|
||||
|
||||
.pay-money {
|
||||
font-size: 36rpx;
|
||||
color: #ff3000;
|
||||
font-weight: 600;
|
||||
margin-top: 20rpx;
|
||||
}
|
||||
|
||||
.btn-box {
|
||||
margin-top: 30rpx;
|
||||
// width: 660rpx;
|
||||
|
||||
.base-btn {
|
||||
width: 320rpx;
|
||||
line-height: 70rpx;
|
||||
background: rgba(255, 255, 255, 1);
|
||||
border: 1rpx solid rgba(223, 223, 223, 0.5);
|
||||
border-radius: 35rpx;
|
||||
font-size: 28rpx;
|
||||
|
||||
font-weight: 400;
|
||||
color: rgba(153, 153, 153, 1);
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.again-pay {
|
||||
width: 320rpx;
|
||||
line-height: 70rpx;
|
||||
background: linear-gradient(90deg, rgba(233, 180, 97, 1), rgba(238, 204, 137, 1));
|
||||
box-shadow: 0px 7rpx 6rpx 0px rgba(229, 138, 0, 0.22);
|
||||
border-radius: 35rpx;
|
||||
font-size: 28rpx;
|
||||
|
||||
font-weight: 400;
|
||||
color: rgba(255, 255, 255, 0.8);
|
||||
padding: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.hot-box {
|
||||
background: #fff;
|
||||
padding: 20rpx;
|
||||
margin-top: 20rpx;
|
||||
|
||||
.hot-title {
|
||||
font-size: 30rpx;
|
||||
|
||||
font-weight: 500;
|
||||
color: rgba(51, 51, 51, 1);
|
||||
height: 80rpx;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
209
jeepay-ui-uapp-cashier/pages/payway/components/SelectedPay.vue
Normal file
209
jeepay-ui-uapp-cashier/pages/payway/components/SelectedPay.vue
Normal file
@@ -0,0 +1,209 @@
|
||||
<template>
|
||||
<uni-popup ref="popup" type="bottom" :safe-area="false" >
|
||||
|
||||
<view class="list-wrapper">
|
||||
<view class="list-top">
|
||||
<text>支付方式</text>
|
||||
</view>
|
||||
<view class="store" >
|
||||
<view class="store-inner-slot" v-for="(item,i) in props.list" @tap="selectFunc(item,i)" >
|
||||
<view class="left">
|
||||
<image class="left-img" :src="item.img" mode="scaleToFill" />
|
||||
<text class="left-text">
|
||||
{{item.name}}
|
||||
<text class="left-price" v-if="item.value == 5">（可用{{ item.price}}元）</text>
|
||||
</text>
|
||||
</view>
|
||||
<view class="more-selected">
|
||||
<image :src="item.checked ? '/static/img/success.png' : '/static/img/unselected.png'" mode="scaleToFill" />
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="footer-wrapper">
|
||||
<view class="footer-main">
|
||||
<view class="footer-button">
|
||||
<!-- <view class="flex-center" hover-class="touch-button" @tap="close">取消</view> -->
|
||||
<view @tap="confirmFunc" class="confirm flex-center" hover-class="touch-button">确认</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</uni-popup>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { ref } from "vue";
|
||||
const props = defineProps({
|
||||
list: {
|
||||
type: Array,
|
||||
},
|
||||
});
|
||||
const emits = defineEmits(["choiceValue"]);
|
||||
const popup = ref();
|
||||
console.log(props.list,'propspropspropsprops')
|
||||
const open = () => {
|
||||
popup.value.open();
|
||||
};
|
||||
// const searchText = ref("");
|
||||
// const filerBank = () => {
|
||||
// return props.list.filter((v) => v[props.value].includes(searchText.value));
|
||||
// };
|
||||
const choice = (val) => {
|
||||
popup.value.close();
|
||||
};
|
||||
function selectFunc(item,i){
|
||||
var list = props.list
|
||||
list.forEach((item,key)=>{
|
||||
if(key == i){
|
||||
item.checked = true
|
||||
}else{
|
||||
item.checked = false
|
||||
}
|
||||
})
|
||||
emits("choiceValue", i);
|
||||
props.list = list
|
||||
}
|
||||
|
||||
function confirmFunc(){
|
||||
emits("choiceValue", null,1);
|
||||
}
|
||||
defineExpose({ open });
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
|
||||
.list-wrapper {
|
||||
// display: flex;
|
||||
// flex-direction: column;
|
||||
border-radius: 16rpx 16rpx 0 0;
|
||||
background-color: #fafafa;
|
||||
max-height: 1000rpx;
|
||||
padding: 30rpx;
|
||||
position: relative;
|
||||
bottom: 0;
|
||||
.search-input {
|
||||
input {
|
||||
border-bottom: 1px solid #ccc;
|
||||
text-indent: 1rem;
|
||||
padding: 10rpx 0;
|
||||
}
|
||||
}
|
||||
.list-mian {
|
||||
flex: 1;
|
||||
overflow-y: scroll;
|
||||
margin-top: 20rpx;
|
||||
.list-item {
|
||||
margin: 10rpx 0;
|
||||
padding: 10rpx;
|
||||
font-size: 28rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
.store-inner-slot {
|
||||
position: relative;
|
||||
margin: 20rpx -10rpx;
|
||||
background-color: #fff;
|
||||
align-items: center;
|
||||
// padding: 0 40rpx;
|
||||
// height: 120rpx;
|
||||
font-size: 30rpx;
|
||||
border-radius: 10rpx;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: space-between;
|
||||
padding: 24rpx;
|
||||
.left {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
.right {
|
||||
color: #999999;
|
||||
}
|
||||
}
|
||||
|
||||
.left-img{
|
||||
width: 50rpx;
|
||||
height: 50rpx;
|
||||
margin-right: 6rpx;
|
||||
margin-top: 6rpx;
|
||||
}
|
||||
.left-text{
|
||||
|
||||
font-family: PingFang SC-Regular;
|
||||
font-size: 32rpx;
|
||||
font-weight: 400;
|
||||
.left-price{
|
||||
color: #8F97A9;
|
||||
font-size: 24rpx;
|
||||
};
|
||||
}
|
||||
.more-selected {
|
||||
width: 60rpx;
|
||||
height: 60rpx;
|
||||
// border-radius: 50%;
|
||||
// margin-right: 20rpx;
|
||||
// border: 2rpx solid rgba(217, 217, 217, 1);
|
||||
image {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
// .store {
|
||||
// position: relative;
|
||||
// margin: 20rpx;
|
||||
// border-radius: 20rpx;
|
||||
// background-color: #fafafa;
|
||||
// display: flex;
|
||||
// justify-content: flex-start;
|
||||
// align-items: center;
|
||||
// padding: 0 40rpx;
|
||||
// // height: 120rpx;
|
||||
// font-size: 30rpx;
|
||||
// }
|
||||
|
||||
.footer-wrapper {
|
||||
// height: 186rpx;
|
||||
margin-top: 150rpx;
|
||||
.footer-main {
|
||||
position: fixed;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
// border-top: 1rpx solid #ededed;
|
||||
.tips {
|
||||
margin: 20rpx;
|
||||
text-align: center;
|
||||
font-size: 27rpx;
|
||||
color: #a6a6a6;
|
||||
}
|
||||
.footer-button {
|
||||
padding: 0 30rpx;
|
||||
margin-top: 30rpx;
|
||||
padding-bottom: 30rpx;
|
||||
display: flex;
|
||||
|
||||
justify-content: space-between;
|
||||
view {
|
||||
text-align: center;
|
||||
padding: 20rpx 0px;
|
||||
font-size: 50rpx;
|
||||
width: 100%;
|
||||
// height: 110rpx;
|
||||
font-size: 33rpx;
|
||||
font-weight: 500;
|
||||
color: rgba(0, 0, 0, 0.5);
|
||||
border-radius: 20rpx;
|
||||
background-color: #f7f7f7;
|
||||
}
|
||||
.confirm {
|
||||
color: #fff;
|
||||
background: #2980fd;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.list-top{
|
||||
margin-bottom: 40rpx;
|
||||
font-weight: 600;
|
||||
}
|
||||
</style>
|
||||
899
jeepay-ui-uapp-cashier/pages/payway/index.vue
Normal file
899
jeepay-ui-uapp-cashier/pages/payway/index.vue
Normal file
@@ -0,0 +1,899 @@
|
||||
<template>
|
||||
<view class="content">
|
||||
<!-- <view class="content-top-bg" :style="{'backgroundColor': vdata.primaryColor}"></view> -->
|
||||
<view class="payment">
|
||||
<view class="payment-mchName" @tap="advancedFunc">
|
||||
<view style="display: contents;">
|
||||
<image src="/static/img/store.svg" mode="scaleToFill" class="payment-mchName-img" />
|
||||
<view style="display: grid;margin-left: 16rpx;">
|
||||
<text class="payment-mchName1">{{ vdata.payOrderInfo.mchName }}</text>
|
||||
<view class="payment-mchName2">
|
||||
<text class="payment-mchName2-text1">门店</text>
|
||||
<text class="payment-mchName2-text2">{{vdata.payOrderInfo.storeName}}</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="payment-divider"></view>
|
||||
<view class="payment-amountTips">
|
||||
<view class="desc1 ">付款金额：</view>
|
||||
<view class="desc2 " v-if="!vdata.buyerRemark" @tap="showRemarkModel"><span v-if="vdata.isForceReamrk" style='color: #FF0000;'>*</span>添加备注</view>
|
||||
<text class="desc2 buyer-remark" v-else @tap="showRemarkModel">
|
||||
{{ vdata.buyerRemark }}
|
||||
<text :style="{ 'padding-left': '6rpx'}">修改</text>
|
||||
</text>
|
||||
</view>
|
||||
<view class="payment-amount" >
|
||||
<text class="payment-amount-rmb">￥</text>
|
||||
<text class="payment-amount-value">{{ doubleToThousands(vdata.amount) }}</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="payment-amountTips-price" >
|
||||
<!-- -->
|
||||
<view class="desc3">
|
||||
<view v-if="vdata.redPacketIsOpen">
|
||||
<text class="desc3-text1" >红包</text><text class="desc3-text2">可用余额：￥{{(appConfig.redbalance / 100).toFixed(2)}} </text>
|
||||
</view>
|
||||
</view>
|
||||
<!-- <view class="desc4" ><text class="desc4-text1" >实付金额</text><text class="desc4-text2">￥{{doubleToThousands(vdata.originAmount) }}</text></view> -->
|
||||
|
||||
<!-- <view class="payment-text-amount txt">实付金额：<text></text></view> -->
|
||||
</view>
|
||||
|
||||
<!-- <view class="pay-div-type">
|
||||
<radio-group @change="radioChange" style="width: 100%;">
|
||||
<view class="radio-group-box" style="display: flex;" v-if="appConfig.pageType == 'wechatLite'" >
|
||||
<view class="radio-group-name " >
|
||||
<img src="https://syb-jq-public.oss-cn-hangzhou.aliyuncs.com/oem/6e4f3ca5-a334-4af4-a57c-63fca61c95d7.svg" alt="">
|
||||
<text class="radio-group-name1">微信</text>
|
||||
</view>
|
||||
<view class="radio-group-radio " >
|
||||
<radio color="#1678FF" value="1" :checked="1 == vdata.current" />
|
||||
</view>
|
||||
</view>
|
||||
<view class="radio-group-box" style="display: flex;" v-if="appConfig.pageType == 'alipayLite'">
|
||||
<view class="radio-group-name " >
|
||||
<img src="https://syb-jq-public.oss-cn-hangzhou.aliyuncs.com/oem/0e4f0b6a-e96e-45bf-a5bb-127c64c3396a.svg" alt="">
|
||||
<text class="radio-group-name1">支付宝</text>
|
||||
</view>
|
||||
<view class="radio-group-radio " >
|
||||
<radio color="#1678FF" value="2" :checked="2 == vdata.current" />
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="radio-group-box" style="display: flex;" v-if="appConfig.redPacketIsOpen" >
|
||||
<view class="radio-group-name " >
|
||||
<img src="https://syb-jq-public.oss-cn-hangzhou.aliyuncs.com/notice/d3be6339-5abe-415b-981c-3568ebd66f57.png" alt="">
|
||||
<text class="radio-group-name1">红包</text>
|
||||
<text class="radio-group-name-price" >(可用{{appConfig.redbalance}}元)</text>
|
||||
</view>
|
||||
<view class="radio-group-radio " >
|
||||
<radio color="#1678FF" value="3" :checked="3 == vdata.current" />
|
||||
</view>
|
||||
</view>
|
||||
</radio-group>
|
||||
</view> -->
|
||||
|
||||
<!-- v-if="!vdata.payOrderInfo['fixedFlag']" -->
|
||||
<view class="payment-keyboard" >
|
||||
<!-- <text class="buyer-remark" v-if="!vdata.buyerRemark" @tap="showRemarkModel">添加备注</text> -->
|
||||
<!-- <text class="buyer-remark" v-else @tap="showRemarkModel">
|
||||
{{ vdata.buyerRemark }}
|
||||
<text :style="{ 'padding-left': '6rpx'}">修改</text>
|
||||
</text> -->
|
||||
<view class="payment-text" v-if="vdata.isAdsOpen">
|
||||
|
||||
<view class="payment-text-guanggao txt" @click="getadsName()" >
|
||||
<!-- <scroll-view class="scroll-view" scroll-x="true" :scroll-left="vdata.scrollLeft" autoplay @scrolltolower="scrollToLower"> -->
|
||||
<view class="scroll-content" >
|
||||
{{appConfig.marketingConfig.adsName}}
|
||||
</view>
|
||||
<!-- <text ></text> -->
|
||||
<!-- </scroll-view> -->
|
||||
</view>
|
||||
<!-- <view class="payment-text-amount txt">实付金额：<text>￥{{doubleToThousands(vdata.originAmount) }}</text></view> -->
|
||||
</view>
|
||||
<syb-keyboard
|
||||
ref="sybKeyboardRef"
|
||||
:primaryColor="vdata.primaryColor"
|
||||
@change="onChange"
|
||||
@pay="getSybPayType">
|
||||
</syb-keyboard>
|
||||
</view>
|
||||
<!-- <view v-if="vdata.payOrderInfo['fixedFlag']" class="payment-no-keyboard" @tap="pay">付 款</view> -->
|
||||
|
||||
<view v-if="vdata.remarkVisible" class="remark-model">
|
||||
<view class="remark-content">
|
||||
<text class="remark-content-title" >添加备注</text>
|
||||
<input v-model="vdata.modelRemark" :focus="vdata.remarkVisible" maxlength="40" placeholder="最多输入20个字" class="remark-content-body" />
|
||||
<view class="remark-content-btn">
|
||||
<text class="btn-cancel" @tap.stop="closeRemarkModel">取消</text>
|
||||
<text class="btn-confirm" :style="{'backgroundColor': '#1678FF', 'borderColor': '#ffffff'}" @tap.stop="confirmRemark">确认</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- <SelectedPay ref="sybCodePay" :list="vdata.payTypeList" @choiceValue="updataBank" /> -->
|
||||
|
||||
<!-- 选择支付 接口 -->
|
||||
<!-- <JeepayPopupListSelect style="background-color: #fff;" ref="selectIfcodeRef" title='支付方式' :isCheckbox="false" :reqTableDataFunc="reqTableDataByIfcodeFunc"
|
||||
:fields="{ key: 'value', left: 'name', right: 'value', img: 'img' }" @confirm="confirmIfCode">
|
||||
|
||||
|
||||
</JeepayPopupListSelect> -->
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { onMounted, reactive, ref } from 'vue'
|
||||
import { onLoad } from '@dcloudio/uni-app'
|
||||
import { $getPayOrderInfo, $getPayPackage,$getMarketingConfig,$getCalcDiscount } from '@/http/apiManager.js'
|
||||
import { doubleToThousands } from '@/util/amount.js'
|
||||
import { toErrPageFunc } from '@/util/toErrorPageUtil.js'
|
||||
import appConfig from '@/config/appConfig.js'
|
||||
import theme from '@/config/theme.js'
|
||||
// import SelectedPay from './components/SelectedPay.vue'
|
||||
import paywayCallFunc from '@/pages/payway/payway.js'
|
||||
|
||||
const sybCodePay = ref()
|
||||
const sybKeyboardRef = ref()
|
||||
const selectIfcodeRef = ref()
|
||||
|
||||
const vdata = reactive({
|
||||
scrollLeft: 0, // 滚动位置
|
||||
scrollSpeed: 2, // 滚动速度，单位px/ms
|
||||
scrollInterval: null, // 定时器ID
|
||||
payTypeList:[] as any,
|
||||
typeItems: [{
|
||||
img:"/static/img/wechat.png",
|
||||
value: 1,
|
||||
name: '微信支付',
|
||||
checked: false,
|
||||
},{
|
||||
img:"/static/img/wechat.png",
|
||||
value: 2,
|
||||
name: '微信H5',
|
||||
checked: false,
|
||||
},{
|
||||
img:"/static/payIcon/zfb.png",
|
||||
value: 3,
|
||||
name: '支付宝支付',
|
||||
checked: false,
|
||||
},{
|
||||
img:"/static/payIcon/zfb.png",
|
||||
value: 4,
|
||||
name: '支付宝H5',
|
||||
checked: false,
|
||||
},{
|
||||
img:"/static/img/payred.png",
|
||||
value: 5,
|
||||
name: '红包',
|
||||
checked: false,
|
||||
price: '',
|
||||
},
|
||||
],
|
||||
addIfCodeList:{} as any,
|
||||
isAdsOpen:false,
|
||||
redPacketIsOpen:false,
|
||||
current: 0,
|
||||
primaryColor: '',
|
||||
originAmount: '0',
|
||||
amount: '0',
|
||||
buyerRemark: '', // 买家备注
|
||||
modelRemark: '', // 弹层显示备注
|
||||
remarkVisible: false,
|
||||
doubleToThousands: doubleToThousands(),
|
||||
payOrderInfo: {},
|
||||
calcDiscount:{},
|
||||
storeId:'',
|
||||
clearStorageFlag: 0, //显示清空缓存的提示
|
||||
isForceReamrk:false,
|
||||
}) as any
|
||||
|
||||
onLoad(() => {
|
||||
|
||||
vdata.amount = '0'
|
||||
vdata.primaryColor = theme.changeColors()
|
||||
|
||||
|
||||
// #ifdef H5
|
||||
console.log(111111111111111111111111111111111111111)
|
||||
//解决H5的刷新问题
|
||||
if(!appConfig.tokenValue){ // 不存在 则需要跳转到首页再次放置 获取userID等信息。
|
||||
|
||||
window.location.href = '/cashier/pages/hub/default?' + appConfig.tokenKey + "=" + window.sessionStorage.getItem(appConfig.tokenKey)
|
||||
return false;
|
||||
}
|
||||
// #endif
|
||||
// 获取订单信息
|
||||
// getOrderInfo()
|
||||
|
||||
})
|
||||
onMounted(() => {
|
||||
getOrderInfo()
|
||||
})
|
||||
function getPayType(){
|
||||
const typeItems = vdata.typeItems
|
||||
vdata.payTypeList = [];
|
||||
console.log(appConfig.redPacketIsOpen,'appConfigredPacketIsOpen')
|
||||
if(!appConfig.redPacketIsOpen){
|
||||
delete typeItems[4]
|
||||
}
|
||||
if(appConfig.currentPageType == 'wechatLite'){
|
||||
delete typeItems[1]
|
||||
delete typeItems[2]
|
||||
delete typeItems[3]
|
||||
}
|
||||
if(appConfig.currentPageType == 'wechatH5'){
|
||||
delete typeItems[0]
|
||||
delete typeItems[2]
|
||||
delete typeItems[3]
|
||||
}
|
||||
if(appConfig.currentPageType == 'alipayLite'){
|
||||
delete typeItems[0]
|
||||
delete typeItems[1]
|
||||
delete typeItems[3]
|
||||
}
|
||||
// return uni.showToast({
|
||||
// title: appConfig.currentPageType,
|
||||
// icon: 'none'
|
||||
// })
|
||||
if(appConfig.currentPageType == 'alipayH5'){
|
||||
delete typeItems[0]
|
||||
delete typeItems[1]
|
||||
delete typeItems[2]
|
||||
}
|
||||
console.log(typeItems,'codePay')
|
||||
typeItems.forEach(function(item,index){
|
||||
if(index == 4){
|
||||
item.price = appConfig.redbalance
|
||||
}
|
||||
if(appConfig.currentPageType == 'wechatLite' || appConfig.currentPageType == 'wechatH5'){
|
||||
if(item.value == 3 || item.value == 4){
|
||||
|
||||
}else{
|
||||
vdata.payTypeList.push(item)
|
||||
}
|
||||
}else if(appConfig.currentPageType == 'alipayLite' || appConfig.currentPageType == 'alipayH5'){
|
||||
if(item.value == 0 || item.value == 1){
|
||||
|
||||
}else{
|
||||
vdata.payTypeList.push(item)
|
||||
}
|
||||
}
|
||||
})
|
||||
|
||||
if(typeItems.length){
|
||||
typeItems[0].checked = true
|
||||
}
|
||||
}
|
||||
function updataBank (index,type=0) {
|
||||
console.log(type,'typetype')
|
||||
if(type == 1){
|
||||
pay()
|
||||
return false;
|
||||
}
|
||||
if(vdata.payTypeList[index].value == 5){
|
||||
if(appConfig.redPacketIsOpen){
|
||||
getCalcDiscount(vdata.amount)
|
||||
}else{
|
||||
vdata.originAmount = vdata.amount
|
||||
}
|
||||
}
|
||||
}
|
||||
function startAutoScroll() {
|
||||
if (vdata.scrollInterval) {
|
||||
clearInterval(vdata.scrollInterval);
|
||||
}
|
||||
const contentWidth = uni.upx2px(375) * 3; // 假设内容宽度是屏幕宽度的三倍，这里需要根据实际情况调整
|
||||
vdata.scrollInterval = setInterval(() => {
|
||||
if (vdata.scrollLeft < contentWidth) {
|
||||
vdata.scrollLeft += vdata.scrollSpeed;
|
||||
} else {
|
||||
vdata.scrollLeft = 0;
|
||||
}
|
||||
}, 100); // 每100ms滚动一次，可以根据需要调整
|
||||
}
|
||||
function stopAutoScroll() {
|
||||
clearInterval(vdata.scrollInterval);
|
||||
vdata.scrollInterval = null;
|
||||
}
|
||||
function scrollToLower(){
|
||||
vdata.scrollLeft = 0;
|
||||
}
|
||||
function getSybPayType(){
|
||||
if(vdata.amount <= 0) {
|
||||
return uni.showToast({
|
||||
title: '金额必须大于0',
|
||||
icon: 'none'
|
||||
})
|
||||
return false;
|
||||
}
|
||||
if(vdata.payTypeList.length <= 1){
|
||||
pay()
|
||||
return false;
|
||||
}else{
|
||||
sybCodePay.value.open();
|
||||
}
|
||||
}
|
||||
// 选择支付通道
|
||||
function confirmIfCode (selected) {
|
||||
selectIfcodeRef.value.close()
|
||||
}
|
||||
|
||||
function radioChange(evt) {
|
||||
console.log(evt.target.value,'evt')
|
||||
vdata.current = evt.target.value;
|
||||
}
|
||||
|
||||
// 输入金额
|
||||
function onChange(e: any) {
|
||||
if(vdata.payOrderInfo['fixedFlag']){
|
||||
return false;
|
||||
}
|
||||
vdata.amount = e
|
||||
if(appConfig.redPacketIsOpen){
|
||||
getCalcDiscount(e)
|
||||
}else{
|
||||
vdata.originAmount = e
|
||||
}
|
||||
}
|
||||
function getadsName(){
|
||||
if(!appConfig.marketingConfig.isAdsOpen){
|
||||
return false;
|
||||
}
|
||||
uni.navigateTo({
|
||||
url: '/pages/H5/H5?url='+ appConfig.marketingConfig.adsUrl
|
||||
})
|
||||
}
|
||||
//获取红包信息
|
||||
function getMarketingConfig(storeId){
|
||||
$getMarketingConfig('marketingConfig',storeId).then(({bizData}) => {
|
||||
vdata.redPacketIsOpen = bizData.marketingConfig.isOpen
|
||||
console.log(bizData.marketingConfig.isAdsOpen,'bizData.marketingConfig.isAdsOpen')
|
||||
vdata.isAdsOpen = bizData.marketingConfig.isAdsOpen
|
||||
appConfig.redPacketIsOpen = bizData.marketingConfig.isOpen
|
||||
appConfig.redbalance = bizData.marketingConfig.balance
|
||||
appConfig.marketingConfig = bizData.marketingConfig
|
||||
})
|
||||
}
|
||||
//计算红包实付金额
|
||||
function getCalcDiscount(originAmount){
|
||||
$getCalcDiscount(originAmount,vdata.storeId).then(({bizData}) => {
|
||||
vdata.calcDiscount = bizData;
|
||||
vdata.originAmount = (bizData.findAmt/100).toFixed(2)
|
||||
vdata.discountAmt = bizData.discountAmt
|
||||
})
|
||||
}
|
||||
|
||||
// 获取订单信息
|
||||
function getOrderInfo() {
|
||||
$getPayOrderInfo().then(({bizData}) => {
|
||||
console.log(bizData,'bizDatabizDatabizDatabizData')
|
||||
appConfig.video = bizData.video
|
||||
vdata.payOrderInfo = bizData
|
||||
vdata.isForceReamrk = bizData.isForceReamrk
|
||||
vdata.storeId = '';
|
||||
if(bizData.storeId) {
|
||||
vdata.storeId = bizData.storeId
|
||||
}
|
||||
getMarketingConfig(vdata.storeId)
|
||||
|
||||
if(bizData.amount) {
|
||||
vdata.amount = (bizData.amount/100).toString()
|
||||
getCalcDiscount(vdata.amount)
|
||||
}
|
||||
|
||||
|
||||
// 金额传入键盘组件
|
||||
sybKeyboardRef.value.setValue(vdata.amount)
|
||||
|
||||
// 如果订单已支付，则转到提示页面
|
||||
if(bizData.state && bizData.state === 2) {
|
||||
return toErrPageFunc("订单已支付");
|
||||
}
|
||||
setTimeout(()=>{
|
||||
getPayType()
|
||||
},2000)
|
||||
// 自动调起支付
|
||||
if(bizData.autoPay) {
|
||||
// pay()
|
||||
}
|
||||
}).catch(err => {
|
||||
console.log(err);
|
||||
})
|
||||
}
|
||||
//视频号数据
|
||||
function sphGet(){
|
||||
console.log(appConfig.video,'videovideovideovideovideo')
|
||||
if(appConfig.currentPageType == 'alipayLite' || appConfig.currentPageType == 'alipayH5' || appConfig.video == undefined || appConfig.video == null){
|
||||
|
||||
|
||||
}else{
|
||||
uni.openChannelsActivity({
|
||||
finderUserName: appConfig.video.uniqueId,//视频号ID
|
||||
feedId: appConfig.video.exportId,//视频ID
|
||||
complete (res) {
|
||||
console.log(res)
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
}
|
||||
function toAddPage () {
|
||||
vdata.addIfCodeList = [
|
||||
{ifCode:"dgpay",ifName:"汇付斗拱支付"},
|
||||
{ifCode:"yspay",ifName:"银盛支付"},
|
||||
{ifCode:"kqpay",ifName:"快钱支付"},
|
||||
{ifCode:"lklspay",ifName:"拉卡拉支付"},
|
||||
{ifCode:"dgpay2",ifName:"汇付斗拱支付"}
|
||||
]
|
||||
vdata.addIfCodeList = vdata.typeItems
|
||||
selectIfcodeRef.value.open()
|
||||
}
|
||||
function reqTableDataByIfcodeFunc () {
|
||||
// 模拟请求数据
|
||||
return Promise.resolve({ bizData: { records: vdata.addIfCodeList, hasNext: false } })
|
||||
}
|
||||
// 发起支付
|
||||
function pay() {
|
||||
if(vdata.isForceReamrk && !vdata.modelRemark){
|
||||
vdata.remarkVisible = true
|
||||
return false;
|
||||
}
|
||||
vdata.payOrderInfo.amount = vdata.amount
|
||||
|
||||
if(vdata.amount <= 0) {
|
||||
return uni.showToast({
|
||||
title: '金额必须大于0',
|
||||
icon: 'none'
|
||||
})
|
||||
return false;
|
||||
}
|
||||
|
||||
// console.log(111111111)
|
||||
// uni.navigateTo({
|
||||
// url: '/pages/paySuccess/redSuccess?payOrderId=20240124O1750143430237061121'
|
||||
// })
|
||||
// return false;
|
||||
|
||||
if(vdata.redPacketIsOpen){
|
||||
if(!vdata.calcDiscount){
|
||||
return false;
|
||||
}
|
||||
if(!vdata.calcDiscount.findAmt){
|
||||
return false;
|
||||
}
|
||||
}
|
||||
uni.showLoading({
|
||||
title: '请稍等...',
|
||||
mask: true
|
||||
})
|
||||
// setTimeout(() => {
|
||||
// uni.navigateTo({
|
||||
// url: '/pages/paySuccess/redSuccess?payOrderId=O1749678699690803202'
|
||||
// })
|
||||
// }, 1000)
|
||||
// return false;
|
||||
$getPayPackage(vdata.amount, vdata.buyerRemark,null,null,vdata.calcDiscount).then( ({bizData}) => {
|
||||
uni.hideLoading()
|
||||
|
||||
console.log(bizData,'bizDatabizData')
|
||||
//订单创建异常
|
||||
if(bizData.code != '0') {
|
||||
let msg = bizData.msg;
|
||||
if(bizData.msg =='系统：Success'){
|
||||
msg = '订单异常'
|
||||
}
|
||||
return uni.showToast({title: msg,icon:'none'})
|
||||
// return toErrPageFunc(bizData.msg);
|
||||
}
|
||||
|
||||
// 订单响应结果
|
||||
let orderRes = bizData.data;
|
||||
|
||||
if(orderRes.orderState != 1 ) { //订单不是支付中，说明订单异常
|
||||
if(orderRes.msg){
|
||||
return uni.showToast({title: orderRes.msg,icon:'none'})
|
||||
}else if(orderRes.errMsg){
|
||||
return uni.showToast({title: orderRes.errMsg,icon:'none'})
|
||||
}else{
|
||||
return uni.showToast({title: '订单异常',icon:'none'})
|
||||
}
|
||||
// return toErrPageFunc(orderRes.errMsg);
|
||||
}
|
||||
|
||||
// if(bizData.code == 0){
|
||||
// uni.navigateTo({
|
||||
// url:"/pages/paySuccess/redSuccess"
|
||||
// })
|
||||
// return false;
|
||||
// }
|
||||
|
||||
if(orderRes.payUrl){
|
||||
location.href = orderRes.payUrl;
|
||||
return false;
|
||||
}
|
||||
|
||||
// 以下为调起 jsapi的函数： 分为： H5 和 各端小程序
|
||||
let thisPaywayCallFunc = paywayCallFunc()[appConfig.currentPageType];
|
||||
thisPaywayCallFunc(orderRes, vdata.payOrderInfo);
|
||||
}).catch( () => {
|
||||
uni.hideLoading()
|
||||
})
|
||||
|
||||
}
|
||||
|
||||
// 显示备注弹窗
|
||||
function showRemarkModel() {
|
||||
vdata.modelRemark = vdata.buyerRemark
|
||||
vdata.remarkVisible = true
|
||||
}
|
||||
|
||||
// 备注弹窗确认
|
||||
function confirmRemark() {
|
||||
vdata.buyerRemark = vdata.modelRemark
|
||||
vdata.remarkVisible = false
|
||||
}
|
||||
|
||||
// 关闭备注弹窗
|
||||
function closeRemarkModel() {
|
||||
vdata.modelRemark = ''
|
||||
vdata.remarkVisible = false
|
||||
}
|
||||
|
||||
// 高级功能模块的显示
|
||||
function advancedFunc(){
|
||||
|
||||
vdata.clearStorageFlag = vdata.clearStorageFlag + 1
|
||||
|
||||
if(vdata.clearStorageFlag >= 10){
|
||||
vdata.clearStorageFlag = 0
|
||||
|
||||
// 目前仅清空缓存
|
||||
uni.showModal({
|
||||
title: '确认清除缓存？',
|
||||
success: function(r) {
|
||||
if (r.confirm) {
|
||||
uni.clearStorageSync()
|
||||
return uni.showToast({title: '已清空'})
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.remark-model {
|
||||
position: fixed;
|
||||
height: 100vh;
|
||||
width: 100vw;
|
||||
z-index: 20;
|
||||
background-color: rgba(0,0,0,0.6);
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
|
||||
.remark-content {
|
||||
height: 290rpx;
|
||||
width: 600rpx;
|
||||
background-color: #FFFFFF;
|
||||
border-radius: 20rpx;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: space-between;
|
||||
padding: 50rpx 0 20rpx 0;
|
||||
margin-bottom: 70%;
|
||||
.remark-content-title {
|
||||
font-weight: bold;
|
||||
font-size: 33rpx;
|
||||
letter-spacing: 0.05em;
|
||||
margin-left: 50rpx;
|
||||
}
|
||||
|
||||
.remark-content-body {
|
||||
margin-left: 50rpx;
|
||||
}
|
||||
|
||||
.remark-content-btn {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: space-around;
|
||||
margin-left: 20rpx;
|
||||
|
||||
text {
|
||||
width: 230rpx;
|
||||
height: 90rpx;
|
||||
border-radius: 10rpx;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.btn-cancel{
|
||||
background: #fff;
|
||||
border: 1rpx solid #c5c7cc;
|
||||
font-weight: 500;
|
||||
font-size: 30rpx;
|
||||
letter-spacing: 0.07em;
|
||||
color: #808080;
|
||||
}
|
||||
|
||||
.btn-confirm{
|
||||
border: 3rpx solid #0041c4;
|
||||
font-weight: 500;
|
||||
font-size: 30rpx;
|
||||
letter-spacing: 0.07em;
|
||||
color: #fff;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.content {
|
||||
position: relative;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: flex-start;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
|
||||
.content-top-bg {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
width: 100%;
|
||||
height: 212rpx;
|
||||
border-radius: 0 0 30rpx 30rpx;
|
||||
z-index: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.payment {
|
||||
// position: relative;
|
||||
// width: 650rpx;
|
||||
width: 96%;
|
||||
// height: 321rpx;
|
||||
margin-top: 20rpx;
|
||||
border-radius: 30rpx;
|
||||
background: #fff;
|
||||
z-index: 1;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
||||
.payment-mchName {
|
||||
width: 100%;
|
||||
// height: 105rpx;
|
||||
padding: 30rpx 0;
|
||||
font-size: 30rpx;
|
||||
letter-spacing: 0.04em;
|
||||
padding-left: 30rpx;
|
||||
color: #000;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
.payment-divider {
|
||||
height: 1rpx;
|
||||
width: 100%;
|
||||
background-color: $uni-bg-color-grey;
|
||||
}
|
||||
.payment-amountTips {
|
||||
display: flex;
|
||||
width: 100%;
|
||||
font-size: 25rpx;
|
||||
letter-spacing: 0.04em;
|
||||
text-align: left;
|
||||
padding: 30rpx 0 0 40rpx;
|
||||
color: rgba(0, 0, 0, 0.6);
|
||||
.desc{
|
||||
width: 50%;
|
||||
}
|
||||
.desc1{
|
||||
width: 30%;
|
||||
}
|
||||
.desc2{
|
||||
width: 70%;
|
||||
text-align: right;
|
||||
margin-right: 10%;
|
||||
color: #387CE7;
|
||||
text-decoration: underline;
|
||||
}
|
||||
}
|
||||
.payment-amount {
|
||||
padding: 15rpx 0 0 40rpx;
|
||||
|
||||
.payment-amount-value {
|
||||
font-size: 80rpx;
|
||||
letter-spacing: 0.03em;
|
||||
padding-left: 15rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
.payment-keyboard {
|
||||
width: 100%;
|
||||
position: fixed;
|
||||
left: 0;
|
||||
bottom: 0;
|
||||
z-index: 5;
|
||||
bottom: constant(safe-area-inset-bottom);
|
||||
bottom: env(safe-area-inset-bottom);
|
||||
|
||||
.buyer-remark {
|
||||
position: absolute;
|
||||
top : -80rpx;
|
||||
width: 100%;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: center;
|
||||
}
|
||||
}
|
||||
.payment-no-keyboard {
|
||||
width: 80%;
|
||||
height: 88rpx;
|
||||
position: fixed;
|
||||
left: 10%;
|
||||
right: 10%;
|
||||
bottom: 240rpx;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
font-size: 36rpx;
|
||||
color: $uni-text-color-inverse;
|
||||
border-radius: 8rpx;
|
||||
}
|
||||
.payment-text{
|
||||
margin-bottom: 16rpx;
|
||||
width: 92%;
|
||||
background: #FAFAFA;
|
||||
display: flex;
|
||||
padding:15px;
|
||||
color: #8F97A9;
|
||||
margin-left: 1%;
|
||||
.txt{
|
||||
width: 50%;
|
||||
}
|
||||
.payment-text-guanggao{
|
||||
text-align: left;
|
||||
width: 100%;
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
}
|
||||
.payment-text-amount{
|
||||
text-align: right;
|
||||
// margin-right: 10%;
|
||||
text{
|
||||
font-weight: 600;
|
||||
color: #000;
|
||||
}
|
||||
}
|
||||
}
|
||||
.pay-div-type{
|
||||
width: 96%;
|
||||
border-radius: 5%;
|
||||
margin-left: 1%;
|
||||
margin-top: 10px;
|
||||
background: #ffffff;
|
||||
.radio-group-box{
|
||||
padding: 20rpx;
|
||||
border-bottom: 2rpx solid #F4F4F4;
|
||||
.radio-group-div{
|
||||
width: 50%;
|
||||
}
|
||||
.radio-group-name{
|
||||
width: 70%;
|
||||
text-align: left;
|
||||
display: flex;
|
||||
image{
|
||||
width: 50rpx;
|
||||
height: 50rpx;
|
||||
border-radius: 50%;
|
||||
}
|
||||
text{
|
||||
padding: 8rpx 0 10rpx 10rpx ;
|
||||
}
|
||||
.radio-group-name-price{
|
||||
color: #c3c3c3;
|
||||
}
|
||||
}
|
||||
.radio-group-radio{
|
||||
width: 30%;
|
||||
text-align: right;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.payment-amountTips-price{
|
||||
display: flex;
|
||||
width: 100%;
|
||||
font-size: 25rpx;
|
||||
letter-spacing: 0.04em;
|
||||
text-align: left;
|
||||
padding: 30rpx 0 0 40rpx;
|
||||
color: rgba(0, 0, 0, 0.6);
|
||||
padding: 20rpx 0;
|
||||
.desc3{
|
||||
font-size: 21rpx;
|
||||
width: 50%;
|
||||
text-align: left;
|
||||
margin-left: 3%;
|
||||
color: #3D3D3D;
|
||||
.desc3-text1{
|
||||
border:2rpx solid #FE5735 ;
|
||||
border-radius: 10rpx;
|
||||
color: #FE5735;
|
||||
padding: 2rpx;
|
||||
}
|
||||
.desc3-text2{
|
||||
padding-left: 8rpx;
|
||||
}
|
||||
}
|
||||
.desc4{
|
||||
font-size: 30rpx;
|
||||
width: 50%;
|
||||
text-align: right;
|
||||
margin-left: 3%;
|
||||
margin-right: 20rpx;
|
||||
color: #3D3D3D;
|
||||
.desc4-text1{
|
||||
color: #8F97A9;
|
||||
font-size: 24rpx;
|
||||
// border:2rpx solid #FE5735 ;
|
||||
// border-radius: 10rpx;
|
||||
// color: #FE5735;
|
||||
padding: 2rpx;
|
||||
}
|
||||
.desc4-text2{
|
||||
font-weight: 600;
|
||||
padding-left: 8rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
.payment-mchName-img{
|
||||
width: 120rpx;
|
||||
height: 120rpx;
|
||||
margin-right: 10rpx;
|
||||
}
|
||||
.payment-mchName1{
|
||||
font-size: 32rpx;
|
||||
font-weight: 500;
|
||||
}
|
||||
.payment-mchName2{
|
||||
font-size: 26rpx;
|
||||
margin-top: 15rpx;
|
||||
font-weight: 400;
|
||||
}
|
||||
.payment-mchName2-text1{
|
||||
color: #3598FE;
|
||||
border: 1px solid #3598FE;
|
||||
border-radius: 10rpx;
|
||||
padding: 4rpx 8rpx;
|
||||
}
|
||||
.payment-mchName2-text2{
|
||||
font-size: 28rpx;
|
||||
color: #3D3D3D;
|
||||
margin-left: 10rpx;
|
||||
}
|
||||
.scroll-view {
|
||||
width: 100%;
|
||||
}
|
||||
.scroll-content {
|
||||
display: inline-block;
|
||||
// width: 1000rpx; /* 设置一个足够大的宽度以确保文本可以滚动 */
|
||||
animation: slide 5s linear infinite;
|
||||
}
|
||||
@keyframes slide {
|
||||
0% {
|
||||
transform: translateX(0);
|
||||
}
|
||||
100% {
|
||||
transform: translateX(-100%);
|
||||
}
|
||||
}
|
||||
</style>
|
||||
369
jeepay-ui-uapp-cashier/pages/payway/index_back.vue
Normal file
369
jeepay-ui-uapp-cashier/pages/payway/index_back.vue
Normal file
@@ -0,0 +1,369 @@
|
||||
<template>
|
||||
<view class="content">
|
||||
<view class="content-top-bg" :style="{'backgroundColor': vdata.primaryColor}"></view>
|
||||
<view class="payment">
|
||||
<view class="payment-mchName" @tap="advancedFunc">付款给{{ vdata.payOrderInfo.mchName }}</view>
|
||||
<view class="payment-divider"></view>
|
||||
<view class="payment-amountTips">付款金额：</view>
|
||||
<view class="payment-amount" :style="{'color': vdata.primaryColor}">
|
||||
<text class="payment-amount-rmb">￥</text>
|
||||
<text class="payment-amount-value">{{ doubleToThousands(vdata.amount) }}</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="payment-keyboard" v-if="!vdata.payOrderInfo['fixedFlag']">
|
||||
<text class="buyer-remark" v-if="!vdata.buyerRemark" :style="{'color': vdata.primaryColor}" @tap="showRemarkModel">添加备注</text>
|
||||
<text class="buyer-remark" v-else @tap="showRemarkModel">
|
||||
{{ vdata.buyerRemark }}
|
||||
<text :style="{'color': vdata.primaryColor, 'padding-left': '6rpx'}">修改</text>
|
||||
</text>
|
||||
<jq-keyboard
|
||||
ref="jqKeyboardRef"
|
||||
:primaryColor="vdata.primaryColor"
|
||||
@change="onChange"
|
||||
@pay="pay">
|
||||
</jq-keyboard>
|
||||
</view>
|
||||
<view v-else class="payment-no-keyboard" :style="{'backgroundColor': vdata.primaryColor}" @tap="pay">付 款</view>
|
||||
|
||||
<view v-if="vdata.remarkVisible" class="remark-model">
|
||||
<view class="remark-content">
|
||||
<text class="remark-content-title" :style="{'color': vdata.primaryColor}">添加备注</text>
|
||||
<input v-model="vdata.modelRemark" :focus="vdata.remarkVisible" maxlength="20" placeholder="最多输入12个字" class="remark-content-body" />
|
||||
<view class="remark-content-btn">
|
||||
<text class="btn-cancel" @tap.stop="closeRemarkModel">取消</text>
|
||||
<text class="btn-confirm" :style="{'backgroundColor': vdata.primaryColor, 'borderColor': vdata.primaryColor}" @tap.stop="confirmRemark">确认</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { reactive, ref } from 'vue'
|
||||
import { onLoad } from '@dcloudio/uni-app'
|
||||
import { $getPayOrderInfo, $getPayPackage } from '@/http/apiManager.js'
|
||||
import { doubleToThousands } from '@/util/amount.js'
|
||||
import { toErrPageFunc } from '@/util/toErrorPageUtil.js'
|
||||
import appConfig from '@/config/appConfig.js'
|
||||
import theme from '@/config/theme.js'
|
||||
import paywayCallFunc from '@/pages/payway/payway.js'
|
||||
|
||||
const jqKeyboardRef = ref()
|
||||
|
||||
const vdata = reactive({
|
||||
primaryColor: '',
|
||||
amount: '0',
|
||||
buyerRemark: '', // 买家备注
|
||||
modelRemark: '', // 弹层显示备注
|
||||
remarkVisible: false,
|
||||
doubleToThousands: doubleToThousands(),
|
||||
payOrderInfo: {},
|
||||
clearStorageFlag: 0, //显示清空缓存的提示
|
||||
}) as any
|
||||
|
||||
onLoad(() => {
|
||||
|
||||
vdata.amount = '0'
|
||||
|
||||
vdata.primaryColor = theme.changeColors()
|
||||
|
||||
// #ifdef H5
|
||||
//解决H5的刷新问题
|
||||
if(!appConfig.tokenValue){ // 不存在 则需要跳转到首页再次放置 获取userID等信息。
|
||||
|
||||
window.location.href = '/cashier/pages/hub/default?' + appConfig.tokenKey + "=" + window.sessionStorage.getItem(appConfig.tokenKey)
|
||||
return false;
|
||||
}
|
||||
// #endif
|
||||
|
||||
// 获取订单信息
|
||||
getOrderInfo()
|
||||
|
||||
})
|
||||
|
||||
// 输入金额
|
||||
function onChange(e: any) {
|
||||
vdata.amount = e
|
||||
}
|
||||
// 获取订单信息
|
||||
function getOrderInfo() {
|
||||
console.log(5641322198)
|
||||
$getPayOrderInfo().then(({bizData}) => {
|
||||
|
||||
vdata.payOrderInfo = bizData
|
||||
|
||||
if(bizData.amount) {
|
||||
vdata.amount = (bizData.amount/100).toString()
|
||||
|
||||
}
|
||||
|
||||
// 金额传入键盘组件
|
||||
jqKeyboardRef.value.setValue(vdata.amount)
|
||||
|
||||
// 如果订单已支付，则转到提示页面
|
||||
if(bizData.state && bizData.state === 2) {
|
||||
return toErrPageFunc("订单已支付");
|
||||
}
|
||||
|
||||
// 自动调起支付
|
||||
if(bizData.autoPay) {
|
||||
pay()
|
||||
}
|
||||
}).catch(err => {
|
||||
console.log(err);
|
||||
})
|
||||
}
|
||||
|
||||
// 发起支付
|
||||
function pay() {
|
||||
vdata.payOrderInfo.amount = vdata.amount
|
||||
|
||||
if(vdata.amount <= 0) {
|
||||
return uni.showToast({
|
||||
title: '金额必须大于0',
|
||||
icon: 'none'
|
||||
})
|
||||
}
|
||||
|
||||
uni.showLoading({
|
||||
title: '请稍等...',
|
||||
mask: true
|
||||
})
|
||||
console.log(vdata,'vdatavdata')
|
||||
$getPayPackage(vdata.amount, vdata.buyerRemark).then( ({bizData}) => {
|
||||
uni.hideLoading()
|
||||
|
||||
//订单创建异常
|
||||
if(bizData.code != '0') {
|
||||
return toErrPageFunc(bizData.msg);
|
||||
}
|
||||
|
||||
// 订单响应结果
|
||||
let orderRes = bizData.data;
|
||||
|
||||
if(orderRes.orderState != 1 ) { //订单不是支付中，说明订单异常
|
||||
return toErrPageFunc(orderRes.errMsg);
|
||||
}
|
||||
|
||||
if(orderRes.payUrl){
|
||||
location.href = orderRes.payUrl;
|
||||
return false;
|
||||
}
|
||||
|
||||
// 以下为调起 jsapi的函数： 分为： H5 和 各端小程序
|
||||
let thisPaywayCallFunc = paywayCallFunc()[appConfig.currentPageType];
|
||||
thisPaywayCallFunc(orderRes, vdata.payOrderInfo);
|
||||
}).catch( () => {
|
||||
uni.hideLoading()
|
||||
})
|
||||
|
||||
}
|
||||
|
||||
// 显示备注弹窗
|
||||
function showRemarkModel() {
|
||||
vdata.modelRemark = vdata.buyerRemark
|
||||
vdata.remarkVisible = true
|
||||
}
|
||||
|
||||
// 备注弹窗确认
|
||||
function confirmRemark() {
|
||||
vdata.buyerRemark = vdata.modelRemark
|
||||
vdata.remarkVisible = false
|
||||
}
|
||||
|
||||
// 关闭备注弹窗
|
||||
function closeRemarkModel() {
|
||||
vdata.modelRemark = ''
|
||||
vdata.remarkVisible = false
|
||||
}
|
||||
|
||||
// 高级功能模块的显示
|
||||
function advancedFunc(){
|
||||
|
||||
vdata.clearStorageFlag = vdata.clearStorageFlag + 1
|
||||
|
||||
if(vdata.clearStorageFlag >= 10){
|
||||
vdata.clearStorageFlag = 0
|
||||
|
||||
// 目前仅清空缓存
|
||||
uni.showModal({
|
||||
title: '确认清除缓存？',
|
||||
success: function(r) {
|
||||
if (r.confirm) {
|
||||
uni.clearStorageSync()
|
||||
return uni.showToast({title: '已清空'})
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.remark-model {
|
||||
position: fixed;
|
||||
height: 100vh;
|
||||
width: 100vw;
|
||||
z-index: 20;
|
||||
background-color: rgba(0,0,0,0.6);
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
|
||||
.remark-content {
|
||||
height: 290rpx;
|
||||
width: 600rpx;
|
||||
background-color: #FFFFFF;
|
||||
border-radius: 20rpx;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: space-between;
|
||||
padding: 50rpx 0 20rpx 0;
|
||||
|
||||
.remark-content-title {
|
||||
font-weight: bold;
|
||||
font-size: 33rpx;
|
||||
letter-spacing: 0.05em;
|
||||
margin-left: 50rpx;
|
||||
}
|
||||
|
||||
.remark-content-body {
|
||||
margin-left: 50rpx;
|
||||
}
|
||||
|
||||
.remark-content-btn {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: space-around;
|
||||
margin-left: 20rpx;
|
||||
|
||||
text {
|
||||
width: 230rpx;
|
||||
height: 90rpx;
|
||||
border-radius: 10rpx;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.btn-cancel{
|
||||
background: #fff;
|
||||
border: 1rpx solid #c5c7cc;
|
||||
font-weight: 500;
|
||||
font-size: 30rpx;
|
||||
letter-spacing: 0.07em;
|
||||
color: #808080;
|
||||
}
|
||||
|
||||
.btn-confirm{
|
||||
border: 3rpx solid #0041c4;
|
||||
font-weight: 500;
|
||||
font-size: 30rpx;
|
||||
letter-spacing: 0.07em;
|
||||
color: #fff;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.content {
|
||||
position: relative;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: flex-start;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
|
||||
.content-top-bg {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
width: 100%;
|
||||
height: 212rpx;
|
||||
border-radius: 0 0 30rpx 30rpx;
|
||||
z-index: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.payment {
|
||||
position: relative;
|
||||
width: 650rpx;
|
||||
height: 321rpx;
|
||||
margin-top: 20rpx;
|
||||
border-radius: 30rpx;
|
||||
background: #fff;
|
||||
z-index: 1;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
||||
.payment-mchName {
|
||||
width: 100%;
|
||||
height: 105rpx;
|
||||
font-size: 30rpx;
|
||||
letter-spacing: 0.04em;
|
||||
padding-left: 30rpx;
|
||||
color: #000;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
.payment-divider {
|
||||
height: 1rpx;
|
||||
width: 100%;
|
||||
background-color: $uni-bg-color-grey;
|
||||
}
|
||||
.payment-amountTips {
|
||||
font-size: 25rpx;
|
||||
letter-spacing: 0.04em;
|
||||
text-align: left;
|
||||
padding: 30rpx 0 0 40rpx;
|
||||
color: rgba(0, 0, 0, 0.6);
|
||||
}
|
||||
.payment-amount {
|
||||
padding: 15rpx 0 0 40rpx;
|
||||
|
||||
.payment-amount-value {
|
||||
font-size: 80rpx;
|
||||
letter-spacing: 0.03em;
|
||||
padding-left: 15rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
.payment-keyboard {
|
||||
width: 100%;
|
||||
position: fixed;
|
||||
left: 0;
|
||||
bottom: 0;
|
||||
z-index: 5;
|
||||
bottom: constant(safe-area-inset-bottom);
|
||||
bottom: env(safe-area-inset-bottom);
|
||||
|
||||
.buyer-remark {
|
||||
position: absolute;
|
||||
top : -80rpx;
|
||||
width: 100%;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: center;
|
||||
}
|
||||
}
|
||||
.payment-no-keyboard {
|
||||
width: 80%;
|
||||
height: 88rpx;
|
||||
position: fixed;
|
||||
left: 10%;
|
||||
right: 10%;
|
||||
bottom: 240rpx;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
font-size: 36rpx;
|
||||
color: $uni-text-color-inverse;
|
||||
border-radius: 8rpx;
|
||||
}
|
||||
</style>
|
||||
187
jeepay-ui-uapp-cashier/pages/payway/payway.js
Normal file
187
jeepay-ui-uapp-cashier/pages/payway/payway.js
Normal file
@@ -0,0 +1,187 @@
|
||||
import appConfig from '@/config/appConfig.js'
|
||||
import { toErrPageFunc } from '@/util/toErrorPageUtil.js'
|
||||
import { $payCancelBoardCast, $payEventBoardCast } from '@/http/apiManager.js'
|
||||
|
||||
function wechatH5Func(orderRes, payOrderInfo){
|
||||
|
||||
|
||||
let onBridgeReady = function () {
|
||||
|
||||
// eslint-disable-next-line no-undef
|
||||
WeixinJSBridge.invoke( 'getBrandWCPayRequest', JSON.parse(orderRes.payInfo), function(res) {
|
||||
|
||||
payEventBoardCast(orderRes.payOrderId, res)
|
||||
|
||||
if (res.err_msg == "get_brand_wcpay_request:ok") {
|
||||
// 使用以上方式判断前端返回,微信团队郑重提示：
|
||||
//res.err_msg将在用户支付成功后返回ok，但并不保证它绝对可靠。
|
||||
// //重定向
|
||||
if(payOrderInfo.returnUrl){
|
||||
location.href = payOrderInfo.returnUrl;
|
||||
}else{
|
||||
alert('支付成功！');
|
||||
// if(payOrderInfo.fun) return payOrderInfo.fun()
|
||||
window.WeixinJSBridge.call('closeWindow')
|
||||
}
|
||||
|
||||
}
|
||||
if (res.err_msg == "get_brand_wcpay_request:cancel") {
|
||||
// payCancel(orderRes.payOrderId)
|
||||
alert("支付取消");
|
||||
// return false;
|
||||
window.WeixinJSBridge.call('closeWindow')
|
||||
}
|
||||
if (res.err_msg == "get_brand_wcpay_request:fail") {
|
||||
alert('支付失败:' + JSON.stringify(res))
|
||||
// return false;
|
||||
window.WeixinJSBridge.call('closeWindow')
|
||||
}
|
||||
if (res.err_msg == "total_fee") {
|
||||
alert('缺少参数')
|
||||
window.WeixinJSBridge.call('closeWindow')
|
||||
}
|
||||
}
|
||||
);
|
||||
}
|
||||
|
||||
|
||||
if (typeof WeixinJSBridge == "undefined"){
|
||||
if( document.addEventListener ){
|
||||
document.addEventListener('WeixinJSBridgeReady', onBridgeReady, false);
|
||||
}else if (document.attachEvent){
|
||||
document.attachEvent('WeixinJSBridgeReady', onBridgeReady);
|
||||
document.attachEvent('onWeixinJSBridgeReady', onBridgeReady);
|
||||
}
|
||||
}else{
|
||||
onBridgeReady();
|
||||
}
|
||||
}
|
||||
|
||||
// 支付宝内的浏览器调起支付：https://myjsapi.alipay.com/jsapi/native/trade-pay.html
|
||||
function alipayH5Func(orderRes){
|
||||
// 执行事件
|
||||
let doAlipay = function () {
|
||||
AlipayJSBridge.call("tradePay", { tradeNO: orderRes.alipayTradeNo }, function (data) {
|
||||
payEventBoardCast(orderRes.payOrderId, data)
|
||||
if ("9000" == data.resultCode) {
|
||||
// //重定向
|
||||
if(orderRes.returnUrl){
|
||||
location.href = orderRes.returnUrl;
|
||||
}else{
|
||||
alert('支付成功！');
|
||||
window.AlipayJSBridge.call('closeWebview')
|
||||
}
|
||||
//‘8000’：后台获取支付结果超时，暂时未拿到支付结果;
|
||||
// ‘6004’：支付过程中网络出错， 暂时未拿到支付结果;
|
||||
}else if("8000" == data.resultCode || "6004" == data.resultCode){ //其他
|
||||
alert(JSON.stringify(data));
|
||||
window.AlipayJSBridge.call('closeWebview')
|
||||
}else{ ///其他异常信息， 需要取消订单
|
||||
// payCancel(orderRes.payOrderId)
|
||||
alert('用户已取消！');
|
||||
window.AlipayJSBridge.call('closeWebview')
|
||||
}
|
||||
});
|
||||
}
|
||||
if (!window.AlipayJSBridge) {
|
||||
document.addEventListener('AlipayJSBridgeReady', doAlipay, false);
|
||||
}else{
|
||||
doAlipay();
|
||||
}
|
||||
}
|
||||
|
||||
function wechatLiteFunc(orderRes, payOrderInfo){
|
||||
const payInfo = JSON.parse(orderRes.payInfo)
|
||||
wx.requestPayment({
|
||||
"timeStamp": payInfo.timeStamp,
|
||||
"nonceStr": payInfo.nonceStr,
|
||||
"package": payInfo.package,
|
||||
"signType": payInfo.signType,
|
||||
"paySign": payInfo.paySign,
|
||||
"success": function(res){
|
||||
if(appConfig.redPacketIsOpen){
|
||||
setTimeout(() => {
|
||||
uni.navigateTo({
|
||||
url: '/pages/paySuccess/redSuccess?payOrderId=' + orderRes.payOrderId
|
||||
})
|
||||
}, 1000)
|
||||
return false;
|
||||
}
|
||||
if(payOrderInfo.fun) return payOrderInfo.fun()
|
||||
uni.navigateTo({
|
||||
url: '/pages/paySuccess/paySuccess?amount=' + payOrderInfo.amount + '&payOrderId=' + orderRes.payOrderId
|
||||
})
|
||||
},
|
||||
"fail": function(res){
|
||||
if(res.errMsg == 'requestPayment:fail cancel') {
|
||||
// payCancel(orderRes.payOrderId)
|
||||
// toErrPageFunc('取消支付')
|
||||
return uni.showToast({title: '取消支付',icon:'none'})
|
||||
}else {
|
||||
toErrPageFunc(res.errMsg)
|
||||
}
|
||||
},
|
||||
"complete": (res) => {
|
||||
payEventBoardCast(orderRes.payOrderId, res)
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
function alipayLiteFunc(orderRes, payOrderInfo){
|
||||
my.tradePay({
|
||||
tradeNO: orderRes.alipayTradeNo,
|
||||
success: (res) => {
|
||||
if(res.resultCode == 9000) {
|
||||
if(payOrderInfo.fun) return payOrderInfo.fun()
|
||||
uni.navigateTo({
|
||||
url: '/pages/paySuccess/paySuccess?amount=' + payOrderInfo.amount
|
||||
})
|
||||
}else if(res.resultCode == 6001) {
|
||||
// payCancel(orderRes.payOrderId)
|
||||
// toErrPageFunc('取消支付')
|
||||
return uni.showToast({title: '取消支付',icon:'none'})
|
||||
}else if(res.resultCode == 4000) {
|
||||
// toErrPageFunc('订单处理失败')
|
||||
return uni.showToast({title: '订单处理失败',icon:'none'})
|
||||
}else if(res.resultCode == 4) {
|
||||
toErrPageFunc('无权限调用')
|
||||
}else {
|
||||
toErrPageFunc(JSON.stringify(res))
|
||||
}
|
||||
},
|
||||
fail: (res) => {
|
||||
toErrPageFunc(JSON.stringify(res))
|
||||
},
|
||||
complete: (res) => {
|
||||
payEventBoardCast(orderRes.payOrderId, res)
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
function ysfpayH5Func(orderRes){
|
||||
window.location.href = orderRes.redirectUrl
|
||||
}
|
||||
|
||||
|
||||
function payCancel(payOrderId) {
|
||||
$payCancelBoardCast(payOrderId).then(() => {
|
||||
console.log("取消支付")
|
||||
})
|
||||
}
|
||||
|
||||
function payEventBoardCast(payOrderId, resData) {
|
||||
$payEventBoardCast(payOrderId, resData)
|
||||
}
|
||||
|
||||
|
||||
export default () => {
|
||||
|
||||
let result = {}
|
||||
result[appConfig.PAGE_TYPE_ENUM.WECHAT_H5] = wechatH5Func;
|
||||
result[appConfig.PAGE_TYPE_ENUM.ALIPAY_H5] = alipayH5Func;
|
||||
result[appConfig.PAGE_TYPE_ENUM.WECHAT_LITE] = wechatLiteFunc;
|
||||
result[appConfig.PAGE_TYPE_ENUM.ALIPAY_LITE] = alipayLiteFunc;
|
||||
result[appConfig.PAGE_TYPE_ENUM.YSFPAY_H5] = ysfpayH5Func;
|
||||
|
||||
return result;
|
||||
}
|
||||
816
jeepay-ui-uapp-cashier/pages/route/index.vue
Normal file
816
jeepay-ui-uapp-cashier/pages/route/index.vue
Normal file
@@ -0,0 +1,816 @@
|
||||
<template>
|
||||
<view class="content">
|
||||
<!-- <view class="content-top-bg" :style="{'backgroundColor': vdata.primaryColor}"></view> -->
|
||||
<view class="payment">
|
||||
<view class="payment-mchName" @tap="advancedFunc">
|
||||
<view style="display: contents;">
|
||||
<image src="/static/img/store.svg" mode="scaleToFill" class="payment-mchName-img" />
|
||||
<view style="display: grid;margin-left: 16rpx;font-size: 35rpx;">
|
||||
付款给交易路由商家
|
||||
<!-- <text class="payment-mchName1">{{ vdata.payOrderInfo.mchName }}</text>
|
||||
<view class="payment-mchName2">
|
||||
|
||||
<text class="payment-mchName2-text1">门店</text>
|
||||
<text class="payment-mchName2-text2">{{vdata.payOrderInfo.storeName}}</text>
|
||||
</view> -->
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="payment-divider"></view>
|
||||
<view class="payment-amountTips">
|
||||
<view class="desc1 ">付款金额：</view>
|
||||
<view class="desc2 " v-if="!vdata.buyerRemark" @tap="showRemarkModel"><span v-if="vdata.isForceReamrk" style='color: #FF0000;'>*</span>添加备注</view>
|
||||
<text class="desc2 buyer-remark" v-else @tap="showRemarkModel">
|
||||
{{ vdata.buyerRemark }}
|
||||
<text :style="{ 'padding-left': '6rpx'}">修改</text>
|
||||
</text>
|
||||
</view>
|
||||
<view class="payment-amount" >
|
||||
<text class="payment-amount-rmb">￥</text>
|
||||
<text class="payment-amount-value">{{ doubleToThousands(vdata.amount) }}</text>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="payment-keyboard" >
|
||||
<syb-keyboard
|
||||
ref="sybKeyboardRef"
|
||||
:primaryColor="vdata.primaryColor"
|
||||
@change="onChange"
|
||||
@pay="getSybPayType">
|
||||
</syb-keyboard>
|
||||
</view>
|
||||
|
||||
<view v-if="vdata.remarkVisible" class="remark-model">
|
||||
<view class="remark-content">
|
||||
<text class="remark-content-title" >添加备注</text>
|
||||
<input v-model="vdata.modelRemark" :focus="vdata.remarkVisible" maxlength="40" placeholder="最多输入20个字" class="remark-content-body" />
|
||||
<view class="remark-content-btn">
|
||||
<text class="btn-cancel" @tap.stop="closeRemarkModel">取消</text>
|
||||
<text class="btn-confirm" :style="{'backgroundColor': '#1678FF', 'borderColor': '#ffffff'}" @tap.stop="confirmRemark">确认</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
</view>
|
||||
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { onMounted, reactive, ref } from 'vue'
|
||||
import { onLoad } from '@dcloudio/uni-app'
|
||||
import { $getPayOrderInfo, $payApiDoRoute,$getMarketingConfig,$getChannelUserId } from '@/http/apiManager.js'
|
||||
import { doubleToThousands } from '@/util/amount.js'
|
||||
import { toErrPageFunc } from '@/util/toErrorPageUtil.js'
|
||||
import appConfig from '@/config/appConfig.js'
|
||||
import theme from '@/config/theme.js'
|
||||
import storageManage from '@/util/storageManage.js'
|
||||
// import SelectedPay from './components/SelectedPay.vue'
|
||||
import paywayCallFunc from '@/pages/payway/payway.js'
|
||||
|
||||
const sybCodePay = ref()
|
||||
const sybKeyboardRef = ref()
|
||||
const selectIfcodeRef = ref()
|
||||
|
||||
const vdata = reactive({
|
||||
scrollLeft: 0, // 滚动位置
|
||||
scrollSpeed: 2, // 滚动速度，单位px/ms
|
||||
scrollInterval: null, // 定时器ID
|
||||
navigatorUrl:"",
|
||||
payTypeList:[] as any,
|
||||
typeItems: [{
|
||||
img:"/static/img/wechat.png",
|
||||
value: 1,
|
||||
name: '微信支付',
|
||||
checked: false,
|
||||
},{
|
||||
img:"/static/img/wechat.png",
|
||||
value: 2,
|
||||
name: '微信H5',
|
||||
checked: false,
|
||||
},{
|
||||
img:"/static/payIcon/zfb.png",
|
||||
value: 3,
|
||||
name: '支付宝支付',
|
||||
checked: false,
|
||||
},{
|
||||
img:"/static/payIcon/zfb.png",
|
||||
value: 4,
|
||||
name: '支付宝H5',
|
||||
checked: false,
|
||||
},{
|
||||
img:"/static/img/payred.png",
|
||||
value: 5,
|
||||
name: '红包',
|
||||
checked: false,
|
||||
price: '',
|
||||
},
|
||||
],
|
||||
addIfCodeList:{} as any,
|
||||
isAdsOpen:false,
|
||||
redPacketIsOpen:false,
|
||||
current: 0,
|
||||
primaryColor: '',
|
||||
originAmount: '0',
|
||||
amount: '0',
|
||||
buyerRemark: '', // 买家备注
|
||||
modelRemark: '', // 弹层显示备注
|
||||
remarkVisible: false,
|
||||
doubleToThousands: doubleToThousands(),
|
||||
payOrderInfo: {},
|
||||
calcDiscount:{},
|
||||
storeId:'',
|
||||
clearStorageFlag: 0, //显示清空缓存的提示
|
||||
isForceReamrk:false,
|
||||
appid:"",
|
||||
tk:"",
|
||||
env:"route"
|
||||
}) as any
|
||||
|
||||
onLoad((options) => {
|
||||
uni.setNavigationBarColor({
|
||||
backgroundColor: '#ffffff',
|
||||
frontColor: '#000000',
|
||||
})
|
||||
options.env = 'route'
|
||||
if(appConfig.currentPageType == 'alipayLite' && options.env !='route'){
|
||||
options = uni.getLaunchOptionsSync().query
|
||||
}
|
||||
uni.setStorageSync('payH5', JSON.stringify(options)) // 改变存储
|
||||
appConfig.payH5 = options
|
||||
appConfig.itoken = options.tk
|
||||
storageManage.iToken(options.tk)
|
||||
appConfig.tk = options.tk
|
||||
appConfig.tokenValue = options.tk
|
||||
if(options.ap){
|
||||
vdata.appid = options.ap;
|
||||
}
|
||||
// uni.showToast({title: JSON.stringify(appConfig),icon:'none',duration:5000})
|
||||
if(options.env){
|
||||
vdata.env = options.env;
|
||||
if(vdata.env =='route'){
|
||||
// if((appConfig.currentPageType == 'wechatH5' || appConfig.currentPageType == 'alipayH5') && options.env == 'route' && !appConfig.channelUserId){
|
||||
// location.href = appConfig.env.JEEPAY_PAY_BASE_URL+"/pages/hub/h5?tk="+options.tk+"&env="+options.env
|
||||
// return false;
|
||||
// }
|
||||
}
|
||||
}
|
||||
console.log(appConfig.currentPageType,'appConfig.currentPageType')
|
||||
if(appConfig.currentPageType == 'wechatH5' || appConfig.currentPageType == 'wechatLite' || appConfig.currentPageType == 'alipayLite'){
|
||||
// getLogin();
|
||||
}
|
||||
if(appConfig.currentPageType == 'alipayH5' && that.env == "scan"){
|
||||
// getLogin();
|
||||
}
|
||||
// if(appConfig.currentPageType == 'alipayH5'){
|
||||
// loadScriptAndCallFunction();
|
||||
// }
|
||||
vdata.tk = options.tk;
|
||||
|
||||
})
|
||||
onMounted(() => {
|
||||
if(appConfig.currentPageType == 'alipayH5'){
|
||||
// loadScriptAndCallFunction();
|
||||
}
|
||||
})
|
||||
|
||||
function loadScriptAndCallFunction() {
|
||||
// 动态加载外部 JavaScript 文件
|
||||
const script = document.createElement('script');
|
||||
script.src = 'https://gw.alipayobjects.com/as/g/h5-lib/alipayjsapi/3.1.1/alipayjsapi.min.js'; // 假设alipayjsapi.min.js在static文件夹中
|
||||
script.onload = () => {
|
||||
|
||||
// 脚本加载完成后调用函数
|
||||
callApFunction();
|
||||
};
|
||||
document.head.appendChild(script);
|
||||
}
|
||||
function callApFunction() {
|
||||
// 调用 ap.getAuthCode() 函数
|
||||
ap.getAuthCode({
|
||||
appId:vdata.appid,
|
||||
// appId:'2021002175627786',
|
||||
scopes: ['auth_user']
|
||||
}, (res) => {
|
||||
// setPay(res.authCode)
|
||||
uni.showToast({title: "授权"+JSON.stringify(res),icon:'none'})
|
||||
// res.authCode
|
||||
});
|
||||
}
|
||||
function getPayType(){
|
||||
const typeItems = vdata.typeItems
|
||||
vdata.payTypeList = [];
|
||||
console.log(appConfig.redPacketIsOpen,'appConfigredPacketIsOpen')
|
||||
if(!appConfig.redPacketIsOpen){
|
||||
delete typeItems[4]
|
||||
}
|
||||
if(appConfig.currentPageType == 'wechatLite'){
|
||||
delete typeItems[1]
|
||||
delete typeItems[2]
|
||||
delete typeItems[3]
|
||||
}
|
||||
if(appConfig.currentPageType == 'wechatH5'){
|
||||
delete typeItems[0]
|
||||
delete typeItems[2]
|
||||
delete typeItems[3]
|
||||
}
|
||||
if(appConfig.currentPageType == 'alipayLite'){
|
||||
delete typeItems[0]
|
||||
delete typeItems[1]
|
||||
delete typeItems[3]
|
||||
}
|
||||
// return uni.showToast({
|
||||
// title: appConfig.currentPageType,
|
||||
// icon: 'none'
|
||||
// })
|
||||
if(appConfig.currentPageType == 'alipayH5'){
|
||||
delete typeItems[0]
|
||||
delete typeItems[1]
|
||||
delete typeItems[2]
|
||||
}
|
||||
console.log(typeItems,'codePay')
|
||||
typeItems.forEach(function(item,index){
|
||||
if(index == 4){
|
||||
item.price = appConfig.redbalance
|
||||
}
|
||||
if(appConfig.currentPageType == 'wechatLite' || appConfig.currentPageType == 'wechatH5'){
|
||||
if(item.value == 3 || item.value == 4){
|
||||
|
||||
}else{
|
||||
vdata.payTypeList.push(item)
|
||||
}
|
||||
}else if(appConfig.currentPageType == 'alipayLite' || appConfig.currentPageType == 'alipayH5'){
|
||||
if(item.value == 0 || item.value == 1){
|
||||
|
||||
}else{
|
||||
vdata.payTypeList.push(item)
|
||||
}
|
||||
}
|
||||
})
|
||||
|
||||
if(typeItems.length){
|
||||
typeItems[0].checked = true
|
||||
}
|
||||
}
|
||||
function updataBank (index,type=0) {
|
||||
console.log(type,'typetype')
|
||||
pay()
|
||||
}
|
||||
function scrollToLower(){
|
||||
vdata.scrollLeft = 0;
|
||||
}
|
||||
function getSybPayType(){
|
||||
if(vdata.amount <= 0) {
|
||||
return uni.showToast({
|
||||
title: '金额必须大于0',
|
||||
icon: 'none'
|
||||
})
|
||||
return false;
|
||||
}
|
||||
if(vdata.payTypeList.length <= 1){
|
||||
pay()
|
||||
return false;
|
||||
}else{
|
||||
sybCodePay.value.open();
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
// 输入金额
|
||||
function onChange(e: any) {
|
||||
if(vdata.payOrderInfo['fixedFlag']){
|
||||
return false;
|
||||
}
|
||||
vdata.amount = e
|
||||
vdata.originAmount = e
|
||||
|
||||
}
|
||||
function getadsName(){
|
||||
if(!appConfig.marketingConfig.isAdsOpen){
|
||||
return false;
|
||||
}
|
||||
uni.navigateTo({
|
||||
url: '/pages/H5/H5?url='+ appConfig.marketingConfig.adsUrl
|
||||
})
|
||||
}
|
||||
|
||||
|
||||
// 发起支付
|
||||
function pay() {
|
||||
|
||||
if(vdata.isForceReamrk && !vdata.modelRemark){
|
||||
vdata.remarkVisible = true
|
||||
return false;
|
||||
}
|
||||
|
||||
if(vdata.amount <= 0) {
|
||||
return uni.showToast({
|
||||
title: '金额必须大于0',
|
||||
icon: 'none'
|
||||
})
|
||||
return false;
|
||||
}
|
||||
|
||||
// if(!appConfig.channelUniId){
|
||||
// getLogin()
|
||||
// return false;
|
||||
// }
|
||||
|
||||
uni.showLoading({
|
||||
title: '请稍等...',
|
||||
mask: true
|
||||
})
|
||||
$payApiDoRoute(vdata.amount, vdata.buyerRemark).then( ({bizData}) => {
|
||||
|
||||
console.log(bizData,'bizDatabizData')
|
||||
uni.hideLoading()
|
||||
//订单创建异常
|
||||
if(bizData.orderState != 0) {
|
||||
let msg = bizData.msg;
|
||||
if(bizData.msg =='系统：Success'){
|
||||
msg = '订单异常'
|
||||
}
|
||||
return uni.showToast({title: msg,icon:'none'})
|
||||
}
|
||||
|
||||
if(bizData.orderState == 0){
|
||||
if(appConfig.currentPageType == 'alipayH5' && bizData.extData.payMethod == 0){
|
||||
uni.navigateTo({
|
||||
url:"/pages/payment/index?ap="+bizData.extData.appid+"&tk="+bizData.payData+"&order_no="+bizData.payOrderId+"&price="+vdata.amount+"&env=scan&opTk="+vdata.tk
|
||||
})
|
||||
}else if(appConfig.currentPageType == 'wechatH5' && bizData.extData.payMethod == 0){
|
||||
console.log('wechatH5支付')
|
||||
uni.navigateTo({
|
||||
url:"/pages/payment/index?tk="+bizData.payData+"&order_no="+bizData.payOrderId+"&price="+vdata.amount+"&env=scan&opTk="+vdata.tk
|
||||
})
|
||||
}else if(appConfig.currentPageType == 'wechatH5' && bizData.extData.payMethod == 1){
|
||||
|
||||
const query = encodeURIComponent("tk="+bizData.payData+"&order_no="+bizData.payOrderId+"&price="+vdata.amount+"&env=scan&opTk="+vdata.tk+"&env_version=release")
|
||||
const url = "weixin://dl/business/?appid="+bizData.extData.liteAppid+"&path=pages/payment/index&query="+query;
|
||||
console.log('wechatH5小程序支付')
|
||||
location.href = url
|
||||
// vdata.navigatorUrl = url
|
||||
// // 获取a标签
|
||||
// setTimeout(()=>{
|
||||
// var link = document.getElementById('myLink');
|
||||
// // 模拟点击
|
||||
// link.click();
|
||||
// },2000)
|
||||
// window.open(url)
|
||||
|
||||
}else if(appConfig.currentPageType == 'alipayH5' && bizData.extData.payMethod == 1){
|
||||
var query = encodeURIComponent("price="+vdata.amount+"&tk="+bizData.payData+"&order_no="+bizData.payOrderId+"&env=scanXcx&opTk="+vdata.tk+"&env_version=release")
|
||||
|
||||
var url = encodeURIComponent('pages/payment/index');
|
||||
|
||||
var pathUrl ="alipays://platformapi/startapp?appId="+bizData.extData.liteAppid+"&page="+url+"&query="+query;
|
||||
// window.open(pathUrl)
|
||||
// vdata.navigatorUrl = pathUrl
|
||||
// // 获取a标签
|
||||
// setTimeout(()=>{
|
||||
// var link = document.getElementById('myLink');
|
||||
// // 模拟点击
|
||||
// link.click();
|
||||
// },2000)
|
||||
// console.log(pathUrl,'url')
|
||||
window.location.href = pathUrl
|
||||
}else{
|
||||
console.log(9999)
|
||||
}
|
||||
|
||||
return false;
|
||||
}
|
||||
|
||||
}).catch( () => {
|
||||
uni.hideLoading()
|
||||
})
|
||||
|
||||
}
|
||||
|
||||
// 显示备注弹窗
|
||||
function showRemarkModel() {
|
||||
vdata.modelRemark = vdata.buyerRemark
|
||||
vdata.remarkVisible = true
|
||||
}
|
||||
|
||||
// 备注弹窗确认
|
||||
function confirmRemark() {
|
||||
vdata.buyerRemark = vdata.modelRemark
|
||||
vdata.remarkVisible = false
|
||||
}
|
||||
|
||||
// 关闭备注弹窗
|
||||
function closeRemarkModel() {
|
||||
vdata.modelRemark = ''
|
||||
vdata.remarkVisible = false
|
||||
}
|
||||
|
||||
// 高级功能模块的显示
|
||||
function advancedFunc(){
|
||||
|
||||
vdata.clearStorageFlag = vdata.clearStorageFlag + 1
|
||||
|
||||
if(vdata.clearStorageFlag >= 10){
|
||||
vdata.clearStorageFlag = 0
|
||||
|
||||
// 目前仅清空缓存
|
||||
uni.showModal({
|
||||
title: '确认清除缓存？',
|
||||
success: function(r) {
|
||||
if (r.confirm) {
|
||||
uni.clearStorageSync()
|
||||
return uni.showToast({title: '已清空'})
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
function getLogin(){
|
||||
|
||||
if(appConfig.currentPageType == 'wechatH5' || appConfig.currentPageType == 'alipayH5'){
|
||||
// that.setPay(that.aliCode);
|
||||
that.setPay(null)
|
||||
return false;
|
||||
}
|
||||
|
||||
|
||||
// 获取服务供应商
|
||||
uni.getProvider({
|
||||
service: 'oauth',
|
||||
success: function (res) {
|
||||
// 获取用户登录凭证code
|
||||
// let provider = res.provider[0];
|
||||
uni.login({
|
||||
provider: res.provider[0],
|
||||
success: function (loginRes) {
|
||||
console.log('uniapp登录凭证登录凭证登录凭证登录凭证',loginRes);
|
||||
|
||||
// #ifdef MP-ALIPAY
|
||||
getLoginCode(loginRes.code)
|
||||
// #endif
|
||||
// #ifdef MP-WEIXIN
|
||||
getLoginCode(loginRes.code)
|
||||
// #endif
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
function getLoginCode(code){
|
||||
uni.showLoading({
|
||||
title: '加载中...',
|
||||
mask: true,
|
||||
duration:2000
|
||||
})
|
||||
// 以下为不存在缓存数据
|
||||
$getChannelUserId({isUseSubmchAccount:0,code:code}).then(({ bizData }) => {
|
||||
appConfig.channelUserId = bizData;
|
||||
uni.hideLoading()
|
||||
// 保存到localStorage
|
||||
if(bizData.channelUserIdCacheKey){
|
||||
storageManage.channelUserId(bizData.channelUserIdCacheKey, bizData)
|
||||
}
|
||||
if(vdata.amount >0) {
|
||||
pay()
|
||||
return false;
|
||||
}
|
||||
console.log(appConfig,'appConfigappConfig')
|
||||
}).catch(err => {
|
||||
uni.hideLoading()
|
||||
})
|
||||
}
|
||||
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.remark-model {
|
||||
position: fixed;
|
||||
height: 100vh;
|
||||
width: 100vw;
|
||||
z-index: 20;
|
||||
background-color: rgba(0,0,0,0.6);
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
|
||||
.remark-content {
|
||||
height: 290rpx;
|
||||
width: 600rpx;
|
||||
background-color: #FFFFFF;
|
||||
border-radius: 20rpx;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: space-between;
|
||||
padding: 50rpx 0 20rpx 0;
|
||||
margin-bottom: 70%;
|
||||
.remark-content-title {
|
||||
font-weight: bold;
|
||||
font-size: 33rpx;
|
||||
letter-spacing: 0.05em;
|
||||
margin-left: 50rpx;
|
||||
}
|
||||
|
||||
.remark-content-body {
|
||||
margin-left: 50rpx;
|
||||
}
|
||||
|
||||
.remark-content-btn {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: space-around;
|
||||
margin-left: 20rpx;
|
||||
|
||||
text {
|
||||
width: 230rpx;
|
||||
height: 90rpx;
|
||||
border-radius: 10rpx;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.btn-cancel{
|
||||
background: #fff;
|
||||
border: 1rpx solid #c5c7cc;
|
||||
font-weight: 500;
|
||||
font-size: 30rpx;
|
||||
letter-spacing: 0.07em;
|
||||
color: #808080;
|
||||
}
|
||||
|
||||
.btn-confirm{
|
||||
border: 3rpx solid #0041c4;
|
||||
font-weight: 500;
|
||||
font-size: 30rpx;
|
||||
letter-spacing: 0.07em;
|
||||
color: #fff;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.content {
|
||||
position: relative;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: flex-start;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
|
||||
.content-top-bg {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
width: 100%;
|
||||
height: 212rpx;
|
||||
border-radius: 0 0 30rpx 30rpx;
|
||||
z-index: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.payment {
|
||||
// position: relative;
|
||||
// width: 650rpx;
|
||||
width: 96%;
|
||||
// height: 321rpx;
|
||||
margin-top: 20rpx;
|
||||
border-radius: 30rpx;
|
||||
background: #fff;
|
||||
z-index: 1;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
||||
.payment-mchName {
|
||||
width: 100%;
|
||||
// height: 105rpx;
|
||||
padding: 30rpx 0;
|
||||
font-size: 30rpx;
|
||||
letter-spacing: 0.04em;
|
||||
padding-left: 30rpx;
|
||||
color: #000;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
.payment-divider {
|
||||
height: 1rpx;
|
||||
width: 100%;
|
||||
background-color: $uni-bg-color-grey;
|
||||
}
|
||||
.payment-amountTips {
|
||||
display: flex;
|
||||
width: 100%;
|
||||
font-size: 25rpx;
|
||||
letter-spacing: 0.04em;
|
||||
text-align: left;
|
||||
padding: 30rpx 0 0 40rpx;
|
||||
color: rgba(0, 0, 0, 0.6);
|
||||
.desc{
|
||||
width: 50%;
|
||||
}
|
||||
.desc1{
|
||||
width: 30%;
|
||||
}
|
||||
.desc2{
|
||||
width: 70%;
|
||||
text-align: right;
|
||||
margin-right: 10%;
|
||||
color: #387CE7;
|
||||
text-decoration: underline;
|
||||
}
|
||||
}
|
||||
.payment-amount {
|
||||
padding: 15rpx 0 0 40rpx;
|
||||
|
||||
.payment-amount-value {
|
||||
font-size: 80rpx;
|
||||
letter-spacing: 0.03em;
|
||||
padding-left: 15rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
.payment-keyboard {
|
||||
width: 100%;
|
||||
position: fixed;
|
||||
left: 0;
|
||||
bottom: 0;
|
||||
z-index: 5;
|
||||
bottom: constant(safe-area-inset-bottom);
|
||||
bottom: env(safe-area-inset-bottom);
|
||||
|
||||
.buyer-remark {
|
||||
position: absolute;
|
||||
top : -80rpx;
|
||||
width: 100%;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: center;
|
||||
}
|
||||
}
|
||||
.payment-no-keyboard {
|
||||
width: 80%;
|
||||
height: 88rpx;
|
||||
position: fixed;
|
||||
left: 10%;
|
||||
right: 10%;
|
||||
bottom: 240rpx;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
font-size: 36rpx;
|
||||
color: $uni-text-color-inverse;
|
||||
border-radius: 8rpx;
|
||||
}
|
||||
.payment-text{
|
||||
margin-bottom: 16rpx;
|
||||
width: 92%;
|
||||
background: #FAFAFA;
|
||||
display: flex;
|
||||
padding:15px;
|
||||
color: #8F97A9;
|
||||
margin-left: 1%;
|
||||
.txt{
|
||||
width: 50%;
|
||||
}
|
||||
.payment-text-guanggao{
|
||||
text-align: left;
|
||||
width: 100%;
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
}
|
||||
.payment-text-amount{
|
||||
text-align: right;
|
||||
// margin-right: 10%;
|
||||
text{
|
||||
font-weight: 600;
|
||||
color: #000;
|
||||
}
|
||||
}
|
||||
}
|
||||
.pay-div-type{
|
||||
width: 96%;
|
||||
border-radius: 5%;
|
||||
margin-left: 1%;
|
||||
margin-top: 10px;
|
||||
background: #ffffff;
|
||||
.radio-group-box{
|
||||
padding: 20rpx;
|
||||
border-bottom: 2rpx solid #F4F4F4;
|
||||
.radio-group-div{
|
||||
width: 50%;
|
||||
}
|
||||
.radio-group-name{
|
||||
width: 70%;
|
||||
text-align: left;
|
||||
display: flex;
|
||||
image{
|
||||
width: 50rpx;
|
||||
height: 50rpx;
|
||||
border-radius: 50%;
|
||||
}
|
||||
text{
|
||||
padding: 8rpx 0 10rpx 10rpx ;
|
||||
}
|
||||
.radio-group-name-price{
|
||||
color: #c3c3c3;
|
||||
}
|
||||
}
|
||||
.radio-group-radio{
|
||||
width: 30%;
|
||||
text-align: right;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.payment-amountTips-price{
|
||||
display: flex;
|
||||
width: 100%;
|
||||
font-size: 25rpx;
|
||||
letter-spacing: 0.04em;
|
||||
text-align: left;
|
||||
padding: 30rpx 0 0 40rpx;
|
||||
color: rgba(0, 0, 0, 0.6);
|
||||
padding: 20rpx 0;
|
||||
.desc3{
|
||||
font-size: 21rpx;
|
||||
width: 50%;
|
||||
text-align: left;
|
||||
margin-left: 3%;
|
||||
color: #3D3D3D;
|
||||
.desc3-text1{
|
||||
border:2rpx solid #FE5735 ;
|
||||
border-radius: 10rpx;
|
||||
color: #FE5735;
|
||||
padding: 2rpx;
|
||||
}
|
||||
.desc3-text2{
|
||||
padding-left: 8rpx;
|
||||
}
|
||||
}
|
||||
.desc4{
|
||||
font-size: 30rpx;
|
||||
width: 50%;
|
||||
text-align: right;
|
||||
margin-left: 3%;
|
||||
margin-right: 20rpx;
|
||||
color: #3D3D3D;
|
||||
.desc4-text1{
|
||||
color: #8F97A9;
|
||||
font-size: 24rpx;
|
||||
// border:2rpx solid #FE5735 ;
|
||||
// border-radius: 10rpx;
|
||||
// color: #FE5735;
|
||||
padding: 2rpx;
|
||||
}
|
||||
.desc4-text2{
|
||||
font-weight: 600;
|
||||
padding-left: 8rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
.payment-mchName-img{
|
||||
width: 120rpx;
|
||||
height: 120rpx;
|
||||
margin-right: 10rpx;
|
||||
}
|
||||
.payment-mchName1{
|
||||
font-size: 32rpx;
|
||||
font-weight: 500;
|
||||
}
|
||||
.payment-mchName2{
|
||||
font-size: 26rpx;
|
||||
margin-top: 15rpx;
|
||||
font-weight: 400;
|
||||
}
|
||||
.payment-mchName2-text1{
|
||||
color: #3598FE;
|
||||
border: 1px solid #3598FE;
|
||||
border-radius: 10rpx;
|
||||
padding: 4rpx 8rpx;
|
||||
}
|
||||
.payment-mchName2-text2{
|
||||
font-size: 28rpx;
|
||||
color: #3D3D3D;
|
||||
margin-left: 10rpx;
|
||||
}
|
||||
.scroll-view {
|
||||
width: 100%;
|
||||
}
|
||||
.scroll-content {
|
||||
display: inline-block;
|
||||
// width: 1000rpx; /* 设置一个足够大的宽度以确保文本可以滚动 */
|
||||
animation: slide 5s linear infinite;
|
||||
}
|
||||
@keyframes slide {
|
||||
0% {
|
||||
transform: translateX(0);
|
||||
}
|
||||
100% {
|
||||
transform: translateX(-100%);
|
||||
}
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user