|
|
|
@ -1,31 +1,67 @@ |
|
|
|
<!DOCTYPE html> |
|
|
|
<html> |
|
|
|
<head> |
|
|
|
<title th:text="#{security.login.title}">系统 | 登录</title> |
|
|
|
<title th:utext="#{application.title}"></title> |
|
|
|
<link rel="icon" th:href="@{/favicon.svg}"> |
|
|
|
<meta http-equiv="Content-Type" content="text/html charset=UTF-8"/> |
|
|
|
<meta name="viewport" content="width=device-width, initial-scale=1"> |
|
|
|
<link rel="stylesheet" th:href="@{/io.sc.platform.security.jpa/bootstrap-5.2.3-dist/css/bootstrap.min.css}"> |
|
|
|
<meta http-equiv="X-UA-Compatible" content="IE=edge"> |
|
|
|
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no"/> |
|
|
|
|
|
|
|
<link rel="stylesheet" type="text/css" th:href="@{/bootstrap/css/bootstrap.min.css}"/> |
|
|
|
<style> |
|
|
|
body{ |
|
|
|
height: 100vh; |
|
|
|
background-image: url([[@{|/${@environment.getProperty('application.name')}/images/background.svg|}]]); |
|
|
|
background-color: #EEE; |
|
|
|
background-size: 100% 100%; |
|
|
|
} |
|
|
|
.text-primary { |
|
|
|
color: #14234a !important; |
|
|
|
} |
|
|
|
.bg-primary { |
|
|
|
background-color: #14234a !important; |
|
|
|
} |
|
|
|
.nav-pills .nav-link.active { |
|
|
|
background-color: #14234a; |
|
|
|
} |
|
|
|
.btn-primary { |
|
|
|
background-color: #14234a; |
|
|
|
border-color: #14234a; |
|
|
|
} |
|
|
|
.form-check-input:checked { |
|
|
|
background-color: #14234a; |
|
|
|
border-color: #14234a; |
|
|
|
} |
|
|
|
.btn-outline-primary { |
|
|
|
--bs-btn-color: #14234a; |
|
|
|
--bs-btn-border-color: #14234a; |
|
|
|
--bs-btn-hover-color: #fff; |
|
|
|
--bs-btn-hover-bg: #14234a; |
|
|
|
--bs-btn-hover-border-color: #14234a; |
|
|
|
--bs-btn-focus-shadow-rgb: 13, 110, 253; |
|
|
|
--bs-btn-active-color: #fff; |
|
|
|
--bs-btn-active-bg: #14234a; |
|
|
|
--bs-btn-active-border-color: #14234a; |
|
|
|
--bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125); |
|
|
|
--bs-btn-disabled-color: #14234a; |
|
|
|
--bs-btn-disabled-bg: transparent; |
|
|
|
--bs-btn-disabled-border-color: #14234a; |
|
|
|
--bs-gradient: none; |
|
|
|
} |
|
|
|
.progress-bar { |
|
|
|
background-color: #14234a; |
|
|
|
} |
|
|
|
</style> |
|
|
|
|
|
|
|
<script type="text/javascript" th:src="@{/bootstrap/js/bootstrap.bundle.min.js}"></script> |
|
|
|
<script th:inline="javascript"> |
|
|
|
if(window.parent!=window){ |
|
|
|
window.parent.location.href ='[(@{/})]'; |
|
|
|
} |
|
|
|
|
|
|
|
</script> |
|
|
|
</head> |
|
|
|
<body> |
|
|
|
<nav class="navbar bg-light"> |
|
|
|
<body style="min-height: 782px; min-width: 600px; background-image: url(login-bg.jpg); background-position: center center; background-repeat: no-repeat; background-size: cover; background-attachment: fixed;"> |
|
|
|
<nav class="navbar bg-primary" style="padding:5px"> |
|
|
|
<div class="container-fluid"> |
|
|
|
<a class="navbar-brand text-muted" href="#"> |
|
|
|
<img th:src="@{|/${@environment.getProperty('application.name')}/images/logo.svg|}" alt="Logo" width="24" height="24" class="d-inline-block align-text-top"> |
|
|
|
[(#{application.title})] |
|
|
|
<a class="navbar-brand" href="#" style="color:white;"> |
|
|
|
<img th:src="@{|/logo.svg?t=${#dates.createNow().getTime()}|}" alt="Logo" width="24" height="24" class="d-inline-block align-text-top"> |
|
|
|
<span style="padding-left:10px;color:white;" th:text="#{application.title}"></span> |
|
|
|
</a> |
|
|
|
</div> |
|
|
|
</nav> |
|
|
|
@ -34,15 +70,15 @@ |
|
|
|
|
|
|
|
<div class="container"> |
|
|
|
<div class="row"> |
|
|
|
<div class="col-md-4 col-xl-6"></div> |
|
|
|
<div class="col-md-7 col-xl-5"> |
|
|
|
<div class="col-md-6 col-xl-7"></div> |
|
|
|
<div class="col-md-6 col-xl-5"> |
|
|
|
<div class="shadow-sm p-3 mb-5 bg-light rounded-3 border"> |
|
|
|
<div th:if="${isLoginError}" class="alert alert-danger" role="alert"> |
|
|
|
<div th:if="${error}" class="alert alert-danger" role="alert"> |
|
|
|
<span th:text="#{security.login.message.error}">认证失败!</span> |
|
|
|
</div> |
|
|
|
<form class="row g-3" th:action="@{${loginProcessingUrl}}" method="post"> |
|
|
|
<div class="col-12"> |
|
|
|
<label for="username" class="form-label" th:text="#{username}">用户名</label> |
|
|
|
<label for="username" class="form-label" th:text="#{loginName}">用户名</label> |
|
|
|
<input type="text" class="form-control" name="username" th:placeholder="#{security.login.username.placeholder}" autofocus> |
|
|
|
</div> |
|
|
|
<div class="col-12"> |
|
|
|
@ -51,15 +87,17 @@ |
|
|
|
</div> |
|
|
|
<div class="form-group"> |
|
|
|
<div class="text-end"> |
|
|
|
<button type="reset" class="ms-2 btn btn-outline-secondary" th:text="#{reset}">重置</button> |
|
|
|
<button type="submit" class="ms-2 btn btn-outline-primary" th:text="#{login}">登录</button> |
|
|
|
<button type="reset" class="ms-2 btn btn-outline-secondary" th:text="#{reset}">重置</button> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</form> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<div class="col-md-1"></div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</body> |
|
|
|
<script type="text/javascript"> |
|
|
|
|
|
|
|
</script> |
|
|
|
</html> |
