You cannot select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
dongfeng-pay/legend/views/templete-add.html

313 lines
21 KiB
Go

<!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">1001100</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>01</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}$/, '612'],
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>