#code {
height: 27px;
width: 80%;
outline: none;
border: none;
box-sizing: border-box;
font-size: 16px;
margin-top: 5px;
color: black;
background: none !important;
position: absolute;
top: 41%;
bottom: 0;
margin: auto;
box-shadow: none;
padding: 0;
padding-left: 12px;
}
.submit_btn {
outline: none;
width: 100%;
height: 50px;
background: black;
color: white;
border: none;
line-height: 50px;
margin-top: 20px;
text-align: center;
display: flex;
justify-content: center;
align-items: center;
font-size: 18px;
cursor: pointer;
border-radius: 3px;
}
.fw-container {
max-width: 580px;
display: flex;
margin: 0 auto 0;
flex-direction: column;
padding: 0 10px;
}
.query_btn_code {
display: flex;
margin-bottom: 3vw;
flex-direction: column;
}
.queryBar {
display: flex;
width: 100%;
margin: 0 auto;
position: relative;
height: 50px;
flex-direction: column;
border: 1px solid;
border-radius: 3px;
margin-bottom: 20px;
box-sizing: border-box;
}
.result_content {
min-height: 80px;
background-color: #FAFAFA;
width: 100%;
margin-top: 20px;
padding: 10px 10px 10px 10px;
box-sizing: border-box;
font-size: 14px;
position: relative;
display: flex;
}
#code::placeholder {
font-size: 13px;
}
.tip {
position: absolute;
transition: all 0.3s;
height: max-content;
padding-left: 12px;
font-size: 15px;
pointer-events: none;
color: #777;
max-height: max-content;
bottom: 0;
top: 0;
margin: auto;
line-height: initial;
}
body {
font-family: Arial, sans-serif;
user-select: none;
}
.entry-title {
text-align: center;
font-size: 30px;
}
@media screen and (min-width:960px) {
.box {
display: flex;
}
.submit_btn {
margin: 0;
width: 30%;
margin-left: 10px;
}
}
#error-icon,
#repeat-icon,
#success-icon {
width: 28px;
height: 28px;
border-radius: 50%;
display: none;
flex-shrink: 0;
margin-right: 15px;
}
#error-icon {
background-color: red;
}
#repeat-icon {
background-color: purple;
}
#success-icon {
background-color: green;
}
h1 {
text-align: center;
margin-top: 90px;
}
.loadding {
position: relative;
display: none;
justify-content: center;
width: 30px;
height: 30px;
animation: demo 0.8s ease-in-out infinite;
}
@keyframes demo {
to {
transform: rotateZ(360deg);
}
}
.loadding span {
width: 2px;
height: 9px;
transform-origin: 50% 15px;
position: absolute;
background-color: white;
}
.close-icon {
width: 16px;
height: 16px;
border-radius: 50%;
background: #8A8A8A;
position: absolute;
right: 0;
bottom: 0;
margin: 5px;
display: none;
}
.close-icon::before,
.close-icon::after {
content: '';
position: absolute;
width: 50%;
height: 2px;
background: white;
top: 0;
left: 0;
right: 0;
margin: auto;
bottom: 0;
}
.close-icon::after {
transform: rotate(45deg);
}
.close-icon::before {
transform: rotate(-45deg);
}
document.querySelector(".queryBar").addEventListener("click", function () {
document.querySelector("#code").focus();
document.querySelector(".tip").style.transform = "translateY(-59%)"
});
document.querySelector("#code").addEventListener("blur", function () {
if (this.value) return;
document.querySelector(".tip").style.transform = "translateY(-0%)"
})
document.querySelector(".close-icon").addEventListener("click", function (e) {
e.stopPropagation();
document.querySelector("#code").value = "";
this.style.display = "none";
document.querySelector(".result-des").style.display = "none";
document.querySelector(".tip").style.transform = "translateY(-0%)"
})
document.querySelector("#code").addEventListener("keyup", function () {
document.querySelector(".close-icon").style.display = "block";
this.value ? '' : document.querySelector(".close-icon").style.display = "none"
})
var code = GetQueryString("fwcode");
if (code) {
document.querySelector("#code").value = code;
document.querySelector(".close-icon").style.display = "block";
document.querySelector(".tip").style.transform = "translateY(-59%)";
}
function submit() {
let newCode = document.querySelector("#code").value;
qima(newCode);
}
//启码
function qima(newCode) {
if (newCode == '') {
alert('Please enter the security code');
return;
}
document.querySelector(".result-des").innerHTML = "";
document.querySelector(".loadding").style.display = "flex";
document.querySelector(".submit_btn").setAttribute("disabled", "disabled");
document.querySelector(".btn-text").style.display = "none";
var xhr = new XMLHttpRequest();
xhr.open('post', 'https://fw.qima315.com/api/CodeQuery');
xhr.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
xhr.send('custno=XSHC169050&fwcode=' + newCode + '&lang=zh-en');
xhr.onreadystatechange = function () {
if (xhr.readyState == 4 && xhr.status == 200) {
var object = JSON.parse(xhr.responseText);
console.log(JSON.parse(xhr.responseText));
document.querySelector(".loadding").style.display = "none";
document.querySelector(".btn-text").style.display = "block";
document.querySelector(".submit_btn").removeAttribute("disabled");
document.querySelector(".result-des").style.display = "block";
if (object.data.State == 1 || object.data.State == 3) {
document.querySelector(".result-des").style.color = "green";
document.querySelector(".result-des").innerHTML = `您所查询的防伪码为莽牛模型正品产品,请放心使用!`
} else if (object.data.State == 2) {
document.querySelector(".result-des").innerHTML = `此防伪码已被查询过${object.data.Times-1}次,查询时间:${object.data.FirstDate},请确认为本人操作,谨防假冒!`
document.querySelector(".result-des").style.color = "purple";
} else {
document.querySelector(".result-des").innerHTML = object.data.QueryContent;
document.querySelector(".result-des").style.color = "red";
}
}
};
}
function GetQueryString(name) {
var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)", "i");
var r = window.location.search.substr(1).match(reg);
if (r != null) return decodeURI(r[2]);
return null;
}
刮开标签图层,在下方输入防伪码
输入您的防伪码