后台添加支付测试功能

This commit is contained in:
技术老胡 2024-11-02 17:59:36 +08:00
parent 82e0f8e04c
commit bab5fa4f53
5 changed files with 166 additions and 2 deletions

View File

@ -6,6 +6,7 @@ namespace app\controller;
use app\BaseController;
use app\model\Order;
use app\model\User;
use think\facade\View;
class OrderController extends BaseController
@ -27,4 +28,18 @@ class OrderController extends BaseController
return '订单不存在';
}
}
public function testPay()
{
$pid = 1000;
if (session('?pid')) {
$pid = session('pid');
}
View::assign('pid', $pid);
$key = User::where('pid', $pid)->where('state', 1)->value('secret_key');
if (!$key) {
return '用户禁用或不存在';
}
View::assign('key', $key);
return View::fetch();
}
}

1
public/static/js/crypto-js.min.js vendored Normal file

File diff suppressed because one or more lines are too long

131
view/order/test_pay.html Normal file
View File

@ -0,0 +1,131 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>订单明细</title>
<link rel="stylesheet" href="/component/pear/css/pear.css" />
<style>
.paybtn {
margin-top: 32px;
display: flex;
justify-content: space-evenly;
align-items: center;
}
.paybtn>button {
display: flex;
align-items: center;
width: 115px;
justify-content: center;
}
.paybtn>button>img {
margin-right: 3px;
}
</style>
</head>
<body>
<div class="layui-row container">
<div class="main-container">
<form id="paytest" class="layui-form layui-form-pane" action="" lay-filter="paytest">
<div class="layui-form-item">
<label class="layui-form-label">商品名称</label>
<div class="layui-input-block">
<input type="text" name="name" autocomplete="off" class="layui-input" disabled>
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">订单编号</label>
<div class="layui-input-block">
<input type="text" name="out_trade_no" autocomplete="off" class="layui-input" disabled>
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">收款金额</label>
<div class="layui-input-block">
<input type="text" name="money" lay-verify="required|number" autocomplete="off"
class="layui-input">
</div>
</div>
</form>
<div class="layui-form-item">
<div class="paybtn">
<button class="pear-btn wxpay">
<img src="/static/img/wxpay.ico" width="16">
<span>微信支付</span>
</button>
<button class="pear-btn alipay">
<img src="/static/img/alipay.ico" width="16">
<span>支付宝</span>
</button>
</div>
</div>
</div>
</div>
<script src="/component/layui/layui.js"></script>
<script src="/component/pear/pear.js"></script>
<script src="/static/js/crypto-js.min.js"></script>
<script>
layui.use(['layer', 'form'], function () {
let form = layui.form;
let layer = layui.layer;
const formdata = {
name: `支付测试<?php echo date('Ymd-His', time()) ?>`,
out_trade_no: `pay<?php echo date('YmdHis', time()).mt_rand(1000,9999) ?>`,
money: 1,
}
form.val('paytest', formdata);
const key = `<?php echo $key ?>`;
const testdata = {
pid: `<?php echo $pid ?>`,
notify_url: window.location.origin,
return_url: window.location.origin,
sign_type: 'MD5'
};
document.querySelector('.wxpay').addEventListener('click', function () {
crateOrder('wxpay');
});
document.querySelector('.alipay').addEventListener('click', function () {
crateOrder('alipay');
});
// 创建订单
function crateOrder(paytype) {
form.submit('paytest', function (data) {
const field = data.field;
let newdata = { ...field, ...testdata };
newdata.type = paytype;
newdata.sign = getSign(newdata, key);
const query = new URLSearchParams(newdata);
window.open(`${window.location.origin}/submit?${query.toString()}`, '_blank');
return false;
});
}
// 签名
function getSign(param = {}, key = '') {
// 对参数进行排序
param = Object.keys(param).sort().reduce((obj, key) => {
obj[key] = param[key];
return obj;
}, {});
let signstr = '';
for (let k in param) {
if (k != "sign" && k != "sign_type" && param[k] != '') {
signstr += k + '=' + param[k] + '&';
}
}
// 去除最后一个字符 '&'
signstr = signstr.substring(0, signstr.length - 1);
// 添加密钥
signstr += key;
// 计算 MD5 值
let sign = CryptoJS.MD5(signstr).toString();
return sign;
}
})
</script>
</body>
</html>

View File

@ -59,7 +59,7 @@
</select>
</div>
</div>
<div class="layui-form-item">
<div class="layui-form-item layui-form-text">
<label class="layui-form-label">查询参数</label>
<div class="layui-input-block">
<textarea name="params" placeholder="账号订单查询自定义参数JSON格式没有请填 { } " class="layui-textarea"></textarea>

View File

@ -74,6 +74,10 @@
<i class="layui-icon layui-icon-delete"></i>
删除
</button>
<button class="pear-btn pear-btn-warming pear-btn-md" lay-event="testPay">
<i class="layui-icon layui-icon-cart"></i>
支付测试
</button>
</script>
<script type="text/html" id="account-state">
<input type="checkbox" name="state" value="{{d.id}}" lay-skin="switch" lay-text="启用|禁用" lay-filter="accountEnable" {{ d.state == 1 ? 'checked' : '' }} />
@ -98,7 +102,7 @@
select.innerHTML = option_str;
form.render('select');
})()
let cols = [[
{ type: 'checkbox' },
{ title: '平 台', field: 'platform', align: 'center', templet: '' },
@ -154,6 +158,8 @@
httpJSON('/api/PayManage/delAccount', { ids: select_id })
layer.close(index);
});
} else if (obj.event === 'testPay') {
account.testPay();
}
});
// 表单自定义事件监听
@ -237,6 +243,17 @@
layer.msg(rec_info.msg, { icon: 2, time: 1200 }, () => { obj.elem.checked = !obj.elem.checked });
}
}
// 支付测试
account.testPay = function () {
layer.open({
id: 'iframe-test-pay',
type: 2,
title: '支付测试',
shade: 0.1,
area: [common.isModile() ? '100%' : '480px', common.isModile() ? '100%' : '320px'],
content: `/Order/testPay`,
});
}
// 请求封装
async function httpJSON(url, info) {
const res = await fetch(url, { method: 'post', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify(info) });