add img

@@ -20,14 +20,14 @@ const SIGN_IN_URL = helpers.urlFormat('/signin.html');
 /**
 /**
  * 找回密码主页面
  * 找回密码主页面
  */
  */
-module.exports.indexPage = (req, res) => {
+module.exports.indexPage = (req, res, next) => {
     service.indexPageDataAsync().then(result => {
     service.indexPageDataAsync().then(result => {
         res.render('back/index', Object.assign({
         res.render('back/index', Object.assign({
             module: 'back',
             module: 'back',
             page: 'index',
             page: 'index',
             title: '找回密码'
             title: '找回密码'
         }, result));
         }, result));
-    });
+    }).catch(next);
 };
 };
 
 
 /**
 /**

@@ -13,5 +13,5 @@ var serviceAPI = new ServiceAPI();
 module.exports.getResourceAsync = (resourceCode) => {
 module.exports.getResourceAsync = (resourceCode) => {
     return serviceAPI.get('/operations/api/v5/resource/get', sign.apiSign({
     return serviceAPI.get('/operations/api/v5/resource/get', sign.apiSign({
         content_code: resourceCode
         content_code: resourceCode
-    }));
+    }), true);
 };
 };

@@ -13,8 +13,6 @@ const _ = require('lodash');
 
 
 const indexService = require('./index-service');
 const indexService = require('./index-service');
 
 
-const KEY_WEB_LOGIN_LEFT_BANNER = 'key_web_login_left_banner'; // 登录页左侧的广告图
-
 module.exports.getLeftBannerAsync = (resourceCode) => {
 module.exports.getLeftBannerAsync = (resourceCode) => {
     const DEFAULT_VALUE = {
     const DEFAULT_VALUE = {
         img: 'http://img12.static.yhbimg.com/' +
         img: 'http://img12.static.yhbimg.com/' +
@@ -23,13 +21,6 @@ module.exports.getLeftBannerAsync = (resourceCode) => {
     };
     };
 
 
     return co(function * () {
     return co(function * () {
-        let key = KEY_WEB_LOGIN_LEFT_BANNER + "_" + resourceCode;
-
-        let value = yield Cache.get(key);
-
-        if (!_.isEmpty(value)) {
-            return value;
-        }
 
 
         let resource = yield indexService.getResourceAsync(resourceCode);
         let resource = yield indexService.getResourceAsync(resourceCode);
 
 
@@ -37,11 +28,11 @@ module.exports.getLeftBannerAsync = (resourceCode) => {
             return DEFAULT_VALUE;
             return DEFAULT_VALUE;
         }
         }
 
 
+        let value = {};
         // 有点问题 // passport model 58
         // 有点问题 // passport model 58
-        value.img = helpers.image(resource.data[0].data.src, 252, 190);
-        value.url = resource.data[0].data.url;
+        value.img = helpers.image(resource[0].data[0].src, 252, 190);
+        value.url = resource[0].data[0].url;
 
 
-        Cache.set(key, value).then(()=> console.log('cache value ok')); // async
         return value;
         return value;
     })();
     })();
 };
 };

@@ -92,6 +92,7 @@
     "yoho-handlebars": "^4.0.5",
     "yoho-handlebars": "^4.0.5",
     "yoho-jquery": "^1.12.4",
     "yoho-jquery": "^1.12.4",
     "yoho-jquery-lazyload": "^1.9.7",
     "yoho-jquery-lazyload": "^1.9.7",
-    "yoho-slider": "0.0.2"
+    "yoho-slider": "0.0.2",
+    "yoho-jquery-placeholder":"^0.0.3"
   }
   }
 }
 }

+/**
+ * 邮箱自动补全
+ * @author：xuqi<qi.xu@yoho.cn>
+ * @date: 2016/2/22
+ */
+var $ = require('yoho-jquery');
+
+var mailPostfix = {
+    num: ['qq.com', '163.com', '126.com', 'sina.com', 'gmail.com', 'sohu.com', 'hotmail.com', '139.com', '189.com'],
+    other: ['gmail.com', 'qq.com', '163.com', '126.com', 'sina.com', 'sohu.com', 'hotmail.com', '139.com', '189.com']
+};
+
+var emailAcTime;
+
+/**
+ * @param $input 需要自动完成的$对象
+ * @param cb 鼠标移开/点击自动完成项后需要执行的操作（验证等）
+ */
+module.exports = function($input, cb) {
+    var ulHtml = '<ul id="email-autocomplete" class="email-autocomplete hide"></ul>';
+
+    var $emailAutoComplete;
+
+    $input.parent().append(ulHtml);
+
+    $emailAutoComplete = $('#email-autocomplete');
+
+    $input.on('keyup', function() {
+        var account = $.trim($(this).val()),
+            html = '',
+            accountMatch,
+            matchStr,
+            postfix,
+            i;
+
+        //输入@时自动补全邮箱后缀
+        //此处>0非错误，用于避免输入的第一个字符为@被识别为邮箱
+        if (account.indexOf('@') > 0) {
+            accountMatch = account.match(/^[0-9]+@(.*)/);
+            if (accountMatch) {
+
+                //数字邮箱补全
+                postfix = mailPostfix.num;
+                matchStr = accountMatch[1];
+            } else {
+                postfix = mailPostfix.other;
+                matchStr = account.match(/@(.*)/)[1];
+            }
+
+            for (i = 0; i < postfix.length; i++) {
+                if (postfix[i].indexOf(matchStr) > -1) {
+                    html += '<li>' + account.slice(0, account.indexOf('@')) + '@' + postfix[i] + '</li>';
+                }
+            }
+
+            if (html !== '' && /.com$/.test(account) === false) {
+                $emailAutoComplete.html(html).removeClass('hide');
+            } else {
+
+                //隐藏autocomplete
+                $emailAutoComplete.html('').addClass('hide');
+            }
+        }
+    }).on('blur', function() {
+        emailAcTime = setTimeout(function() {
+
+            //未点击自动完成项
+            $emailAutoComplete.addClass('hide');
+
+            cb && cb();
+        }, 200);
+    });
+
+    //邮箱自动完成列表项点击
+    $emailAutoComplete.on('click', 'li', function() {
+        clearTimeout(emailAcTime); //清空默认关闭
+
+        //点击自动完成项后进行验证
+        $input.val($(this).text()).focus();
+
+        $emailAutoComplete.addClass('hide');
+
+        cb && cb();
+    });
+};

