czg_team
/
cashier_desktop
7
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

优化快捷支付

This commit is contained in:
gyq 2024-05-17 18:33:52 +08:00
parent 6f378cc3c0
commit dbc7444e78
7 changed files with 152 additions and 109 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
.env.development
View File

@ -2,6 +2,7 @@
ENV = development
# 本地环境接口地址
VITE_API_URL = 'http://192.168.2.27:10587/cashier-client'
VITE_API_URL = 'https://cashier-client.sxczgkj.cn/cashier-client'
# VITE_API_URL = 'http://192.168.2.27:10587/cashier-client'
# VITE_API_URL = 'https://cashiernew.sxczgkj.cn/cashier-client'
# VITE_API_URL = 'https://cashierclient.sxczgkj.cn/cashier-client/'

3
.env.production
View File

@ -2,5 +2,6 @@
ENV = production
# 线上环境接口地址
VITE_API_URL = 'https://cashierclient.sxczgkj.cn/cashier-client/'
# VITE_API_URL = 'https://cashierclient.sxczgkj.cn/cashier-client/'
# VITE_API_URL = 'https://cashiernew.sxczgkj.cn/cashier-client'
VITE_API_URL = 'https://cashier-client.sxczgkj.cn/cashier-client'

2
package.json
View File

@ -1,7 +1,7 @@
{
"name": "vite-electron",
"private": true,
"version": "1.1.2",
"version": "1.1.9",
"main": "dist-electron/main.js",
"scripts": {
"dev": "chcp 65001 && vite",

37
src/api/pay.js
View File

@ -1,4 +1,4 @@
import request from "@/utils/request.js"
import request from "@/utils/request.js";
/**
* 查询分类信息
@ -9,7 +9,7 @@ export function queryPayType(params) {
return request({
method: "get",
url: "pay/queryPayType",
params
params,
});
}
@ -22,7 +22,7 @@ export function payOrder(api, params) {
return request({
method: "get",
url: api,
params
params,
});
}
@ -34,8 +34,8 @@ export function payOrder(api, params) {
export function scanpay(params) {
return request({
method: "get",
url: 'pay/scanpay',
params
url: "pay/scanpay",
params,
});
}
@ -47,8 +47,8 @@ export function scanpay(params) {
export function accountPay(params) {
return request({
method: "get",
url: 'pay/accountPay',
params
url: "pay/accountPay",
params,
});
}
@ -60,8 +60,8 @@ export function accountPay(params) {
export function cashPay(params) {
return request({
method: "get",
url: 'pay/cashPay',
params
url: "pay/cashPay",
params,
});
}
@ -74,7 +74,7 @@ export function queryOrder(params) {
return request({
method: "get",
url: "pay/queryOrder",
params
params,
});
}
@ -87,7 +87,7 @@ export function print(params) {
return request({
method: "get",
url: "cloudPrinter/print",
params
params,
});
}
@ -100,6 +100,19 @@ export function quickPay(params) {
return request({
method: "get",
url: "pay/quickPay",
params
params,
});
}
/**
* 查询快捷收银订单
* @param {*} params
* @returns
*/
export function queryQuickPayStatus(params) {
return request({
method: "get",
url: "pay/queryQuickPayStatus",
params,
});
}

103
src/components/payCard/scanModal.vue
View File

@ -2,12 +2,7 @@
<template>
<div class="dialog">
<el-dialog
title="扫码支付"
width="600"
v-model="dialogVisible"
@open="reset"
>
<el-dialog title="扫码支付" width="600" v-model="dialogVisible" @open="reset" @close="clearAutoCheckOrder">
<div class="content">
<div class="left">
<el-image :src="icon" style="width: 60px; height: 60px"></el-image>
@ -18,15 +13,9 @@
<span class="n">{{ props.amount }}</span>
</div>
<div class="input">
<el-input
ref="inputRef"
v-model="scanCode"
style="height: calc(var(--el-component-size-large) + 30px)"
placeholder="请扫描付款码"
clearable
@change="inputChange"
></el-input>
<div class="tips">注意：扫码支付请保证输入框获得焦点</div>
<el-input ref="inputRef" v-model="scanCode" style="height: calc(var(--el-component-size-large) + 30px)"
placeholder="请扫描付款码" clearable @change="inputChange"></el-input>
<div class="tips">注意：扫码支付请保证输入框获得焦点，输入内容结束后会自动支付，请勿重复操作</div>
</div>
<!-- <div class="number_warp">
<div class="item" v-for="item in 9" :key="item" @click="inputHandle(item)">{{ item }}</div>
@ -39,36 +28,21 @@
</div>
</div> -->
<div class="btn">
<el-button
type="primary"
style="width: 100%"
v-loading="loading"
@click="submitHandle"
>立即支付</el-button
>
<el-button type="primary" style="width: 100%" v-loading="loading">立即支付</el-button>
</div>
</div>
<div class="pay_wait" v-else>
<div
class="loading"
v-loading="loading"
element-loading-text="用户支付中..."
></div>
<div class="loading" v-loading="loading" element-loading-text="用户支付中..."></div>
<div class="btn">
<el-button
type="primary"
style="width: 100%"
v-loading="checkPayStatusLoading"
@click="checkPayStauts"
>
<el-button type="primary" style="width: 100%" v-loading="checkPayStatusLoading" @click="checkPayStauts">
<span v-if="!checkPayStatusLoading">查询用户支付状态</span>
<span v-else>查询中...</span>
</el-button>
</div>
<div class="btn">
<el-button style="width: 100%" @click="resetScanCode"
>重新扫码</el-button
>
<el-button style="width: 100%" @click="resetScanCode">
重新扫码
</el-button>
</div>
</div>
</div>
@ -80,7 +54,7 @@
import _ from "lodash";
import { ref } from "vue";
import icon from "@/assets/icon_scan.png";
import { scanpay, queryOrder, quickPay } from "@/api/pay";
import { scanpay, queryOrder, quickPay, queryQuickPayStatus } from "@/api/pay";
import { useUser } from "@/store/user.js";
const store = useUser();
import {
@ -119,6 +93,8 @@ const loading = ref(false);
const userPayWait = ref(false);
const checkPayStatusLoading = ref(false);
const fastOrder = ref('')
// 提交扫码支付
async function submitHandle() {
try {
@ -152,8 +128,11 @@ async function submitHandle() {
dialogVisible.value = false;
emits("success");
} catch (error) {
console.log(error);
if (error.code === "100015") {
userPayWait.value = true;
fastOrder.value = error.data
autoCheckOrder()
} else {
loading.value = false;
console.log(error);
@ -161,22 +140,69 @@ async function submitHandle() {
}
}
const timer = ref(null)
// 自动查询订单状态
function autoCheckOrder() {
timer.value = setInterval(() => {
checkPayStauts(false)
}, 2000)
}
// 清除自动查询扫码支付订单
function clearAutoCheckOrder() {
clearInterval(timer.value)
timer.value = null
}
// 查询用户支付状态
async function checkPayStauts() {
async function checkPayStauts(tips = true) {
try {
if (props.fast) {
const res = await queryQuickPayStatus({ orderId: fastOrder.value.orderNo });
if (res.status == 0) {
userPayWait.value = false
loading.value = false;
scanCode.value = "";
ElMessage.success("支付成功");
dialogVisible.value = false;
clearAutoCheckOrder()
emits("success");
return;
}
if (res.status == 1) {
if (tips) {
ElMessage.warning("用户支付中...");
}
return;
} else {
clearAutoCheckOrder()
ElMessage.error(res.payRemark || "支付失败！");
return;
}
} else {
const res = await queryOrder({ orderId: props.orderId });
if (res.status == "closed") {
userPayWait.value = false
loading.value = false;
scanCode.value = "";
ElMessage.success("支付成功");
dialogVisible.value = false;
clearAutoCheckOrder()
emits("success");
return;
}
if (res.status == "paying") {
if (tips) {
ElMessage.warning("用户支付中...");
}
return;
} else {
clearAutoCheckOrder()
ElMessage.error(res.payRemark || "支付失败！");
return;
}
}
} catch (error) {
console.log(error);
}
@ -184,6 +210,7 @@ async function checkPayStauts() {
// 重新扫码
function resetScanCode() {
clearAutoCheckOrder()
userPayWait.value = false;
loading.value = false;
scanCode.value = "";

4
src/views/home/components/settleAccount.vue
View File

@ -141,7 +141,7 @@ async function printHandle() {
};
ipcRenderer.send("printerInfoSync", JSON.stringify(data));
} else {
ElMessage.error("您还没有添加本地打印设备，将使用网络打印");
// ElMessage.error("您还没有添加本地打印设备，将使用网络打印");
try {
printLoading.value = true;
await print({
@ -150,7 +150,7 @@ async function printHandle() {
orderId: props.orderInfo.id,
});
printLoading.value = false;
ElMessage.success("打印成功");
// ElMessage.success("打印成功");
} catch (error) {
printLoading.value = false;
console.log(error);

5
vite.config.js
View File

@ -9,9 +9,10 @@ export default defineConfig({
server: {
proxy: {
'/api': {
target: 'https://cashierclient.sxczgkj.cn/cashier-client', // 线上
// target: 'https://cashierclient.sxczgkj.cn/cashier-client', // 线上
// target: 'http://192.168.2.116:10587/cashier-client', // 国成
// target: 'http://192.168.2.128:10587/cashier-client',
// target: 'http://192.168.2.171:10587/cashier-client', // 鹏辉
target: 'https://cashier-client.sxczgkj.cn/cashier-client', // 测试
changeOrigin: true,
rewrite: (path) => path.replace(/^\/api/, '')
}