This commit is contained in:
2025-04-18 01:44:02 +08:00
parent 55057185c6
commit e99b91bcff
13 changed files with 737 additions and 530 deletions

View File

@@ -9,82 +9,47 @@ Description: Findreve 登录界面 Login
Copyright (c) 2018-2024 by 于小丘Yuerchu, All Rights Reserved.
'''
from nicegui import ui, app
from nicegui import ui
from typing import Optional
from fastapi.responses import RedirectResponse
from fastapi import Request
from .framework import frame
def create() -> Optional[RedirectResponse]:
@ui.page('/login')
async def session(request: Request, redirect_to: str = "/"):
async def session(redirect_to: str = "/"):
ui.add_head_html("""
<script>
async function login(username, password) {
const url = '/api/token';
const data = new URLSearchParams();
data.append('username', username);
data.append('password', password);
try {
const response = await fetch(url, {
method: 'POST',
headers: {
'Content-Type': 'application/x-www-form-urlencoded',
},
body: data,
});
if (!response.ok) {
throw new Error('登录失败: ' + response.statusText);
}
const result = await response.json();
// 处理登录成功后的数据返回access_token
localStorage.setItem('access_token', result.access_token);
return {'status': 'success'};
} catch (error) {
return {'status': 'failed', 'detail': error.message};
}
}
</script>
<script type="text/javascript" src="/static/js/main.js"></script>
""")
ui.page_title('登录 Findreve')
async def login():
if username.value == "" or password.value == "":
ui.notify('账号或密码不能为空', color='negative')
return
try:
result = await ui.run_javascript(f"login('{username.value}', '{password.value}')")
if result['status'] == 'success':
ui.navigate.to(redirect_to)
else:
ui.notify(f"登录失败: {result['detail']}", type="negative")
except Exception as e:
ui.notify(f"登录失败: {str(e)}", type="negative")
ui.dark_mode(True)
with ui.header() \
.classes('items-center duration-300 py-2 px-5 no-wrap') \
.style('box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1)'):
async with frame(page='session'):
async def login():
if username.value == "" or password.value == "":
ui.notify('账号或密码不能为空', color='negative')
return
try:
result = await ui.run_javascript(f"login('{username.value}', '{password.value}')")
if result['status'] == 'success':
ui.navigate.to(redirect_to)
else:
ui.notify(f"登录失败: {result['detail']}", type="negative")
except Exception as e:
ui.notify(f"登录失败: {str(e)}", type="negative")
ui.button(icon='menu').props('flat color=white round')
appBar_appName = ui.button(text="HeyPress").classes('text-lg').props('flat color=white no-caps')
# 创建一个绝对中心的登录卡片
with ui.card().classes('absolute-center round-lg').style('width: 70%; max-width: 500px'):
# 登录标签
ui.button(icon='lock').props('outline round').classes('mx-auto w-auto shadow-sm w-fill')
ui.label('登录 Findreve').classes('text-h5 w-full text-center')
# 用户名/密码框
username = ui.input('账号').on('keydown.enter', login) \
.classes('block w-full text-gray-900').props('filled')
password = ui.input('密码', password=True, password_toggle_button=True) \
.on('keydown.enter', login).classes('block w-full text-gray-900').props('filled')
# 按钮布局
ui.button('登录', on_click=lambda: login()).classes('items-center w-full').props('rounded')
# 创建一个绝对中心的登录卡片
with ui.card().classes('absolute-center round-lg').style('width: 70%; max-width: 500px'):
# 登录标签
ui.button(icon='lock').props('outline round').classes('mx-auto w-auto shadow-sm w-fill')
ui.label('登录 Findreve').classes('text-h5 w-full text-center')
# 用户名/密码框
username = ui.input('账号').on('keydown.enter', login) \
.classes('block w-full text-gray-900').props('filled')
password = ui.input('密码', password=True, password_toggle_button=True) \
.on('keydown.enter', login).classes('block w-full text-gray-900').props('filled')
# 按钮布局
ui.button('登录', on_click=lambda: login()).classes('items-center w-full').props('rounded')