feat:扫收款机器二维码支付
This commit is contained in:
weiwei committed
1 parent
5ad92284cc
commit
15a8c695e0
3 files changed
+113
-74
No files matched your search
@@ -24,13 +24,13 @@
|
||||
</view>
|
||||
|
||||
<view class="flex-col-center m-b-60rpx">
|
||||
<text class="text-90 c-#333333!">¥{{ payData.customPrice }}</text>
|
||||
<text class="text-90 c-#333333!">¥{{ scanPayData.payPrice }}</text>
|
||||
</view>
|
||||
|
||||
<view class="w-full p-10rpx flex-col justify-center">
|
||||
<view class="flex-row justify-between m-15rpx">
|
||||
<text class="sub-text-30 c-#333333!">商家</text>
|
||||
<text class="sub-text-30">{{ payData.name }}</text>
|
||||
<text class="sub-text-30">{{ scanPayData.mchName }}</text>
|
||||
</view>
|
||||
<hr />
|
||||
<view class="flex-row justify-between m-15rpx">
|
||||
@@ -50,11 +50,11 @@ import { ref } from "vue"
|
||||
import { onShow } from "@dcloudio/uni-app"
|
||||
import { usePayStore } from "@/sheep/stores/pay"
|
||||
|
||||
const payData = ref<{ id?: string; name?: string; customPrice?: number }>({})
|
||||
const scanPayData = ref<any>({})
|
||||
|
||||
onShow(() => {
|
||||
if (!usePayStore().payData.id) return uni.showToast({ title: "支付信息不存在", icon: "none" })
|
||||
payData.value = usePayStore().payData
|
||||
if (!usePayStore().scanPayData.mchId) return uni.showToast({ title: "支付信息不存在", icon: "none" })
|
||||
scanPayData.value = usePayStore().scanPayData
|
||||
})
|
||||
|
||||
const goBack = () => {
|
||||
|
||||
+91
-65
@@ -1,7 +1,7 @@
|
||||
<template>
|
||||
<crud-layout bg="/static/page/blue-bg.png">
|
||||
<view class="h-screen flex flex-col">
|
||||
<view class="mx-auto text-34 py-2 h-80rpx">{{ scanCodeData.name }}</view>
|
||||
<view class="mx-auto text-34 py-2 h-80rpx">{{ scanPayState.mchName }}</view>
|
||||
|
||||
<tm-sheet class="flex flex-row">
|
||||
<span class="text-2xl text-[#333] mr-1 line-height-normal">¥</span>
|
||||
@@ -28,9 +28,9 @@
|
||||
</view>
|
||||
</tm-sheet>
|
||||
|
||||
<tm-button class="mt-1" :block="true" @click="disabled ? '' : handlePay()" :disabled="disabled">支 付</tm-button>
|
||||
<tm-button class="mt-1" :block="true" @click="handlePay()" :disabled="loading">支 付</tm-button>
|
||||
|
||||
<numberKeyboard v-model="amount" />
|
||||
<number-keyboard v-if="!scanPayState.action" v-model="amount" />
|
||||
</view>
|
||||
</crud-layout>
|
||||
</template>
|
||||
@@ -39,79 +39,95 @@
|
||||
import { ref, computed, reactive } from "vue"
|
||||
import { onLoad, onShow } from "@dcloudio/uni-app"
|
||||
import payApi from "@@/api/pay"
|
||||
import { merchantApi, walletApi } from "@/sheep/api"
|
||||
import { merchantApi, orderApi, walletApi } from "@/sheep/api"
|
||||
import { hooks } from "@@/index"
|
||||
import { router } from "@/sheep"
|
||||
import { filePath } from "@/sheep/utils/file"
|
||||
import { storePrice } from "@/sheep/utils/formatMoney"
|
||||
import { displayPrice, storePrice } from "@/sheep/utils/formatMoney"
|
||||
import { usePayStore } from "@/sheep/stores/pay"
|
||||
import { isEmpty } from "radash"
|
||||
import numberKeyboard from "@/sheep/components/numberKeyboard.vue"
|
||||
import NumberKeyboard from "@/sheep/components/numberKeyboard.vue"
|
||||
|
||||
const scanCodeData = reactive({
|
||||
id: "",
|
||||
name: "",
|
||||
const loading = ref(false)
|
||||
const scanPayState = reactive({
|
||||
mchId: "", // 商户id
|
||||
mchName: "", // 商户名
|
||||
orderId: "", // 订单id
|
||||
action: "",
|
||||
})
|
||||
const walletList = ref<any>([])
|
||||
const curWalletId = ref("")
|
||||
const disabled = ref(false)
|
||||
const amount = ref("")
|
||||
const walletList = ref<any>([]) // 钱包列表
|
||||
const curWalletId = ref("") // 当前选中的钱包id
|
||||
const orderInfo = ref<any>({}) // 订单信息
|
||||
const amount = ref("") // 键盘输入的金额
|
||||
|
||||
onLoad((options: any) => {
|
||||
if (!isEmpty(options.id)) {
|
||||
scanCodeData.id = options.id
|
||||
} else {
|
||||
uni.showToast({ title: "参数不存在", icon: "none" })
|
||||
onLoad(async (options: any) => {
|
||||
uni.showLoading({ title: "加载中..." })
|
||||
const { mchId, orderId, action } = options
|
||||
if (action === "harQrCodeScanPay") {
|
||||
if (!options.mchId || !options.orderId) return uni.showToast({ title: "扫码参数错误", icon: "none" })
|
||||
scanPayState.mchId = mchId
|
||||
scanPayState.orderId = orderId
|
||||
scanPayState.action = action
|
||||
await getMchDetail(mchId)
|
||||
await getOrderInfo()
|
||||
amount.value = displayPrice(orderInfo.value.totalPrice || 0 + orderInfo.value.extraPrice || 0, "")
|
||||
return
|
||||
}
|
||||
|
||||
const { id } = options
|
||||
if (!isEmpty(id)) {
|
||||
scanPayState.mchId = id
|
||||
await getMchDetail(id)
|
||||
return
|
||||
}
|
||||
|
||||
return uni.showToast({ title: "扫码参数错误", icon: "none" })
|
||||
})
|
||||
|
||||
onShow(async () => {
|
||||
uni.showLoading({ title: "加载中...", mask: true })
|
||||
if (scanCodeData.id) {
|
||||
const { data } = await merchantApi.detail({ id: scanCodeData.id })
|
||||
if (data) {
|
||||
scanCodeData.name = data.name
|
||||
disabled.value = false
|
||||
} else {
|
||||
disabled.value = true
|
||||
return uni.showToast({ title: "商户id错误", icon: "none" })
|
||||
}
|
||||
} else {
|
||||
uni.showToast({ title: "参数不存在", icon: "none" })
|
||||
disabled.value = true
|
||||
try {
|
||||
await getWalletList()
|
||||
} finally {
|
||||
uni.hideLoading()
|
||||
}
|
||||
|
||||
const res = await walletApi.all()
|
||||
if (res.code == 0) {
|
||||
walletList.value = res.data.records
|
||||
if (walletList.value.length > 0) {
|
||||
curWalletId.value = walletList.value.find((v: any) => v.walletTypeUniqueCode == "1").id
|
||||
}
|
||||
}
|
||||
uni.hideLoading()
|
||||
})
|
||||
|
||||
// 获取商户名
|
||||
const getMchDetail = async (mchId: string) => {
|
||||
if (!mchId) return uni.showToast({ title: "商户id错误", icon: "none" })
|
||||
const { data } = await merchantApi.detail({ id: mchId })
|
||||
scanPayState.mchName = data.name
|
||||
}
|
||||
|
||||
// 获取钱包列表
|
||||
const getWalletList = async () => {
|
||||
const { code, data } = await walletApi.all()
|
||||
if (code !== 0) return uni.showToast({ title: "获取钱包列表失败", icon: "none" })
|
||||
walletList.value = data.records
|
||||
if (walletList.value.length > 0) {
|
||||
curWalletId.value = walletList.value.find((v: any) => v.walletTypeUniqueCode == "1").id
|
||||
}
|
||||
}
|
||||
|
||||
// 获取订单信息
|
||||
const getOrderInfo = async () => {
|
||||
const { code, data }: any = await orderApi.detail({ id: scanPayState.orderId })
|
||||
if (code !== 0) return uni.showToast({ title: "获取订单信息失败", icon: "none" })
|
||||
orderInfo.value = data
|
||||
}
|
||||
|
||||
// 格式化金额显示
|
||||
const displayAmount = computed(() => {
|
||||
if (!amount.value) return "0"
|
||||
return (
|
||||
amount.value
|
||||
// .toString()
|
||||
// .toFixed(2)
|
||||
.replace(/\B(?=(\d{3})+(?!\d))/g, ",")
|
||||
)
|
||||
return amount.value.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",")
|
||||
})
|
||||
|
||||
// 点击支付
|
||||
const handlePay = () => {
|
||||
if (!scanCodeData.id || !scanCodeData.name) return uni.showToast({ title: "扫码参数不存在", icon: "none" })
|
||||
if (!amount.value) {
|
||||
uni.showToast({ title: "请输入金额", icon: "none" })
|
||||
return
|
||||
}
|
||||
if (Number(amount.value) === 0) {
|
||||
uni.showToast({ title: "金额不能为0", icon: "none" })
|
||||
return
|
||||
}
|
||||
if (!scanPayState.mchId) return uni.showToast({ title: "扫码参数不存在", icon: "none" })
|
||||
if (!amount.value) return uni.showToast({ title: "请输入金额", icon: "none" })
|
||||
if (Number(amount.value) === 0) return uni.showToast({ title: "金额不能为0", icon: "none" })
|
||||
|
||||
uni.showModal({
|
||||
title: "确定支付吗？",
|
||||
success: async (res) => {
|
||||
@@ -126,18 +142,28 @@ const handlePay = () => {
|
||||
const pay = async () => {
|
||||
try {
|
||||
uni.showLoading({ title: "支付中...", mask: true })
|
||||
const res = await payApi.createQrCodeOrder({
|
||||
merchantId: scanCodeData.id,
|
||||
customPrice: storePrice(Number(amount.value)),
|
||||
walletId: curWalletId.value,
|
||||
})
|
||||
if (res.code != 0) {
|
||||
uni.showToast({ title: res.msg || "支付失败", icon: "error" })
|
||||
if (scanPayState.action === "harQrCodeScanPay") {
|
||||
const { code, msg }: any = await orderApi.doneHardQrCodeScanOrder({
|
||||
orderId: scanPayState.orderId,
|
||||
walletId: curWalletId.value,
|
||||
})
|
||||
if (code != 0) return uni.showToast({ title: msg || "支付失败", icon: "error" })
|
||||
} else {
|
||||
uni.hideLoading()
|
||||
usePayStore().setPayData({ id: scanCodeData.id, name: scanCodeData.name, customPrice: Number(amount.value).toFixed(2) })
|
||||
router.jump("/pages/pay/payComplete", {}, 2)
|
||||
const { code, msg } = await payApi.createQrCodeOrder({
|
||||
merchantId: scanPayState.mchId,
|
||||
customPrice: storePrice(Number(amount.value)),
|
||||
walletId: curWalletId.value,
|
||||
})
|
||||
if (code != 0) return uni.showToast({ title: msg || "支付失败", icon: "error" })
|
||||
}
|
||||
|
||||
uni.hideLoading()
|
||||
usePayStore().setScanPayData({
|
||||
mchId: scanPayState.mchId,
|
||||
mchName: scanPayState.mchName,
|
||||
payPrice: Number(amount.value).toFixed(2),
|
||||
})
|
||||
router.jump("/pages/pay/payComplete", {}, 2)
|
||||
} catch (error: any) {
|
||||
uni.showToast({ title: "请求错误", icon: "error" })
|
||||
uni.hideLoading()
|
||||
|
||||
+17
-4
@@ -1,16 +1,29 @@
|
||||
import { defineStore } from "pinia"
|
||||
|
||||
type State = {
|
||||
scanPayData: {
|
||||
mchId: string
|
||||
mchName: string
|
||||
payPrice: number | string
|
||||
}
|
||||
sourceWalletData: any
|
||||
}
|
||||
|
||||
export const usePayStore = defineStore("pay", {
|
||||
state: (): { payData: { id?: string; name?: string; customPrice?: number }; sourceWalletData: any } => {
|
||||
state: (): State => {
|
||||
return {
|
||||
payData: {},
|
||||
scanPayData: {
|
||||
mchId: "",
|
||||
mchName: "",
|
||||
payPrice: 0,
|
||||
},
|
||||
sourceWalletData: {},
|
||||
}
|
||||
},
|
||||
actions: {
|
||||
// 支付
|
||||
setPayData(data: any) {
|
||||
this.payData = data
|
||||
setScanPayData(data: any) {
|
||||
this.scanPayData = data
|
||||
},
|
||||
// 转账
|
||||
setSourceWalletData(data: any) {
|
||||
|
||||
Reference in new issue
Block a user