From 9bbbba7b31316101b5b9736d70fbf4893cce8326 Mon Sep 17 00:00:00 2001 From: bobi Date: Fri, 1 Nov 2019 14:39:03 +0800 Subject: [PATCH] =?UTF-8?q?format:=E4=BB=A3=E7=A0=81?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- index.html | 277 ++++++++++++++++----------------- pages/forget.html | 368 +++++++++++++++++++++++--------------------- pages/login.html | 205 ++++++++++++------------ pages/register.html | 323 +++++++++++++++++++------------------- 4 files changed, 592 insertions(+), 581 deletions(-) diff --git a/index.html b/index.html index 4f1a60f..b395034 100644 --- a/index.html +++ b/index.html @@ -1,148 +1,151 @@ - - - ok-admin v2.0 | 很赞的后台模版 - - - - - - - - -
- -
- -
    - -
  • - - - -
  • -
  • - - - - - -
  • + + + ok-admin v2.0 | 很赞的后台模版 + + + + + + + + +
    + +
    + + +
    + +
    + +
    +
    + +
    + + + +

    你好!bobi, 欢迎登录

    +
    + +
    - -
    - -
    -
    - -
    - - - -

    你好!bobi, 欢迎登录

    -
    - - -
    -
    - - -
    -
    -
    -
    - - -
      -
    • - - 控制台 -
    • -
    - -
    -
    - -
    -
    -
    -
    - - -
    -
    - - - - + + +
    +
    +
    +
    + + +
      +
    • + + 控制台 +
    • +
    + +
    +
    + +
    +
    +
    +
    + + + +
    +
    + + + + diff --git a/pages/forget.html b/pages/forget.html index e69e17b..136a052 100644 --- a/pages/forget.html +++ b/pages/forget.html @@ -1,191 +1,201 @@ - - ok-admin v2.0 | 很赞的后台模版 - 注册 - - - - - - + + ok-admin v2.0 | 很赞的后台模版 - 忘记密码 + + + + + + -
    -
    -
    忘记密码
    -
    - - -
    -
    - - -
    -
    - - - -
    -
    - -
    - -
    +
    +
    +
    忘记密码
    +
    + + +
    +
    + + +
    +
    + + + +
    +
    + +
    + +
    -
    -
    设置密码
    -
    - - -
    -
    - - -
    -
    - -
    -
    -
    - - - + + /** + * 提交表单 + */ + form.on("submit(verifyUser)", function (data) { + okUtils.ajax("/verifyUser", "post", data.field, true).done(function (response) { + console.log(response); + okLayer.msg.greenTick(response.msg, function () { + // 样式修改 + $('.btn-auth-code').removeClass("layui-btn-disabled"); + $('.btn-auth-code').text("重新获取"); + // 重置定时器 + clearInterval(timer); + timer = ""; + intervalTime = 60; + // 显示重置密码表单 + $(".verify-user-form, .reset-password-form").toggle(); + }); + }).fail(function (error) { + console.log(error) + }); + return false; + }); + + /** + * 获取验证码 + */ + $('.btn-auth-code').click(function () { + let _this = $(this); + if (_this.hasClass("layui-btn-disabled")) { + return; + } + let phone = $("#phone").val(); + if (phoneRegex.test(phone)) { + _this.addClass("layui-btn-disabled"); + _this.text(intervalTime + "秒后获取"); + // 按钮操作定时器 + timer = setInterval(function () { + intervalTime--; + if (intervalTime < 1) { + clearInterval(timer); + _this.removeClass("layui-btn-disabled"); + _this.text("重新获取"); + intervalTime = 60; + } else { + _this.text(intervalTime + "秒后获取"); + } + }, 1000); + + // 发送手机验证码 + okUtils.ajax("/sendCaptcha", "post", null, true).done(function (response) { + console.log(response); + okLayer.msg.greenTick(response.msg); + }).fail(function (error) { + console.log(error) + }); + } else { + layer.msg("手机号码格式不正确", {icon: "5", anim: "6"}); + $("#phone").focus(); + } + }); + + /** + * 重置密码 + */ + form.on("submit(resetPassword)", function (data) { + okUtils.ajax("/resetPassword", "post", data.field, true).done(function (response) { + console.log(response); + okLayer.msg.greenTick(response.msg, function () { + window.location = "login.html"; + }); + }).fail(function (error) { + console.log(error) + }); + return false; + }); + + /** + * 表单input组件单击时 + */ + $("#login .input-item .layui-input").click(function (e) { + e.stopPropagation(); + $(this).addClass("layui-input-focus").find(".layui-input").focus(); + }); + + /** + * 表单input组件获取焦点时 + */ + $("#login .layui-form-item .layui-input").focus(function () { + $(this).parent().addClass("layui-input-focus"); + }); + + /** + * 表单input组件失去焦点时 + */ + $("#login .layui-form-item .layui-input").blur(function () { + $(this).parent().removeClass("layui-input-focus"); + if ($(this).val() != "") { + $(this).parent().addClass("layui-input-active"); + } else { + $(this).parent().removeClass("layui-input-active"); + } + }); + }); + diff --git a/pages/login.html b/pages/login.html index 1c77b9b..9db9e6b 100644 --- a/pages/login.html +++ b/pages/login.html @@ -1,110 +1,109 @@ - - - ok-admin v2.0 | 很赞的后台模版 - 登录 - - - - - - - -
    -
    - -
    - - -
    -
    - - -
    -
    - - -
    -
    -
    - -
    - -
    -
    - - - + - + + /** + * 表单提交 + */ + form.on("submit(login)", function (data) { + okUtils.ajax("/login", "post", data.field, true).done(function (response) { + console.log(response); + okLayer.msg.greenTick(response.msg, function () { + window.location = "../index.html"; + }) + }).fail(function (error) { + console.log(error) + }); + return false; + }); + + /** + * 表单input组件单击时 + */ + $("#login .input-item .layui-input").click(function (e) { + e.stopPropagation(); + $(this).addClass("layui-input-focus").find(".layui-input").focus(); + }); + + /** + * 表单input组件获取焦点时 + */ + $("#login .layui-form-item .layui-input").focus(function () { + $(this).parent().addClass("layui-input-focus"); + }); + + /** + * 表单input组件失去焦点时 + */ + $("#login .layui-form-item .layui-input").blur(function () { + $(this).parent().removeClass("layui-input-focus"); + if ($(this).val() != "") { + $(this).parent().addClass("layui-input-active"); + } else { + $(this).parent().removeClass("layui-input-active"); + } + }) + }); + + diff --git a/pages/register.html b/pages/register.html index 5196b65..1c17c8a 100644 --- a/pages/register.html +++ b/pages/register.html @@ -1,172 +1,171 @@ - - ok-admin v2.0 | 很赞的后台模版 - 注册 - - - - - - + + ok-admin v2.0 | 很赞的后台模版 - 注册 + + + + + + -
    -
    -
    注册
    -
    - - -
    -
    - - -
    -
    - - -
    -
    - - -
    -
    - - - -
    -
    - -
    - -
    -
    - - - + + /** + * 表单提交 + */ + form.on("submit(login)", function (data) { + okLayer.msg.greenTick("注册成功,去登陆", function () { + window.location = "./login.html"; + }); + return false; + }); + + /** + * 表单input组件单击时 + */ + $("#login .input-item .layui-input").click(function (e) { + e.stopPropagation(); + $(this).addClass("layui-input-focus").find(".layui-input").focus(); + }); + + /** + * 表单input组件获取焦点时 + */ + $("#login .layui-form-item .layui-input").focus(function () { + $(this).parent().addClass("layui-input-focus"); + }); + + /** + * 表单input组件失去焦点时 + */ + $("#login .layui-form-item .layui-input").blur(function () { + $(this).parent().removeClass("layui-input-focus"); + if ($(this).val() != "") { + $(this).parent().addClass("layui-input-active"); + } else { + $(this).parent().removeClass("layui-input-active"); + } + }); + + /**获取验证码**/ + $('.btn-auth-code').click(function () { + let that = $(this), + phone = $("#phone").val(); + if ($(this).hasClass("layui-btn-disabled")) { + return; + } + if (regPhone.test(phone)) { + if (!setInter) { + clearInterval(setInter); + that.addClass("layui-btn-disabled"); + that.text(second + "秒后获取"); + setInter = setInterval(function () { + second--; + if (second < 1) { + clearInterval(setInter); + that.removeClass("layui-btn-disabled"); + that.text("重新获取"); + setInter = ""; + second = 60; + } else { + that.text(second + "秒后获取"); + } + }, 1000); + } + } else { + layer.msg("输入的手机号格式不正确,请重新输入", { + icon: "5", + anim: "6", + }); + $("#phone").focus(); + } + }); + }); +