+/**
+ * Created by TaoHuang on 2016/6/21.
+ */
+
+require('./back');

+/**
+ * 找回密码
+ * @author: xuqi<qi.xu@yoho.cn>
+ * @date: 2015/12/14
+ */
+
+var $ = require('yoho-jquery'),
+    regx = require('./mail-phone-regx'),
+    emailReg = regx.emailRegx,
+    phoneRegx = regx.phoneRegx;
+
+var emailAc = require('./ac-email'); //邮箱自动完成
+
+var $cr = $('#country-code-hide'),
+    $phoneNum = $('#phone-num'),
+    $ca = $('#captcha'),
+    $ccList = $('#country-code-list'),
+    $cc = $('#country-code'),
+    $btn = $('#find-btn'),
+    $accErr = $('#account-err'),
+    $caErr = $('#captcha-err'),
+    caCount = 4, //验证码位数
+    hasPh = false,
+    hasCa = false;
+
+
+require('yoho-jquery-placeholder');
+
+function imgcode() {
+    var time = new Date(),
+        $captchaImg = $('#captcha-img'),
+        captchaImgSrc = $captchaImg.attr('src').split('?')[0];
+
+    $('#captcha-img').attr('src', captchaImgSrc + '?t=' + time.getTime());
+}
+
+function enableBtn() {
+    if (hasPh && hasCa) {
+        $btn.removeClass('disable').prop('disabled', false);
+    } else {
+        $btn.addClass('disable').prop('disabled', true);
+    }
+}
+
+function authcode() {
+    if (!hasPh || !hasCa) {
+        enableBtn();
+        return;
+    }
+
+    $.ajax({
+        type: 'POST',
+        url: '/passport/back/authcode',
+        data: {
+            verifyCode: $.trim($ca.val()),
+            phoneNum: $phoneNum.val(),
+            area: $cr.val()
+        }
+
+    }).then(function(data) {
+        if (data.code === 200) {
+            hasCa = true;
+        } else if (data.code === 402) {
+            hasPh = false;
+            hasCa = true;
+            $accErr.removeClass('hide').find('em').text('该账号不存在');
+            $phoneNum.addClass('error');
+        } else if (data.code === 400) {
+            hasCa = false;
+            imgcode();
+        }
+        enableBtn();
+    });
+}
+
+function vaPn(v) {
+    var pass = true,
+        errTxt = '';
+
+    v = $.trim(v);
+    if (v !== '') {
+        if (/^[0-9]+$/.test(v)) {
+            if (phoneRegx[$cr.val()].test(v)) {
+                pass = true;
+            } else {
+                errTxt = '手机号码格式不正确， 请重新输入';
+                pass = false;
+            }
+        } else {
+            if (emailReg.test(v)) {
+                pass = true;
+            } else {
+                errTxt = '邮箱格式不正确， 请重新输入';
+                pass = false;
+            }
+        }
+    } else {
+        errTxt = '账户名不能为空';
+        pass = false;
+    }
+    hasPh = pass;
+    authcode();
+
+    return {
+        pass: pass,
+        errTxt: errTxt
+    };
+}
+
+function vaCa() {
+    var v = $.trim($ca.val());
+
+    if (v === '' || v.length < caCount) {
+        hasCa = false;
+        enableBtn();
+        return;
+    }
+
+    hasCa = true;
+
+    authcode();
+}
+
+emailAc($phoneNum, function() {
+        var pnVa = vaPn($phoneNum.val());
+
+        if (pnVa.pass) {
+            $accErr.addClass('hide');
+            $phoneNum.removeClass('error');
+        } else {
+            $accErr.removeClass('hide').find('em').text(pnVa.errTxt);
+            $phoneNum.addClass('error');
+        }
+    }
+);
+
+$ca.attr('maxlength', caCount);
+
+//IE8 placeholder
+$('input').placeholder();
+
+$('#change-captcha, #captcha-img').on('click', function() {
+    imgcode();
+});
+
+$cc.on('click', function(e) {
+    e.stopPropagation();
+    if ($ccList.css('style') === 'block') {
+        $ccList.slideUp('fast');
+    } else {
+        $ccList.slideDown('fast');
+    }
+});
+
+$ccList.delegate('li', 'click', function(e) {
+    var $cur = $(this),
+        code = $cur.data('cc'),
+        pnVa;
+
+    e.stopPropagation();
+    $cr.val(code);
+    $cc.find('em').html($cur.text());
+
+    //切换后验证手机号码
+    if ($.trim($phoneNum.val()) !== '') {
+        pnVa = vaPn($phoneNum.val());
+        enableBtn();
+        if (hasPh) {
+            $accErr.addClass('hide');
+            $phoneNum.removeClass('error');
+        } else {
+            $accErr.removeClass('hide').text(pnVa.errTxt);
+            $phoneNum.addClass('error');
+        }
+    }
+    $ccList.slideUp('fast');
+});
+
+$(document).click(function() {
+    if ($ccList.css('display') === 'block') {
+        $ccList.slideUp();
+    }
+});
+
+$phoneNum.keyup(function() {
+    vaPn($.trim($(this).val()));
+}).focus(function() {
+    $(this).removeClass('error');
+
+    //focus隐藏错误提示
+    $accErr.addClass('hide');
+});
+
+//验证码在鼠标移开后验证， keyup时不再验证
+$ca.blur(function() {
+    var errTxt = $.trim($ca.val()) === '' ? '验证码不能为空' : '验证码不正确';
+
+    if (hasCa) {
+        $caErr.addClass('hide');
+        $ca.removeClass('error');
+    } else {
+        $caErr.removeClass('hide').find('em').text(errTxt);
+        $ca.addClass('error');
+
+        //验证码错误则刷新验证码
+        if ($ca.val() < caCount) {
+
+            //防止重复刷新验证码
+            imgcode();
+        }
+    }
+}).focus(function() {
+    $(this).removeClass('error');
+
+    //focus隐藏错误提示
+    $caErr.addClass('hide');
+}).keyup(function() {
+    vaCa();
+});
+
+$('#find-btn').click(function(e) {
+
+    if (/^[0-9]+$/.test($.trim($phoneNum.val()))) {
+        $('#find-form').attr('action', '/passport/back/mobile');
+    }
+    if ($(this).hasClass('disable')) {
+        return;
+    }
+    if (!hasCa || !hasPh) {
+        e.preventDefault();
+        return true;
+    }
+});

