链接地址：http://appcrm.autosuzhou.com/addon/luck/wap/scrape?activity_id=341&themecolor=185ac9&from=timeline
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no" />
<meta name="format-detection" content="telephone=no" />
<title>开心刮刮乐</title>
<script>
(function(doc, win) {
var docEl = doc.documentElement,
resizeEvt = 'orientationchange' in window ? 'orientationchange' : 'resize',
recalc = function() {
var clientWidth = docEl.clientWidth;
if (!clientWidth) return;
if (clientWidth > 600) {
docEl.style.fontSize = 12 + 'px';
} else {
docEl.style.fontSize = 10 * (clientWidth / 320) + 'px';
}
};
// Abort if browser does not support addEventListener
if (!doc.addEventListener) return;
win.addEventListener(resizeEvt, recalc, false);
doc.addEventListener('DOMContentLoaded', recalc, false);
})(document, window);
</script>
<link rel="stylesheet" href="[/public/addon/luck/css/component.css](http://appcrm.autosuzhou.com/public/addon/luck/css/component.css)">
<link rel="stylesheet" href="[/public/addon/luck/css/mobile.css](http://appcrm.autosuzhou.com/public/addon/luck/css/mobile.css)">
<style>
.wrapper img {
max-width: 100%;
}
.plugin_demo {
height: 28px;
width: 100%;
padding: 5px 5px;
box-sizing: border-box;
background: rgba(34, 41, 44, .6);
position: fixed;
top: 0;
left: 0;
z-index: 9999999;
text-align: center;
}
.plugin_demo span strong {
height: 16px;
font: 12px '微软雅黑';
color: #fff;
margin-right: 10px;
}
.g-operate-btn {
display: block;
width: 13.4rem;
height: 4.2rem;
line-height: 4.2rem;
margin: 15px auto 0;
background-image: url(/public/addon/luck/imgs/btn_share.png);
background-position: center;
background-size: 100%;
background-color: #64C7DF;
border-radius: 16px;
text-align: center;
color: #fff;
font-size: 1.5rem;
}
[v-cloak] {
display: none;
}
</style>
</head>
<body>
<div class="mw" id="mw" v-cloak>
<div class='plugin_demo' v-if="_config.subtitle">
<span>
<strong>{{_config.subtitle}}</strong>
</span>
</div>
<a class="g-banner" :href="_config.banner_jump" v-if="_config.banner_image">
<img :src="_config.banner_image" class="banner" style="height: auto;">
</a>
<div class="scratch">
<div class="scratch-area">
<img :src="_config.scrape_cover" class="hidden-bg" id="hidden-top">
<div class="scratch-result" style="display: block;" v-show="isWinning==1">
<img :src="prize.pic" class="prize">
<p class="prize-name">{{prize.name}}</p>
<a @click="playAgain" class="btn">再来一次</a>
</div>
<div class="scratch-result" style="display: block;" v-show="isWinning==2">
<img :src="_config.miss_image" class="prize">
<p class="prize-name">{{_config.miss_message}}</p>
<a @click="playAgain" class="btn">再来一次</a>
</div>
</div>
<p class="g-count">
您今天还有<span class="count theme-font-color">{{ userCanPlay }}</span>次刮奖机会
<a href="[giftList?id=341](http://appcrm.autosuzhou.com/addon/luck/wap/giftList?id=341)"><img :src="_config.recod_image"
alt="" class="icon-count-gift"></a>
</p>
</div>
<span class="g-operate-btn theme-bg-color" @click="clientOpenTest" v-if="!isMagApp">打开客户端参与</span>
<span class="g-operate-btn theme-bg-color" @click="magShare" v-if="isMagApp">分享给好友</span>
<span class="g-operate-btn theme-bg-color" @click="showBuyDialog" v-if="isMagApp">获取更多机会</span>
<!--<div class="scroll-lists">-->
<!--<ul class="user-prize-lists">-->
<!---->
<!--</ul>-->
<!--</div>-->
<div class="plugin-desc">
<div class="wrapper">
<h1 style="white-space: normal; text-align: center;"><span style="font-size: 18px;"><strong>点击“获取更多机会”可以购买抽奖机会</strong></span></h1>
<h1 style="white-space: normal; text-align: center;"><span style="font-size: 20px;"><strong>分享给微信好友，同样也可以哦！</strong></span></h1>
<p style="white-space: normal; text-align: center;"><span style="overflow-wrap: break-word; font-weight: 700; font-size: 12px; font-family: "andale mono";"> 礼品需要上门自提，</span></p>
<p style="white-space: normal; text-align: center;"><span style="overflow-wrap: break-word; font-weight: 700; font-size: 12px; font-family: "andale mono";">现金红包请加微信号领取：18362648020（微信同号）
</span></p>
<p style="white-space: normal; text-align: center;"><span style="overflow-wrap: break-word; font-weight: 700; font-size: 12px; font-family: "andale mono";">兑换完成后30天内领取有效，过期视为自动放弃！</span></p>
<p style="white-space: normal; text-align: center;"><span style="overflow-wrap: break-word; font-weight: 700; font-size: 12px; font-family: "andale mono";"> 领取地址：</span><span
style="font-family: "andale mono"; font-size: 12px; font-weight: 700;">苏州车网 干将东路178号7号楼306室</span></p>
<p style="white-space: normal; text-align: center;"><span style="font-family: "andale mono"; font-size: 12px; font-weight: 700;">（苏大北校区
65120273)</span></p>
<p style="white-space: normal; text-align: center;"><span style="overflow-wrap: break-word; font-weight: 700; font-size: 12px; font-family: "andale mono";"> 苏州车网领取时间：</span><span
style="font-family: "andale mono"; font-size: 12px; font-weight: 700;">周一至周五 9点－－17点</span></p>
<p style="white-space: normal; text-align: center;"><span style="overflow-wrap: break-word; font-weight: 700; font-size: 12px; font-family: "andale mono";"> 联系人：小屈</span></p>
<p style="white-space: normal; text-align: center;"><span style="overflow-wrap: break-word; font-weight: 700; font-size: 12px; font-family: "andale mono";"> 可以代领，需要提供APP兑换二维码</span></p>
<p><br /></p>
</div>
</div>
<div class="pop-window" style="display: block" v-show="showDialog == 1" @click.stop="setIgnore">
<div class="play-again" v-show="buyLuckChance == 3" style="margin: 50% 50px; padding: 15px; border-radius: 6px; background-color: #fff; text-align: center;">
<img src="[/public/addon/luck/imgs/icon_play_again.png](http://appcrm.autosuzhou.com/public/addon/luck/imgs/icon_play_again.png)"
alt="" class="icon" style="display: block; width: 60%; margin: 0 auto;">
<p class="desc" style="margin: 10px 0 10px;">是否使用100{{_config.gold_name}}兑换1次抽奖机会</p>
<span class="btn theme-bg-color" @click="goldBuyChance" style="display: block; line-height: 44px; background-color: purple; border-radius: 6px; color: #fff;">立即兑换</span>
</div>
<div class="play-again" v-show="download == 1" @click.stop style="margin: 50% 50px; padding: 15px; border-radius: 6px; background-color: #fff; text-align: center;">
<img src="[/public/addon/luck/imgs/icon_play_again.png](http://appcrm.autosuzhou.com/public/addon/luck/imgs/icon_play_again.png)"
alt="" class="icon" style="display: block; width: 60%; margin: 0 auto;">
<p class="desc" style="margin: 10px 0 10px;">请使用苏州车网客户端参与活动中大奖</p>
<a @click="clientOpenTest"><span class="btn theme-bg-color" style="display: block; line-height: 44px; background-color: purple; border-radius: 6px; color: #fff;">立即打开</span></a>
</div>
<div class="play-again" v-show="shareFriend == 1" @click.stop style="margin: 50% 50px; padding: 15px; border-radius: 6px; background-color: #fff; text-align: center;">
<img src="[/public/addon/luck/imgs/icon_play_again.png](http://appcrm.autosuzhou.com/public/addon/luck/imgs/icon_play_again.png)"
alt="" class="icon" style="display: block; width: 60%; margin: 0 auto;">
<p class="desc" style="margin: 10px 0 10px;">抽奖机会已经消耗完，分享给好友奖励{{ shareGive }}次机会！</p>
<a @click="magShare"><span class="btn theme-bg-color" style="display: block; line-height: 44px; background-color: purple; border-radius: 6px; color: #fff;">分享给好友</span></a>
</div>
<div class="play-again" v-show="noMoreBuy == 1" @click.stop style="margin: 50% 50px; padding: 15px; border-radius: 6px; background-color: #fff; text-align: center;">
<img src="[/public/addon/luck/imgs/icon_play_again.png](http://appcrm.autosuzhou.com/public/addon/luck/imgs/icon_play_again.png)"
alt="" class="icon" style="display: block; width: 60%; margin: 0 auto;">
<p class="desc" style="margin: 10px 0 10px;">今天购买抽奖机会已经到达上限，请明天再来吧~</p>
<a @click="setIgnore"><span class="btn theme-bg-color" style="display: block; line-height: 44px; background-color: purple; border-radius: 6px; color: #fff;">谢谢参与，明日再来！</span></a>
</div>
<div class="play-again" v-show="noMoreShare == 1" @click.stop style="margin: 50% 50px; padding: 15px; border-radius: 6px; background-color: #fff; text-align: center;">
<img src="[/public/addon/luck/imgs/icon_play_again.png](http://appcrm.autosuzhou.com/public/addon/luck/imgs/icon_play_again.png)"
alt="" class="icon" style="display: block; width: 60%; margin: 0 auto;">
<p class="desc" style="margin: 10px 0 10px;">今天已经没有抽奖机会咯，请明天再来吧~</p>
<a @click="setIgnore"><span class="btn theme-bg-color" style="display: block; line-height: 44px; background-color: purple; border-radius: 6px; color: #fff;">谢谢参与，明日再来！</span></a>
</div>
</div>
<a :href="_config.bottom_jump" :style="'background-image:url('+ _config.bottom_image +');'" class="ad-box"></a>
</div>
<script src="[/public/addon/luck/js/jquery-2.2.3.min.js](http://appcrm.autosuzhou.com/public/addon/luck/js/jquery-2.2.3.min.js)"></script>
<script src="[/public/common/js/vue.min.js](http://appcrm.autosuzhou.com/public/common/js/vue.min.js)"></script>
<script src="[/public/addon/luck/js/jquery.eraser.js](http://appcrm.autosuzhou.com/public/addon/luck/js/jquery.eraser.js)"></script>
<script src="[/public/addon/luck/js/mobile.js](http://appcrm.autosuzhou.com/public/addon/luck/js/mobile.js)"></script>
<script src="[/public/common/js/layer_mobile/layer.js](http://appcrm.autosuzhou.com/public/common/js/layer_mobile/layer.js)"></script>
<script src='[http://app.lxh.magcloud.cc/public/static/dest/js/libs/magjs-x.js](http://app.lxh.magcloud.cc/public/static/dest/js/libs/magjs-x.js)'></script>
<script>
var isInMagapp = function() {
var ua = window.navigator.userAgent.toLowerCase();
return ua.indexOf("magappx") > -1;
};
var isInWeixin = function() {
var ua = window.navigator.userAgent.toLowerCase();
return ua.indexOf("micromessenger") > -1;
};
var getQueryString = function(name) {
var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)", "i");
var r = window.location.search.substr(1).match(reg);
if (r != null) {
return unescape(r[2]);
}
return null;
};
var _config = JSON.parse(JSON.stringify({
"gold_name": "论坛汽油",
"banner_image": "/mnt/webimg/suzhouchewang_142/8df72ddcf7f7312fe3ae4d211c342b07.png",
"background_image": "/mnt/webimg/suzhouchewang_142/5f7400a8dfc5930e7b6469bd7faeb4ba.png",
"miss_image": "/mnt/webimg/suzhouchewang_142/ef3cbd02332bc168cc627e3be7510fdd.png",
"scrape_cover": "/mnt/webimg/suzhouchewang_142/7f865fc7c244b85fab24d1bd588bfb0a.png",
"recod_image": "/mnt/webimg/suzhouchewang_142/f7bd5175f71241f82edc38e87fafb1fc.jpg",
"bottom_image": "",
"share_image": "/mnt/webimg/suzhouchewang_142/901c8ef76d9179d70f72af1df6270faf.jpg",
"button_color": "#000000",
"background_color": "#0054a7",
"miss_message": "花100汽油，再来一次吧！",
"subtitle": "开心刮刮乐",
"share_title": "我在参加开心刮刮乐赢50次地铁卡",
"share_desc": "己亥年50次地铁卡、现金红包、中国景点通等等"
}));
var _userinfo = JSON.parse(JSON.stringify({
"id": 101713,
"site_id": 142,
"activity_id": 341,
"user_id": 0,
"day_count": 1,
"buy_count": 0,
"buy_sum": 0,
"is_share": 0,
"last_time": 1560733034
}));
var _id = '341';
new Vue({
el: '#mw',
data: {
isMagApp: isInMagapp(),
download: 0,
showDialog: 0,
isWinning: 0,
userCanPlay: 0,
shareFriend: 0,
noMoreBuy: 0,
noMoreShare: 0,
buyLuckChance: 0,
prize: [],
gift_type: 0,
isShare: _userinfo.is_share,
shareGive: parseInt('1')
},
mounted: function() {
this.userCanPlay = '1'; //用户可以抽奖次数
$('.scratch').css('background-image', "url(" + _config.background_image + ")");
$('body').css('background-color', _config.background_color);
$('.theme-bg-color').css('background-color', _config.button_color);
if (getQueryString('magshareredirect') == 1) {
window.location.href = 'http://app4.szcw.cn';
}
mag.ready(function() {
mag.showMore();
mag.setData({
shareData: {
title: _config.share_title,
des: _config.share_desc,
picurl: window.location.origin + _config.share_image,
linkurl: window.location.href
}
});
});
var self = this;
setTimeout(function() {
$('#hidden-top').eraser({
completeRatio: .6,
completeFunction: function() {
//不在客户端内
if (!self.isMagApp) {
self.showDialog = 1;
self.download = 1;
$("#hidden-top").eraser('reset');
return false;
}
//用户未登录
if (!_userinfo.user_id) {
mag.toLogin(function(res) {
$.getJSON("/cloud/mag/auth/appLogin", {
token: res.token
}, function() {
_userinfo.user_id = true;
mag.toast('登录成功');
});
});
$("#hidden-top").eraser('reset');
return false;
}
//用户没有抽奖次数了
if (self.userCanPlay <= 0) {
$("#hidden-top").eraser('reset');
if (self.shareGive > 0 && self.isShare == 0) {
self.showDialog = 1;
self.shareFriend = 1;
return false;
} else {
self.showDialog = 1;
self.noMoreShare = 1;
return false;
}
}
//提交数据
var layerIndex = layer.open({
type: 2,
shadeClose: false
});
$.post('/addon/luck/wap/luckTake', {
activity_id: _id
}, function(response) {
layer.close(layerIndex);
if (response.success) {
self.userCanPlay--;
if (response.data) {
self.prize = response.data;
self.gift_type = response.data.prize_type;
self.setIgnore();
self.isWinning = 1;
$(".scratch-result").addClass('open');
} else {
self.isWinning = 2;
$(".scratch-result").addClass('open');
}
} else {
mag.toast(response.msg);
}
})
}
});
}, 500);
},
methods: {
playAgain: function() {
$(".scratch-result").removeClass('open');
$("#hidden-top").eraser('reset');
},
setIgnore: function() {
this.showDialog = 0;
this.download = 0;
this.buyLuckChance = 0;
this.isWinning = 0;
this.noMoreShare = 0;
this.noMoreBuy = 0;
this.shareFriend = 0;
this.buyLuckChance = 0;
},
magShare: function() {
var self = this;
this.setIgnore();
mag.share('ALL', function() {
$.get('/addon/luck/wap/shareSuccess', {
activity_id: _id
}, function(res) {
if (res.success) {
self.isShare = true;
//self.userCanPlay += self.shareGive;
self.userCanPlay = parseInt(self.userCanPlay) + parseInt(self.shareGive);
$(".scratch-result").removeClass('open');
$("#hidden-top").eraser('reset');
}
mag.toast(res.msg);
});
});
},
cashBuyChance: function() {
var self = this;
var layerIndex = layer.open({
type: 2,
shadeClose: false
});
$.post('/addon/luck/wap/cashBuyChance', {
activity_id: _id
}, function(res) {
layer.close(layerIndex);
if (res.success) {
var params = {
money: res.data.amount,
title: res.data.title,
des: res.data.des,
payWay: {
wallet: 1,
weixin: 1,
alipay: 1
},
orderNum: res.data.trade_no,
unionOrderNum: res.data.unionOrderNum,
type: '购买抽奖机会'
};
mag.pay(params, function() {
$.post('/addon/luck/wap/checkOrder', {
unionOrderNum: res.data.unionOrderNum
}, function(rs) {
if (rs.success) {
self.userCanPlay++;
mag.toast('购买成功，快去抽取大奖吧');
return false;
}
mag.toast('购买失败,请联系管理员');
})
}, function() {
mag.toast('购买失败，请稍后再试');
});
} else {
mag.toast(res.msg);
}
});
},
goldBuyChance: function() {
var self = this;
var layerIndex = layer.open({
type: 2,
shadeClose: false
});
$.post('/addon/luck/wap/goldBuyChance', {
activity_id: _id
}, function(rs) {
layer.close(layerIndex);
if (rs.success) {
if (rs.data.change_ok) {
self.userCanPlay++;
mag.toast('兑换成功，快去抽取大奖吧');
} else {
layer.open({
content: _config.gold_name + '不足，先去赚点' + _config.gold_name + '吧',
btn: ['好的', '取消'],
yes: function(index) {
layer.close(index);
mag.newWin('http://app4.szcw.cn/mag/user/v1/user/task');
}
});
}
} else {
mag.toast(rs.msg);
}
});
},
showBuyDialog: function() {
if (!_userinfo.user_id) {
mag.toLogin(function(res) {
$.getJSON("/cloud/mag/auth/appLogin", {
token: res.token
}, function() {
_userinfo.user_id = true;
mag.toast('登录成功');
});
});
} else {
this.isWinning = 0;
this.showDialog = 1;
this.download = 0;
this.buyLuckChance = 3;
}
},
clientOpenTest: function() {
var $app_site_base = 'http://app4.szcw.cn';
var layerIndex = layer.open({
type: 2,
content: '正在打开客户端，请稍后...'
});
var encodeUrl = encodeURIComponent(window.location.href);
var $app_site_name = 'szcw';
if (isInWeixin()) {
window.location.href = "https://api.magcloud.cc/magshare/" + $app_site_name + "?jump_url=" + encodeUrl +
"&content_url=" + encodeUrl;
} else {
window.location.href = $app_site_name + '://pagejump?jump_url=' + encodeUrl;
}
setTimeout(function() {
layer.close(layerIndex);
var $app_download_url = '';
window.location.href = $app_download_url ? $app_download_url : $app_site_base;
}, 2000);
}
}
})
</script>
</body>
</html>
网友评论