1326 lines
60 KiB
PHP
Executable File
1326 lines
60 KiB
PHP
Executable File
<?php
|
||
session_start();
|
||
require '../auth/config.php';
|
||
|
||
if (!isset($_SESSION['user_id']) || !isset($_SESSION['username'])) {
|
||
header("Location: ../auth/");
|
||
exit();
|
||
}
|
||
|
||
$user_id = $_SESSION['user_id'];
|
||
function get_user_full_info($conn, $user_id) {
|
||
$stmt = $conn->prepare("SELECT
|
||
username,
|
||
level,
|
||
points,
|
||
email,
|
||
register_time,
|
||
organization,
|
||
development_field,
|
||
skill_tags,
|
||
QQ
|
||
FROM users
|
||
WHERE id = ?");
|
||
$stmt->bind_param("i", $user_id);
|
||
$stmt->execute();
|
||
$result = $stmt->get_result();
|
||
if ($row = $result->fetch_assoc()) {
|
||
return $row;
|
||
}
|
||
return [
|
||
'username' => '未授权人员',
|
||
'level' => 1,
|
||
'points' => 0,
|
||
'email' => 'NULL',
|
||
'register_time' => 'NULL',
|
||
'organization' => 'NULL',
|
||
'development_field' => 'NULL',
|
||
'skill_tags' => 'NULL',
|
||
'QQ' => 'NULL'
|
||
];
|
||
}
|
||
|
||
$user_info = get_user_full_info($conn, $user_id);
|
||
$username = $user_info['username'];
|
||
$level = $user_info['level'];
|
||
$points = $user_info['points'];
|
||
$email = $user_info['email'];
|
||
$register_time = $user_info['register_time'];
|
||
$organization = $user_info['organization'];
|
||
$development_field = $user_info['development_field'];
|
||
$skill_tags = explode(',', $user_info['skill_tags']);
|
||
$QQ = $user_info['QQ'];
|
||
|
||
$UserPicture = "https://q2.qlogo.cn/headimg_dl?bs=$QQ&dst_uin=$QQ&spec=100&url_enc=0&referer=bu_interface&term_type=PC";
|
||
$levelDescriptions = [1 => '云境初探者', 2 => '云境行者', 3 => '云智大师', 4 => '云核守护者'];
|
||
$userLevelDescription = $levelDescriptions[$level] ?? '未知等级';
|
||
|
||
function get_user_players($conn, $user_id) {
|
||
$stmt = $conn->prepare("SELECT player_name, description, created_at FROM players WHERE user_id = ?");
|
||
$stmt->bind_param("i", $user_id);
|
||
$stmt->execute();
|
||
$result = $stmt->get_result();
|
||
$userPlayers = $result->fetch_all(MYSQLI_ASSOC);
|
||
$stmt->close();
|
||
return $userPlayers;
|
||
}
|
||
|
||
$user_players = get_user_players($conn, $user_id);
|
||
$max_players = 5;
|
||
$can_create_player = count($user_players) < $max_players;
|
||
|
||
// 管理功能 - 获取所有用户
|
||
function get_all_users($conn) {
|
||
$stmt = $conn->prepare("SELECT id, username, level, points, email, register_time, QQ FROM users");
|
||
$stmt->execute();
|
||
$result = $stmt->get_result();
|
||
$users = $result->fetch_all(MYSQLI_ASSOC);
|
||
$stmt->close();
|
||
return $users;
|
||
}
|
||
|
||
// 管理功能 - 获取所有玩家
|
||
function get_all_players($conn) {
|
||
$stmt = $conn->prepare("SELECT p.id, p.player_name, p.description, p.created_at, u.username as owner
|
||
FROM players p
|
||
JOIN users u ON p.user_id = u.id");
|
||
$stmt->execute();
|
||
$result = $stmt->get_result();
|
||
$players = $result->fetch_all(MYSQLI_ASSOC);
|
||
$stmt->close();
|
||
return $players;
|
||
}
|
||
|
||
// 只有管理员用户才能获取管理数据
|
||
if ($level == 4) {
|
||
$all_users = get_all_users($conn);
|
||
$all_players = get_all_players($conn);
|
||
}
|
||
|
||
$token = bin2hex(random_bytes(32));
|
||
$_SESSION['player_token'] = $token;
|
||
|
||
|
||
$conn->close();
|
||
?>
|
||
<!DOCTYPE html>
|
||
<html lang="zh-CN">
|
||
<head>
|
||
<meta charset="UTF-8">
|
||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||
<title>用户中心</title>
|
||
<script src="https://cdn.tailwindcss.com"></script>
|
||
<link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.7.2/css/all.min.css" rel="stylesheet">
|
||
<script src="https://cdn.tailwindcss.com"></script>
|
||
<link href="https://cdn.jsdelivr.net/npm/font-awesome@4.7.0/css/font-awesome.min.css" rel="stylesheet">
|
||
|
||
<script>
|
||
tailwind.config = {
|
||
theme: {
|
||
extend: {
|
||
colors: {
|
||
primary: '#007bff',
|
||
secondary: '#6c757d',
|
||
success: '#28a745',
|
||
danger: '#dc3545',
|
||
warning: '#ffc107',
|
||
info: '#17a2b8',
|
||
light: '#f8f9fa',
|
||
dark: '#343a40',
|
||
'level-1': '#6699CC',
|
||
'level-2': '#336699',
|
||
'level-3': '#FF9900',
|
||
'level-4': '#00CC00',
|
||
},
|
||
fontFamily: {
|
||
sans: ['Inter', 'system-ui', 'sans-serif'],
|
||
},
|
||
},
|
||
}
|
||
}
|
||
</script>
|
||
<style type="text/tailwindcss">
|
||
@layer utilities {
|
||
.content-auto {
|
||
content-visibility: auto;
|
||
}
|
||
.card-shadow {
|
||
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
|
||
}
|
||
.hover-lift {
|
||
transition: transform 0.2s, box-shadow 0.2s;
|
||
}
|
||
.hover-lift:hover {
|
||
transform: translateY(-2px);
|
||
box-shadow: 0 6px 16px rgba(0, 0, 0, 0.12);
|
||
}
|
||
.btn-transition {
|
||
transition: all 0.2s ease;
|
||
}
|
||
.level-badge {
|
||
@apply px-2 py-1 rounded-md font-bold text-sm;
|
||
}
|
||
.modal-transition {
|
||
transition: opacity 0.3s ease, transform 0.3s ease;
|
||
}
|
||
.admin-panel-shadow {
|
||
box-shadow: 0 0 15px rgba(0, 0, 0, 0.1);
|
||
}
|
||
}
|
||
</style>
|
||
</head>
|
||
<body class="bg-gray-50 text-gray-800 font-sans">
|
||
<div class="relative z-10">
|
||
<header class="bg-white shadow-sm sticky top-0 z-10">
|
||
<div class="container mx-auto px-4 py-3">
|
||
<div class="flex justify-between items-center">
|
||
<div class="flex items-center space-x-2">
|
||
<i class="fa fa-cloud text-primary text-xl"></i>
|
||
<h2 class="text-lg font-semibold">圆周云境</h2>
|
||
</div>
|
||
<div class="flex items-center space-x-4">
|
||
<a href="./user_id_card.php"><div class="flex items-center space-x-2">
|
||
<div class="w-8 h-8 rounded-full bg-gray-200 overflow-hidden">
|
||
<img src="<? echo $UserPicture; ?>" alt="用户头像" class="w-full h-full object-cover">;
|
||
</div>
|
||
<span class="hidden sm:inline-block text-sm font-medium"><?php echo htmlspecialchars($username); ?></span>
|
||
</div>
|
||
</div></a>
|
||
</div>
|
||
<div class="h-1 bg-primary mt-2"></div>
|
||
</div>
|
||
</header>
|
||
|
||
<main class="container mx-auto px-4 py-6">
|
||
<section class="bg-white rounded-xl p-6 mb-6 card-shadow">
|
||
<div class="flex flex-col md:flex-row md:items-center justify-between">
|
||
<div class="mb-4 md:mb-0">
|
||
<h1 class="text-2xl font-bold mb-1">CCS用户后台</h1>
|
||
<p class="text-gray-600">管理你的玩家信息</p>
|
||
</div>
|
||
<div class="flex items-center space-x-3">
|
||
<div class="flex items-center space-x-2">
|
||
<span class="text-sm text-gray-600">等级：</span>
|
||
<span class="level-badge bg-E6F0FF text-level-1"><?php echo $userLevelDescription; ?></span>
|
||
</div>
|
||
<div class="flex items-center space-x-2">
|
||
<span class="text-sm text-gray-600">积分：</span>
|
||
<span class="font-medium"><?php echo $points; ?></span>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="border-t border-gray-100 mt-4 pt-4 grid grid-cols-1 md:grid-cols-3 gap-4">
|
||
<div class="flex items-center space-x-3">
|
||
<div class="w-10 h-10 rounded-full bg-blue-100 flex items-center justify-center text-primary">
|
||
<i class="fa fa-user"></i>
|
||
</div>
|
||
<div>
|
||
<p class="text-sm text-gray-500">用户名</p>
|
||
<p class="font-semibold"><?php echo htmlspecialchars($username); ?></p>
|
||
</div>
|
||
</div>
|
||
<div class="flex items-center space-x-3">
|
||
<div class="w-10 h-10 rounded-full bg-blue-100 flex items-center justify-center text-primary">
|
||
<i class="fa fa-qq"></i>
|
||
</div>
|
||
<div>
|
||
<p class="text-sm text-gray-500">QQ</p>
|
||
<p class="font-semibold"><?php echo htmlspecialchars($QQ); ?></p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<section class="mb-6">
|
||
<div class="flex flex-wrap gap-2">
|
||
<a href="#" class="px-4 py-2 rounded-lg bg-primary text-white btn-transition hover:bg-primary/90">
|
||
<i class="fa fa-home mr-2"></i>首页
|
||
</a>
|
||
<?php if ($level == 4): ?>
|
||
<a href="#" id="adminBtn" class="px-4 py-2 rounded-lg bg-red-500 text-white border border-red-500 btn-transition hover:bg-red-600">
|
||
<i class="fa fa-crown mr-2"></i>管理
|
||
</a>
|
||
<?php endif; ?>
|
||
<a href="#" id="settingsBtn" class="px-4 py-2 rounded-lg bg-white text-gray-700 border border-gray-200 btn-transition hover:border-primary hover:text-primary">
|
||
<i class="fa fa-cog mr-2"></i>设置
|
||
</a>
|
||
</div>
|
||
</section>
|
||
|
||
<section class="mb-6">
|
||
<div class="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-4 gap-4">
|
||
<a href="./new" class="bg-white p-4 rounded-xl border border-gray-100 hover-lift text-center">
|
||
<div class="w-12 h-12 mx-auto mb-2 rounded-full bg-blue-100 flex items-center justify-center text-primary">
|
||
<i class="fa fa-plus text-xl"></i>
|
||
</div>
|
||
<p class="font-medium">创建玩家</p>
|
||
</a>
|
||
|
||
<a href="./doc.html" class="bg-white p-4 rounded-xl border border-gray-100 hover-lift text-center">
|
||
<div class="w-12 h-12 mx-auto mb-2 rounded-full bg-purple-100 flex items-center justify-center text-purple-600">
|
||
<i class="fa fa-book text-xl"></i>
|
||
</div>
|
||
<p class="font-medium">文档中心</p>
|
||
</a>
|
||
<a href="https://mc.none.pw" class="bg-white p-4 rounded-xl border border-gray-100 hover-lift text-center">
|
||
<div class="w-12 h-12 mx-auto mb-2 rounded-full bg-yellow-100 flex items-center justify-center text-yellow-600">
|
||
<i class="fa fa-comments text-xl"></i>
|
||
</div>
|
||
<p class="font-medium">服务器官网</p>
|
||
</a>
|
||
</div>
|
||
</section>
|
||
|
||
<section class="mb-6">
|
||
<div class="flex justify-between items-center mb-4">
|
||
<h2 class="text-xl font-bold">玩家信息</h2>
|
||
</div>
|
||
|
||
<div class="grid grid-cols-1 md:grid-cols-2 gap-4">
|
||
<?php foreach ($user_players as $player): ?>
|
||
<div class="bg-white rounded-xl p-5 border border-gray-100 hover-lift">
|
||
<div class="flex justify-between items-start mb-3">
|
||
<div>
|
||
<h3 class="font-semibold text-lg"><?= htmlspecialchars($player['player_name']) ?></h3>
|
||
</div>
|
||
<span class="px-2 py-1 bg-green-100 text-green-600 rounded-md text-xs font-medium">
|
||
<?= htmlspecialchars($player['description']) ?>
|
||
</span>
|
||
</div>
|
||
|
||
<div class="flex justify-between">
|
||
<a href="./player/index.php?player_name=<?php echo urlencode(htmlspecialchars($player['player_name'])); ?>&token=<?php echo $token; ?>" class="text-primary hover:text-primary/80 btn-transition text-sm font-medium">
|
||
<i class="fa fa-terminal mr-1"></i> 查看详情
|
||
</a>
|
||
</div>
|
||
</div>
|
||
<?php endforeach; ?>
|
||
<a href="./new"><div class="bg-white rounded-xl p-5 border border-gray-200 border-dashed hover-lift flex flex-col items-center justify-center cursor-pointer">
|
||
<div class="w-16 h-16 rounded-full bg-blue-50 flex items-center justify-center text-primary mb-3">
|
||
<i class="fa fa-plus text-2xl"></i>
|
||
</div>
|
||
<p class="text-center text-gray-600">添加新玩家</p>
|
||
</div></a>
|
||
</div>
|
||
</section>
|
||
|
||
<section class="bg-white rounded-xl p-6 mb-6 card-shadow">
|
||
<div class="flex justify-between items-center mb-4">
|
||
<h2 class="text-xl font-bold">用户信息</h2>
|
||
<div class="identity-card-icon" id="showIdCard"></div>
|
||
</div>
|
||
|
||
<div class="grid grid-cols-1 md:grid-cols-2 gap-6">
|
||
<div>
|
||
<div class="mb-4">
|
||
<label class="block text-sm font-medium text-gray-500 mb-1">用户名</label>
|
||
<p class="font-medium"><?php echo htmlspecialchars($username); ?></p>
|
||
</div>
|
||
<div class="mb-4">
|
||
<label class="block text-sm font-medium text-gray-500 mb-1">邮箱</label>
|
||
<p class="font-medium"><?php echo htmlspecialchars($email); ?></p>
|
||
</div>
|
||
<div class="mb-4">
|
||
<label class="block text-sm font-medium text-gray-500 mb-1">注册时间</label>
|
||
<p class="font-medium"><?php echo htmlspecialchars(date('Y-m-d', strtotime($register_time))); ?></p>
|
||
</div>
|
||
<div class="mb-4">
|
||
<label class="block text-sm font-medium text-gray-500 mb-1">所属组织</label>
|
||
<p class="font-medium"><?php echo htmlspecialchars($organization); ?></p>
|
||
</div>
|
||
</div>
|
||
<div>
|
||
<div class="mb-4">
|
||
<label class="block text-sm font-medium text-gray-500 mb-1">开发领域</label>
|
||
<p class="font-medium"><?php echo htmlspecialchars($development_field); ?></p>
|
||
</div>
|
||
<div class="mb-4">
|
||
<label class="block text-sm font-medium text-gray-500 mb-1">技能标签</label>
|
||
<div class="flex flex-wrap gap-2 mt-1">
|
||
<?php foreach ($skill_tags as $tag): ?>
|
||
<span class="px-2 py-1 bg-gray-100 text-gray-700 rounded-full text-xs">
|
||
<?php echo htmlspecialchars(trim($tag)); ?>
|
||
</span>
|
||
<?php endforeach; ?>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
</main>
|
||
|
||
<footer class="bg-white border-t border-gray-200 mt-10">
|
||
<div class="container mx-auto px-4 py-6">
|
||
<div class="flex flex-col md:flex-row justify-between items-center">
|
||
<div class="mb-4 md:mb-0">
|
||
<div class="flex items-center space-x-2">
|
||
<i class="fa fa-cloud text-primary text-xl"></i>
|
||
<span class="font-medium">圆周云境用户后台</span>
|
||
</div>
|
||
<p class="text-sm text-gray-500 mt-1">一切，为了梦，为了你</p>
|
||
<p class="text-sm text-gray-500 mt-1">本站由<a href="https://rainyun.com">雨云</a>提供技术支持</p>
|
||
<p class="text-sm text-gray-500 mt-1">请遵守国家法律,本站可能与某些老旧浏览器不兼容 | 背景图片来源:<a href="https://bluearchive-cn.com/">《蔚蓝档案》</a>侵权请联系删除</p>
|
||
</div>
|
||
<div class="flex space-x-6">
|
||
<a href="https://space.bilibili.com/1382004137?spm_id_from=333.1007.0.0" class="text-gray-400 hover:text-white transition-colors duration-200">
|
||
<i class="fa fa-bilibili"></i>
|
||
</a>
|
||
</div>
|
||
</div>
|
||
<div class="mt-6 pt-6 border-t border-gray-100 flex flex-col md:flex-row justify-between items-center">
|
||
<div class="mb-4 md:mb-0">
|
||
<a href="./terms.html" class="text-sm text-gray-500 hover:text-primary mr-4">用户协议</a>
|
||
<a href="./cookie.html" class="text-sm text-gray-500 hover:text-primary">Cookie政策</a>
|
||
</div>
|
||
<div class="text-sm text-gray-500">
|
||
Copyright © 2023-2025 CCSIT Network.All rights reserved.
|
||
© 圆周云境信息技术 保留所有权利。| 版本:2.8.9(submitID:NULL(未开源))
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</footer>
|
||
|
||
<div id="logoutModal" class="fixed inset-0 bg-black bg-opacity-50 flex items-center justify-center z-50 hidden">
|
||
<div class="bg-white rounded-xl p-6 max-w-md w-full mx-4 transform transition-all scale-95 opacity-0" id="logoutModalContent">
|
||
<div class="text-center">
|
||
<div class="w-16 h-16 bg-red-100 rounded-full flex items-center justify-center mx-auto mb-4">
|
||
<i class="fa fa-sign-out text-red-500 text-2xl"></i>
|
||
</div>
|
||
<h3 class="text-xl font-bold text-gray-900 mb-2">确认登出</h3>
|
||
<p class="text-gray-600 mb-6">你确定要退出当前账户吗？</p>
|
||
<div class="flex space-x-4">
|
||
<button id="cancelLogout" class="flex-1 py-2 px-4 border border-gray-300 rounded-lg text-gray-700 hover:bg-gray-50 btn-transition">
|
||
取消
|
||
</button>
|
||
<button id="confirmLogout" class="flex-1 py-2 px-4 bg-red-500 text-white rounded-lg hover:bg-red-600 btn-transition">
|
||
确认登出
|
||
</button>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div id="settingsModal" class="fixed inset-0 bg-black bg-opacity-50 flex items-center justify-center z-50 hidden">
|
||
<div class="bg-white rounded-xl p-6 max-w-md w-full mx-4 transform transition-all scale-95 opacity-0 modal-transition" id="settingsModalContent">
|
||
<div class="flex justify-between items-center mb-4">
|
||
<h3 class="text-xl font-bold text-gray-900">账户设置</h3>
|
||
<button id="closeSettingsModal" class="text-gray-400 hover:text-gray-600">
|
||
<i class="fa fa-times text-xl"></i>
|
||
</button>
|
||
</div>
|
||
|
||
<div class="space-y-4" id="settingsOptions">
|
||
<button id="changePasswordBtn" class="w-full flex items-start p-3 border border-gray-200 rounded-lg hover:bg-gray-50 transition-colors text-left">
|
||
<div class="w-10 h-10 rounded-full bg-blue-100 flex items-center justify-center text-primary mr-3">
|
||
<i class="fa fa-key"></i>
|
||
</div>
|
||
<div class="flex-1">
|
||
<h4 class="font-medium">修改密码</h4>
|
||
<p class="text-sm text-gray-500">更改您的账户登录密码</p>
|
||
</div>
|
||
<i class="fa fa-angle-right text-gray-400 mt-1"></i>
|
||
</button>
|
||
|
||
<button id="deleteAccountBtn" class="w-full flex items-start p-3 border border-gray-200 rounded-lg hover:bg-gray-50 transition-colors text-left">
|
||
<div class="w-10 h-10 rounded-full bg-red-100 flex items-center justify-center text-red-500 mr-3">
|
||
<i class="fa fa-trash"></i>
|
||
</div>
|
||
<div class="flex-1">
|
||
<h4 class="font-medium text-red-500">注销账户</h4>
|
||
<p class="text-sm text-gray-500">永久删除您的账户</p>
|
||
</div>
|
||
<i class="fa fa-angle-right text-gray-400 mt-1"></i>
|
||
</button>
|
||
</div>
|
||
|
||
<div id="changePasswordForm" class="hidden space-y-4">
|
||
<div class="flex justify-between items-center mb-4">
|
||
<h4 class="text-lg font-semibold">修改密码</h4>
|
||
<button id="backFromPasswordBtn" class="text-gray-400 hover:text-gray-600">
|
||
<i class="fa fa-times"></i>
|
||
</button>
|
||
</div>
|
||
<form id="passwordForm" method="POST" action="change_password.php">
|
||
<div class="mb-3">
|
||
<label class="block text-sm font-medium text-gray-700 mb-1">当前密码</label>
|
||
<input type="password" name="current_password" class="w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-primary/50" required>
|
||
</div>
|
||
<div class="mb-3">
|
||
<label class="block text-sm font-medium text-gray-700 mb-1">新密码</label>
|
||
<input type="password" name="new_password" class="w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-primary/50" required>
|
||
<p class="text-xs text-gray-500 mt-1">密码必须包含大小写字母和数字，长度至少8位</p>
|
||
</div>
|
||
<div class="mb-4">
|
||
<label class="block text-sm font-medium text-gray-700 mb-1">确认新密码</label>
|
||
<input type="password" name="confirm_password" class="w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-primary/50" required>
|
||
</div>
|
||
<div class="flex space-x-3">
|
||
<button type="button" id="cancelPasswordBtn" class="flex-1 py-2 px-4 border border-gray-300 rounded-lg text-gray-700 hover:bg-gray-50 btn-transition">
|
||
取消
|
||
</button>
|
||
<button type="submit" class="flex-1 py-2 px-4 bg-primary text-white rounded-lg hover:bg-primary/90 btn-transition">
|
||
保存更改
|
||
</button>
|
||
</div>
|
||
</form>
|
||
</div>
|
||
|
||
<div id="deleteAccountForm" class="hidden space-y-4">
|
||
<div class="flex justify-between items-center mb-4">
|
||
<h4 class="text-lg font-semibold text-red-600">注销账户</h4>
|
||
<button id="backFromDeleteBtn" class="text-gray-400 hover:text-gray-600">
|
||
<i class="fa fa-times"></i>
|
||
</button>
|
||
</div>
|
||
<p class="text-gray-600">警告：此操作将永久删除您的账户和所有相关数据，且无法恢复。</p>
|
||
<form id="deleteForm" method="POST" action="delete_account.php">
|
||
<div class="mb-3">
|
||
<label class="block text-sm font-medium text-gray-700 mb-1">输入密码确认</label>
|
||
<input type="password" name="password" class="w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-red-500/50" required>
|
||
</div>
|
||
<div class="mb-4">
|
||
<label class="block text-sm font-medium text-gray-700 mb-1">输入"确认注销"以确认</label>
|
||
<input type="text" name="confirm" class="w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-red-500/50" required>
|
||
</div>
|
||
<div class="flex space-x-3">
|
||
<button type="button" id="cancelDeleteBtn" class="flex-1 py-2 px-4 border border-gray-300 rounded-lg text-gray-700 hover:bg-gray-50 btn-transition">
|
||
取消
|
||
</button>
|
||
<button type="submit" class="flex-1 py-2 px-4 bg-red-500 text-white rounded-lg hover:bg-red-600 btn-transition">
|
||
确认注销
|
||
</button>
|
||
</div>
|
||
</form>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div id="adminModal" class="fixed inset-0 bg-black bg-opacity-50 flex items-center justify-center z-50 hidden">
|
||
<div class="bg-white rounded-xl p-6 max-w-4xl w-full mx-4 transform transition-all scale-95 opacity-0 modal-transition" id="adminModalContent">
|
||
<div class="flex justify-between items-center mb-4">
|
||
<h3 class="text-xl font-bold text-gray-900">管理面板</h3>
|
||
<button id="closeAdminModal" class="text-gray-400 hover:text-gray-600">
|
||
<i class="fa fa-times text-xl"></i>
|
||
</button>
|
||
</div>
|
||
|
||
<div class="flex space-x-4 mb-4">
|
||
<button id="userManagerTab" class="px-4 py-2 rounded-lg bg-primary text-white btn-transition">
|
||
用户管理
|
||
</button>
|
||
<button id="playerManagerTab" class="px-4 py-2 rounded-lg bg-gray-200 text-gray-700 btn-transition">
|
||
玩家管理
|
||
</button>
|
||
</div>
|
||
|
||
<div id="userManager" class="admin-panel">
|
||
<div class="flex justify-between items-center mb-4">
|
||
<h4 class="text-lg font-semibold">用户列表</h4>
|
||
<div class="relative">
|
||
<input type="text" id="userSearch" placeholder="搜索用户..." class="pl-10 pr-4 py-2 border border-gray-300 rounded-lg focus:outline-none focus:ring-2 focus:ring-primary/50">
|
||
<i class="fa fa-search absolute left-3 top-1/2 transform -translate-y-1/2 text-gray-400"></i>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="overflow-x-auto">
|
||
<table class="min-w-full bg-white rounded-lg overflow-hidden">
|
||
<thead class="bg-gray-50">
|
||
<tr>
|
||
<th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">ID</th>
|
||
<th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">用户名</th>
|
||
<th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">等级</th>
|
||
<th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">积分</th>
|
||
<th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">邮箱</th>
|
||
<th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">注册时间</th>
|
||
<th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">QQ号码</th>
|
||
<th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">操作</th>
|
||
</tr>
|
||
</thead>
|
||
<tbody class="divide-y divide-gray-200">
|
||
<?php if ($level == 4 && isset($all_users)): ?>
|
||
<?php foreach ($all_users as $user): ?>
|
||
<tr class="hover:bg-gray-50 transition-colors">
|
||
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-900"><?= $user['id'] ?></td>
|
||
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-900"><?= htmlspecialchars($user['username']) ?></td>
|
||
<td class="px-6 py-4 whitespace-nowrap">
|
||
<?php
|
||
$levelClass = ['1' => 'bg-blue-100 text-blue-800', '2' => 'bg-indigo-100 text-indigo-800', '3' => 'bg-purple-100 text-purple-800', '4' => 'bg-green-100 text-green-800'];
|
||
$levelText = ['1' => '云境初探者', '2' => '云境行者', '3' => '云智大师', '4' => '云核守护者'];
|
||
?>
|
||
<span class="px-2 py-1 text-xs rounded-full <?= $levelClass[$user['level']] ?? 'bg-gray-100 text-gray-800' ?>">
|
||
<?= $levelText[$user['level']] ?? '未知等级' ?>
|
||
</span>
|
||
</td>
|
||
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-900"><?= $user['points'] ?></td>
|
||
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-900"><?= htmlspecialchars($user['email']) ?></td>
|
||
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500"><?= date('Y-m-d', strtotime($user['register_time'])) ?></td>
|
||
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500"><?= htmlspecialchars($user['QQ']); ?></td>
|
||
<td class="px-6 py-4 whitespace-nowrap text-sm font-medium">
|
||
<button class="text-primary hover:text-primary/80 mr-3 edit-user-btn" data-id="<?= $user['id'] ?>" data-username="<?= htmlspecialchars($user['username']) ?>" data-level="<?= $user['level'] ?>" data-points="<?= $user['points'] ?>" data-email="<?= htmlspecialchars($user['email']) ?>">
|
||
<i class="fa fa-edit"></i> 编辑
|
||
</button>
|
||
<button class="text-red-500 hover:text-red-700 delete-user-btn" data-id="<?= $user['id'] ?>" data-username="<?= htmlspecialchars($user['username']) ?>">
|
||
<i class="fa fa-trash"></i> 删除
|
||
</button>
|
||
</td>
|
||
</tr>
|
||
<?php endforeach; ?>
|
||
<?php endif; ?>
|
||
</tbody>
|
||
</table>
|
||
</div>
|
||
</div>
|
||
|
||
<div id="playerManager" class="admin-panel hidden">
|
||
<div class="flex justify-between items-center mb-4">
|
||
<h4 class="text-lg font-semibold">玩家列表</h4>
|
||
<div class="relative">
|
||
<input type="text" id="playerSearch" placeholder="搜索玩家..." class="pl-10 pr-4 py-2 border border-gray-300 rounded-lg focus:outline-none focus:ring-2 focus:ring-primary/50">
|
||
</div>
|
||
</div>
|
||
|
||
<div class="overflow-x-auto">
|
||
<table class="min-w-full bg-white rounded-lg overflow-hidden">
|
||
<thead class="bg-gray-50">
|
||
<tr>
|
||
<th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">ID</th>
|
||
<th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">玩家名称</th>
|
||
<th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">描述</th>
|
||
<th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">所有者</th>
|
||
<th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">创建时间</th>
|
||
<th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">操作</th>
|
||
</tr>
|
||
</thead>
|
||
<tbody class="divide-y divide-gray-200">
|
||
<?php if ($level == 4 && isset($all_players)): ?>
|
||
<?php foreach ($all_players as $player): ?>
|
||
<tr class="hover:bg-gray-50 transition-colors">
|
||
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-900"><?= $player['id'] ?></td>
|
||
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-900"><?= htmlspecialchars($player['player_name']) ?></td>
|
||
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-900"><?= htmlspecialchars($player['description']) ?></td>
|
||
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-900"><?= htmlspecialchars($player['owner']) ?></td>
|
||
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500"><?= date('Y-m-d', strtotime($player['created_at'])) ?></td>
|
||
<td class="px-6 py-4 whitespace-nowrap text-sm font-medium">
|
||
<button class="text-primary hover:text-primary/80 mr-3 edit-player-btn" data-id="<?= $player['id'] ?>" data-name="<?= htmlspecialchars($player['player_name']) ?>" data-desc="<?= htmlspecialchars($player['description']) ?>" data-owner="<?= htmlspecialchars($player['owner']) ?>">
|
||
<i class="fa fa-edit"></i> 编辑
|
||
</button>
|
||
<button class="text-red-500 hover:text-red-700 delete-player-btn" data-id="<?= $player['id'] ?>" data-name="<?= htmlspecialchars($player['player_name']) ?>">
|
||
<i class="fa fa-trash"></i> 删除
|
||
</button>
|
||
</td>
|
||
</tr>
|
||
<?php endforeach; ?>
|
||
<?php endif; ?>
|
||
</tbody>
|
||
</table>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div id="editUserModal" class="fixed inset-0 bg-black bg-opacity-50 flex items-center justify-center z-50 hidden">
|
||
<div class="bg-white rounded-xl p-6 max-w-md w-full mx-4 transform transition-all scale-95 opacity-0 modal-transition" id="editUserModalContent">
|
||
<div class="flex justify-between items-center mb-4">
|
||
<h3 class="text-xl font-bold text-gray-900">编辑用户</h3>
|
||
<button id="closeEditUserModal" class="text-gray-400 hover:text-gray-600">
|
||
<i class="fa fa-times text-xl"></i>
|
||
</button>
|
||
</div>
|
||
|
||
<form id="editUserForm" method="POST" action="./admin/admin_edit_user.php">
|
||
<input type="hidden" id="editUserId" name="user_id">
|
||
|
||
<div class="mb-3">
|
||
<label class="block text-sm font-medium text-gray-700 mb-1">用户名</label>
|
||
<input type="text" id="editUsername" name="username" class="w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-primary/50" required>
|
||
</div>
|
||
|
||
<div class="mb-3">
|
||
<label class="block text-sm font-medium text-gray-700 mb-1">等级</label>
|
||
<select id="editUserLevel" name="level" class="w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-primary/50">
|
||
<option value="1">云境初探者</option>
|
||
<option value="2">云境行者</option>
|
||
<option value="3">云智大师</option>
|
||
<option value="4">云核守护者</option>
|
||
</select>
|
||
</div>
|
||
|
||
<div class="mb-3">
|
||
<label class="block text-sm font-medium text-gray-700 mb-1">积分</label>
|
||
<input type="number" id="editUserPoints" name="points" class="w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-primary/50" required>
|
||
</div>
|
||
|
||
<div class="mb-4">
|
||
<label class="block text-sm font-medium text-gray-700 mb-1">邮箱</label>
|
||
<input type="email" id="editUserEmail" name="email" class="w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-primary/50" required>
|
||
</div>
|
||
|
||
<div class="flex space-x-3">
|
||
<button type="button" id="cancelEditUserBtn" class="flex-1 py-2 px-4 border border-gray-300 rounded-lg text-gray-700 hover:bg-gray-50 btn-transition">
|
||
取消
|
||
</button>
|
||
<button type="submit" class="flex-1 py-2 px-4 bg-primary text-white rounded-lg hover:bg-primary/90 btn-transition">
|
||
保存更改
|
||
</button>
|
||
</div>
|
||
</form>
|
||
</div>
|
||
</div>
|
||
|
||
<div id="editPlayerModal" class="fixed inset-0 bg-black bg-opacity-50 flex items-center justify-center z-50 hidden">
|
||
<div class="bg-white rounded-xl p-6 max-w-md w-full mx-4 transform transition-all scale-95 opacity-0 modal-transition" id="editPlayerModalContent">
|
||
<div class="flex justify-between items-center mb-4">
|
||
<h3 class="text-xl font-bold text-gray-900">编辑玩家</h3>
|
||
<button id="closeEditPlayerModal" class="text-gray-400 hover:text-gray-600">
|
||
<i class="fa fa-times text-xl"></i>
|
||
</button>
|
||
</div>
|
||
|
||
<form id="editPlayerForm" method="POST" action="./admin/admin_edit_player.php">
|
||
<input type="hidden" id="editPlayerId" name="player_id">
|
||
|
||
<div class="mb-3">
|
||
<label class="block text-sm font-medium text-gray-700 mb-1">玩家名称</label>
|
||
<input type="text" id="editPlayerName" name="player_name" class="w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-primary/50" required>
|
||
</div>
|
||
|
||
<div class="mb-3">
|
||
<label class="block text-sm font-medium text-gray-700 mb-1">描述</label>
|
||
<input type="text" id="editPlayerDesc" name="description" class="w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-primary/50" required>
|
||
</div>
|
||
|
||
<div class="mb-4">
|
||
<label class="block text-sm font-medium text-gray-700 mb-1">所有者</label>
|
||
<input type="text" id="editPlayerOwner" name="owner" class="w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-primary/50" disabled>
|
||
</div>
|
||
|
||
<div class="flex space-x-3">
|
||
<button type="button" id="cancelEditPlayerBtn" class="flex-1 py-2 px-4 border border-gray-300 rounded-lg text-gray-700 hover:bg-gray-50 btn-transition">
|
||
取消
|
||
</button>
|
||
<button type="submit" class="flex-1 py-2 px-4 bg-primary text-white rounded-lg hover:bg-primary/90 btn-transition">
|
||
保存更改
|
||
</button>
|
||
</div>
|
||
</form>
|
||
</div>
|
||
</div>
|
||
|
||
<div id="deleteUserModal" class="fixed inset-0 bg-black bg-opacity-50 flex items-center justify-center z-50 hidden">
|
||
<div class="bg-white rounded-xl p-6 max-w-md w-full mx-4 transform transition-all scale-95 opacity-0" id="deleteUserModalContent">
|
||
<div class="text-center">
|
||
<div class="w-16 h-16 bg-red-100 rounded-full flex items-center justify-center mx-auto mb-4">
|
||
<i class="fa fa-trash text-red-500 text-2xl"></i>
|
||
</div>
|
||
<h3 class="text-xl font-bold text-gray-900 mb-2">删除用户</h3>
|
||
<p class="text-gray-600 mb-6">你确定要删除用户 <span id="deleteUserName" class="font-semibold text-red-500"></span> 吗？此操作无法撤销！</p>
|
||
<div class="flex space-x-4">
|
||
<button id="cancelDeleteUserBtn" class="flex-1 py-2 px-4 border border-gray-300 rounded-lg text-gray-700 hover:bg-gray-50 btn-transition">
|
||
取消
|
||
</button>
|
||
<button id="confirmDeleteUserBtn" class="flex-1 py-2 px-4 bg-red-500 text-white rounded-lg hover:bg-red-600 btn-transition">
|
||
确认删除
|
||
</button>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div id="deletePlayerModal" class="fixed inset-0 bg-black bg-opacity-50 flex items-center justify-center z-50 hidden">
|
||
<div class="bg-white rounded-xl p-6 max-w-md w-full mx-4 transform transition-all scale-95 opacity-0" id="deletePlayerModalContent">
|
||
<div class="text-center">
|
||
<div class="w-16 h-16 bg-red-100 rounded-full flex items-center justify-center mx-auto mb-4">
|
||
<i class="fa fa-trash text-red-500 text-2xl"></i>
|
||
</div>
|
||
<h3 class="text-xl font-bold text-gray-900 mb-2">删除玩家</h3>
|
||
<p class="text-gray-600 mb-6">你确定要删除玩家 <span id="deletePlayerName" class="font-semibold text-red-500"></span> 吗？此操作无法撤销！</p>
|
||
<div class="flex space-x-4">
|
||
<button id="cancelDeletePlayerBtn" class="flex-1 py-2 px-4 border border-gray-300 rounded-lg text-gray-700 hover:bg-gray-50 btn-transition">
|
||
取消
|
||
</button>
|
||
<button id="confirmDeletePlayerBtn" class="flex-1 py-2 px-4 bg-red-500 text-white rounded-lg hover:bg-red-600 btn-transition">
|
||
确认删除
|
||
</button>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="fixed bottom-6 right-6 z-40">
|
||
<button id="logoutBtn" class="w-14 h-14 rounded-full bg-red-500 text-white shadow-lg flex items-center justify-center hover:bg-red-600 transition-all transform hover:scale-105">
|
||
<i class="fa fa-sign-out text-xl"></i>
|
||
</button>
|
||
</div>
|
||
|
||
<script>
|
||
const logoutBtn = document.getElementById('logoutBtn');
|
||
const logoutModal = document.getElementById('logoutModal');
|
||
const logoutModalContent = document.getElementById('logoutModalContent');
|
||
const cancelLogout = document.getElementById('cancelLogout');
|
||
const confirmLogout = document.getElementById('confirmLogout');
|
||
|
||
logoutBtn.addEventListener('click', () => {
|
||
logoutModal.classList.remove('hidden');
|
||
setTimeout(() => {
|
||
logoutModalContent.classList.remove('scale-95', 'opacity-0');
|
||
logoutModalContent.classList.add('scale-100', 'opacity-100');
|
||
}, 10);
|
||
});
|
||
|
||
function closeLogoutModal() {
|
||
logoutModalContent.classList.remove('scale-100', 'opacity-100');
|
||
logoutModalContent.classList.add('scale-95', 'opacity-0');
|
||
setTimeout(() => {
|
||
logoutModal.classList.add('hidden');
|
||
}, 300);
|
||
}
|
||
|
||
cancelLogout.addEventListener('click', closeLogoutModal);
|
||
confirmLogout.addEventListener('click', () => {
|
||
window.location.href = './logout.php';
|
||
closeLogoutModal();
|
||
});
|
||
|
||
logoutModal.addEventListener('click', (e) => {
|
||
if (e.target === logoutModal) {
|
||
closeLogoutModal();
|
||
}
|
||
});
|
||
|
||
const settingsBtn = document.getElementById('settingsBtn');
|
||
const settingsModal = document.getElementById('settingsModal');
|
||
const settingsModalContent = document.getElementById('settingsModalContent');
|
||
const closeSettingsModal = document.getElementById('closeSettingsModal');
|
||
|
||
settingsBtn.addEventListener('click', () => {
|
||
settingsModal.classList.remove('hidden');
|
||
setTimeout(() => {
|
||
settingsModalContent.classList.remove('scale-95', 'opacity-0');
|
||
settingsModalContent.classList.add('scale-100', 'opacity-100');
|
||
}, 10);
|
||
});
|
||
|
||
function closeSettingsModalFunc() {
|
||
settingsModalContent.classList.remove('scale-100', 'opacity-100');
|
||
settingsModalContent.classList.add('scale-95', 'opacity-0');
|
||
setTimeout(() => {
|
||
settingsModal.classList.add('hidden');
|
||
document.getElementById('settingsOptions').classList.remove('hidden');
|
||
document.getElementById('changePasswordForm').classList.add('hidden');
|
||
document.getElementById('deleteAccountForm').classList.add('hidden');
|
||
}, 300);
|
||
}
|
||
|
||
closeSettingsModal.addEventListener('click', closeSettingsModalFunc);
|
||
|
||
settingsModal.addEventListener('click', (e) => {
|
||
if (e.target === settingsModal) {
|
||
closeSettingsModalFunc();
|
||
}
|
||
});
|
||
|
||
const settingsOptions = document.getElementById('settingsOptions');
|
||
const changePasswordBtn = document.getElementById('changePasswordBtn');
|
||
const deleteAccountBtn = document.getElementById('deleteAccountBtn');
|
||
const backFromPasswordBtn = document.getElementById('backFromPasswordBtn');
|
||
const backFromDeleteBtn = document.getElementById('backFromDeleteBtn');
|
||
const changePasswordForm = document.getElementById('changePasswordForm');
|
||
const deleteAccountForm = document.getElementById('deleteAccountForm');
|
||
const cancelPasswordBtn = document.getElementById('cancelPasswordBtn');
|
||
const cancelDeleteBtn = document.getElementById('cancelDeleteBtn');
|
||
|
||
changePasswordBtn.addEventListener('click', () => {
|
||
settingsOptions.classList.add('hidden');
|
||
changePasswordForm.classList.remove('hidden');
|
||
});
|
||
|
||
deleteAccountBtn.addEventListener('click', () => {
|
||
settingsOptions.classList.add('hidden');
|
||
deleteAccountForm.classList.remove('hidden');
|
||
});
|
||
|
||
function backToSettings() {
|
||
settingsOptions.classList.remove('hidden');
|
||
changePasswordForm.classList.add('hidden');
|
||
deleteAccountForm.classList.add('hidden');
|
||
}
|
||
|
||
backFromPasswordBtn.addEventListener('click', backToSettings);
|
||
backFromDeleteBtn.addEventListener('click', backToSettings);
|
||
cancelPasswordBtn.addEventListener('click', backToSettings);
|
||
cancelDeleteBtn.addEventListener('click', backToSettings);
|
||
|
||
const passwordForm = document.getElementById('passwordForm');
|
||
const deleteForm = document.getElementById('deleteForm');
|
||
|
||
passwordForm.addEventListener('submit', function(e) {
|
||
e.preventDefault();
|
||
|
||
const newPassword = this.querySelector('input[name="new_password"]').value;
|
||
const confirmPassword = this.querySelector('input[name="confirm_password"]').value;
|
||
|
||
if (newPassword !== confirmPassword) {
|
||
alert('两次输入的新密码不一致！');
|
||
return;
|
||
}
|
||
|
||
const passwordRegex = /^(?=.*[a-z])(?=.*[A-Z])(?=.*\d).{8,}$/;
|
||
if (!passwordRegex.test(newPassword)) {
|
||
alert('密码必须包含大小写字母和数字，长度至少8位');
|
||
return;
|
||
}
|
||
|
||
const formData = new FormData(this);
|
||
fetch('change_password.php', {
|
||
method: 'POST',
|
||
body: formData
|
||
})
|
||
.then(response => response.text())
|
||
.then(data => {
|
||
alert(data);
|
||
if (data.includes('成功')) {
|
||
document.cookie = 'PHPSESSID=; expires=Thu, 01 Jan 1970 00:00:00 UTC; path=/;';
|
||
setTimeout(() => {
|
||
window.location.reload();
|
||
}, 1000);
|
||
closeSettingsModalFunc();
|
||
this.reset();
|
||
}
|
||
})
|
||
.catch(error => {
|
||
alert('发生错误: ' + error);
|
||
});
|
||
});
|
||
|
||
deleteForm.addEventListener('submit', function(e) {
|
||
e.preventDefault();
|
||
|
||
const confirmText = this.querySelector('input[name="confirm"]').value;
|
||
if (confirmText !== '确认注销') {
|
||
alert('请输入"确认注销"以确认操作');
|
||
return;
|
||
}
|
||
|
||
if (confirm('您确定要永久删除您的账户吗？此操作无法撤销！')) {
|
||
const formData = new FormData(this);
|
||
fetch('delete_account.php', {
|
||
method: 'POST',
|
||
body: formData
|
||
})
|
||
.then(response => response.text())
|
||
.then(data => {
|
||
alert(data);
|
||
if (data.includes('成功')) {
|
||
setTimeout(() => {
|
||
window.location.href = '../auth/';
|
||
}, 2000);
|
||
}
|
||
})
|
||
.catch(error => {
|
||
alert('发生错误: ' + error);
|
||
});
|
||
}
|
||
});
|
||
|
||
if (document.getElementById('adminBtn')) {
|
||
const adminBtn = document.getElementById('adminBtn');
|
||
const adminModal = document.getElementById('adminModal');
|
||
const adminModalContent = document.getElementById('adminModalContent');
|
||
const closeAdminModal = document.getElementById('closeAdminModal');
|
||
const userManagerTab = document.getElementById('userManagerTab');
|
||
const playerManagerTab = document.getElementById('playerManagerTab');
|
||
const userManager = document.getElementById('userManager');
|
||
const playerManager = document.getElementById('playerManager');
|
||
|
||
adminBtn.addEventListener('click', () => {
|
||
adminModal.classList.remove('hidden');
|
||
setTimeout(() => {
|
||
adminModalContent.classList.remove('scale-95', 'opacity-0');
|
||
adminModalContent.classList.add('scale-100', 'opacity-100');
|
||
}, 10);
|
||
});
|
||
|
||
closeAdminModal.addEventListener('click', () => {
|
||
adminModalContent.classList.remove('scale-100', 'opacity-100');
|
||
adminModalContent.classList.add('scale-95', 'opacity-0');
|
||
setTimeout(() => {
|
||
adminModal.classList.add('hidden');
|
||
}, 300);
|
||
});
|
||
|
||
adminModal.addEventListener('click', (e) => {
|
||
if (e.target === adminModal) {
|
||
closeAdminModal.click();
|
||
}
|
||
});
|
||
|
||
userManagerTab.addEventListener('click', () => {
|
||
userManagerTab.classList.remove('bg-gray-200', 'text-gray-700');
|
||
userManagerTab.classList.add('bg-primary', 'text-white');
|
||
playerManagerTab.classList.remove('bg-primary', 'text-white');
|
||
playerManagerTab.classList.add('bg-gray-200', 'text-gray-700');
|
||
userManager.classList.remove('hidden');
|
||
playerManager.classList.add('hidden');
|
||
});
|
||
|
||
playerManagerTab.addEventListener('click', () => {
|
||
playerManagerTab.classList.remove('bg-gray-200', 'text-gray-700');
|
||
playerManagerTab.classList.add('bg-primary', 'text-white');
|
||
userManagerTab.classList.remove('bg-primary', 'text-white');
|
||
userManagerTab.classList.add('bg-gray-200', 'text-gray-700');
|
||
playerManager.classList.remove('hidden');
|
||
userManager.classList.add('hidden');
|
||
});
|
||
|
||
// 用户管理功能
|
||
const editUserModal = document.getElementById('editUserModal');
|
||
const editUserModalContent = document.getElementById('editUserModalContent');
|
||
const closeEditUserModal = document.getElementById('closeEditUserModal');
|
||
const cancelEditUserBtn = document.getElementById('cancelEditUserBtn');
|
||
const editUserForm = document.getElementById('editUserForm');
|
||
const editUserId = document.getElementById('editUserId');
|
||
const editUsername = document.getElementById('editUsername');
|
||
const editUserLevel = document.getElementById('editUserLevel');
|
||
const editUserPoints = document.getElementById('editUserPoints');
|
||
const editUserEmail = document.getElementById('editUserEmail');
|
||
|
||
document.querySelectorAll('.edit-user-btn').forEach(btn => {
|
||
btn.addEventListener('click', () => {
|
||
const id = btn.getAttribute('data-id');
|
||
const username = btn.getAttribute('data-username');
|
||
const level = btn.getAttribute('data-level');
|
||
const points = btn.getAttribute('data-points');
|
||
const email = btn.getAttribute('data-email');
|
||
|
||
editUserId.value = id;
|
||
editUsername.value = username;
|
||
editUserLevel.value = level;
|
||
editUserPoints.value = points;
|
||
editUserEmail.value = email;
|
||
|
||
editUserModal.classList.remove('hidden');
|
||
setTimeout(() => {
|
||
editUserModalContent.classList.remove('scale-95', 'opacity-0');
|
||
editUserModalContent.classList.add('scale-100', 'opacity-100');
|
||
}, 10);
|
||
});
|
||
});
|
||
|
||
function closeEditUserModalFunc() {
|
||
editUserModalContent.classList.remove('scale-100', 'opacity-100');
|
||
editUserModalContent.classList.add('scale-95', 'opacity-0');
|
||
setTimeout(() => {
|
||
editUserModal.classList.add('hidden');
|
||
}, 300);
|
||
}
|
||
|
||
closeEditUserModal.addEventListener('click', closeEditUserModalFunc);
|
||
cancelEditUserBtn.addEventListener('click', closeEditUserModalFunc);
|
||
|
||
editUserModal.addEventListener('click', (e) => {
|
||
if (e.target === editUserModal) {
|
||
closeEditUserModalFunc();
|
||
}
|
||
});
|
||
|
||
editUserForm.addEventListener('submit', function(e) {
|
||
e.preventDefault();
|
||
|
||
const formData = new FormData(this);
|
||
fetch('./admin/admin_edit_user.php', {
|
||
method: 'POST',
|
||
body: formData
|
||
})
|
||
.then(response => response.text())
|
||
.then(data => {
|
||
alert(data);
|
||
if (data.includes('成功')) {
|
||
setTimeout(() => {
|
||
window.location.reload();
|
||
}, 1000);
|
||
closeEditUserModalFunc();
|
||
}
|
||
})
|
||
.catch(error => {
|
||
alert('发生错误: ' + error);
|
||
});
|
||
});
|
||
|
||
// 删除用户功能
|
||
const deleteUserModal = document.getElementById('deleteUserModal');
|
||
const deleteUserModalContent = document.getElementById('deleteUserModalContent');
|
||
const closeDeleteUserModal = document.getElementById('cancelDeleteUserBtn');
|
||
const confirmDeleteUserBtn = document.getElementById('confirmDeleteUserBtn');
|
||
const deleteUserId = document.getElementById('deleteUserId');
|
||
const deleteUserName = document.getElementById('deleteUserName');
|
||
let currentUserId = null;
|
||
|
||
document.querySelectorAll('.delete-user-btn').forEach(btn => {
|
||
btn.addEventListener('click', () => {
|
||
const id = btn.getAttribute('data-id');
|
||
const username = btn.getAttribute('data-username');
|
||
|
||
currentUserId = id;
|
||
deleteUserName.textContent = username;
|
||
|
||
deleteUserModal.classList.remove('hidden');
|
||
setTimeout(() => {
|
||
deleteUserModalContent.classList.remove('scale-95', 'opacity-0');
|
||
deleteUserModalContent.classList.add('scale-100', 'opacity-100');
|
||
}, 10);
|
||
});
|
||
});
|
||
|
||
function closeDeleteUserModalFunc() {
|
||
deleteUserModalContent.classList.remove('scale-100', 'opacity-100');
|
||
deleteUserModalContent.classList.add('scale-95', 'opacity-0');
|
||
setTimeout(() => {
|
||
deleteUserModal.classList.add('hidden');
|
||
}, 300);
|
||
}
|
||
|
||
closeDeleteUserModal.addEventListener('click', closeDeleteUserModalFunc);
|
||
|
||
deleteUserModal.addEventListener('click', (e) => {
|
||
if (e.target === deleteUserModal) {
|
||
closeDeleteUserModalFunc();
|
||
}
|
||
});
|
||
|
||
confirmDeleteUserBtn.addEventListener('click', () => {
|
||
if (currentUserId) {
|
||
const formData = new FormData();
|
||
formData.append('user_id', currentUserId);
|
||
|
||
fetch('./admin/admin_delete_user.php', {
|
||
method: 'POST',
|
||
body: formData
|
||
})
|
||
.then(response => response.text())
|
||
.then(data => {
|
||
alert(data);
|
||
if (data.includes('成功')) {
|
||
setTimeout(() => {
|
||
window.location.reload();
|
||
}, 1000);
|
||
closeDeleteUserModalFunc();
|
||
}
|
||
})
|
||
.catch(error => {
|
||
alert('发生错误: ' + error);
|
||
});
|
||
}
|
||
});
|
||
|
||
// 玩家管理功能
|
||
const editPlayerModal = document.getElementById('editPlayerModal');
|
||
const editPlayerModalContent = document.getElementById('editPlayerModalContent');
|
||
const closeEditPlayerModal = document.getElementById('closeEditPlayerModal');
|
||
const cancelEditPlayerBtn = document.getElementById('cancelEditPlayerBtn');
|
||
const editPlayerForm = document.getElementById('editPlayerForm');
|
||
const editPlayerId = document.getElementById('editPlayerId');
|
||
const editPlayerName = document.getElementById('editPlayerName');
|
||
const editPlayerDesc = document.getElementById('editPlayerDesc');
|
||
const editPlayerOwner = document.getElementById('editPlayerOwner');
|
||
|
||
document.querySelectorAll('.edit-player-btn').forEach(btn => {
|
||
btn.addEventListener('click', () => {
|
||
const id = btn.getAttribute('data-id');
|
||
const name = btn.getAttribute('data-name');
|
||
const desc = btn.getAttribute('data-desc');
|
||
const owner = btn.getAttribute('data-owner');
|
||
|
||
editPlayerId.value = id;
|
||
editPlayerName.value = name;
|
||
editPlayerDesc.value = desc;
|
||
editPlayerOwner.value = owner;
|
||
|
||
editPlayerModal.classList.remove('hidden');
|
||
setTimeout(() => {
|
||
editPlayerModalContent.classList.remove('scale-95', 'opacity-0');
|
||
editPlayerModalContent.classList.add('scale-100', 'opacity-100');
|
||
}, 10);
|
||
});
|
||
});
|
||
|
||
function closeEditPlayerModalFunc() {
|
||
editPlayerModalContent.classList.remove('scale-100', 'opacity-100');
|
||
editPlayerModalContent.classList.add('scale-95', 'opacity-0');
|
||
setTimeout(() => {
|
||
editPlayerModal.classList.add('hidden');
|
||
}, 300);
|
||
}
|
||
|
||
closeEditPlayerModal.addEventListener('click', closeEditPlayerModalFunc);
|
||
cancelEditPlayerBtn.addEventListener('click', closeEditPlayerModalFunc);
|
||
|
||
editPlayerModal.addEventListener('click', (e) => {
|
||
if (e.target === editPlayerModal) {
|
||
closeEditPlayerModalFunc();
|
||
}
|
||
});
|
||
|
||
editPlayerForm.addEventListener('submit', function(e) {
|
||
e.preventDefault();
|
||
|
||
const formData = new FormData(this);
|
||
fetch('./admin/admin_edit_player.php', {
|
||
method: 'POST',
|
||
body: formData
|
||
})
|
||
.then(response => response.text())
|
||
.then(data => {
|
||
alert(data);
|
||
if (data.includes('成功')) {
|
||
setTimeout(() => {
|
||
window.location.reload();
|
||
}, 1000);
|
||
closeEditPlayerModalFunc();
|
||
}
|
||
})
|
||
.catch(error => {
|
||
alert('发生错误: ' + error);
|
||
});
|
||
});
|
||
|
||
// 删除玩家功能
|
||
const deletePlayerModal = document.getElementById('deletePlayerModal');
|
||
const deletePlayerModalContent = document.getElementById('deletePlayerModalContent');
|
||
const closeDeletePlayerModal = document.getElementById('cancelDeletePlayerBtn');
|
||
const confirmDeletePlayerBtn = document.getElementById('confirmDeletePlayerBtn');
|
||
const deletePlayerId = document.getElementById('deletePlayerId');
|
||
const deletePlayerName = document.getElementById('deletePlayerName');
|
||
let currentPlayerId = null;
|
||
|
||
document.querySelectorAll('.delete-player-btn').forEach(btn => {
|
||
btn.addEventListener('click', () => {
|
||
const id = btn.getAttribute('data-id');
|
||
const name = btn.getAttribute('data-name');
|
||
|
||
currentPlayerId = id;
|
||
deletePlayerName.textContent = name;
|
||
|
||
deletePlayerModal.classList.remove('hidden');
|
||
setTimeout(() => {
|
||
deletePlayerModalContent.classList.remove('scale-95', 'opacity-0');
|
||
deletePlayerModalContent.classList.add('scale-100', 'opacity-100');
|
||
}, 10);
|
||
});
|
||
});
|
||
|
||
function closeDeletePlayerModalFunc() {
|
||
deletePlayerModalContent.classList.remove('scale-100', 'opacity-100');
|
||
deletePlayerModalContent.classList.add('scale-95', 'opacity-0');
|
||
setTimeout(() => {
|
||
deletePlayerModal.classList.add('hidden');
|
||
}, 300);
|
||
}
|
||
|
||
closeDeletePlayerModal.addEventListener('click', closeDeletePlayerModalFunc);
|
||
|
||
deletePlayerModal.addEventListener('click', (e) => {
|
||
if (e.target === deletePlayerModal) {
|
||
closeDeletePlayerModalFunc();
|
||
}
|
||
});
|
||
|
||
confirmDeletePlayerBtn.addEventListener('click', () => {
|
||
if (currentPlayerId) {
|
||
const formData = new FormData();
|
||
formData.append('player_id', currentPlayerId);
|
||
|
||
fetch('./admin/admin_delete_player.php', {
|
||
method: 'POST',
|
||
body: formData
|
||
})
|
||
.then(response => response.text())
|
||
.then(data => {
|
||
alert(data);
|
||
if (data.includes('成功')) {
|
||
setTimeout(() => {
|
||
window.location.reload();
|
||
}, 1000);
|
||
closeDeletePlayerModalFunc();
|
||
}
|
||
})
|
||
.catch(error => {
|
||
alert('发生错误: ' + error);
|
||
});
|
||
}
|
||
});
|
||
|
||
// 搜索功能
|
||
const userSearch = document.getElementById('userSearch');
|
||
const playerSearch = document.getElementById('playerSearch');
|
||
|
||
userSearch.addEventListener('input', function() {
|
||
const searchTerm = this.value.toLowerCase();
|
||
const rows = document.querySelectorAll('#userManager table tbody tr');
|
||
|
||
rows.forEach(row => {
|
||
const username = row.querySelector('td:nth-child(2)').textContent.toLowerCase();
|
||
const email = row.querySelector('td:nth-child(5)').textContent.toLowerCase();
|
||
|
||
if (username.includes(searchTerm) || email.includes(searchTerm)) {
|
||
row.style.display = '';
|
||
} else {
|
||
row.style.display = 'none';
|
||
}
|
||
});
|
||
});
|
||
|
||
playerSearch.addEventListener('input', function() {
|
||
const searchTerm = this.value.toLowerCase();
|
||
const rows = document.querySelectorAll('#playerManager table tbody tr');
|
||
|
||
rows.forEach(row => {
|
||
const playerName = row.querySelector('td:nth-child(2)').textContent.toLowerCase();
|
||
const owner = row.querySelector('td:nth-child(4)').textContent.toLowerCase();
|
||
|
||
if (playerName.includes(searchTerm) || owner.includes(searchTerm)) {
|
||
row.style.display = '';
|
||
} else {
|
||
row.style.display = 'none';
|
||
}
|
||
});
|
||
});
|
||
}
|
||
|
||
const notificationBtn = document.getElementById('notificationBtn');
|
||
|
||
const style = document.createElement('style');
|
||
style.textContent = `
|
||
@keyframes fadeIn {
|
||
from { opacity: 0; transform: translateY(20px); }
|
||
to { opacity: 1; transform: translateY(0); }
|
||
}
|
||
|
||
@keyframes fadeOut {
|
||
from { opacity: 1; transform: translateY(0); }
|
||
to { opacity: 0; transform: translateY(20px); }
|
||
}
|
||
|
||
.animate-fade-in {
|
||
animation: fadeIn 0.3s ease forwards;
|
||
}
|
||
|
||
.animate-fade-out {
|
||
animation: fadeOut 0.3s ease forwards;
|
||
}
|
||
`;
|
||
document.head.appendChild(style);
|
||
|
||
document.querySelectorAll('a[href^="#"]').forEach(anchor => {
|
||
anchor.addEventListener('click', function (e) {
|
||
e.preventDefault();
|
||
|
||
document.querySelector(this.getAttribute('href')).scrollIntoView({
|
||
behavior: 'smooth'
|
||
});
|
||
});
|
||
});
|
||
</script>
|
||
</div>
|
||
</body>
|
||
</html>
|