+/**
+ * 国家区号Map手机号码以及邮箱验证正则
+ * @author: xuqi<qi.xu@yoho.cn>
+ * @date: 2015/12/11
+ */
+
+var countryPhoneRegx = {
+    '+86': /^1[35847]{1}[0-9]{9}$/,
+    '+852': /^[965]{1}[0-9]{7}$/,
+    '+853': /^[0-9]{8}$/,
+    '+886': /^[0-9]{10}$/,
+    '+65': /^[98]{1}[0-9]{7}$/,
+    '+60': /^1[1234679]{1}[0-9]{8}$/,
+    '+1': /^[0-9]{10}$/,
+    '+82': /^01[0-9]{9}$/,
+    '+44': /^7[789]{1}[0-9]{8}$/,
+    '+81': /^0[9|8|7][0-9]{9}$/,
+    '+61': /^[0-9]{11}$/
+};
+
+var emailRegx = /^[.\-_a-zA-Z0-9]+@[\-_a-zA-Z0-9]+\.[a-zA-Z0-9]/;
+
+var pwdValidateRegx = /^(?![0-9]+$)(?![a-zA-Z]+$)[0-9A-Za-z]{6,20}$/;
+
+exports.phoneRegx = countryPhoneRegx;
+
+exports.emailRegx = emailRegx;
+
+exports.pwdValidateRegx = pwdValidateRegx;

