320 lines
9.3 KiB
JavaScript
320 lines
9.3 KiB
JavaScript
|
// 节流函数
|
|||
|
|
function throttle(handle, wait) {
|
|||
|
|
let lastTime = 0;
|
|||
|
|
return function (e) {
|
|||
|
|
let nowTime = new Date().getTime()
|
|||
|
|
if (nowTime - lastTime > wait) {
|
|||
|
|
handle();
|
|||
|
|
lastTime = nowTime;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
/* ................... 防抖函数 ................... */
|
|||
|
|
function debounce(func, delay) {
|
|||
|
|
let timeout
|
|||
|
|
return function () {
|
|||
|
|
clearTimeout(timeout) // 如果持续触发，那么就清除定时器，定时器的回调就不会执行。
|
|||
|
|
timeout = setTimeout(() => {
|
|||
|
|
func.apply(this, arguments)
|
|||
|
|
}, delay)
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
/* .................. 获取链接参数 .................. */
|
|||
|
|
function getUrlData(name) {
|
|||
|
|
var query = window.location.search.substring(1);
|
|||
|
|
var vars = query.split("&");
|
|||
|
|
for (var i = 0; i < vars.length; i++) {
|
|||
|
|
var pair = vars[i].split("=");
|
|||
|
|
if (pair[0] == name) {
|
|||
|
|
return decodeURI(pair[1]);
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
return (false);
|
|||
|
|
}
|
|||
|
|
var channel = "PC端";
|
|||
|
|
if (window.navigator && (/Mobile|Android|webOS|iPhone|iPad|Phone/i.test(navigator.userAgent))) {
|
|||
|
|
channel = "移动端";
|
|||
|
|
}
|
|||
|
|
// 按钮位置和当前链接
|
|||
|
|
var btnPosition = "价格页面按钮";
|
|||
|
|
var curLink = sessionStorage.getItem("currentLink") || tool.getCookie("currentLink");
|
|||
|
|
if (curLink == "") {
|
|||
|
|
curLink = link;
|
|||
|
|
}
|
|||
|
|
console.log("按钮位置+当前链接---" + btnPosition + "---" + curLink);
|
|||
|
|
console.log("🚀 sourceUrl---", sourceUrl)
|
|||
|
|
var vm = new Vue({
|
|||
|
|
el: "#app",
|
|||
|
|
data: {
|
|||
|
|
advanI: 1,
|
|||
|
|
problemI: 1,
|
|||
|
|
codeText: '获取验证码',
|
|||
|
|
count: 30,
|
|||
|
|
timer: null,
|
|||
|
|
tel: "",
|
|||
|
|
cityValue: "",
|
|||
|
|
city: "",
|
|||
|
|
com: "",
|
|||
|
|
typec: "价格页面",
|
|||
|
|
telCodeStatus: false,
|
|||
|
|
codeStatus: false,
|
|||
|
|
telTips: "",
|
|||
|
|
codeTips: "",
|
|||
|
|
comTips: "",
|
|||
|
|
cityTips: "",
|
|||
|
|
buttonAble: false,
|
|||
|
|
code: "",
|
|||
|
|
state: "0",
|
|||
|
|
options: provinceArr,
|
|||
|
|
selectedOptions: [],
|
|||
|
|
right: "",
|
|||
|
|
like: [true, true, true, true, true, true],
|
|||
|
|
dislike: [true, true, true, true, true, true],
|
|||
|
|
tabV: 1,
|
|||
|
|
priceDetailShowFlag: false,
|
|||
|
|
priceDetailCloseShowFlag: false,
|
|||
|
|
},
|
|||
|
|
mixins: [mixins],
|
|||
|
|
methods: {
|
|||
|
|
/* ------- 显示关闭价格详情关闭按钮 ------- */
|
|||
|
|
priceDetailCloseShow() {
|
|||
|
|
let _this = this;
|
|||
|
|
let priceDetail = document.querySelector(".price-detail-wrap");
|
|||
|
|
if (priceDetail.scrollTop > 300) {
|
|||
|
|
_this.priceDetailCloseShowFlag = true;
|
|||
|
|
} else {
|
|||
|
|
_this.priceDetailCloseShowFlag = false;
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
showPriceDetail() {
|
|||
|
|
this.priceDetailShowFlag = true;
|
|||
|
|
document.documentElement.style.overflowY = "hidden"
|
|||
|
|
},
|
|||
|
|
closePriceDetail() {
|
|||
|
|
this.priceDetailShowFlag = false;
|
|||
|
|
document.documentElement.style.overflowY = "auto"
|
|||
|
|
},
|
|||
|
|
problemLike(i) {
|
|||
|
|
this.$set(this.like, i, false);
|
|||
|
|
this.$set(this.dislike, i, true);
|
|||
|
|
},
|
|||
|
|
problemDislike(i) {
|
|||
|
|
this.$set(this.dislike, i, false);
|
|||
|
|
this.$set(this.like, i, true);
|
|||
|
|
},
|
|||
|
|
verifyTel: debounce(function () {
|
|||
|
|
var RegExp = /^1[3-9][0-9]{9}$/;
|
|||
|
|
if (vm.tel.trim() == "") {
|
|||
|
|
vm.telTips = "请输入您的手机号";
|
|||
|
|
vm.telCodeStatus = false;
|
|||
|
|
} else if (!RegExp.test(vm.tel.trim())) {
|
|||
|
|
vm.telTips = "请输入正确的手机号码";
|
|||
|
|
vm.telCodeStatus = false;
|
|||
|
|
} else {
|
|||
|
|
vm.telTips = "";
|
|||
|
|
vm.telCodeStatus = true;
|
|||
|
|
}
|
|||
|
|
}, 500),
|
|||
|
|
getCode: throttle(function () {
|
|||
|
|
btnPosition = "价格页面免费咨询按钮"
|
|||
|
|
var RegExp = /^1[3-9][0-9]{9}$/;
|
|||
|
|
if (vm.tel.trim() == "") {
|
|||
|
|
Swal.fire({
|
|||
|
|
title: '请输入您的手机号',
|
|||
|
|
showConfirmButton: false,
|
|||
|
|
timer: 1500
|
|||
|
|
})
|
|||
|
|
return false
|
|||
|
|
} else if (!RegExp.test(vm.tel.trim())) {
|
|||
|
|
Swal.fire({
|
|||
|
|
title: '请输入正确的手机号码',
|
|||
|
|
showConfirmButton: false,
|
|||
|
|
timer: 1500
|
|||
|
|
})
|
|||
|
|
} else {
|
|||
|
|
vm.tips = "";// 验证通过
|
|||
|
|
vm.timer = setInterval(() => {
|
|||
|
|
if (vm.count > 0 && vm.count <= 30) {
|
|||
|
|
vm.buttonAble = true
|
|||
|
|
vm.count--
|
|||
|
|
vm.codeText = vm.count + "秒后重新获取"
|
|||
|
|
} else {
|
|||
|
|
vm.buttonAble = false;
|
|||
|
|
vm.codeText = "获取验证码"
|
|||
|
|
clearInterval(vm.timer);
|
|||
|
|
vm.timer = null;
|
|||
|
|
vm.count = 30;
|
|||
|
|
}
|
|||
|
|
}, 1000);
|
|||
|
|
$.ajax({
|
|||
|
|
url: "/apply/apply-code.php",
|
|||
|
|
type: "post",
|
|||
|
|
data: {
|
|||
|
|
tel: vm.tel,
|
|||
|
|
btn: btnPosition,
|
|||
|
|
curLink: curLink,
|
|||
|
|
protype: vm.typec,
|
|||
|
|
sourceLink: sourceUrl,
|
|||
|
|
channel: channel
|
|||
|
|
},
|
|||
|
|
success: function (res) {
|
|||
|
|
if (res == "toomuch") {
|
|||
|
|
alert("请匆频繁提交!感谢您的理解和合作，可通过在线客服或电话与我们取得联系。")
|
|||
|
|
return
|
|||
|
|
}
|
|||
|
|
console.log("第一步推送成功!");
|
|||
|
|
}
|
|||
|
|
});
|
|||
|
|
vm.actionId = vm.tel + "-" + Math.floor(Math.random() * 1000000);
|
|||
|
|
$.ajax({
|
|||
|
|
url: "/api/sendMsg.php",
|
|||
|
|
type: 'POST',
|
|||
|
|
data: {
|
|||
|
|
telNum: vm.tel,
|
|||
|
|
actionId: vm.actionId,
|
|||
|
|
info: 'holly.400',
|
|||
|
|
time: new Date().getTime(),
|
|||
|
|
actionName: "呼叫中心站试用申请",
|
|||
|
|
verifyCode: ""
|
|||
|
|
},
|
|||
|
|
success: function (res) {
|
|||
|
|
if (res.state == "sent") {//发送验证码成功，并且成功写入数据库，返回sent
|
|||
|
|
return (vm.codeTips = "验证码已发送，请注意查收");
|
|||
|
|
} else {//其他不成功的情况
|
|||
|
|
return (vm.codeTips = "发送失败，请稍后再试");
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
});
|
|||
|
|
}
|
|||
|
|
}, 1500),
|
|||
|
|
verifyCode: debounce(function (event) {
|
|||
|
|
if (vm.tel == "") {
|
|||
|
|
vm.codeStatus = false;
|
|||
|
|
return (vm.telTips = "请输入手机号码");
|
|||
|
|
} else if (event.target.value == "") {
|
|||
|
|
vm.codeStatus = false;
|
|||
|
|
return (vm.codeTips = "请输入验证码");
|
|||
|
|
} else if (event.target.value.length != 4) {
|
|||
|
|
vm.codeStatus = false;
|
|||
|
|
return (vm.codeTips = "请输入正确的验证码");
|
|||
|
|
} else {
|
|||
|
|
vm.codeTips = ""
|
|||
|
|
}
|
|||
|
|
$.ajax({
|
|||
|
|
url: "/api/verifyMsg.php",
|
|||
|
|
type: 'post',
|
|||
|
|
data: {
|
|||
|
|
telNum: vm.tel,
|
|||
|
|
actionId: vm.actionId,
|
|||
|
|
actionName: "呼叫中心站试用申请",
|
|||
|
|
code: vm.code
|
|||
|
|
},
|
|||
|
|
success: function (res) {
|
|||
|
|
if (res.state == "vSucceed") {
|
|||
|
|
$("#tel").attr({ readonly: "readonly" });
|
|||
|
|
$("#getCode").attr({ disabled: "true" });
|
|||
|
|
vm.$data.right = true;
|
|||
|
|
vm.$data.codeTips = "验证码验证成功";
|
|||
|
|
setTimeout(() => {
|
|||
|
|
vm.$data.codeTips = "";
|
|||
|
|
vm.codeStatus = true;
|
|||
|
|
}, 500);
|
|||
|
|
} else if (res.state == "vFail") {
|
|||
|
|
event.target.focus();
|
|||
|
|
vm.$data.right = false;
|
|||
|
|
vm.codeStatus = false;
|
|||
|
|
return (vm.$data.codeTips = "验证码错误，请重试");
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
});
|
|||
|
|
}, 1500),
|
|||
|
|
verifyCom: debounce(function () {
|
|||
|
|
if (vm.com.trim() == "") {
|
|||
|
|
vm.comTips = "请输入您的公司名称";
|
|||
|
|
} else { vm.comTips = ""; }
|
|||
|
|
}, 1500),
|
|||
|
|
verifyCity: debounce(function () {
|
|||
|
|
if (vm.city.trim() == "") {
|
|||
|
|
vm.cityTips = "请输入您所在的城市";
|
|||
|
|
} else { vm.cityTips = ""; }
|
|||
|
|
}, 1500),
|
|||
|
|
handleChange() {
|
|||
|
|
for (let i = 0; i < this.selectedOptions.length; i++) {
|
|||
|
|
this.city = this.city + " " + CodeToText[this.selectedOptions[i]];
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
verify: function () {
|
|||
|
|
btnPosition = "价格页面免费咨询按钮"
|
|||
|
|
var mobilePattern = /^1[3-9][0-9]{9}$/;
|
|||
|
|
if (vm.tel.trim() == "") {
|
|||
|
|
Swal.fire({
|
|||
|
|
title: '请输入您的手机号',
|
|||
|
|
showConfirmButton: false,
|
|||
|
|
timer: 1500
|
|||
|
|
})
|
|||
|
|
return false;
|
|||
|
|
} else if (!mobilePattern.test(vm.tel.trim())) {
|
|||
|
|
Swal.fire({
|
|||
|
|
title: '请输入正确的手机号码',
|
|||
|
|
showConfirmButton: false,
|
|||
|
|
timer: 1500
|
|||
|
|
})
|
|||
|
|
return false;
|
|||
|
|
} else if (vm.code.trim() == "") {
|
|||
|
|
Swal.fire({
|
|||
|
|
title: '请输入验证码',
|
|||
|
|
showConfirmButton: false,
|
|||
|
|
timer: 1500
|
|||
|
|
})
|
|||
|
|
return false;
|
|||
|
|
} else if (vm.code.trim().length != 4) {
|
|||
|
|
Swal.fire({
|
|||
|
|
title: '请输入正确的验证码',
|
|||
|
|
showConfirmButton: false,
|
|||
|
|
timer: 1500
|
|||
|
|
})
|
|||
|
|
return false;
|
|||
|
|
} else if (!vm.right) {
|
|||
|
|
Swal.fire({
|
|||
|
|
title: '请输入正确的验证码',
|
|||
|
|
showConfirmButton: false,
|
|||
|
|
timer: 1500
|
|||
|
|
})
|
|||
|
|
return false;
|
|||
|
|
} else if (!this.city) {
|
|||
|
|
Swal.fire({
|
|||
|
|
type: 'error',
|
|||
|
|
height: "300",
|
|||
|
|
title: '请先选择地区',
|
|||
|
|
showConfirmButton: false,
|
|||
|
|
timer: 1500
|
|||
|
|
})
|
|||
|
|
vm.cityTips = "请输入您所在的城市";
|
|||
|
|
return false;
|
|||
|
|
}
|
|||
|
|
else {
|
|||
|
|
vm.tips = "";
|
|||
|
|
tool.setCookie("applyTel", vm.tel, 1);
|
|||
|
|
tool.setCookie("applyCom", vm.com, 1);
|
|||
|
|
tool.setCookie("applyCity", vm.city, 1);
|
|||
|
|
document.agent.submit();
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
});
|
|||
|
|
if (screen.availWidth !== 1280 && window.devicePixelRatio !== 1.5) {
|
|||
|
|
AOS.init({
|
|||
|
|
disable: "mobile",
|
|||
|
|
duration: 600,
|
|||
|
|
delay: 50,
|
|||
|
|
easing: 'ease-in-out'
|
|||
|
|
})
|
|||
|
|
} else {
|
|||
|
|
AOS.init({
|
|||
|
|
disable: true,
|
|||
|
|
duration: 600,
|
|||
|
|
delay: 50,
|
|||
|
|
easing: 'ease-in-out'
|
|||
|
|
})
|
|||
|
|
}
|