send-email-ok

@@ -131,10 +131,11 @@ router.get('/passport/password/resetsuccess', reset.passwordResetOkPage); // 重
 /**
  * 密码找回
  */
-router.get('/passport/back/email', back.indexEmailPage);// 通过邮箱找回密码页面
+// router.get('/passport/back/email', back.indexEmailPage);// 通过邮箱找回密码页面
 router.post('/passport/back/sendemail', back.sendCodeToEmailAPI);// 发送邮箱验证码
 router.get('/passport/back/resendemail', back.resendCodeToEmailAPI);// 重新发送邮箱验证码
-router.get('/passport/back/success', back.backSuccessByEmailPage);// 邮箱找回密码-发送成功页面
+
+// router.get('/passport/back/success', back.backSuccessByEmailPage);// 邮箱找回密码-发送成功页面
 
 router.get('/passport/back/mobile', validateCode.load, back.indexMobilePage);// 输入手机号找回密码页面
 router.get('/passport/back/mobilecode', back.verifyCodeByMobilePage);// 输入手机验证码页面
@@ -214,9 +215,9 @@ router.get('/login.html',
     login.loginShowCaptchaByIp,
     loginNew.international); // 国际账号登录
 
-router.get('/passport/back/mobile-new', validateCode.load, backNew.backByMobile); // 通过手机找回密码
+router.get('/passport/back/mobile', validateCode.load, backNew.backByMobile); // 通过手机找回密码
 router.post('/passport/back/passwordByMobile-new', backNew.setNewPasswordByMobileAPI);// 依据手机验证码修改密码
-router.get('/passport/back/email-new', backNew.backByEmail); // 通过邮箱找回密码
-router.get('/passport/back/email-success-new', backNew.backByEmailSuccess); // 通过邮箱找回密码成功页
+router.get('/passport/back/email', backNew.backByEmail); // 通过邮箱找回密码
+router.get('/passport/back/success', backNew.backByEmailSuccess);// 邮箱找回密码-发送成功页面
 
 module.exports = router;

@@ -6,7 +6,7 @@
     </div>
      <div class="back-email-form">
         <div class="form-group email">
-            <label for="email" class="iconfont">&#xe724;</label><input type="text" name="email" placeholder="请输入邮箱"><i class="iconfont clear">&#xe72a;</i>
+            <label for="email" class="iconfont">&#xe724;</label><input type="text" name="email" placeholder="请输入邮箱"><i id="clearEmail" class="iconfont clear hide">&#xe72a;</i>
         </div>
         <button id="backEmailResetBtn" class="back-email-reset-btn">确 认</button>
      </div>

 require('passport/back-email-new.page.css');
+
+import $ from 'yoho-jquery';
+import EmailNew from './back/email-new';
+
+$(() => {
+    new EmailNew();
+});

+import $ from 'yoho-jquery';
+import api from '../api';
+import tip from 'plugin/tip';
+import Page from 'yoho-page';
+
+const showErrTip = tip.show;
+
+class EmailNew extends Page {
+    constructor() {
+        super();
+
+        this.selector = {
+            emailInput: $('input[name=email]'),
+            clearEmailBtn: $('#clearEmail'),
+            backEmailResetBtn: $('#backEmailResetBtn'),
+        };
+        this.init();
+    }
+
+    init() {
+        this.bindEvents();
+    }
+
+    bindEvents() {
+        this.selector.emailInput.on('input', this.changeBtnStatus.bind(this));
+        this.selector.clearEmailBtn.on('click', this.clearEmailBtn.bind(this));
+        this.selector.backEmailResetBtn.on('click', this.backEmailReset.bind(this));
+    }
+
+    /**
+     * 监听输入，改变按钮状态
+     */
+    changeBtnStatus() {
+        let email = $.trim(this.selector.emailInput.val());
+
+        /**
+         * 清除邮箱按钮
+         */
+        if (email) {
+            this.selector.clearEmailBtn.removeClass('hide');
+        } else {
+            this.selector.clearEmailBtn.addClass('hide');
+        }
+
+        /**
+         * 提交表单按钮
+         */
+        if (api.emailRegx.test(email)) {
+            this.selector.backEmailResetBtn.addClass('active');
+        } else {
+            this.selector.backEmailResetBtn.removeClass('active');
+        }
+    }
+
+    /**
+     * 清除 email
+     */
+    clearEmailBtn() {
+        this.selector.emailInput.val('');
+        this.selector.clearEmailBtn.addClass('hide');
+    }
+
+    /**
+     * 提交表单
+     */
+    backEmailReset() {
+        let email = $.trim(this.selector.emailInput.val());
+
+        if (!api.emailRegx.test(email)) {
+            return;
+        }
+
+        this.ajax({
+            url: '/passport/back/sendemail',
+            type: 'POST',
+            data: {
+                email: email
+            }
+        }).then(result => {
+            if (result.code === 200) {
+                location.href = result.data;
+            } else {
+                showErrTip(result.message);
+            }
+        });
+    }
+}
+
+module.exports = EmailNew;

@@ -4,10 +4,19 @@
 }
 
 $top-bar-font-color: #444;
+$disable-gray: #b0b0b0;
 
 .back-email-new-page {
     @extend padding-75;
 
+    .active {
+        background-color: #444 !important;
+    }
+
+    .hide {
+        display: none;
+    }
+
     .iconfont {
         color: #444;
     }
@@ -78,7 +87,7 @@ $top-bar-font-color: #444;
             width: 600px;
             height: 70px;
             border-radius: 4px;
-            background-color: #444;
+            background-color: $disable-gray;
             margin-top: 100px;
             font-size: 32px;
             color: #fff;