统一了一下UI，用户管理那一页还是使
This commit is contained in:
@@ -1,14 +1,21 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="zh">
|
||||
<html lang="zh-CN">
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<title>固定左侧栏目</title>
|
||||
<title>数据管理系统</title>
|
||||
<style>
|
||||
body {
|
||||
margin: 0;
|
||||
font-family: system-ui, -apple-system, Segoe UI, Roboto, sans-serif;
|
||||
background: #fafafa;
|
||||
}
|
||||
|
||||
/* 导航栏样式 */
|
||||
.sidebar {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 180px; /* 导航栏变窄 */
|
||||
width: 180px;
|
||||
height: 100vh;
|
||||
background: #1e1e2e;
|
||||
color: white;
|
||||
@@ -22,7 +29,7 @@
|
||||
|
||||
.user-id {
|
||||
text-align: center;
|
||||
margin-bottom: auto; /* 用户ID保持在顶部 */
|
||||
margin-bottom: auto;
|
||||
}
|
||||
|
||||
.sidebar h3 {
|
||||
@@ -30,12 +37,12 @@
|
||||
font-size: 18px;
|
||||
color: #ff79c6;
|
||||
text-align: center;
|
||||
margin-bottom: 20px; /* 调整标题与下方内容的距离 */
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
.navigation-links {
|
||||
width: 100%;
|
||||
margin-top: 60px; /* 空出一个正方形位置（约 60x60px） */
|
||||
margin-top: 60px;
|
||||
}
|
||||
|
||||
.sidebar a,
|
||||
@@ -43,14 +50,14 @@
|
||||
display: block;
|
||||
color: #8be9fd;
|
||||
text-decoration: none;
|
||||
margin: 10px 0; /* 减少上下间距 */
|
||||
font-size: 16px; /* 根据需要调整字体大小 */
|
||||
padding: 15px; /* 增加内边距以填充整个宽度 */
|
||||
border-radius: 4px; /* 减少圆角半径 */
|
||||
margin: 10px 0;
|
||||
font-size: 16px;
|
||||
padding: 15px;
|
||||
border-radius: 4px;
|
||||
background: transparent;
|
||||
border: none;
|
||||
cursor: pointer;
|
||||
width: calc(100% - 40px); /* 适应padding-left/right 20px */
|
||||
width: calc(100% - 40px);
|
||||
text-align: left;
|
||||
transition: all 0.2s ease;
|
||||
}
|
||||
@@ -61,23 +68,13 @@
|
||||
background-color: rgba(139, 233, 253, 0.2);
|
||||
}
|
||||
|
||||
/* 主内容区 */
|
||||
.main-content {
|
||||
margin-left: 200px; /* 调整主内容区左外边距，与新侧边栏宽度匹配 */
|
||||
margin-left: 200px;
|
||||
padding: 20px;
|
||||
color: #333;
|
||||
}
|
||||
|
||||
body {
|
||||
margin: 0;
|
||||
font-family: Arial, sans-serif;
|
||||
}
|
||||
|
||||
#logoutMsg {
|
||||
color: #ff5555;
|
||||
font-size: 14px;
|
||||
margin-top: 10px;
|
||||
text-align: center;
|
||||
}
|
||||
.card {
|
||||
background: #fff;
|
||||
border-radius: 14px;
|
||||
@@ -141,9 +138,10 @@
|
||||
<h3>用户ID：{{ user_id }}</h3>
|
||||
</div>
|
||||
<div class="navigation-links">
|
||||
<a href="/">主页</a>
|
||||
<a href="{% url 'elastic:upload_page' %}">图片上传与识别</a>
|
||||
<a href="{% url 'elastic:manage_page' %}">数据管理（管理员）</a>
|
||||
<a href="{% url 'main:home' %}" onclick="return handleNavClick(this, '/');">主页</a>
|
||||
<a href="{% url 'elastic:upload_page' %}" onclick="return handleNavClick(this, '/elastic/upload/');">图片上传与识别</a>
|
||||
<a href="{% url 'elastic:manage_page' %}" onclick="return handleNavClick(this, '/elastic/manage/');">数据管理</a>
|
||||
<a href="/elastic/users/" onclick="return handleNavClick(this, '/elastic/users/');">用户管理</a>
|
||||
<button id="logoutBtn">退出登录</button>
|
||||
<div id="logoutMsg"></div>
|
||||
{% csrf_token %}
|
||||
@@ -189,13 +187,47 @@
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 登出脚本（保持不变） -->
|
||||
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
|
||||
<script>
|
||||
// 获取CSRF令牌的函数
|
||||
function getCookie(name) {
|
||||
const value = `; ${document.cookie}`;
|
||||
const parts = value.split(`; ${name}=`);
|
||||
if (parts.length === 2) return parts.pop().split(';').shift();
|
||||
}
|
||||
|
||||
// 导航点击处理函数，提供备用URL
|
||||
function handleNavClick(element, fallbackUrl) {
|
||||
// 尝试使用Django模板生成的URL，如果失败则使用备用URL
|
||||
try {
|
||||
// 如果模板渲染正常，直接返回true让默认行为处理
|
||||
return true;
|
||||
} catch (e) {
|
||||
// 如果模板渲染有问题，使用备用URL
|
||||
window.location.href = fallbackUrl;
|
||||
return false;
|
||||
}
|
||||
}
|
||||
|
||||
// 修复用户管理链接跳转问题
|
||||
document.addEventListener('DOMContentLoaded', function() {
|
||||
// 为用户管理链接添加事件监听器，确保正确跳转
|
||||
const userManagementLink = document.querySelector('a[href*="get_users"]');
|
||||
if (userManagementLink) {
|
||||
userManagementLink.addEventListener('click', function(e) {
|
||||
// 阻止默认行为
|
||||
e.preventDefault();
|
||||
|
||||
// 获取备用URL
|
||||
const fallbackUrl = this.getAttribute('onclick').match(/'([^']+)'/g)[1].replace(/'/g, '');
|
||||
|
||||
// 直接跳转到用户管理页面
|
||||
window.location.href = fallbackUrl;
|
||||
});
|
||||
}
|
||||
});
|
||||
|
||||
// 登出功能
|
||||
document.getElementById('logoutBtn').addEventListener('click', async () => {
|
||||
const msg = document.getElementById('logoutMsg');
|
||||
msg.textContent = '';
|
||||
@@ -221,9 +253,7 @@
|
||||
msg.textContent = e.message || '发生错误';
|
||||
}
|
||||
});
|
||||
</script>
|
||||
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
|
||||
<script>
|
||||
|
||||
async function loadAnalytics() {
|
||||
const resp = await fetch('/elastic/analytics/overview/');
|
||||
const d = await resp.json();
|
||||
@@ -308,4 +338,4 @@
|
||||
loadAnalytics();
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
</html>
|
||||
Reference in New Issue
Block a user