浏览代码

Merge pull request #1631 from sspanel-uim/dev

feat(theme/tabler): auth & password
M1Screw 3 年之前
父节点
当前提交
22331fb6bf

+ 55 - 187
resources/views/tabler/auth/login.tpl

@@ -1,208 +1,76 @@
-{include file='header.tpl'}
-
-<div class="authpage">
-    <div class="container">
-        <form action="javascript:void(0);" method="POST">
-            <div class="auth-main auth-row auth-col-one">
-                <div class="auth-top auth-row">
-                    <a class="boardtop-left" href="/">
-                        <div>首 页</div>
-                    </a>
-                    <div class="auth-logo">
-                        <img src="/images/uim-logo-round.png">
-                    </div>
-                    <a href="/auth/register" class="boardtop-right">
-                        <div>注 册</div>
-                    </a>
-                </div>
-                <div class="auth-row">
-                    <div class="form-group-label auth-row row-login">
-                        <label class="floating-label" for="email">邮箱</label>
-                        <input class="form-control maxwidth-auth" id="email" type="email" name="Email" inputmode="email" autocomplete="username">
+{include file='tabler_header.tpl'}
+
+<body class="border-top-wide border-primary d-flex flex-column">
+    <div class="page page-center">
+        <div class="container-tight py-4">
+            <div class="text-center mb-4">
+                <a href="#" class="navbar-brand navbar-brand-autodark">
+                    <img src="/images/uim-logo-round.png" height="64" alt="">
+                </a>
+            </div>
+            <div class="card card-md">
+                <div class="card-body">
+                    <h2 class="card-title text-center mb-4">登录到用户中心</h2>
+                    <div class="mb-3">
+                        <label class="form-label">注册邮箱</label>
+                        <input id="email" type="email" class="form-control">
                     </div>
-                </div>
-                <div class="auth-row">
-                    <div class="form-group-label auth-row row-login">
-                        <label class="floating-label" for="passwd">密码</label>
-                        <input class="form-control maxwidth-auth" id="passwd" type="password" name="Password" autocomplete="current-password">
+                    <div class="mb-2">
+                        <label class="form-label">
+                            登录密码
+                            <span class="form-label-description">
+                                <a href="/password/reset">忘记密码</a>
+                            </span>
+                        </label>
+                        <div class="input-group input-group-flat">
+                            <input id="passwd" type="password" class="form-control" autocomplete="off">
+                        </div>
                     </div>
-                </div>
-                <div class="auth-row">
-                    <div class="form-group-label auth-row row-login">
-                        <label class="floating-label" for="code">两步验证码(未设置请忽略)</label>
-                        <input class="form-control maxwidth-auth" id="code" type="number" name="Code" inputmode="numeric" autocomplete="one-time-code">
+                    <div class="mb-2">
+                        <label class="form-label">两步认证</label>
+                        <input id="code" type="email" class="form-control" placeholder="如果没有设置两步认证可留空">
                     </div>
-                </div>
-
-                {if $geetest_html != null}
-                    <div class="form-group-label labelgeetest auth-row">
-                        <div id="embed-captcha"></div>
+                    <div class="mb-2">
+                        <label class="form-check">
+                            <input id="remember_me" type="checkbox" class="form-check-input" />
+                            <span class="form-check-label">记住此设备</span>
+                        </label>
                     </div>
-                {/if}
-                {if $config['enable_login_captcha'] == true && $config['captcha_provider'] == 'turnstile'}
-                    <div class="form-group-label auth-row">
-                        <div class="row">
-                            <div align="center" class="cf-turnstile" data-sitekey="{$turnstile_sitekey}" data-theme="light"></div>
-                        </div>
+                    <div class="form-footer">
+                        <button id="login-dashboard" class="btn btn-primary w-100">登录</button>
                     </div>
-                {/if}
-
-                <div class="btn-auth auth-row">
-                    <button id="login" type="submit" class="btn btn-block btn-brand waves-attach waves-light">
-                        确认登录
-                    </button>
                 </div>
-                <div class="auth-help auth-row">
-                    <div class="auth-help-table auth-row">
-                        <div class="checkbox checkbox-adv">
-                            <label for="remember_me">
-                                <input class="access-hide" value="week" id="remember_me" name="remember_me"
-                                       type="checkbox">记住我</input>
-                                <span class="checkbox-circle"></span>
-                                <span class="checkbox-circle-check"></span>
-                                <span class="checkbox-circle-icon mdi mdi-check"></span>
-                            </label>
-                        </div>
-                        <a href="/password/reset">忘记密码?</a>
-                    </div>
-                </div>
-                {if $config['enable_telegram_login'] === true}
-                    <div class="auth-bottom auth-row">
-                        <div class="tgauth">
-                            <span>Telegram</span>
-                            <button class="btn" id="calltgauth"><i class="mdi mdi-send-circle icon-lg"></i></button>
-                            <span>快捷登录</span>
-                        </div>
-                    </div>
-                {/if}
             </div>
-        </form>
-        {if $config['enable_telegram_login'] === true}
-            {include file='./telegram_modal.tpl'}
-        {/if}
+            <div class="text-center text-muted mt-3">
+                还没有账户? <a href="/auth/register" tabindex="-1">点击注册</a>
+            </div>
+        </div>
     </div>
-</div>
-
-{include file='dialog.tpl'}
-
-{include file='footer.tpl'}
 
-{if $config['enable_telegram_login'] === true}
-    {include file='./telegram.tpl'}
-{/if}
-
-{literal}
     <script>
