feat: 添加文档管理系统前后端基础功能
- 新增后端FastAPI应用，包含用户管理、文档管理和操作日志功能 - 实现JWT认证机制，支持用户注册、登录、登出操作 - 添加数据库模型定义，包括用户表、文档表和操作日志表 - 实现文档的增删改查功能及权限控制 - 添加管理员功能，支持用户管理和全局操作日志查看 - 新增前端界面，实现完整的用户交互体验 - 配置环境变量示例和Git忽略规则 - 编写详细的README文档，包含安装和使用说明
This commit is contained in:
starsac
224
index.html
Normal file
224
index.html
Normal file
@@ -0,0 +1,224 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="zh-CN">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>文档在线管理系统</title>
|
||||
<link rel="stylesheet" href="style.css">
|
||||
</head>
|
||||
<body>
|
||||
<!-- 导航栏 -->
|
||||
<nav class="navbar">
|
||||
<div class="nav-container">
|
||||
<h1 class="nav-logo">📄 文档管理系统</h1>
|
||||
<div class="nav-menu" id="navMenu">
|
||||
<span class="user-info" id="userInfo" style="display: none;"></span>
|
||||
<button class="nav-btn" id="loginBtn">登录</button>
|
||||
<button class="nav-btn" id="registerBtn">注册</button>
|
||||
<button class="nav-btn" id="logoutBtn" style="display: none;">登出</button>
|
||||
</div>
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
<!-- 主要内容区域 -->
|
||||
<main class="main-content">
|
||||
<!-- 登录表单 -->
|
||||
<div id="loginSection" class="form-section">
|
||||
<h2>用户登录</h2>
|
||||
<form id="loginForm" class="auth-form">
|
||||
<div class="form-group">
|
||||
<label for="loginUsername">用户名:</label>
|
||||
<input type="text" id="loginUsername" required>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="loginPassword">密码:</label>
|
||||
<input type="password" id="loginPassword" required>
|
||||
</div>
|
||||
<button type="submit" class="btn-primary">登录</button>
|
||||
<p>还没有账户？<a href="#" id="showRegister">立即注册</a></p>
|
||||
</form>
|
||||
</div>
|
||||
|
||||
<!-- 注册表单 -->
|
||||
<div id="registerSection" class="form-section" style="display: none;">
|
||||
<h2>用户注册</h2>
|
||||
<form id="registerForm" class="auth-form">
|
||||
<div class="form-group">
|
||||
<label for="registerUsername">用户名:</label>
|
||||
<input type="text" id="registerUsername" required>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="registerEmail">邮箱:</label>
|
||||
<input type="email" id="registerEmail" required>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="registerFullName">姓名:</label>
|
||||
<input type="text" id="registerFullName">
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="registerPassword">密码:</label>
|
||||
<input type="password" id="registerPassword" required>
|
||||
</div>
|
||||
<div class="form-group checkbox-group">
|
||||
<label>
|
||||
<input type="checkbox" id="registerIsAdmin"> 注册为管理员
|
||||
</label>
|
||||
</div>
|
||||
<button type="submit" class="btn-primary">注册</button>
|
||||
<p>已有账户？<a href="#" id="showLogin">立即登录</a></p>
|
||||
</form>
|
||||
</div>
|
||||
|
||||
<!-- 主界面（登录后显示） -->
|
||||
<div id="mainSection" style="display: none;">
|
||||
<!-- 用户信息面板 -->
|
||||
<div class="user-panel">
|
||||
<h2>欢迎, <span id="currentUserName"></span>!</h2>
|
||||
<div class="user-actions">
|
||||
<button class="btn-secondary" id="editProfileBtn">编辑个人信息</button>
|
||||
<button class="btn-secondary" id="viewLogsBtn">查看操作日志</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 用户管理（仅管理员可见） -->
|
||||
<div id="userManagementSection" class="user-management-section" style="display: none;">
|
||||
<div class="section-header">
|
||||
<h2>用户管理</h2>
|
||||
<button class="btn-primary" id="refreshUsersBtn">刷新用户列表</button>
|
||||
</div>
|
||||
|
||||
<!-- 用户列表 -->
|
||||
<div id="usersList" class="users-list">
|
||||
<!-- 用户列表将通过JavaScript动态生成 -->
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 文档管理 -->
|
||||
<div class="documents-section">
|
||||
<div class="section-header">
|
||||
<h2>文档管理</h2>
|
||||
<button class="btn-primary" id="createDocBtn">创建新文档</button>
|
||||
</div>
|
||||
|
||||
<!-- 文档列表 -->
|
||||
<div id="documentsList" class="documents-list">
|
||||
<!-- 文档列表将通过JavaScript动态生成 -->
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 编辑个人信息模态框 -->
|
||||
<div id="editProfileModal" class="modal" style="display: none;">
|
||||
<div class="modal-content">
|
||||
<span class="close" id="closeEditModal">×</span>
|
||||
<h3>编辑个人信息</h3>
|
||||
<form id="editProfileForm">
|
||||
<div class="form-group">
|
||||
<label for="editEmail">邮箱:</label>
|
||||
<input type="email" id="editEmail" required>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="editFullName">姓名:</label>
|
||||
<input type="text" id="editFullName">
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="editPassword">新密码（可选）:</label>
|
||||
<input type="password" id="editPassword" placeholder="留空则不修改密码">
|
||||
</div>
|
||||
<button type="submit" class="btn-primary">保存修改</button>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 创建文档模态框 -->
|
||||
<div id="createDocModal" class="modal" style="display: none;">
|
||||
<div class="modal-content">
|
||||
<span class="close" id="closeCreateDocModal">×</span>
|
||||
<h3>创建新文档</h3>
|
||||
<form id="createDocForm">
|
||||
<div class="form-group">
|
||||
<label for="docTitle">标题:</label>
|
||||
<input type="text" id="docTitle" required>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="docDescription">描述:</label>
|
||||
<textarea id="docDescription" rows="3"></textarea>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="docContent">内容:</label>
|
||||
<textarea id="docContent" rows="6" required></textarea>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="docType">文件类型:</label>
|
||||
<select id="docType">
|
||||
<option value="txt">文本文件</option>
|
||||
<option value="md">Markdown</option>
|
||||
<option value="html">HTML</option>
|
||||
</select>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label>
|
||||
<input type="checkbox" id="docPublic"> 公开文档
|
||||
</label>
|
||||
</div>
|
||||
<button type="submit" class="btn-primary">创建文档</button>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 编辑文档模态框 -->
|
||||
<div id="editDocModal" class="modal" style="display: none;">
|
||||
<div class="modal-content">
|
||||
<span class="close" id="closeEditDocModal">×</span>
|
||||
<h3>编辑文档</h3>
|
||||
<form id="editDocForm">
|
||||
<input type="hidden" id="editDocId">
|
||||
<div class="form-group">
|
||||
<label for="editDocTitle">标题:</label>
|
||||
<input type="text" id="editDocTitle" required>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="editDocDescription">描述:</label>
|
||||
<textarea id="editDocDescription" rows="3"></textarea>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="editDocContent">内容:</label>
|
||||
<textarea id="editDocContent" rows="6" required></textarea>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="editDocType">文件类型:</label>
|
||||
<select id="editDocType">
|
||||
<option value="txt">文本文件</option>
|
||||
<option value="md">Markdown</option>
|
||||
<option value="html">HTML</option>
|
||||
</select>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label>
|
||||
<input type="checkbox" id="editDocPublic"> 公开文档
|
||||
</label>
|
||||
</div>
|
||||
<button type="submit" class="btn-primary">保存修改</button>
|
||||
<button type="button" class="btn-danger" id="deleteDocBtn">删除文档</button>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 操作日志模态框 -->
|
||||
<div id="logsModal" class="modal" style="display: none;">
|
||||
<div class="modal-content">
|
||||
<span class="close" id="closeLogsModal">×</span>
|
||||
<h3>操作日志</h3>
|
||||
<div id="logsList" class="logs-list">
|
||||
<!-- 日志列表将通过JavaScript动态生成 -->
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</main>
|
||||
|
||||
<!-- 消息提示 -->
|
||||
<div id="message" class="message" style="display: none;"></div>
|
||||
|
||||
<script src="app.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
Reference in New Issue
Block a user