378 lines
14 KiB
JavaScript
378 lines
14 KiB
JavaScript
|
jQuery(function ($) {
|
|||
|
// 轮播
|
|||
|
if ($('.banner-swiper').length) {
|
|||
|
var bannerSwiper = new Swiper('.banner-swiper', {
|
|||
|
loop: true,//开启循环播放
|
|||
|
autoplay: {//开启自动播放
|
|||
|
delay: 3000,
|
|||
|
disableOnInteraction: false,//触摸后不会停止自动滚动
|
|||
|
pauseOnMouseEnter: true,//鼠标置于swiper时暂停自动切换,鼠标离开时恢复自动切换。
|
|||
|
}
|
|||
|
})
|
|||
|
}
|
|||
|
|
|||
|
// 抽奖
|
|||
|
var turntableFlag = true;
|
|||
|
if ($('.pointer').length) {
|
|||
|
// 开始抽奖
|
|||
|
$('body').on('click', '.pointer', function () {
|
|||
|
if (turntableFlag) {
|
|||
|
turntableFlag = false;
|
|||
|
if ($('.pointer').hasClass('pointer-handle')) {
|
|||
|
return false;
|
|||
|
}
|
|||
|
|
|||
|
$('.pointer').addClass('pointer-handle');
|
|||
|
$.post('/coupon/getResult', function (res) {
|
|||
|
if (res.code === 0) {
|
|||
|
let couponPosition = 0;
|
|||
|
let btnMsg = res.data.position === 0 ? '关闭' : '收入卡包';
|
|||
|
let notice = res.data.msg;
|
|||
|
switch (res.data.position) {
|
|||
|
case 0:
|
|||
|
couponPosition = 360 * 4 - 120;
|
|||
|
break;
|
|||
|
case 1:
|
|||
|
couponPosition = 360 * 4 - 60;
|
|||
|
break;
|
|||
|
case 2:
|
|||
|
couponPosition = 360 * 4 - 180;
|
|||
|
break;
|
|||
|
case 3:
|
|||
|
couponPosition = 360 * 4 - 240;
|
|||
|
break;
|
|||
|
case 4:
|
|||
|
couponPosition = 360 * 4 - 300;
|
|||
|
break;
|
|||
|
case 5:
|
|||
|
couponPosition = 360 * 4;
|
|||
|
break;
|
|||
|
}
|
|||
|
|
|||
|
$('.turntable').css({transition: 'all 3s'});
|
|||
|
$('.turntable').css({transform: 'rotate(' + couponPosition + 'deg)'});
|
|||
|
$('.tips-btn').text(btnMsg);
|
|||
|
$('.tips-msg').text(notice);
|
|||
|
|
|||
|
setTimeout(function () {
|
|||
|
showMsg();
|
|||
|
}, 3000)
|
|||
|
} else if (res.code === 6001) {
|
|||
|
window.location.href = '/login/index';
|
|||
|
} else {
|
|||
|
if (res.code === 4028) {
|
|||
|
turntableFlag = true;
|
|||
|
} else {
|
|||
|
$('.tips-btn').text('关闭');
|
|||
|
showMsg(res.msg);
|
|||
|
}
|
|||
|
}
|
|||
|
// console.log(res, '结果');
|
|||
|
// $('.pointer').removeClass('pointer-handle');
|
|||
|
});
|
|||
|
setTimeout(function () {
|
|||
|
$('.pointer').removeClass('pointer-handle');
|
|||
|
turntableFlag = true;
|
|||
|
}, 3000)
|
|||
|
}
|
|||
|
});
|
|||
|
// 关闭弹窗
|
|||
|
$('.tips-btn-game').click(function () {
|
|||
|
$('.turntable').css({transition: 'all 0s'});
|
|||
|
$('.turntable').css({transform: 'rotate(0)'});
|
|||
|
closeMsg();
|
|||
|
turntableFlag = true;
|
|||
|
});
|
|||
|
}
|
|||
|
|
|||
|
function showMsg(msg = '') {
|
|||
|
if (msg !== '') {
|
|||
|
$('.tips-msg').text(msg);
|
|||
|
}
|
|||
|
$('.pull-bg').addClass('show');
|
|||
|
$('.result-tips').addClass('show');
|
|||
|
}
|
|||
|
|
|||
|
function closeMsg() {
|
|||
|
$('.pull-bg').removeClass('show');
|
|||
|
$('.result-tips').removeClass('show');
|
|||
|
}
|
|||
|
|
|||
|
$('.tips-btn').click(function () {
|
|||
|
closeMsg();
|
|||
|
});
|
|||
|
|
|||
|
let lon = '';
|
|||
|
let lat = '';
|
|||
|
let addr = '';
|
|||
|
// 打开导航弹窗
|
|||
|
if($('.navigation-btn').length){
|
|||
|
//打开弹窗
|
|||
|
$('body').on('click','.navigation-btn',function(){
|
|||
|
// debugger;
|
|||
|
lon = $(this).data('lon');
|
|||
|
lat = $(this).data('lat');
|
|||
|
addr = $(this).data('addr');
|
|||
|
console.log(lon,'lon')
|
|||
|
console.log(lat,'lat')
|
|||
|
console.log(addr,'addr')
|
|||
|
$('.pull-bg').addClass('show');
|
|||
|
$('.navigation-box').addClass('show');
|
|||
|
});
|
|||
|
}
|
|||
|
|
|||
|
// 开始导航
|
|||
|
if($('.navigation-box').length){
|
|||
|
// console.log(`https://apis.map.qq.com/uri/v1/marker?marker=coord:${lat},${lon};addr:${addr};&referer=webtest`, '腾讯地图');
|
|||
|
// console.log(`http://api.map.baidu.com/marker?location=${lat},${lon}&title=${addr}&output=html`, '百度地图');
|
|||
|
// console.log(`https://uri.amap.com/marker?position=${lon},${lat}&name=${addr}`, '高德地图');
|
|||
|
// 腾讯地图
|
|||
|
$('.tx-navigation').click(function(){ // (lng,lat)
|
|||
|
window.open(`https://apis.map.qq.com/uri/v1/marker?marker=coord:${lat},${lon};addr:${addr};&referer=webtest`)
|
|||
|
});
|
|||
|
// 百度地图
|
|||
|
$('.bd-navigation').click(function(){ // (lng,lat)
|
|||
|
window.open(`http://api.map.baidu.com/marker?location=${lat},${lon}&title=${addr}&output=html`)
|
|||
|
});
|
|||
|
// 高德地图
|
|||
|
$('.gd-navigation').click(function(){ // (lat,lng)
|
|||
|
window.open(`https://uri.amap.com/marker?position=${lon},${lat}&name=${addr}`)
|
|||
|
});
|
|||
|
}
|
|||
|
// 关闭导航弹窗
|
|||
|
if($('.pull-bg-navigation,.pull-bg').length){
|
|||
|
$('.pull-bg-navigation,.pull-bg').click(function(){
|
|||
|
$('.pull-bg').removeClass('show');
|
|||
|
$('.navigation-box').removeClass('show');
|
|||
|
});
|
|||
|
}
|
|||
|
|
|||
|
// 领券
|
|||
|
if ($('.card-btn').length) {
|
|||
|
// 打开弹窗
|
|||
|
$('body').on('click', '.card-btn',function () {
|
|||
|
$('.pull-bg').addClass('show');
|
|||
|
$('.collect-coupons').addClass('show');
|
|||
|
});
|
|||
|
// 关闭弹窗
|
|||
|
$('.pull-bg, .code-btn').click(function () {
|
|||
|
$('.pull-bg').removeClass('show');
|
|||
|
$('.collect-coupons').removeClass('show');
|
|||
|
});
|
|||
|
}
|
|||
|
|
|||
|
// 使用卡券
|
|||
|
if ($('.use-btn').length) {
|
|||
|
// 打开弹窗
|
|||
|
$('body').on('click', '.use-btn',function () {
|
|||
|
$('.pull-bg').addClass('show');
|
|||
|
$('.card-window').addClass('show');
|
|||
|
});
|
|||
|
// 关闭弹窗
|
|||
|
$('.pull-bg, .code-btn').click(function () {
|
|||
|
$('.pull-bg').removeClass('show');
|
|||
|
$('.card-window').removeClass('show');
|
|||
|
});
|
|||
|
}
|
|||
|
|
|||
|
// 复制完整券码
|
|||
|
if ($('.copy-btn').length) {
|
|||
|
$('body').on('click','.copy-btn',function () {
|
|||
|
var copyText = $(this).find('em').text(); //获取对象
|
|||
|
var oInput = document.createElement('input');//创建一个input标签
|
|||
|
oInput.value = copyText;//设置value属性
|
|||
|
document.body.appendChild(oInput);//挂载到body下面
|
|||
|
oInput.select(); // 选择对象
|
|||
|
document.execCommand("Copy"); // 执行浏览器复制命令
|
|||
|
oInput.className = 'oInput';
|
|||
|
oInput.style.display = 'none';
|
|||
|
$('.pull-bg').addClass('show');
|
|||
|
$('.copy-tips').addClass('show');
|
|||
|
setTimeout(function () {
|
|||
|
$('.pull-bg').removeClass('show');
|
|||
|
$('.copy-tips').removeClass('show');
|
|||
|
}, 1000)
|
|||
|
})
|
|||
|
}
|
|||
|
|
|||
|
// 入口判断
|
|||
|
if ($('.game-entry').length) {
|
|||
|
function checkTime(t) {
|
|||
|
return t >= 10 ? t : "0" + t;
|
|||
|
}
|
|||
|
|
|||
|
$('.game-entry').click(function () {
|
|||
|
let t = $(this).data('time');
|
|||
|
let now = new Date();
|
|||
|
let nowTime = checkTime(now.getHours()) + ':' + checkTime(now.getMinutes());
|
|||
|
|
|||
|
// console.log(t, '活动时间')
|
|||
|
// console.log(nowTime, '当前时间')
|
|||
|
|
|||
|
if (nowTime < t) {
|
|||
|
showMsg('活动还未开始');
|
|||
|
return false;
|
|||
|
}
|
|||
|
})
|
|||
|
}
|
|||
|
|
|||
|
// 定义state
|
|||
|
var state = true;
|
|||
|
var page = 2;
|
|||
|
|
|||
|
// 查询数据
|
|||
|
function getData(url){
|
|||
|
let keyword = $('.search-keyword').val();
|
|||
|
let areaId = $('.search-area').val();
|
|||
|
areaId = areaId ? areaId : 0;
|
|||
|
console.log(areaId,'sss');
|
|||
|
$.get('/coupon/businessList.html?area_id='+areaId+'&page='+page+'&keyword='+keyword, function (res) {
|
|||
|
if (res.code !== 0) {
|
|||
|
showMsg(res.mag);
|
|||
|
return false;
|
|||
|
}
|
|||
|
state = true;
|
|||
|
let html = ``;
|
|||
|
if (res.data.list.length > 0) {
|
|||
|
res.data.list.forEach(function (item, index) {
|
|||
|
html += `
|
|||
|
<div class="item radius50 border-box flex">
|
|||
|
<div class="img radius40">
|
|||
|
<a href="/coupon/businessInfo.html?id=${item.id}"><img src="${item.cover}" alt="${item.name}"></a>
|
|||
|
</div>
|
|||
|
<div class="txt">
|
|||
|
<a href="/coupon/businessInfo.html?id=${item.id}">
|
|||
|
<h2 class="font30 clips1">${item.name}</h2>
|
|||
|
<p class="font24 color-86 clips2">${item.address}</p>
|
|||
|
</a>
|
|||
|
<div class="navigation-btn font24 color-ff background-f35 radius25 flex" data-lon="${item.lon}" data-lat="${item.lat}" data-addr="${item.name}">立即导航</div>
|
|||
|
</div>
|
|||
|
</div>
|
|||
|
`;
|
|||
|
});
|
|||
|
|
|||
|
if (page === 1) {
|
|||
|
$('.business-list').html(html);
|
|||
|
} else {
|
|||
|
$('.business-list').append(html);
|
|||
|
}
|
|||
|
page++;
|
|||
|
} else {
|
|||
|
state = false;
|
|||
|
if (page === 1) {
|
|||
|
$('.business-list').html(html);
|
|||
|
} else {
|
|||
|
$('.business-list').append(html);
|
|||
|
}
|
|||
|
$('.bottom-msg').css('display', 'block');
|
|||
|
setTimeout(function () {
|
|||
|
$('.bottom-msg').css('display', 'none');
|
|||
|
},1500)
|
|||
|
}
|
|||
|
|
|||
|
})
|
|||
|
}
|
|||
|
|
|||
|
// 触底
|
|||
|
if($('.business-body').length){
|
|||
|
$(window).scroll(function () {
|
|||
|
var scrollTop = $(window).scrollTop();
|
|||
|
var windowHeight = $(window).height();
|
|||
|
var scrollHeight = $(document).height()-50;
|
|||
|
// console.log(scrollTop + windowHeight,scrollHeight);
|
|||
|
if (scrollTop + windowHeight > scrollHeight) {
|
|||
|
if(state){
|
|||
|
//此处是滚动条到底部时候触发的事件,在这里写要加载的数据,或者是拉动滚动条的操作
|
|||
|
// console.log("到底了,发起请求");
|
|||
|
state = false;
|
|||
|
getData();
|
|||
|
}
|
|||
|
}
|
|||
|
});
|
|||
|
|
|||
|
// 点击搜索
|
|||
|
$('.business-search').click(function () {
|
|||
|
// 获取数据
|
|||
|
page = 1;
|
|||
|
getData();
|
|||
|
return false;
|
|||
|
});
|
|||
|
|
|||
|
// 表单搜索
|
|||
|
$('.search-form').on('submit',function(){
|
|||
|
// 获取数据
|
|||
|
page = 1;
|
|||
|
getData();
|
|||
|
return false;
|
|||
|
})
|
|||
|
}
|
|||
|
|
|||
|
if($('.bind-btn').length){
|
|||
|
$('.bind-btn').click(function () {
|
|||
|
$.post('/login/bind', {phone: $('#bind-phone').val()}, function (res) {
|
|||
|
if (res.code !== 0) {
|
|||
|
showMsg(res.msg)
|
|||
|
return false;
|
|||
|
}
|
|||
|
|
|||
|
window.location.href=res.data.url;
|
|||
|
})
|
|||
|
})
|
|||
|
}
|
|||
|
|
|||
|
// 图片上传
|
|||
|
if($('.file-input').length){
|
|||
|
$('.file-input').on('change', function(e) {
|
|||
|
var imgFile = []; //文件流
|
|||
|
var imgSrc = []; //图片路径
|
|||
|
var imgName = []; //图片名字
|
|||
|
var imgSize = this.files[0].size;
|
|||
|
if (imgSize > 1024 * 1024 * 1) { //1M
|
|||
|
return alert("上传图片不能超过1M");
|
|||
|
};
|
|||
|
if (this.files[0].type != 'image/png' && this.files[0].type != 'image/jpeg' && this.files[0].type != 'image/gif') {
|
|||
|
return alert("图片上传格式不正确");
|
|||
|
}
|
|||
|
var imgBox = $(this).parents(".img");;
|
|||
|
var fileList = this.files;
|
|||
|
for (var i = 0; i < fileList.length; i++) {
|
|||
|
if(imgSrc.length < 1) { //判断多图上传只显示前几个,直到一共四个图片
|
|||
|
var imgSrcI = getObjectURL(fileList[i]);
|
|||
|
imgName.push(fileList[i].name);
|
|||
|
imgSrc.push(imgSrcI);
|
|||
|
imgFile.push(fileList[i]);
|
|||
|
if (imgFile.length > 1) { //显示上传按钮
|
|||
|
$('.content-img .file').hide();
|
|||
|
}
|
|||
|
}
|
|||
|
}
|
|||
|
// 动态添加html元素
|
|||
|
addNewContent(imgBox,imgSrc);
|
|||
|
this.value = null; //允许上传相同图片
|
|||
|
});
|
|||
|
|
|||
|
// 图片展示
|
|||
|
function addNewContent(imgBox,imgSrc) {
|
|||
|
if(imgBox.find('.upload-img').length){
|
|||
|
imgBox.find('.upload-img').remove();
|
|||
|
}
|
|||
|
for (var a = 0; a < imgSrc.length; a++) {
|
|||
|
var picHtml = '<div class="upload-img radius20 border-box"><img src="' + imgSrc[a] + '" alt=""></div>';
|
|||
|
$(imgBox).prepend(picHtml);
|
|||
|
}
|
|||
|
}
|
|||
|
|
|||
|
// 建立可存取到file的url
|
|||
|
function getObjectURL(file) {
|
|||
|
var url = null;
|
|||
|
if (window.createObjectURL != undefined) { // basic
|
|||
|
url = window.createObjectURL(file);
|
|||
|
} else if (window.URL != undefined) { // mozilla(firefox)
|
|||
|
url = window.URL.createObjectURL(file);
|
|||
|
} else if (window.webkitURL != undefined) { // webkit or chrome
|
|||
|
url = window.webkitURL.createObjectURL(file);
|
|||
|
}
|
|||
|
return url;
|
|||
|
}
|
|||
|
}
|
|||
|
})
|