@@ -7,3 +7,4 @@
 /* 模块 */
 /* 模块 */
 @import "channel/index";
 @import "channel/index";
 @import "product/index";
 @import "product/index";
+@import 'passport/index';

@@ -214,5 +214,4 @@
 @import "register";
 @import "register";
 @import "back";
 @import "back";
 @import "welcome";
 @import "welcome";
-@import "third";
-@import "relate";
+@import "relate";

-.yohobindbtn {
-    display: block;
-    width:210px;
-    height: 45px;
-    line-height: 45px;
-    background-color: #f02200;
-    color: #fff;
-    font-size: 16px;
-    text-align: center;
-}
-.hide {
-    display: none;
-}
-.novisiable {
-    visibility: hidden;
-}
-.actlevel {
-    background-color: #f02200 !important; 
-    color: white !important;
-}
-.mask {
-    position: fixed;
-    top: 0;
-    right: 0;
-    bottom: 0;
-    left: 0;
-    z-index: 1050;
-    overflow: hidden;
-    -webkit-overflow-scrolling: touch;
-    outline: 0;
-}
-
-.bindwrapper {
-    margin: 0 auto;
-    width: 980px;
-    min-height: 450px;
-    padding-top: 122px;
-}
-.welcomeword {
-    width: 100%;
-    text-align: center;
-    font-size: 22px;
-    line-height: 22px;
-    color: #545454;
-    margin-bottom: 15px;
-    .yoho {
-        color: #e12000;
-    }
-}
-.safeword {
-    width: 100%;
-    text-align: center;
-    font-size: 16px;
-    line-height: 16px;
-    color: #545454;
-    margin-bottom: 63px;
-}
-.yohobindrow {
-    width: 485px;
-    margin: 0 auto 22px;
-    height: 40px;
-    .name {
-        float: left;
-        text-align: right;
-        margin-right: 14px;
-        width: 96px;
-    }
-    .areatag {
-        height: 30px;
-        line-height: 30px;
-    }
-    .phonetag,
-    .setpwdtag {
-        height: 47px;
-        line-height: 47px;
-    }
-    .content {
-        float: left;
-        text-align: left;
-        margin-top: 0;
-        padding-left: 0;
-    }
-    .errinfo {
-        color: #f02200;
-        line-height: 49px;
-        margin-left: 5px;
-    }
-    &::after {
-        display: block;
-        content: '';
-        clear: both;
-    }
-}
-.sendnotify {
-    width: 260px;
-    text-align: left;
-    margin: 0 auto 18px;
-}
-.validaterow {
-    margin: 0 auto 22px;
-    padding-left: 248px;
-    .name {
-        float: left;
-        text-align: right;
-        margin-right: 14px;
-        width: 96px;
-    }
-    .areatag {
-        height: 30px;
-        line-height: 30px;
-    }
-    .phonetag {
-        height: 47px;
-        line-height: 47px;
-    }
-    .content {
-        float: left;
-        text-align: left;
-        .err-tip {
-            left: 430px;
-        }
-    }
-    &::after {
-        display: block;
-        content: '';
-        clear: both;
-    }
-    .validatewrapper {
-        float: left;
-        height: 45px;
-        width: 133px;
-        text-align: center;
-        line-height: 45px;
-        background-color: #d8d8d8;
-        color: #000;
-        font-size: 13px;
-        margin-left: 18px;
-        .yohobindbtn{
-            width: 133px;
-            font-size: 13px;  
-        }
-    }
-}
-.validatepicrow {
-    overflow: hidden;
-    margin: 0 auto 22px;
-    padding-left: 250px;
-    .name {
-        float: left;
-        text-align: right;
-        margin-right: 14px;
-        width: 96px;
-    }
-    .areatag {
-        height: 30px;
-        line-height: 30px;
-    }
-    .phonetag {
-        height: 47px;
-        line-height: 47px;
-    }
-    .content {
-        float: left;
-        text-align: left;
-    }
-    &::after {
-        display: block;
-        content: '';
-        clear: both;
-    }
-    .validatewrapper {
-        float: left;
-        height: 45px;
-        text-align: center;
-        line-height: 45px;
-        color: #000;
-        font-size: 13px;
-        margin-left: 18px;
-        .yohobindbtn{
-            width: 133px;
-            font-size: 13px;  
-        }
-    }
-    .change-captcha {
-        cursor: pointer;
-        color: #f02200;
-        text-decoration: underline;
-    }
-}
-.setpwdwrapper {
-    margin-bottom: 10px;
-    height: 45px;
-}
-.safelevel {
-    width: 291px;
-    height: 15px;
-    margin: 0 auto;
-    text-align: right;
-    font-size: 10px;
-    color: #000;
-    span {
-        width: 28px;
-        height: 15px;
-        line-height: 15px;
-        background-color: #e5e5e5;
-        font-size: 10px;
-        color: #000;
-        margin-right: 4px;
-        padding: 1px 8px;
-    }
-}
-.green .color {
-    background-color: #0f0;
-    color: #fff;
-}
-.yellow .color {
-    background-color: #ff0;
-    color: #fff;
-}
-.red .color {
-    background-color: #f00;
-    color: #fff;
-}
-.yohoselectarea {
-    position: relative;
-    box-sizing: border-box;
-    width: 131px;
-    height: 33px;
-    .optionshow {
-        width: 100%;
-        height: 100%;
-        padding-left: 16px;
-        border: 1px solid #d9d9d9;
-        .areaname {
-            display: block;
-            float: left;
-            width: 110px;
-            height: 100%;
-            line-height: 33px;
-            font-size: 13px;
-            color: #000;
-        }
-        .righttag {
-            display: block;
-            float: left; 
-            width: 21px;
-            height: 100%;
-            line-height: 33px;
-            background-color: #d8d8d8;
-            background-image: resolve('passport/arrowbottom.png');
-            background-repeat: no-repeat;
-            background-position: center center;
-        }
-    }
-    .optionslist {
-        background-color: white;
-        position: absolute;
-        top: 35px;
-        left: 0;
-        width: 149px;
-        z-index: 2;
-        .optionitem {
-            height: 33px;
-            line-height: 33px;
-            padding-left: 16px;
-            font-size: 13px;
-            &:hover {
-                background-color: #dfdfdf;
-            }
-        }
-    }
-}
-.yohophonewrapper {
-    width: 271px;
-    height: 47px;
-    border: 1px solid #d9d9d9;
-    position: relative;
-    .areanum {
-        float: left;
-        height: 100%;
-        width: 63px;
-        line-height: 47px;
-        text-align: center;
-        color: #000;
-        background-color: #d8d8d8;
-    }
-    .phonenum {
-        outline: none;
-        box-sizing: border-box;
-        float: left;
-        height: 45px;
-        width: 205px;
-        line-height: 38px;
-        padding-left: 8px;
-        border: none;
-        color: #000;
-    }
-
-    .validatenum,
-    .pwdcontent {
-        width: 100%;
-    }
-}
-.protoctolwrapper{
-    width: 350px;
-    margin: 38px auto 0;
-    padding-left: 85px;
-    overflow: hidden;
-    .choosewrapper {
-        float: left;
-        width: 13px;
-        height: 13px;
-        background-color: #4c4c4c;
-        background-image: resolve('passport/choosed.png');
-        background-position: center center;
-        background-repeat: no-repeat;
-        margin-right: 14px;
-    }
-    .choosetag {
-        width: 110%;
-        height: 110%;
-        display: block;
-        opacity: 0;
-        margin: 0;
-    }
-    span {
-        float: left;
-        color: #666;
-        font-size: 13px;
-        line-height: 14px;
-    }
-    .protoctol {
-        color: #f02200;
-        text-decoration: underline;
-    }
-    &::after {
-        display: block;
-        content: '';
-        clear: both;
-    }
-}
-.confirmwrapper {
-    overflow: hidden;
-    margin-top: 47px !important;
-}
-.btnwrapper{
-    width: 350px;
-    margin: 20px auto 0;
-    padding-left: 85px;
-}
-.thirdloginwrapper {
-    margin: 0 auto;
-    width: 1150px;
-    min-height: 450px;
-    padding-top: 160px;
-    .safeword {
-        margin-bottom: 30px;
-    }
-    .left {
-        box-sizing: border-box;
-        float: left;
-        width: 450px;
-        height: 318px;
-        border-right: 1px solid #e5e5e5;
-    }
-    .right {
-        box-sizing: border-box;
-        float: right;
-        width: 696px;
-        padding-top: 64px;
-        height: 318px;
-    }
-    .gobuy,
-    .completeprofile {
-        float: left;
-        display: inline-block;
-        width: 94px;
-        height: 94px;
-        line-height: 94px;
-        text-align: center;
-        border-radius: 50%;
-        background-color: #f02200;
-        color: white;
-    }
-    .gobuy {
-        margin-left: 228px;
-        margin-right: 80px;
-    }
-}
-.bindsuccesswrapper {
-    margin: 0 auto;
-    width: 1150px;
-    min-height: 450px;
-    padding-top: 160px;
-    .successwrapper {
-        width: 320px;
-        height: 29px;
-        margin: 0 auto 16px;
-        .successtag {
-            display: inline-block;
-            margin-right: 28px;
-            float: left;
-            width: 29px;
-            height: 29px;
-            background-image: resolve('passport/bindsuccess.png');
-            background-repeat: no-repeat;
-        }
-        .congratulation {
-            display: inline-block;
-            height: 29px;
-            line-height: 29px;
-            font-size: 22px;
-        }
-    }
-    .info {
-        text-align: center;
-        font-size: 16px;
-        margin-bottom: 48px;
-    }
-    .gobuynow {
-        margin: 0 auto;
-    }
-}
-.bindconfrimwrapper {
-    width: 900px;
-    height: 439px;
-    margin: -217px auto;
-    background-color: #fff;
-    box-sizing: border-box;
-    padding-top: 37px;
-    .topwrapper {
-        width: 281px;
-        height: 90px;
-        margin: 0 auto 32px;
-        .userphoto {
-            width: 90px;
-            height: 90px;
-            vertical-align: middle;
-            border-radius: 50%;
-            margin-right: 22px;
-        }
-        .username{
-            vertical-align: middle;
-            display: inline-block;
-            width: 160px;
-            @mixin ellipsis;
-            font-weight: bold;
-            color: #545454;
-        }
-    }
-    .usertaginfo {
-        text-align: center;
-        font-size: 18px;
-        font-weight: bold;
-        color: #545454;
-        margin-bottom: 15px;
-    }
-    .usertagremind {
-        text-align: center;
-        font-size: 16px;
-        color: #888888;
-        margin-bottom: 47px;
-    }
-    .otherphone{
-        margin: 0 auto 64px;
-    }
-    .logindirectly {
-        display: block;
-        text-align: center;
-        text-decoration: underline;
-        color: #f02200;
-    }
-}
-.yohobindbtn[disabled] {
-    background-color: #e5e5e5;
-    cursor: not-allowed;
-}
-.gobindwrapper {
-    width: 100%;
-    height: 45px;
-    margin-bottom: 70px;
-    &::after {
-        display: block;
-        content: '';
-        clear: both;
-    }
-    .myphone {
-        float: left;
-        margin-left: 20px;
-        width: 193px;
-    }
-    .logindirectly {
-        display: inline-block;
-    }
-    .validaterow {
-        overflow: hidden;
-        margin: 0 auto 22px;
-        padding-left: 222px;
-        float: left;
-        .name {
-            float: left;
-            text-align: right;
-            margin-right: 14px;
-            width: 96px;
-        }
-        .areatag {
-            height: 30px;
-            line-height: 30px;
-        }
-        .phonetag {
-            height: 47px;
-            line-height: 47px;
-        }
-        .content {
-            float: left;
-            text-align: left;
-            .validatacode {
-                outline: none;
-                box-sizing: border-box;
-                float: left;
-                height: 45px;
-                width: 113px;
-                line-height: 38px;
-                padding-left: 8px;
-                border: 1px solid #d9d9d9;
-                color: #000;
-            }
-        }
-        .validatewrapper {
-            float: left;
-            height: 45px;
-            width: 133px;
-            text-align: center;
-            line-height: 45px;
-            background-color: #d8d8d8;
-            color: #000;
-            font-size: 13px;
-            margin-left: 18px;
-            .yohobindbtn{
-                width: 133px;
-                font-size: 13px;  
-            }
-        }
-    }
-  
-}
-.gobindbottomwrapper {
-    width: 100%;
-    padding-left: 341px;
-    .logindirectly {
-        display: inline-block;
-        float: left;
-        margin-right: 36px;
-        text-decoration: underline;
-        color: #f02200;
-    }
-}
-.pwd-tips {
-    position: absolute;
-    z-index: 1000;
-    top: -10px;
-    left: 285px;
-    width: 160px !important;
-    height: 72px;
-    padding-top: 7px;
-    font-size: 12px;
-    background: #FFFFFF url(/passport/tip/block.png) no-repeat; 
-
-    >div {
-        position: relative;
-        height: 22px;
-        line-height: 22px;
-        margin-left: 15px;
-        padding-left: 15px;
-        font-size: 12px;
-        color: #b9b9b9;
-
-        i {
-            position: absolute;
-            width: 14px;
-            height: 14px;
-            left: -2px;
-            top: 50%;
-            margin: -7px 0 0;
-            background: url(/passport/tip/info.png) no-repeat;
-        }
-
-        &.no {
-            color: red;
-            i {
-                background: url(/passport/tip/error.png) no-repeat;
-            }
-                
-        }
-
-        &.yes {
-            i {
-                background: url(/passport/tip/success.png) no-repeat;
-            }
-        }
-    }
-}
-
-.tip-panel {
-    position: absolute;
-    display: none;
-    width: 248px;
-    padding: 0 10px;
-    z-index: 100;
-    background-color: #161616;
-    border: 1px solid rgba(255, 255, 255, 0.7);
-    margin-top: 5px;
-    cursor: pointer;
-    border-radius: 5px;
-
-    li {
-        height: 20px;
-        line-height: 20px;
-        color: #b9b9b9;
-    }
-}
-.err-tip {
-    position: absolute;
-    font-size: 14px;
-    white-space: nowrap;
-    top: 8px;
-    left: 285px;
-    padding: 6px 0;
-    color: #f00;
-
-    i {
-        display: block;
-        float: left;
-        height: 14px;
-        width: 14px;
-        background: url(/passport/tip/error.png) no-repeat;
-        margin-right: 5px;
-    }
-
-    a {
-        text-decoration: underline;
-        color: #f00;
-    }
-}
-.backdrop {
-    position: fixed;
-    background: #000;
-    width: 100%;
-    height: 100%;
-    left: 0 ;
-    top: 0 ;
-    bottom: 0;
-    right: 0;
-    opacity: .5;
-}
-.err-info {
-    display: none;
-    z-index: 1000;
-    position: absolute;
-    top: -41px;
-    left: 0px;
-    height: 30px;
-    line-height: 30px;
-    color: red;
-    background-color: #ffebeb;
-    border: 1px solid #ffbdbe;
-    padding: 0 10px;
-    b {
-        background: resolve('passport/angle.png');
-        position: absolute;
-        height: 9px;
-        width: 17px;
-        top: 30px;
-        left: 10px;
-    }
-}