crypto/cebg-site
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

增加表单错误提示

Browse Source
This commit is contained in:
huangjinming 2022-11-08 15:33:55 +08:00
parent b8ea84a19f
commit 0a2fb39840
5 changed files with 508 additions and 444 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

21
src/desktop/css/main.css
View File

@ -1497,7 +1497,28 @@ span.swiper-pagination-bullet {
font-family: na-he; font-family: na-he;
} }
.showMessage {
padding: 10px 20px;
border-radius: 5px;
position: fixed;
top: 15%;
left: 50%;
color: #ffffff;
z-index: 999;
transform: translate(-50%, 0);
}
.showMessageSuccess {
background-color: #f0f9eb;
border: 1px solid #E1F3D8;
color: #67c23a;
}
.showMessageError {
background-color: #fef0f0;
border: 1px solid #fde2e2;
color: #F76C6C;
}

190
src/desktop/join.html
View File

@ -2,48 +2,78 @@
<html> <html>
<head> <head>
<meta charset="utf-8" /> <meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
<meta name="renderer" content="webkit"> <meta name="renderer" content="webkit" />
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no"> <meta
name="viewport"
content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no"
/>
<title>CEBG: CRYPTO ELITE‘S BATTLEGROUNDS</title> <title>CEBG: CRYPTO ELITE‘S BATTLEGROUNDS</title>
</head> </head>
<body> <body>
<section class="main"> <section class="main">
<section class="header"> <section class="header">
<img src="img/applyother/a1.png" width="100%" /> <img src="img/applyother/a1.png" width="100%" />
<script>cur = 'activity'; sub='act2'</script> <script>
cur = "activity";
sub = "act2";
</script>
<%- include('../comp/desktopNav.html') %> <%- include('../comp/desktopNav.html') %>
</section> </section>
<section class="main-con"> <section class="main-con">
<div class="apply-wrap" id="form_layer"> <div class="apply-wrap" id="form_layer">
<div class="apply-inner"> <div class="apply-inner">
<h5 class="apply-tip tac"><img src="img/applyother/ap-tip.png" /></h5> <h5 class="apply-tip tac">
<img src="img/applyother/ap-tip.png" />
</h5>
<div class="apply-from"> <div class="apply-from">
<form class="cmxform" id="signupForm" method="get" action="#"> <form class="cmxform" id="signupForm" method="get" action="#">
<div> <div>
<p for="nickname"><strong>Nickname</strong></p> <p for="nickname"><strong>Nickname</strong></p>
<input id="nickname" class="text" name="nickname" type="text" maxlength=20 autocomplete="off"> <input
id="nickname"
class="text"
name="nickname"
type="text"
maxlength="20"
autocomplete="off"
/>
</div> </div>
<div> <div>
<p for="email"><strong>E-mail</strong></p> <p for="email"><strong>E-mail</strong></p>
<input id="email" class="text" name="email" type="text" autocomplete="off"> <input
id="email"
class="text"
name="email"
type="text"
autocomplete="off"
/>
</div> </div>
<div> <div>
<p for="location"><strong>From</strong></p> <p for="location"><strong>From</strong></p>
<input id="location" class="text" name="location" type="text" autocomplete="off"> <input
id="location"
class="text"
name="location"
type="text"
autocomplete="off"
/>
</div> </div>
<p class="checkbox-wrap"> <p class="checkbox-wrap">
<input type="checkbox" class="checkbox" id="ever" name="ever"> <input
type="checkbox"
class="checkbox"
id="ever"
name="ever"
/>
<label for="ever">Blockchain experience?</label> <label for="ever">Blockchain experience?</label>
</p> </p>
<p class="checkbox-wrap"> <p class="checkbox-wrap">
<input type="checkbox" class="checkbox" id="alr" name="alr"> <input type="checkbox" class="checkbox" id="alr" name="alr" />
<label for="alr">Followed CEBG Twitter?</label> <label for="alr">Followed CEBG Twitter?</label>
</p> </p>
<p class="checkbox-wrap"> <p class="checkbox-wrap">
<input type="checkbox" class="checkbox" id="dis" name="dis"> <input type="checkbox" class="checkbox" id="dis" name="dis" />
<label for="dis">Joined CEBG Discrod?</label> <label for="dis">Joined CEBG Discrod?</label>
</p> </p>
@ -51,7 +81,6 @@
<span class="submit" id="submit_btn">Send</span> <span class="submit" id="submit_btn">Send</span>
</p> </p>
</form> </form>
</div> </div>
</div> </div>
</div> </div>
@ -63,62 +92,81 @@
</section> </section>
<%- include('../comp/walletModal.html') %> <%- include('../comp/jslib.html') <%- include('../comp/walletModal.html') %> <%- include('../comp/jslib.html')
%> %>
<script src="https://cdn.jsdelivr.net/npm/jquery-validation@1.19.5/dist/jquery.validate.min.js" integrity="sha256-JwUksNJ6/R07ZiLRoXbGeNrtlFZMFDKX4hemPiHOmCA=" crossorigin="anonymous"></script> <script
src="https://cdn.jsdelivr.net/npm/jquery-validation@1.19.5/dist/jquery.validate.min.js"
integrity="sha256-JwUksNJ6/R07ZiLRoXbGeNrtlFZMFDKX4hemPiHOmCA="
crossorigin="anonymous"
></script>
<script> <script>
const FORM_URL = 'https://invitation.cebggame.com/invitation/add_commander'; const FORM_URL =
const CHECK_URL = 'https://invitation.cebggame.com/invitation/check_bind_commander'; "https://invitation.cebggame.com/invitation/add_commander";
const CHECK_URL =
"https://invitation.cebggame.com/invitation/check_bind_commander";
$().ready(function () { $().ready(function () {
function showMessage(message, type) {
let messageJQ = $("<div class='showMessage'>" + message + "</div>");
if (type == 0) {
messageJQ.addClass("showMessageError");
} else if (type == 1) {
messageJQ.addClass("showMessageSuccess");
}
messageJQ.hide().appendTo("body").slideDown(400);
window.setTimeout(function () {
messageJQ.show().slideUp(400, function () {
messageJQ.remove();
});
}, 4000);
}
function getUrlParam(name) { function getUrlParam(name) {
var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)"); var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)");
var r = window.location.search.substr(1).match(reg); var r = window.location.search.substr(1).match(reg);
if (r != null) return unescape(r[2]); return null; if (r != null) return unescape(r[2]);
return null;
} }
let ambassador = getUrlParam('amb') || ''; let ambassador = getUrlParam("amb") || "";
$("#signupForm").validate({ $("#signupForm").validate({
success: "valid", success: "valid",
rules: { rules: {
nickname: { required: true, rangelength: [3, 20] }, nickname: { required: true, rangelength: [3, 20] },
email: { required: true, email: true }, email: { required: true, email: true },
location: {required: true, minlength: 2} location: { required: true, minlength: 2 },
}, },
messages: { messages: {
nickname: "Enter at least 3 words. Enter a maximum of 20 words.", nickname: "Enter at least 3 words. Enter a maximum of 20 words.",
email: "Please enter your correct email address.", email: "Please enter your correct email address.",
location: "This field cannot be empty. Please enter your country of residence." location:
"This field cannot be empty. Please enter your country of residence.",
}, },
submitHandler: function (form) { submitHandler: function (form) {
postData(generateFormData()); postData(generateFormData());
} },
}); });
$('#submit_btn').click(function() { $("#submit_btn").click(function () {
if (window.chain.logined) { if (window.chain.logined) {
$('#signupForm').submit(); $("#signupForm").submit();
} else { } else {
window.chainLogin(async function () { window.chainLogin(async function () {
let result = await checkJoined(window.chain.account); let result = await checkJoined(window.chain.account);
if (result) { if (result) {
showSuccess(); showSuccess();
} else { } else {
$('#signupForm').submit(); $("#signupForm").submit();
} }
});
})
} }
});
})
var generateFormData = () => { var generateFormData = () => {
return { return {
account: window.chain.account, account: window.chain.account,
ambassador, ambassador,
email: $('#email').val(), email: $("#email").val(),
name: $('#nickname').val(), name: $("#nickname").val(),
from: $('#location').val(), from: $("#location").val(),
bcexp: $('#ever').prop('checked')? 1: 0, bcexp: $("#ever").prop("checked") ? 1 : 0,
followcebg: $('#alr').prop('checked')? 1: 0, followcebg: $("#alr").prop("checked") ? 1 : 0,
joinedcebg: $('#dis').prop('checked')? 1: 0 joinedcebg: $("#dis").prop("checked") ? 1 : 0,
} };
} };
var postData = async (formData) => { var postData = async (formData) => {
var headers = new Headers(); var headers = new Headers();
headers.append("Content-Type", "application/json"); headers.append("Content-Type", "application/json");
@ -126,59 +174,53 @@
formData.token = window.chain.token; formData.token = window.chain.token;
} }
try { try {
let data = await fetch( let data = await fetch(FORM_URL, {
FORM_URL, method: "POST",
{
method: 'POST',
headers, headers,
mode: 'cors', mode: "cors",
cache: 'no-cache', cache: "no-cache",
body: JSON.stringify(formData) body: JSON.stringify(formData),
}, }).then((res) => {
) return res.json();
.then(res => { });
return res.json()
})
if (!data.errcode) { if (!data.errcode) {
showSuccess(); showSuccess();
}else{
showMessage("Submit failed", 0);
} }
} catch (err) { } catch (err) {
console.log('error post data', err); console.log("error post data", err);
}
} }
};
var checkJoined = async function (account) { var checkJoined = async function (account) {
var headers = new Headers(); var headers = new Headers();
headers.append("Content-Type", "application/json"); headers.append("Content-Type", "application/json");
let data = {account} let data = { account };
if (window.chain.logined) { if (window.chain.logined) {
data.token = window.chain.token; data.token = window.chain.token;
} }
try { try {
let resData = await fetch( let resData = await fetch(CHECK_URL, {
CHECK_URL, method: "POST",
{
method: 'POST',
headers, headers,
mode: 'cors', mode: "cors",
cache: 'no-cache', cache: "no-cache",
body: JSON.stringify({account}) body: JSON.stringify({ account }),
}, }).then((res) => {
) return res.json();
.then(res => { });
return res.json()
})
if (!resData.errcode && resData.result) { if (!resData.errcode && resData.result) {
return resData.result.chk === 1 return resData.result.chk === 1;
} else { } else {
return false return false;
} }
} catch (err) { } catch (err) {
return false return false;
}
} }
};
function showSuccess() { function showSuccess() {
$('#success_tip').show() $("#success_tip").show();
$('#form_layer').hide() $("#form_layer").hide();
} }
async function checkStatus() { async function checkStatus() {
if (window.chain && window.chain.logined) { if (window.chain && window.chain.logined) {
@ -188,9 +230,9 @@
} }
} }
} }
window.addEventListener('account_ready', function() { window.addEventListener("account_ready", function () {
checkStatus() checkStatus();
}) });
}); });
</script> </script>
</body> </body>

2
src/desktop/nft.html
View File

@ -298,7 +298,7 @@
</div> </div>
</section> </section>
<!-- 武器介绍层 --> <!-- 武器介绍层 -->hero_skill_movie
<section class="hero-d-layer weapon-view"> <section class="hero-d-layer weapon-view">
<div class="hero-d-layer-inner"> <div class="hero-d-layer-inner">
<div class="hero-d-layer-con"> <div class="hero-d-layer-con">

1
src/desktop/recruit.html
View File

@ -102,6 +102,7 @@
}); });
galleryTop.params.control = galleryThumbs; galleryTop.params.control = galleryThumbs;
galleryThumbs.params.control = galleryTop; galleryThumbs.params.control = galleryTop;
</script> </script>
</body> </body>
</html> </html>

516
yarn.lock
View File

File diff suppressed because it is too large Load Diff