Authored by 张丽霞

分享模板

'use strict';
exports.index = (req, res) => {
// res.render('coupon', {aa: 1});
res.render('coupon', {
module: 'coupon',
page: 'index',
devEnv: true
});
};
... ...
/**
* sub app coupon
* @author: lixia.zhang<lixia.zhang@yoho.cn>
* @date: 2016/05/31
*/
var express = require('express'),
path = require('path'),
hbs = require('express-handlebars');
var app = express();
// set view engin
var doraemon = path.join(__dirname, '../../doraemon/views'); // parent view root
app.set('views', path.join(__dirname, 'views/action'));
app.engine('.hbs', hbs({
extname: '.hbs',
defaultLayout: 'layout',
layoutsDir: doraemon,
partialsDir: ['./views/partial', `${doraemon}/partial`],
helpers: 'helpers'
}));
// router
app.use(require('./router'));
module.exports = app;
... ...
/**
* router of sub app coupon
* @author: lixia.zhang<lixia.zhang@yoho.cn>
* @date: 2016/05/31
*/
'use strict';
const router = require('express').Router();
const cRoot = './controllers';
const coupon = require(`${cRoot}/coupon`);
// routers
router.get('/index', coupon.index);
module.exports = router;
... ...
<div class="receive-coupon-page">
<div class="page">
<div class="coupon-header">
</div>
<div class="coupon-centent">
<div class="title">
</div>
<div class="input-content">
<input id="phone" type="text" placeholder="请输入手机号" maxlength="11"/>
<div>获取红包</div>
</div>
<div class="input-content hidden">
<input id="verification hidden" type="text" placeholder="请输入验证码" maxlength="4"/>
<div>验证领红包</div>
</div>
<div class="coupon-description">
<span></span>
</div>
</div>
<div class="gain-coupon-centent hidden">
<div class="gain-coupon-centent">
<div class="coupon">
<!-- <img src="/activity/cocacola/images/cokeCoupon.png"> -->
</div>
<p class="phone" id="mobile"></p>
<p>登录Yoho!Buy有货客户端即可使用</p>
<div class="use-coupon-btn">
<!-- <img src="/activity/cocacola/images/cokeBtn.png"> -->
</div>
<span>活动说明</span>
</div>
</div>
</div>
<div class="messages hidden" id="dialog">
<div class="content"></div>
</div>
<div class="keep-out hidden"></div>
<div class="dialog hidden" id="message">
<span class="close"></span>
<div class="activity-message">
<h3>活动说明</h3>
<div class="message">
<P>1、活动时间:2016年4月7日到2016年7月7日</P>
<P>2、仅限新注册用户以及首次购买用户使用</P>
<P>3、同一手机号限领一次优惠券</P>
</div>
</div>
</div>
</div>
\ No newline at end of file
... ...
var $ = require('yoho-jquery'),
num = 0,
phone,
reg,
time;
$('#phone').bind('input propertychange', function() {
if ($(this).val().length === 11) {
$('.centent span').eq('0').addClass('verification-code');
} else {
$('.centent span').eq('0').removeClass();
}
});
$('#verification').bind('input propertychange', function() {
if ($(this).val().length === 4) {
$('.centent span').eq('1').addClass('get');
} else {
$('.centent span').eq('1').removeClass();
}
});
$('.centent').on('click', '.verification-code', function() {
$('.centent span').eq('0').removeClass('verification-code');
phone = $(this).siblings('input').val();
reg = /[0-9]{11}/;
if (!reg.test(phone)) {
$('#dialog').removeClass('hidden');
$('.keep-out').removeClass('hidden');
$('#dialog .content').html('<p class="phone-error">手机号错误,请重新输入。<p>');
setTimeout(function() {
$('.messages').addClass('hidden');
$('.keep-out').addClass('hidden');
$('#dialog .content').html(' ');
}, 1400);
return;
}
$.ajax({
url: '/activity/cocacola/CocacolaController/sendSms',
data: {
mobile: $('#phone').val()
},
dataType: 'json',
success: function(data) {
if (data.code === 200) {
time = setInterval(function() {
num++;
if (num > 60) {
num = 0;
$('.centent span').eq('0').addClass('verification-code').html('获取验证码');
clearInterval(time);
} else {
$('.centent span').eq('0').removeClass('verification-code').html('重新发送' + (60 - num));
}
}, 1000);
} else {
$('#dialog').removeClass('hidden');
$('.keep-out').removeClass('hidden');
$('#dialog .content').html('<p class="phone-error">' + data.message + '<p>');
setTimeout(function() {
$('.messages').addClass('hidden');
$('.keep-out').addClass('hidden');
$('#dialog .content').html(' ');
}, 1400);
}
}
});
});
$('.centent').on('click', '.get', function() {
$('.centent span').eq('1').removeClass('get');
if ($(this).siblings('input').val().length === 4) {
$.ajax({
url: '/activity/cocacola/CocacolaController/validRegCodeAndSendCode',
data: {
code: $('#verification').val(),
mobile: $('#phone').val(),
client_id: $.cookie('_yasvd')
},
dataType: 'json',
success: function(data) {
if (data.code === 200) {
location.href = 'gain.html?mobile=' + $('#phone').val();
} else {
$('#dialog').removeClass('hidden');
$('.keep-out').removeClass('hidden');
$('#dialog .content').html('<p class="phone-error">' + data.message + '<p>');
setTimeout(function() {
$('.messages').addClass('hidden');
$('.keep-out').addClass('hidden');
$('#dialog .content').html(' ');
}, 1400);
}
}
});
} else {
$('#dialog').removeClass('hidden');
$('.keep-out').removeClass('hidden');
$('#dialog .content').html('<p class="phone-error">验证码错误,请重新输入。<p>');
setTimeout(function() {
$('.messages').addClass('hidden');
$('.keep-out').addClass('hidden');
$('#dialog .content').html(' ');
}, 1400);
}
});
$('.close').on('click', function() {
$('.dialog').addClass('hidden');
$('.keep-out').addClass('hidden');
$('#dialog .content').html(' ');
});
$('.footer span').on('click', function() {
$('#message').removeClass('hidden');
$('.keep-out').removeClass('hidden');
});
$('.centent').on('click', '.get', function() {
if (window._yas) {
window._yas.sendCustomInfo({
receiveCoupon: 'Y'
}, true);
}
});
... ...