feat: harden account security flows

This commit is contained in:
2026-08-04 14:29:51 +08:00
parent 630252e2ff
commit c71b1351d6
14 changed files with 892 additions and 56 deletions
+74 -8
View File
@@ -1,12 +1,78 @@
{% extends "base.html" %}
{% set active_page = "security" %}
{% block title %}账户安全 | 供水管道健康评估系统{% endblock %}
{% block content %}
<section class="mx-auto max-w-xl rounded-xl border border-line bg-white p-6 shadow-panel">
<h1 class="text-2xl font-extrabold">账户安全</h1>
<p class="mt-2 text-sm text-textSub">登录邮箱:{{ current_user.email }}</p>
{% with messages=get_flashed_messages(with_categories=true) %}{% for c,m in messages %}<p class="mt-3 text-sm text-dangerText">{{ m }}</p>{% endfor %}{% endwith %}
<form method="post" class="mt-6 space-y-3"><input type="hidden" name="csrf_token" value="{{ csrf_token() }}"><input name="current_password" type="password" required class="w-full rounded-lg border border-line px-3 py-2" placeholder="当前密码"><button class="ui-btn ui-btn-primary">发送修改密码验证码</button></form>
<form method="post" class="mt-6 space-y-3 border-t border-line pt-5"><input type="hidden" name="csrf_token" value="{{ csrf_token() }}"><input type="hidden" name="action" value="change_email"><input name="current_password" type="password" required class="w-full rounded-lg border border-line px-3 py-2" placeholder="当前密码"><input name="new_email" type="email" required class="w-full rounded-lg border border-line px-3 py-2" placeholder="新邮箱"><button class="ui-btn ui-btn-secondary">验证并更换邮箱</button></form>
<form method="post" class="mt-6 border-t border-line pt-5"><input type="hidden" name="csrf_token" value="{{ csrf_token() }}"><input type="hidden" name="action" value="revoke_devices"><button class="ui-btn ui-btn-secondary">撤销所有受信设备</button></form>
{% if session.get('password_change_verified') %}<form method="post" action="{{ url_for('main.change_password') }}" class="mt-6 space-y-3 border-t border-line pt-5"><input type="hidden" name="csrf_token" value="{{ csrf_token() }}"><input name="password" type="password" minlength="12" required class="w-full rounded-lg border border-line px-3 py-2" placeholder="新密码"><input name="password_confirm" type="password" minlength="12" required class="w-full rounded-lg border border-line px-3 py-2" placeholder="确认新密码"><button class="ui-btn ui-btn-primary">更新密码</button></form>{% endif %}
<section class="mx-auto max-w-3xl rounded-xl border border-line bg-white shadow-panel">
<header class="border-b border-line px-6 py-6 sm:px-8">
<h1 class="text-2xl font-extrabold">账户安全</h1>
<p class="mt-2 text-sm text-textSub">登录邮箱:{{ current_user.email }}</p>
</header>
{% with messages = get_flashed_messages(with_categories=true) %}
{% for category, message in messages %}
<p class="mx-6 mt-5 rounded-lg p-3 text-sm {{ 'bg-dangerSoft text-dangerText' if category == 'error' else 'bg-blueSoft text-primary' }} sm:mx-8">{{ message }}</p>
{% endfor %}
{% endwith %}
<div class="divide-y divide-line">
<section class="px-6 py-7 sm:px-8">
<div class="flex items-start gap-3">
<span class="material-symbols-outlined mt-0.5 text-primary">password</span>
<div>
<h2 class="font-extrabold">修改密码</h2>
<p class="mt-1 text-sm leading-6 text-textSub">需验证当前密码,并向登录邮箱发送验证码。新密码须包含大小写字母、数字和特殊字符。</p>
</div>
</div>
{% if password_change_authorized %}
<form method="post" action="{{ url_for('main.change_password') }}" class="mt-5 grid gap-3 sm:grid-cols-2">
<input type="hidden" name="csrf_token" value="{{ csrf_token() }}">
<input name="password" type="password" minlength="12" required class="w-full rounded-lg border border-line px-3 py-2" placeholder="新密码">
<input name="password_confirm" type="password" minlength="12" required class="w-full rounded-lg border border-line px-3 py-2" placeholder="再次输入新密码">
<button class="ui-btn ui-btn-primary sm:col-span-2 sm:w-fit">确认更新密码</button>
</form>
{% else %}
<form method="post" class="mt-5 flex flex-col gap-3 sm:flex-row sm:items-center">
<input type="hidden" name="csrf_token" value="{{ csrf_token() }}">
<input name="current_password" type="password" required class="w-full rounded-lg border border-line px-3 py-2 sm:max-w-sm" placeholder="输入当前密码">
<button class="ui-btn ui-btn-primary">发送密码验证码</button>
</form>
{% endif %}
</section>
<section class="px-6 py-7 sm:px-8">
<div class="flex items-start gap-3">
<span class="material-symbols-outlined mt-0.5 text-primary">alternate_email</span>
<div>
<h2 class="font-extrabold">更换登录邮箱</h2>
<p class="mt-1 text-sm leading-6 text-textSub">需验证当前密码、原邮箱和新邮箱。完成后将退出所有设备,并用新邮箱登录。</p>
</div>
</div>
<form method="post" class="mt-5 grid gap-3 sm:grid-cols-2">
<input type="hidden" name="csrf_token" value="{{ csrf_token() }}">
<input type="hidden" name="action" value="change_email">
<input name="current_password" type="password" required class="w-full rounded-lg border border-line px-3 py-2" placeholder="输入当前密码">
<input name="new_email" type="email" required class="w-full rounded-lg border border-line px-3 py-2" placeholder="新登录邮箱">
<button class="ui-btn ui-btn-secondary sm:col-span-2 sm:w-fit">验证并更换邮箱</button>
</form>
</section>
<section class="px-6 py-7 sm:px-8">
<div class="flex items-start gap-3">
<span class="material-symbols-outlined mt-0.5 text-primary">devices</span>
<div>
<h2 class="font-extrabold">受信设备</h2>
<p class="mt-1 text-sm leading-6 text-textSub">需输入当前密码确认。撤销后,所有设备下次登录都需要重新完成邮箱二次认证。</p>
</div>
</div>
<form method="post" class="mt-5">
<input type="hidden" name="csrf_token" value="{{ csrf_token() }}">
<input type="hidden" name="action" value="revoke_devices">
<input name="current_password" type="password" required class="mb-3 w-full rounded-lg border border-line px-3 py-2 sm:max-w-sm" placeholder="输入当前密码以确认">
<button class="ui-btn ui-btn-secondary">撤销所有受信设备</button>
</form>
</section>
</div>
</section>
{% endblock %}