-        let calltgbtn = document.querySelector('#calltgauth');
-        let tgboard = document.querySelector('.card.auth-tg.cust-model');
-        if (calltgbtn && tgboard) {
-            custModal(calltgbtn, tgboard);
-        }
-    </script>
-{/literal}
-
-<script>
-    $(document).ready(function () {
-        function login() {
-            {if $geetest_html != null}
-            if (typeof validate === 'undefined' || !validate) {
-                $("#result").modal();
-                $$.getElementById('msg').innerHTML = '请滑动验证码来完成验证';
-                return;
-            }
-            {/if}
-
-            document.getElementById("login").disabled = true;
-
+        $("#login-dashboard").click(function() {
             $.ajax({
-                type: "POST",
-                url: location.pathname,
+                type: 'POST',
+                url: '/auth/login',
                 dataType: "json",
                 data: {
-                    {if $config['enable_login_captcha'] == true && $config['captcha_provider'] == 'turnstile'}
-                    turnstile: turnstile.getResponse(),
-                    {/if}
-                    {if $geetest_html != null}
-                    geetest_challenge: validate.geetest_challenge,
-                    geetest_validate: validate.geetest_validate,
-                    geetest_seccode: validate.geetest_seccode,
-                    {/if}
-                    code: $$getValue('code'),
-                    email: $$getValue('email'),
-                    passwd: $$getValue('passwd'),
-                    remember_me: $("#remember_me:checked").val()
+                    code: $('#code').val(),
+                    email: $('#email').val(),
+                    passwd: $('#passwd').val(),
+                    remember_me: $('#remember_me').val(),
                 },
-                success: (data) => {
+                success: function(data) {
                     if (data.ret == 1) {
-                        $("#result").modal();
-                        $$.getElementById('msg').innerHTML = data.msg;
-                        window.setTimeout("location.href='/user'", {$config['jump_delay']});
+                        $('#success-message').text(data.msg);
+                        $('#success-dialog').modal('show');
+                        setTimeout("window.location.href = '/user'", 1200);
                     } else {
-                        $("#result").modal();
-                        $$.getElementById('msg').innerHTML = data.msg;
-                        document.getElementById("login").disabled = false;
-                        {if $geetest_html != null}
-                        captcha.refresh();
-                        {/if}
+                        $('#fail-message').text(data.msg);
+                        $('#fail-dialog').modal('show');
                     }
-                },
-                error: (jqXHR) => {
-                    $("#msg-error").hide(10);
-                    $("#msg-error").show(100);
-                    $$.getElementById('msg').innerHTML = `发生错误:${
-                        jqXHR.status
-                    }`;
-                    document.getElementById("login").disabled = false;
-                    {if $geetest_html != null}
-                    captcha.refresh();
-                    {/if}
                 }
-            });
-        }
-
-        $("html").keydown(function (event) {
-            if (event.keyCode == 13) {
-                login();
-            }
-        });
-        $("#login").click(function () {
-            login();
-        });
-
-        $('div.modal').on('shown.bs.modal', function () {
-            $("div.gt_slider_knob").hide();
-        });
-
-        $('div.modal').on('hidden.bs.modal', function () {
-            $("div.gt_slider_knob").show();
+            })
         });
-    })
-</script>
-
-{if $geetest_html != null}
-    <script>
-        var handlerEmbed = function (captchaObj) {
-            // 将验证码加到id为captcha的元素里
-
-            captchaObj.onSuccess(function () {
-                validate = captchaObj.getValidate();
-            });
-
-            captchaObj.appendTo("#embed-captcha");
-
-            captcha = captchaObj;
-            // 更多接口参考:http://www.geetest.com/install/sections/idx-client-sdk.html
-        };
-
-        initGeetest({
-            gt: "{$geetest_html->gt}",
-            challenge: "{$geetest_html->challenge}",
-            product: "embed", // 产品形式,包括:float,embed,popup。注意只对PC版验证码有效
-            offline: {if $geetest_html->success}0{else}1{/if} // 表示用户后台检测极验服务器是否宕机,与SDK配合,用户一般不需要关注
-        }, handlerEmbed);
     </script>
-{/if}
 
-{if $config['enable_login_captcha'] == true && $config['captcha_provider'] == 'turnstile'}
-    <script src="https://challenges.cloudflare.com/turnstile/v0/api.js?compat=recaptcha" async defer></script>
-{/if}
+{include file='tabler_footer.tpl'}

+ 107 - 440
resources/views/tabler/auth/register.tpl

@@ -1,479 +1,146 @@
-{include file='header.tpl'}
-
-<div class="authpage auth-reg">
-    <div class="container">
-        <section class="content-inner">
-            <div class="auth-main auth-row">
-                <div class="auth-top auth-row">
-                    <a class="boardtop-left" href="/">
-                        <div>首 页</div>
-                    </a>
-                    <div class="auth-logo">
-                        <img src="/images/uim-logo-round.png">
-                    </div>
-                    <a href="/auth/login" class="boardtop-right">
-                        <div>登 录</div>
-                    </a>
-                </div>
-                {if $config['register_mode']!='close'}
-                    <div class="rowtocol">
-                        <div class="auth-row">
-                            <div class="form-group-label auth-row">
-                                <label class="floating-label" for="name">昵称</label>
-                                <input class="form-control maxwidth-auth" id="name" type="text">
-                            </div>
-                        </div>
-                    </div>
-                    <div class="rowtocol">
-                        <div class="auth-row">
-                            <div class="form-group-label auth-row">
-                                <label class="floating-label" for="email">邮箱(唯一凭证请认真对待)</label>
-                                <input class="form-control maxwidth-auth" id="email" type="email" maxlength="32" inputmode="email" autocomplete="username">
-                            </div>
+{include file='tabler_header.tpl'}
+
+<body class="border-top-wide border-primary d-flex flex-column">
+    <div class="page page-center">
+        <div class="container-tight py-4">
+            <div class="text-center mb-4">
+                <a href="#" class="navbar-brand navbar-brand-autodark">
+                    <img src="/images/uim-logo-round.png" height="64" alt="">
+                </a>
+            </div>
+            <div class="card card-md">
+                {if $config['register_mode'] != 'close'}
+                    <div class="card-body">
+                        <h2 class="card-title text-center mb-4">注册账户</h2>
+                        <div class="mb-3">
+                            <input id="name" type="text" class="form-control" placeholder="昵称">
                         </div>
-                    </div>
-                    <div class="rowtocol">
-                        <div class="auth-row">
-                            <div class="form-group-label auth-row">
-                                <label class="floating-label" for="passwd">密码</label>
-                                <input class="form-control maxwidth-auth" id="passwd" type="password" autocomplete="new-password">
-                                <p id="passwd-strong" style="text-align: left; margin: 3px; font-size: 80%"></p>
-                            </div>
+                        <div class="mb-3">
+                            <input id="email" type="email" class="form-control" placeholder="电子邮箱">
                         </div>
-                    </div>
-                    <div class="rowtocol">
-                        <div class="auth-row">
-                            <div class="form-group form-group-label">
-                                <label class="floating-label" for="repasswd">重复密码</label>
-                                <input class="form-control maxwidth-auth" id="repasswd" type="password" autocomplete="new-password">
+                        <div class="mb-3">
+                            <div class="input-group input-group-flat">
+                                <input id="passwd" type="password" class="form-control" placeholder="登录密码">
                             </div>
                         </div>
-                    </div>
-                    {if $config['enable_reg_im'] == true}
-                        <div class="rowtocol">
-                            <div class="auth-row">
-                                <div class="form-group form-group-label dropdown">
-                                    <label class="floating-label" for="im_type">选择您的联络方式</label>
-                                    <button class="form-control maxwidth-auth" id="im_type" data-toggle="dropdown">
-
-                                    </button>
-                                    <ul class="dropdown-menu" aria-labelledby="im_type">
-                                        <li><a href="#" class="dropdown-option" onclick="return false;" val="1"
-                                           data="im_type">微信</a></li>
-                                        <li><a href="#" class="dropdown-option" onclick="return false;" val="2"
-                                           data="im_type">QQ</a></li>
-                                        <li><a href="#" class="dropdown-option" onclick="return false;" val="4"
-                                           data="im_type">Telegram</a></li>
-                                        <li><a href="#" class="dropdown-option" onclick="return false;" val="5"
-                                               data="im_type">Discord</a></li>
-                                    </ul>
-                                </div>
+                        <div class="mb-3">
+                            <div class="input-group input-group-flat">
+                                <input id="repasswd" type="password" class="form-control" placeholder="重复登录密码">
                             </div>
                         </div>
-                        <div class="rowtocol">
-                            <div class="auth-row">
-                                <div class="form-group form-group-label">
-                                    <label class="floating-label" for="im_value">在这输入联络方式账号</label>
-                                    <input class="form-control maxwidth-auth" id="im_value" type="text">
-                                </div>
+                        {if $config['enable_reg_im'] == true}
+                            <div class="mb-3">
+                                <select id="im_type" class="col form-select">
+                                    <option value="0">请选择社交软件</option>
+                                    <option value="1">微信</option>
+                                    <option value="2">QQ</option>
+                                    <option value="4">Telegram</option>
+                                    <option value="5">Discord</option>
+                                </select>
                             </div>
-                        </div>
-                    {/if}
-                    {if $config['register_mode'] == 'invite'}
-                        <div class="rowtocol">
-                            <div class="auth-row">
-                                <div class="form-group form-group-label">
-                                    <label class="floating-label" for="code">邀请码(必填)</label>
-                                    <input class="form-control maxwidth-auth" id="code" type="text">
+                            <div class="mb-3">
+                                <div class="input-group input-group-flat">
+                                    <input id="im_value" type="text" class="form-control" placeholder="社交账号">
                                 </div>
                             </div>
-                        </div>
-                    {/if}
-                    {if $enable_email_verify == true}
-                        <div class="rowtocol">
-                            <div class="rowtocol">
-                                <div class="form-group form-group-label">
-                                    <label class="floating-label" for="email_code">邮箱验证码</label>
-                                    <input class="form-control maxwidth-auth" id="email_code" type="text"
-                                           onKeypress="javascript:if(event.keyCode == 32)event.returnValue = false;" autocomplete="one-time-code">
+                        {/if}
+                        {if $config['register_mode'] != 'close' }
+                            <div class="mb-3">
+                                <div class="input-group input-group-flat">
+                                    <input id="code" type="text" class="form-control" placeholder="注册邀请码{if $config['register_mode'] == 'open'}(可选){else}(必填){/if}" value="{$code}">
                                 </div>
                             </div>
-                            <div class="rowtocol">
-                                <div class="form-group form-group-label">
-                                    <button id="email_verify"
-                                            class="btn-reg btn btn-block btn-brand-accent waves-attach waves-light">
-                                        获取验证码
-                                    </button>
-                                    <a href="" onclick="return false;" data-toggle='modal'
-                                       data-target='#email_nrcy_modal'
-                                       class="auth-help-reg">收不到验证码?</a>
+                        {/if}
+                        {if $config['enable_email_verify'] == true}
+                            <div class="mb-3">
+                                <div class="input-group mb-2">
+                                    <input id="emailcode" type="text" class="form-control" placeholder="邮箱验证码">
+                                    <button id="email-verify" class="btn text-blue" type="button">获取</button>
                                 </div>
                             </div>
+                        {/if}
+                        <div class="mb-3">
+                            <label class="form-check">
+                                <input id="tos" type="checkbox" class="form-check-input" />
+                                <span class="form-check-label">
+                                    我已阅读并同意 <a href="/tos" tabindex="-1"> 服务条款与隐私政策 </a>
+                                </span>
+                            </label>
                         </div>
-                    {/if}
-                    {if $geetest_html != null}
-                        <div class="rowtocol">
-                            <div class="form-group form-group-label">
-                                <div id="embed-captcha"></div>
-                            </div>
-                        </div>
-                    {/if}
-                    {if $config['enable_reg_captcha'] == true && $config['captcha_provider'] == 'turnstile'}
-                        <div class="form-group form-group-label">
-                            <div class="row">
-                                <div align="center" class="cf-turnstile" data-sitekey="{$turnstile_sitekey}" data-theme="light"></div>
-                            </div>
-                        </div>
-                    {/if}
-                    <div class="rowtocol">
-                        <div class="btn-auth auth-row">
-                            <button id="tos" type="submit"
-                                    class="btn-reg btn btn-block btn-brand waves-attach waves-light">确认注册
-                            </button>
+                        <div class="form-footer">
+                            <button id="confirm-register" type="submit" class="btn btn-primary w-100">注册新账户</button>
                         </div>
                     </div>
                 {else}
-                    <div class="form-group">
-                        <p>{$config['appName']} 已停止新用户注册,请联系网站管理员</p>
+                    <div class="card-body">
+                        <p>还没有开放注册,过两天再来看看吧</p>
                     </div>
                 {/if}
-                <div class="auth-bottom auth-row auth-reg">
-                    <div class="tgauth">
-
-                        <p>注册即代表同意<a href="/tos">服务条款</a>,以及保证所录入信息的真实性,如有不实信息会导致账号被删除。</p>
-
-                    </div>
-                </div>
-            </div>
-        </section>
-    </div>
-</div>
-
-<div aria-hidden="true" class="modal modal-va-middle fade" id="tos_modal" role="dialog" tabindex="-1">
-    <div class="modal-dialog">
-        <div class="modal-content">
-            <div class="modal-heading">
-                <h2 class="modal-title">注册 TOS</h2>
-            </div>
-            <div class="modal-inner">
-                {include file='reg_tos.tpl'}
             </div>
-            <div class="modal-footer">
-                <p class="text-right">
-                    <button class="btn btn-flat btn-brand-accent waves-attach waves-effect"
-                            data-dismiss="modal" type="button" id="cancel">我不同意
-                    </button>
-                    <button class="btn btn-flat btn-brand-accent waves-attach waves-effect" data-dismiss="modal"
-                            id="reg"
-                            type="button">我同意
-                    </button>
-                </p>
+            <div class="text-center text-muted mt-3">
+                已有账户? <a href="/auth/login" tabindex="-1">点击登录</a>
             </div>
         </div>
     </div>
-</div>
 
-<div aria-hidden="true" class="modal modal-va-middle fade" id="email_nrcy_modal" role="dialog" tabindex="-1">
-    <div class="modal-dialog">
-        <div class="modal-content">
-            <div class="modal-heading">
-                <h2 class="modal-title">收不到验证码?</h2>
-            </div>
-            <div class="modal-inner">
-                {include file='email_nrcy.tpl'}
-            </div>
-            <div class="modal-footer">
-                <p class="text-right">
-                    <button class="btn btn-flat btn-brand-accent waves-attach waves-effect" data-dismiss="modal"
-                            type="button">我知道了
-                    </button>
-                </p>
-            </div>
-        </div>
-    </div>
-</div>
-
-<div class="tiphidden"></div>
-
-{include file='dialog.tpl'}
-
-{include file='footer.tpl'}
-
-<script>
-const checkStrong = (sValue) => {
-    let modes = 0;
-    if (sValue.length < 7) return modes;
-    if (/\d/.test(sValue)) modes++;
-    if (/[a-z]/.test(sValue)) modes++;
-    if (/[A-Z]/.test(sValue)) modes++;
-    if (/\W/.test(sValue)) modes++;
-
-    switch (modes) {
-        case 1:
-            return 1;
-            break;
-        case 2:
-            return 2;
-        case 3:
-        case 4:
-            return sValue.length < 12 ? 3 : 4
-            break;
-    }
-}
-
-const showStrong = () => {
-    const password = document.getElementById('passwd').value;
-    const $passwordStrongEl = document.getElementById('passwd-strong');
-    const strong = checkStrong(password);
-    if (strong = 0) {
-        $passwordStrongEl.innerHTML = '需大于 8 位;推荐使用包含大小写字母、数字、符号的密码';
-    } else if (strong = 1) {
-        $passwordStrongEl.innerHTML = '你的密码强度为: <span style="color: red; font-weight: bold">非常弱</span>';
-    } else if (strong = 2) {
-        $passwordStrongEl.innerHTML = '你的密码强度为: <span style="color: red; font-weight: bold">弱</span>';
-    } else if (strong = 3) {
-        $passwordStrongEl.innerHTML = '你的密码强度为: <span style="color: yellow; font-weight: bold">中等</span>';
-    } else if (strong = 4) {
-        $passwordStrongEl.innerHTML = '你的密码强度为: <span style="color: green; font-weight: bold">强</span>';
-    }
-}
-
-document.getElementById('passwd').addEventListener('input', checkStrong);
-</script>
-
-{if $config['register_mode']!='close'}
     <script>
-        $(document).ready(function () {
-            function register() {
-                {if $config['register_mode'] == 'invite'}
-                code = $$getValue('code');
-                {else}
-                code = 0;
-                if ((getCookie('code')) != '') {
-                    code = getCookie('code');
-                }
-                {/if}
-                document.getElementById("tos").disabled = true;
-
+        {if $config['enable_email_verify'] == true}
+            $("#email-verify").click(function() {
                 $.ajax({
-                    type: "POST",
-                    url: location.pathname,
+                    type: 'POST',
+                    url: '/auth/send',
                     dataType: "json",
                     data: {
-                        {if $config['enable_reg_captcha'] == true && $config['captcha_provider'] == 'turnstile'}
-                        turnstile: turnstile.getResponse(),
-                        {/if}
-                        {if $geetest_html != null}
-                        geetest_challenge: validate.geetest_challenge,
-                        geetest_validate: validate.geetest_validate,
-                        geetest_seccode: validate.geetest_seccode,
-                        {/if}
-                        {if $config['enable_reg_im'] == true}
-                        im_value: $$getValue('im_value'),
-                        im_type: $$getValue('im_type'),
-                        {/if}
-                        {if $enable_email_verify == true}
-                        emailcode: $$getValue('email_code'),
-                        {/if}
-                        code,
-                        name: $$getValue('name'),
-                        email: $$getValue('email'),
-                        passwd: $$getValue('passwd'),
-                        repasswd: $$getValue('repasswd')
+                        email: $('#email').val(),
                     },
-                    success: (data) => {
+                    success: function(data) {
                         if (data.ret == 1) {
-                            $("#result").modal();
-                            $$.getElementById('msg').innerHTML = data.msg;
-                            window.setTimeout("location.href='/user'", {$config['jump_delay']});
+                            $('#success-message').text(data.msg);
+                            $('#success-dialog').modal('show');
                         } else {
-                            $("#result").modal();
-                            $$.getElementById('msg').innerHTML = data.msg;
-                            setCookie('code', '', 0);
-                            $("#code").val(getCookie('code'));
-                            document.getElementById("tos").disabled = false;
-                            {if $geetest_html != null}
-                            captcha.refresh();
-                            {/if}
+                            $('#fail-message').text(data.msg);
+                            $('#fail-dialog').modal('show');
                         }
-                    },
-                    error: (jqXHR) => {
-                        $("#msg-error").hide(10);
-                        $("#msg-error").show(100);
-                        $$.getElementById('msg-error-p').innerHTML = `发生错误:${
-                                jqXHR.status
-                                }`;
-                        document.getElementById("tos").disabled = false;
-                        {if $geetest_html != null}
-                        captcha.refresh();
-                        {/if}
                     }
-                });
-            }
-
-            $("html").keydown(function (event) {
-                if (event.keyCode == 13) {
-                    $("#tos_modal").modal();
-                }
-            });
-
-            {if $geetest_html != null}
-            $('div.modal').on('shown.bs.modal', function () {
-                $("div.gt_slider_knob").hide();
-            });
-
-
-            $('div.modal').on('hidden.bs.modal', function () {
-                $("div.gt_slider_knob").show();
-            });
-
-
-            {/if}
-
-            $("#reg").click(function () {
-                register();
-            });
-
-            $("#tos").click(function () {
-                {if $geetest_html != null}
-                if (typeof validate === 'undefined' || !validate) {
-                    $("#result").modal();
-                    $$.getElementById('msg').innerHTML = '请滑动验证码来完成验证'
-                    return;
-                }
-
-                {/if}
-                $("#tos_modal").modal();
+                })
             });
-        })
-    </script>
-{/if}
-
-{if $enable_email_verify == true}
-    <script>
-        var wait = 60;
-
-        function time(o) {
-            if (wait == 0) {
-                o.removeAttr("disabled");
-                o.text("获取验证码");
-                wait = 60;
-            } else {
-                o.attr("disabled", "disabled");
-                o.text("重新发送(" + wait + ")");
-                wait--;
-                setTimeout(function () {
-                            time(o)
-                        },
-                        1000)
-            }
-        }
-
-        $(document).ready(function () {
-            $("#email_verify").click(function () {
-                time($("#email_verify"));
-
-                $.ajax({
-                    type: "POST",
-                    url: "send",
-                    dataType: "json",
-                    data: {
-                        email: $$getValue('email')
-                    },
-                    success: (data) => {
-                        if (data.ret) {
-                            $("#result").modal();
-                            $$.getElementById('msg').innerHTML = data.msg;
-
-                        } else {
-                            $("#result").modal();
-                            $$.getElementById('msg').innerHTML = data.msg;
-                        }
-                    },
-                    error: (jqXHR) => {
-                        $("#result").modal();
-                        $$.getElementById('msg').innerHTML = `${
-                                data.msg
-                                } 出现了一些错误`;
+        {/if}
+
+        $("#confirm-register").click(function() {
+            $.ajax({
+                type: 'POST',
+                url: '/auth/register',
+                dataType: "json",
+                data: {
+                    {if $config['enable_reg_im'] == true}
+                        im_value: $('#im_value').val(),
+                        im_type: $('#im_type').val(),
+                    {/if}
+                    {if $config['enable_email_verify'] == true}
+                        emailcode: $('#emailcode').val(),
+                    {/if}
+                    tos: $('#tos').prop('checked'), // true / false (string)
+                    code: $('#code').val(),
+                    name: $('#name').val(),
+                    email: $('#email').val(),
+                    passwd: $('#passwd').val(),
+                    repasswd: $('#repasswd').val(),
+                },
+                success: function(data) {
+                    if (data.ret == 1) {
+                        $('#success-message').text(data.msg);
+                        $('#success-dialog').modal('show');
+                    } else {
+                        $('#fail-message').text(data.msg);
+                        $('#fail-dialog').modal('show');
                     }
-                })
+                }
             })
-        })
-    </script>
-{/if}
-
-{if $geetest_html != null}
-    <script>
-        var handlerEmbed = function (captchaObj) {
-            // 将验证码加到id为captcha的元素里
-
-            captchaObj.onSuccess(function () {
-                validate = captchaObj.getValidate();
-            });
-
-            captchaObj.appendTo("#embed-captcha");
+        });
 
-            captcha = captchaObj;
-            // 更多接口参考:http://www.geetest.com/install/sections/idx-client-sdk.html
-        };
-
-        initGeetest({
-            gt: "{$geetest_html->gt}",
-            challenge: "{$geetest_html->challenge}",
-            product: "embed", // 产品形式,包括:float,embed,popup。注意只对PC版验证码有效
-            offline: {if $geetest_html->success}0{else}1{/if} // 表示用户后台检测极验服务器是否宕机,与SDK配合,用户一般不需要关注
-        }, handlerEmbed);
+        $("#success-confirm").click(function() {
+            location.reload();
+        });
     </script>
-{/if}
-
-{if $config['enable_reg_captcha'] == true && $config['captcha_provider'] == 'turnstile'}
-    <script src="https://challenges.cloudflare.com/turnstile/v0/api.js?compat=recaptcha" async defer></script>
-{/if}
-
-{*dumplin:aff链*}
-<script>
-    {*dumplin:轮子1.js读取url参数*}
-    function getQueryVariable(variable) {
-        var query = window.location.search.substring(1);
-        var vars = query.split("&");
-        for (var i = 0; i < vars.length; i++) {
-            var pair = vars[i].split("=");
-            if (pair[0] == variable) {
-                return pair[1];
-            }
-        }
-        return "";
-    }
-
-    {*dumplin:轮子2.js写入cookie*}
-    function setCookie(cname, cvalue, exdays) {
-        var d = new Date();
-        d.setTime(d.getTime() + (exdays * 24 * 60 * 60 * 1000));
-        var expires = "expires=" + d.toGMTString();
-        document.cookie = cname + "=" + cvalue + "; " + expires;
-    }
-
-    {*dumplin:轮子3.js读取cookie*}
-    function getCookie(cname) {
-        var name = cname + "=";
-        var ca = document.cookie.split(';');
-        for (var i = 0; i < ca.length; i++) {
-            var c = ca[i].trim();
-            if (c.indexOf(name) == 0) return c.substring(name.length, c.length);
-        }
-        return "";
-    }
-
-    {*dumplin:读取url参数写入cookie,自动跳转隐藏url邀请码*}
-    if (getQueryVariable('code') != '') {
-        setCookie('code', getQueryVariable('code'), 30);
-        window.location.href = '/auth/register';
-    }
 
-    {if $config['register_mode'] == 'invite'}
-    {*dumplin:读取cookie,自动填入邀请码框*}
-    if ((getCookie('code')) != '') {
-        $("#code").val(getCookie('code'));
-    }
-    {/if}
-</script>
+{include file='tabler_footer.tpl'}

+ 43 - 93
resources/views/tabler/password/reset.tpl

@@ -1,111 +1,61 @@
-{include file='header.tpl'}
-
-<!-- 新的 -->
-<div class="authpage">
-    <div class="container">
-
-        <div class="auth-main auth-row auth-col-one">
-            <div class="auth-top auth-row">
-                <a class="boardtop-left" href="/">
-                    <div>首 页</div>
-                </a>
-                <div class="auth-logo">
-                    <img src="/images/uim-logo-round.png">
-                </div>
-                <a href="/auth/login" class="boardtop-right">
-                    <div>登 录</div>
+{include file='tabler_header.tpl'}
+
+<body class="border-top-wide border-primary d-flex flex-column">
+    <div class="page page-center">
+        <div class="container-tight py-4">
+            <div class="text-center mb-4">
+                <a href="#" class="navbar-brand navbar-brand-autodark">
+                    <img src="/images/uim-logo-round.png" height="64" alt="">
                 </a>
             </div>
-            <div class="auth-row">
-                <div class="form-group-label auth-row row-login">
-                    <label class="floating-label" for="email">邮箱</label>
-                    <input class="form-control maxwidth-auth" id="email" type="email" inputmode="email" autocomplete="username">
-                </div>
-            </div>
-
-            <div class="btn-auth auth-row">
-                <button id="reset" type="submit" class="btn btn-block btn-brand waves-attach waves-light">重置密码</button>
-            </div>
-            <div class="auth-help auth-row">
-                <div class="auth-help-table auth-row auth-reset">
-                    <a href="" onclick="return false;" data-toggle='modal'
-                       data-target='#email_nrcy_modal'>收不到验证码?点击这里</a>
-                </div>
-            </div>
-            <div class="auth-bottom auth-row auth-reset">
-                <div class="tgauth">
-                    <p>请妥善保管好自己的登录密码</p>
+            <div class="card card-md">
+                <div class="card-body">
+                    <h2 class="card-title text-center mb-4">忘记密码</h2>
+                    <p class="text-muted mb-4">
+                        我们将向你的注册邮箱发送一封邮件,邮件内容中包含一个可以重设密码的链接
+                    </p>
+                    <div class="mb-3">
+                        <label class="form-label">注册邮箱</label>
+                        <input id="email" type="email" class="form-control">
+                    </div>
+                    <div class="form-footer">
+                        <button id="send" class="btn btn-primary w-100">
+                            <i class="ti ti-brand-telegram icon"></i>
+                            发送邮件
+                        </button>
+                    </div>
                 </div>
             </div>
         </div>
-
-        <div class="card auth-tg">
-            <div class="card-main"></div>
+        <div class="text-center text-muted mt-3">
+            已有账户? <a href="/auth/login" tabindex="-1">点击登录</a>
         </div>
     </div>
-</div>
-
-{include file='dialog.tpl'}
 
-<div aria-hidden="true" class="modal modal-va-middle fade" id="email_nrcy_modal" role="dialog" tabindex="-1">
-    <div class="modal-dialog">
-        <div class="modal-content">
-            <div class="modal-heading">
-                <h2 class="modal-title">收不到验证码?</h2>
-            </div>
-            <div class="modal-inner">
-                {include file='email_nrcy.tpl'}
-            </div>
-            <div class="modal-footer">
-                <p class="text-right">
-                    <button class="btn btn-flat btn-brand-accent waves-attach waves-effect" data-dismiss="modal"
-                            type="button">
-                        我知道了
-                    </button>
-                </p>
-            </div>
-        </div>
-    </div>
-</div>
-
-{include file='footer.tpl'}
-
-<script>
-    $(document).ready(function () {
-        function reset() {
-            $("#result").modal();
-            $$.getElementById('msg').innerHTML = '发送中,请等待'
+    <script>
+        $("#send").click(function() {
             $.ajax({
-                type: "POST",
-                url: location.pathname,
+                type: 'POST',
+                url: '/password/reset',
                 dataType: "json",
                 data: {
-                    email: $$getValue('email'),
+                    email: $('#email').val(),
                 },
-                success: (data) => {
+                success: function(data) {
                     if (data.ret == 1) {
-                        $("#result").modal();
-                        $$.getElementById('msg').innerHTML = data.msg;
-                        window.setTimeout("location.href='/auth/login'", 2000);
+                        $('#success-message').text(data.msg);
+                        $('#success-dialog').modal('show');
                     } else {
-                        $("#result").modal();
-                        $$.getElementById('msg').innerHTML = data.msg;
+                        $('#fail-message').text(data.msg);
+                        $('#fail-dialog').modal('show');
                     }
-                },
-                error: (jqXHR) => {
-                    $("#result").modal();
-                    $$.getElementById('msg').innerHTML = data.msg;
                 }
-            });
-        }
-
-        $("html").keydown(function (event) {
-            if (event.keyCode === 13) {
-                reset();
-            }
+            })
         });
-        $("#reset").click(function () {
-            reset();
+
+        $("#success-confirm").click(function() {
+            location.reload();
         });
-    })
-</script>
+    </script>
+
+{include file='tabler_footer.tpl'}

+ 47 - 82
resources/views/tabler/password/token.tpl

@@ -1,101 +1,66 @@
-{include file='header.tpl'}
+{include file='tabler_header.tpl'}
 
-<!-- 新的 -->
-<div class="authpage">
-    <div class="container">
-
-        <div class="auth-main auth-row auth-col-one">
-            <div class="auth-top auth-row">
-                <a class="boardtop-left" href="/">
-                    <div>首 页</div>
-                </a>
-                <div class="auth-logo">
-                    <img src="/images/uim-logo-round.png">
-                </div>
-                <a href="/auth/login" class="boardtop-right">
-                    <div>登 录</div>
+<body class="border-top-wide border-primary d-flex flex-column">
+    <div class="page page-center">
+        <div class="container-tight py-4">
+            <div class="text-center mb-4">
+                <a href="#" class="navbar-brand navbar-brand-autodark">
+                    <img src="/images/uim-logo-round.png" height="64" alt="">
                 </a>
             </div>
-            <div class="auth-row">
-                <div class="form-group-label auth-row row-login">
-                    <label class="floating-label" for="password">密码</label>
-                    <input class="form-control maxwidth-auth" id="password" type="password">
-                </div>
-            </div>
-            <div class="auth-row">
-                <div class="form-group-label auth-row row-login">
-                    <label class="floating-label" for="repasswd">重复密码</label>
-                    <input class="form-control maxwidth-auth" id="repasswd" type="password">
-                </div>
-            </div>
-
-            <div class="btn-auth auth-row">
-                <button id="reset" type="submit" class="btn btn-block btn-brand waves-attach waves-light">重置密码</button>
-            </div>
-            <div class="auth-help auth-row">
-                <div class="auth-help-table auth-row auth-reset">
-                    <a href="/auth/register">甚至想要重新注册</a>
-                </div>
-            </div>
-            <div class="auth-bottom auth-row auth-reset">
-                <div class="tgauth">
-                    <p>请妥善保管好自己的登录密码</p>
+            <div class="card card-md">
+                <div class="card-body">
+                    <h2 class="card-title text-center mb-4">设置新密码</h2>
+                    <p class="text-muted mb-4">
+                        请在下方设置账户新的登录密码
+                    </p>
+                    <div class="mb-3">
+                        <label class="form-label">新密码</label>
+                        <input id="password" type="password" class="form-control" placeholder="请输入新密码">
+                    </div>
+                    <div class="mb-3">
+                        <label class="form-label">再次输入新密码</label>
+                        <input id="repasswd" type="password" class="form-control" placeholder="请再次输入新密码">
+                    </div>
+                    <div class="form-footer">
+                        <button id="reset" class="btn btn-primary w-100">
+                        <i class="ti ti-key icon"></i>
+                            重置
+                        </button>
+                    </div>
                 </div>
             </div>
         </div>
-
-        <div class="card auth-tg">
-            <div class="card-main">
-
-            </div>
+        <div class="text-center text-muted mt-3">
+            已有账户? <a href="/auth/login" tabindex="-1">点击登录</a>
         </div>
     </div>
-</div>
-
-{include file='dialog.tpl'}
 
-{include file='footer.tpl'}
-
-<script>
-    $(document).ready(function () {
-        function reset() {
+    <script>
+        $("#reset").click(function() {
             $.ajax({
-                type: "POST",
+                type: 'POST',
                 url: location.pathname,
                 dataType: "json",
                 data: {
-                    password: $$getValue('password'),
-                    repasswd: $$getValue('repasswd'),
+                    password: $('#password').val(),
+                    repasswd: $('#repasswd').val(),
                 },
-                success: (data) => {
-                    if (data.ret) {
-                        $("#result").modal();
-                        $$.getElementById('msg').innerHTML = data.msg;
-                        window.setTimeout("location.href='/auth/login'", {$config['jump_delay']});
+                success: function(data) {
+                    if (data.ret == 1) {
+                        $('#success-message').text(data.msg);
+                        $('#success-dialog').modal('show');
                     } else {
-                        $("#result").modal();
-                        $$.getElementById('msg').innerHTML = data.msg;
+                        $('#fail-message').text(data.msg);
+                        $('#fail-dialog').modal('show');
                     }
-                },
-                error: (jqXHR) => {
-                    $("#msg-error").hide(10);
-                    $("#msg-error").show(100);
-                    $$.getElementById('msg-error-p').innerHTML = `发生错误:${
-                            jqXHR.status
-                            }`;
-                    // 在控制台输出错误信息
-                    //console.log(removeHTMLTag(jqXHR.responseText));
                 }
-            });
-        }
-
-        $("html").keydown(function (event) {
-            if (event.keyCode == 13) {
-                reset();
-            }
+            })
         });
-        $("#reset").click(function () {
-            reset();
+
+        $("#success-confirm").click(function() {
+            window.location.href = '/auth/login';
         });
-    })
-</script>
+    </script>
+
+{include file='tabler_footer.tpl'}

+ 52 - 0
resources/views/tabler/tabler_footer.tpl

@@ -0,0 +1,52 @@
+<div class="modal modal-blur fade" id="success-dialog" tabindex="-1" role="dialog" aria-hidden="true">
+    <div class="modal-dialog modal-sm modal-dialog-centered" role="document">
+        <div class="modal-content">
+            <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
+            <div class="modal-status bg-success"></div>
+            <div class="modal-body text-center py-4">
+                <i class="ti ti-circle-check icon mb-2 text-green icon-lg" style="font-size:3.5rem;"></i>
+                <p id="success-message" class="text-muted">成功</p>
+            </div>
+            <div class="modal-footer">
+                <div class="w-100">
+                    <div class="row">
+                        <div class="col">
+                            <a id="success-confirm" href="" class="btn w-100" data-bs-dismiss="modal">
+                                好
+                            </a>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </div>
+</div>
+
+<div class="modal modal-blur fade" id="fail-dialog" tabindex="-1" role="dialog" aria-hidden="true">
+    <div class="modal-dialog modal-sm modal-dialog-centered" role="document">
+        <div class="modal-content">
+            <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
+            <div class="modal-status bg-danger"></div>
+            <div class="modal-body text-center py-4">
+                <i class="ti ti-circle-x icon mb-2 text-danger icon-lg" style="font-size:3.5rem;"></i>
+                <p id="fail-message" class="text-muted">失败</p>
+            </div>
+            <div class="modal-footer">
+                <div class="w-100">
+                    <div class="row">
+                        <div class="col">
+                            <a href="" class="btn btn-danger w-100" data-bs-dismiss="modal">
+                                确认
+                            </a>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </div>
+</div>
+
+<script src="//fastly.jsdelivr.net/npm/@tabler/core@latest/dist/js/tabler.min.js"></script>
+</body>
+
+</html>

+ 19 - 0
resources/views/tabler/tabler_header.tpl

@@ -0,0 +1,19 @@
+<!doctype html>
+<html lang="zh">
+
+<head>
+    <meta charset="utf-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover" />
+    <meta content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" name="viewport" />
+    <meta http-equiv="X-UA-Compatible" content="ie=edge" />
+    <title>{$config['appName']}</title>
+    <!-- CSS files -->
+    <link href="//fastly.jsdelivr.net/npm/@tabler/core@latest/dist/css/tabler.min.css" rel="stylesheet" />
+    <link href="//fastly.jsdelivr.net/npm/@tabler/core@latest/dist/css/tabler-flags.min.css" rel="stylesheet" />
+    <link href="//fastly.jsdelivr.net/npm/@tabler/core@latest/dist/css/tabler-payments.min.css" rel="stylesheet" />
+    <link href="//fastly.jsdelivr.net/npm/@tabler/core@latest/dist/css/tabler-vendors.min.css" rel="stylesheet" />
+    <link href="//fastly.jsdelivr.net/npm/@tabler/icons@latest/iconfont/tabler-icons.min.css" rel="stylesheet" />
+    <!-- JS files -->
+    <script src="/assets/js/fuck.min.js"></script>
+    <script src="//cdn.staticfile.org/jquery/3.6.1/jquery.min.js"></script>
+</head>