开通有货分期

@@ -9,7 +9,6 @@ const headerModel = require('../../../doraemon/models/header');
 const installmentModel = require('../models/installment');
 const _ = require('lodash');
 const helpers = global.yoho.helpers;
-
 const index = (req, res) => {
     let query = req.query.query || '';
     let uid = req.user.uid || 3236556;
@@ -29,9 +28,7 @@ const index = (req, res) => {
                 installmentOnly: {
                     title: '分期专享',
                     goods: [
-                        {
-
-                        }
+                        {}
                     ]
                 }
             };
@@ -82,9 +79,7 @@ const review = (req, res) => {
                     installmentOnly: {
                         title: '分期专享',
                         goods: [
-                            {
-
-                            }
+                            {}
                         ]
                     }
                 }
@@ -110,18 +105,24 @@ const review = (req, res) => {
 };
 
 
-const startingService = (req, res, next) => {
+const startingService = (req, res) => {
     res.render('installment/starting-service', {
         module: 'home',
         page: 'installment.starting-service',
         navTitle: '开通有货分期',
         navBtn: false
     });
-    console.log(next);
+};
+
+const verifyCode = (req, res, next) => {
+    installmentModel.sendVerifyCode(req.user.uid, req.body.mobile).then((result)=> {
+        res.json(result);
+    }).catch(next);
 };
 
 module.exports = {
     index,
     review,
-    startingService
+    startingService,
+    verifyCode
 };

@@ -89,8 +89,42 @@ const getQueryAmtInfo = (uid) => {
     });
 };
 
+/**
+ * 获取短信验证码
+ *
+ * @param uid 用户ID
+ * @param mobile 手机号码
+ */
+const sendVerifyCode = (uid, mobile) => {
+    return api.get('', {
+        method: 'user.instalment.getSnsCheckCode'
+    }, {
+        uid,
+        mobile
+    });
+};
+
+/**
+ * 开通服务
+ *
+ * @param uid 用户id
+ * @param userName	姓名
+ * @param identityCardNo 身份证号码
+ * @param cardNo 银行卡号码
+ * @param mobile 手机号码
+ * @param snsCheckCode	验证码
+ * @returns {*}
+ */
+const activateService = (params) => {
+    return api.get('', {
+        method: 'user.instalment.activate'
+    }, params);
+};
+
 module.exports = {
     getStauts,
     getQueryCreditInfo,
-    getQueryAmtInfo
+    getQueryAmtInfo,
+    sendVerifyCode,
+    activateService
 };

@@ -16,5 +16,5 @@ const router = express.Router(); // eslint-disable-line
 router.get('/installment/index', installment.index);// 开通分期首页
 router.get('/installment/review', installment.review); // 开通分期首页
 router.get('/installment/starting-service', installment.startingService); // 分期付款开通
-
+router.get('/installment/starting-service/verify-code', installment.verifyCode);
 module.exports = router;

@@ -4,18 +4,18 @@
     基本信息的有效性决定您能否激活有货分期，以及最终可获得的额度!
   </div>
 
-  <form action="" class="apply-form">
+  <form id="apply-form" method="post" class="apply-form">
     <div class="field">
-      <label for="name">姓名：</label>
+      <label for="userName">姓名：</label>
 
-      <input id="name" name="name" type="text" placeholder="姓名" maxlength="20"/>
+      <input id="userName" name="userName" type="text" placeholder="姓名" maxlength="20"/>
       <div class="clearfix"></div>
     </div>
 
     <div class="field">
-      <label for="name">身份证号：</label>
+      <label for="identityCardNo">身份证号：</label>
 
-      <input id="name" name="idCardNo" type="text" placeholder="身份证号" maxlength="18"/>
+      <input id="identityCardNo" name="identityCardNo" type="text" placeholder="身份证号" maxlength="18"/>
       <div class="clearfix"></div>
     </div>
 
@@ -23,7 +23,7 @@
     <div class="field">
       <label for="name">卡号：</label>
 
-      <input id="card-no" name="cardNo" type="text" placeholder="银行卡号" size="26"/>
+      <input id="cardNo" name="cardNo" type="text" placeholder="银行卡号" size="26" maxlength="30"/>
       <div class="clearfix"></div>
     </div>
 
