284 lines
15 KiB
HTML
Executable File
284 lines
15 KiB
HTML
Executable File
{include file="Public:header2"/}
|
||
<body style="min-height: 100%;background-color: #fff">
|
||
<style type="text/css">
|
||
.ggg{
|
||
width:600px !important
|
||
}
|
||
</style>
|
||
<div class="layui-fluid">
|
||
<div class="layui-row layui-col-space15">
|
||
<div class="layui-col-md12">
|
||
<div class="layui-card">
|
||
<div class="layui-card-body">
|
||
<form onsubmit="return false;">
|
||
<div class="layui-form" wid100 lay-filter="">
|
||
<div class="layui-form-item">
|
||
<div class="layui-alert layui-bg-gray">
|
||
<i class="layui-icon layui-icon-tips"></i> 微信Appid和AppSecret已移至系统设置页面,请在那里设置。ps:权重越高,支付几率越多。订单前缀必填,用于区分哪一个商户号支付的。
|
||
</div>
|
||
</div>
|
||
<input type="hidden" name="key" value="weixinpay_setting" lay-verify="required" class="layui-input">
|
||
|
||
<div id="merchants-container">
|
||
{if isset($data.merchants) && is_array($data.merchants)}
|
||
{foreach $data.merchants as $index => $merchant}
|
||
<div class="merchant-item" style="border: 1px solid #e6e6e6; padding: 20px; margin-bottom: 20px; position: relative;">
|
||
<div class="layui-form-item">
|
||
<label class="layui-form-label">商户名称</label>
|
||
<div class="layui-input-inline ggg">
|
||
<input type="text" name="merchants[{$index}][name]" value="{$merchant.name}" lay-verify="required" class="layui-input" placeholder="请输入商户名称">
|
||
</div>
|
||
</div>
|
||
<div class="layui-form-item">
|
||
<label class="layui-form-label">MCHID</label>
|
||
<div class="layui-input-inline ggg">
|
||
<input type="text" name="merchants[{$index}][mch_id]" value="{$merchant.mch_id}" lay-verify="required" class="layui-input" placeholder="请输入商户号">
|
||
</div>
|
||
</div>
|
||
<div class="layui-form-item">
|
||
<label class="layui-form-label">Key</label>
|
||
<div class="layui-input-inline ggg">
|
||
<input type="text" name="merchants[{$index}][keys]" value="{$merchant.keys}" lay-verify="required" class="layui-input" placeholder="请输入商户密钥">
|
||
</div>
|
||
</div>
|
||
<div class="layui-form-item">
|
||
<label class="layui-form-label">订单前缀</label>
|
||
<div class="layui-input-inline ggg">
|
||
<input type="text" name="merchants[{$index}][order_prefix]" value="{$merchant.order_prefix}" lay-verify="required|prefix" class="layui-input" placeholder="请输入3位订单前缀" maxlength="3">
|
||
</div>
|
||
</div>
|
||
<div class="layui-form-item">
|
||
<label class="layui-form-label">权重</label>
|
||
<div class="layui-input-inline ggg">
|
||
<input type="number" name="merchants[{$index}][weight]" value="{$merchant.weight|default='1'}" min="1" lay-verify="required" class="layui-input" placeholder="请输入权重,数值越大被选中的概率越高">
|
||
</div>
|
||
</div>
|
||
<button type="button" class="layui-btn layui-btn-danger layui-btn-sm remove-merchant" style="position: absolute; top: 10px; right: 10px;">删除商户</button>
|
||
</div>
|
||
{/foreach}
|
||
{else}
|
||
<!-- 默认商户项 -->
|
||
<div class="merchant-item" style="border: 1px solid #e6e6e6; padding: 20px; margin-bottom: 20px; position: relative;">
|
||
<div class="layui-form-item">
|
||
<label class="layui-form-label">商户名称</label>
|
||
<div class="layui-input-inline ggg">
|
||
<input type="text" name="merchants[0][name]" value="{$data.mch_id|default='默认商户'}" lay-verify="required" class="layui-input" placeholder="请输入商户名称">
|
||
</div>
|
||
</div>
|
||
<div class="layui-form-item">
|
||
<label class="layui-form-label">MCHID</label>
|
||
<div class="layui-input-inline ggg">
|
||
<input type="text" name="merchants[0][mch_id]" value="{$data.mch_id}" lay-verify="required" class="layui-input" placeholder="请输入商户号">
|
||
</div>
|
||
</div>
|
||
<div class="layui-form-item">
|
||
<label class="layui-form-label">Key</label>
|
||
<div class="layui-input-inline ggg">
|
||
<input type="text" name="merchants[0][keys]" value="{$data.keys}" lay-verify="required" class="layui-input" placeholder="请输入商户密钥">
|
||
</div>
|
||
</div>
|
||
<div class="layui-form-item">
|
||
<label class="layui-form-label">订单前缀</label>
|
||
<div class="layui-input-inline ggg">
|
||
<input type="text" name="merchants[0][order_prefix]" value="{$data.order_prefix|default='MYH'}" lay-verify="required|prefix" class="layui-input" placeholder="请输入3位订单前缀" maxlength="3">
|
||
</div>
|
||
</div>
|
||
<div class="layui-form-item">
|
||
<label class="layui-form-label">权重</label>
|
||
<div class="layui-input-inline ggg">
|
||
<input type="number" name="merchants[0][weight]" value="1" min="1" lay-verify="required" class="layui-input" placeholder="请输入权重,数值越大被选中的概率越高">
|
||
</div>
|
||
</div>
|
||
<button type="button" class="layui-btn layui-btn-danger layui-btn-sm remove-merchant" style="position: absolute; top: 10px; right: 10px;">删除商户</button>
|
||
</div>
|
||
{/if}
|
||
</div>
|
||
|
||
<div class="layui-form-item">
|
||
<div class="layui-input-block">
|
||
<button class="layui-btn layui-btn-normal" id="add-merchant">添加商户</button>
|
||
<button class="layui-btn" onclick="return check()">确认保存</button>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</form>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
{include file="Public:footer"/}
|
||
</body>
|
||
</html>
|
||
<script type="text/javascript">
|
||
layui.use(['layer','form','upload','element'], function(){
|
||
var $ = layui.$;
|
||
var form = layui.form;
|
||
|
||
// 添加自定义验证规则
|
||
form.verify({
|
||
prefix: function(value, item){
|
||
if(value.length !== 3){
|
||
return '订单前缀必须是3位字符';
|
||
}
|
||
|
||
// 检查前缀唯一性
|
||
var prefixes = [];
|
||
$('input[name$="[order_prefix]"]').each(function() {
|
||
var prefix = $(this).val();
|
||
if (prefix && prefix !== value) {
|
||
prefixes.push(prefix);
|
||
}
|
||
});
|
||
|
||
if (prefixes.includes(value)) {
|
||
return '商户前缀"' + value + '"重复,每个商户的前缀必须唯一';
|
||
}
|
||
}
|
||
});
|
||
|
||
// 监听提交
|
||
form.on('submit', function(data){
|
||
// 验证前缀唯一性
|
||
var prefixes = [];
|
||
var hasDuplicate = false;
|
||
var duplicatePrefix = '';
|
||
|
||
$('input[name$="[order_prefix]"]').each(function() {
|
||
var prefix = $(this).val();
|
||
if (prefix) {
|
||
if (prefixes.includes(prefix)) {
|
||
hasDuplicate = true;
|
||
duplicatePrefix = prefix;
|
||
return false; // 跳出循环
|
||
}
|
||
prefixes.push(prefix);
|
||
}
|
||
});
|
||
|
||
if (hasDuplicate) {
|
||
layer.msg('商户前缀"' + duplicatePrefix + '"重复,每个商户的前缀必须唯一', {icon: 2, anim: 6, time: 2000});
|
||
return false;
|
||
}
|
||
|
||
return true;
|
||
});
|
||
|
||
// 添加商户按钮点击事件
|
||
$('#add-merchant').on('click', function() {
|
||
var index = $('.merchant-item').length;
|
||
var newItemHtml = `
|
||
<div class="merchant-item" style="border: 1px solid #e6e6e6; padding: 20px; margin-bottom: 20px; position: relative;">
|
||
<div class="layui-form-item">
|
||
<label class="layui-form-label">商户名称</label>
|
||
<div class="layui-input-inline ggg">
|
||
<input type="text" name="merchants[${index}][name]" value="" lay-verify="required" class="layui-input" placeholder="请输入商户名称">
|
||
</div>
|
||
</div>
|
||
<div class="layui-form-item">
|
||
<label class="layui-form-label">MCHID</label>
|
||
<div class="layui-input-inline ggg">
|
||
<input type="text" name="merchants[${index}][mch_id]" value="" lay-verify="required" class="layui-input" placeholder="请输入商户号">
|
||
</div>
|
||
</div>
|
||
<div class="layui-form-item">
|
||
<label class="layui-form-label">Key</label>
|
||
<div class="layui-input-inline ggg">
|
||
<input type="text" name="merchants[${index}][keys]" value="" lay-verify="required" class="layui-input" placeholder="请输入商户密钥">
|
||
</div>
|
||
</div>
|
||
<div class="layui-form-item">
|
||
<label class="layui-form-label">订单前缀</label>
|
||
<div class="layui-input-inline ggg">
|
||
<input type="text" name="merchants[${index}][order_prefix]" value="" lay-verify="required|prefix" class="layui-input" placeholder="请输入3位订单前缀" maxlength="3">
|
||
</div>
|
||
</div>
|
||
<div class="layui-form-item">
|
||
<label class="layui-form-label">权重</label>
|
||
<div class="layui-input-inline ggg">
|
||
<input type="number" name="merchants[${index}][weight]" value="1" min="1" lay-verify="required" class="layui-input" placeholder="请输入权重,数值越大被选中的概率越高">
|
||
</div>
|
||
</div>
|
||
<button type="button" class="layui-btn layui-btn-danger layui-btn-sm remove-merchant" style="position: absolute; top: 10px; right: 10px;">删除商户</button>
|
||
</div>
|
||
`;
|
||
$('#merchants-container').append(newItemHtml);
|
||
form.render();
|
||
});
|
||
|
||
// 删除商户按钮点击事件(使用事件委托)
|
||
$(document).on('click', '.remove-merchant', function() {
|
||
if ($('.merchant-item').length <= 1) {
|
||
layer.msg('至少保留一个商户信息', {icon: 2});
|
||
} else {
|
||
$(this).closest('.merchant-item').remove();
|
||
// 重新排序索引
|
||
$('.merchant-item').each(function(idx) {
|
||
$(this).find('input').each(function() {
|
||
var name = $(this).attr('name');
|
||
if (name) {
|
||
$(this).attr('name', name.replace(/merchants\[\d+\]/, 'merchants[' + idx + ']'));
|
||
}
|
||
});
|
||
});
|
||
}
|
||
});
|
||
});
|
||
|
||
function check(){
|
||
var $ = layui.$;
|
||
var form = layui.form;
|
||
|
||
// 先进行前缀唯一性验证
|
||
var prefixes = [];
|
||
var hasDuplicate = false;
|
||
var duplicatePrefix = '';
|
||
|
||
$('input[name$="[order_prefix]"]').each(function() {
|
||
var prefix = $(this).val();
|
||
if (prefix) {
|
||
if (prefixes.includes(prefix)) {
|
||
hasDuplicate = true;
|
||
duplicatePrefix = prefix;
|
||
return false; // 跳出循环
|
||
}
|
||
prefixes.push(prefix);
|
||
}
|
||
});
|
||
|
||
if (hasDuplicate) {
|
||
layer.msg('商户前缀"' + duplicatePrefix + '"重复,每个商户的前缀必须唯一', {icon: 2, anim: 6, time: 2000});
|
||
return false;
|
||
}
|
||
|
||
// 长度验证
|
||
var hasError = false;
|
||
$('input[name$="[order_prefix]"]').each(function() {
|
||
var prefix = $(this).val();
|
||
if (!prefix || prefix.length !== 3) {
|
||
hasError = true;
|
||
layer.msg('商户前缀必须是3位字符', {icon: 2, anim: 6, time: 2000});
|
||
return false; // 跳出循环
|
||
}
|
||
});
|
||
|
||
if (hasError) {
|
||
return false;
|
||
}
|
||
|
||
// 提交表单
|
||
var url="{:url('/admin/update')}";
|
||
var load=layer.load(2);
|
||
$.post(url,$("form").serialize(),function(data){
|
||
if(data.status==1){
|
||
layer.msg(data.msg,{icon:1,time:1000},function(){
|
||
location.reload();
|
||
});
|
||
}else{
|
||
layer.msg(data.msg,{icon:2,anim:6,time:1500},function(){
|
||
layer.close(load);
|
||
});
|
||
}
|
||
})
|
||
}
|
||
</script> |