80 lines
2.6 KiB
HTML
80 lines
2.6 KiB
HTML
{% extends 'base.html' %}
|
|
{% block title %}登录{% endblock %}
|
|
|
|
{% block content %}
|
|
<div class="card auth-card shadow-lg">
|
|
<div class="card-body p-5">
|
|
<div class="text-center mb-4">
|
|
<i class="bi bi-collection-play text-primary" style="font-size:3rem"></i>
|
|
<h2 class="fw-bold mt-2">个人资料库</h2>
|
|
<p class="text-muted">登录以管理您的资源</p>
|
|
</div>
|
|
|
|
<form method="POST" action="{{ url_for('auth.login') }}" novalidate>
|
|
{{ form.hidden_tag() }}
|
|
|
|
<div class="mb-3">
|
|
<label class="form-label">{{ form.username.label.text }}</label>
|
|
{{ form.username(class='form-control form-control-lg' +
|
|
(' is-invalid' if form.username.errors else ''),
|
|
placeholder='请输入用户名') }}
|
|
{% for err in form.username.errors %}
|
|
<div class="invalid-feedback">{{ err }}</div>
|
|
{% endfor %}
|
|
</div>
|
|
|
|
<div class="mb-3">
|
|
<label class="form-label">{{ form.password.label.text }}</label>
|
|
<div class="input-group">
|
|
{{ form.password(class='form-control form-control-lg' +
|
|
(' is-invalid' if form.password.errors else ''),
|
|
placeholder='请输入密码', id='loginPassword') }}
|
|
<button class="btn btn-outline-secondary" type="button"
|
|
onclick="togglePwd('loginPassword', this)">
|
|
<i class="bi bi-eye"></i>
|
|
</button>
|
|
{% for err in form.password.errors %}
|
|
<div class="invalid-feedback">{{ err }}</div>
|
|
{% endfor %}
|
|
</div>
|
|
</div>
|
|
|
|
<div class="d-flex justify-content-between align-items-center mb-4">
|
|
<div class="form-check">
|
|
{{ form.remember(class='form-check-input') }}
|
|
<label class="form-check-label" for="remember">记住我</label>
|
|
</div>
|
|
</div>
|
|
|
|
<button type="submit" class="btn btn-primary btn-lg w-100">
|
|
<i class="bi bi-box-arrow-in-right me-1"></i>登录
|
|
</button>
|
|
</form>
|
|
|
|
{% if allow_register %}
|
|
<hr class="my-4">
|
|
<p class="text-center text-muted mb-0">
|
|
还没有账号？
|
|
<a href="{{ url_for('auth.register') }}" class="text-decoration-none">立即注册</a>
|
|
</p>
|
|
{% endif %}
|
|
</div>
|
|
</div>
|
|
{% endblock %}
|
|
|
|
{% block scripts %}
|
|
<script>
|
|
function togglePwd(id, btn) {
|
|
const input = document.getElementById(id);
|
|
const icon = btn.querySelector('i');
|
|
if (input.type === 'password') {
|
|
input.type = 'text';
|
|
icon.className = 'bi bi-eye-slash';
|
|
} else {
|
|
input.type = 'password';
|
|
icon.className = 'bi bi-eye';
|
|
}
|
|
}
|
|
</script>
|
|
{% endblock %}
|