dongfeng-pay/legend/views/templete-add.html
2021-04-27 15:33:49 +08:00

313 lines
21 KiB
Go
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<!DOCTYPE html>
<html class="x-admin-sm">
<head>
<meta charset="UTF-8">
<title>充值商户后台</title>
<meta name="renderer" content="webkit|ie-comp|ie-stand">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width,user-scalable=yes, minimum-scale=0.4, initial-scale=0.8,target-densitydpi=low-dpi" />
<meta http-equiv="Cache-Control" content="no-siteapp" />
<link rel="stylesheet" href="../static/x-admin/css/font.css">
<link rel="stylesheet" href="../static/x-admin/css/xadmin.css">
<!-- <link rel="stylesheet" href="./css/theme5.css"> -->
<script src="../static/x-admin/lib/layui/layui.js" charset="utf-8"></script>
<script type="text/javascript" src="../static/x-admin/js/xadmin.js"></script>
<script type="text/javascript" src="../static/js/jquery-3.5.1.min.js"></script>
<!-- 让IE8/9支持媒体查询从而兼容栅格 -->
<!--[if lt IE 9]>
<script src="https://cdn.staticfile.org/html5shiv/r29/html5.min.js"></script>
<script src="https://cdn.staticfile.org/respond.js/1.4.2/respond.min.js"></script>
<![endif]-->
</head>
<body>
<div class="layui-fluid">
<div class="layui-card">
<div class="layui-card-header"><b>配置模板</b></div>
<div class="layui-card-body">
<div class="layui-row">
<form class="layui-form" action="">
<div class="layui-collapse">
<div class="layui-colla-item">
<h1 class="layui-colla-title">基础配置</h1>
<div class="layui-colla-content layui-show">
<div class="layui-form-item">
<label class="layui-form-label"><strong>模板名称</strong></label>
<div class="layui-input-inline">
<input type="text" name="scale-templete-name" required lay-verify="required" autocomplete="off" class="layui-input">
</div>
<div class="layui-form-mid layui-word-aux">取名保证唯一性</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label"><strong>用户标识</strong></label>
<div class="layui-input-inline">
<input type="text" name="scale-user-name" required lay-verify="required" autocomplete="off" class="layui-input">
</div>
<div class="layui-form-mid layui-word-aux">可填写角色名或者角色ID不可为空</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label"><strong>用户标识提示</strong></label>
<div class="layui-input-inline">
<input type="text" name="scale-user-name-point" required lay-verify="required" placeholder="如通过角色属性面板查看角色ID" autocomplete="off" class="layui-input">
</div>
<div class="layui-form-mid layui-word-aux">此提示会在充值页面显示提示玩家如何查看用户标识</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label"><strong>金额类型</strong></label>
<div class="layui-input-block">
<input type="radio" lay-filter="money-type-filter" name="money-type" value="any-money" title="任意金额" checked>
<input type="radio" lay-filter="money-type-filter" name="money-type" value="fixed-money-type" title="固定金额">
</div>
</div>
<!-- 任意金额的样式 -->
<div id="any-money-style">
<div class="layui-form-item">
<label class="layui-form-label"><strong>游戏币名称</strong></label>
<div class="layui-input-inline">
<input type="text" name="game-money-name" required lay-verify="required" placeholder="" autocomplete="off" class="layui-input">
</div>
<div class="layui-form-mid layui-word-aux">默认是元宝也可以是钻石点券</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label"><strong>游戏币比例</strong></label>
<div class="layui-input-inline">
<input type="text" name="game-money-scale" required lay-verify="required" autocomplete="off" class="layui-input">
</div>
<div class="layui-form-mid layui-word-aux">默认是100既充值1元人命币转为100游戏币</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label"><strong>最低充值金额</strong></label>
<div class="layui-input-inline">
<input type="text" name="limit-low-money" required lay-verify="required" autocomplete="off" class="layui-input">
</div>
<div class="layui-form-mid layui-word-aux">默认最低为10元</div>
</div>
</div>
<!-- 固定金额的样式-->
<div id="fixed-money-style" class="layui-row" style="margin-left: 40px;">
<div class="layui-form-item">
<div class="layui-col-md1" style="margin-left: 10px;">
<input type="text" name="limit-low-money" required lay-verify="required" placeholder="售价(元)" autocomplete="off" class="layui-input">
</div>
<div class=" layui-col-md2" style="margin-left: 10px;">
<input type="text" name="limit-low-money" required lay-verify="required" placeholder="商品名称" autocomplete="off" class="layui-input">
</div>
<div class="layui-col-md2" style="margin-left: 10px;">
<input type="text" name="limit-low-money" required lay-verify="required" placeholder="商品编号" autocomplete="off" class="layui-input">
</div>
<div class="layui-col-md1" style="margin-left: 10px;">
<input type="text" name="limit-low-money" required lay-verify="required" placeholder="可够次数" autocomplete="off" class="layui-input">
</div>
<div class="layui-inline" style="margin-left: 10px;">
<div class="layui-btn layui-btn-danger fixed-money-child-del"><i class="layui-icon layui-icon-delete">删除</i> </div>
</div>
</div>
<div id="fixed-money-child-style"></div>
<div class="layui-btn" style="margin-left: 10px;" onclick="addFixedMoenyStyle();"><i class="layui-icon layui-icon-add-circle">添加商品</i></div>
<div style="color: red; margin-left: 10px;"><h3><p>说明请根据游戏内设置的商品道具进行设置切勿乱填</p><p>可购次数填0代表不限填1代表一个帐号仅可购买一次依此类推</p></h3></div>
</div>
</div>
</div>
<div class="layui-colla-item">
<h1 class="layui-colla-title">激励赠送</h1>
<div class="layui-colla-content layui-show">
<div class="layui-form-item">
<label class="layui-form-label"><strong>赠送方式</strong></label>
<div class="layui-input-block">
<input type="radio" lay-filter="present-type-filter" name="present-type" value="close-present" title="关闭" checked>
<input type="radio" lay-filter="present-type-filter" name="present-type" value="fixed-money-present" title="固定金额赠送">
<input type="radio" lay-filter="present-type-filter" name="present-type" value="fscale-present" title="按百分比赠送">
</div>
</div>
<!-- 按金额赠送-->
<div id="present-type-money-style">
<div class="layui-form-item">
<label class="layui-form-label"><strong>充值</strong></label>
<div class="layui-input-inline">
<input type="text" name="scale-user-name" required lay-verify="required" placeholder="金额(元)" autocomplete="off" class="layui-input">
</div>
<div class="layui-input-inline">
<input type="text" name="scale-user-name" required lay-verify="required" placeholder="赠送金额(元)" autocomplete="off" class="layui-input">
</div>
<div class="layui-inline">
<div class="layui-btn layui-btn-danger fixed-money-child-del"><i class="layui-icon layui-icon-delete">删除</i></div>
</div>
</div>
<div id="present-type-money-child-style"></div>
<div class="layui-btn" style="margin-left: 50px;" onclick="addPresentTypeMoneyStyle();"><i class="layui-icon layui-icon-add-circle"></i>添加</div>
</div>
<!-- 按百分比赠送-->
<div id="present-type-scale-style">
<div class="layui-form-item">
<label class="layui-form-label"><strong>充值</strong></label>
<div class="layui-input-inline">
<input type="text" name="scale-user-name" required lay-verify="required" placeholder="金额(元)" autocomplete="off" class="layui-input">
</div>
<div class="layui-input-inline">
<input type="text" name="scale-user-name" required lay-verify="required" placeholder="赠送比例(%" autocomplete="off" class="layui-input">
</div>
<div class="layui-inline">
<div class="layui-btn layui-btn-danger fixed-money-child-del"><i class="layui-icon layui-icon-delete">删除</i></div>
</div>
</div>
<div id="present-type-scale-child-style"></div>
<div class="layui-btn" style="margin-left: 50px;" onclick="addPresentTypeScaleStyle();"><i class="layui-icon layui-icon-add-circle"></i>添加</div>
</div>
</div>
</div>
</div>
</form>
</div>
<div class="layui-form-item">
<br>
<button class="layui-btn" lay-filter="add">保存/添加</button>
<button class="layui-btn layui-btn-danger" lay-filter="back" lay-submit="">返回当前页</button>
</div>
</div>
</div>
</div>
{{/* </div>*/}}
<script>
// 动态添加固定金额赠送input框
function addPresentTypeMoneyStyle() {
let str = '<div class="layui-form-item"><label class="layui-form-label"><strong>充值</strong></label><div class="layui-input-inline">' +
'<input type="text" name="scale-user-name" required lay-verify="required" placeholder="金额(元)" autocomplete="off" class="layui-input"></div><div class="layui-input-inline">' +
'<input type="text" name="scale-user-name" required lay-verify="required" placeholder="赠送金额(元)" autocomplete="off" class="layui-input">' +
'</div><div class="layui-inline"><div class="layui-btn layui-btn-danger fixed-money-child-del"><i class="layui-icon layui-icon-delete">删除</i></div></div></div>';
$("#present-type-money-child-style").append(str);
}
// 动态添加按百分比赠送input框
function addPresentTypeScaleStyle() {
let str = '<div class="layui-form-item"><label class="layui-form-label"><strong>充值</strong></label><div class="layui-input-inline">' +
'<input type="text" name="scale-user-name" required lay-verify="required" placeholder="金额(元)" autocomplete="off" class="layui-input">' +
'</div><div class="layui-input-inline"><input type="text" name="scale-user-name" required lay-verify="required" placeholder="赠送比例(%" autocomplete="off" class="layui-input">' +
'</div><div class="layui-inline"><div class="layui-btn layui-btn-danger fixed-money-child-del"><i class="layui-icon layui-icon-delete">删除</i></div></div></div>';
$("#present-type-scale-child-style").append(str);
}
// 动态添加固定金额的input输入框
function addFixedMoenyStyle() {
let str = '<div class="layui-form-item">' +
'<div class="layui-col-md1" style="margin-left: 10px;">' +
'<input type="text" name="limit-low-money" required lay-verify="required" placeholder="售价(元)" autocomplete="off" class="layui-input">' +
'</div><div class=" layui-col-md2" style="margin-left: 10px;">' +
'<input type="text" name="limit-low-money" required lay-verify="required" placeholder="商品名称" autocomplete="off" class="layui-input">' +
'</div><div class="layui-col-md2" style="margin-left: 10px;">' +
'<input type="text" name="limit-low-money" required lay-verify="required" placeholder="商品编号" autocomplete="off" class="layui-input">' +
'</div><div class="layui-col-md1" style="margin-left: 10px;"><input type="text" name="limit-low-money" required lay-verify="required" placeholder="可够次数" autocomplete="off" class="layui-input">' +
'</div><div class="layui-inline" style="margin-left: 10px;">' +
'<div class="layui-btn layui-btn-danger fixed-money-child-del"><i class="layui-icon layui-icon-delete"> 删除</i></div></div></div>';
$("#fixed-money-child-style").append(str);
}
// 删除固金额input
$("div").on('click', '.fixed-money-child-del', function () {
$(this).parent().parent().remove();
})
layui.use(['form', 'layer', 'element'], function() {
// 启动element木块
let element = layui.element;
$ = layui.jquery;
var form = layui.form,
layer = layui.layer;
// 进入该页面首先做的事情
$(document).ready(function () {
$("#fixed-money-style").toggle();
$("#present-type-money-style").hide();
$("#present-type-scale-style").hide();
})
//自定义验证规则
form.verify({
nikename: function(value) {
if (value.length < 5) {
return '昵称至少得5个字符啊';
}
},
pass: [/(.+){6,12}$/, '密码必须6到12位'],
repass: function(value) {
if ($('#L_pass').val() != $('#L_repass').val()) {
return '两次密码不一致';
}
}
});
// 监听赠送类型的radio
form.on('radio(present-type-filter)', function (data) {
let radioValue = data.value;
if ("close-present" === radioValue) {
$("#present-type-money-style").hide();
$("#present-type-scale-style").hide();
} else if ("fixed-money-present" === radioValue) {
$("#present-type-money-style").show();
$("#present-type-scale-style").hide();
} else if ("fscale-present" === radioValue) {
$("#present-type-money-style").hide();
$("#present-type-scale-style").show();
}
})
// 监听金额类型的radio
form.on('radio(money-type-filter)', function (data) {
let value = data.value;
if ("any-monty" === value) {
//处理任何金额
$("#any-money-style").toggle();
$("#fixed-money-style").toggle();
} else {
// 处理固定金额
$("#any-money-style").toggle();
$("#fixed-money-style").toggle();
}
})
//监听提交
form.on('submit(add)', function(data) {
console.log(data);
//发异步把数据提交给php
layer.alert("增加成功", {
icon: 6
},
function() {
// 获得frame索引
var index = parent.layer.getFrameIndex(window.name);
//关闭当前frame
parent.layer.close(index);
});
return false;
});
form.on('submit(back)',
function () {
window.history.back(-1);
});
});
</script>
</body>
</html>