@@ -53,6 +53,6 @@
       数据智能加密，保障您的用卡安全
     </div>
 
-    <button class="apply-button" type="submit">下一步</button>
+    <button id="apply-button" class="apply-button" type="submit">下一步</button>
   </form>
 </div>

@@ -5,24 +5,36 @@ const Timer = function() {
     this.countdownTimer = null;
 };
 
+const FormModel = function() {
+};
+
+const formModel = new FormModel();
 
 /**
  *  倒计时
  *
- * @param progress 进度回调
+ * @param start 启动回调
+ * @param tick 进度回调
  * @param complete 完成回调
  */
-Timer.prototype.startCountdown = function(progress, complete) {
+Timer.prototype.startCountdown = function(start, tick, complete) {
     if (this.counter > 0 || this.countdownTimer) {
         return;
     } else {
         this.counter = 59;
     }
 
-    if (progress) {
-        progress.call(this, this.counter);
+
+    // 启动回调
+    if (start) {
+        start.call(this);
     }
 
+    if (tick) {
+        tick.call(this, this.counter);
+    }
+
+    // 开始计时器
     this.countdownTimer = setInterval(()=> {
         this.counter--;
 
@@ -30,14 +42,16 @@ Timer.prototype.startCountdown = function(progress, complete) {
             if (complete) {
                 clearInterval(this.countdownTimer);
 
+                // 重置计时器
                 this.counter = 0;
                 this.countdownTimer = null;
                 complete.call(this);
             }
         }
 
-        if (progress && this.counter > 0) {
-            progress.call(this, this.counter);
+        // 完成回调
+        if (tick && this.counter > 0) {
+            tick.call(this, this.counter);
         }
     }, 1000);
 };
@@ -47,17 +61,65 @@ Timer.prototype.startCountdown = function(progress, complete) {
  * 点击发送短信事件
  */
 $('#send-sms').click(function() {
-    new Timer().startCountdown(function(counter) {
+    new Timer().startCountdown(function() {
+        $.get('/home/installment/starting-service/verify-code', {}).then((result)=> {
+            console.log(result);
+        });
+    }, function(counter) {
+        // 进度回调
         $('#send-sms').text(counter + 's');
     }, function() {
+        // 倒计时结束后再次显示 "获取验证码"
         $('#send-sms').text('获取验证码');
     });
 
     return false;
 });
 
-$('#card-no').keydown(function() {
+/**
+ * 银行卡格式化
+ */
+$('#cardNo').keyup(function() {
     const value = $(this).val();
 
-    $(this).val(value.replace(/\s[^\d]/g, '').replace(/(\d{4})(?=\d)/g, '$1 '));
+    $(this).val(value.replace(/[^\d]/g, '').replace(/(\d{4})(?=\d)/g, '$1 ')).trigger('change');
+});
+
+/**
+ * 表单验证
+ */
+const validateForm = function() {
+    const applyButton = $('#apply-button');
+
+    if (formModel.userName &&
+        formModel.identityCardNo &&
+        formModel.cardNo &&
+        formModel.mobilePhone &&
+        formModel.verifyCode &&
+        formModel.agreements === 'on') {
+        applyButton.prop('disabled', false);
+    } else {
+        applyButton.prop('disabled', true);
+    }
+};
+
+// 输入框改变时同时更新模型
+$('input').on('change', function() {
+    const name = $(this).attr('name');
+
+    if ($(this).is(':checkbox')) {
+        formModel[name] = $(this).is(':checked') ? $(this).val() : null;
+    } else {
+        formModel[name] = $(this).val();
+    }
+
+    validateForm();
+});
+
+
+/**
+ * 表单提交
+ */
+$('#apply-form').submit(function() {
+    console.log(formModel);
 });

@@ -7,7 +7,6 @@
         & + label {
             &:before {
                 position: absolute;
-                margin-top: 4px;
                 content: "";
                 display: inline-block;
                 width: 32px;
@@ -50,6 +49,10 @@
         height: 90px;
         margin: 0 auto;
         display: block;
+
+        &:disabled {
+            opacity: 0.5;
+        }
     }
 
     .agreements {