完成h5注册页面

view/peko/modules/register/index.html

@@ -18,7 +18,7 @@
             <input type="number">
         </div>
         <div class="code">
-            <div class="num">獲取驗證碼</div>
+            <div class="num" id="count">獲取驗證碼</div>
             <input type="number">
         </div>
         <div class="but">提交</div>
@@ -38,6 +38,8 @@
 <script src="../../common/js/pingpp.js"></script>
 <script src="../../common/js/common2.js?v=8.0"></script>
 <script src="../../common/js/layer.js"></script>
+<script src="../../common/js/crypto-js.js"></script>
+<script src="./js/des.js"></script>
 <script src="./js/index.js"></script>
 
 </html>

view/peko/modules/register/js/des.js

@@ -0,0 +1,9 @@
+//DES加密
+const encryptDes = (message, key) => {
+    var keyHex = CryptoJS.enc.Utf8.parse(key);
+    var encrypted = CryptoJS.DES.encrypt(message, keyHex, {
+        mode: CryptoJS.mode.ECB,
+        padding: CryptoJS.pad.Pkcs7
+    });
+    return encrypted.toString();
+}

view/peko/modules/register/js/index.js

@@ -23,18 +23,23 @@ const toastMsg = (content = '操作完成', time = 2) => {
 var browser = checkVersion();
 const urlPrefix = getUrlPrefix();
 var getUrl = getQueryString();
+var time = 59;
+var isClick = true;
 if (EnvCheck() == 'test') {//degBug
     new VConsole();
 }
 $(function () {
     getInfoFromClient();//请求依赖
 })
-function request () {
+function request (phone, num) {
     showLoading()
     networkRequest({
-        type: 'GET',
-        url: urlPrefix + '',
-        data: {},
+        type: 'POST',
+        url: urlPrefix + '/phone/auth/apply',
+        data: {
+            phone: `${phone}`,
+            phoneAreaCode: num
+        },
         success: function (res) {
             if (res.code == 200) {
                 $('.box .phone input').val('');
@@ -43,20 +48,91 @@ function request () {
                 hideLoading(layerIndex)
             } else {
                 hideLoading(layerIndex)
-                toastMsg(ress.message)
+                toastMsg(res.message)
             }
         },
         error () {
+            hideLoading(layerIndex)
             toastMsg('網絡錯誤');
         }
     });
 }
+function getCode (num, phone, code) {
+    showLoading()
+    networkRequest({
+        type: 'POST',
+        url: urlPrefix + '/sms/getCode',
+        data: {
+            mobile: encryptDes(`${num}${phone}`, "1ea53d260ecf11e7b56e00163e046a26"),
+            type: 15,
+            phoneAreaCode: num
+        },
+        success: function (res) {
+            if (res.code == 200) {
+                timerFun()
+                hideLoading(layerIndex)
+                toastMsg(res.message)
+            } else {
+                hideLoading(layerIndex)
+                toastMsg(res.message)
+            }
+        },
+        error () {
+            hideLoading(layerIndex)
+            toastMsg('網絡錯誤');
+        }
+    });
+}
+function verify (num, phone, code) {
+    $.ajax({
+        type: 'POST',
+        url: urlPrefix + '/sms/verify',
+        data: {
+            mobile: `${num}${phone}`,
+            phoneAreaCode: num,
+            code,
+        },
+        beforeSend: function (request) {
+        },
+        success: function (res) {
+            if (res.code == 200) {
+                request(phone, num)
+            } else {
+                hideLoading(layerIndex)
+                toastMsg(res.message)
+            }
+        },
+        error: function (data) {
+            hideLoading(layerIndex)
+            toastMsg('網絡錯誤');
+        }
+    })
+}
 // 提交按钮
 $('.box .but').click(function () {
     var num = Number($('.box .phone .num').text().match(/\d+/)[0]);
     var phone = Number($('.box .phone input').val());
     var code = Number($('.box .code input').val());
-    console.log(num, phone, code);
+    if (code == '') {
+        toastMsg('請輸入驗證碼');
+    } else {
+        verify(num, phone, code)
+    }
+})
+// 获取验证码按钮
+$('.box .code .num').click(function () {
+    var num = Number($('.box .phone .num').text().match(/\d+/)[0]);
+    var phone = Number($('.box .phone input').val());
+    var code = Number($('.box .code input').val());
+    if (isClick) {
+        if (phone == '') {
+            toastMsg('請輸入手機號');
+        } else {
+            getCode(num, phone, code);
+        }
+    } else {
+        console.log('倒计时中');
+    }
 })
 // 关闭弹窗
 $('.pop_up .pop_up_in img').click(function () {
@@ -65,4 +141,21 @@ $('.pop_up .pop_up_in img').click(function () {
 // 关闭弹窗
 $('.pop_up .pop_up_in .but').click(function () {
     $('.pop_up').hide();
-})
+})
+
+function timerFun () {
+    // 开启定时器
+    var timer = setInterval(function () {
+        // 判断剩余秒数
+        if (time == 0) {
+            // 清除定时器和复原按钮
+            clearInterval(timer);
+            $('.box .code .num').text('獲取驗證碼');
+            isClick = true;
+        } else {
+            $('.box .code .num').text(`${time}秒後重新獲取`);
+            time--;
+            isClick = false;
+        }
+    }, 1000);
+}