!32 增加功能:登录页面功能可配置

* feat: 增加登录设置UI
* db: 增加登录配置初始化脚本
This commit is contained in:
Argo 2019-09-20 23:51:49 +08:00
parent 0af6d86390
commit e82bd0e809
18 changed files with 201 additions and 117 deletions

View File

@ -257,5 +257,17 @@
"Name": "卡片标题状态",
"Code": "1",
"Define": NumberInt(0)
},
{
"Category": "网站设置",
"Name": "短信验证码登录",
"Code": "1",
"Define": NumberInt(0)
},
{
"Category": "网站设置",
"Name": "OAuth 认证登录",
"Code": "1",
"Define": NumberInt(0)
}
];

View File

@ -33,6 +33,10 @@ INSERT INTO Dicts (Category, Name, Code, Define) VALUES ('网站设置', '前台
INSERT INTO Dicts (Category, Name, Code, Define) VALUES ('网站设置', '侧边栏状态', '1', 0);
INSERT INTO Dicts (Category, Name, Code, Define) VALUES ('网站设置', '卡片标题状态', '1', 0);
-- 登录配置
INSERT INTO Dicts (Category, Name, Code, Define) VALUES ('网站设置', '短信验证码登录', '1', 0);
INSERT INTO Dicts (Category, Name, Code, Define) VALUES ('网站设置', 'OAuth 认证登录', '1', 0);
-- 时长单位 月
INSERT INTO Dicts (Category, Name, Code, Define) VALUES ('系统设置', '程序异常保留时长', '1', 0);
INSERT INTO Dicts (Category, Name, Code, Define) VALUES ('系统设置', '操作日志保留时长', '12', 0);

View File

@ -33,6 +33,10 @@ INSERT INTO Dicts (Category, Name, Code, Define) VALUES ('网站设置', '前台
INSERT INTO Dicts (Category, Name, Code, Define) VALUES ('网站设置', '侧边栏状态', '1', 0);
INSERT INTO Dicts (Category, Name, Code, Define) VALUES ('网站设置', '卡片标题状态', '1', 0);
-- 登录配置
INSERT INTO Dicts (Category, Name, Code, Define) VALUES ('网站设置', '短信验证码登录', '1', 0);
INSERT INTO Dicts (Category, Name, Code, Define) VALUES ('网站设置', 'OAuth 认证登录', '1', 0);
-- 时长单位 月
INSERT INTO Dicts (Category, Name, Code, Define) VALUES ('系统设置', '程序异常保留时长', '1', 0);
INSERT INTO Dicts (Category, Name, Code, Define) VALUES ('系统设置', '操作日志保留时长', '12', 0);

View File

@ -33,6 +33,10 @@ INSERT INTO [Dicts] ([Category], [Name], [Code], [Define]) VALUES ('网站设置
INSERT INTO [Dicts] ([Category], [Name], [Code], [Define]) VALUES ('网站设置', '侧边栏状态', '1', 0);
INSERT INTO [Dicts] ([Category], [Name], [Code], [Define]) VALUES ('网站设置', '卡片标题状态', '1', 0);
-- 登录配置
INSERT INTO [Dicts] ([Category], [Name], [Code], [Define]) VALUES ('网站设置', '短信验证码登录', '1', 0);
INSERT INTO [Dicts] ([Category], [Name], [Code], [Define]) VALUES ('网站设置', 'OAuth 认证登录', '1', 0);
-- 时长单位 月
INSERT INTO [Dicts] ([Category], [Name], [Code], [Define]) VALUES ('系统设置', '程序异常保留时长', '1', 0);
INSERT INTO [Dicts] ([Category], [Name], [Code], [Define]) VALUES ('系统设置', '操作日志保留时长', '12', 0);

View File

@ -36,6 +36,10 @@ INSERT [dbo].[Dicts] ([Category], [Name], [Code], [Define]) VALUES (N'网站设
INSERT [dbo].[Dicts] ([Category], [Name], [Code], [Define]) VALUES (N'网站设置', N'侧边栏状态', N'1', 0)
INSERT [dbo].[Dicts] ([Category], [Name], [Code], [Define]) VALUES (N'网站设置', N'卡片标题状态', N'1', 0)
-- 登录配置
INSERT [dbo].[Dicts] ([Category], [Name], [Code], [Define]) VALUES (N'网站设置', N'短信验证码登录', N'1', 0)
INSERT [dbo].[Dicts] ([Category], [Name], [Code], [Define]) VALUES (N'网站设置', N'OAuth 认证登录', N'1', 0)
-- 时长单位 月
INSERT [dbo].[Dicts] ([Category], [Name], [Code], [Define]) VALUES (N'系统设置', N'程序异常保留时长', '1', 0)
INSERT [dbo].[Dicts] ([Category], [Name], [Code], [Define]) VALUES (N'系统设置', N'操作日志保留时长', '12', 0)

View File

@ -89,7 +89,7 @@ namespace Bootstrap.Admin.Controllers
///
/// </summary>
/// <returns></returns>
public ActionResult Settings() => View(new ThemeModel(this));
public ActionResult Settings() => View(new SettingsModel(this));
/// <summary>
///

View File

@ -18,6 +18,10 @@ namespace Bootstrap.Admin.Models
IsDemo = DictHelper.RetrieveSystemModel();
ShowCardTitle = DictHelper.RetrieveCardTitleStatus() ? "" : "no-card-header";
ShowSideBar = DictHelper.RetrieveSidebarStatus() ? "" : "collapsed";
AllowMobile = DictHelper.RetrieveMobileLogin();
AllowOAuth = DictHelper.RetrieveOAuthLogin();
ShowMobile = AllowMobile ? "" : "mobile";
ShowOAuth = AllowOAuth ? "" : "oauth";
}
/// <summary>
@ -49,5 +53,25 @@ namespace Bootstrap.Admin.Models
/// 是否收缩侧边栏
/// </summary>
public string ShowSideBar { get; protected set; }
/// <summary>
/// 获得 是否允许短信验证码登录
/// </summary>
public bool AllowMobile { get; }
/// <summary>
/// 获得 是否允许第三方 OAuth 认证登录
/// </summary>
public bool AllowOAuth { get; }
/// <summary>
/// 获得 是否允许短信验证码登录
/// </summary>
public string ShowMobile { get; }
/// <summary>
/// 获得 是否允许第三方 OAuth 认证登录
/// </summary>
public string ShowOAuth { get; }
}
}

View File

@ -8,7 +8,7 @@ namespace Bootstrap.Admin.Models
/// <summary>
///
/// </summary>
public class ProfilesModel : ThemeModel
public class ProfilesModel : SettingsModel
{
/// <summary>
/// 获得 头像文件大小

View File

@ -6,18 +6,19 @@ using System.Collections.Generic;
namespace Bootstrap.Admin.Models
{
/// <summary>
///
/// 网站设置 Model 实体类
/// </summary>
public class ThemeModel : NavigatorBarModel
public class SettingsModel : NavigatorBarModel
{
/// <summary>
///
/// </summary>
/// <param name="controller"></param>
public ThemeModel(ControllerBase controller) : base(controller)
public SettingsModel(ControllerBase controller) : base(controller)
{
Themes = DictHelper.RetrieveThemes();
}
/// <summary>
/// 获得 系统配置的所有样式表
/// </summary>

View File

@ -57,16 +57,6 @@
<input type="text" name="userName" class="form-control" data-toggle="tooltip" placeholder="用户名" maxlength="16" data-required-msg="请输入用户名" value="" autofocus data-valid="true" />
</div>
</div>
<div id="loginMobile" class="form-group d-none">
<div class="input-group">
<div class="input-group-prepend">
<div class="input-group-text">
<span class="fa fa-user"></span>
</div>
</div>
<input type="text" id="txtPhone" class="form-control digits" data-toggle="tooltip" placeholder="手机号码" minlength="11" maxlength="11" data-required-msg="请输入手机号码" value="" data-valid="true" />
</div>
</div>
<div id="loginPwd" class="form-group">
<div class="input-group">
<div class="input-group-prepend">
@ -77,16 +67,28 @@
<input type="password" name="password" class="form-control" value="" data-toggle="tooltip" placeholder="密码" maxlength="16" data-required-msg="请输入密码" data-valid="true" />
</div>
</div>
<div id="loginSMS" class="form-group d-none">
<div class="input-group">
<div class="input-group-prepend">
<div class="input-group-text">
<span class="fa fa-lock"></span>
<div asp-condition="@Model.AllowMobile">
<div id="loginMobile" class="form-group d-none">
<div class="input-group">
<div class="input-group-prepend">
<div class="input-group-text">
<span class="fa fa-user"></span>
</div>
</div>
<input type="text" id="txtPhone" class="form-control digits" data-toggle="tooltip" placeholder="手机号码" minlength="11" maxlength="11" data-required-msg="请输入手机号码" value="" data-valid="true" />
</div>
<input type="text" id="smscode" class="form-control digits" data-toggle="tooltip" disabled value="" placeholder="验证码" maxlength="4" data-required-msg="请输入验证码" data-valid="true" />
<div class="input-group-append">
<button type="button" id="btnSendCode" class="btn btn-sms" data-toggle="tooltip" title="点击发送验证码">发送验证码</button>
</div>
<div id="loginSMS" class="form-group d-none">
<div class="input-group">
<div class="input-group-prepend">
<div class="input-group-text">
<span class="fa fa-lock"></span>
</div>
</div>
<input type="text" id="smscode" class="form-control digits" data-toggle="tooltip" disabled value="" placeholder="验证码" maxlength="4" data-required-msg="请输入验证码" data-valid="true" />
<div class="input-group-append">
<button type="button" id="btnSendCode" class="btn btn-sms" data-toggle="tooltip" title="点击发送验证码">发送验证码</button>
</div>
</div>
</div>
</div>
@ -96,48 +98,50 @@
<span>记住密码自动登录</span>
<input id="remember" name="remember" type="hidden" value="false" />
</div>
<div>
<div asp-condition="@Model.AllowMobile">
<a id="loginType" data-value="username" href="#" class="">短信验证登陆</a>
</div>
</div>
<button class="btn btn-lg btn-login btn-block" data-toggle="tooltip" title="不填写密码默认使用 Gitee 认证" type="submit">登 录</button>
<div class="login-footer">
<div class="d-flex justify-content-between">
<a href="#" data-method="register">申请账号</a>
<a href="#" data-method="forgot">忘记密码</a>
</div>
<div class="login-other">
<span class="text-muted">
其他方式登录
</span>
</div>
<div class="login-list">
<div class="item">
<a href="~/Account/Gitee" data-toggle="tooltip" title="使用 Gitee 帐号登录">
<img class="item" src="~/images/gitee.svg" />
</a>
<div asp-condition="@Model.AllowOAuth">
<div class="login-other">
<span class="text-muted">
其他方式登录
</span>
</div>
<div class="item">
<a href="~/Account/GitHub" data-toggle="tooltip" title="使用 GitHub 帐号登录">
<img class="item" src="~/images/git.svg" />
</a>
</div>
<div class="item">
<a href="#" data-toggle="tooltip" title="微信-暂未实现">
<img class="item" src="~/images/weixin-2.svg" />
</a>
</div>
<div class="item">
<a href="#" data-toggle="tooltip" title="QQ-暂未实现">
<img class="item" src="~/images/qq-2.svg" />
</a>
</div>
<div class="item">
<a href="#" data-toggle="tooltip" title="支付宝-暂未实现">
<img class="item" src="~/images/zhifubao-2.svg" />
</a>
<div class="login-list">
<div class="item">
<a href="~/Account/Gitee" data-toggle="tooltip" title="使用 Gitee 帐号登录">
<img class="item" src="~/images/gitee.svg" />
</a>
</div>
<div class="item">
<a href="~/Account/GitHub" data-toggle="tooltip" title="使用 GitHub 帐号登录">
<img class="item" src="~/images/git.svg" />
</a>
</div>
<div class="item">
<a href="#" data-toggle="tooltip" title="微信-暂未实现">
<img class="item" src="~/images/weixin-2.svg" />
</a>
</div>
<div class="item">
<a href="#" data-toggle="tooltip" title="QQ-暂未实现">
<img class="item" src="~/images/qq-2.svg" />
</a>
</div>
<div class="item">
<a href="#" data-toggle="tooltip" title="支付宝-暂未实现">
<img class="item" src="~/images/zhifubao-2.svg" />
</a>
</div>
</div>
</div>
<div class="slidercaptcha card">
<div class="slidercaptcha card @Model.ShowOAuth">
<div class="card-header">
<span>请完成安全验证</span>
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>

View File

@ -1,4 +1,4 @@
@model ThemeModel
@model SettingsModel
@{
ViewBag.Title = "网站设置";
}
@ -96,7 +96,27 @@
</div>
</div>
<div class="modal-footer">
<button id="btnSaveCss" data-method="UISettings" class="btn btn-secondary" type="button"><i class="fa fa-save"></i><span>保存</span></button>
<button data-method="UISettings" class="btn btn-secondary" type="button"><i class="fa fa-save"></i><span>保存</span></button>
</div>
</div>
</div>
<div class="card">
<div class="card-header">登录设置</div>
<div class="card-body">
<div class="form-inline">
<div class="row">
<div class="form-group col-6">
<label class="control-label" for="mobile">手机登录</label>
<input id="mobile" hidden type="checkbox" data-default-val="@Model.ShowMobile" data-toggle="toggle" data-width="120" data-onstyle="success" data-on="允许" data-off="关闭" />
</div>
<div class="form-group col-6">
<label class="control-label" for="cardTitle">OAuth 认证</label>
<input id="oauth" hidden type="checkbox" data-default-val="@Model.ShowOAuth" data-toggle="toggle" data-width="120" data-onstyle="success" data-on="允许" data-off="关闭" />
</div>
</div>
</div>
<div class="modal-footer">
<button data-method="LoginSettings" class="btn btn-secondary" type="button"><i class="fa fa-save"></i><span>保存</span></button>
</div>
</div>
</div>

View File

@ -30,39 +30,22 @@
}
.login-wrap {
padding: 0;
margin: 18px 0 0 370px;
width: 280px;
width: 300px;
height: 274px;
position: relative;
left: 346px;
justify-content: center;
}
.slidercaptcha {
top: -278px;
left: -15px;
width: 300px;
}
.slidercaptcha.card .card-body {
padding: 15px 15px 0 15px;
}
.slidercaptcha, .slidercaptcha.forgot {
width: 310px;
.slidercaptcha, .slidercaptcha.oauth {
height: 280px;
}
.login-wrap[data-auth="True"] {
margin: 20px 0 0 370px;
}
.login-wrap[data-auth="True"] .slidercaptcha {
top: -264px;
}
.login-wrap[data-auth="True"] .slidercaptcha, .slidercaptcha.forgot {
width: 310px;
height: 280px;
}
.login-wrap[data-auth="True"] .form-group {
margin-bottom: 0.75rem;
}
.slidercaptcha.card .card-body {
padding: 15px 15px 0 15px;
}
}

View File

@ -13,8 +13,9 @@
}
.login-wrap {
padding: 20px;
height: 300px;
display: flex;
flex-direction: column;
margin: 1rem;
}
.login-wrap .rememberPwd {
@ -27,14 +28,10 @@
width: 13px;
}
.login-wrap .card {
border-top-width: 1px;
.login-wrap .card, .login-wrap .card:hover, .modal .card, .modal .card:hover {
border: 1px solid #84bbe2;
}
.login-footer a:last-child {
float: right;
}
.btn-login {
background: #f67a6e;
color: #fff;
@ -42,7 +39,7 @@
font-weight: 300;
font-family: 'Open Sans', sans-serif;
box-shadow: 0 4px #e56b60;
margin-bottom: 0.625rem;
margin-bottom: 0.75rem;
outline: none !important;
margin-top: -0.25rem;
line-height: 1;
@ -66,11 +63,10 @@
background-color: #00adec;
border-radius: 4px;
box-shadow: 0 0 10px #fff;
left: 0;
right: 0;
top: -270px;
height: 226px;
z-index: 1080
height: 274px;
width: 286px;
z-index: 1080;
position: absolute;
}
.slidercaptcha canvas:first-child {
@ -83,8 +79,12 @@
margin-top: -2px;
}
.slidercaptcha.oauth {
height: 210px;
}
.slidercaptcha.card .card-body {
padding: 0.625rem 0 0 0;
padding: 0.75rem 0 0 0;
}
.slidercaptcha.card .card-header {
@ -97,18 +97,8 @@
color: #fff;
}
.slidercaptcha.forgot {
position: absolute;
left: auto;
right: 14px;
bottom: 14px;
top: auto;
margin: 0;
width: 274px;
}
.slidercaptcha.reg {
bottom: 60px;
.slidercaptcha.forgot, .slidercaptcha.reg {
bottom: 52px;
}
.login-other {

View File

@ -57,6 +57,12 @@
},
'button[data-method="css"]': function () {
this.log({ crud: '设置网站样式' });
},
'button[data-method="UISettings"]': function () {
this.log({ crud: '保存网站设置' });
},
'button[data-method="LoginSettings"]': function () {
this.log({ crud: '保存登录设置' });
}
}
};

View File

@ -20,16 +20,20 @@
url: "api/OnlineUsers",
method: "put",
callback: function (result) {
// 返回真时表示三次验证需要滑块验证码
if (result) captcha.addClass('d-block');
else success();
}
});
},
capWidth: function () {
return $(window).width() < 768 ? 256 : 280;
return $(window).width() < 768 ? 256 : 272;
},
capHeight: function () {
return $(window).width() < 768 ? 106 : 150;
// 如果关闭 oAuth 认证 高度要缩小
var height = 150;
if ($(window).height() < 768) height = $('.slidercaptcha:first').hasClass('oauth') ? 96 : 150;
return height;
},
capRegSuccess: function () {
$.bc({
@ -126,7 +130,7 @@
var $loginPwd = $('#loginPwd');
var $loginSMS = $('#loginSMS');
if ($login.attr('data-demo') === 'True') {
$login.find('[data-valid="true"]').attr('data-valid', 'false');
$login.find('[name="userName"], [name="password"]').attr('data-valid', 'false');
$login.on('submit', function (e) {
var model = $loginType.attr('data-value');
if (model === 'username') {

View File

@ -9,7 +9,7 @@ using System.Linq;
namespace Bootstrap.DataAccess
{
/// <summary>
///
/// 字典表实体类
/// </summary>
[TableName("Dicts")]
public class Dict : BootstrapDict
@ -210,5 +210,17 @@ namespace Bootstrap.DataAccess
/// </summary>
/// <returns></returns>
public bool RetrieveSidebarStatus() => (DictHelper.RetrieveDicts().FirstOrDefault(d => d.Category == "网站设置" && d.Name == "侧边栏状态" && d.Define == 0)?.Code ?? "1") == "1";
/// <summary>
/// 获得是否允许短信验证码登录
/// </summary>
/// <returns></returns>
public bool RetrieveMobileLogin() => (DictHelper.RetrieveDicts().FirstOrDefault(d => d.Category == "网站设置" && d.Name == "短信验证码登录" && d.Define == 0)?.Code ?? "1") == "1";
/// <summary>
/// 获得是否允许 OAuth 认证登录
/// </summary>
/// <returns></returns>
public bool RetrieveOAuthLogin() => (DictHelper.RetrieveDicts().FirstOrDefault(d => d.Category == "网站设置" && d.Name == "OAuth 认证登录" && d.Define == 0)?.Code ?? "1") == "1";
}
}

View File

@ -203,12 +203,24 @@ namespace Bootstrap.DataAccess
/// 获得数据区卡片标题是否显示
/// </summary>
/// <returns></returns>
public static bool RetrieveCardTitleStatus() => DbContextManager.Create<Dict>()?.RetrieveCardTitleStatus() ?? true;
public static bool RetrieveCardTitleStatus() => DbContextManager.Create<Dict>().RetrieveCardTitleStatus();
/// <summary>
/// 获得侧边栏状态 未真时显示
/// </summary>
/// <returns></returns>
public static bool RetrieveSidebarStatus() => DbContextManager.Create<Dict>()?.RetrieveSidebarStatus() ?? true;
public static bool RetrieveSidebarStatus() => DbContextManager.Create<Dict>().RetrieveSidebarStatus();
/// <summary>
/// 获得是否允许短信验证码登录
/// </summary>
/// <returns></returns>
public static bool RetrieveMobileLogin() => DbContextManager.Create<Dict>()?.RetrieveMobileLogin() ?? false;
/// <summary>
/// 获得是否允许 OAuth 认证登录
/// </summary>
/// <returns></returns>
public static bool RetrieveOAuthLogin() => DbContextManager.Create<Dict>()?.RetrieveOAuthLogin() ?? false;
}
}