353 lines
15 KiB
Plaintext
353 lines
15 KiB
Plaintext
@using WX.CRM.WebHelper;
|
|
|
|
@{
|
|
ViewBag.Title = "注册和购买";
|
|
Layout = "~/Views/Shared/_content.cshtml";
|
|
|
|
}
|
|
<style>
|
|
body {
|
|
background-color: white;
|
|
padding: 10px;
|
|
}
|
|
|
|
.layui-form-txt {
|
|
float: left;
|
|
display: block;
|
|
padding: 9px 15px 9px 0;
|
|
width: 80px;
|
|
font-weight: 400;
|
|
line-height: 20px;
|
|
}
|
|
|
|
.layui-form-item .layui-inline {
|
|
margin-bottom: unset;
|
|
}
|
|
</style>
|
|
|
|
<script src="~/Scripts/clipboard.min.js"></script>
|
|
<fieldset class="layui-elem-field layui-field-title" style="margin-top: 20px;">
|
|
<legend>注册并购买</legend>
|
|
</fieldset>
|
|
<form id="wocaaa" class="layui-form" action="" lay-filter="form1">
|
|
<div class="layui-form-item">
|
|
<label class="layui-form-label">用户名</label>
|
|
<div class="layui-inline">
|
|
<input type="text" id="userName" name="userName" lay-verify="required" lay-reqtext="用户名不能为空！" autocomplete="off" placeholder="请输入用户名" class="layui-input">
|
|
</div>
|
|
</div>
|
|
<div class="layui-form-item">
|
|
<label class="layui-form-label">密码</label>
|
|
<div class="layui-inline">
|
|
<input type="password" id="password" name="password" lay-verify="required" lay-reqtext="请输入密码！" placeholder="请输入密码" autocomplete="new-password" class="layui-input">
|
|
</div>
|
|
</div>
|
|
<div class="layui-form-item">
|
|
<label class="layui-form-label">手机号</label>
|
|
<div class="layui-inline">
|
|
<input type="tel" name="mobile" id="mobile" lay-verify="required|phone" placeholder="请输入手机号码" autocomplete="off" class="layui-input">
|
|
</div>
|
|
</div>
|
|
<div class="layui-form-item">
|
|
<div class="layui-inline">
|
|
<label class="layui-form-label">产品大类</label>
|
|
<div class="layui-input-inline">
|
|
<select id="productId" name="productId" childId="subProductId" style="width:150px;height:22px" lay-filter="productId1">
|
|
<option value="0">--请选中产品大类--</option>
|
|
@foreach (var item in ViewBag.productList as List<SelectListItem>)
|
|
{
|
|
<option value="@item.Value">@item.Text</option>
|
|
}
|
|
</select>
|
|
</div>
|
|
</div>
|
|
<div class="layui-inline">
|
|
<label class="layui-form-label">产品小类</label>
|
|
<div class="layui-input-inline">
|
|
<select id="subProductId" name="subProductId" style="width:220px;height:22px" lay-filter="subProductId1">
|
|
<option value="0">--请选中产品小类--</option>
|
|
</select>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="layui-form-item">
|
|
<div class="layui-inline">
|
|
<label class="layui-form-label">产品价格</label>
|
|
<lable class="layui-form-txt" id="needPay" style="color:orange">
|
|
--
|
|
</lable>
|
|
</div>
|
|
<div class="layui-inline">
|
|
<label class="layui-form-label">开通时长</label>
|
|
<label class="layui-form-txt" id="openDays" style="color:orange">
|
|
--
|
|
</label>
|
|
</div>
|
|
</div>
|
|
<div class="layui-form-item">
|
|
<label class="layui-form-label">购买链接</label>
|
|
<div class="layui-inline" style="width:400px;">
|
|
<textarea class="layui-textarea" name="buyLink" lay-verify="content" id="buyLink"></textarea>
|
|
</div>
|
|
<div class="layui-inline">
|
|
<input type="button" class="layui-btn layui-btn-ok htbtn" data-clipboard-target="#buyLink" data-method="copy" value="复制" />
|
|
<input type="button" class="layui-btn layui-btn-primary opennew" value="打开" id="openNew" hsrc="" />
|
|
@*<button class="layui-btn layui-btn-ok" lay-filter="formDemo">复制</button>*@
|
|
</div>
|
|
</div>
|
|
<div class="layui-form-item">
|
|
<label class="layui-form-label">二维码</label>
|
|
<div class="layui-inline">
|
|
<img id="erweima" />
|
|
</div>
|
|
</div>
|
|
<div class="layui-form-item">
|
|
<label class="layui-form-label"></label>
|
|
<div class="layui-inline">
|
|
<button class="layui-btn layui-btn-ok" lay-submit lay-filter="form1">注册并购买</button>
|
|
</div>
|
|
</div>
|
|
</form>
|
|
|
|
<fieldset class="layui-elem-field layui-field-title" style="margin-top: 20px;">
|
|
<legend>已存在用户名购买</legend>
|
|
</fieldset>
|
|
<form id="wocaaa2" class="layui-form" action="" lay-filter="form2">
|
|
<div class="layui-form-item">
|
|
<label class="layui-form-label">用户名</label>
|
|
<div class="layui-inline">
|
|
<input type="text" name="userName2" id="userName2" lay-verify="required" lay-reqtext="用户名不能为空！" autocomplete="off" placeholder="请输入用户名" class="layui-input">
|
|
</div>
|
|
</div>
|
|
<div class="layui-form-item">
|
|
<div class="layui-inline">
|
|
<label class="layui-form-label">产品大类</label>
|
|
<div class="layui-input-inline">
|
|
<select id="productId2" name="productId2" childId="subProductId2" lay-filter="productId2" style="width:150px;height:22px">
|
|
<option value="0">--请选中产品大类--</option>
|
|
@foreach (var item in ViewBag.productList as List<SelectListItem>)
|
|
{
|
|
<option value="@item.Value">@item.Text</option>
|
|
}
|
|
</select>
|
|
</div>
|
|
</div>
|
|
<div class="layui-inline">
|
|
<label class="layui-form-label">产品小类</label>
|
|
<div class="layui-input-inline">
|
|
<select id="subProductId2" name="subProductId2" lay-filter="subProductId2" style="width:220px;height:22px">
|
|
<option value="0">--请选中产品小类--</option>
|
|
</select>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="layui-form-item">
|
|
<div class="layui-inline">
|
|
<label class="layui-form-label">产品价格</label>
|
|
<lable class="layui-form-txt" id="needPay2" style="color:orange">
|
|
--
|
|
</lable>
|
|
</div>
|
|
<div class="layui-inline">
|
|
<label class="layui-form-label">开通时长</label>
|
|
<label class="layui-form-txt" id="openDays2" style="color:orange">
|
|
--
|
|
</label>
|
|
</div>
|
|
</div>
|
|
<div class="layui-form-item">
|
|
<label class="layui-form-label">购买链接</label>
|
|
<div class="layui-inline" style="width:400px;">
|
|
<textarea class="layui-textarea" name="buyLink2" lay-verify="content" id="buyLink2"></textarea>
|
|
</div>
|
|
<div class="layui-inline">
|
|
<button class="layui-btn layui-btn-ok htbtn" data-clipboard-target="#buyLink2" data-method="copy">复制</button>
|
|
<button class="layui-btn layui-btn-primary opennew" id="openNew2" hsrc="">打开</button>
|
|
</div>
|
|
</div>
|
|
<div class="layui-form-item">
|
|
<label class="layui-form-label">二维码</label>
|
|
<div class="layui-inline">
|
|
<img id="erweima2" />
|
|
</div>
|
|
</div>
|
|
<div class="layui-form-item">
|
|
<label class="layui-form-label"></label>
|
|
<div class="layui-inline">
|
|
<button class="layui-btn layui-btn-ok" lay-submit lay-filter="form2">已存在用户购买</button>
|
|
</div>
|
|
</div>
|
|
</form>
|
|
|
|
<script type="text/javascript">
|
|
layui.use('form', function () {
|
|
var form = layui.form;
|
|
var layer = layui.layer;
|
|
//监听提交
|
|
form.on('submit(form1)', function (data) {
|
|
console.log(data);
|
|
var userName = $('#userName').val();
|
|
var password = $('#password').val();
|
|
if (userName.length < 5) {
|
|
//$.messager.alert("警告", "用户名长度不能小于5个字符", "error");
|
|
layer.msg("用户名长度不能小于5个字符", { icon: 2 });
|
|
return false;
|
|
}
|
|
var pattern = /^([0-9a-z_]+)$/;
|
|
if (!pattern.test(userName)) {
|
|
//$.messager.alert("警告", "用户名只能是数字、小写字母和下划线组成", "error");
|
|
layer.msg("用户名只能是数字、小写字母和下划线组成", { icon: 2 });
|
|
return false;
|
|
}
|
|
if (password.length < 6 || password.length > 18) {
|
|
layer.msg("密码的长度只能在6-18位之间", { icon: 2 });
|
|
//$.messager.alert("警告", "密码的长度只能在6-18位之间", "error");
|
|
return false;
|
|
}
|
|
if ($('#subProductId').val() == 0) {
|
|
layer.msg("请选择购买类别", { icon: 2 });
|
|
//$.messager.alert("警告", "请选择购买类别", "error");
|
|
return false;
|
|
}
|
|
$.ajax({
|
|
type: "POST",
|
|
url: "RegAndBuy",
|
|
data: data.field,
|
|
dataType: "json",
|
|
success: function (da) {
|
|
if (da.type == 0) {
|
|
layer.msg('失败：' + da.message, { icon: 1 })
|
|
} else {
|
|
if (da.ret == 0) {
|
|
layer.msg('链接生成成功！', { icon: 1 });
|
|
$('#buyLink').val(da.buyLink);
|
|
$('#openNew').attr("hsrc", da.buyLink);
|
|
$('#erweima').attr("src", "GetQRCode?url=" + encodeURIComponent(da.buyLink) + "?y=" + GetGuid()).width(200).height(200);
|
|
|
|
} else if (da.ret == -1212) {
|
|
//$.messager.alert("警告", "该手机已经注册过，不能被再次使用", "error");
|
|
layer.msg("该手机已经注册过，不能被再次使用", { icon: 2 });
|
|
} else if (da.ret == -1108) {
|
|
//$.messager.alert("警告", "用户名已经存在，不能使用", "error");
|
|
layer.msg("用户名已经存在，不能使用", { icon: 2 });
|
|
}
|
|
else {
|
|
//$.messager.alert("警告", da.msg, "error");
|
|
layer.msg(da.msg, { icon: 2 });
|
|
}
|
|
}
|
|
//if (da.result == true) {
|
|
// parent.layer.msg('链接生成成功！', { icon: 1 });
|
|
//} else {
|
|
// layer.msg(da.retmsg, { icon: 2 });
|
|
//}
|
|
},
|
|
error: function () {
|
|
layer.msg('链接生成失败！', { icon: 2 });
|
|
}
|
|
});
|
|
return false;
|
|
});
|
|
//提交
|
|
form.on('submit(form2)', function (data) {
|
|
if ($('#subProductId2').val() == 0) {
|
|
layer.msg('请选择购买类别！', { icon: 2 });
|
|
return false;
|
|
}
|
|
$.ajax({
|
|
type: "POST",
|
|
url: "BuyLink",
|
|
data: { userName: $('#userName2').val(), productId: $('#productId2').val(), subProductId: $('#subProductId2').val() },
|
|
dataType: "json",
|
|
success: function (data) {
|
|
if (data.type == 0) {
|
|
//$.messager.alert("警告", data.message, "error");
|
|
layer.msg(data.message, { icon: 2 });
|
|
} else {
|
|
if (data.ret == 0) {
|
|
$('#buyLink2').val(data.buyLink);
|
|
$('#openNew2').attr("hsrc", data.buyLink);
|
|
$('#erweima2').attr("src", "GetQRCode?url=" + encodeURIComponent(data.buyLink) + "?y=" + GetGuid()).width(200).height(200);
|
|
}
|
|
else {
|
|
layer.msg('该用户名不存在！', { icon: 2 });
|
|
}
|
|
}
|
|
},
|
|
error: function () {
|
|
layer.msg('链接生成失败！', { icon: 2 });
|
|
}
|
|
});
|
|
return false;
|
|
});
|
|
//各种基于事件的操作，下面会有进一步介绍
|
|
form.on("select(productId1)", function (data) {
|
|
ShowProduct("productId");
|
|
});
|
|
form.on("select(subProductId1)", function (data) {
|
|
changeSubProduct($("#subProductId").val(), 'needPay', 'openDays')
|
|
});
|
|
form.on("select(productId2)", function (data) {
|
|
ShowProduct("productId2");
|
|
});
|
|
form.on("select(subProductId2)", function (data) {
|
|
changeSubProduct($("#subProductId2").val(), 'needPay2', 'openDays2')
|
|
});
|
|
function ShowProduct(mp) {
|
|
var subId = '#' + $("#" + mp).attr("childId");
|
|
var productId = $("#" + mp).val();
|
|
if (productId == 0) {
|
|
$(subId).html("<option value='0'>--请选中产品小类--</option>");
|
|
return;
|
|
}
|
|
$.r_post("GetSubProductList?productId=" + productId + '&isValid=1', function (data) {
|
|
//$(subId).unbind();
|
|
$(subId).html("<option value='0'>--请选中产品小类--</option>");
|
|
$(data).each(function (n, m) {
|
|
/*if (nb1defaultIndex == 0) {
|
|
$("#slt_subProductId").append("<option value='" + m.Value + "' selected='selected'>" + m.Text + "</option>");
|
|
}
|
|
else {*/
|
|
$(subId).append("<option value='" + m.Value + "'>" + m.Text + "</option>");
|
|
|
|
//}
|
|
});
|
|
layui.form.render("select");
|
|
}, "json");
|
|
}
|
|
function changeSubProduct(subProductId, needPayKey, openDaysKey) {
|
|
var needPayId = '#' + needPayKey;
|
|
var openDaysKey = '#' + openDaysKey;
|
|
$.r_post("GetSubProductPriceById?subProductId=" + subProductId, function (data) {
|
|
if (data.result) {
|
|
$(needPayId).text(data.price + '元');
|
|
$(openDaysKey).text(data.days + '天');
|
|
}
|
|
}, "json");
|
|
}
|
|
});
|
|
$(function () {
|
|
|
|
//复制按钮操作
|
|
var clipboard = new ClipboardJS('.htbtn');
|
|
|
|
clipboard.on('success', function (e) {
|
|
alert("复制成功！");
|
|
|
|
e.clearSelection();
|
|
});
|
|
|
|
clipboard.on('error', function (e) {
|
|
console.error('Action:', e.action);
|
|
console.error('Trigger:', e.trigger);
|
|
});
|
|
$(".opennew").click(function () {
|
|
var src = $(this).attr("hsrc");
|
|
if (src == null)
|
|
return;
|
|
window.open(src);
|
|
});
|
|
|
|
});
|
|
</script>
|