diff --git a/assets/lang/en.json b/assets/lang/en.json index b0cc355..14e3cb5 100644 --- a/assets/lang/en.json +++ b/assets/lang/en.json @@ -90,5 +90,13 @@ "Client Counts": "Client Counts", "Proxy Counts": "Proxy Counts", "Not Set": "Not Set", - "Proxy": "Proxies" + "Proxy": "Proxies", + "Username": "Username", + "Password": "Password", + "Login": "Login", + "Please input username": "Please input username", + "Please input password": "Please input password", + "Login success": "Login success", + "Username or password incorrect": "Username or password incorrect", + "Token invalid": "Token invalid" } \ No newline at end of file diff --git a/assets/lang/zh.json b/assets/lang/zh.json index 6440171..0b359be 100644 --- a/assets/lang/zh.json +++ b/assets/lang/zh.json @@ -90,5 +90,13 @@ "Client Counts": "客户端总数", "Proxy Counts": "代理总数", "Not Set": "未配置", - "Proxy": "代理数量" + "Proxy": "代理数量", + "Username": "用户名", + "Password": "密码", + "Login": "登录", + "Please input username": "请填写用户名", + "Please input password": "请填写密码", + "Login success": "登录成功", + "Username or password incorrect": "用户名或密码错误", + "Token invalid": "登录信息无效" } \ No newline at end of file diff --git a/assets/static/css/index-color.css b/assets/static/css/color.css similarity index 93% rename from assets/static/css/index-color.css rename to assets/static/css/color.css index ba48001..dcc7d9a 100644 --- a/assets/static/css/index-color.css +++ b/assets/static/css/color.css @@ -113,7 +113,17 @@ section.proxy-list .proxy-info .layui-row .layui-row > div:first-child { color: #99a9bf; } +.login-title, +.login-title a { + color: #333 !important; +} + @media (prefers-color-scheme: dark) { + .login-title, + .login-title a { + color: #99a9bf !important; + } + .layui-bg-blue { background-color: #395c74 !important; } @@ -154,6 +164,11 @@ section.proxy-list .proxy-info .layui-row .layui-row > div:first-child { border-color: #5f5f60; } + .layui-form-danger + .layui-form-select .layui-input, + .layui-form-danger:focus { + border-color: #ff5722 !important; + } + .layui-form-checkbox[lay-skin=primary]:hover > i { border-color: #5f5f60; } diff --git a/assets/static/css/index.css b/assets/static/css/index.css index 661b266..39e142a 100644 --- a/assets/static/css/index.css +++ b/assets/static/css/index.css @@ -47,6 +47,19 @@ section { height: 100%; padding: 0 15px; box-sizing: border-box; + display: flex; +} + +.layui-title #title { + flex: 1; + display: inline-block; +} + +.layui-title #logout{ + display: inline-block; + font-size: 20px; + font-weight: bold; + cursor: pointer; } .layui-nav.layui-nav-tree { diff --git a/assets/static/css/login.css b/assets/static/css/login.css new file mode 100644 index 0000000..ff9d37a --- /dev/null +++ b/assets/static/css/login.css @@ -0,0 +1,30 @@ +html, body { + width: 100%; + height: 100%; +} + +body { + display: flex; + flex-direction: column; + justify-content: center; +} + +.login-title { + text-align: center; + margin-bottom: 50px; +} + +.login-title .title-text { + font-size: 24px; + text-align: center; + font-weight: bold; +} + +.login-title .title-version { + font-size: 12px; +} + +.login-container { + width: 320px; + margin: 0 auto; +} \ No newline at end of file diff --git a/assets/static/js/index.js b/assets/static/js/index.js index 55b8dc5..351f299 100644 --- a/assets/static/js/index.js +++ b/assets/static/js/index.js @@ -1,26 +1,50 @@ var http_port, https_port; (function ($) { $(function () { - var langLoading = layui.layer.load() - $.getJSON('/lang.json').done(function (lang) { - layui.element.on('nav(leftNav)', function (elem) { - var id = elem.attr('id'); - var title = elem.text(); - if (id === 'serverInfo') { - loadServerInfo(lang, title.trim()); - } else if (id === 'userList') { - loadUserList(lang, title.trim()); - } else if (elem.closest('.layui-nav-item').attr('id') === 'proxyList') { - if (id != null && id.trim() !== '') { - var suffix = elem.closest('.layui-nav-item').children('a').text().trim(); - loadProxyInfo(lang, title + " " + suffix, id); - } - } - }); + function init() { + var langLoading = layui.layer.load() + $.getJSON('/lang.json').done(function (lang) { + $.ajaxSetup({ + error: function (xhr,) { + if (xhr.status === 401) { + layui.layer.msg(lang['TokenInvalid'], function () { + window.location.reload(); + }); + } + }, + }) - $('#leftNav .layui-this > a').click(); - }).always(function () { - layui.layer.close(langLoading); + layui.element.on('nav(leftNav)', function (elem) { + var id = elem.attr('id'); + var title = elem.text(); + if (id === 'serverInfo') { + loadServerInfo(lang, title.trim()); + } else if (id === 'userList') { + loadUserList(lang, title.trim()); + } else if (elem.closest('.layui-nav-item').attr('id') === 'proxyList') { + if (id != null && id.trim() !== '') { + var suffix = elem.closest('.layui-nav-item').children('a').text().trim(); + loadProxyInfo(lang, title + " " + suffix, id); + } + } + }); + + $('#leftNav .layui-this > a').click(); + }).always(function () { + layui.layer.close(langLoading); + }); + } + + function logout() { + $.get("/logout", function (result) { + window.location.reload(); + }); + } + + $(document).on('click.logout', '#logout', function () { + logout(); }); + + init(); }); })(layui.$); \ No newline at end of file diff --git a/assets/static/js/login.js b/assets/static/js/login.js new file mode 100644 index 0000000..2dfc2ea --- /dev/null +++ b/assets/static/js/login.js @@ -0,0 +1,34 @@ +(function ($) { + $(function () { + function login() { + if (!layui.form.validate('#loginForm')) { + return; + } + + $.ajax({ + url: "/login", + type: 'post', + data: { + username: $('#username').val(), + password: $('#password').val() + }, + success: function (result) { + if (result.success) { + document.cookie = 'token=' + result.token + ';path=/' + window.location.href = "/" + } else { + layui.layer.msg(result.message); + } + } + }); + } + + $(document).on('click.login', '#login', function () { + login(); + }).on('keydown', function (e) { + if (e.keyCode === 13) { + login(); + } + }); + }) +})(layui.$) \ No newline at end of file diff --git a/assets/templates/index.html b/assets/templates/index.html index 7cae6a5..fd23a47 100644 --- a/assets/templates/index.html +++ b/assets/templates/index.html @@ -5,7 +5,7 @@ - + @@ -27,7 +27,12 @@