Authored by 周少峰

Merge branch 'feature/students' of git.yoho.cn:fe/yohobuy-node into feature/students

... ... @@ -102,19 +102,25 @@
</script>
<script type="text/html" id="identity-back">
\{{#success}}
<div class="identity-back-icon"></div>
<div class="identity-back-wrap">
<div class="identity-back-icon success-icon"></div>
<p class="identity-back-title">恭喜您,您的验证成功啦!</p>
<p class="identity-back-subtitle">您是所在城市第<span>123456</span>位学生</p>
</div>
\{{/success}}
\{{#fail}}
<div class="identity-back-icon"></div>
<div class="identity-back-wrap">
<div class="identity-back-icon fail-icon"></div>
<p class="identity-back-title">太遗憾了,您的学校信息未通过审核!</p>
<p class="identity-back-subtitle">您可以<span>重新验证></span></p>
<p class="identity-back-subtitle">您可以<span id="backForm">重新验证></span></p>
</div>
\{{/fail}}
\{{#wait}}
<div class="identity-back-icon"></div>
<div class="identity-back-wrap">
<div class="identity-back-icon wait-icon"></div>
<p class="identity-back-title">请稍等,</p>
<p class="identity-back-title">您是学校信息正在验证中!</p>
</div>
\{{/wait}}
</script>
</div>
... ...
<div class="stu-identity clearfix">
<div class="identity-count">
{{#if identityItem}}
<div class="yoho-circle"></div>
<p class="give-coin">验证成功即送<span>{{identityItem.sendCoin}}</span>个有货币</p>
<p class="identity-info">目前全国已有</p>
<div class="stu-num">
{{#identityItem.stuNum}}
<span>{{this}}</span>
{{/identityItem.stuNum}}
</div>
<p class="stu-ident">学生已认证</p>
{{/if}}
<div class="yoho-circle"></div>
<p class="give-coin">验证成功即送<span>{{identityItem.sendCoin}}</span>个有货币</p>
<p class="identity-info">目前全国已有</p>
<div class="stu-num">
{{#identityItem.stuNum}}
<span>{{this}}</span>
{{/identityItem.stuNum}}
</div>
<p class="stu-ident">学生已认证</p>
</div>
<div id="identity-wrap" class="identity-wrap">
<form class="identity-form">
<form id="identity-form" class="identity-form">
<div class="form-group">
<label><span class="star">*</span>真实姓名:</label>
<input id="stu-name" class="ident-inp" type="text" name="stu-name" placeholder="请输入您的姓名">
... ... @@ -26,6 +24,7 @@
<label><span class="star">*</span>学校地区:</label>
<input id="stu-province" class="ident-inp" type="text" name="stu-province">
<div class="ident-select-wrap">
<i class="iconfont arrow-down">&#xe61d;</i>
<div id="stu-province-show" class="select-value" >请选择省份</div>
<ul id="stu-province-ul" class="select-ul select-more-line clearfix"></ul>
</div>
... ... @@ -34,6 +33,7 @@
<label><span class="star">*</span>学校名称:</label>
<input id="stu-school" class="ident-inp long-inp" type="text" name="stu-school">
<div class="ident-select-wrap long-sel" >
<i class="iconfont arrow-down">&#xe61d;</i>
<div id="stu-school-show" class="select-value">请选择您所在学校</div>
<ul id="stu-school-ul" class="select-ul select-one-line"></ul>
</div>
... ... @@ -42,6 +42,7 @@
<label><span class="star">*</span>学历程度:</label>
<input id="stu-edu" class="ident-inp long-inp" type="text" name="stu-edu">
<div class="ident-select-wrap long-sel">
<i class="iconfont arrow-down">&#xe61d;</i>
<div id="stu-edu-show" class="select-value">请选择您的学历</div>
<ul id="stu-edu-ul" class="select-ul select-one-line"></ul>
</div>
... ... @@ -50,19 +51,20 @@
<label><span class="star">*</span>入学年份:</label>
<input id="stu-entrance-year" class="ident-inp " type="text" name="stu-entrance-year">
<div class="ident-select-wrap long-sel">
<i class="iconfont arrow-down">&#xe61d;</i>
<div id="stu-entrance-year-show" class="select-value">请选择您的入学年份</div>
<ul id="stu-entrance-year-ul" class="select-ul select-one-line"></ul>
</div>
</div>
<div class="form-group agreen-group">
<input id="agreen" class="hide" type="checkbox" name="agreen">
<span id="agreen-show" class="ck-sel"></span>
<!-- <span class="iconfont">&#xe731;</span> -->
<span id="agreen-show" class="iconfont ck-sel">&#xe622;</span>
<span>同意<a id="coupon-dia">Yoho!有货学生认证协议</a></span>
</div>
<p id="prompt" class="prompt"></p>
<div class="form-group">
<div class="validate-btn">立即验证</div>
<div id="identity-Btn" class="validate-btn">立即验证</div>
</div>
</form>
</div>
<div class="identity-ad"></div>
... ...
... ... @@ -3,7 +3,6 @@
<div class="stu-rights-item">
<img class="" src="{{image src 300 300}}">
</img>
<p>{{title}}</p>
</div>
{{/rightsItem}}
</div>
\ No newline at end of file
... ...
No preview for this file type
... ... @@ -2,7 +2,7 @@
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd" >
<svg xmlns="http://www.w3.org/2000/svg">
<metadata>
Created by FontForge 20120731 at Thu Jul 7 10:32:19 2016
Created by FontForge 20120731 at Wed Aug 10 18:13:25 2016
By admin
</metadata>
<defs>
... ... @@ -19,7 +19,7 @@ Created by FontForge 20120731 at Thu Jul 7 10:32:19 2016
bbox="0 -212 1158 896"
underline-thickness="50"
underline-position="-100"
unicode-range="U+0078-E621"
unicode-range="U+0078-E622"
/>
<missing-glyph horiz-adv-x="374"
d="M34 0v682h272v-682h-272zM68 34h204v614h-204v-614z" />
... ... @@ -122,5 +122,10 @@ q-12 0 -23.5 4.5t-20.5 12.5q-8 7 -13 18t-5 23z" />
d="M982 137l-4 6l-10 12q-12 13 -42 38q-43 36 -79 59l-48 31l-21 11q-17 8 -36 1q-16 -5 -23 -18l-17 -25q-4 -6 -8 -13l-12 -24q-9 -18 -15 -28q-7 -14 -21 -24t-32 -13.5t-36 7.5q-102 57 -171 123q-101 95 -135 172q-8 13 -1.5 37t26.5 34q13 7 34.5 15.5t31.5 14.5
q7 4 14.5 8.5t18.5 11.5l4 3l4 3l3 3q19 18 9 43l-3 8q-14 32 -36 69q-17 30 -41 62q-16 21 -32.5 36t-25.5 20l-9 5q-9 5 -13 7q-23 10 -50 -1q-15 -6 -30.5 -15.5t-22 -14.5t-26.5 -21q-44 -37 -69.5 -82.5t-19.5 -86.5q10 -72 88 -198.5t182.5 -225.5t237.5 -173t209 -84
q79 -10 169 73q38 36 56 73q6 14 7.5 30t-5.5 31zM982 137z" />
<glyph glyph-name="uniE622" unicode="&#xe622;"
d="M511.5 831q-90.5 0 -173.5 -35.5t-143 -95t-95 -142.5t-35 -174t35 -173.5t95 -142.5t143 -95.5t173.5 -35.5t173.5 35.5t143 95.5t95 142.5t35.5 173.5t-35 174t-95.5 142.5t-143 95t-173.5 35.5zM452 184h-1v0l-38 38l-179 180l38 37l179 -179l318 318l38 -38zM512 -63
q-91 0 -175 35q-80 34 -142 96t-96 142q-35 83 -35 174t35 174q34 81 96 142.5t142 95.5q84 36 175 36t174 -36q80 -34 142 -95.5t96 -142.5q35 -83 35 -174t-35 -174q-34 -80 -96 -142t-142 -96q-83 -35 -174 -35zM511.5 831q-90.5 0 -173 -35.5t-142.5 -95.5t-95.5 -142.5
t-35.5 -173.5t35.5 -173.5t95.5 -142.5t142.5 -95t173 -35t173.5 35t142.5 95t95 142.5t35.5 173.5t-35.5 173.5t-95 142.5t-142.5 95.5t-173.5 35.5zM451 183l-38 39l-180 180l39 38l179 -180l318 318l39 -38zM414 222l37 -37l355 355l-37 37l-318 -318l-179 180l-38 -37z
" />
</font>
</defs></svg>
... ...
No preview for this file type
No preview for this file type
... ... @@ -11,7 +11,7 @@ var Dialog = require('../common/dialog').Dialog;
var $sortItem = $('.sort-item'),
// $identity = $('#identity-wrap'),
$identity = $('#identity-wrap'),
$agreenShow = $('#agreen-show'),
$stuProv = $('#stu-province-show'),
$stuProvWrap = $stuProv.parent(),
... ... @@ -20,14 +20,16 @@ var $sortItem = $('.sort-item'),
$stuEdu = $('#stu-edu-show'),
$stuEduWrap = $stuEdu.parent(),
$stuYear = $('#stu-entrance-year-show'),
$stuYearWrap = $stuYear.parent();
$stuYearWrap = $stuYear.parent(),
$identityForm = $('#identity-form');
// $stuYearUl = $stuYear.next();
var $rightDia = $('#rights-dia'),
$couponDia = $('#coupon-dia');
var provFn;
var provFn,
identityFn;
var alertConfig,
makeAlert;
... ... @@ -58,8 +60,7 @@ var redirect = {
// handlebars模板
provFn = handlebars.compile($('#stu-select').html() || '');
// identityFn = handlebars.compile($('#identity-back').html() || '');
identityFn = handlebars.compile($('#identity-back').html() || '');
require('../plugins/slider');
... ... @@ -82,7 +83,7 @@ function closeStuSelect() {
}
/**
* 清除加载的下拉数据,还原点击状态
* 清除加载的下拉数据,还原点击状态,获取点击数据
* @param
* @param
*/
... ... @@ -91,16 +92,48 @@ function clearSelectUl($li, code) {
$ul = $li.parent();
var $show = $ul.prev(),
$wrap = $ul.parent();
$wrap = $ul.parent(),
$input = $wrap.prev();
$show.html($a.html());
if (arguments.length === 2) {
$show.attr(code, $a.attr(code));
$input.val($a.attr(code));
} else {
$input.val($a.html());
}
$ul.empty();
$wrap.removeClass('active');
}
/**
* 最终提交表单
*/
function submitIdentity(json) {
$.ajax({
type: 'GET',
url: '/product/students/verify',
data: json
}).then(function(data) {
if (data.code === 200) {
$identity.remove('.identity-back-wrap');
$identity.append(identityFn({
success: true
}));
} else {
$identity.remove('.identity-back-wrap');
$identity.append(identityFn({
fail: true
}));
$('#backForm').on('click', function() {
$identity.remove('.identity-back-wrap');
$identityForm.removeClass('hide');
});
}
});
}
lazyLoad($('img.lazy'));
// 根据配置执行展示弹窗
... ... @@ -381,6 +414,58 @@ $('.enable .info').on('click', function(e) {
redirect.gunangSrc = $(this).closest('a').get(0).href;
});
// $identity.html(identityFn({
// wait: true
// }));
$('#identity-Btn').on('click', function() {
var identData = {
name: $('#stu-name').val(),
certNo: $('#stu-idNum').val(),
collegeName: $('#stu-school').val(),
educationDegree: $('#stu-edu').val(),
enrollmentYear: $('#stu-entrance-year').val()
};
var $prompt = $('#prompt'),
$agreen = $('#agreen-show');
if (identData.name === '') {
$prompt.html('真实姓名不能为空');
return;
}
if (!/^[\u4e00-\u9fa5a-zA-Z]{2,12}$/.test(identData.name)) {
$prompt.html('真实姓名为2~12个汉字或者英文');
return;
}
if (identData.certNo === '') {
$prompt.html('身份证号不能为空');
return;
}
if (!/(^\d{15}$)|(^\d{18}$)|(^\d{17}(\d|X|x)$)/.test(identData.certNo)) {
$prompt.html('身份证号格式错误');
return;
}
if (identData.collegeName === '') {
$prompt.html('学校名称不能为空');
return;
}
if (identData.educationDegree === '') {
$prompt.html('学历程度不能为空');
return;
}
if (identData.enrollmentYear === '') {
$prompt.html('入学年份不能为空');
return;
}
if (!$agreen.hasClass('active')) {
$prompt.html('未同意Yoho!有货学生认证协议');
return;
}
$prompt.html('');
console.info(identData);
submitIdentity(identData);
$identityForm.addClass('hide');
$identity.remove('.identity-back-wrap');
$identity.append(identityFn({
wait: true
}));
});
... ...
... ... @@ -105,8 +105,8 @@
}
.stu-rights-item img {
width: 124px;
height: 124px;
width: 196px;
height: 162px;
margin: 20px 0;
}
}
... ... @@ -159,7 +159,7 @@
background-size: 100% 100%;
display: inline-block;
color: #000;
width: 36px;
width: 32px;
height: 56px;
line-height: 56px;
font-size: 35px;
... ... @@ -181,10 +181,16 @@
.identity-form {
width: 330px;
margin: 0 auto;
.prompt {
text-align: center;
color: red;
font-size: 15px;
}
}
.form-group {
margin: 10px 0;
margin: 8px 0;
font-size: 14px;
line-height: 25px;
}
... ... @@ -216,6 +222,13 @@
top: 0;
width: 161px;
.arrow-down {
position: absolute;
top: 0;
right: 5px;
z-index: 1;
}
&.active .select-value {
z-index: 1000;
border-bottom-color: #fff;
... ... @@ -224,6 +237,10 @@
&.active .select-ul {
z-index: 999;
}
&.active .arrow-down {
z-index: 1001;
}
}
.select-group .long-sel {
... ... @@ -254,10 +271,12 @@
position: relative;
z-index: -1;
line-height: 30px;
max-height: 350px;
padding: 10px;
margin-top: -1px;
border: 1px solid #dbdbdb;
background-color: #fff;
overflow-y: auto;
}
.select-group .select-more-line li {
... ... @@ -288,17 +307,12 @@
}
.ck-sel {
display: inline-block;
width: 16px;
height: 16px;
vertical-align: middle;
margin-right: 5px;
background-image: resolve("students/unselect-ck.png");
color: #c7c7c7;
cursor: pointer;
}
.ck-sel.active {
background-image: resolve("students/select-ck.png");
color: #03c503;
}
}
... ... @@ -316,10 +330,21 @@
}
.identity-back-icon {
width: 120px;
height: 120px;
width: 114px;
height: 114px;
margin: 20px auto;
border: 1px solid;
}
.success-icon {
background-image: resolve("students/ok-status.png");
}
.fail-icon {
background-image: resolve("students/fail-status.png");
}
.wait-icon {
background-image: resolve("students/wait-status.png");
}
.identity-back-title {
... ...