首次提交:初始化项目代码
This commit is contained in:
@@ -0,0 +1,149 @@
|
||||
<!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="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
|
||||
<script src="https://cdn.tailwindcss.com"></script>
|
||||
<style>
|
||||
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap');
|
||||
|
||||
body {
|
||||
font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
|
||||
background: linear-gradient(135deg, #f8fafc 0%, #e2e8f0 100%);
|
||||
min-height: 100vh;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.error-container {
|
||||
text-align: center;
|
||||
padding: 3.75rem 2.50rem;
|
||||
}
|
||||
|
||||
.error-icon {
|
||||
width: 7.50rem;
|
||||
height: 7.50rem;
|
||||
margin: 0 auto 2rem;
|
||||
border-radius: 2rem;
|
||||
background: linear-gradient(135deg, #fef3c7 0%, #fde68a 100%);
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
box-shadow: 0 1.25rem 3.75rem rgba(251, 191, 36, 0.3);
|
||||
animation: float 6s ease-in-out infinite;
|
||||
}
|
||||
|
||||
.error-icon i {
|
||||
font-size: 3.50rem;
|
||||
color: #d97706;
|
||||
}
|
||||
|
||||
.error-number {
|
||||
font-size: 5rem;
|
||||
font-weight: 700;
|
||||
background: linear-gradient(135deg, #d97706 0%, #f59e0b 100%);
|
||||
-webkit-background-clip: text;
|
||||
-webkit-text-fill-color: transparent;
|
||||
background-clip: text;
|
||||
margin-bottom: 1rem;
|
||||
letter-spacing: -0.25rem;
|
||||
}
|
||||
|
||||
.error-title {
|
||||
font-size: 1.50rem;
|
||||
font-weight: 600;
|
||||
color: #1e293b;
|
||||
margin-bottom: 0.75rem;
|
||||
}
|
||||
|
||||
.error-description {
|
||||
font-size: 0.94rem;
|
||||
color: #64748b;
|
||||
max-width: 26.25rem;
|
||||
margin: 0 auto 2rem;
|
||||
line-height: 1.6;
|
||||
}
|
||||
|
||||
.btn-primary {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
gap: 0.50rem;
|
||||
padding: 0.88rem 2rem;
|
||||
background: linear-gradient(135deg, #6366f1 0%, #8b5cf6 100%);
|
||||
color: white;
|
||||
border: none;
|
||||
border-radius: 0.88rem;
|
||||
font-size: 0.94rem;
|
||||
font-weight: 500;
|
||||
cursor: pointer;
|
||||
transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
|
||||
box-shadow: 0 0.25rem 0.94rem rgba(99, 102, 241, 0.4);
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.btn-primary:hover {
|
||||
transform: translateY(-0.12rem);
|
||||
box-shadow: 0 0.38rem 1.25rem rgba(99, 102, 241, 0.5);
|
||||
}
|
||||
|
||||
@keyframes float {
|
||||
0%, 100% { transform: translateY(0); }
|
||||
50% { transform: translateY(-0.62rem); }
|
||||
}
|
||||
|
||||
.bg-decoration {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
overflow: hidden;
|
||||
pointer-events: none;
|
||||
z-index: -1;
|
||||
}
|
||||
|
||||
.bg-decoration::before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
top: -12.50rem;
|
||||
right: -6.25rem;
|
||||
width: 25rem;
|
||||
height: 25rem;
|
||||
background: radial-gradient(circle, rgba(99, 102, 241, 0.1) 0%, transparent 70%);
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
||||
.bg-decoration::after {
|
||||
content: '';
|
||||
position: absolute;
|
||||
bottom: -9.38rem;
|
||||
left: -6.25rem;
|
||||
width: 18.75rem;
|
||||
height: 18.75rem;
|
||||
background: radial-gradient(circle, rgba(251, 191, 36, 0.1) 0%, transparent 70%);
|
||||
border-radius: 50%;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div class="bg-decoration"></div>
|
||||
|
||||
<div class="error-container">
|
||||
<div class="error-icon">
|
||||
<i class="fas fa-lock"></i>
|
||||
</div>
|
||||
|
||||
<div class="error-number">401</div>
|
||||
|
||||
<h1 class="error-title">未授权访问</h1>
|
||||
|
||||
<p class="error-description">
|
||||
您没有权限访问此页面。请先登录后台管理系统,或联系管理员获取访问权限。
|
||||
</p>
|
||||
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,180 @@
|
||||
<!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="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
|
||||
<script src="https://cdn.tailwindcss.com"></script>
|
||||
<style>
|
||||
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap');
|
||||
|
||||
body {
|
||||
font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
|
||||
background: linear-gradient(135deg, #f8fafc 0%, #e2e8f0 100%);
|
||||
min-height: 100vh;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.error-container {
|
||||
text-align: center;
|
||||
padding: 3.75rem 2.50rem;
|
||||
}
|
||||
|
||||
.error-icon {
|
||||
width: 7.50rem;
|
||||
height: 7.50rem;
|
||||
margin: 0 auto 2rem;
|
||||
border-radius: 2rem;
|
||||
background: linear-gradient(135deg, #cffafe 0%, #a5f3fc 100%);
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
box-shadow: 0 1.25rem 3.75rem rgba(6, 182, 212, 0.3);
|
||||
animation: float 6s ease-in-out infinite;
|
||||
}
|
||||
|
||||
.error-icon i {
|
||||
font-size: 3.50rem;
|
||||
color: #0891b2;
|
||||
}
|
||||
|
||||
.error-number {
|
||||
font-size: 5rem;
|
||||
font-weight: 700;
|
||||
background: linear-gradient(135deg, #0891b2 0%, #06b6d4 100%);
|
||||
-webkit-background-clip: text;
|
||||
-webkit-text-fill-color: transparent;
|
||||
background-clip: text;
|
||||
margin-bottom: 1rem;
|
||||
letter-spacing: -0.25rem;
|
||||
}
|
||||
|
||||
.error-title {
|
||||
font-size: 1.50rem;
|
||||
font-weight: 600;
|
||||
color: #1e293b;
|
||||
margin-bottom: 0.75rem;
|
||||
}
|
||||
|
||||
.error-description {
|
||||
font-size: 0.94rem;
|
||||
color: #64748b;
|
||||
max-width: 26.25rem;
|
||||
margin: 0 auto 2rem;
|
||||
line-height: 1.6;
|
||||
}
|
||||
|
||||
.btn-primary {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
gap: 0.50rem;
|
||||
padding: 0.88rem 2rem;
|
||||
background: linear-gradient(135deg, #6366f1 0%, #8b5cf6 100%);
|
||||
color: white;
|
||||
border: none;
|
||||
border-radius: 0.88rem;
|
||||
font-size: 0.94rem;
|
||||
font-weight: 500;
|
||||
cursor: pointer;
|
||||
transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
|
||||
box-shadow: 0 0.25rem 0.94rem rgba(99, 102, 241, 0.4);
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.btn-primary:hover {
|
||||
transform: translateY(-0.12rem);
|
||||
box-shadow: 0 0.38rem 1.25rem rgba(99, 102, 241, 0.5);
|
||||
}
|
||||
|
||||
.btn-secondary {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
gap: 0.50rem;
|
||||
padding: 0.88rem 2rem;
|
||||
background: white;
|
||||
color: #64748b;
|
||||
border: 0.06rem solid #e2e8f0;
|
||||
border-radius: 0.88rem;
|
||||
font-size: 0.94rem;
|
||||
font-weight: 500;
|
||||
cursor: pointer;
|
||||
transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
|
||||
margin-left: 0.75rem;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.btn-secondary:hover {
|
||||
background: #f8fafc;
|
||||
border-color: #cbd5e1;
|
||||
color: #334155;
|
||||
}
|
||||
|
||||
@keyframes float {
|
||||
0%, 100% { transform: translateY(0); }
|
||||
50% { transform: translateY(-0.62rem); }
|
||||
}
|
||||
|
||||
.bg-decoration {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
overflow: hidden;
|
||||
pointer-events: none;
|
||||
z-index: -1;
|
||||
}
|
||||
|
||||
.bg-decoration::before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
top: -12.50rem;
|
||||
right: -6.25rem;
|
||||
width: 25rem;
|
||||
height: 25rem;
|
||||
background: radial-gradient(circle, rgba(99, 102, 241, 0.1) 0%, transparent 70%);
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
||||
.bg-decoration::after {
|
||||
content: '';
|
||||
position: absolute;
|
||||
bottom: -9.38rem;
|
||||
left: -6.25rem;
|
||||
width: 18.75rem;
|
||||
height: 18.75rem;
|
||||
background: radial-gradient(circle, rgba(6, 182, 212, 0.1) 0%, transparent 70%);
|
||||
border-radius: 50%;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div class="bg-decoration"></div>
|
||||
|
||||
<div class="error-container">
|
||||
<div class="error-icon">
|
||||
<i class="fas fa-search"></i>
|
||||
</div>
|
||||
|
||||
<div class="error-number">404</div>
|
||||
|
||||
<h1 class="error-title">页面未找到</h1>
|
||||
|
||||
<p class="error-description">
|
||||
您访问的页面不存在或已被移除。请检查网址是否正确,或返回后台首页继续操作。
|
||||
</p>
|
||||
|
||||
<div class="flex items-center justify-center gap-3">
|
||||
<a href="/dashboard/home" class="btn-primary">
|
||||
<i class="fas fa-home"></i> 返回后台首页
|
||||
</a>
|
||||
<button onclick="history.back()" class="btn-secondary">
|
||||
<i class="fas fa-arrow-left"></i> 返回上一页
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
File diff suppressed because it is too large
Load Diff
@@ -0,0 +1,277 @@
|
||||
<div class="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-4 gap-5">
|
||||
<div class="stat-card bg-gradient-to-br from-blue-500 to-blue-600">
|
||||
<div class="stat-icon">
|
||||
<i class="fas fa-users"></i>
|
||||
</div>
|
||||
<div>
|
||||
<p class="stat-label">总用户数</p>
|
||||
<h3 class="stat-number">{{.Stats.TotalUsers}}</h3>
|
||||
</div>
|
||||
</div>
|
||||
<div class="stat-card bg-gradient-to-br from-emerald-500 to-emerald-600">
|
||||
<div class="stat-icon">
|
||||
<i class="fas fa-file-alt"></i>
|
||||
</div>
|
||||
<div>
|
||||
<p class="stat-label">总简历数</p>
|
||||
<h3 class="stat-number">{{.Stats.TotalResumes}}</h3>
|
||||
</div>
|
||||
</div>
|
||||
<div class="stat-card bg-gradient-to-br from-violet-500 to-violet-600">
|
||||
<div class="stat-icon">
|
||||
<i class="fas fa-folder-open"></i>
|
||||
</div>
|
||||
<div>
|
||||
<p class="stat-label">作品集项目</p>
|
||||
<h3 class="stat-number">{{.Stats.TotalPortfolio}}</h3>
|
||||
</div>
|
||||
</div>
|
||||
<div class="stat-card bg-gradient-to-br from-orange-500 to-orange-600">
|
||||
<div class="stat-icon">
|
||||
<i class="fas fa-clipboard-list"></i>
|
||||
</div>
|
||||
<div>
|
||||
<p class="stat-label">答题记录</p>
|
||||
<h3 class="stat-number">{{.Stats.TotalQuizRecords}}</h3>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="grid grid-cols-1 sm:grid-cols-3 gap-5 mt-5">
|
||||
<div class="bg-white rounded-xl shadow-sm border border-slate-100 p-5 flex items-center gap-4">
|
||||
<div class="w-12 h-12 rounded-lg bg-amber-50 flex items-center justify-center text-amber-500">
|
||||
<i class="fas fa-star text-xl"></i>
|
||||
</div>
|
||||
<div>
|
||||
<p class="text-sm text-slate-500">收藏题目</p>
|
||||
<h4 class="text-xl font-bold text-slate-800">{{.Stats.TotalFavorites}}</h4>
|
||||
</div>
|
||||
</div>
|
||||
<div class="bg-white rounded-xl shadow-sm border border-slate-100 p-5 flex items-center gap-4">
|
||||
<div class="w-12 h-12 rounded-lg bg-rose-50 flex items-center justify-center text-rose-500">
|
||||
<i class="fas fa-times-circle text-xl"></i>
|
||||
</div>
|
||||
<div>
|
||||
<p class="text-sm text-slate-500">错题总数</p>
|
||||
<h4 class="text-xl font-bold text-slate-800">{{.Stats.TotalWrongAnswers}}</h4>
|
||||
</div>
|
||||
</div>
|
||||
<div class="bg-white rounded-xl shadow-sm border border-slate-100 p-5 flex items-center gap-4">
|
||||
<div class="w-12 h-12 rounded-lg bg-sky-50 flex items-center justify-center text-sky-500">
|
||||
<i class="fas fa-clock text-xl"></i>
|
||||
</div>
|
||||
<div>
|
||||
<p class="text-sm text-slate-500">运行时长</p>
|
||||
<h4 class="text-xl font-bold text-slate-800">{{.Uptime}}</h4>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="mt-5 grid grid-cols-1 lg:grid-cols-3 gap-5">
|
||||
<div class="lg:col-span-2 bg-white rounded-xl shadow-sm border border-slate-100 overflow-hidden">
|
||||
<div class="px-5 py-4 border-b border-slate-100 flex items-center justify-between">
|
||||
<h3 class="font-semibold text-slate-800 flex items-center gap-2">
|
||||
<i class="fas fa-users text-blue-500"></i> 最近用户
|
||||
</h3>
|
||||
<a href="{{.AdminPath}}/users" class="btn btn-secondary btn-sm">
|
||||
<i class="fas fa-list"></i> 查看全部
|
||||
</a>
|
||||
</div>
|
||||
<div class="divide-y divide-slate-50">
|
||||
{{ range .RecentUsers }}
|
||||
<div class="px-5 py-4 flex items-center gap-4 hover:bg-slate-50 transition-colors">
|
||||
<div class="w-10 h-10 rounded-full bg-gradient-to-br from-blue-400 to-blue-600 flex items-center justify-center text-white font-medium text-sm flex-shrink-0">
|
||||
{{if .Name}}{{substr .Name 0 1}}{{else}}U{{end}}
|
||||
</div>
|
||||
<div class="flex-1 min-w-0">
|
||||
<p class="font-medium text-slate-800 truncate">{{.Name}}</p>
|
||||
<p class="text-sm text-slate-500 truncate">{{.Email}}</p>
|
||||
</div>
|
||||
<div class="flex gap-2 flex-shrink-0">
|
||||
<a href="{{$.AdminPath}}/user/{{.ID}}/resume" class="btn btn-primary btn-xs">
|
||||
<i class="fas fa-file-alt"></i> 简历
|
||||
</a>
|
||||
<a href="{{$.AdminPath}}/user/{{.ID}}/portfolio" class="btn btn-info btn-xs">
|
||||
<i class="fas fa-folder-open"></i> 作品集
|
||||
</a>
|
||||
<a href="{{$.AdminPath}}/user/{{.ID}}/quiz" class="btn btn-success btn-xs">
|
||||
<i class="fas fa-question-circle"></i> 答题
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
{{ else }}
|
||||
<div class="text-center py-12">
|
||||
<div class="w-16 h-16 mx-auto mb-4 rounded-full bg-slate-100 flex items-center justify-center">
|
||||
<i class="fas fa-users text-slate-400 text-2xl"></i>
|
||||
</div>
|
||||
<p class="text-slate-500">暂无用户</p>
|
||||
</div>
|
||||
{{ end }}
|
||||
</div>
|
||||
</div>
|
||||
<div class="bg-white rounded-xl shadow-sm border border-slate-100 overflow-hidden">
|
||||
<div class="px-5 py-4 border-b border-slate-100 flex items-center justify-between">
|
||||
<h3 class="font-semibold text-slate-800 flex items-center gap-2">
|
||||
<i class="fas fa-file-alt text-emerald-500"></i> 最近简历
|
||||
</h3>
|
||||
<a href="{{.AdminPath}}/resumes" class="btn btn-secondary btn-sm">
|
||||
<i class="fas fa-list"></i> 全部
|
||||
</a>
|
||||
</div>
|
||||
<div class="divide-y divide-slate-50">
|
||||
{{ range .RecentResumes }}
|
||||
<div class="px-5 py-4 flex items-center gap-3 hover:bg-slate-50 transition-colors">
|
||||
<div class="w-10 h-10 rounded-lg bg-gradient-to-br from-emerald-400 to-emerald-600 flex items-center justify-center text-white flex-shrink-0">
|
||||
<i class="fas fa-file-alt"></i>
|
||||
</div>
|
||||
<div class="flex-1 min-w-0">
|
||||
<p class="font-medium text-slate-800 truncate text-sm">{{.BasicInfo.Name}}</p>
|
||||
<p class="text-xs text-slate-500 truncate">{{.BasicInfo.Title}}</p>
|
||||
</div>
|
||||
<a href="/{{.Route}}" target="_blank" class="text-blue-500 hover:text-blue-600 text-sm flex-shrink-0">
|
||||
<i class="fas fa-external-link-alt"></i>
|
||||
</a>
|
||||
</div>
|
||||
{{ else }}
|
||||
<div class="text-center py-12">
|
||||
<div class="w-16 h-16 mx-auto mb-4 rounded-full bg-slate-100 flex items-center justify-center">
|
||||
<i class="fas fa-file-alt text-slate-400 text-2xl"></i>
|
||||
</div>
|
||||
<p class="text-slate-500">暂无简历</p>
|
||||
</div>
|
||||
{{ end }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="mt-5 grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-5">
|
||||
<a href="{{.AdminPath}}/users" class="quick-action-card">
|
||||
<div class="quick-action-icon bg-blue-50 text-blue-500">
|
||||
<i class="fas fa-user-plus"></i>
|
||||
</div>
|
||||
<div>
|
||||
<h4 class="font-medium text-slate-800">用户管理</h4>
|
||||
<p class="text-sm text-slate-500">添加/编辑用户信息</p>
|
||||
</div>
|
||||
<i class="fas fa-chevron-right text-slate-300"></i>
|
||||
</a>
|
||||
<a href="{{.AdminPath}}/resumes" class="quick-action-card">
|
||||
<div class="quick-action-icon bg-emerald-50 text-emerald-500">
|
||||
<i class="fas fa-file-medical"></i>
|
||||
</div>
|
||||
<div>
|
||||
<h4 class="font-medium text-slate-800">简历管理</h4>
|
||||
<p class="text-sm text-slate-500">查看和编辑简历</p>
|
||||
</div>
|
||||
<i class="fas fa-chevron-right text-slate-300"></i>
|
||||
</a>
|
||||
<a href="{{.AdminPath}}/portfolios" class="quick-action-card">
|
||||
<div class="quick-action-icon bg-violet-50 text-violet-500">
|
||||
<i class="fas fa-folder-plus"></i>
|
||||
</div>
|
||||
<div>
|
||||
<h4 class="font-medium text-slate-800">作品集管理</h4>
|
||||
<p class="text-sm text-slate-500">管理项目作品集</p>
|
||||
</div>
|
||||
<i class="fas fa-chevron-right text-slate-300"></i>
|
||||
</a>
|
||||
<a href="{{.AdminPath}}/settings" class="quick-action-card">
|
||||
<div class="quick-action-icon bg-slate-50 text-slate-500">
|
||||
<i class="fas fa-cog"></i>
|
||||
</div>
|
||||
<div>
|
||||
<h4 class="font-medium text-slate-800">系统设置</h4>
|
||||
<p class="text-sm text-slate-500">配置系统参数</p>
|
||||
</div>
|
||||
<i class="fas fa-chevron-right text-slate-300"></i>
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<style>
|
||||
.stat-card {
|
||||
position: relative;
|
||||
border-radius: 0.5rem;
|
||||
padding: 1.25rem;
|
||||
color: white;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 1rem;
|
||||
overflow: hidden;
|
||||
box-shadow: 0 0.25rem 0.38rem -0.06rem rgba(0, 0, 0, 0.1);
|
||||
}
|
||||
.stat-card::before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
top: -50%;
|
||||
right: -20%;
|
||||
width: 7.50rem;
|
||||
height: 7.50rem;
|
||||
background: rgba(255,255,255,0.1);
|
||||
border-radius: 50%;
|
||||
}
|
||||
.stat-card::after {
|
||||
content: '';
|
||||
position: absolute;
|
||||
bottom: -30%;
|
||||
right: 10%;
|
||||
width: 5rem;
|
||||
height: 5rem;
|
||||
background: rgba(255,255,255,0.08);
|
||||
border-radius: 50%;
|
||||
}
|
||||
.stat-icon {
|
||||
width: 3.25rem;
|
||||
height: 3.25rem;
|
||||
background: rgba(255,255,255,0.2);
|
||||
border-radius: 0.75rem;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
font-size: 1.5rem;
|
||||
flex-shrink: 0;
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
backdrop-filter: blur(0.25rem);
|
||||
}
|
||||
.stat-label {
|
||||
font-size: 0.875rem;
|
||||
opacity: 0.9;
|
||||
margin-bottom: 0.25rem;
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
}
|
||||
.stat-number {
|
||||
font-size: 1.75rem;
|
||||
font-weight: 700;
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
.quick-action-card {
|
||||
background: white;
|
||||
border: 0.06rem solid #f1f5f9;
|
||||
border-radius: 0.75rem;
|
||||
padding: 1.25rem;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 1rem;
|
||||
text-decoration: none;
|
||||
transition: all 0.2s ease;
|
||||
box-shadow: 0 0.06rem 0.12rem rgba(0,0,0,0.04);
|
||||
}
|
||||
.quick-action-card:hover {
|
||||
border-color: #e2e8f0;
|
||||
transform: translateY(-0.12rem);
|
||||
box-shadow: 0 0.25rem 0.75rem rgba(0,0,0,0.06);
|
||||
}
|
||||
.quick-action-icon {
|
||||
width: 2.75rem;
|
||||
height: 2.75rem;
|
||||
border-radius: 0.625rem;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
font-size: 1.125rem;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,483 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="zh-CN">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>{{ .SystemConfig.WebsiteTitle }} - 后台登录</title>
|
||||
<script src="https://cdn.tailwindcss.com"></script>
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
|
||||
<style>
|
||||
:root {
|
||||
--primary: #7B8EA2;
|
||||
--primary-hover: #6B7E92;
|
||||
--accent: #987E68;
|
||||
--text-primary: #2F343A;
|
||||
--text-secondary: #6C737C;
|
||||
--text-muted: #9CA3AF;
|
||||
--bg: #F8F7F4;
|
||||
--bg-card: #FFFFFF;
|
||||
--border: #E5E3DF;
|
||||
}
|
||||
|
||||
body {
|
||||
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'PingFang SC', 'Noto Sans SC', sans-serif;
|
||||
background-color: var(--bg);
|
||||
color: var(--text-primary);
|
||||
min-height: 100vh;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.login-container {
|
||||
width: 100%;
|
||||
max-width: 26.25rem;
|
||||
padding: 3rem;
|
||||
background: var(--bg-card);
|
||||
border-radius: 1rem;
|
||||
box-shadow: 0 0.25rem 1.50rem rgba(47, 52, 58, 0.08);
|
||||
border: 0.06rem solid var(--border);
|
||||
}
|
||||
|
||||
.brand-section {
|
||||
text-align: center;
|
||||
margin-bottom: 2.50rem;
|
||||
}
|
||||
|
||||
.brand-logo {
|
||||
width: 3.50rem;
|
||||
height: 3.50rem;
|
||||
margin: 0 auto 1.25rem;
|
||||
background: var(--primary);
|
||||
border-radius: 0.75rem;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
color: white;
|
||||
font-size: 1.50rem;
|
||||
transition: all 0.3s ease;
|
||||
}
|
||||
.brand-logo img {
|
||||
border-radius: 0.50rem;
|
||||
}
|
||||
|
||||
.brand-logo:hover {
|
||||
transform: scale(1.05);
|
||||
}
|
||||
|
||||
.brand-title {
|
||||
font-size: 1.38rem;
|
||||
font-weight: 600;
|
||||
color: var(--text-primary);
|
||||
margin-bottom: 0.38rem;
|
||||
letter-spacing: 0.12rem;
|
||||
}
|
||||
|
||||
.brand-subtitle {
|
||||
font-size: 0.81rem;
|
||||
color: var(--text-secondary);
|
||||
}
|
||||
|
||||
.input-group {
|
||||
margin-bottom: 1.25rem;
|
||||
}
|
||||
|
||||
.input-group label {
|
||||
display: block;
|
||||
font-size: 0.81rem;
|
||||
color: var(--text-secondary);
|
||||
margin-bottom: 0.50rem;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
.input-group input {
|
||||
width: 100%;
|
||||
padding: 0.75rem 0.88rem;
|
||||
border: 0.06rem solid var(--border);
|
||||
border-radius: 0.50rem;
|
||||
font-size: 0.88rem;
|
||||
color: var(--text-primary);
|
||||
background: var(--bg);
|
||||
transition: all 0.25s ease;
|
||||
outline: none;
|
||||
font-family: inherit;
|
||||
}
|
||||
|
||||
.input-group input:focus {
|
||||
border-color: var(--primary);
|
||||
box-shadow: 0 0 0 0.19rem rgba(123, 142, 162, 0.1);
|
||||
background: white;
|
||||
}
|
||||
|
||||
.input-group input::placeholder {
|
||||
color: var(--text-muted);
|
||||
}
|
||||
|
||||
.input-wrapper {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.input-icon {
|
||||
position: absolute;
|
||||
left: 0.75rem;
|
||||
top: 50%;
|
||||
transform: translateY(-50%);
|
||||
font-size: 0.88rem;
|
||||
color: var(--text-muted);
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.input-group input {
|
||||
padding-left: 2.50rem;
|
||||
}
|
||||
|
||||
.input-toggle {
|
||||
position: absolute;
|
||||
right: 0.75rem;
|
||||
top: 50%;
|
||||
transform: translateY(-50%);
|
||||
font-size: 0.88rem;
|
||||
color: var(--text-muted);
|
||||
cursor: pointer;
|
||||
transition: color 0.2s ease;
|
||||
}
|
||||
|
||||
.input-toggle:hover {
|
||||
color: var(--primary);
|
||||
}
|
||||
|
||||
.captcha-row {
|
||||
display: flex;
|
||||
gap: 0.75rem;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.captcha-row .input-group {
|
||||
flex: 1;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.captcha-img {
|
||||
width: 6.25rem;
|
||||
height: 2.75rem;
|
||||
border-radius: 0.50rem;
|
||||
cursor: pointer;
|
||||
border: 0.06rem solid var(--border);
|
||||
background: var(--bg);
|
||||
transition: all 0.25s ease;
|
||||
}
|
||||
|
||||
.captcha-img:hover {
|
||||
border-color: var(--primary);
|
||||
transform: scale(1.02);
|
||||
}
|
||||
|
||||
.btn-login {
|
||||
width: 100%;
|
||||
padding: 0.81rem;
|
||||
border: none;
|
||||
border-radius: 0.50rem;
|
||||
font-size: 0.88rem;
|
||||
font-weight: 500;
|
||||
color: white;
|
||||
background: var(--primary);
|
||||
cursor: pointer;
|
||||
transition: all 0.25s ease;
|
||||
margin-top: 1.50rem;
|
||||
letter-spacing: 0.06rem;
|
||||
}
|
||||
|
||||
.btn-login:hover {
|
||||
background: var(--primary-hover);
|
||||
transform: translateY(-0.06rem);
|
||||
box-shadow: 0 0.25rem 0.75rem rgba(123, 142, 162, 0.25);
|
||||
}
|
||||
|
||||
.btn-login:active {
|
||||
transform: translateY(0);
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
.btn-login:disabled {
|
||||
opacity: 0.6;
|
||||
cursor: not-allowed;
|
||||
transform: none;
|
||||
}
|
||||
|
||||
.footer-text {
|
||||
text-align: center;
|
||||
margin-top: 2rem;
|
||||
font-size: 0.75rem;
|
||||
color: var(--text-muted);
|
||||
}
|
||||
|
||||
.alert-overlay {
|
||||
position: fixed;
|
||||
inset: 0;
|
||||
background: rgba(47, 52, 58, 0.4);
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
z-index: 1000;
|
||||
opacity: 0;
|
||||
visibility: hidden;
|
||||
transition: all 0.3s ease;
|
||||
}
|
||||
|
||||
.alert-overlay.show {
|
||||
opacity: 1;
|
||||
visibility: visible;
|
||||
}
|
||||
|
||||
.alert-box {
|
||||
background: white;
|
||||
border-radius: 0.75rem;
|
||||
padding: 2rem;
|
||||
max-width: 22.50rem;
|
||||
width: 90%;
|
||||
text-align: center;
|
||||
box-shadow: 0 0.75rem 2.50rem rgba(47, 52, 58, 0.15);
|
||||
transform: scale(0.9) translateY(1.25rem);
|
||||
transition: all 0.3s ease;
|
||||
}
|
||||
|
||||
.alert-overlay.show .alert-box {
|
||||
transform: scale(1) translateY(0);
|
||||
}
|
||||
|
||||
.alert-icon {
|
||||
width: 3rem;
|
||||
height: 3rem;
|
||||
margin: 0 auto 1rem;
|
||||
border-radius: 50%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
font-size: 1.38rem;
|
||||
}
|
||||
|
||||
.alert-icon.error {
|
||||
background: #FEF2F2;
|
||||
color: #DC2626;
|
||||
}
|
||||
|
||||
.alert-icon.success {
|
||||
background: #ECFDF5;
|
||||
color: #16A34A;
|
||||
}
|
||||
|
||||
.alert-icon.info {
|
||||
background: #EFF6FF;
|
||||
color: #2563EB;
|
||||
}
|
||||
|
||||
.alert-title {
|
||||
font-size: 1rem;
|
||||
font-weight: 600;
|
||||
color: var(--text-primary);
|
||||
margin-bottom: 0.50rem;
|
||||
}
|
||||
|
||||
.alert-message {
|
||||
font-size: 0.81rem;
|
||||
color: var(--text-secondary);
|
||||
margin-bottom: 1.25rem;
|
||||
line-height: 1.6;
|
||||
}
|
||||
|
||||
.btn-alert {
|
||||
padding: 0.62rem 1.50rem;
|
||||
border: none;
|
||||
border-radius: 0.38rem;
|
||||
font-size: 0.81rem;
|
||||
font-weight: 500;
|
||||
color: white;
|
||||
background: var(--primary);
|
||||
cursor: pointer;
|
||||
transition: all 0.2s ease;
|
||||
}
|
||||
|
||||
.btn-alert:hover {
|
||||
background: var(--primary-hover);
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div class="login-container">
|
||||
<div class="brand-section">
|
||||
<div class="brand-logo">
|
||||
{{ if .SystemConfig.LogoPath }}
|
||||
<img src="{{.SystemConfig.LogoPath}}" alt="Logo">
|
||||
{{ else }}
|
||||
<i class="fas fa-file-alt"></i>
|
||||
{{ end }}
|
||||
</div>
|
||||
<div class="brand-title">{{ .SystemConfig.WebsiteTitle }}</div>
|
||||
<div class="brand-subtitle">{{ .SystemConfig.WebsiteDesc }}</div>
|
||||
</div>
|
||||
|
||||
<form id="loginForm" onsubmit="login(event)">
|
||||
<div class="input-group">
|
||||
<label for="username">用户名</label>
|
||||
<div class="input-wrapper">
|
||||
<i class="fas fa-user input-icon"></i>
|
||||
<input type="text" id="username" placeholder="请输入用户名" required>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="input-group">
|
||||
<label for="password">密码</label>
|
||||
<div class="input-wrapper">
|
||||
<i class="fas fa-lock input-icon"></i>
|
||||
<input type="password" id="password" placeholder="请输入密码" required>
|
||||
<i class="fas fa-eye input-toggle" id="passwordToggle" onclick="togglePassword()"></i>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="captcha-row">
|
||||
<div class="input-group">
|
||||
<label for="captcha">验证码</label>
|
||||
<div class="input-wrapper">
|
||||
<i class="fas fa-shield-halved input-icon"></i>
|
||||
<input type="text" id="captcha" placeholder="验证码" required>
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex flex-col justify-center">
|
||||
<img id="captchaImg" src="" alt="验证码" class="captcha-img" onclick="refreshCaptcha()">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<button type="submit" id="loginBtn" class="btn-login">登 录</button>
|
||||
</form>
|
||||
|
||||
<div class="footer-text">
|
||||
© 2026 {{ .SystemConfig.WebsiteTitle }}. All rights reserved.
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="customAlert" class="alert-overlay">
|
||||
<div class="alert-box" id="alertContent">
|
||||
<div id="alertIcon" class="alert-icon"></div>
|
||||
<h3 id="alertTitle" class="alert-title"></h3>
|
||||
<p id="alertMessage" class="alert-message"></p>
|
||||
<button onclick="closeCustomAlert()" class="btn-alert">确定</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
const adminPath = "{{.adminPath}}";
|
||||
let captchaToken = '';
|
||||
|
||||
function togglePassword() {
|
||||
const password = document.getElementById('password');
|
||||
const toggle = document.getElementById('passwordToggle');
|
||||
if (password.type === 'password') {
|
||||
password.type = 'text';
|
||||
toggle.classList.remove('fa-eye');
|
||||
toggle.classList.add('fa-eye-slash');
|
||||
} else {
|
||||
password.type = 'password';
|
||||
toggle.classList.remove('fa-eye-slash');
|
||||
toggle.classList.add('fa-eye');
|
||||
}
|
||||
}
|
||||
|
||||
function refreshCaptcha() {
|
||||
const img = document.getElementById('captchaImg');
|
||||
const xhr = new XMLHttpRequest();
|
||||
xhr.open('GET', adminPath + '/captcha?' + Date.now(), true);
|
||||
xhr.responseType = 'blob';
|
||||
xhr.onload = function() {
|
||||
if (this.status === 200) {
|
||||
captchaToken = this.getResponseHeader('X-Captcha-Token') || '';
|
||||
const blob = this.response;
|
||||
img.src = URL.createObjectURL(blob);
|
||||
}
|
||||
};
|
||||
xhr.send();
|
||||
}
|
||||
|
||||
function showCustomAlert(title, message, type) {
|
||||
const alert = document.getElementById('customAlert');
|
||||
const icon = document.getElementById('alertIcon');
|
||||
const titleEl = document.getElementById('alertTitle');
|
||||
const messageEl = document.getElementById('alertMessage');
|
||||
|
||||
titleEl.textContent = title;
|
||||
messageEl.textContent = message;
|
||||
|
||||
icon.className = 'alert-icon ' + type;
|
||||
if (type === 'error') {
|
||||
icon.innerHTML = '<i class="fas fa-times-circle"></i>';
|
||||
} else if (type === 'success') {
|
||||
icon.innerHTML = '<i class="fas fa-check-circle"></i>';
|
||||
} else {
|
||||
icon.innerHTML = '<i class="fas fa-info-circle"></i>';
|
||||
}
|
||||
|
||||
alert.classList.add('show');
|
||||
}
|
||||
|
||||
function closeCustomAlert() {
|
||||
const alert = document.getElementById('customAlert');
|
||||
alert.classList.remove('show');
|
||||
}
|
||||
|
||||
async function login(event) {
|
||||
event.preventDefault();
|
||||
|
||||
const btn = document.getElementById('loginBtn');
|
||||
btn.disabled = true;
|
||||
btn.innerHTML = '<i class="fas fa-spinner fa-spin mr-2"></i> 登录中...';
|
||||
|
||||
const username = document.getElementById('username').value;
|
||||
const password = document.getElementById('password').value;
|
||||
const captcha = document.getElementById('captcha').value;
|
||||
|
||||
try {
|
||||
const response = await fetch(adminPath + '/login', {
|
||||
method: 'POST',
|
||||
headers: { 'Content-Type': 'application/json' },
|
||||
body: JSON.stringify({
|
||||
username,
|
||||
password,
|
||||
captcha,
|
||||
captcha_token: captchaToken
|
||||
})
|
||||
});
|
||||
|
||||
const result = await response.json();
|
||||
|
||||
if (result.success) {
|
||||
showCustomAlert('登录成功', '正在跳转...', 'success');
|
||||
setTimeout(() => {
|
||||
window.location.href = result.redirect || '/dashboard/home';
|
||||
}, 1500);
|
||||
} else {
|
||||
showCustomAlert('登录失败', result.message || '请检查用户名、密码和验证码', 'error');
|
||||
refreshCaptcha();
|
||||
}
|
||||
} catch (error) {
|
||||
showCustomAlert('网络错误', '无法连接服务器,请稍后重试', 'error');
|
||||
} finally {
|
||||
btn.disabled = false;
|
||||
btn.innerHTML = '登 录';
|
||||
}
|
||||
}
|
||||
|
||||
window.addEventListener('load', function() {
|
||||
const xhr = new XMLHttpRequest();
|
||||
xhr.open('GET', adminPath + '/captcha', true);
|
||||
xhr.responseType = 'blob';
|
||||
xhr.onload = function() {
|
||||
if (this.status === 200) {
|
||||
captchaToken = this.getResponseHeader('X-Captcha-Token') || '';
|
||||
const blob = this.response;
|
||||
document.getElementById('captchaImg').src = URL.createObjectURL(blob);
|
||||
}
|
||||
};
|
||||
xhr.send();
|
||||
});
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,290 @@
|
||||
<div class="bg-white rounded-xl shadow-sm border border-slate-200 overflow-hidden">
|
||||
<div class="border-b border-slate-200 px-6 py-4 bg-slate-50">
|
||||
<div>
|
||||
<h3 class="font-semibold text-slate-800 flex items-center gap-2">
|
||||
<i class="fas fa-folder-open text-purple-500"></i> {{ if .Item.ID }}编辑项目{{ else }}新增项目{{ end }}
|
||||
</h3>
|
||||
<p class="text-sm text-slate-500 mt-1">{{ if .Item.ID }}修改作品集项目信息{{ else }}创建新的作品集项目{{ end }}</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="p-6">
|
||||
<form id="portfolioForm">
|
||||
<input type="hidden" id="portfolioId" value="{{.Item.ID}}">
|
||||
<div class="space-y-6">
|
||||
<div class="grid grid-cols-1 lg:grid-cols-2 gap-6">
|
||||
<div class="space-y-4">
|
||||
<div>
|
||||
<label class="block text-sm font-medium text-slate-700 mb-1">选择人员 <span class="text-red-500">*</span></label>
|
||||
<select id="portfolioUserId" class="w-full px-4 py-2 border border-slate-300 rounded-lg focus:ring-2 focus:ring-primary-500 focus:border-primary-500" required>
|
||||
<option value="">请选择人员</option>
|
||||
{{ range .Users }}
|
||||
<option value="{{.ID}}" {{ if eq .ID $.Item.UserID }}selected{{ end }}>{{.Name}} - {{.Email}}</option>
|
||||
{{ end }}
|
||||
</select>
|
||||
</div>
|
||||
<div>
|
||||
<label class="block text-sm font-medium text-slate-700 mb-1">项目名称 <span class="text-red-500">*</span></label>
|
||||
<input type="text" id="portfolioName" class="w-full px-4 py-2 border border-slate-300 rounded-lg focus:ring-2 focus:ring-primary-500 focus:border-primary-500" value="{{.Item.Name}}" required>
|
||||
</div>
|
||||
<div>
|
||||
<label class="block text-sm font-medium text-slate-700 mb-1">项目描述</label>
|
||||
<textarea id="portfolioDescription" rows="3" class="w-full px-4 py-2 border border-slate-300 rounded-lg focus:ring-2 focus:ring-primary-500 focus:border-primary-500">{{.Item.Description}}</textarea>
|
||||
</div>
|
||||
<div>
|
||||
<label class="block text-sm font-medium text-slate-700 mb-1">技术栈</label>
|
||||
<input type="text" id="portfolioTechStack" class="w-full px-4 py-2 border border-slate-300 rounded-lg focus:ring-2 focus:ring-primary-500 focus:border-primary-500" value="{{ join .Item.TechStack "," }}" placeholder="多个技术栈用逗号分隔">
|
||||
</div>
|
||||
<div>
|
||||
<label class="block text-sm font-medium text-slate-700 mb-1">项目链接</label>
|
||||
<input type="url" id="portfolioUrl" class="w-full px-4 py-2 border border-slate-300 rounded-lg focus:ring-2 focus:ring-primary-500 focus:border-primary-500" value="{{.Item.URL}}" placeholder="https://">
|
||||
</div>
|
||||
<div class="grid grid-cols-2 gap-4">
|
||||
<div>
|
||||
<label class="block text-sm font-medium text-slate-700 mb-1">开始日期</label>
|
||||
<input type="date" id="portfolioStartDate" class="w-full px-4 py-2 border border-slate-300 rounded-lg focus:ring-2 focus:ring-primary-500 focus:border-primary-500" value="{{.Item.StartDate}}">
|
||||
</div>
|
||||
<div>
|
||||
<label class="block text-sm font-medium text-slate-700 mb-1">结束日期</label>
|
||||
<input type="date" id="portfolioEndDate" class="w-full px-4 py-2 border border-slate-300 rounded-lg focus:ring-2 focus:ring-primary-500 focus:border-primary-500" value="{{.Item.EndDate}}">
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<label class="block text-sm font-medium text-slate-700 mb-1">访问密码</label>
|
||||
<input type="password" id="portfolioPassword" class="w-full px-4 py-2 border border-slate-300 rounded-lg focus:ring-2 focus:ring-primary-500 focus:border-primary-500" value="{{.Item.Password}}" placeholder="留空则无需密码">
|
||||
</div>
|
||||
<div>
|
||||
<label class="block text-sm font-medium text-slate-700 mb-1">关联简历项目ID</label>
|
||||
<div class="space-y-2">
|
||||
<select id="portfolioProjectResumeId" class="w-full px-4 py-2 border border-slate-300 rounded-lg focus:ring-2 focus:ring-primary-500 focus:border-primary-500">
|
||||
<option value="">请选择简历</option>
|
||||
{{ range .Resumes }}
|
||||
<option value="{{.ID}}" {{ if eq .ID $.Item.ResumeID }}selected{{ end }}>{{.BasicInfo.Name}} - {{.BasicInfo.Title}}</option>
|
||||
{{ end }}
|
||||
</select>
|
||||
<select id="portfolioProjectId" class="w-full px-4 py-2 border border-slate-300 rounded-lg focus:ring-2 focus:ring-primary-500 focus:border-primary-500">
|
||||
<option value="">请选择项目</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex items-center gap-4">
|
||||
<label class="flex items-center gap-2 cursor-pointer">
|
||||
<input type="checkbox" id="portfolioShowInResume" {{ if .Item.ShowInResume }}checked{{ end }} class="w-4 h-4 text-primary-600 rounded focus:ring-primary-500">
|
||||
<span class="text-sm font-medium text-slate-700">在简历中显示</span>
|
||||
</label>
|
||||
<label class="flex items-center gap-2 cursor-pointer">
|
||||
<input type="checkbox" id="portfolioHidden" {{ if .Item.Hidden }}checked{{ end }} class="w-4 h-4 text-primary-600 rounded focus:ring-2 focus:ring-primary-500">
|
||||
<span class="text-sm font-medium text-slate-700">隐藏项目</span>
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="grid grid-cols-1 lg:grid-cols-2 gap-6" style="height: calc(100vh - 26.25rem); min-height: 31.25rem;">
|
||||
<div class="flex flex-col">
|
||||
<label class="block text-sm font-medium text-slate-700 mb-1">项目文档 <span class="text-slate-400 text-xs">(Markdown格式,支持图片、表格、流程图)</span></label>
|
||||
<div class="flex-1 relative overflow-hidden rounded-lg border border-slate-300">
|
||||
<textarea id="portfolioDoc" class="w-full h-full px-4 py-2 font-mono text-sm resize-none">{{.Item.Doc}}</textarea>
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex flex-col">
|
||||
<label class="block text-sm font-medium text-slate-700 mb-1">预览</label>
|
||||
<div id="docPreview" class="flex-1 p-4 border border-slate-200 rounded-lg bg-slate-50 markdown-body overflow-y-auto"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="fixed bottom-0 left-0 right-0 bg-white border-t border-slate-200 px-6 py-4 shadow-lg z-50">
|
||||
<div class="flex items-center justify-center gap-3">
|
||||
<button onclick="goBack()" class="btn btn-secondary">
|
||||
<i class="fas fa-arrow-left"></i> 返回
|
||||
</button>
|
||||
<button onclick="savePortfolio()" class="btn btn-primary">
|
||||
<i class="fas fa-save"></i> 保存
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div style="height: 5rem;"></div>
|
||||
|
||||
<link rel="stylesheet" href="https://cdn.jsdelivr.net/simplemde/latest/simplemde.min.css">
|
||||
<script src="https://cdn.jsdelivr.net/simplemde/latest/simplemde.min.js"></script>
|
||||
<script src="https://cdn.jsdelivr.net/npm/marked/marked.min.js"></script>
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/github-markdown-css/5.5.0/github-markdown.min.css">
|
||||
<script>
|
||||
let simplemde;
|
||||
|
||||
document.addEventListener('DOMContentLoaded', function() {
|
||||
simplemde = new SimpleMDE({
|
||||
element: document.getElementById('portfolioDoc'),
|
||||
toolbar: [
|
||||
'bold', 'italic', 'strikethrough', 'heading',
|
||||
'heading-smaller', 'heading-bigger', 'heading-1', 'heading-2', 'heading-3',
|
||||
'|',
|
||||
'code', 'quote', 'unordered-list', 'ordered-list',
|
||||
'|',
|
||||
'link', 'image', 'table', 'horizontal-rule',
|
||||
'|',
|
||||
'preview', 'side-by-side', 'fullscreen',
|
||||
'|',
|
||||
'guide'
|
||||
],
|
||||
spellChecker: false,
|
||||
autoDownloadFontAwesome: true,
|
||||
previewRender: function(plainText) {
|
||||
return marked.parse(plainText) || '';
|
||||
}
|
||||
});
|
||||
|
||||
simplemde.codemirror.on('change', function() {
|
||||
const text = simplemde.value();
|
||||
const preview = document.getElementById('docPreview');
|
||||
try {
|
||||
preview.innerHTML = marked.parse(text) || '<p class="text-slate-400">暂无内容</p>';
|
||||
} catch (err) {
|
||||
preview.innerHTML = '<p class="text-red-500">预览解析错误</p>';
|
||||
}
|
||||
});
|
||||
|
||||
const initialText = simplemde.value();
|
||||
if (initialText) {
|
||||
try {
|
||||
document.getElementById('docPreview').innerHTML = marked.parse(initialText) || '<p class="text-slate-400">暂无内容</p>';
|
||||
} catch (err) {
|
||||
document.getElementById('docPreview').innerHTML = '<p class="text-red-500">预览解析错误</p>';
|
||||
}
|
||||
} else {
|
||||
document.getElementById('docPreview').innerHTML = '<p class="text-slate-400">暂无内容,开始编写项目文档...</p>';
|
||||
}
|
||||
|
||||
document.getElementById('portfolioUserId').addEventListener('change', function() {
|
||||
loadResumesByUser(this.value, '');
|
||||
});
|
||||
|
||||
document.getElementById('portfolioProjectResumeId').addEventListener('change', function() {
|
||||
loadProjectsByResume(this.value, 0);
|
||||
});
|
||||
|
||||
const userId = document.getElementById('portfolioUserId').value;
|
||||
const savedResumeId = "{{.Item.ResumeID}}";
|
||||
const savedProjectId = {{ if .Item.ProjectID }}{{.Item.ProjectID}}{{ else }}0{{ end }};
|
||||
if (userId) {
|
||||
loadResumesByUser(userId, savedResumeId, savedProjectId);
|
||||
}
|
||||
});
|
||||
|
||||
function loadResumesByUser(userId, selectedResumeId, autoLoadProjectId) {
|
||||
const resumeSelect = document.getElementById('portfolioProjectResumeId');
|
||||
resumeSelect.innerHTML = '<option value="">请选择简历</option>';
|
||||
|
||||
if (!userId) return;
|
||||
|
||||
fetch('/api/user/resumes?user_id=' + userId)
|
||||
.then(response => response.json())
|
||||
.then(result => {
|
||||
if (!result.success) return;
|
||||
const resumes = result.data || [];
|
||||
resumes.forEach(resume => {
|
||||
const option = document.createElement('option');
|
||||
option.value = resume.id;
|
||||
option.textContent = (resume.basic_info.name || '未命名') + ' - ' + (resume.basic_info.title || '');
|
||||
if (selectedResumeId && resume.id === selectedResumeId) {
|
||||
option.selected = true;
|
||||
}
|
||||
resumeSelect.appendChild(option);
|
||||
});
|
||||
// 恢复选中后,按需加载该简历下的项目
|
||||
if (selectedResumeId && autoLoadProjectId) {
|
||||
loadProjectsByResume(selectedResumeId, autoLoadProjectId);
|
||||
}
|
||||
})
|
||||
.catch(() => {});
|
||||
}
|
||||
|
||||
function loadProjectsByResume(resumeId, selectedProjectId) {
|
||||
const projectSelect = document.getElementById('portfolioProjectId');
|
||||
projectSelect.innerHTML = '<option value="">请选择项目</option>';
|
||||
|
||||
if (!resumeId) return;
|
||||
|
||||
fetch('/dashboard/api/resume/' + resumeId)
|
||||
.then(response => response.json())
|
||||
.then(result => {
|
||||
if (!result.success) return;
|
||||
const resume = result.data || {};
|
||||
const projects = resume.projects || [];
|
||||
projects.forEach(project => {
|
||||
const option = document.createElement('option');
|
||||
option.value = project.id;
|
||||
option.textContent = project.name;
|
||||
if (selectedProjectId && project.id === selectedProjectId) {
|
||||
option.selected = true;
|
||||
}
|
||||
projectSelect.appendChild(option);
|
||||
});
|
||||
})
|
||||
.catch(() => {});
|
||||
}
|
||||
|
||||
function goBack() {
|
||||
window.history.back();
|
||||
}
|
||||
|
||||
function savePortfolio() {
|
||||
const techStackStr = document.getElementById('portfolioTechStack').value;
|
||||
const techStack = techStackStr ? techStackStr.split(',').map(s => s.trim()).filter(s => s) : [];
|
||||
|
||||
const portfolioId = document.getElementById('portfolioId').value;
|
||||
const projectIdVal = document.getElementById('portfolioProjectId').value;
|
||||
|
||||
const data = {
|
||||
id: portfolioId ? parseInt(portfolioId) : 0,
|
||||
user_id: document.getElementById('portfolioUserId').value,
|
||||
name: document.getElementById('portfolioName').value,
|
||||
description: document.getElementById('portfolioDescription').value,
|
||||
tech_stack: techStack,
|
||||
url: document.getElementById('portfolioUrl').value,
|
||||
start_date: document.getElementById('portfolioStartDate').value,
|
||||
end_date: document.getElementById('portfolioEndDate').value,
|
||||
doc: simplemde.value(),
|
||||
show_in_resume: document.getElementById('portfolioShowInResume').checked,
|
||||
resume_id: document.getElementById('portfolioProjectResumeId').value,
|
||||
project_id: projectIdVal ? parseInt(projectIdVal) : 0,
|
||||
password: document.getElementById('portfolioPassword').value,
|
||||
hidden: document.getElementById('portfolioHidden').checked
|
||||
};
|
||||
|
||||
if (!data.user_id) {
|
||||
showCustomAlert('error', '错误', '请选择人员');
|
||||
return;
|
||||
}
|
||||
if (!data.name) {
|
||||
showCustomAlert('error', '错误', '请输入项目名称');
|
||||
return;
|
||||
}
|
||||
|
||||
const isEdit = parseInt(portfolioId) > 0;
|
||||
const url = isEdit ? '/dashboard/api/portfolio/' + portfolioId : '/dashboard/api/portfolio';
|
||||
const method = isEdit ? 'PUT' : 'POST';
|
||||
|
||||
fetch(url, {
|
||||
method: method,
|
||||
headers: { 'Content-Type': 'application/json' },
|
||||
body: JSON.stringify(data)
|
||||
})
|
||||
.then(response => response.json())
|
||||
.then(result => {
|
||||
if (result.success) {
|
||||
showCustomAlert('success', '成功', isEdit ? '项目更新成功' : '项目创建成功');
|
||||
setTimeout(() => goBack(), 1500);
|
||||
} else {
|
||||
showCustomAlert('error', '错误', '保存失败:' + (result.message || '未知错误'));
|
||||
}
|
||||
})
|
||||
.catch(error => {
|
||||
console.error('Error:', error);
|
||||
showCustomAlert('error', '错误', '保存失败');
|
||||
});
|
||||
}
|
||||
</script>
|
||||
@@ -0,0 +1,321 @@
|
||||
<div class="bg-white rounded-xl shadow-sm border border-slate-200 overflow-hidden">
|
||||
<div class="border-b border-slate-200 px-6 py-4 bg-slate-50">
|
||||
<div class="flex items-center justify-between">
|
||||
<div>
|
||||
<h3 class="font-semibold text-slate-800 flex items-center gap-2">
|
||||
<i class="fas fa-folder-open text-purple-500"></i> 作品集管理
|
||||
</h3>
|
||||
<p class="text-sm text-slate-500 mt-1">管理所有用户的作品集项目</p>
|
||||
</div>
|
||||
<a href="{{$.AdminPath}}/portfolio/add" class="btn btn-primary">
|
||||
<i class="fas fa-plus"></i> 新增项目
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="overflow-x-auto">
|
||||
<table class="table">
|
||||
<thead>
|
||||
<tr class="bg-slate-50 border-b border-slate-200">
|
||||
<th class="text-left px-6 py-4 text-sm font-semibold text-slate-600">项目名称</th>
|
||||
<th class="text-left px-6 py-4 text-sm font-semibold text-slate-600">用户</th>
|
||||
<th class="text-left px-6 py-4 text-sm font-semibold text-slate-600">链接</th>
|
||||
<th class="text-left px-6 py-4 text-sm font-semibold text-slate-600">隐藏状态</th>
|
||||
<th class="text-left px-6 py-4 text-sm font-semibold text-slate-600">首页展示</th>
|
||||
<th class="text-left px-6 py-4 text-sm font-semibold text-slate-600 actions-col">操作</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
{{ range .Items }}
|
||||
<tr class="border-b border-slate-100 hover:bg-slate-50 transition-colors">
|
||||
<td class="px-6 py-4">
|
||||
<span class="font-medium text-slate-800">{{.Name}}</span>
|
||||
</td>
|
||||
<td class="px-6 py-4 text-slate-600">
|
||||
{{ if .UserID }}
|
||||
{{ $user := index $.UserMap .UserID }}
|
||||
{{ if $user }}
|
||||
{{$user.Name}}({{$user.Username}})
|
||||
{{ else }}
|
||||
<span class="text-slate-400">已失效</span>
|
||||
{{ end }}
|
||||
{{ else }}
|
||||
<span class="text-slate-400">未分配</span>
|
||||
{{ end }}
|
||||
</td>
|
||||
<td class="px-6 py-4 text-slate-600">
|
||||
{{ if .URL }}
|
||||
<a href="{{.URL}}" target="_blank" class="text-blue-600 hover:underline">点击访问</a>
|
||||
{{ else }}
|
||||
-
|
||||
{{ end }}
|
||||
</td>
|
||||
<td class="px-6 py-4">
|
||||
{{ if .Hidden }}
|
||||
<span class="badge badge-danger">已隐藏</span>
|
||||
{{ else }}
|
||||
<span class="badge badge-success">显示</span>
|
||||
{{ end }}
|
||||
</td>
|
||||
<td class="px-6 py-4">
|
||||
{{ if .ShowInResume }}
|
||||
<span class="badge badge-success">是</span>
|
||||
{{ else }}
|
||||
<span class="badge badge-slate">否</span>
|
||||
{{ end }}
|
||||
</td>
|
||||
<td class="px-6 py-4 actions-col">
|
||||
<div class="btn-group">
|
||||
<a href="{{$.AdminPath}}/portfolio/{{.ID}}/edit" class="btn btn-warning btn-xs" title="编辑">
|
||||
<i class="fas fa-edit"></i> 编辑
|
||||
</a>
|
||||
<button onclick="deletePortfolio('{{.ID}}')" class="btn btn-danger btn-xs" title="删除">
|
||||
<i class="fas fa-trash"></i> 删除
|
||||
</button>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
{{ else }}
|
||||
<tr>
|
||||
<td colspan="6" class="px-6 py-12 text-center text-slate-500">
|
||||
<div class="w-16 h-16 mx-auto mb-4 rounded-full bg-slate-100 flex items-center justify-center">
|
||||
<i class="fas fa-folder-open text-slate-400 text-2xl"></i>
|
||||
</div>
|
||||
<p>暂无作品集项目</p>
|
||||
</td>
|
||||
</tr>
|
||||
{{ end }}
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
{{ if gt .TotalPages 1 }}
|
||||
<div class="border-t border-slate-200 px-6 py-4 bg-slate-50 flex items-center justify-between">
|
||||
<div class="text-sm text-slate-500">共 {{ .Total }} 条记录,第 {{ .Page }} / {{ .TotalPages }} 页</div>
|
||||
<div class="flex items-center gap-2">
|
||||
<a href="?page=1" class="btn btn-sm btn-slate {{ if eq .Page 1 }}opacity-50 cursor-not-allowed{{ end }}" {{ if eq .Page 1 }}onclick="return false"{{ end }}>
|
||||
<i class="fas fa-chevron-left"></i>
|
||||
<i class="fas fa-chevron-left"></i>
|
||||
</a>
|
||||
<a href="?page={{ if eq .Page 1 }}1{{ else }}{{ subtract .Page 1 }}{{ end }}" class="btn btn-sm btn-slate {{ if eq .Page 1 }}opacity-50 cursor-not-allowed{{ end }}" {{ if eq .Page 1 }}onclick="return false"{{ end }}>
|
||||
<i class="fas fa-chevron-left"></i>
|
||||
</a>
|
||||
{{ range $i := to 1 $.TotalPages }}
|
||||
{{ if or (eq $i 1) (eq $i $.TotalPages) (and (ge $i (subtract $.Page 2)) (le $i (add $.Page 2))) }}
|
||||
<a href="?page={{ $i }}" class="btn btn-sm {{ if eq $i $.Page }}btn-primary{{ else }}btn-slate{{ end }}">{{ $i }}</a>
|
||||
{{ else if and (eq $i 2) (gt (subtract $.Page 3) 1) }}
|
||||
<span class="text-slate-400 px-2">...</span>
|
||||
{{ else if and (eq $i (subtract $.TotalPages 1)) (lt (add $.Page 3) $.TotalPages) }}
|
||||
<span class="text-slate-400 px-2">...</span>
|
||||
{{ end }}
|
||||
{{ end }}
|
||||
<a href="?page={{ if eq .Page .TotalPages }}{{ .TotalPages }}{{ else }}{{ add .Page 1 }}{{ end }}" class="btn btn-sm btn-slate {{ if eq .Page .TotalPages }}opacity-50 cursor-not-allowed{{ end }}" {{ if eq .Page .TotalPages }}onclick="return false"{{ end }}>
|
||||
<i class="fas fa-chevron-right"></i>
|
||||
</a>
|
||||
<a href="?page={{ .TotalPages }}" class="btn btn-sm btn-slate {{ if eq .Page .TotalPages }}opacity-50 cursor-not-allowed{{ end }}" {{ if eq .Page .TotalPages }}onclick="return false"{{ end }}>
|
||||
<i class="fas fa-chevron-right"></i>
|
||||
<i class="fas fa-chevron-right"></i>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
{{ end }}
|
||||
</div>
|
||||
<div class="modal hidden fixed inset-0 bg-black/50 flex items-center justify-center z-50" id="confirmModal">
|
||||
<div class="modal-content bg-white rounded-xl shadow-xl w-full max-w-sm mx-4">
|
||||
<div class="flex items-center justify-between p-4 border-b border-slate-200">
|
||||
<h3 class="font-semibold text-slate-800">确认删除</h3>
|
||||
<button onclick="closeConfirmModal()" class="btn btn-secondary btn-sm">
|
||||
<i class="fas fa-times"></i>
|
||||
</button>
|
||||
</div>
|
||||
<div class="p-6">
|
||||
<div class="flex items-center gap-3 mb-4">
|
||||
<div class="w-10 h-10 rounded-full bg-red-100 flex items-center justify-center">
|
||||
<i class="fas fa-exclamation-triangle text-red-500"></i>
|
||||
</div>
|
||||
<p class="text-slate-700">确定要删除这个项目吗?此操作不可撤销。</p>
|
||||
</div>
|
||||
<div class="flex gap-3">
|
||||
<button onclick="closeConfirmModal()" class="flex-1 btn btn-secondary">取消</button>
|
||||
<button onclick="confirmDeleteAction()" class="flex-1 btn btn-danger">确认删除</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="modal hidden fixed inset-0 bg-black/50 flex items-center justify-center z-50" id="portfolioModal">
|
||||
<div class="modal-content bg-white rounded-xl shadow-xl w-full max-w-lg mx-4">
|
||||
<div class="flex items-center justify-between p-4 border-b border-slate-200">
|
||||
<h3 class="font-semibold text-slate-800" id="portfolioModalTitle">新增项目</h3>
|
||||
<button onclick="closePortfolioModal()" class="btn btn-secondary btn-sm">
|
||||
<i class="fas fa-times"></i>
|
||||
</button>
|
||||
</div>
|
||||
<div class="p-6">
|
||||
<form id="portfolioForm" onsubmit="savePortfolio(event)">
|
||||
<input type="hidden" id="portfolioId">
|
||||
<div class="space-y-4">
|
||||
<div>
|
||||
<label class="block text-sm font-medium text-slate-700 mb-1">选择人员</label>
|
||||
<select id="portfolioUserId" class="w-full px-4 py-2 border border-slate-300 rounded-lg focus:ring-2 focus:ring-primary-500 focus:border-primary-500" required>
|
||||
<option value="">请选择人员</option>
|
||||
{{ range .Users }}
|
||||
<option value="{{.ID}}">{{.Name}} - {{.Email}}</option>
|
||||
{{ end }}
|
||||
</select>
|
||||
</div>
|
||||
<div>
|
||||
<label class="block text-sm font-medium text-slate-700 mb-1">项目名称</label>
|
||||
<input type="text" id="portfolioName" class="w-full px-4 py-2 border border-slate-300 rounded-lg focus:ring-2 focus:ring-primary-500 focus:border-primary-500" required>
|
||||
</div>
|
||||
<div>
|
||||
<label class="block text-sm font-medium text-slate-700 mb-1">项目描述</label>
|
||||
<textarea id="portfolioDescription" rows="3" class="w-full px-4 py-2 border border-slate-300 rounded-lg focus:ring-2 focus:ring-primary-500 focus:border-primary-500"></textarea>
|
||||
</div>
|
||||
<div>
|
||||
<label class="block text-sm font-medium text-slate-700 mb-1">技术栈 (每行一个)</label>
|
||||
<textarea id="portfolioTechStack" rows="3" class="w-full px-4 py-2 border border-slate-300 rounded-lg focus:ring-2 focus:ring-primary-500 focus:border-primary-500" placeholder="Go React MySQL"></textarea>
|
||||
</div>
|
||||
<div>
|
||||
<label class="block text-sm font-medium text-slate-700 mb-1">项目链接</label>
|
||||
<input type="url" id="portfolioURL" class="w-full px-4 py-2 border border-slate-300 rounded-lg focus:ring-2 focus:ring-primary-500 focus:border-primary-500">
|
||||
</div>
|
||||
<div class="grid grid-cols-2 gap-4">
|
||||
<div>
|
||||
<label class="block text-sm font-medium text-slate-700 mb-1">开始日期</label>
|
||||
<input type="date" id="portfolioStartDate" class="w-full px-4 py-2 border border-slate-300 rounded-lg focus:ring-2 focus:ring-primary-500 focus:border-primary-500">
|
||||
</div>
|
||||
<div>
|
||||
<label class="block text-sm font-medium text-slate-700 mb-1">结束日期</label>
|
||||
<input type="date" id="portfolioEndDate" class="w-full px-4 py-2 border border-slate-300 rounded-lg focus:ring-2 focus:ring-primary-500 focus:border-primary-500">
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex items-center gap-4">
|
||||
<label class="flex items-center gap-2">
|
||||
<input type="checkbox" id="portfolioHidden" class="rounded border-slate-300 text-primary-600 focus:ring-primary-500">
|
||||
<span class="text-sm text-slate-700">隐藏项目</span>
|
||||
</label>
|
||||
<label class="flex items-center gap-2">
|
||||
<input type="checkbox" id="portfolioShowInResume" class="rounded border-slate-300 text-primary-600 focus:ring-primary-500">
|
||||
<span class="text-sm text-slate-700">首页展示</span>
|
||||
</label>
|
||||
</div>
|
||||
<div>
|
||||
<label class="block text-sm font-medium text-slate-700 mb-1">访问密码 (可选)</label>
|
||||
<input type="text" id="portfolioPassword" class="w-full px-4 py-2 border border-slate-300 rounded-lg focus:ring-2 focus:ring-primary-500 focus:border-primary-500" placeholder="留空则无需密码">
|
||||
</div>
|
||||
</div>
|
||||
<div class="mt-6 flex gap-3">
|
||||
<button type="button" onclick="closePortfolioModal()" class="flex-1 btn btn-secondary">取消</button>
|
||||
<button type="submit" class="flex-1 btn btn-primary">保存</button>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<script>
|
||||
function openAddPortfolioModal() {
|
||||
document.getElementById('portfolioModalTitle').textContent = '新增项目';
|
||||
document.getElementById('portfolioForm').reset();
|
||||
document.getElementById('portfolioId').value = '';
|
||||
const modal = document.getElementById('portfolioModal');
|
||||
modal.classList.remove('hidden');
|
||||
modal.classList.add('active');
|
||||
}
|
||||
|
||||
function closePortfolioModal() {
|
||||
const modal = document.getElementById('portfolioModal');
|
||||
modal.classList.add('hidden');
|
||||
modal.classList.remove('active');
|
||||
}
|
||||
|
||||
function editPortfolio(id) {
|
||||
fetch('/api/portfolio/' + id)
|
||||
.then(response => response.json())
|
||||
.then(data => {
|
||||
if (data.success) {
|
||||
const item = data.data;
|
||||
document.getElementById('portfolioModalTitle').textContent = '编辑项目';
|
||||
document.getElementById('portfolioId').value = item.id;
|
||||
document.getElementById('portfolioUserId').value = item.user_id;
|
||||
document.getElementById('portfolioName').value = item.name;
|
||||
document.getElementById('portfolioDescription').value = item.description || '';
|
||||
document.getElementById('portfolioTechStack').value = (item.tech_stack || []).join('\n');
|
||||
document.getElementById('portfolioURL').value = item.url || '';
|
||||
document.getElementById('portfolioStartDate').value = item.start_date || '';
|
||||
document.getElementById('portfolioEndDate').value = item.end_date || '';
|
||||
document.getElementById('portfolioHidden').checked = item.hidden || false;
|
||||
document.getElementById('portfolioShowInResume').checked = item.show_in_resume || false;
|
||||
document.getElementById('portfolioPassword').value = item.password || '';
|
||||
const modal = document.getElementById('portfolioModal');
|
||||
modal.classList.remove('hidden');
|
||||
modal.classList.add('active');
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
function savePortfolio(event) {
|
||||
event.preventDefault();
|
||||
const id = document.getElementById('portfolioId').value;
|
||||
const url = id ? '/api/portfolio/' + id : '/api/portfolio';
|
||||
const method = id ? 'PUT' : 'POST';
|
||||
|
||||
fetch(url, {
|
||||
method: method,
|
||||
headers: {
|
||||
'Content-Type': 'application/json',
|
||||
},
|
||||
body: JSON.stringify({
|
||||
user_id: document.getElementById('portfolioUserId').value,
|
||||
name: document.getElementById('portfolioName').value,
|
||||
description: document.getElementById('portfolioDescription').value,
|
||||
tech_stack: document.getElementById('portfolioTechStack').value.split('\n').filter(s => s.trim()),
|
||||
url: document.getElementById('portfolioURL').value,
|
||||
start_date: document.getElementById('portfolioStartDate').value,
|
||||
end_date: document.getElementById('portfolioEndDate').value,
|
||||
hidden: document.getElementById('portfolioHidden').checked,
|
||||
show_in_resume: document.getElementById('portfolioShowInResume').checked,
|
||||
password: document.getElementById('portfolioPassword').value,
|
||||
})
|
||||
})
|
||||
.then(response => response.json())
|
||||
.then(data => {
|
||||
if (data.success) {
|
||||
closePortfolioModal();
|
||||
location.reload();
|
||||
} else {
|
||||
showToast(data.message || '保存失败', 'error');
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
var deleteTargetId = null;
|
||||
|
||||
function deletePortfolio(id) {
|
||||
deleteTargetId = id;
|
||||
const modal = document.getElementById('confirmModal');
|
||||
modal.classList.remove('hidden');
|
||||
modal.classList.add('active');
|
||||
}
|
||||
|
||||
function closeConfirmModal() {
|
||||
deleteTargetId = null;
|
||||
const modal = document.getElementById('confirmModal');
|
||||
modal.classList.add('hidden');
|
||||
modal.classList.remove('active');
|
||||
}
|
||||
|
||||
function confirmDeleteAction() {
|
||||
if (!deleteTargetId) return;
|
||||
|
||||
fetch('/api/portfolio/' + deleteTargetId, {
|
||||
method: 'DELETE',
|
||||
})
|
||||
.then(response => response.json())
|
||||
.then(data => {
|
||||
closeConfirmModal();
|
||||
if (data.success) {
|
||||
location.reload();
|
||||
} else {
|
||||
showToast(data.message || '删除失败', 'error');
|
||||
}
|
||||
});
|
||||
}
|
||||
</script>
|
||||
@@ -0,0 +1,482 @@
|
||||
<div class="bg-white rounded-xl shadow-sm border border-slate-200 overflow-hidden">
|
||||
<div class="border-b border-slate-200 px-6 py-4 bg-slate-50">
|
||||
<div class="flex items-center justify-between">
|
||||
<div>
|
||||
<h3 class="font-semibold text-slate-800 flex items-center gap-2">
|
||||
<i class="fas fa-robot text-orange-500"></i> AI生成题目
|
||||
</h3>
|
||||
<p class="text-sm text-slate-500 mt-1">基于简历或关键词智能生成面试题目</p>
|
||||
</div>
|
||||
<div class="btn-group">
|
||||
<button onclick="goBack()" class="btn btn-secondary btn-sm">
|
||||
<i class="fas fa-arrow-left"></i> 返回
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="p-6">
|
||||
<div class="grid grid-cols-1 lg:grid-cols-4 gap-6">
|
||||
<div class="lg:col-span-1">
|
||||
<div class="bg-slate-50 rounded-lg p-4 sticky top-6">
|
||||
<h4 class="font-medium text-slate-700 mb-4 flex items-center gap-2">
|
||||
<i class="fas fa-sliders-h text-primary-500"></i> 生成设置
|
||||
</h4>
|
||||
<div class="space-y-4">
|
||||
<div>
|
||||
<label class="block text-sm font-medium text-slate-700 mb-1">选择简历(可选)</label>
|
||||
<select id="quizResumeId" class="w-full px-3 py-2 border border-slate-300 rounded-lg focus:ring-2 focus:ring-primary-500 focus:border-primary-500 text-sm">
|
||||
<option value="">不选择简历(使用自定义关键词)</option>
|
||||
{{ range .Resumes }}
|
||||
<option value="{{.ID}}">{{.BasicInfo.Name}} - {{.BasicInfo.Title}}</option>
|
||||
{{ end }}
|
||||
</select>
|
||||
</div>
|
||||
<div>
|
||||
<label class="block text-sm font-medium text-slate-700 mb-1">自定义关键词(可选)</label>
|
||||
<textarea id="quizKeywords" rows="3" class="w-full px-3 py-2 border border-slate-300 rounded-lg focus:ring-2 focus:ring-primary-500 focus:border-primary-500 text-sm resize-none" placeholder="如:Go,MySQL,微服务,Redis 不选简历时必填"></textarea>
|
||||
</div>
|
||||
<button onclick="doGenerateQuestions()" id="generateBtn" class="w-full btn btn-primary">
|
||||
<i class="fas fa-robot"></i> 生成题目
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="lg:col-span-3">
|
||||
<div id="questionsContainer" class="hidden">
|
||||
<div class="bg-slate-50 rounded-lg p-6">
|
||||
<div class="flex items-center justify-between mb-6">
|
||||
<h4 class="font-medium text-slate-700 flex items-center gap-2">
|
||||
<i class="fas fa-question-circle text-primary-500"></i> 请回答以下问题
|
||||
</h4>
|
||||
<span class="text-sm text-slate-500">共 <span id="questionCount">0</span> 题</span>
|
||||
</div>
|
||||
<div id="questionsList" class="space-y-6"></div>
|
||||
<div class="mt-6 flex gap-3">
|
||||
<button onclick="goBack()" class="flex-1 btn btn-secondary">取消</button>
|
||||
<button onclick="submitAnswers()" class="flex-1 btn btn-primary">提交答案</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div id="emptyState" class="bg-slate-50 rounded-lg p-12 text-center">
|
||||
<div class="w-20 h-20 mx-auto mb-4 rounded-full bg-orange-100 flex items-center justify-center">
|
||||
<i class="fas fa-robot text-orange-500 text-4xl"></i>
|
||||
</div>
|
||||
<h4 class="font-medium text-slate-700 mb-2">开始生成题目</h4>
|
||||
<p class="text-sm text-slate-500">选择简历或输入关键词,点击生成按钮开始</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<input type="hidden" id="user-id" value="{{ with .User }}{{.ID}}{{ end }}">
|
||||
<script>
|
||||
var currentQuestions = [];
|
||||
|
||||
function goBack() {
|
||||
window.history.back();
|
||||
}
|
||||
|
||||
function doGenerateQuestions() {
|
||||
const resumeId = document.getElementById('quizResumeId').value;
|
||||
const keywords = document.getElementById('quizKeywords').value.trim();
|
||||
|
||||
if (!resumeId && !keywords) {
|
||||
showToast('请选择简历或输入关键词', 'error');
|
||||
return;
|
||||
}
|
||||
|
||||
const btn = document.getElementById('generateBtn');
|
||||
btn.disabled = true;
|
||||
btn.innerHTML = '<i class="fas fa-spinner fa-spin"></i> 生成中...';
|
||||
|
||||
fetch('/api/ai/agent/generate-questions', {
|
||||
method: 'POST',
|
||||
headers: {
|
||||
'Content-Type': 'application/json',
|
||||
},
|
||||
body: JSON.stringify({
|
||||
resume_id: resumeId,
|
||||
keywords: keywords,
|
||||
})
|
||||
})
|
||||
.then(response => response.json())
|
||||
.then(data => {
|
||||
btn.disabled = false;
|
||||
btn.innerHTML = '<i class="fas fa-robot"></i> 生成题目';
|
||||
|
||||
const resultData = data.data || data;
|
||||
if (data.success && resultData.questions && resultData.questions.length > 0) {
|
||||
currentQuestions = resultData.questions;
|
||||
renderQuestions(resultData.questions);
|
||||
document.getElementById('emptyState').classList.add('hidden');
|
||||
document.getElementById('questionsContainer').classList.remove('hidden');
|
||||
} else {
|
||||
showToast(data.message || '生成题目失败', 'error');
|
||||
}
|
||||
})
|
||||
.catch(() => {
|
||||
btn.disabled = false;
|
||||
btn.innerHTML = '<i class="fas fa-robot"></i> 生成题目';
|
||||
showToast('生成题目失败', 'error');
|
||||
});
|
||||
}
|
||||
|
||||
function escapeHtml(text) {
|
||||
const div = document.createElement('div');
|
||||
div.textContent = text;
|
||||
return div.innerHTML;
|
||||
}
|
||||
|
||||
function renderQuestions(questions) {
|
||||
const container = document.getElementById('questionsList');
|
||||
const countSpan = document.getElementById('questionCount');
|
||||
container.innerHTML = '';
|
||||
countSpan.textContent = questions.length;
|
||||
|
||||
questions.forEach((q, index) => {
|
||||
const qDiv = document.createElement('div');
|
||||
qDiv.className = 'bg-white p-5 rounded-lg border border-slate-200 shadow-sm';
|
||||
|
||||
let typeLabel = '';
|
||||
let typeColor = '';
|
||||
switch(q.type) {
|
||||
case 'mcq': typeLabel = '选择题'; typeColor = 'bg-blue-100 text-blue-700'; break;
|
||||
case 'fill': typeLabel = '填空题'; typeColor = 'bg-purple-100 text-purple-700'; break;
|
||||
case 'sa': typeLabel = '简答题'; typeColor = 'bg-green-100 text-green-700'; break;
|
||||
case 'algo': typeLabel = '算法题'; typeColor = 'bg-orange-100 text-orange-700'; break;
|
||||
default: typeLabel = '问答题'; typeColor = 'bg-gray-100 text-gray-700';
|
||||
}
|
||||
|
||||
const category = q.category || '综合能力';
|
||||
const difficulty = q.difficulty || '初级';
|
||||
const hints = q.hints || [];
|
||||
|
||||
let hintsHtml = '';
|
||||
if (hints.length > 0) {
|
||||
hintsHtml = '<div class="mt-3 p-3 bg-yellow-50 rounded-lg border border-yellow-200">' +
|
||||
'<div class="flex items-center gap-2 text-sm font-medium text-yellow-700 mb-2">' +
|
||||
'<i class="fas fa-lightbulb"></i> 回答要点提示</div>' +
|
||||
'<ul class="text-xs text-yellow-600 space-y-1">';
|
||||
hints.forEach(h => {
|
||||
hintsHtml += '<li class="flex items-start gap-2"><span class="text-yellow-500">•</span>' + escapeHtml(h) + '</li>';
|
||||
});
|
||||
hintsHtml += '</ul></div>';
|
||||
}
|
||||
|
||||
let optionsHtml = '';
|
||||
if (q.options && q.options.length > 0) {
|
||||
optionsHtml = '<div class="space-y-2 mt-3">';
|
||||
q.options.forEach((opt, optIndex) => {
|
||||
const letter = String.fromCharCode(65 + optIndex);
|
||||
optionsHtml +=
|
||||
'<label class="flex items-center gap-3 p-3 rounded-lg hover:bg-slate-50 cursor-pointer border border-slate-100 transition-colors">' +
|
||||
'<input type="radio" name="q' + index + '" value="' + letter + '" class="w-4 h-4 text-primary-600">' +
|
||||
'<span class="text-sm text-slate-700">' + letter + '. ' + escapeHtml(opt) + '</span>' +
|
||||
'</label>';
|
||||
});
|
||||
optionsHtml += '</div>';
|
||||
} else if (q.type === 'fill') {
|
||||
optionsHtml =
|
||||
'<div class="mt-3">' +
|
||||
'<input type="text" id="ans' + index + '" class="w-full px-4 py-2.5 border border-slate-300 rounded-lg focus:ring-2 focus:ring-primary-500 focus:border-primary-500 text-sm" placeholder="请输入答案" autocomplete="off" >' +
|
||||
'</div>';
|
||||
} else {
|
||||
optionsHtml =
|
||||
'<div class="mt-3">' +
|
||||
'<textarea id="ans' + index + '" rows="4" class="w-full px-4 py-2.5 border border-slate-300 rounded-lg focus:ring-2 focus:ring-primary-500 focus:border-primary-500 text-sm resize-none" placeholder="请输入您的回答"></textarea>' +
|
||||
'</div>';
|
||||
}
|
||||
|
||||
qDiv.innerHTML =
|
||||
'<div class="flex flex-wrap items-center justify-between mb-3">' +
|
||||
'<div class="flex flex-wrap items-center gap-2">' +
|
||||
'<span class="px-2.5 py-1 ' + typeColor + ' rounded-full text-xs font-medium">' + typeLabel + '</span>' +
|
||||
'<span class="px-2.5 py-1 ' + getDifficultyColor(difficulty) + ' rounded-full text-xs font-medium">' + difficulty + '</span>' +
|
||||
'<span class="px-2.5 py-1 bg-indigo-100 text-indigo-700 rounded-full text-xs font-medium">' + category + '</span>' +
|
||||
'<span class="text-xs text-slate-400">第 ' + (index + 1) + ' 题 · ' + q.score + ' 分</span>' +
|
||||
'</div>' +
|
||||
'<button onclick="toggleQuestionFavorite(' + index + ')" id="favBtn' + index + '" class="btn btn-xs btn-yellow flex items-center gap-1 hover:bg-yellow-100 transition-colors" title="收藏本题">' +
|
||||
'<i class="fas fa-star"></i> 收藏' +
|
||||
'</button>' +
|
||||
'</div>' +
|
||||
'<p class="text-slate-800 font-medium leading-relaxed">' + escapeHtml(q.text) + '</p>' +
|
||||
optionsHtml +
|
||||
hintsHtml;
|
||||
container.appendChild(qDiv);
|
||||
});
|
||||
}
|
||||
|
||||
var favoriteQuestions = [];
|
||||
|
||||
function toggleQuestionFavorite(index) {
|
||||
const q = currentQuestions[index];
|
||||
const btn = document.getElementById(`favBtn${index}`);
|
||||
|
||||
const idx = favoriteQuestions.indexOf(index);
|
||||
if (idx > -1) {
|
||||
favoriteQuestions.splice(idx, 1);
|
||||
btn.classList.remove('bg-yellow-100', 'text-yellow-700');
|
||||
btn.innerHTML = '<i class="fas fa-star"></i> 收藏';
|
||||
} else {
|
||||
favoriteQuestions.push(index);
|
||||
btn.classList.add('bg-yellow-100', 'text-yellow-700');
|
||||
btn.innerHTML = '<i class="fas fa-star"></i> 已收藏';
|
||||
showToast('题目已收藏', 'success');
|
||||
}
|
||||
}
|
||||
|
||||
function submitAnswers() {
|
||||
const answers = {};
|
||||
const unanswered = [];
|
||||
|
||||
currentQuestions.forEach((q, index) => {
|
||||
let answer = '';
|
||||
if (q.type === 'mcq') {
|
||||
const radios = document.getElementsByName('q' + index);
|
||||
for (let radio of radios) {
|
||||
if (radio.checked) {
|
||||
answer = radio.value;
|
||||
break;
|
||||
}
|
||||
}
|
||||
} else {
|
||||
const input = document.getElementById('ans' + index);
|
||||
answer = input ? input.value.trim() : '';
|
||||
}
|
||||
|
||||
if (!answer) {
|
||||
unanswered.push(index + 1);
|
||||
}
|
||||
answers['q' + index] = answer;
|
||||
});
|
||||
|
||||
if (unanswered.length > 0) {
|
||||
const unansweredList = unanswered.join('、');
|
||||
showCustomConfirm(
|
||||
'确认提交',
|
||||
`您还有 ${unanswered.length} 道题未作答:第 ${unansweredList} 题。\n\n确定要继续提交吗?未作答的题目将不计分。`,
|
||||
function(confirmed) {
|
||||
if (confirmed) {
|
||||
doSubmit(answers);
|
||||
}
|
||||
}
|
||||
);
|
||||
return;
|
||||
}
|
||||
|
||||
doSubmit(answers);
|
||||
}
|
||||
|
||||
function doSubmit(answers) {
|
||||
let score = 0;
|
||||
let correctCount = 0;
|
||||
let unansweredCount = 0;
|
||||
|
||||
currentQuestions.forEach((q, index) => {
|
||||
const userAnswer = answers['q' + index];
|
||||
if (!userAnswer) {
|
||||
unansweredCount++;
|
||||
return;
|
||||
}
|
||||
|
||||
if (isAnswerCorrect(q, userAnswer)) {
|
||||
score += q.score;
|
||||
correctCount++;
|
||||
}
|
||||
});
|
||||
|
||||
const resultData = {
|
||||
questions: currentQuestions,
|
||||
user_answers: answers,
|
||||
score: score,
|
||||
correct_count: correctCount,
|
||||
total_count: currentQuestions.length,
|
||||
unanswered_count: unansweredCount
|
||||
};
|
||||
|
||||
fetch('/api/ai/agent/submit-answers', {
|
||||
method: 'POST',
|
||||
headers: {
|
||||
'Content-Type': 'application/json',
|
||||
},
|
||||
body: JSON.stringify(resultData)
|
||||
})
|
||||
.then(response => response.json())
|
||||
.then(data => {
|
||||
if (data.success) {
|
||||
saveQuizRecord(answers, score, correctCount, currentQuestions.length, unansweredCount);
|
||||
} else {
|
||||
showToast(data.error || '提交失败', 'error');
|
||||
}
|
||||
})
|
||||
.catch(() => {
|
||||
showToast('提交失败', 'error');
|
||||
});
|
||||
}
|
||||
|
||||
function isAnswerCorrect(question, userAnswer) {
|
||||
const userAns = userAnswer.trim().toLowerCase();
|
||||
const correctAns = String(question.answer).trim().toLowerCase();
|
||||
|
||||
if (question.type === 'mcq') {
|
||||
return userAns === correctAns;
|
||||
}
|
||||
|
||||
if (question.type === 'fill') {
|
||||
return userAns === correctAns;
|
||||
}
|
||||
|
||||
if (question.type === 'sa' || question.type === 'algo') {
|
||||
return userAns.length > 0;
|
||||
}
|
||||
|
||||
return userAns === correctAns;
|
||||
}
|
||||
|
||||
function saveQuizRecord(answers, score, correctCount, totalCount, unansweredCount) {
|
||||
const resumeId = document.getElementById('quizResumeId').value;
|
||||
const keywords = document.getElementById('quizKeywords').value.trim();
|
||||
|
||||
const recordId = 'quiz-' + Date.now() + '-' + Math.random().toString(36).substr(2, 9);
|
||||
|
||||
const userAnswers = {};
|
||||
currentQuestions.forEach((q, index) => {
|
||||
userAnswers[index] = answers['q' + index] || '';
|
||||
});
|
||||
|
||||
const now = new Date();
|
||||
const title = now.toLocaleString('zh-CN', {
|
||||
month: '2-digit',
|
||||
day: '2-digit',
|
||||
hour: '2-digit',
|
||||
minute: '2-digit'
|
||||
});
|
||||
|
||||
const userId = document.getElementById('user-id').value;
|
||||
const recordData = {
|
||||
id: recordId,
|
||||
user_id: userId,
|
||||
resume_id: resumeId,
|
||||
resume_route: resumeId ? '' : 'custom-quiz',
|
||||
title: '答题记录 - ' + title,
|
||||
questions: currentQuestions.map(q => ({
|
||||
type: q.type,
|
||||
text: q.text,
|
||||
options: q.options || [],
|
||||
answer: q.answer,
|
||||
analysis: q.analysis || '',
|
||||
score: q.score,
|
||||
keywords: q.keywords || []
|
||||
})),
|
||||
user_answers: userAnswers,
|
||||
score: score,
|
||||
correct_count: correctCount,
|
||||
total_count: totalCount
|
||||
};
|
||||
|
||||
fetch('/api/quiz/record', {
|
||||
method: 'POST',
|
||||
headers: {
|
||||
'Content-Type': 'application/json',
|
||||
},
|
||||
body: JSON.stringify(recordData)
|
||||
})
|
||||
.then(response => response.json())
|
||||
.then(data => {
|
||||
try {
|
||||
saveFavoriteAndWrongQuestions(resumeId, answers);
|
||||
} catch (e) {
|
||||
console.error('Failed to save favorite/wrong questions:', e);
|
||||
}
|
||||
|
||||
let message = `答题完成!`;
|
||||
if (unansweredCount > 0) {
|
||||
message += `\n得分:${score}分(${correctCount}/${totalCount - unansweredCount}正确,${unansweredCount}题未作答)`;
|
||||
} else {
|
||||
message += `\n得分:${score}分(${correctCount}/${totalCount}正确)`;
|
||||
}
|
||||
showToast(message, 'success');
|
||||
|
||||
setTimeout(() => {
|
||||
const url = new URL(window.location.href);
|
||||
url.pathname = url.pathname.replace('/quiz/generate', '/quiz');
|
||||
url.searchParams.set('record', recordId);
|
||||
window.location.href = url.toString();
|
||||
}, 2000);
|
||||
})
|
||||
.catch(() => {
|
||||
let message = `答题完成!`;
|
||||
if (unansweredCount > 0) {
|
||||
message += `\n得分:${score}分(${correctCount}/${totalCount - unansweredCount}正确,${unansweredCount}题未作答)`;
|
||||
} else {
|
||||
message += `\n得分:${score}分(${correctCount}/${totalCount}正确)`;
|
||||
}
|
||||
showToast(message, 'success');
|
||||
|
||||
setTimeout(() => {
|
||||
const url = new URL(window.location.href);
|
||||
url.pathname = url.pathname.replace('/quiz/generate', '/quiz');
|
||||
url.searchParams.set('record', recordId);
|
||||
window.location.href = url.toString();
|
||||
}, 2000);
|
||||
});
|
||||
}
|
||||
|
||||
function saveFavoriteAndWrongQuestions(resumeId, answers) {
|
||||
const userId = document.getElementById('user-id').value;
|
||||
currentQuestions.forEach((q, index) => {
|
||||
const userAnswer = answers['q' + index];
|
||||
const isCorrect = userAnswer && isAnswerCorrect(q, userAnswer);
|
||||
const isFavorite = favoriteQuestions.includes(index);
|
||||
|
||||
if (!isCorrect || isFavorite) {
|
||||
const favData = {
|
||||
id: generateUUID(),
|
||||
user_id: userId,
|
||||
resume_id: resumeId,
|
||||
resume_route: '',
|
||||
question: {
|
||||
type: q.type,
|
||||
text: q.text,
|
||||
options: q.options || [],
|
||||
answer: q.answer,
|
||||
analysis: q.analysis || '',
|
||||
score: q.score,
|
||||
keywords: q.keywords || [],
|
||||
difficulty: q.difficulty || '初级',
|
||||
category: q.category || '综合能力'
|
||||
},
|
||||
user_answer: userAnswer || '',
|
||||
is_correct: isCorrect,
|
||||
is_favorite: isFavorite
|
||||
};
|
||||
|
||||
fetch('/api/favorite', {
|
||||
method: 'POST',
|
||||
headers: {
|
||||
'Content-Type': 'application/json',
|
||||
},
|
||||
body: JSON.stringify(favData)
|
||||
}).catch(() => {});
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
function generateUUID() {
|
||||
return 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, function(c) {
|
||||
var r = Math.random() * 16 | 0, v = c == 'x' ? r : (r & 0x3 | 0x8);
|
||||
return v.toString(16);
|
||||
});
|
||||
}
|
||||
|
||||
function getDifficultyColor(difficulty) {
|
||||
switch(difficulty) {
|
||||
case '入门': return 'bg-green-100 text-green-700';
|
||||
case '初级': return 'bg-blue-100 text-blue-700';
|
||||
case '中级': return 'bg-yellow-100 text-yellow-700';
|
||||
case '进阶': return 'bg-orange-100 text-orange-700';
|
||||
case '高级': return 'bg-red-100 text-red-700';
|
||||
default: return 'bg-gray-100 text-gray-700';
|
||||
}
|
||||
}
|
||||
</script>
|
||||
@@ -0,0 +1,270 @@
|
||||
<div class="bg-white rounded-xl shadow-sm border border-slate-200 overflow-hidden">
|
||||
<div class="border-b border-slate-200 px-6 py-4 bg-slate-50">
|
||||
<div class="flex items-center justify-between">
|
||||
<div class="flex items-center gap-4">
|
||||
<a href="{{.AdminPath}}/user/{{.User.ID}}/quiz?tab=records" class="text-slate-400 hover:text-slate-600 transition-colors">
|
||||
<i class="fas fa-arrow-left"></i>
|
||||
</a>
|
||||
<div>
|
||||
<h3 class="font-semibold text-slate-800 flex items-center gap-2">
|
||||
<i class="fas fa-file-alt text-blue-500"></i> {{ if .Record.Title }}{{.Record.Title}}{{ else }}答题详情{{ end }}
|
||||
</h3>
|
||||
<p class="text-sm text-slate-500 mt-1">{{ if .User.Name }}{{.User.Name}}{{ else }}{{.User.Username}}{{ end }} 的答题记录</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex items-center gap-6">
|
||||
<div class="text-center">
|
||||
<p class="text-xs text-slate-500 mb-1">答题时间</p>
|
||||
<p class="text-sm font-medium text-slate-700">{{.Record.CreatedAt}}</p>
|
||||
</div>
|
||||
<div class="text-center">
|
||||
<p class="text-xs text-slate-500 mb-1">得分</p>
|
||||
<p class="text-3xl font-bold {{ if ge .Record.Score 60.0 }}text-green-600{{ else }}text-red-600{{ end }}">{{.Record.Score}}<span class="text-sm font-normal text-slate-400 ml-1">分</span></p>
|
||||
</div>
|
||||
<div class="text-center">
|
||||
<p class="text-xs text-slate-500 mb-1">正确率</p>
|
||||
<p class="text-sm font-medium text-slate-700">{{.Record.CorrectCount}}/{{.Record.TotalCount}} 题</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="p-6">
|
||||
<div class="space-y-4">
|
||||
{{ range $index, $q := .Questions }}
|
||||
<div class="border border-slate-200 rounded-xl overflow-hidden" data-question-index="{{$index}}">
|
||||
<div class="flex items-center justify-between px-4 py-3 bg-slate-50 border-b border-slate-200">
|
||||
<div class="flex items-center gap-3">
|
||||
<span class="w-8 h-8 rounded-full bg-slate-200 flex items-center justify-center text-sm font-medium text-slate-600">{{ add $index 1 }}</span>
|
||||
<div class="flex items-center gap-2">
|
||||
{{ if eq $q.Type "mcq" }}<span class="px-2 py-0.5 bg-blue-100 text-blue-600 rounded text-xs">选择题</span>{{ end }}
|
||||
{{ if eq $q.Type "fill" }}<span class="px-2 py-0.5 bg-green-100 text-green-600 rounded text-xs">填空题</span>{{ end }}
|
||||
{{ if eq $q.Type "sa" }}<span class="px-2 py-0.5 bg-purple-100 text-purple-600 rounded text-xs">简答题</span>{{ end }}
|
||||
{{ if eq $q.Type "algo" }}<span class="px-2 py-0.5 bg-orange-100 text-orange-600 rounded text-xs">算法题</span>{{ end }}
|
||||
{{ if $q.Difficulty }}
|
||||
<span class="px-2 py-0.5 rounded text-xs"
|
||||
{{ if eq $q.Difficulty "入门" }}style="background-color: #dcfce7; color: #166534;"{{ end }}
|
||||
{{ if eq $q.Difficulty "初级" }}style="background-color: #dbeafe; color: #1e40af;"{{ end }}
|
||||
{{ if eq $q.Difficulty "中级" }}style="background-color: #fef3c7; color: #92400e;"{{ end }}
|
||||
{{ if eq $q.Difficulty "进阶" }}style="background-color: #ffedd5; color: #c2410c;"{{ end }}
|
||||
{{ if eq $q.Difficulty "高级" }}style="background-color: #fee2e2; color: #991b1b;"{{ end }}>
|
||||
{{ $q.Difficulty }}
|
||||
</span>
|
||||
{{ end }}
|
||||
{{ if $q.Category }}<span class="px-2 py-0.5 bg-indigo-100 text-indigo-600 rounded text-xs">{{$q.Category}}</span>{{ end }}
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex items-center gap-3">
|
||||
<button class="toggle-favorite-btn flex items-center gap-1 px-3 py-1.5 rounded-lg text-sm transition-all hover:bg-slate-100"
|
||||
data-index="{{$index}}" data-user-id="{{$.User.ID}}" data-resume-id="{{$.Record.ResumeID}}" data-resume-route="{{$.Record.ResumeRoute}}">
|
||||
<i class="fas fa-star text-slate-400"></i>
|
||||
<span class="text-slate-500">收藏</span>
|
||||
</button>
|
||||
<span class="px-2 py-1 rounded-full text-xs font-medium {{ if index $.Correct $index }}bg-green-100 text-green-700{{ else }}bg-red-100 text-red-700{{ end }}">
|
||||
{{ if index $.Correct $index }}回答正确{{ else }}回答错误{{ end }}
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="p-5">
|
||||
<p class="text-slate-800 font-medium mb-4">{{ $q.Text }}</p>
|
||||
|
||||
{{ if $q.Options }}
|
||||
<div class="space-y-2 mb-4">
|
||||
{{ range $optIndex, $opt := $q.Options }}
|
||||
{{ $letter := printf "%c" (index "ABCDE" $optIndex) }}
|
||||
{{ $isCorrect := eq $letter $q.Answer }}
|
||||
{{ $userAnswer := index $.UserAnswers $index }}
|
||||
{{ $isUserAns := eq $letter $userAnswer }}
|
||||
<div class="flex items-center gap-3 p-3 rounded-lg {{ if $isCorrect }}bg-green-50 border border-green-200{{ else if and $isUserAns (not $isCorrect) }}bg-red-50 border border-red-200{{ else }}bg-slate-50{{ end }}">
|
||||
<span class="w-6 h-6 rounded-full flex items-center justify-center text-xs font-medium {{ if $isCorrect }}bg-green-500 text-white{{ else if and $isUserAns (not $isCorrect) }}bg-red-500 text-white{{ else }}bg-slate-200 text-slate-600{{ end }}">{{ $letter }}</span>
|
||||
<span class="text-sm {{ if $isCorrect }}text-green-700 font-medium{{ else if and $isUserAns (not $isCorrect) }}text-red-700{{ else }}text-slate-600{{ end }}">{{ $opt }}</span>
|
||||
{{ if $isCorrect }}<i class="fas fa-check text-green-500 ml-auto text-sm"></i>{{ end }}
|
||||
{{ if and $isUserAns (not $isCorrect) }}<i class="fas fa-times text-red-500 ml-auto text-sm"></i>{{ end }}
|
||||
</div>
|
||||
{{ end }}
|
||||
</div>
|
||||
{{ end }}
|
||||
|
||||
<div class="flex items-center gap-6 mb-4 text-sm">
|
||||
<div class="flex items-center gap-2">
|
||||
<span class="text-slate-500">正确答案:</span>
|
||||
<span class="font-medium text-green-600 markdown-answer">{{ $q.Answer }}</span>
|
||||
</div>
|
||||
{{ with index $.UserAnswers $index }}
|
||||
<div class="flex items-center gap-2">
|
||||
<span class="text-slate-500">你的答案:</span>
|
||||
<span class="font-medium {{ if index $.Correct $index }}text-green-600{{ else }}text-red-600{{ end }}">{{ . }}</span>
|
||||
</div>
|
||||
{{ end }}
|
||||
</div>
|
||||
|
||||
{{ if $q.Analysis }}
|
||||
<div class="p-4 bg-blue-50 rounded-lg border border-blue-100">
|
||||
<div class="font-medium text-blue-700 text-sm mb-2 flex items-center gap-2">
|
||||
<i class="fas fa-lightbulb text-xs"></i> 答案解析
|
||||
</div>
|
||||
<div class="text-sm text-slate-600 markdown-body markdown-analysis">{{ $q.Analysis }}</div>
|
||||
</div>
|
||||
{{ end }}
|
||||
</div>
|
||||
</div>
|
||||
{{ end }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/github-markdown-css/5.5.0/github-markdown.min.css">
|
||||
<script src="https://cdn.jsdelivr.net/npm/marked/marked.min.js"></script>
|
||||
<script src="https://cdn.jsdelivr.net/npm/dompurify@3/dist/purify.min.js"></script>
|
||||
<style>
|
||||
.markdown-body { background-color: transparent !important; font-size: 0.88rem; }
|
||||
.markdown-body p { margin: 0.5em 0; }
|
||||
.markdown-body pre { background: #1e293b; padding: 0.75rem; border-radius: 0.38rem; overflow-x: auto; }
|
||||
.markdown-body code { background: rgba(0,0,0,0.06); padding: 0.12rem 0.38rem; border-radius: 0.25rem; font-size: 0.81rem; }
|
||||
.markdown-body pre code { background: transparent; padding: 0; color: #e2e8f0; }
|
||||
.toggle-favorite-btn.favorited i { color: #fbbf24; }
|
||||
.toggle-favorite-btn.favorited span { color: #d97706; }
|
||||
.toggle-favorite-btn.favorited { background-color: #fef3c7; }
|
||||
</style>
|
||||
<script>
|
||||
function decodeUnicode(str) {
|
||||
return str.replace(/\\u([0-9a-fA-F]{4})/g, function (_, hex) {
|
||||
return String.fromCharCode(parseInt(hex, 16));
|
||||
});
|
||||
}
|
||||
|
||||
function escapeHtml(str) {
|
||||
return str.replace(/&/g, '&')
|
||||
.replace(/</g, '<')
|
||||
.replace(/>/g, '>')
|
||||
.replace(/"/g, '"')
|
||||
.replace(/'/g, ''');
|
||||
}
|
||||
|
||||
document.addEventListener('DOMContentLoaded', function () {
|
||||
marked.setOptions({ breaks: true, gfm: true });
|
||||
|
||||
document.querySelectorAll('.markdown-analysis').forEach(function (el) {
|
||||
let md = decodeUnicode(el.textContent || '');
|
||||
if (!md.trim()) return;
|
||||
md = escapeHtml(md);
|
||||
el.innerHTML = DOMPurify.sanitize(marked.parse(md));
|
||||
el.classList.add('markdown-body');
|
||||
});
|
||||
|
||||
document.querySelectorAll('.markdown-answer').forEach(function (el) {
|
||||
let md = decodeUnicode(el.textContent || '');
|
||||
if (!md.trim()) return;
|
||||
md = escapeHtml(md);
|
||||
el.innerHTML = DOMPurify.sanitize(marked.parseInline(md));
|
||||
});
|
||||
|
||||
document.querySelectorAll('.toggle-favorite-btn').forEach(function(btn) {
|
||||
btn.addEventListener('click', function() {
|
||||
const index = parseInt(this.dataset.index);
|
||||
const userId = this.dataset.userId;
|
||||
const resumeId = this.dataset.resumeId;
|
||||
const resumeRoute = this.dataset.resumeRoute;
|
||||
|
||||
const questionEl = this.closest('[data-question-index]');
|
||||
const questionType = questionEl.querySelector('[class*="bg-blue-100"], [class*="bg-green-100"], [class*="bg-purple-100"], [class*="bg-orange-100"]')?.textContent || '综合';
|
||||
const questionText = questionEl.querySelector('.text-slate-800.font-medium')?.textContent || '';
|
||||
const questionOptions = [];
|
||||
questionEl.querySelectorAll('.space-y-2 .text-sm').forEach(function(opt) {
|
||||
questionOptions.push(opt.textContent.trim());
|
||||
});
|
||||
const questionAnswer = questionEl.querySelector('.text-green-600.markdown-answer')?.textContent || '';
|
||||
const questionAnalysis = questionEl.querySelector('.markdown-analysis')?.textContent || '';
|
||||
const questionDifficulty = questionEl.querySelector('[style*="background-color"]')?.textContent || '初级';
|
||||
const questionCategory = questionEl.querySelector('.bg-indigo-100')?.textContent || '综合';
|
||||
|
||||
const isCorrectEl = this.nextElementSibling;
|
||||
const isCorrect = isCorrectEl.textContent.includes('正确');
|
||||
const userAnswerEl = questionEl.querySelector('.text-red-600') || questionEl.querySelector('.text-green-600');
|
||||
const userAnswer = userAnswerEl ? userAnswerEl.textContent.trim().replace('你的答案:', '') : '';
|
||||
|
||||
const questionData = {
|
||||
type: questionType.includes('选择') ? 'mcq' :
|
||||
questionType.includes('填空') ? 'fill' :
|
||||
questionType.includes('简答') ? 'sa' : 'algo',
|
||||
text: questionText,
|
||||
options: questionOptions.length > 0 ? questionOptions : null,
|
||||
answer: questionAnswer,
|
||||
analysis: questionAnalysis,
|
||||
score: 10,
|
||||
keywords: [],
|
||||
difficulty: questionDifficulty,
|
||||
category: questionCategory
|
||||
};
|
||||
|
||||
const payload = {
|
||||
user_id: userId,
|
||||
resume_id: resumeId,
|
||||
resume_route: resumeRoute,
|
||||
question: questionData,
|
||||
user_answer: userAnswer,
|
||||
is_correct: isCorrect,
|
||||
is_favorite: true
|
||||
};
|
||||
|
||||
fetch('/api/quiz/favorite', {
|
||||
method: 'POST',
|
||||
headers: {
|
||||
'Content-Type': 'application/json'
|
||||
},
|
||||
body: JSON.stringify(payload)
|
||||
})
|
||||
.then(response => response.json())
|
||||
.then(data => {
|
||||
if (data.success || data.code === 201) {
|
||||
this.classList.add('favorited');
|
||||
this.querySelector('i').classList.remove('text-slate-400');
|
||||
this.querySelector('i').classList.add('text-yellow-500');
|
||||
this.querySelector('span').textContent = '已收藏';
|
||||
showToast('收藏成功');
|
||||
} else {
|
||||
showToast('收藏失败: ' + (data.message || '未知错误'));
|
||||
}
|
||||
})
|
||||
.catch(error => {
|
||||
showToast('收藏失败: ' + error.message);
|
||||
});
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
function showToast(message) {
|
||||
const toast = document.createElement('div');
|
||||
toast.style.cssText = `
|
||||
position: fixed;
|
||||
top: 1.25rem;
|
||||
right: 1.25rem;
|
||||
padding: 0.75rem 1.50rem;
|
||||
background: rgba(0,0,0,0.8);
|
||||
color: white;
|
||||
border-radius: 0.50rem;
|
||||
z-index: 1000;
|
||||
font-size: 0.88rem;
|
||||
animation: slideIn 0.3s ease;
|
||||
`;
|
||||
toast.textContent = message;
|
||||
document.body.appendChild(toast);
|
||||
|
||||
setTimeout(() => {
|
||||
toast.style.animation = 'slideOut 0.3s ease';
|
||||
setTimeout(() => toast.remove(), 300);
|
||||
}, 2000);
|
||||
}
|
||||
|
||||
const style = document.createElement('style');
|
||||
style.textContent = `
|
||||
@keyframes slideIn {
|
||||
from { transform: translateX(100%); opacity: 0; }
|
||||
to { transform: translateX(0); opacity: 1; }
|
||||
}
|
||||
@keyframes slideOut {
|
||||
from { transform: translateX(0); opacity: 1; }
|
||||
to { transform: translateX(100%); opacity: 0; }
|
||||
}
|
||||
`;
|
||||
document.head.appendChild(style);
|
||||
</script>
|
||||
@@ -0,0 +1,220 @@
|
||||
<div class="bg-white rounded-xl shadow-sm border border-slate-200 overflow-hidden">
|
||||
<div class="border-b border-slate-200 px-6 py-4 bg-slate-50">
|
||||
<div class="flex items-center justify-between">
|
||||
<div>
|
||||
<h3 class="font-semibold text-slate-800 flex items-center gap-2">
|
||||
<i class="fas fa-question-circle text-purple-500"></i> 面试答题管理
|
||||
</h3>
|
||||
<p class="text-sm text-slate-500 mt-1">管理用户的面试题库、答题记录和学习进度</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="p-6">
|
||||
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-4 mb-6">
|
||||
<div class="bg-gradient-to-br from-blue-50 to-blue-100 rounded-xl p-5 border border-blue-200">
|
||||
<div class="flex items-center justify-between">
|
||||
<div>
|
||||
<p class="text-sm text-blue-600 font-medium">总用户数</p>
|
||||
<p class="text-2xl font-bold text-blue-800 mt-1">{{ len .UsersWithStats }}</p>
|
||||
</div>
|
||||
<div class="w-12 h-12 rounded-full bg-blue-200 flex items-center justify-center">
|
||||
<i class="fas fa-users text-blue-600"></i>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="bg-gradient-to-br from-green-50 to-green-100 rounded-xl p-5 border border-green-200">
|
||||
<div class="flex items-center justify-between">
|
||||
<div>
|
||||
<p class="text-sm text-green-600 font-medium">总答题次数</p>
|
||||
<p class="text-2xl font-bold text-green-800 mt-1">{{ .TotalStats.TotalAttempts }}</p>
|
||||
</div>
|
||||
<div class="w-12 h-12 rounded-full bg-green-200 flex items-center justify-center">
|
||||
<i class="fas fa-check-circle text-green-600"></i>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="bg-gradient-to-br from-yellow-50 to-yellow-100 rounded-xl p-5 border border-yellow-200">
|
||||
<div class="flex items-center justify-between">
|
||||
<div>
|
||||
<p class="text-sm text-yellow-600 font-medium">收藏题目</p>
|
||||
<p class="text-2xl font-bold text-yellow-800 mt-1">{{ .TotalStats.TotalFavorites }}</p>
|
||||
</div>
|
||||
<div class="w-12 h-12 rounded-full bg-yellow-200 flex items-center justify-center">
|
||||
<i class="fas fa-star text-yellow-600"></i>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="bg-gradient-to-br from-red-50 to-red-100 rounded-xl p-5 border border-red-200">
|
||||
<div class="flex items-center justify-between">
|
||||
<div>
|
||||
<p class="text-sm text-red-600 font-medium">错题数量</p>
|
||||
<p class="text-2xl font-bold text-red-800 mt-1">{{ .TotalStats.TotalWrong }}</p>
|
||||
</div>
|
||||
<div class="w-12 h-12 rounded-full bg-red-200 flex items-center justify-center">
|
||||
<i class="fas fa-times-circle text-red-600"></i>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="overflow-x-auto">
|
||||
<table class="table">
|
||||
<thead>
|
||||
<tr class="bg-slate-50 border-b border-slate-200">
|
||||
<th class="text-left px-6 py-4 text-sm font-semibold text-slate-600">用户信息</th>
|
||||
<th class="text-left px-6 py-4 text-sm font-semibold text-slate-600">答题统计</th>
|
||||
<th class="text-left px-6 py-4 text-sm font-semibold text-slate-600">正确率</th>
|
||||
<th class="text-left px-6 py-4 text-sm font-semibold text-slate-600">收藏/错题</th>
|
||||
<th class="text-left px-6 py-4 text-sm font-semibold text-slate-600">最近答题</th>
|
||||
<th class="text-left px-6 py-4 text-sm font-semibold text-slate-600">操作</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
{{ range .UsersWithStats }}
|
||||
<tr class="border-b border-slate-100 hover:bg-slate-50 transition-colors">
|
||||
<td class="px-6 py-4">
|
||||
<div class="flex items-center gap-3">
|
||||
<div class="w-10 h-10 rounded-full bg-gradient-to-br from-purple-500 to-purple-600 flex items-center justify-center text-white font-bold shadow-md">
|
||||
{{ if .User.Name }}{{ substr .User.Name 0 1 }}{{ else }}{{ substr .User.Username 0 1 }}{{ end }}
|
||||
</div>
|
||||
<div>
|
||||
<p class="font-medium text-slate-800">{{ if .User.Name }}{{ .User.Name }}{{ else }}{{ .User.Username }}{{ end }}</p>
|
||||
<p class="text-sm text-slate-500">{{ .User.Email }}</p>
|
||||
</div>
|
||||
</div>
|
||||
</td>
|
||||
<td class="px-6 py-4">
|
||||
<div class="flex items-center gap-4">
|
||||
<div>
|
||||
<p class="text-xs text-slate-500">答题次数</p>
|
||||
<p class="font-semibold text-slate-800">{{ .TotalAttempts }}</p>
|
||||
</div>
|
||||
<div class="w-px h-10 bg-slate-200"></div>
|
||||
<div>
|
||||
<p class="text-xs text-slate-500">平均得分</p>
|
||||
<p class="font-semibold text-slate-800">{{ printf "%.1f" .AvgScore }}</p>
|
||||
</div>
|
||||
</div>
|
||||
</td>
|
||||
<td class="px-6 py-4">
|
||||
<div class="flex items-center gap-3">
|
||||
<div class="w-20 h-3 bg-slate-100 rounded-full overflow-hidden">
|
||||
<div class="h-full rounded-full transition-all"
|
||||
style="width: {{ .CorrectRate }}%; background-color: {{ if ge .CorrectRate 80 }}#22c55e{{ else if ge .CorrectRate 60 }}#eab308{{ else }}#ef4444{{ end }}"></div>
|
||||
</div>
|
||||
<span class="text-sm font-medium text-slate-700">{{ .CorrectRate }}%</span>
|
||||
</div>
|
||||
</td>
|
||||
<td class="px-6 py-4">
|
||||
<div class="flex items-center gap-3">
|
||||
<span class="flex items-center gap-1 text-yellow-600">
|
||||
<i class="fas fa-star"></i>
|
||||
<span class="text-sm font-medium">{{ .FavoriteCount }}</span>
|
||||
</span>
|
||||
<span class="flex items-center gap-1 text-red-500">
|
||||
<i class="fas fa-times-circle"></i>
|
||||
<span class="text-sm font-medium">{{ .WrongCount }}</span>
|
||||
</span>
|
||||
</div>
|
||||
</td>
|
||||
<td class="px-6 py-4">
|
||||
<span class="text-sm text-slate-500">{{ if .LastAttemptDate }}{{ .LastAttemptDate }}{{ else }}暂无记录{{ end }}</span>
|
||||
</td>
|
||||
<td class="px-6 py-4">
|
||||
<div class="flex items-center gap-2">
|
||||
<a href="{{$.AdminPath}}/user/{{.User.ID}}/quiz/generate" class="btn btn-primary btn-xs" title="AI生成题目">
|
||||
<i class="fas fa-robot"></i> 生成题目
|
||||
</a>
|
||||
<a href="{{$.AdminPath}}/user/{{.User.ID}}/quiz" class="btn btn-info btn-xs" title="查看题库">
|
||||
<i class="fas fa-book-open"></i> 题库
|
||||
</a>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
{{ else }}
|
||||
<tr>
|
||||
<td colspan="6" class="px-6 py-12 text-center text-slate-500">
|
||||
<div class="w-16 h-16 mx-auto mb-4 rounded-full bg-slate-100 flex items-center justify-center">
|
||||
<i class="fas fa-users text-slate-400 text-2xl"></i>
|
||||
</div>
|
||||
<p>暂无用户,请先添加用户</p>
|
||||
</td>
|
||||
</tr>
|
||||
{{ end }}
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
{{ if gt .TotalPages 1 }}
|
||||
<div class="border-t border-slate-200 px-6 py-4 bg-slate-50 flex items-center justify-between">
|
||||
<div class="text-sm text-slate-500">共 {{ .TotalRecords }} 条记录,第 {{ .CurrentPage }} / {{ .TotalPages }} 页</div>
|
||||
<div class="flex items-center gap-2">
|
||||
<a href="?page=1" class="btn btn-sm btn-slate {{ if eq .CurrentPage 1 }}opacity-50 cursor-not-allowed{{ end }}" {{ if eq .CurrentPage 1 }}onclick="return false"{{ end }}>
|
||||
<i class="fas fa-chevron-left"></i>
|
||||
<i class="fas fa-chevron-left"></i>
|
||||
</a>
|
||||
<a href="?page={{ if eq .CurrentPage 1 }}1{{ else }}{{ subtract .CurrentPage 1 }}{{ end }}" class="btn btn-sm btn-slate {{ if eq .CurrentPage 1 }}opacity-50 cursor-not-allowed{{ end }}" {{ if eq .CurrentPage 1 }}onclick="return false"{{ end }}>
|
||||
<i class="fas fa-chevron-left"></i>
|
||||
</a>
|
||||
{{ range $i := to 1 $.TotalPages }}
|
||||
{{ if or (eq $i 1) (eq $i $.TotalPages) (and (ge $i (subtract $.CurrentPage 2)) (le $i (add $.CurrentPage 2))) }}
|
||||
<a href="?page={{ $i }}" class="btn btn-sm {{ if eq $i $.CurrentPage }}btn-primary{{ else }}btn-slate{{ end }}">{{ $i }}</a>
|
||||
{{ else if and (eq $i 2) (gt (subtract $.CurrentPage 3) 1) }}
|
||||
<span class="text-slate-400 px-2">...</span>
|
||||
{{ else if and (eq $i (subtract $.TotalPages 1)) (lt (add $.CurrentPage 3) $.TotalPages) }}
|
||||
<span class="text-slate-400 px-2">...</span>
|
||||
{{ end }}
|
||||
{{ end }}
|
||||
<a href="?page={{ if eq .CurrentPage .TotalPages }}{{ .TotalPages }}{{ else }}{{ add .CurrentPage 1 }}{{ end }}" class="btn btn-sm btn-slate {{ if eq .CurrentPage .TotalPages }}opacity-50 cursor-not-allowed{{ end }}" {{ if eq .CurrentPage .TotalPages }}onclick="return false"{{ end }}>
|
||||
<i class="fas fa-chevron-right"></i>
|
||||
</a>
|
||||
<a href="?page={{ .TotalPages }}" class="btn btn-sm btn-slate {{ if eq .CurrentPage .TotalPages }}opacity-50 cursor-not-allowed{{ end }}" {{ if eq .CurrentPage .TotalPages }}onclick="return false"{{ end }}>
|
||||
<i class="fas fa-chevron-right"></i>
|
||||
<i class="fas fa-chevron-right"></i>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
{{ end }}
|
||||
<div class="mt-6 bg-slate-50 rounded-xl p-5">
|
||||
<h4 class="font-medium text-slate-700 mb-4 flex items-center gap-2">
|
||||
<i class="fas fa-chart-line text-purple-500"></i> 功能说明
|
||||
</h4>
|
||||
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-4">
|
||||
<div class="bg-white p-4 rounded-lg border border-slate-200">
|
||||
<div class="flex items-center gap-3 mb-2">
|
||||
<div class="w-8 h-8 rounded-full bg-blue-100 flex items-center justify-center">
|
||||
<i class="fas fa-robot text-blue-600"></i>
|
||||
</div>
|
||||
<span class="font-medium text-slate-700">AI生成题目</span>
|
||||
</div>
|
||||
<p class="text-sm text-slate-500">基于简历内容或关键词智能生成面试题目,支持多种难度级别</p>
|
||||
</div>
|
||||
<div class="bg-white p-4 rounded-lg border border-slate-200">
|
||||
<div class="flex items-center gap-3 mb-2">
|
||||
<div class="w-8 h-8 rounded-full bg-yellow-100 flex items-center justify-center">
|
||||
<i class="fas fa-star text-yellow-600"></i>
|
||||
</div>
|
||||
<span class="font-medium text-slate-700">收藏题目</span>
|
||||
</div>
|
||||
<p class="text-sm text-slate-500">收藏重要题目,方便复习回顾,支持快速筛选查看</p>
|
||||
</div>
|
||||
<div class="bg-white p-4 rounded-lg border border-slate-200">
|
||||
<div class="flex items-center gap-3 mb-2">
|
||||
<div class="w-8 h-8 rounded-full bg-red-100 flex items-center justify-center">
|
||||
<i class="fas fa-times-circle text-red-600"></i>
|
||||
</div>
|
||||
<span class="font-medium text-slate-700">错题本</span>
|
||||
</div>
|
||||
<p class="text-sm text-slate-500">自动记录答错的题目,支持针对性练习和错题回顾</p>
|
||||
</div>
|
||||
<div class="bg-white p-4 rounded-lg border border-slate-200">
|
||||
<div class="flex items-center gap-3 mb-2">
|
||||
<div class="w-8 h-8 rounded-full bg-green-100 flex items-center justify-center">
|
||||
<i class="fas fa-chart-bar text-green-600"></i>
|
||||
</div>
|
||||
<span class="font-medium text-slate-700">数据统计</span>
|
||||
</div>
|
||||
<p class="text-sm text-slate-500">查看答题记录、正确率、得分趋势等学习数据</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
File diff suppressed because it is too large
Load Diff
@@ -0,0 +1,661 @@
|
||||
<div class="bg-white rounded-xl shadow-sm border border-slate-200 overflow-hidden">
|
||||
<div class="border-b border-slate-200 px-6 py-4 bg-slate-50">
|
||||
<div class="flex items-center justify-between">
|
||||
<div>
|
||||
<h3 class="font-semibold text-slate-800 flex items-center gap-2">
|
||||
<i class="fas fa-file-alt text-purple-500"></i> 简历管理
|
||||
</h3>
|
||||
<p class="text-sm text-slate-500 mt-1">管理所有用户的简历</p>
|
||||
</div>
|
||||
<div class="flex gap-2">
|
||||
<button onclick="openUploadDocumentModal()" class="btn btn-success">
|
||||
<i class="fas fa-upload"></i> 上传文档生成简历
|
||||
</button>
|
||||
<a href="{{$.AdminPath}}/resume/add" class="btn btn-primary">
|
||||
<i class="fas fa-plus"></i> 添加简历
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="px-6 py-4 border-b border-slate-100 bg-white">
|
||||
<form id="filterForm" method="GET" action="{{$.AdminPath}}/resumes" class="flex flex-wrap items-center gap-3">
|
||||
<div class="flex-1 min-w-[11.25rem]">
|
||||
<input type="text" name="keyword" value="{{.FilterKeyword}}" placeholder="搜索姓名/路由..." class="w-full px-3 py-2 text-sm border border-slate-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500">
|
||||
</div>
|
||||
<select name="user_id" class="px-3 py-2 text-sm border border-slate-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500">
|
||||
<option value="">全部人员</option>
|
||||
{{ range .Users }}
|
||||
<option value="{{.ID}}" {{ if eq $.FilterUserID .ID }}selected{{ end }}>{{.Name}}({{.Username}})</option>
|
||||
{{ end }}
|
||||
</select>
|
||||
<select name="template" class="px-3 py-2 text-sm border border-slate-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500">
|
||||
<option value="">全部模板</option>
|
||||
<option value="modern" {{ if eq .FilterTemplate "modern" }}selected{{ end }}>现代商务</option>
|
||||
<option value="classic" {{ if eq .FilterTemplate "classic" }}selected{{ end }}>传统经典</option>
|
||||
<option value="tech" {{ if eq .FilterTemplate "tech" }}selected{{ end }}>科技极客</option>
|
||||
<option value="sidebar" {{ if eq .FilterTemplate "sidebar" }}selected{{ end }}>经典侧边栏</option>
|
||||
<option value="elegant" {{ if eq .FilterTemplate "elegant" }}selected{{ end }}>优雅轻奢</option>
|
||||
<option value="fresh" {{ if eq .FilterTemplate "fresh" }}selected{{ end }}>清新自然</option>
|
||||
<option value="minimalist" {{ if eq .FilterTemplate "minimalist" }}selected{{ end }}>极简风格</option>
|
||||
<option value="professional" {{ if eq .FilterTemplate "professional" }}selected{{ end }}>专业商务</option>
|
||||
</select>
|
||||
<select name="show_in_home" class="px-3 py-2 text-sm border border-slate-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500">
|
||||
<option value="">首页展示</option>
|
||||
<option value="1" {{ if eq .FilterShowInHome "1" }}selected{{ end }}>已展示</option>
|
||||
<option value="0" {{ if eq .FilterShowInHome "0" }}selected{{ end }}>未展示</option>
|
||||
</select>
|
||||
<button type="submit" class="btn btn-primary btn-sm">
|
||||
<i class="fas fa-search"></i> 筛选
|
||||
</button>
|
||||
<a href="{{$.AdminPath}}/resumes" class="btn btn-secondary btn-sm">
|
||||
<i class="fas fa-redo"></i> 重置
|
||||
</a>
|
||||
</form>
|
||||
</div>
|
||||
<div class="overflow-x-auto">
|
||||
<table class="table">
|
||||
<thead>
|
||||
<tr class="bg-slate-50 border-b border-slate-200">
|
||||
<th class="text-left px-6 py-4 text-sm font-semibold text-slate-600">姓名</th>
|
||||
<th class="text-left px-6 py-4 text-sm font-semibold text-slate-600">职位</th>
|
||||
<th class="text-left px-6 py-4 text-sm font-semibold text-slate-600">所属人员</th>
|
||||
<th class="text-left px-6 py-4 text-sm font-semibold text-slate-600">访问路由</th>
|
||||
<th class="text-left px-6 py-4 text-sm font-semibold text-slate-600">首页展示</th>
|
||||
<th class="text-left px-6 py-4 text-sm font-semibold text-slate-600">更新时间</th>
|
||||
<th class="text-left px-6 py-4 text-sm font-semibold text-slate-600 actions-col">操作</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
{{ range .Resumes }}
|
||||
<tr class="border-b border-slate-100 hover:bg-slate-50 transition-colors">
|
||||
<td class="px-6 py-4">
|
||||
<span class="font-medium text-slate-800">{{.BasicInfo.Name}}</span>
|
||||
</td>
|
||||
<td class="px-6 py-4 text-slate-600">{{.BasicInfo.Title}}</td>
|
||||
<td class="px-6 py-4">
|
||||
{{ if .UserID }}
|
||||
{{ $user := index $.UserMap .UserID }}
|
||||
{{ if $user }}
|
||||
<span class="badge badge-success">{{$user.Name}}({{$user.Username}})</span>
|
||||
{{ else }}
|
||||
<span class="badge badge-warning">已失效</span>
|
||||
{{ end }}
|
||||
{{ else }}
|
||||
<span class="badge badge-danger">未绑定</span>
|
||||
{{ end }}
|
||||
</td>
|
||||
<td class="px-6 py-4 text-slate-600">/{{.Route}}</td>
|
||||
<td class="px-6 py-4">
|
||||
{{ if .ShowInHome }}
|
||||
<span class="badge badge-success">是</span>
|
||||
{{ else }}
|
||||
<span class="badge badge-slate">否</span>
|
||||
{{ end }}
|
||||
</td>
|
||||
<td class="px-6 py-4 text-slate-500 text-sm">{{.UpdatedAt}}</td>
|
||||
<td class="px-6 py-4 actions-col">
|
||||
<div class="btn-group flex-wrap gap-1">
|
||||
<a href="/{{.Route}}" target="_blank" class="btn btn-info btn-xs" title="预览">
|
||||
<i class="fas fa-eye"></i> 预览
|
||||
</a>
|
||||
{{ if .UserID }}
|
||||
<a href="{{$.AdminPath}}/user/{{.UserID}}/resume/{{.ID}}/edit" class="btn btn-primary btn-xs" title="编辑">
|
||||
<i class="fas fa-edit"></i> 编辑
|
||||
</a>
|
||||
{{ else }}
|
||||
<a href="{{$.AdminPath}}/resume/{{.ID}}/edit" class="btn btn-primary btn-xs" title="编辑">
|
||||
<i class="fas fa-edit"></i> 编辑
|
||||
</a>
|
||||
{{ end }}
|
||||
<button onclick="toggleShowInHome('{{.ID}}', {{.ShowInHome}})" class="btn btn-warning btn-xs" title="{{if .ShowInHome}}取消展示{{else}}展示{{end}}">
|
||||
<i class="fas fa-home"></i> {{if .ShowInHome}}取消{{else}}展示{{end}}
|
||||
</button>
|
||||
<button onclick="updatePassword('{{.ID}}')" class="btn btn-secondary btn-xs" title="密码">
|
||||
<i class="fas fa-lock"></i> 密码
|
||||
</button>
|
||||
{{ if .UserID }}
|
||||
<button onclick="unbindUser('{{.ID}}')" class="btn btn-orange btn-xs" title="解绑人员">
|
||||
<i class="fas fa-unlink"></i> 解绑
|
||||
</button>
|
||||
{{ else }}
|
||||
<button onclick="bindUser('{{.ID}}')" class="btn btn-success btn-xs" title="绑定人员">
|
||||
<i class="fas fa-link"></i> 绑定
|
||||
</button>
|
||||
{{ end }}
|
||||
<button onclick="deleteResume('{{.ID}}')" class="btn btn-danger btn-xs" title="删除">
|
||||
<i class="fas fa-trash"></i> 删除
|
||||
</button>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
{{ else }}
|
||||
<tr>
|
||||
<td colspan="7" class="px-6 py-12 text-center text-slate-500">
|
||||
<div class="w-16 h-16 mx-auto mb-4 rounded-full bg-slate-100 flex items-center justify-center">
|
||||
<i class="fas fa-file-alt text-slate-400 text-2xl"></i>
|
||||
</div>
|
||||
<p>暂无简历</p>
|
||||
</td>
|
||||
</tr>
|
||||
{{ end }}
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
{{ if gt .TotalPages 1 }}
|
||||
<div class="border-t border-slate-200 px-6 py-4 bg-slate-50 flex items-center justify-between">
|
||||
<div class="text-sm text-slate-500">共 {{ .Total }} 条记录,第 {{ .Page }} / {{ .TotalPages }} 页</div>
|
||||
<div class="flex items-center gap-2">
|
||||
<a href="?page=1{{ .FilterQuery }}" class="btn btn-sm btn-slate {{ if eq .Page 1 }}opacity-50 cursor-not-allowed{{ end }}" {{ if eq .Page 1 }}onclick="return false"{{ end }}>
|
||||
<i class="fas fa-chevron-left"></i>
|
||||
<i class="fas fa-chevron-left"></i>
|
||||
</a>
|
||||
<a href="?page={{ if eq .Page 1 }}1{{ else }}{{ subtract .Page 1 }}{{ end }}{{ .FilterQuery }}" class="btn btn-sm btn-slate {{ if eq .Page 1 }}opacity-50 cursor-not-allowed{{ end }}" {{ if eq .Page 1 }}onclick="return false"{{ end }}>
|
||||
<i class="fas fa-chevron-left"></i>
|
||||
</a>
|
||||
{{ if gt .TotalPages 7 }}
|
||||
{{ if gt .Page 3 }}
|
||||
<a href="?page=1{{ .FilterQuery }}" class="btn btn-sm btn-slate">1</a>
|
||||
{{ if gt .Page 4 }}
|
||||
<span class="text-slate-400 text-sm">...</span>
|
||||
{{ end }}
|
||||
{{ end }}
|
||||
{{ end }}
|
||||
{{ range $i := to 1 .TotalPages }}
|
||||
{{ if and (ge $i (subtract $.Page 2)) (le $i (add $.Page 2)) }}
|
||||
<a href="?page={{ $i }}{{ $.FilterQuery }}" class="btn btn-sm {{ if eq $i $.Page }}btn-primary{{ else }}btn-slate{{ end }}">{{ $i }}</a>
|
||||
{{ end }}
|
||||
{{ end }}
|
||||
{{ if gt .TotalPages 7 }}
|
||||
{{ if lt .Page (subtract .TotalPages 2) }}
|
||||
{{ if lt .Page (subtract .TotalPages 3) }}
|
||||
<span class="text-slate-400 text-sm">...</span>
|
||||
{{ end }}
|
||||
<a href="?page={{ .TotalPages }}{{ .FilterQuery }}" class="btn btn-sm btn-slate">{{ .TotalPages }}</a>
|
||||
{{ end }}
|
||||
{{ end }}
|
||||
<a href="?page={{ if eq .Page .TotalPages }}{{ .TotalPages }}{{ else }}{{ add .Page 1 }}{{ end }}{{ .FilterQuery }}" class="btn btn-sm btn-slate {{ if eq .Page .TotalPages }}opacity-50 cursor-not-allowed{{ end }}" {{ if eq .Page .TotalPages }}onclick="return false"{{ end }}>
|
||||
<i class="fas fa-chevron-right"></i>
|
||||
</a>
|
||||
<a href="?page={{ .TotalPages }}{{ .FilterQuery }}" class="btn btn-sm btn-slate {{ if eq .Page .TotalPages }}opacity-50 cursor-not-allowed{{ end }}" {{ if eq .Page .TotalPages }}onclick="return false"{{ end }}>
|
||||
<i class="fas fa-chevron-right"></i>
|
||||
<i class="fas fa-chevron-right"></i>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
{{ end }}
|
||||
</div>
|
||||
<div class="modal" id="addResumeModal">
|
||||
<div class="modal-content">
|
||||
<div class="modal-header">
|
||||
<h3 class="modal-title" id="addResumeModalTitle">
|
||||
<i class="fas fa-file-plus text-blue-500"></i> 添加简历
|
||||
</h3>
|
||||
<div class="modal-close" onclick="closeAddResumeModal()">
|
||||
<i class="fas fa-times"></i>
|
||||
</div>
|
||||
</div>
|
||||
<div class="modal-body">
|
||||
<form id="addResumeForm" onsubmit="saveResume(event)">
|
||||
<input type="hidden" id="resumeId">
|
||||
<div class="space-y-4">
|
||||
<div>
|
||||
<label class="form-label">姓名</label>
|
||||
<input type="text" id="resumeName" class="form-input" required>
|
||||
</div>
|
||||
<div>
|
||||
<label class="form-label">职位</label>
|
||||
<input type="text" id="resumeTitle" class="form-input" required>
|
||||
</div>
|
||||
<div>
|
||||
<label class="form-label">访问路由(如 zhangsan)</label>
|
||||
<input type="text" id="resumeRoute" class="form-input" required>
|
||||
</div>
|
||||
<div>
|
||||
<label class="form-label">绑定人员(可选,可后续绑定)</label>
|
||||
<select id="resumeUserId" class="form-input">
|
||||
<option value="">不绑定人员</option>
|
||||
{{ range .Users }}
|
||||
<option value="{{.ID}}">{{.Name}} - {{.Username}}</option>
|
||||
{{ end }}
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<button onclick="closeAddResumeModal()" class="btn btn-secondary">
|
||||
<i class="fas fa-times"></i> 取消
|
||||
</button>
|
||||
<button type="submit" form="addResumeForm" class="btn btn-primary">
|
||||
<i class="fas fa-save"></i> 保存
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="modal" id="bindUserModal">
|
||||
<div class="modal-content">
|
||||
<div class="modal-header">
|
||||
<h3 class="modal-title">
|
||||
<i class="fas fa-link text-green-500"></i> 绑定人员
|
||||
</h3>
|
||||
<div class="modal-close" onclick="closeBindUserModal()">
|
||||
<i class="fas fa-times"></i>
|
||||
</div>
|
||||
</div>
|
||||
<div class="modal-body">
|
||||
<div class="mb-4">
|
||||
<label class="form-label">选择要绑定的人员</label>
|
||||
<select id="bindUserId" class="form-input">
|
||||
{{ range .Users }}
|
||||
<option value="{{.ID}}">{{.Name}} - {{.Username}}</option>
|
||||
{{ end }}
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<button onclick="closeBindUserModal()" class="btn btn-secondary">
|
||||
<i class="fas fa-times"></i> 取消
|
||||
</button>
|
||||
<button onclick="confirmBindUser()" class="btn btn-primary">
|
||||
<i class="fas fa-check"></i> 确认绑定
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="modal" id="passwordModal">
|
||||
<div class="modal-content">
|
||||
<div class="modal-header">
|
||||
<h3 class="modal-title">
|
||||
<i class="fas fa-lock text-yellow-500"></i> 设置访问密码
|
||||
</h3>
|
||||
<div class="modal-close" onclick="closePasswordModal()">
|
||||
<i class="fas fa-times"></i>
|
||||
</div>
|
||||
</div>
|
||||
<div class="modal-body">
|
||||
<div class="space-y-4">
|
||||
<div>
|
||||
<label class="form-label">访问密码(留空则取消密码保护)</label>
|
||||
<input type="password" id="resumePassword" class="form-input" placeholder="请输入密码">
|
||||
</div>
|
||||
<div>
|
||||
<label class="form-label">确认密码</label>
|
||||
<input type="password" id="resumePasswordConfirm" class="form-input" placeholder="请再次输入密码">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<button onclick="closePasswordModal()" class="btn btn-secondary">
|
||||
<i class="fas fa-times"></i> 取消
|
||||
</button>
|
||||
<button onclick="confirmUpdatePassword()" class="btn btn-primary">
|
||||
<i class="fas fa-save"></i> 保存
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="modal" id="uploadDocumentModal">
|
||||
<div class="modal-content">
|
||||
<div class="modal-header">
|
||||
<h3 class="modal-title">
|
||||
<i class="fas fa-upload text-green-500"></i> 上传文档生成简历
|
||||
</h3>
|
||||
<div class="modal-close" onclick="closeUploadDocumentModal()">
|
||||
<i class="fas fa-times"></i>
|
||||
</div>
|
||||
</div>
|
||||
<div class="modal-body">
|
||||
<form id="uploadDocumentForm" enctype="multipart/form-data" onsubmit="uploadDocument(event)">
|
||||
<div class="space-y-4">
|
||||
<div>
|
||||
<label class="form-label">选择文档</label>
|
||||
<div class="border-2 border-dashed border-slate-300 rounded-lg p-8 text-center hover:border-green-500 transition-colors" id="fileDropArea">
|
||||
<i class="fas fa-file-upload text-4xl text-slate-400 mb-4"></i>
|
||||
<p class="text-slate-600 mb-2">点击或拖拽文件到此处</p>
|
||||
<p class="text-sm text-slate-400">支持格式:PDF、DOCX、XLSX、MD、TXT</p>
|
||||
<input type="file" id="documentFile" name="file" accept=".pdf,.docx,.xlsx,.md,.txt" class="hidden" onchange="handleFileSelect(this)">
|
||||
</div>
|
||||
<div id="selectedFileInfo" class="mt-2 hidden">
|
||||
<div class="flex items-center gap-2 text-sm text-slate-600">
|
||||
<i class="fas fa-file"></i>
|
||||
<span id="selectedFileName"></span>
|
||||
<button type="button" onclick="clearFileSelection()" class="text-red-500 hover:text-red-700">
|
||||
<i class="fas fa-times"></i>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<label class="form-label">绑定人员(可选)</label>
|
||||
<select id="documentUserId" class="form-input">
|
||||
<option value="">不绑定人员</option>
|
||||
{{ range .Users }}
|
||||
<option value="{{.ID}}">{{.Name}} - {{.Username}}</option>
|
||||
{{ end }}
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<button onclick="closeUploadDocumentModal()" class="btn btn-secondary">
|
||||
<i class="fas fa-times"></i> 取消
|
||||
</button>
|
||||
<button type="submit" form="uploadDocumentForm" class="btn btn-success" id="uploadSubmitBtn">
|
||||
<i class="fas fa-upload"></i> 上传生成
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<script>
|
||||
var currentBindResumeId = '';
|
||||
var currentPasswordResumeId = '';
|
||||
|
||||
function openUploadDocumentModal() {
|
||||
document.getElementById('uploadDocumentModal').classList.add('active');
|
||||
document.getElementById('documentFile').value = '';
|
||||
document.getElementById('selectedFileInfo').classList.add('hidden');
|
||||
document.getElementById('selectedFileName').textContent = '';
|
||||
document.getElementById('uploadSubmitBtn').disabled = false;
|
||||
document.getElementById('uploadSubmitBtn').innerHTML = '<i class="fas fa-upload"></i> 上传生成';
|
||||
}
|
||||
|
||||
function closeUploadDocumentModal() {
|
||||
document.getElementById('uploadDocumentModal').classList.remove('active');
|
||||
}
|
||||
|
||||
document.getElementById('fileDropArea').addEventListener('click', function() {
|
||||
document.getElementById('documentFile').click();
|
||||
});
|
||||
|
||||
document.getElementById('fileDropArea').addEventListener('dragover', function(e) {
|
||||
e.preventDefault();
|
||||
this.classList.add('border-green-500');
|
||||
});
|
||||
|
||||
document.getElementById('fileDropArea').addEventListener('dragleave', function(e) {
|
||||
e.preventDefault();
|
||||
this.classList.remove('border-green-500');
|
||||
});
|
||||
|
||||
document.getElementById('fileDropArea').addEventListener('drop', function(e) {
|
||||
e.preventDefault();
|
||||
this.classList.remove('border-green-500');
|
||||
var files = e.dataTransfer.files;
|
||||
if (files.length > 0) {
|
||||
document.getElementById('documentFile').files = files;
|
||||
handleFileSelect(document.getElementById('documentFile'));
|
||||
}
|
||||
});
|
||||
|
||||
function handleFileSelect(input) {
|
||||
if (input.files.length > 0) {
|
||||
var file = input.files[0];
|
||||
document.getElementById('selectedFileName').textContent = file.name;
|
||||
document.getElementById('selectedFileInfo').classList.remove('hidden');
|
||||
}
|
||||
}
|
||||
|
||||
function clearFileSelection() {
|
||||
document.getElementById('documentFile').value = '';
|
||||
document.getElementById('selectedFileInfo').classList.add('hidden');
|
||||
document.getElementById('selectedFileName').textContent = '';
|
||||
}
|
||||
|
||||
function uploadDocument(event) {
|
||||
event.preventDefault();
|
||||
var fileInput = document.getElementById('documentFile');
|
||||
var userId = document.getElementById('documentUserId').value;
|
||||
|
||||
if (fileInput.files.length === 0) {
|
||||
showCustomAlert('error', '错误', '请选择要上传的文件');
|
||||
return;
|
||||
}
|
||||
|
||||
var file = fileInput.files[0];
|
||||
var allowedExts = ['.pdf', '.docx', '.xlsx', '.md', '.txt'];
|
||||
var fileExt = file.name.toLowerCase().substring(file.name.lastIndexOf('.'));
|
||||
|
||||
if (!allowedExts.includes(fileExt)) {
|
||||
showCustomAlert('error', '错误', '不支持的文件格式,支持:PDF、DOCX、XLSX、MD、TXT');
|
||||
return;
|
||||
}
|
||||
|
||||
var formData = new FormData();
|
||||
formData.append('file', file);
|
||||
|
||||
if (userId) {
|
||||
formData.append('user_id', userId);
|
||||
}
|
||||
|
||||
var submitBtn = document.getElementById('uploadSubmitBtn');
|
||||
submitBtn.disabled = true;
|
||||
submitBtn.innerHTML = '<i class="fas fa-spinner fa-spin"></i> 处理中...';
|
||||
|
||||
fetch('/dashboard/api/resume/generate-from-document', {
|
||||
method: 'POST',
|
||||
body: formData,
|
||||
credentials: 'include'
|
||||
})
|
||||
.then(response => {
|
||||
if (!response.ok) {
|
||||
throw new Error('HTTP ' + response.status);
|
||||
}
|
||||
return response.json();
|
||||
})
|
||||
.then(result => {
|
||||
console.log('API Response:', result);
|
||||
if (result.success) {
|
||||
showCustomAlert('success', '成功', result.message || '简历生成成功!');
|
||||
closeUploadDocumentModal();
|
||||
setTimeout(() => location.reload(), 2000);
|
||||
} else {
|
||||
showCustomAlert('error', '错误', result.message || '生成失败');
|
||||
}
|
||||
})
|
||||
.catch(error => {
|
||||
console.error('Upload error:', error);
|
||||
showCustomAlert('error', '错误', '上传失败: ' + error.message);
|
||||
})
|
||||
.finally(() => {
|
||||
submitBtn.disabled = false;
|
||||
submitBtn.innerHTML = '<i class="fas fa-upload"></i> 上传生成';
|
||||
});
|
||||
}
|
||||
|
||||
function openAddResumeModal() {
|
||||
document.getElementById('resumeId').value = '';
|
||||
document.getElementById('resumeName').value = '';
|
||||
document.getElementById('resumeTitle').value = '';
|
||||
document.getElementById('resumeRoute').value = '';
|
||||
document.getElementById('resumeUserId').value = '';
|
||||
document.getElementById('addResumeModal').classList.add('active');
|
||||
}
|
||||
|
||||
function closeAddResumeModal() {
|
||||
document.getElementById('addResumeModal').classList.remove('active');
|
||||
}
|
||||
|
||||
function saveResume(event) {
|
||||
event.preventDefault();
|
||||
const id = document.getElementById('resumeId').value;
|
||||
const name = document.getElementById('resumeName').value;
|
||||
const title = document.getElementById('resumeTitle').value;
|
||||
const route = document.getElementById('resumeRoute').value;
|
||||
const userId = document.getElementById('resumeUserId').value;
|
||||
|
||||
if (!name || !title || !route) {
|
||||
showCustomAlert('error', '错误', '请填写完整信息');
|
||||
return;
|
||||
}
|
||||
|
||||
fetch('/dashboard/api/resume/create', {
|
||||
method: 'POST',
|
||||
headers: { 'Content-Type': 'application/json' },
|
||||
body: JSON.stringify({
|
||||
user_id: userId,
|
||||
route: route,
|
||||
basic_info: {
|
||||
name: name,
|
||||
title: title
|
||||
}
|
||||
})
|
||||
})
|
||||
.then(response => response.json())
|
||||
.then(result => {
|
||||
if (result.success) {
|
||||
showCustomAlert('success', '成功', '添加成功');
|
||||
closeAddResumeModal();
|
||||
setTimeout(() => location.reload(), 1500);
|
||||
} else {
|
||||
showCustomAlert('error', '错误', '添加失败:' + (result.message || '未知错误'));
|
||||
}
|
||||
})
|
||||
.catch(() => {
|
||||
showCustomAlert('error', '错误', '添加失败');
|
||||
});
|
||||
}
|
||||
|
||||
function bindUser(resumeId) {
|
||||
currentBindResumeId = resumeId;
|
||||
document.getElementById('bindUserModal').classList.add('active');
|
||||
}
|
||||
|
||||
function closeBindUserModal() {
|
||||
document.getElementById('bindUserModal').classList.remove('active');
|
||||
currentBindResumeId = '';
|
||||
}
|
||||
|
||||
function confirmBindUser() {
|
||||
const userId = document.getElementById('bindUserId').value;
|
||||
if (!userId) {
|
||||
showCustomAlert('error', '错误', '请选择要绑定的人员');
|
||||
return;
|
||||
}
|
||||
|
||||
fetch('/dashboard/api/resume/' + currentBindResumeId + '/user', {
|
||||
method: 'PUT',
|
||||
headers: { 'Content-Type': 'application/json' },
|
||||
body: JSON.stringify({ user_id: userId })
|
||||
})
|
||||
.then(response => response.json())
|
||||
.then(result => {
|
||||
if (result.success) {
|
||||
showCustomAlert('success', '成功', '绑定成功');
|
||||
closeBindUserModal();
|
||||
setTimeout(() => location.reload(), 1500);
|
||||
} else {
|
||||
showCustomAlert('error', '错误', '绑定失败:' + (result.message || '未知错误'));
|
||||
}
|
||||
})
|
||||
.catch(() => {
|
||||
showCustomAlert('error', '错误', '绑定失败');
|
||||
});
|
||||
}
|
||||
|
||||
function unbindUser(resumeId) {
|
||||
showCustomConfirm('确认解绑', '确定要解绑该简历与人员的关联吗?', function(confirmed) {
|
||||
if (!confirmed) return;
|
||||
|
||||
fetch('/dashboard/api/resume/' + resumeId + '/user', {
|
||||
method: 'PUT',
|
||||
headers: { 'Content-Type': 'application/json' },
|
||||
body: JSON.stringify({ user_id: '' })
|
||||
})
|
||||
.then(response => response.json())
|
||||
.then(result => {
|
||||
if (result.success) {
|
||||
showCustomAlert('success', '成功', '解绑成功');
|
||||
setTimeout(() => location.reload(), 1500);
|
||||
} else {
|
||||
showCustomAlert('error', '错误', '解绑失败:' + (result.message || '未知错误'));
|
||||
}
|
||||
})
|
||||
.catch(() => {
|
||||
showCustomAlert('error', '错误', '解绑失败');
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
function toggleShowInHome(resumeId, currentState) {
|
||||
fetch('/dashboard/api/resume/' + resumeId + '/show_in_home', {
|
||||
method: 'PUT',
|
||||
headers: { 'Content-Type': 'application/json' },
|
||||
body: JSON.stringify({ show_in_home: !currentState })
|
||||
})
|
||||
.then(response => response.json())
|
||||
.then(result => {
|
||||
if (result.success !== undefined) {
|
||||
showCustomAlert('success', '成功', currentState ? '已取消首页展示' : '已设置首页展示');
|
||||
setTimeout(() => location.reload(), 1500);
|
||||
} else {
|
||||
showCustomAlert('error', '错误', '操作失败');
|
||||
}
|
||||
})
|
||||
.catch(() => {
|
||||
showCustomAlert('error', '错误', '操作失败');
|
||||
});
|
||||
}
|
||||
|
||||
function updatePassword(resumeId) {
|
||||
currentPasswordResumeId = resumeId;
|
||||
document.getElementById('resumePassword').value = '';
|
||||
document.getElementById('resumePasswordConfirm').value = '';
|
||||
document.getElementById('passwordModal').classList.add('active');
|
||||
}
|
||||
|
||||
function closePasswordModal() {
|
||||
document.getElementById('passwordModal').classList.remove('active');
|
||||
currentPasswordResumeId = '';
|
||||
}
|
||||
|
||||
function confirmUpdatePassword() {
|
||||
const password = document.getElementById('resumePassword').value;
|
||||
const confirmPassword = document.getElementById('resumePasswordConfirm').value;
|
||||
|
||||
if (password !== confirmPassword) {
|
||||
showCustomAlert('error', '错误', '两次输入的密码不一致');
|
||||
return;
|
||||
}
|
||||
|
||||
fetch('/dashboard/api/resume/' + currentPasswordResumeId + '/password', {
|
||||
method: 'PUT',
|
||||
headers: { 'Content-Type': 'application/json' },
|
||||
body: JSON.stringify({ password: password })
|
||||
})
|
||||
.then(response => response.json())
|
||||
.then(result => {
|
||||
if (result.success) {
|
||||
showCustomAlert('success', '成功', password ? '密码设置成功' : '密码已取消');
|
||||
closePasswordModal();
|
||||
} else {
|
||||
showCustomAlert('error', '错误', '设置失败:' + (result.message || '未知错误'));
|
||||
}
|
||||
})
|
||||
.catch(() => {
|
||||
showCustomAlert('error', '错误', '设置失败');
|
||||
});
|
||||
}
|
||||
|
||||
function deleteResume(resumeId) {
|
||||
showCustomConfirm('确认删除', '确定要删除该简历吗?此操作不可恢复。', function(confirmed) {
|
||||
if (!confirmed) return;
|
||||
|
||||
fetch('/dashboard/api/resume/' + resumeId, {
|
||||
method: 'DELETE'
|
||||
})
|
||||
.then(response => response.json())
|
||||
.then(result => {
|
||||
if (result.success) {
|
||||
showCustomAlert('success', '成功', '删除成功');
|
||||
setTimeout(() => location.reload(), 1500);
|
||||
} else {
|
||||
showCustomAlert('error', '错误', '删除失败:' + (result.message || '未知错误'));
|
||||
}
|
||||
})
|
||||
.catch(() => {
|
||||
showCustomAlert('error', '错误', '删除失败');
|
||||
});
|
||||
});
|
||||
}
|
||||
</script>
|
||||
@@ -0,0 +1,347 @@
|
||||
<div class="bg-white rounded-xl shadow-sm border border-slate-200 p-6">
|
||||
<div class="flex items-center justify-between mb-6">
|
||||
<div>
|
||||
<h3 class="font-semibold text-slate-800 flex items-center gap-2">
|
||||
<i class="fas fa-cog text-purple-500"></i> 系统设置
|
||||
</h3>
|
||||
<p class="text-sm text-slate-500 mt-1">配置系统参数</p>
|
||||
</div>
|
||||
<button onclick="saveSettings()" class="btn btn-primary">
|
||||
<i class="fas fa-save"></i> 保存设置
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<div class="grid grid-cols-1 lg:grid-cols-3 gap-6">
|
||||
<div class="lg:col-span-2 space-y-6">
|
||||
<div class="p-6 bg-slate-50 rounded-lg">
|
||||
<h4 class="font-medium text-slate-700 mb-4 flex items-center gap-2">
|
||||
<i class="fas fa-globe text-blue-500"></i> 网站基本设置
|
||||
</h4>
|
||||
<div class="grid grid-cols-1 md:grid-cols-2 gap-4">
|
||||
<div>
|
||||
<label class="block text-sm font-medium text-slate-700 mb-1">网站域名</label>
|
||||
<input type="text" id="settingDomain" class="w-full px-4 py-2 border border-slate-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500" value="{{.Config.WebsiteDomain}}">
|
||||
</div>
|
||||
<div>
|
||||
<label class="block text-sm font-medium text-slate-700 mb-1">网站标题</label>
|
||||
<input type="text" id="settingTitle" class="w-full px-4 py-2 border border-slate-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500" value="{{.Config.WebsiteTitle}}">
|
||||
</div>
|
||||
<div class="md:col-span-2">
|
||||
<label class="block text-sm font-medium text-slate-700 mb-1">网站描述</label>
|
||||
<textarea id="settingDescription" rows="3" class="w-full px-4 py-2 border border-slate-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500">{{.Config.WebsiteDescription}}</textarea>
|
||||
</div>
|
||||
<div class="md:col-span-2">
|
||||
<label class="block text-sm font-medium text-slate-700 mb-1">网站关键词</label>
|
||||
<input type="text" id="settingKeywords" class="w-full px-4 py-2 border border-slate-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500" value="{{.Config.WebsiteKeywords}}" placeholder="多个关键词用逗号分隔">
|
||||
</div>
|
||||
<div>
|
||||
<label class="block text-sm font-medium text-slate-700 mb-1">管理员邮箱</label>
|
||||
<input type="email" id="settingAdminEmail" class="w-full px-4 py-2 border border-slate-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500" value="{{.Config.AdminEmail}}">
|
||||
</div>
|
||||
<div>
|
||||
<label class="block text-sm font-medium text-slate-700 mb-1">管理员姓名</label>
|
||||
<input type="text" id="settingAdminName" class="w-full px-4 py-2 border border-slate-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500" value="{{.Config.AdminName}}">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="p-6 bg-slate-50 rounded-lg">
|
||||
<h4 class="font-medium text-slate-700 mb-4 flex items-center gap-2">
|
||||
<i class="fas fa-image text-blue-500"></i> Logo设置
|
||||
</h4>
|
||||
<div class="flex items-center gap-6">
|
||||
<div class="flex-shrink-0">
|
||||
{{ if .Config.LogoPath }}
|
||||
<div class="relative group">
|
||||
<img id="logoPreview" src="{{.Config.LogoPath}}" data-path="{{.Config.LogoPath}}" class="w-24 h-24 rounded-xl object-cover border-2 border-blue-200 shadow-md">
|
||||
<button onclick="clearLogo()" class="absolute -top-2 -right-2 w-6 h-6 bg-red-500 text-white rounded-full opacity-0 group-hover:opacity-100 transition-opacity flex items-center justify-center shadow-lg hover:bg-red-600">
|
||||
<i class="fas fa-times text-xs"></i>
|
||||
</button>
|
||||
</div>
|
||||
{{ else }}
|
||||
<div id="logoPreview" class="w-24 h-24 rounded-xl bg-white border-2 border-dashed border-slate-300 flex flex-col items-center justify-center text-slate-400 hover:border-blue-400 hover:text-blue-500 transition-all cursor-pointer" onclick="document.getElementById('logoFile').click()">
|
||||
<i class="fas fa-image text-2xl mb-1"></i>
|
||||
<span class="text-xs">点击上传</span>
|
||||
</div>
|
||||
{{ end }}
|
||||
</div>
|
||||
<div class="flex-1">
|
||||
<div id="logoDropZone" class="w-full border-2 border-dashed border-slate-300 rounded-lg p-6 text-center hover:border-blue-400 hover:bg-blue-50 transition-all cursor-pointer" onclick="document.getElementById('logoFile').click()">
|
||||
<i class="fas fa-cloud-upload-alt text-blue-500 text-3xl mb-3"></i>
|
||||
<p class="text-sm text-slate-600">点击或拖动文件到此处自动上传</p>
|
||||
</div>
|
||||
<input type="file" id="logoFile" accept="image/*" class="hidden" onchange="handleLogoSelect(this)">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="p-6 bg-slate-50 rounded-lg">
|
||||
<h4 class="font-medium text-slate-700 mb-4 flex items-center gap-2">
|
||||
<i class="fas fa-list text-blue-500"></i> 后台设置
|
||||
</h4>
|
||||
<div class="grid grid-cols-1 md:grid-cols-2 gap-4">
|
||||
<div>
|
||||
<label class="block text-sm font-medium text-slate-700 mb-1">后台列表每页数据条数</label>
|
||||
<input type="number" id="settingAdminPageSize" class="w-full px-4 py-2 border border-slate-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500" value="{{.Config.AdminPageSize}}" min="1" max="100">
|
||||
</div>
|
||||
<div>
|
||||
<label class="block text-sm font-medium text-slate-700 mb-1">SEO 关键词</label>
|
||||
<input type="text" id="settingSEOKeywords" class="w-full px-4 py-2 border border-slate-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500" value="{{.Config.SEOKeywords}}" placeholder="多个关键词用逗号分隔">
|
||||
</div>
|
||||
<div class="md:col-span-2">
|
||||
<label class="block text-sm font-medium text-slate-700 mb-1">SEO 描述</label>
|
||||
<textarea id="settingSEODescription" rows="2" class="w-full px-4 py-2 border border-slate-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500">{{.Config.SEODescription}}</textarea>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="space-y-6">
|
||||
<div class="p-6 bg-gradient-to-br from-blue-50 to-indigo-50 rounded-lg border border-blue-200">
|
||||
<h4 class="font-medium text-blue-800 mb-4 flex items-center gap-2">
|
||||
<i class="fas fa-server text-blue-600"></i> 系统信息
|
||||
</h4>
|
||||
<div class="space-y-3">
|
||||
<div class="flex items-center justify-between text-sm">
|
||||
<span class="text-slate-500">系统版本</span>
|
||||
<span class="text-slate-800 font-medium">1.0.0</span>
|
||||
</div>
|
||||
<div class="flex items-center justify-between text-sm">
|
||||
<span class="text-slate-500">Go 版本</span>
|
||||
<span class="text-slate-800 font-medium" id="sysGoVersion">-</span>
|
||||
</div>
|
||||
<div class="flex items-center justify-between text-sm">
|
||||
<span class="text-slate-500">数据库</span>
|
||||
<span class="text-slate-800 font-medium">SQLite</span>
|
||||
</div>
|
||||
<div class="flex items-center justify-between text-sm">
|
||||
<span class="text-slate-500">操作系统</span>
|
||||
<span class="text-slate-800 font-medium" id="sysOS">-</span>
|
||||
</div>
|
||||
<div class="flex items-center justify-between text-sm">
|
||||
<span class="text-slate-500">架构</span>
|
||||
<span class="text-slate-800 font-medium" id="sysArch">-</span>
|
||||
</div>
|
||||
<div class="flex items-center justify-between text-sm">
|
||||
<span class="text-slate-500">启动时间</span>
|
||||
<span class="text-slate-800 font-medium" id="sysStartTime">-</span>
|
||||
</div>
|
||||
<div class="flex items-center justify-between text-sm">
|
||||
<span class="text-slate-500">运行时长</span>
|
||||
<span class="text-slate-800 font-medium" id="sysUptime">-</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="p-6 bg-slate-50 rounded-lg">
|
||||
<h4 class="font-medium text-slate-700 mb-4 flex items-center gap-2">
|
||||
<i class="fas fa-history text-blue-500"></i> 最近登录记录
|
||||
</h4>
|
||||
<div id="loginHistoryList" class="space-y-3 max-h-60 overflow-y-auto">
|
||||
<div class="text-center text-slate-400 text-sm py-4">加载中...</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
function handleLogoSelect(input) {
|
||||
if (input.files && input.files[0]) {
|
||||
const reader = new FileReader();
|
||||
reader.onload = function(e) {
|
||||
const preview = document.getElementById('logoPreview');
|
||||
if (preview.tagName === 'IMG') {
|
||||
preview.src = e.target.result;
|
||||
// 上传未完成前先清空 data-path,等待 uploadLogo 完成后再回填服务端路径
|
||||
preview.removeAttribute('data-path');
|
||||
} else {
|
||||
preview.outerHTML = '<div id="logoPreview" class="relative group"><img src="' + e.target.result + '" class="w-24 h-24 rounded-xl object-cover border-2 border-blue-200 shadow-md"><button onclick="clearLogo()" class="absolute -top-2 -right-2 w-6 h-6 bg-red-500 text-white rounded-full opacity-0 group-hover:opacity-100 transition-opacity flex items-center justify-center shadow-lg hover:bg-red-600"><i class="fas fa-times text-xs"></i></button></div>';
|
||||
}
|
||||
}
|
||||
reader.readAsDataURL(input.files[0]);
|
||||
|
||||
uploadLogo(input.files[0]);
|
||||
}
|
||||
}
|
||||
|
||||
function clearLogo() {
|
||||
const preview = document.getElementById('logoPreview');
|
||||
preview.outerHTML = '<div id="logoPreview" class="w-24 h-24 rounded-xl bg-white border-2 border-dashed border-slate-300 flex flex-col items-center justify-center text-slate-400 hover:border-blue-400 hover:text-blue-500 transition-all cursor-pointer" onclick="document.getElementById(\'logoFile\').click()"><i class="fas fa-image text-2xl mb-1"></i><span class="text-xs">点击上传</span></div>';
|
||||
showCustomAlert('success', '成功', '已清除预览,请点击保存设置生效');
|
||||
}
|
||||
|
||||
function setupDropZone() {
|
||||
const dropZone = document.getElementById('logoDropZone');
|
||||
const fileInput = document.getElementById('logoFile');
|
||||
|
||||
dropZone.addEventListener('dragover', function(e) {
|
||||
e.preventDefault();
|
||||
dropZone.classList.add('border-blue-500', 'bg-blue-50');
|
||||
});
|
||||
|
||||
dropZone.addEventListener('dragleave', function(e) {
|
||||
e.preventDefault();
|
||||
dropZone.classList.remove('border-blue-500', 'bg-blue-50');
|
||||
});
|
||||
|
||||
dropZone.addEventListener('drop', function(e) {
|
||||
e.preventDefault();
|
||||
dropZone.classList.remove('border-blue-500', 'bg-blue-50');
|
||||
|
||||
const files = e.dataTransfer.files;
|
||||
if (files.length > 0 && files[0].type.startsWith('image/')) {
|
||||
fileInput.files = files;
|
||||
handleLogoSelect(fileInput);
|
||||
} else {
|
||||
showCustomAlert('error', '错误', '请上传图片文件');
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
function uploadLogo(file) {
|
||||
const formData = new FormData();
|
||||
formData.append('logo', file);
|
||||
|
||||
fetch('/dashboard/api/settings/logo', {
|
||||
method: 'POST',
|
||||
body: formData
|
||||
})
|
||||
.then(response => response.json())
|
||||
.then(result => {
|
||||
const logoPath = result.data && result.data.logo_path;
|
||||
if (result.success && logoPath) {
|
||||
const preview = document.getElementById('logoPreview');
|
||||
if (preview.tagName === 'IMG') {
|
||||
preview.src = logoPath;
|
||||
preview.setAttribute('data-path', logoPath);
|
||||
} else {
|
||||
const img = preview.querySelector('img');
|
||||
if (img) {
|
||||
img.src = logoPath;
|
||||
img.setAttribute('data-path', logoPath);
|
||||
}
|
||||
}
|
||||
showCustomAlert('success', '成功', 'Logo上传成功');
|
||||
} else {
|
||||
showCustomAlert('error', '错误', '上传失败:' + (result.message || '未知错误'));
|
||||
}
|
||||
})
|
||||
.catch(error => {
|
||||
console.error('Error:', error);
|
||||
showCustomAlert('error', '错误', '上传失败');
|
||||
});
|
||||
}
|
||||
|
||||
function saveSettings() {
|
||||
const logoPreview = document.getElementById('logoPreview');
|
||||
let logoPath = '';
|
||||
// 优先读取自定义 data-path 属性(保存的是相对路径),避免浏览器把 src 转为绝对 URL
|
||||
if (logoPreview.tagName === 'IMG') {
|
||||
logoPath = logoPreview.getAttribute('data-path') || '';
|
||||
} else {
|
||||
const img = logoPreview.querySelector('img');
|
||||
if (img) logoPath = img.getAttribute('data-path') || '';
|
||||
}
|
||||
|
||||
const adminPageSize = parseInt(document.getElementById('settingAdminPageSize').value, 10);
|
||||
if (isNaN(adminPageSize) || adminPageSize < 1 || adminPageSize > 100) {
|
||||
showCustomAlert('error', '错误', '后台列表每页数据条数必须在 1-100 之间');
|
||||
return;
|
||||
}
|
||||
|
||||
const data = {
|
||||
website_domain: document.getElementById('settingDomain').value,
|
||||
website_title: document.getElementById('settingTitle').value,
|
||||
website_description: document.getElementById('settingDescription').value,
|
||||
website_keywords: document.getElementById('settingKeywords').value,
|
||||
admin_email: document.getElementById('settingAdminEmail').value,
|
||||
admin_name: document.getElementById('settingAdminName').value,
|
||||
logo_path: logoPath,
|
||||
seo_keywords: document.getElementById('settingSEOKeywords').value,
|
||||
seo_description: document.getElementById('settingSEODescription').value,
|
||||
admin_page_size: adminPageSize || 20
|
||||
};
|
||||
|
||||
fetch('/dashboard/api/settings', {
|
||||
method: 'POST',
|
||||
headers: { 'Content-Type': 'application/json' },
|
||||
body: JSON.stringify(data)
|
||||
})
|
||||
.then(response => response.json())
|
||||
.then(result => {
|
||||
if (result.success) {
|
||||
showCustomAlert('success', '成功', '设置保存成功');
|
||||
setTimeout(() => location.reload(), 1500);
|
||||
} else {
|
||||
showCustomAlert('error', '错误', '保存失败:' + (result.message || '未知错误'));
|
||||
}
|
||||
})
|
||||
.catch(error => {
|
||||
console.error('Error:', error);
|
||||
showCustomAlert('error', '错误', '保存失败');
|
||||
});
|
||||
}
|
||||
|
||||
function loadSystemInfo() {
|
||||
fetch('/dashboard/api/settings/system-info')
|
||||
.then(response => response.json())
|
||||
.then(result => {
|
||||
if (result.success) {
|
||||
const data = result.data;
|
||||
document.getElementById('sysGoVersion').textContent = data.go_version || '-';
|
||||
document.getElementById('sysOS').textContent = data.os || '-';
|
||||
document.getElementById('sysArch').textContent = data.arch || '-';
|
||||
document.getElementById('sysStartTime').textContent = data.start_time || '-';
|
||||
document.getElementById('sysUptime').textContent = data.uptime || '-';
|
||||
}
|
||||
})
|
||||
.catch(error => {
|
||||
console.error('Error loading system info:', error);
|
||||
});
|
||||
}
|
||||
|
||||
function loadLoginHistory() {
|
||||
fetch('/dashboard/api/settings/login-history?page=1&pageSize=5')
|
||||
.then(response => response.json())
|
||||
.then(result => {
|
||||
if (result.success) {
|
||||
const historyList = document.getElementById('loginHistoryList');
|
||||
if (result.data.list.length === 0) {
|
||||
historyList.innerHTML = '<div class="text-center text-slate-400 text-sm py-4">暂无登录记录</div>';
|
||||
return;
|
||||
}
|
||||
|
||||
historyList.innerHTML = '';
|
||||
result.data.list.forEach(item => {
|
||||
const statusIcon = item.success
|
||||
? '<i class="fas fa-check-circle text-green-500"></i>'
|
||||
: '<i class="fas fa-times-circle text-red-500"></i>';
|
||||
const statusText = item.success ? '成功' : '失败';
|
||||
|
||||
const itemDiv = document.createElement('div');
|
||||
itemDiv.className = 'flex items-center justify-between p-3 bg-white rounded-lg border border-slate-100';
|
||||
itemDiv.innerHTML = `
|
||||
<div class="flex items-center gap-2">
|
||||
${statusIcon}
|
||||
<span class="text-sm text-slate-700">${item.user_name || '未知用户'}</span>
|
||||
</div>
|
||||
<div class="text-right">
|
||||
<div class="text-xs text-slate-500">${item.ip}</div>
|
||||
<div class="text-xs text-slate-400">${item.created_at}</div>
|
||||
</div>
|
||||
`;
|
||||
historyList.appendChild(itemDiv);
|
||||
});
|
||||
}
|
||||
})
|
||||
.catch(error => {
|
||||
console.error('Error loading login history:', error);
|
||||
document.getElementById('loginHistoryList').innerHTML = '<div class="text-center text-slate-400 text-sm py-4">加载失败</div>';
|
||||
});
|
||||
}
|
||||
|
||||
setupDropZone();
|
||||
loadSystemInfo();
|
||||
loadLoginHistory();
|
||||
</script>
|
||||
@@ -0,0 +1,278 @@
|
||||
<div class="bg-white rounded-xl shadow-sm border border-slate-200 p-6">
|
||||
<div class="flex items-center justify-between mb-6">
|
||||
<div>
|
||||
<h3 class="font-semibold text-slate-800 flex items-center gap-2">
|
||||
<i class="fas fa-folder-open text-purple-500"></i> {{ if .User }}{{.User.Name}}{{ else }}未知用户{{ end }} 的作品集管理
|
||||
</h3>
|
||||
<p class="text-sm text-slate-500 mt-1">管理用户的作品集项目</p>
|
||||
</div>
|
||||
<div class="flex items-center gap-3">
|
||||
<a href="{{.AdminPath}}/portfolio/add" class="btn btn-primary">
|
||||
<i class="fas fa-plus"></i> 添加项目
|
||||
</a>
|
||||
<a href="{{.AdminPath}}/users" class="btn btn-secondary">
|
||||
<i class="fas fa-arrow-left"></i> 返回列表
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-4">
|
||||
{{ range .PortfolioItems }}
|
||||
<div class="p-4 bg-slate-50 rounded-lg border border-slate-200 hover:border-primary-300 transition-all {{ if .Hidden }}opacity-50{{ end }}">
|
||||
<div class="flex items-start justify-between mb-3">
|
||||
<div class="flex items-center gap-2">
|
||||
<h4 class="font-medium text-slate-800">{{.Name}}</h4>
|
||||
{{ if .Hidden }}
|
||||
<span class="px-2 py-0.5 bg-gray-200 text-gray-600 rounded text-xs">已隐藏</span>
|
||||
{{ end }}
|
||||
{{ if .Password }}
|
||||
<span class="px-2 py-0.5 bg-amber-100 text-amber-700 rounded text-xs"><i class="fas fa-lock"></i></span>
|
||||
{{ end }}
|
||||
</div>
|
||||
<div class="btn-group">
|
||||
<a href="{{$.AdminPath}}/portfolio/{{.ID}}/edit" class="btn btn-warning">
|
||||
<i class="fas fa-edit"></i> 编辑
|
||||
</a>
|
||||
<button onclick="togglePortfolioHidden('{{.ID}}', {{.Hidden}})" class="btn btn-{{ if .Hidden }}success{{ else }}secondary{{ end }}">
|
||||
<i class="fas {{ if .Hidden }}fa-eye{{ else }}fa-eye-slash{{ end }}"></i> {{ if .Hidden }}显示{{ else }}隐藏{{ end }}
|
||||
</button>
|
||||
<button onclick="deletePortfolio('{{.ID}}')" class="btn btn-danger">
|
||||
<i class="fas fa-trash"></i> 删除
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
<p class="text-sm text-slate-600 mb-3">{{.Description}}</p>
|
||||
<div class="flex flex-wrap gap-1 mb-3">
|
||||
{{ range .TechStack }}
|
||||
<span class="px-2 py-0.5 bg-slate-200 text-slate-600 rounded text-xs">{{.}}</span>
|
||||
{{ end }}
|
||||
</div>
|
||||
<div class="flex items-center justify-between text-xs text-slate-500">
|
||||
<span>{{.StartDate}} ~ {{.EndDate}}</span>
|
||||
{{ if .URL }}
|
||||
<a href="{{.URL}}" target="_blank" class="text-primary-600 hover:text-primary-700">
|
||||
<i class="fas fa-external-link-alt"></i> 查看
|
||||
</a>
|
||||
{{ end }}
|
||||
</div>
|
||||
</div>
|
||||
{{ else }}
|
||||
<div class="col-span-full text-center py-12">
|
||||
<div class="w-16 h-16 mx-auto mb-4 rounded-full bg-slate-100 flex items-center justify-center">
|
||||
<i class="fas fa-folder-open text-slate-400 text-2xl"></i>
|
||||
</div>
|
||||
<h4 class="text-lg font-semibold text-slate-700 mb-2">暂无作品集项目</h4>
|
||||
<p class="text-slate-500">该用户还没有添加作品集项目</p>
|
||||
</div>
|
||||
{{ end }}
|
||||
</div>
|
||||
</div>
|
||||
<div class="modal hidden fixed inset-0 bg-black/50 flex items-center justify-center z-50" id="portfolioModal">
|
||||
<div class="modal-content bg-white rounded-xl shadow-xl w-full max-w-lg mx-4">
|
||||
<div class="flex items-center justify-between p-4 border-b border-slate-200">
|
||||
<h3 class="font-semibold text-slate-800" id="portfolioModalTitle">添加项目</h3>
|
||||
<button onclick="closePortfolioModal()" class="btn btn-secondary btn-sm">
|
||||
<i class="fas fa-times"></i>
|
||||
</button>
|
||||
</div>
|
||||
<div class="p-6">
|
||||
<form id="portfolioForm" onsubmit="savePortfolio(event)">
|
||||
<input type="hidden" id="portfolioId">
|
||||
<input type="hidden" id="portfolioUserId" value="{{ with .User }}{{.ID}}{{ end }}">
|
||||
<div class="space-y-4">
|
||||
<div>
|
||||
<label class="block text-sm font-medium text-slate-700 mb-1">项目名称</label>
|
||||
<input type="text" id="portfolioName" class="w-full px-4 py-2 border border-slate-300 rounded-lg focus:ring-2 focus:ring-primary-500 focus:border-primary-500" required>
|
||||
</div>
|
||||
<div>
|
||||
<label class="block text-sm font-medium text-slate-700 mb-1">项目描述</label>
|
||||
<textarea id="portfolioDescription" rows="3" class="w-full px-4 py-2 border border-slate-300 rounded-lg focus:ring-2 focus:ring-primary-500 focus:border-primary-500"></textarea>
|
||||
</div>
|
||||
<div>
|
||||
<label class="block text-sm font-medium text-slate-700 mb-1">技术栈 (每行一个)</label>
|
||||
<textarea id="portfolioTechStack" rows="3" class="w-full px-4 py-2 border border-slate-300 rounded-lg focus:ring-2 focus:ring-primary-500 focus:border-primary-500" placeholder="Go React MySQL"></textarea>
|
||||
</div>
|
||||
<div>
|
||||
<label class="block text-sm font-medium text-slate-700 mb-1">项目链接</label>
|
||||
<input type="url" id="portfolioURL" class="w-full px-4 py-2 border border-slate-300 rounded-lg focus:ring-2 focus:ring-primary-500 focus:border-primary-500">
|
||||
</div>
|
||||
<div class="grid grid-cols-2 gap-4">
|
||||
<div>
|
||||
<label class="block text-sm font-medium text-slate-700 mb-1">开始日期</label>
|
||||
<input type="text" id="portfolioStartDate" class="w-full px-4 py-2 border border-slate-300 rounded-lg focus:ring-2 focus:ring-primary-500 focus:border-primary-500" placeholder="2024-01">
|
||||
</div>
|
||||
<div>
|
||||
<label class="block text-sm font-medium text-slate-700 mb-1">结束日期</label>
|
||||
<input type="text" id="portfolioEndDate" class="w-full px-4 py-2 border border-slate-300 rounded-lg focus:ring-2 focus:ring-primary-500 focus:border-primary-500" placeholder="2024-12">
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<label class="block text-sm font-medium text-slate-700 mb-1">关联简历项目</label>
|
||||
<select id="portfolioProjectID" class="w-full px-4 py-2 border border-slate-300 rounded-lg focus:ring-2 focus:ring-primary-500 focus:border-primary-500">
|
||||
<option value="0">不关联简历项目</option>
|
||||
</select>
|
||||
</div>
|
||||
<div class="flex items-center gap-3">
|
||||
<label class="flex items-center gap-2 cursor-pointer">
|
||||
<input type="checkbox" id="portfolioShowInResume" class="w-4 h-4 text-primary-600 rounded focus:ring-primary-500">
|
||||
<span class="text-sm font-medium text-slate-700">在简历中显示</span>
|
||||
</label>
|
||||
<label class="flex items-center gap-2 cursor-pointer">
|
||||
<input type="checkbox" id="portfolioHidden" class="w-4 h-4 text-primary-600 rounded focus:ring-primary-500">
|
||||
<span class="text-sm font-medium text-slate-700">隐藏项目</span>
|
||||
</label>
|
||||
</div>
|
||||
<div>
|
||||
<label class="block text-sm font-medium text-slate-700 mb-1">访问密码(留空则不设密码)</label>
|
||||
<input type="password" id="portfolioPassword" class="w-full px-4 py-2 border border-slate-300 rounded-lg focus:ring-2 focus:ring-primary-500 focus:border-primary-500" placeholder="输入访问密码">
|
||||
</div>
|
||||
<div>
|
||||
<label class="block text-sm font-medium text-slate-700 mb-1">项目文档 (Markdown格式)</label>
|
||||
<textarea id="portfolioDoc" rows="8" class="w-full px-4 py-2 border border-slate-300 rounded-lg focus:ring-2 focus:ring-primary-500 focus:border-primary-500 font-mono text-sm" placeholder="# 项目概述 这里编写项目详细说明..."></textarea>
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex items-center justify-center gap-3 mt-6">
|
||||
<button type="button" onclick="closePortfolioModal()" class="btn btn-secondary">
|
||||
<i class="fas fa-times"></i> 取消
|
||||
</button>
|
||||
<button type="submit" class="btn btn-primary">
|
||||
<i class="fas fa-save"></i> 保存
|
||||
</button>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<script>
|
||||
function openAddPortfolioModal() {
|
||||
document.getElementById('portfolioModalTitle').textContent = '添加项目';
|
||||
document.getElementById('portfolioId').value = '';
|
||||
document.getElementById('portfolioName').value = '';
|
||||
document.getElementById('portfolioDescription').value = '';
|
||||
document.getElementById('portfolioTechStack').value = '';
|
||||
document.getElementById('portfolioURL').value = '';
|
||||
document.getElementById('portfolioStartDate').value = '';
|
||||
document.getElementById('portfolioEndDate').value = '';
|
||||
document.getElementById('portfolioProjectID').value = '0';
|
||||
document.getElementById('portfolioShowInResume').checked = false;
|
||||
document.getElementById('portfolioHidden').checked = false;
|
||||
document.getElementById('portfolioPassword').value = '';
|
||||
document.getElementById('portfolioDoc').value = '';
|
||||
document.getElementById('portfolioModal').classList.remove('hidden');
|
||||
}
|
||||
|
||||
function closePortfolioModal() {
|
||||
document.getElementById('portfolioModal').classList.add('hidden');
|
||||
}
|
||||
|
||||
function editPortfolio(id) {
|
||||
fetch('/dashboard/api/portfolio/' + id)
|
||||
.then(response => response.json())
|
||||
.then(result => {
|
||||
if (!result.success || !result.data) {
|
||||
showCustomAlert('error', '错误', '获取项目信息失败');
|
||||
return;
|
||||
}
|
||||
const item = result.data;
|
||||
document.getElementById('portfolioModalTitle').textContent = '编辑项目';
|
||||
document.getElementById('portfolioId').value = item.id;
|
||||
document.getElementById('portfolioName').value = item.name;
|
||||
document.getElementById('portfolioDescription').value = item.description || '';
|
||||
document.getElementById('portfolioTechStack').value = (item.tech_stack || []).join('\n');
|
||||
document.getElementById('portfolioURL').value = item.url || '';
|
||||
document.getElementById('portfolioStartDate').value = item.start_date || '';
|
||||
document.getElementById('portfolioEndDate').value = item.end_date || '';
|
||||
document.getElementById('portfolioProjectID').value = item.project_id || '0';
|
||||
document.getElementById('portfolioShowInResume').checked = item.show_in_resume || false;
|
||||
document.getElementById('portfolioHidden').checked = item.hidden || false;
|
||||
document.getElementById('portfolioPassword').value = item.password || '';
|
||||
document.getElementById('portfolioDoc').value = item.doc || '';
|
||||
document.getElementById('portfolioModal').classList.remove('hidden');
|
||||
})
|
||||
.catch(error => {
|
||||
console.error('Error:', error);
|
||||
showCustomAlert('error', '错误', '获取项目信息失败');
|
||||
});
|
||||
}
|
||||
|
||||
function deletePortfolio(id) {
|
||||
showCustomConfirm('确认删除', '确定要删除该项目吗?', function(confirmed) {
|
||||
if (!confirmed) return;
|
||||
fetch('/dashboard/api/portfolio/' + id, { method: 'DELETE' })
|
||||
.then(response => response.json())
|
||||
.then(result => {
|
||||
if (result.success) {
|
||||
location.reload();
|
||||
} else {
|
||||
showCustomAlert('error', '错误', '删除失败:' + (result.message || '未知错误'));
|
||||
}
|
||||
})
|
||||
.catch(error => {
|
||||
console.error('Error:', error);
|
||||
showCustomAlert('error', '错误', '删除失败');
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
function savePortfolio(event) {
|
||||
event.preventDefault();
|
||||
const id = document.getElementById('portfolioId').value;
|
||||
const userId = document.getElementById('portfolioUserId').value;
|
||||
const data = {
|
||||
user_id: userId,
|
||||
name: document.getElementById('portfolioName').value,
|
||||
description: document.getElementById('portfolioDescription').value,
|
||||
tech_stack: document.getElementById('portfolioTechStack').value.split('\n').map(s => s.trim()).filter(s => s),
|
||||
url: document.getElementById('portfolioURL').value,
|
||||
start_date: document.getElementById('portfolioStartDate').value,
|
||||
end_date: document.getElementById('portfolioEndDate').value,
|
||||
project_id: parseInt(document.getElementById('portfolioProjectID').value) || 0,
|
||||
show_in_resume: document.getElementById('portfolioShowInResume').checked,
|
||||
hidden: document.getElementById('portfolioHidden').checked,
|
||||
password: document.getElementById('portfolioPassword').value,
|
||||
doc: document.getElementById('portfolioDoc').value
|
||||
};
|
||||
|
||||
const url = id ? '/dashboard/api/portfolio/' + id : '/dashboard/api/portfolio';
|
||||
const method = id ? 'PUT' : 'POST';
|
||||
|
||||
fetch(url, {
|
||||
method: method,
|
||||
headers: { 'Content-Type': 'application/json' },
|
||||
body: JSON.stringify(data)
|
||||
})
|
||||
.then(response => response.json())
|
||||
.then(result => {
|
||||
if (result.success) {
|
||||
showCustomAlert('success', '成功', '保存成功');
|
||||
closePortfolioModal();
|
||||
setTimeout(() => location.reload(), 1500);
|
||||
} else {
|
||||
showCustomAlert('error', '错误', '保存失败:' + (result.message || '未知错误'));
|
||||
}
|
||||
})
|
||||
.catch(error => {
|
||||
console.error('Error:', error);
|
||||
showCustomAlert('error', '错误', '保存失败');
|
||||
});
|
||||
}
|
||||
|
||||
function togglePortfolioHidden(id, isHidden) {
|
||||
fetch('/dashboard/api/portfolio/' + id, {
|
||||
method: 'PUT',
|
||||
headers: { 'Content-Type': 'application/json' },
|
||||
body: JSON.stringify({ hidden: !isHidden })
|
||||
})
|
||||
.then(response => response.json())
|
||||
.then(result => {
|
||||
if (result.success) {
|
||||
location.reload();
|
||||
} else {
|
||||
showCustomAlert('error', '错误', '操作失败:' + (result.message || '未知错误'));
|
||||
}
|
||||
})
|
||||
.catch(error => {
|
||||
console.error('Error:', error);
|
||||
showCustomAlert('error', '错误', '操作失败');
|
||||
});
|
||||
}
|
||||
</script>
|
||||
@@ -0,0 +1,394 @@
|
||||
<div class="bg-white rounded-xl shadow-sm border border-slate-200 overflow-hidden">
|
||||
<div class="border-b border-slate-200 px-6 py-4 bg-slate-50">
|
||||
<div class="flex items-center justify-between">
|
||||
<div>
|
||||
<h3 class="font-semibold text-slate-800 flex items-center gap-2">
|
||||
<i class="fas fa-question-circle text-orange-500"></i> {{ with .User }}{{.Name}}{{ else }}未知用户{{ end }} 的面试题库
|
||||
</h3>
|
||||
<p class="text-sm text-slate-500 mt-1">管理用户的面试题目和答题记录</p>
|
||||
</div>
|
||||
<div class="flex items-center gap-3">
|
||||
<a href="{{.AdminPath}}/user/{{.User.ID}}/quiz/generate" class="btn btn-primary">
|
||||
<i class="fas fa-robot"></i> AI生成题目
|
||||
</a>
|
||||
<a href="{{.AdminPath}}/quiz" class="btn btn-secondary">
|
||||
<i class="fas fa-arrow-left"></i> 返回列表
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="grid grid-cols-4 gap-4 p-6 border-b border-slate-200 bg-gradient-to-r from-slate-50 to-white">
|
||||
<div class="bg-white rounded-xl p-4 border border-slate-200 shadow-sm">
|
||||
<div class="flex items-center gap-3">
|
||||
<div class="w-12 h-12 rounded-xl bg-blue-100 flex items-center justify-center text-blue-600">
|
||||
<i class="fas fa-list-alt text-xl"></i>
|
||||
</div>
|
||||
<div>
|
||||
<p class="text-2xl font-bold text-slate-800">{{.TotalRecords}}</p>
|
||||
<p class="text-sm text-slate-500">答题记录</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="bg-white rounded-xl p-4 border border-slate-200 shadow-sm">
|
||||
<div class="flex items-center gap-3">
|
||||
<div class="w-12 h-12 rounded-xl bg-green-100 flex items-center justify-center text-green-600">
|
||||
<i class="fas fa-check-circle text-xl"></i>
|
||||
</div>
|
||||
<div>
|
||||
<p class="text-2xl font-bold text-slate-800">{{.FavoriteCount}}</p>
|
||||
<p class="text-sm text-slate-500">收藏题目</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="bg-white rounded-xl p-4 border border-slate-200 shadow-sm">
|
||||
<div class="flex items-center gap-3">
|
||||
<div class="w-12 h-12 rounded-xl bg-red-100 flex items-center justify-center text-red-600">
|
||||
<i class="fas fa-times-circle text-xl"></i>
|
||||
</div>
|
||||
<div>
|
||||
<p class="text-2xl font-bold text-slate-800">{{.WrongCount}}</p>
|
||||
<p class="text-sm text-slate-500">错题数量</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="bg-white rounded-xl p-4 border border-slate-200 shadow-sm">
|
||||
<div class="flex items-center gap-3">
|
||||
<div class="w-12 h-12 rounded-xl bg-purple-100 flex items-center justify-center text-purple-600">
|
||||
<i class="fas fa-percentage text-xl"></i>
|
||||
</div>
|
||||
<div>
|
||||
<p class="text-2xl font-bold text-slate-800">{{.AvgScore}}%</p>
|
||||
<p class="text-sm text-slate-500">平均正确率</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="border-b border-slate-200">
|
||||
<div class="flex">
|
||||
<button onclick="switchTab('records')" id="tab-records" class="tab-btn active px-6 py-4 text-sm font-medium border-b-2 border-transparent transition-colors">
|
||||
<i class="fas fa-list-alt mr-2"></i>答题记录
|
||||
</button>
|
||||
<button onclick="switchTab('favorites')" id="tab-favorites" class="tab-btn px-6 py-4 text-sm font-medium border-b-2 border-transparent transition-colors">
|
||||
<i class="fas fa-star mr-2"></i>收藏题目
|
||||
</button>
|
||||
<button onclick="switchTab('wrong')" id="tab-wrong" class="tab-btn px-6 py-4 text-sm font-medium border-b-2 border-transparent transition-colors">
|
||||
<i class="fas fa-times-circle mr-2"></i>错题本
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="p-6">
|
||||
<div id="panel-records" class="tab-panel">
|
||||
<div class="space-y-3">
|
||||
{{ range .QuizRecords }}
|
||||
<a href="{{$.AdminPath}}/user/{{$.User.ID}}/quiz/record/{{.ID}}" class="block bg-slate-50 p-4 rounded-lg border border-slate-200 hover:border-primary-300 hover:shadow-sm transition-all group">
|
||||
<div class="flex items-center justify-between">
|
||||
<div class="flex items-center gap-3">
|
||||
<div class="w-10 h-10 rounded-lg bg-white border border-slate-200 flex items-center justify-center text-slate-500 group-hover:text-primary-500 transition-colors">
|
||||
<i class="fas fa-file-alt"></i>
|
||||
</div>
|
||||
<div>
|
||||
<h4 class="font-medium text-slate-800">{{ if .Title }}{{.Title}}{{ else }}答题记录{{ end }}</h4>
|
||||
<p class="text-xs text-slate-500 mt-0.5">{{.CreatedAt}} · {{.TotalCount}} 道题</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex items-center gap-4">
|
||||
<div class="text-right">
|
||||
<div class="flex items-center gap-2">
|
||||
<span class="text-2xl font-bold {{ if ge .Score 60.0 }}text-green-600{{ else }}text-red-600{{ end }}">{{.Score}}</span>
|
||||
<span class="text-sm text-slate-400">分</span>
|
||||
</div>
|
||||
<p class="text-xs text-slate-500">{{.CorrectCount}}/{{.TotalCount}} 正确</p>
|
||||
</div>
|
||||
<div class="text-slate-400 group-hover:text-primary-500 transition-colors">
|
||||
<i class="fas fa-chevron-right"></i>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
{{ else }}
|
||||
<div class="empty-state">
|
||||
<div class="empty-state-icon">
|
||||
<i class="fas fa-file-alt"></i>
|
||||
</div>
|
||||
<p>暂无答题记录</p>
|
||||
</div>
|
||||
{{ end }}
|
||||
</div>
|
||||
{{ if gt .TotalPages 1 }}
|
||||
<div class="border-t border-slate-200 mt-6 pt-4 flex items-center justify-between">
|
||||
<div class="text-sm text-slate-500">共 {{ .TotalRecords }} 条记录,第 {{ .CurrentPage }} / {{ .TotalPages }} 页</div>
|
||||
<div class="flex items-center gap-2">
|
||||
<a href="?page=1&tab=records" class="btn btn-sm btn-slate {{ if eq .CurrentPage 1 }}opacity-50 cursor-not-allowed{{ end }}" {{ if eq .CurrentPage 1 }}onclick="return false"{{ end }}>
|
||||
<i class="fas fa-chevron-left"></i><i class="fas fa-chevron-left"></i>
|
||||
</a>
|
||||
<a href="?page={{ if eq .CurrentPage 1 }}1{{ else }}{{ subtract .CurrentPage 1 }}{{ end }}&tab=records" class="btn btn-sm btn-slate {{ if eq .CurrentPage 1 }}opacity-50 cursor-not-allowed{{ end }}" {{ if eq .CurrentPage 1 }}onclick="return false"{{ end }}>
|
||||
<i class="fas fa-chevron-left"></i>
|
||||
</a>
|
||||
{{ range $i := to 1 $.TotalPages }}
|
||||
{{ if or (eq $i 1) (eq $i $.TotalPages) (and (ge $i (subtract $.CurrentPage 2)) (le $i (add $.CurrentPage 2))) }}
|
||||
<a href="?page={{ $i }}&tab=records" class="btn btn-sm {{ if eq $i $.CurrentPage }}btn-primary{{ else }}btn-slate{{ end }}">{{ $i }}</a>
|
||||
{{ else if and (eq $i 2) (gt (subtract $.CurrentPage 3) 1) }}
|
||||
<span class="text-slate-400 px-2">...</span>
|
||||
{{ else if and (eq $i (subtract $.TotalPages 1)) (lt (add $.CurrentPage 3) $.TotalPages) }}
|
||||
<span class="text-slate-400 px-2">...</span>
|
||||
{{ end }}
|
||||
{{ end }}
|
||||
<a href="?page={{ if eq .CurrentPage .TotalPages }}{{ .TotalPages }}{{ else }}{{ add .CurrentPage 1 }}{{ end }}&tab=records" class="btn btn-sm btn-slate {{ if eq .CurrentPage .TotalPages }}opacity-50 cursor-not-allowed{{ end }}" {{ if eq .CurrentPage .TotalPages }}onclick="return false"{{ end }}>
|
||||
<i class="fas fa-chevron-right"></i>
|
||||
</a>
|
||||
<a href="?page={{ .TotalPages }}&tab=records" class="btn btn-sm btn-slate {{ if eq .CurrentPage .TotalPages }}opacity-50 cursor-not-allowed{{ end }}" {{ if eq .CurrentPage .TotalPages }}onclick="return false"{{ end }}>
|
||||
<i class="fas fa-chevron-right"></i><i class="fas fa-chevron-right"></i>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
{{ end }}
|
||||
</div>
|
||||
|
||||
<div id="panel-favorites" class="tab-panel hidden">
|
||||
<div class="space-y-3">
|
||||
{{ range .FavoriteQuestions }}
|
||||
{{ if .IsFavorite }}
|
||||
<div class="bg-yellow-50 p-4 rounded-lg border border-yellow-200">
|
||||
<div class="flex items-start justify-between mb-2">
|
||||
<div class="flex flex-wrap items-center gap-2">
|
||||
<button onclick="toggleFavorite('{{.ID}}')" class="text-yellow-500 hover:text-yellow-600 text-lg" title="取消收藏">
|
||||
<i class="fas fa-star"></i>
|
||||
</button>
|
||||
{{ if not .IsCorrect }}
|
||||
<span class="px-2 py-0.5 bg-red-100 text-red-600 rounded text-xs">错题</span>
|
||||
{{ end }}
|
||||
{{ if .Question.Type }}
|
||||
<span class="px-2 py-0.5 rounded text-xs"
|
||||
{{ if eq .Question.Type "mcq" }}style="background-color: #dbeafe; color: #1e40af;"{{ end }}
|
||||
{{ if eq .Question.Type "fill" }}style="background-color: #ede9fe; color: #5b21b6;"{{ end }}
|
||||
{{ if eq .Question.Type "sa" }}style="background-color: #dcfce7; color: #166534;"{{ end }}
|
||||
{{ if eq .Question.Type "algo" }}style="background-color: #ffedd5; color: #c2410c;"{{ end }}>
|
||||
{{ if eq .Question.Type "mcq" }}选择题{{ else if eq .Question.Type "fill" }}填空题{{ else if eq .Question.Type "sa" }}简答题{{ else if eq .Question.Type "algo" }}算法题{{ else }}{{.Question.Type}}{{ end }}
|
||||
</span>
|
||||
{{ end }}
|
||||
{{ if .Question.Difficulty }}
|
||||
<span class="px-2 py-0.5 rounded text-xs"
|
||||
{{ if eq .Question.Difficulty "入门" }}style="background-color: #dcfce7; color: #166534;"{{ end }}
|
||||
{{ if eq .Question.Difficulty "初级" }}style="background-color: #dbeafe; color: #1e40af;"{{ end }}
|
||||
{{ if eq .Question.Difficulty "中级" }}style="background-color: #fef3c7; color: #92400e;"{{ end }}
|
||||
{{ if eq .Question.Difficulty "进阶" }}style="background-color: #ffedd5; color: #c2410c;"{{ end }}
|
||||
{{ if eq .Question.Difficulty "高级" }}style="background-color: #fee2e2; color: #991b1b;"{{ end }}>
|
||||
{{.Question.Difficulty}}
|
||||
</span>
|
||||
{{ end }}
|
||||
{{ if .Question.Category }}
|
||||
<span class="px-2 py-0.5 bg-indigo-100 text-indigo-600 rounded text-xs">{{.Question.Category}}</span>
|
||||
{{ end }}
|
||||
<span class="px-2 py-0.5 bg-slate-100 text-slate-600 rounded text-xs">{{.Question.Score}}分</span>
|
||||
</div>
|
||||
<button onclick="deleteFavorite('{{.ID}}')" class="btn btn-danger btn-xs" title="删除">
|
||||
<i class="fas fa-trash"></i>
|
||||
</button>
|
||||
</div>
|
||||
<p class="text-sm text-slate-800 mb-3 font-medium leading-relaxed">{{.Question.Text}}</p>
|
||||
{{ if .Question.Options }}
|
||||
<div class="bg-white p-3 rounded-lg mb-3 space-y-2">
|
||||
{{ range $i, $opt := .Question.Options }}
|
||||
<div class="flex items-start gap-2 text-sm">
|
||||
<span class="w-5 h-5 rounded-full bg-slate-100 flex items-center justify-center text-xs text-slate-600 font-medium flex-shrink-0">{{index "ABCDE" $i}}</span>
|
||||
<span class="text-slate-600">{{$opt}}</span>
|
||||
</div>
|
||||
{{ end }}
|
||||
</div>
|
||||
{{ end }}
|
||||
<div class="flex flex-wrap items-center gap-4 mb-3">
|
||||
<div class="flex items-center gap-1">
|
||||
<span class="text-xs text-slate-500">正确答案:</span>
|
||||
<span class="text-sm text-green-600 font-medium">{{.Question.Answer}}</span>
|
||||
</div>
|
||||
{{ if .UserAnswer }}
|
||||
<div class="flex items-center gap-1">
|
||||
<span class="text-xs text-slate-500">你的答案:</span>
|
||||
<span class="text-sm {{ if .IsCorrect }}text-green-600{{ else }}text-red-600{{ end }}">{{.UserAnswer}}</span>
|
||||
</div>
|
||||
{{ end }}
|
||||
</div>
|
||||
{{ if .Question.Analysis }}
|
||||
<div class="p-3 bg-white rounded-lg text-sm text-slate-600 border border-yellow-100">
|
||||
<div class="font-medium text-slate-700 mb-1 flex items-center gap-1">
|
||||
<i class="fas fa-lightbulb text-yellow-500"></i> 答案解析
|
||||
</div>
|
||||
<div class="markdown-content">{{.Question.Analysis}}</div>
|
||||
</div>
|
||||
{{ end }}
|
||||
</div>
|
||||
{{ end }}
|
||||
{{ else }}
|
||||
<div class="empty-state">
|
||||
<div class="empty-state-icon">
|
||||
<i class="fas fa-star"></i>
|
||||
</div>
|
||||
<p>暂无收藏题目</p>
|
||||
</div>
|
||||
{{ end }}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="panel-wrong" class="tab-panel hidden">
|
||||
<div class="space-y-3">
|
||||
{{ range .FavoriteQuestions }}
|
||||
{{ if not .IsCorrect }}
|
||||
<div class="bg-red-50 p-4 rounded-lg border border-red-200">
|
||||
<div class="flex items-start justify-between mb-2">
|
||||
<div class="flex flex-wrap items-center gap-2">
|
||||
<button onclick="toggleFavorite('{{.ID}}')" class="{{ if .IsFavorite }}text-yellow-500{{ else }}text-slate-300{{ end }} hover:text-yellow-600 text-lg" title="{{ if .IsFavorite }}取消收藏{{ else }}收藏{{ end }}">
|
||||
<i class="{{ if .IsFavorite }}fas fa-star{{ else }}far fa-star{{ end }}"></i>
|
||||
</button>
|
||||
<span class="px-2 py-0.5 bg-red-100 text-red-600 rounded text-xs">错题</span>
|
||||
{{ if .IsFavorite }}
|
||||
<span class="px-2 py-0.5 bg-yellow-100 text-yellow-600 rounded text-xs">收藏</span>
|
||||
{{ end }}
|
||||
{{ if .Question.Type }}
|
||||
<span class="px-2 py-0.5 rounded text-xs"
|
||||
{{ if eq .Question.Type "mcq" }}style="background-color: #dbeafe; color: #1e40af;"{{ end }}
|
||||
{{ if eq .Question.Type "fill" }}style="background-color: #ede9fe; color: #5b21b6;"{{ end }}
|
||||
{{ if eq .Question.Type "sa" }}style="background-color: #dcfce7; color: #166534;"{{ end }}
|
||||
{{ if eq .Question.Type "algo" }}style="background-color: #ffedd5; color: #c2410c;"{{ end }}>
|
||||
{{ if eq .Question.Type "mcq" }}选择题{{ else if eq .Question.Type "fill" }}填空题{{ else if eq .Question.Type "sa" }}简答题{{ else if eq .Question.Type "algo" }}算法题{{ else }}{{.Question.Type}}{{ end }}
|
||||
</span>
|
||||
{{ end }}
|
||||
{{ if .Question.Difficulty }}
|
||||
<span class="px-2 py-0.5 rounded text-xs"
|
||||
{{ if eq .Question.Difficulty "入门" }}style="background-color: #dcfce7; color: #166534;"{{ end }}
|
||||
{{ if eq .Question.Difficulty "初级" }}style="background-color: #dbeafe; color: #1e40af;"{{ end }}
|
||||
{{ if eq .Question.Difficulty "中级" }}style="background-color: #fef3c7; color: #92400e;"{{ end }}
|
||||
{{ if eq .Question.Difficulty "进阶" }}style="background-color: #ffedd5; color: #c2410c;"{{ end }}
|
||||
{{ if eq .Question.Difficulty "高级" }}style="background-color: #fee2e2; color: #991b1b;"{{ end }}>
|
||||
{{.Question.Difficulty}}
|
||||
</span>
|
||||
{{ end }}
|
||||
{{ if .Question.Category }}
|
||||
<span class="px-2 py-0.5 bg-indigo-100 text-indigo-600 rounded text-xs">{{.Question.Category}}</span>
|
||||
{{ end }}
|
||||
<span class="px-2 py-0.5 bg-slate-100 text-slate-600 rounded text-xs">{{.Question.Score}}分</span>
|
||||
</div>
|
||||
<button onclick="deleteFavorite('{{.ID}}')" class="btn btn-danger btn-xs" title="删除">
|
||||
<i class="fas fa-trash"></i>
|
||||
</button>
|
||||
</div>
|
||||
<p class="text-sm text-slate-800 mb-3 font-medium leading-relaxed">{{.Question.Text}}</p>
|
||||
{{ if .Question.Options }}
|
||||
<div class="bg-white p-3 rounded-lg mb-3 space-y-2">
|
||||
{{ range $i, $opt := .Question.Options }}
|
||||
<div class="flex items-start gap-2 text-sm">
|
||||
<span class="w-5 h-5 rounded-full bg-slate-100 flex items-center justify-center text-xs text-slate-600 font-medium flex-shrink-0">{{index "ABCDE" $i}}</span>
|
||||
<span class="text-slate-600">{{$opt}}</span>
|
||||
</div>
|
||||
{{ end }}
|
||||
</div>
|
||||
{{ end }}
|
||||
<div class="flex flex-wrap items-center gap-4 mb-3">
|
||||
<div class="flex items-center gap-1">
|
||||
<span class="text-xs text-slate-500">正确答案:</span>
|
||||
<span class="text-sm text-green-600 font-medium">{{.Question.Answer}}</span>
|
||||
</div>
|
||||
{{ if .UserAnswer }}
|
||||
<div class="flex items-center gap-1">
|
||||
<span class="text-xs text-slate-500">你的答案:</span>
|
||||
<span class="text-sm text-red-600">{{.UserAnswer}}</span>
|
||||
</div>
|
||||
{{ end }}
|
||||
</div>
|
||||
{{ if .Question.Analysis }}
|
||||
<div class="p-3 bg-white rounded-lg text-sm text-slate-600 border border-red-100">
|
||||
<div class="font-medium text-slate-700 mb-1 flex items-center gap-1">
|
||||
<i class="fas fa-lightbulb text-yellow-500"></i> 答案解析
|
||||
</div>
|
||||
<div class="markdown-content">{{.Question.Analysis}}</div>
|
||||
</div>
|
||||
{{ end }}
|
||||
</div>
|
||||
{{ end }}
|
||||
{{ else }}
|
||||
<div class="empty-state">
|
||||
<div class="empty-state-icon">
|
||||
<i class="fas fa-times-circle"></i>
|
||||
</div>
|
||||
<p>暂无错题记录</p>
|
||||
</div>
|
||||
{{ end }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<style>
|
||||
.tab-btn {
|
||||
color: #64748b;
|
||||
border-bottom-color: transparent;
|
||||
cursor: pointer;
|
||||
background: none;
|
||||
outline: none;
|
||||
}
|
||||
.tab-btn:hover {
|
||||
color: #334155;
|
||||
}
|
||||
.tab-btn.active {
|
||||
color: var(--primary, #3b82f6);
|
||||
border-bottom-color: var(--primary, #3b82f6);
|
||||
}
|
||||
.tab-panel {
|
||||
animation: fadeIn 0.2s ease;
|
||||
}
|
||||
@keyframes fadeIn {
|
||||
from { opacity: 0; transform: translateY(0.25rem); }
|
||||
to { opacity: 1; transform: translateY(0); }
|
||||
}
|
||||
</style>
|
||||
|
||||
<script>
|
||||
function switchTab(tabName) {
|
||||
document.querySelectorAll('.tab-btn').forEach(btn => btn.classList.remove('active'));
|
||||
document.querySelectorAll('.tab-panel').forEach(panel => panel.classList.add('hidden'));
|
||||
|
||||
document.getElementById('tab-' + tabName).classList.add('active');
|
||||
document.getElementById('panel-' + tabName).classList.remove('hidden');
|
||||
|
||||
const url = new URL(window.location);
|
||||
url.searchParams.set('tab', tabName);
|
||||
window.history.replaceState({}, '', url);
|
||||
}
|
||||
|
||||
document.addEventListener('DOMContentLoaded', function() {
|
||||
const urlParams = new URLSearchParams(window.location.search);
|
||||
const tab = urlParams.get('tab') || 'records';
|
||||
switchTab(tab);
|
||||
});
|
||||
|
||||
function toggleFavorite(id) {
|
||||
fetch('/dashboard/api/quiz/favorite/' + id + '/toggle', { method: 'POST' })
|
||||
.then(response => response.json())
|
||||
.then(result => {
|
||||
if (result.success) {
|
||||
location.reload();
|
||||
} else {
|
||||
showCustomAlert('error', '错误', '操作失败');
|
||||
}
|
||||
})
|
||||
.catch(() => showCustomAlert('error', '错误', '操作失败'));
|
||||
}
|
||||
|
||||
function deleteFavorite(id) {
|
||||
showCustomConfirm('确认删除', '确定要删除这条记录吗?', function(confirmed) {
|
||||
if (!confirmed) return;
|
||||
fetch('/dashboard/api/quiz/favorite/' + id, { method: 'DELETE' })
|
||||
.then(response => response.json())
|
||||
.then(result => {
|
||||
if (result.success) {
|
||||
location.reload();
|
||||
} else {
|
||||
showCustomAlert('error', '错误', '删除失败');
|
||||
}
|
||||
})
|
||||
.catch(() => showCustomAlert('error', '错误', '删除失败'));
|
||||
});
|
||||
}
|
||||
</script>
|
||||
@@ -0,0 +1,421 @@
|
||||
<div class="bg-white rounded-2xl shadow-lg border border-slate-100 p-6">
|
||||
<div class="flex items-center justify-between mb-6">
|
||||
<div>
|
||||
<h3 class="font-bold text-slate-800 flex items-center gap-3">
|
||||
<i class="fas fa-file-alt text-blue-500"></i> {{ if .User }}{{.User.Name}}{{ else }}未知用户{{ end }} 的简历管理
|
||||
</h3>
|
||||
<p class="text-sm text-slate-500 mt-1">管理用户的简历信息和内容</p>
|
||||
</div>
|
||||
<div class="flex items-center gap-3">
|
||||
<a href="{{.AdminPath}}/user/{{.User.ID}}/resume/new/edit" class="btn btn-primary">
|
||||
<i class="fas fa-plus"></i> 创建简历
|
||||
</a>
|
||||
<a href="{{.AdminPath}}/users" class="btn btn-secondary">
|
||||
<i class="fas fa-arrow-left"></i> 返回列表
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="overflow-x-auto">
|
||||
<table class="w-full">
|
||||
<thead>
|
||||
<tr class="bg-slate-50 border-b border-slate-200">
|
||||
<th class="text-left px-6 py-4 text-sm font-semibold text-slate-600">姓名</th>
|
||||
<th class="text-left px-6 py-4 text-sm font-semibold text-slate-600">职位</th>
|
||||
<th class="text-left px-6 py-4 text-sm font-semibold text-slate-600">访问路由</th>
|
||||
<th class="text-left px-6 py-4 text-sm font-semibold text-slate-600">首页展示</th>
|
||||
<th class="text-left px-6 py-4 text-sm font-semibold text-slate-600">密码保护</th>
|
||||
<th class="text-left px-6 py-4 text-sm font-semibold text-slate-600">创建时间</th>
|
||||
<th class="text-left px-6 py-4 text-sm font-semibold text-slate-600">操作</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
{{ range .Resumes }}
|
||||
<tr class="border-b border-slate-100 hover:bg-slate-50 transition-colors">
|
||||
<td class="px-6 py-4">
|
||||
<span class="font-medium text-slate-800">{{.BasicInfo.Name}}</span>
|
||||
</td>
|
||||
<td class="px-6 py-4 text-slate-600">{{.BasicInfo.Title}}</td>
|
||||
<td class="px-6 py-4 text-slate-600">
|
||||
<a href="/{{.Route}}" target="_blank" class="text-blue-500 hover:text-blue-700 hover:underline">
|
||||
/{{.Route}}
|
||||
</a>
|
||||
</td>
|
||||
<td class="px-6 py-4">
|
||||
<span class="inline-flex items-center px-3 py-1 rounded-full text-xs font-medium {{ if .ShowInHome }}bg-green-100 text-green-700{{ else }}bg-slate-100 text-slate-500{{ end }}">
|
||||
{{ if .ShowInHome }}<i class="fas fa-check mr-1"></i>展示{{ else }}隐藏{{ end }}
|
||||
</span>
|
||||
</td>
|
||||
<td class="px-6 py-4">
|
||||
{{ if .Password }}
|
||||
<span class="inline-flex items-center px-3 py-1 rounded-full text-xs font-medium bg-amber-100 text-amber-700">
|
||||
<i class="fas fa-lock mr-1"></i>已设置
|
||||
</span>
|
||||
{{ else }}
|
||||
<span class="inline-flex items-center px-3 py-1 rounded-full text-xs font-medium bg-slate-100 text-slate-500">
|
||||
<i class="fas fa-unlock mr-1"></i>无密码
|
||||
</span>
|
||||
{{ end }}
|
||||
</td>
|
||||
<td class="px-6 py-4 text-slate-500 text-sm">{{.CreatedAt}}</td>
|
||||
<td class="px-6 py-4">
|
||||
<div class="btn-group">
|
||||
<a href="/{{.Route}}" target="_blank" class="btn btn-primary btn-xs">
|
||||
<i class="fas fa-eye"></i> 预览
|
||||
</a>
|
||||
<a href="{{$.AdminPath}}/user/{{$.User.ID}}/resume/{{.ID}}/edit" class="btn btn-warning btn-xs">
|
||||
<i class="fas fa-edit"></i> 编辑
|
||||
</a>
|
||||
<button onclick="toggleShowInHome('{{.ID}}', {{.ShowInHome}})" class="btn btn-success btn-xs">
|
||||
<i class="fas {{ if .ShowInHome }}fa-eye-slash{{ else }}fa-eye{{ end }}"></i> {{ if .ShowInHome }}隐藏{{ else }}展示{{ end }}
|
||||
</button>
|
||||
<button onclick="setPassword('{{.ID}}')" class="btn btn-info btn-xs">
|
||||
<i class="fas fa-key"></i> 密码
|
||||
</button>
|
||||
<button onclick="deleteResume('{{.ID}}')" class="btn btn-danger btn-xs">
|
||||
<i class="fas fa-trash"></i> 删除
|
||||
</button>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
{{ else }}
|
||||
<tr>
|
||||
<td colspan="8" class="px-6 py-12 text-center text-slate-500">
|
||||
<div class="w-16 h-16 mx-auto mb-4 rounded-full bg-slate-100 flex items-center justify-center">
|
||||
<i class="fas fa-file-alt text-slate-400 text-2xl"></i>
|
||||
</div>
|
||||
<p>暂无简历数据</p>
|
||||
</td>
|
||||
</tr>
|
||||
{{ end }}
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="modal hidden fixed inset-0 bg-black/50 flex items-center justify-center z-50" id="resumeModal">
|
||||
<div class="modal-content bg-white rounded-xl shadow-xl w-full max-w-lg mx-4">
|
||||
<div class="flex items-center justify-between p-5 border-b border-slate-200">
|
||||
<h3 class="font-semibold text-slate-800 flex items-center gap-2" id="resumeModalTitle">
|
||||
<i class="fas fa-file-alt text-blue-500"></i> 新建简历
|
||||
</h3>
|
||||
<button onclick="closeResumeModal()" class="text-slate-400 hover:text-slate-600 p-1 hover:bg-slate-100 rounded-lg transition-all">
|
||||
<i class="fas fa-times"></i>
|
||||
</button>
|
||||
</div>
|
||||
<div class="p-5">
|
||||
<form id="resumeForm" onsubmit="saveResume(event)">
|
||||
<input type="hidden" id="resumeId">
|
||||
<input type="hidden" id="resumeUserId">
|
||||
<div class="space-y-4">
|
||||
<div>
|
||||
<label class="block text-sm font-medium text-slate-700 mb-1.5">访问路由</label>
|
||||
<div class="relative">
|
||||
<div class="absolute left-3 top-1/2 transform -translate-y-1/2 text-slate-400">
|
||||
<i class="fas fa-link"></i>
|
||||
</div>
|
||||
<input type="text" id="resumeRoute" class="w-full pl-10 pr-4 py-2.5 border border-slate-200 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500 transition-all" required>
|
||||
</div>
|
||||
<p class="text-xs text-slate-500 mt-1">用于访问简历的路径,如 zhangsan,访问地址为 /zhangsan</p>
|
||||
</div>
|
||||
<div>
|
||||
<label class="block text-sm font-medium text-slate-700 mb-1.5">姓名</label>
|
||||
<div class="relative">
|
||||
<div class="absolute left-3 top-1/2 transform -translate-y-1/2 text-slate-400">
|
||||
<i class="fas fa-user"></i>
|
||||
</div>
|
||||
<input type="text" id="resumeName" class="w-full pl-10 pr-4 py-2.5 border border-slate-200 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500 transition-all" required>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<label class="block text-sm font-medium text-slate-700 mb-1.5">职位</label>
|
||||
<div class="relative">
|
||||
<div class="absolute left-3 top-1/2 transform -translate-y-1/2 text-slate-400">
|
||||
<i class="fas fa-briefcase"></i>
|
||||
</div>
|
||||
<input type="text" id="resumeTitle" class="w-full pl-10 pr-4 py-2.5 border border-slate-200 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500 transition-all">
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<label class="block text-sm font-medium text-slate-700 mb-1.5">邮箱</label>
|
||||
<div class="relative">
|
||||
<div class="absolute left-3 top-1/2 transform -translate-y-1/2 text-slate-400">
|
||||
<i class="fas fa-envelope"></i>
|
||||
</div>
|
||||
<input type="email" id="resumeEmail" class="w-full pl-10 pr-4 py-2.5 border border-slate-200 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500 transition-all">
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<label class="block text-sm font-medium text-slate-700 mb-1.5">手机号</label>
|
||||
<div class="relative">
|
||||
<div class="absolute left-3 top-1/2 transform -translate-y-1/2 text-slate-400">
|
||||
<i class="fas fa-phone"></i>
|
||||
</div>
|
||||
<input type="tel" id="resumePhone" class="w-full pl-10 pr-4 py-2.5 border border-slate-200 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500 transition-all">
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<label class="block text-sm font-medium text-slate-700 mb-1.5">所在地</label>
|
||||
<div class="relative">
|
||||
<div class="absolute left-3 top-1/2 transform -translate-y-1/2 text-slate-400">
|
||||
<i class="fas fa-map-marker-alt"></i>
|
||||
</div>
|
||||
<input type="text" id="resumeLocation" class="w-full pl-10 pr-4 py-2.5 border border-slate-200 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500 transition-all">
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<label class="flex items-center gap-2 cursor-pointer">
|
||||
<input type="checkbox" id="resumeShowInHome" class="w-4 h-4 text-blue-600 rounded focus:ring-blue-500">
|
||||
<span class="text-sm font-medium text-slate-700">在首页展示</span>
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex items-center justify-center gap-3 mt-6">
|
||||
<button type="button" onclick="closeResumeModal()" class="btn btn-secondary">
|
||||
<i class="fas fa-times"></i> 取消
|
||||
</button>
|
||||
<button type="submit" class="btn btn-primary">
|
||||
<i class="fas fa-save"></i> 保存
|
||||
</button>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="modal hidden fixed inset-0 bg-black/50 flex items-center justify-center z-50" id="passwordModal">
|
||||
<div class="modal-content bg-white rounded-xl shadow-xl w-full max-w-md mx-4">
|
||||
<div class="flex items-center justify-between p-5 border-b border-slate-200">
|
||||
<h3 class="font-semibold text-slate-800 flex items-center gap-2">
|
||||
<i class="fas fa-key text-purple-500"></i> 设置访问密码
|
||||
</h3>
|
||||
<button onclick="closePasswordModal()" class="text-slate-400 hover:text-slate-600 p-1 hover:bg-slate-100 rounded-lg transition-all">
|
||||
<i class="fas fa-times"></i>
|
||||
</button>
|
||||
</div>
|
||||
<div class="p-5">
|
||||
<form id="passwordForm" onsubmit="savePassword(event)">
|
||||
<input type="hidden" id="passwordResumeId">
|
||||
<div class="space-y-4">
|
||||
<div>
|
||||
<label class="block text-sm font-medium text-slate-700 mb-1.5">访问密码</label>
|
||||
<div class="relative">
|
||||
<div class="absolute left-3 top-1/2 transform -translate-y-1/2 text-slate-400">
|
||||
<i class="fas fa-lock"></i>
|
||||
</div>
|
||||
<input type="password" id="resumePassword" class="w-full pl-10 pr-4 py-2.5 border border-slate-200 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500 transition-all" placeholder="输入密码,留空则取消密码保护">
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<label class="block text-sm font-medium text-slate-700 mb-1.5">确认密码</label>
|
||||
<div class="relative">
|
||||
<div class="absolute left-3 top-1/2 transform -translate-y-1/2 text-slate-400">
|
||||
<i class="fas fa-lock"></i>
|
||||
</div>
|
||||
<input type="password" id="resumePasswordConfirm" class="w-full pl-10 pr-4 py-2.5 border border-slate-200 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500 transition-all" placeholder="再次输入密码">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex items-center justify-center gap-3 mt-6">
|
||||
<button type="button" onclick="closePasswordModal()" class="btn btn-secondary">
|
||||
<i class="fas fa-times"></i> 取消
|
||||
</button>
|
||||
<button type="submit" class="btn btn-primary">
|
||||
<i class="fas fa-save"></i> 保存
|
||||
</button>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
function getUserId() {
|
||||
const pathParts = window.location.pathname.split('/');
|
||||
return pathParts[pathParts.indexOf('user') + 1];
|
||||
}
|
||||
|
||||
function openAddResumeModal() {
|
||||
const userId = getUserId();
|
||||
if (!userId) {
|
||||
showCustomAlert('error', '错误', '用户ID无效');
|
||||
return;
|
||||
}
|
||||
|
||||
fetch('/dashboard/api/user/' + userId)
|
||||
.then(response => response.json())
|
||||
.then(user => {
|
||||
document.getElementById('resumeModalTitle').innerHTML = '<i class="fas fa-file-alt text-blue-500"></i> 新建简历';
|
||||
document.getElementById('resumeId').value = '';
|
||||
document.getElementById('resumeUserId').value = userId;
|
||||
document.getElementById('resumeRoute').value = user.username || 'resume-' + userId.substring(0, 8);
|
||||
document.getElementById('resumeName').value = user.name || '';
|
||||
document.getElementById('resumeTitle').value = '';
|
||||
document.getElementById('resumeEmail').value = user.email || '';
|
||||
document.getElementById('resumePhone').value = user.phone || '';
|
||||
document.getElementById('resumeLocation').value = '';
|
||||
document.getElementById('resumeShowInHome').checked = true;
|
||||
document.getElementById('resumeModal').classList.remove('hidden');
|
||||
})
|
||||
.catch(error => {
|
||||
showCustomAlert('error', '错误', '获取用户信息失败');
|
||||
});
|
||||
}
|
||||
|
||||
function closeResumeModal() {
|
||||
document.getElementById('resumeModal').classList.add('hidden');
|
||||
}
|
||||
|
||||
function editResume(id) {
|
||||
fetch('/dashboard/api/resume/' + id)
|
||||
.then(response => response.json())
|
||||
.then(resume => {
|
||||
document.getElementById('resumeModalTitle').innerHTML = '<i class="fas fa-file-edit text-yellow-500"></i> 编辑简历';
|
||||
document.getElementById('resumeId').value = resume.id || resume.ID || '';
|
||||
document.getElementById('resumeUserId').value = resume.user_id || resume.UserID || '';
|
||||
document.getElementById('resumeRoute').value = resume.route || resume.Route || '';
|
||||
document.getElementById('resumeName').value = resume.basic_info?.name || resume.BasicInfo?.Name || '';
|
||||
document.getElementById('resumeTitle').value = resume.basic_info?.title || resume.BasicInfo?.Title || '';
|
||||
document.getElementById('resumeEmail').value = resume.basic_info?.email || resume.BasicInfo?.Email || '';
|
||||
document.getElementById('resumePhone').value = resume.basic_info?.phone || resume.BasicInfo?.Phone || '';
|
||||
document.getElementById('resumeLocation').value = resume.basic_info?.location || resume.BasicInfo?.Location || '';
|
||||
document.getElementById('resumeShowInHome').checked = resume.show_in_home || resume.ShowInHome || false;
|
||||
document.getElementById('resumeModal').classList.remove('hidden');
|
||||
})
|
||||
.catch(error => {
|
||||
console.error('Error:', error);
|
||||
showCustomAlert('error', '错误', '获取简历信息失败');
|
||||
});
|
||||
}
|
||||
|
||||
function saveResume(event) {
|
||||
event.preventDefault();
|
||||
|
||||
const id = document.getElementById('resumeId').value;
|
||||
const userId = document.getElementById('resumeUserId').value;
|
||||
|
||||
const data = {
|
||||
user_id: userId,
|
||||
route: document.getElementById('resumeRoute').value,
|
||||
show_in_home: document.getElementById('resumeShowInHome').checked,
|
||||
basic_info: {
|
||||
name: document.getElementById('resumeName').value,
|
||||
title: document.getElementById('resumeTitle').value,
|
||||
email: document.getElementById('resumeEmail').value,
|
||||
phone: document.getElementById('resumePhone').value,
|
||||
location: document.getElementById('resumeLocation').value
|
||||
}
|
||||
};
|
||||
|
||||
let url, method;
|
||||
if (id) {
|
||||
url = '/dashboard/api/resume/' + id;
|
||||
method = 'PUT';
|
||||
} else {
|
||||
url = '/dashboard/api/resume/create';
|
||||
method = 'POST';
|
||||
}
|
||||
|
||||
fetch(url, {
|
||||
method: method,
|
||||
headers: { 'Content-Type': 'application/json' },
|
||||
body: JSON.stringify(data)
|
||||
})
|
||||
.then(response => response.json())
|
||||
.then(result => {
|
||||
if (result.success) {
|
||||
showCustomAlert('success', '成功', '保存成功');
|
||||
closeResumeModal();
|
||||
setTimeout(() => location.reload(), 1500);
|
||||
} else {
|
||||
showCustomAlert('error', '错误', '保存失败:' + (result.message || '未知错误'));
|
||||
}
|
||||
})
|
||||
.catch(error => {
|
||||
console.error('Error:', error);
|
||||
showCustomAlert('error', '错误', '保存失败');
|
||||
});
|
||||
}
|
||||
|
||||
function toggleShowInHome(id, currentValue) {
|
||||
fetch('/dashboard/api/resume/' + id + '/show_in_home', {
|
||||
method: 'PUT',
|
||||
headers: { 'Content-Type': 'application/json' },
|
||||
body: JSON.stringify({ show_in_home: !currentValue })
|
||||
})
|
||||
.then(response => response.json())
|
||||
.then(result => {
|
||||
if (result.success) {
|
||||
location.reload();
|
||||
} else {
|
||||
showCustomAlert('error', '错误', '操作失败:' + (result.message || '未知错误'));
|
||||
}
|
||||
})
|
||||
.catch(error => {
|
||||
console.error('Error:', error);
|
||||
showCustomAlert('error', '错误', '操作失败');
|
||||
});
|
||||
}
|
||||
|
||||
function setPassword(id) {
|
||||
document.getElementById('passwordResumeId').value = id;
|
||||
document.getElementById('resumePassword').value = '';
|
||||
document.getElementById('resumePasswordConfirm').value = '';
|
||||
document.getElementById('passwordModal').classList.remove('hidden');
|
||||
}
|
||||
|
||||
function closePasswordModal() {
|
||||
document.getElementById('passwordModal').classList.add('hidden');
|
||||
}
|
||||
|
||||
function savePassword(event) {
|
||||
event.preventDefault();
|
||||
|
||||
const id = document.getElementById('passwordResumeId').value;
|
||||
const password = document.getElementById('resumePassword').value;
|
||||
const confirmPassword = document.getElementById('resumePasswordConfirm').value;
|
||||
|
||||
if (password !== confirmPassword) {
|
||||
showCustomAlert('error', '错误', '两次输入的密码不一致');
|
||||
return;
|
||||
}
|
||||
|
||||
fetch('/dashboard/api/resume/' + id + '/password', {
|
||||
method: 'PUT',
|
||||
headers: { 'Content-Type': 'application/json' },
|
||||
body: JSON.stringify({ password: password })
|
||||
})
|
||||
.then(response => response.json())
|
||||
.then(result => {
|
||||
if (result.success) {
|
||||
showCustomAlert('success', '成功', '密码设置成功');
|
||||
closePasswordModal();
|
||||
setTimeout(() => location.reload(), 1500);
|
||||
} else {
|
||||
showCustomAlert('error', '错误', '设置失败:' + (result.message || '未知错误'));
|
||||
}
|
||||
})
|
||||
.catch(error => {
|
||||
console.error('Error:', error);
|
||||
showCustomAlert('error', '错误', '设置失败');
|
||||
});
|
||||
}
|
||||
|
||||
function deleteResume(id) {
|
||||
showCustomConfirm('确认删除', '确定要删除该简历吗?此操作不可恢复。', function(confirmed) {
|
||||
if (!confirmed) return;
|
||||
fetch('/dashboard/api/resume/' + id, { method: 'DELETE' })
|
||||
.then(response => response.json())
|
||||
.then(result => {
|
||||
if (result.success) {
|
||||
location.reload();
|
||||
} else {
|
||||
showCustomAlert('error', '错误', '删除失败:' + (result.message || '未知错误'));
|
||||
}
|
||||
})
|
||||
.catch(error => {
|
||||
console.error('Error:', error);
|
||||
showCustomAlert('error', '错误', '删除失败');
|
||||
});
|
||||
});
|
||||
}
|
||||
</script>
|
||||
@@ -0,0 +1,258 @@
|
||||
<div class="bg-white rounded-xl shadow-sm border border-slate-200 p-6">
|
||||
<div class="flex items-center justify-between mb-6">
|
||||
<div>
|
||||
<h3 class="font-semibold text-slate-800 flex items-center gap-2">
|
||||
<i class="fas fa-users text-purple-500"></i> 人员列表
|
||||
</h3>
|
||||
<p class="text-sm text-slate-500 mt-1">管理平台用户</p>
|
||||
</div>
|
||||
<button onclick="openAddUserModal()" class="btn btn-primary">
|
||||
<i class="fas fa-plus"></i> 添加用户
|
||||
</button>
|
||||
</div>
|
||||
<div class="mb-6 flex items-center gap-4">
|
||||
<div class="relative flex-1 max-w-md">
|
||||
<div class="absolute left-3 top-1/2 transform -translate-y-1/2 text-slate-400">
|
||||
<i class="fas fa-search"></i>
|
||||
</div>
|
||||
<input type="text" id="searchInput" placeholder="搜索姓名或用户名..." class="w-full pl-10 pr-4 py-2.5 border-2 border-slate-200 rounded-xl focus:ring-2 focus:ring-purple-500 focus:border-purple-500 transition-all bg-white">
|
||||
</div>
|
||||
<button onclick="filterUsers()" class="btn btn-secondary">
|
||||
<i class="fas fa-search"></i> 搜索
|
||||
</button>
|
||||
<button onclick="location.reload()" class="btn btn-secondary">
|
||||
<i class="fas fa-redo"></i> 重置
|
||||
</button>
|
||||
</div>
|
||||
<div class="overflow-x-auto">
|
||||
<table class="table">
|
||||
<thead>
|
||||
<tr class="bg-slate-50 border-b border-slate-200">
|
||||
<th class="text-left px-6 py-4 text-sm font-semibold text-slate-600">姓名</th>
|
||||
<th class="text-left px-6 py-4 text-sm font-semibold text-slate-600">用户名</th>
|
||||
<th class="text-left px-6 py-4 text-sm font-semibold text-slate-600">邮箱</th>
|
||||
<th class="text-left px-6 py-4 text-sm font-semibold text-slate-600">手机号</th>
|
||||
<th class="text-left px-6 py-4 text-sm font-semibold text-slate-600">创建时间</th>
|
||||
<th class="text-left px-6 py-4 text-sm font-semibold text-slate-600 actions-col">操作</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
{{ range .Users }}
|
||||
<tr class="border-b border-slate-100 hover:bg-slate-50 transition-colors">
|
||||
<td class="px-6 py-4">
|
||||
<span class="font-medium text-slate-800">{{.Name}}</span>
|
||||
</td>
|
||||
<td class="px-6 py-4 text-slate-600">{{.Username}}</td>
|
||||
<td class="px-6 py-4 text-slate-600">{{.Email}}</td>
|
||||
<td class="px-6 py-4 text-slate-600">{{.Phone}}</td>
|
||||
<td class="px-6 py-4 text-slate-500 text-sm">{{.CreatedAt}}</td>
|
||||
<td class="px-6 py-4 actions-col">
|
||||
<div class="btn-group">
|
||||
<a href="{{$.AdminPath}}/user/{{.ID}}/resume" class="btn btn-primary btn-xs" title="简历">
|
||||
<i class="fas fa-file-alt"></i> 简历
|
||||
</a>
|
||||
<a href="{{$.AdminPath}}/user/{{.ID}}/portfolio" class="btn btn-info btn-xs" title="作品集">
|
||||
<i class="fas fa-folder-open"></i> 作品集
|
||||
</a>
|
||||
<a href="{{$.AdminPath}}/user/{{.ID}}/quiz" class="btn btn-purple btn-xs" title="面试题">
|
||||
<i class="fas fa-question-circle"></i> 答题
|
||||
</a>
|
||||
<button onclick="editUser('{{.ID}}')" class="btn btn-warning btn-xs" title="编辑">
|
||||
<i class="fas fa-edit"></i> 编辑
|
||||
</button>
|
||||
<button onclick="deleteUser('{{.ID}}')" class="btn btn-danger btn-xs" title="删除">
|
||||
<i class="fas fa-trash"></i> 删除
|
||||
</button>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
{{ else }}
|
||||
<tr>
|
||||
<td colspan="6" class="px-6 py-12 text-center text-slate-500">
|
||||
<div class="w-16 h-16 mx-auto mb-4 rounded-full bg-slate-100 flex items-center justify-center">
|
||||
<i class="fas fa-users text-slate-400 text-2xl"></i>
|
||||
</div>
|
||||
<p>暂无用户数据</p>
|
||||
</td>
|
||||
</tr>
|
||||
{{ end }}
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
{{ if gt .TotalPages 1 }}
|
||||
<div class="border-t border-slate-200 px-6 py-4 bg-slate-50 flex items-center justify-between">
|
||||
<div class="text-sm text-slate-500">共 {{ .Total }} 条记录,第 {{ .Page }} / {{ .TotalPages }} 页</div>
|
||||
<div class="flex items-center gap-2">
|
||||
<a href="?page=1" class="btn btn-sm btn-slate {{ if eq .Page 1 }}opacity-50 cursor-not-allowed{{ end }}" {{ if eq .Page 1 }}onclick="return false"{{ end }}>
|
||||
<i class="fas fa-chevron-left"></i>
|
||||
<i class="fas fa-chevron-left"></i>
|
||||
</a>
|
||||
<a href="?page={{ if eq .Page 1 }}1{{ else }}{{ subtract .Page 1 }}{{ end }}" class="btn btn-sm btn-slate {{ if eq .Page 1 }}opacity-50 cursor-not-allowed{{ end }}" {{ if eq .Page 1 }}onclick="return false"{{ end }}>
|
||||
<i class="fas fa-chevron-left"></i>
|
||||
</a>
|
||||
{{ range $i := to 1 $.TotalPages }}
|
||||
{{ if or (eq $i 1) (eq $i $.TotalPages) (and (ge $i (subtract $.Page 2)) (le $i (add $.Page 2))) }}
|
||||
<a href="?page={{ $i }}" class="btn btn-sm {{ if eq $i $.Page }}btn-primary{{ else }}btn-slate{{ end }}">{{ $i }}</a>
|
||||
{{ else if and (eq $i 2) (gt (subtract $.Page 3) 1) }}
|
||||
<span class="text-slate-400 px-2">...</span>
|
||||
{{ else if and (eq $i (subtract $.TotalPages 1)) (lt (add $.Page 3) $.TotalPages) }}
|
||||
<span class="text-slate-400 px-2">...</span>
|
||||
{{ end }}
|
||||
{{ end }}
|
||||
<a href="?page={{ if eq .Page .TotalPages }}{{ .TotalPages }}{{ else }}{{ add .Page 1 }}{{ end }}" class="btn btn-sm btn-slate {{ if eq .Page .TotalPages }}opacity-50 cursor-not-allowed{{ end }}" {{ if eq .Page .TotalPages }}onclick="return false"{{ end }}>
|
||||
<i class="fas fa-chevron-right"></i>
|
||||
</a>
|
||||
<a href="?page={{ .TotalPages }}" class="btn btn-sm btn-slate {{ if eq .Page .TotalPages }}opacity-50 cursor-not-allowed{{ end }}" {{ if eq .Page .TotalPages }}onclick="return false"{{ end }}>
|
||||
<i class="fas fa-chevron-right"></i>
|
||||
<i class="fas fa-chevron-right"></i>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
{{ end }}
|
||||
</div>
|
||||
<div class="modal" id="userModal">
|
||||
<div class="modal-content">
|
||||
<div class="modal-header">
|
||||
<h3 class="modal-title" id="userModalTitle">
|
||||
<i class="fas fa-user-plus text-blue-500"></i> 添加用户
|
||||
</h3>
|
||||
<div class="modal-close" onclick="closeUserModal()">
|
||||
<i class="fas fa-times"></i>
|
||||
</div>
|
||||
</div>
|
||||
<div class="modal-body">
|
||||
<form id="userForm" onsubmit="saveUser(event)">
|
||||
<input type="hidden" id="userId">
|
||||
<div class="space-y-4">
|
||||
<div>
|
||||
<label class="form-label">姓名</label>
|
||||
<input type="text" id="userName" class="form-input" required>
|
||||
</div>
|
||||
<div>
|
||||
<label class="form-label">用户名</label>
|
||||
<input type="text" id="userUsername" class="form-input" required>
|
||||
</div>
|
||||
<div>
|
||||
<label class="form-label">邮箱</label>
|
||||
<input type="email" id="userEmail" class="form-input" required>
|
||||
</div>
|
||||
<div>
|
||||
<label class="form-label">手机号</label>
|
||||
<input type="tel" id="userPhone" class="form-input">
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<button onclick="closeUserModal()" class="btn btn-secondary">
|
||||
<i class="fas fa-times"></i> 取消
|
||||
</button>
|
||||
<button type="submit" form="userForm" class="btn btn-primary">
|
||||
<i class="fas fa-save"></i> 保存
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<script>
|
||||
function filterUsers() {
|
||||
const searchTerm = document.getElementById('searchInput').value.toLowerCase();
|
||||
const rows = document.querySelectorAll('table tbody tr');
|
||||
rows.forEach(row => {
|
||||
const name = row.querySelector('td:nth-child(1)')?.textContent.toLowerCase() || '';
|
||||
const username = row.querySelector('td:nth-child(2)')?.textContent.toLowerCase() || '';
|
||||
const email = row.querySelector('td:nth-child(3)')?.textContent.toLowerCase() || '';
|
||||
const phone = row.querySelector('td:nth-child(4)')?.textContent.toLowerCase() || '';
|
||||
if (name.includes(searchTerm) || username.includes(searchTerm) || email.includes(searchTerm) || phone.includes(searchTerm)) {
|
||||
row.style.display = '';
|
||||
} else {
|
||||
row.style.display = 'none';
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
function openAddUserModal() {
|
||||
document.getElementById('userModalTitle').innerHTML = '<i class="fas fa-user-plus text-blue-500"></i> 添加用户';
|
||||
document.getElementById('userId').value = '';
|
||||
document.getElementById('userName').value = '';
|
||||
document.getElementById('userUsername').value = '';
|
||||
document.getElementById('userEmail').value = '';
|
||||
document.getElementById('userPhone').value = '';
|
||||
document.getElementById('userModal').classList.add('active');
|
||||
}
|
||||
|
||||
function closeUserModal() {
|
||||
document.getElementById('userModal').classList.remove('active');
|
||||
}
|
||||
|
||||
function editUser(id) {
|
||||
fetch('/dashboard/api/user/' + id)
|
||||
.then(response => response.json())
|
||||
.then(res => {
|
||||
const user = res.data || res;
|
||||
document.getElementById('userModalTitle').innerHTML = '<i class="fas fa-user-edit text-yellow-500"></i> 编辑用户';
|
||||
document.getElementById('userId').value = user.id || '';
|
||||
document.getElementById('userName').value = user.name || '';
|
||||
document.getElementById('userUsername').value = user.username || '';
|
||||
document.getElementById('userEmail').value = user.email || '';
|
||||
document.getElementById('userPhone').value = user.phone || '';
|
||||
document.getElementById('userModal').classList.add('active');
|
||||
})
|
||||
.catch(error => {
|
||||
console.error('Error:', error);
|
||||
showCustomAlert('error', '错误', '获取用户信息失败');
|
||||
});
|
||||
}
|
||||
|
||||
function deleteUser(id) {
|
||||
showCustomConfirm('确认删除', '确定要删除该用户吗?', function(confirmed) {
|
||||
if (!confirmed) return;
|
||||
fetch('/dashboard/api/user/' + id, { method: 'DELETE' })
|
||||
.then(response => response.json())
|
||||
.then(result => {
|
||||
if (result.success) {
|
||||
location.reload();
|
||||
} else {
|
||||
showCustomAlert('error', '错误', '删除失败:' + (result.message || '未知错误'));
|
||||
}
|
||||
})
|
||||
.catch(error => {
|
||||
console.error('Error:', error);
|
||||
showCustomAlert('error', '错误', '删除失败');
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
function saveUser(event) {
|
||||
event.preventDefault();
|
||||
const id = document.getElementById('userId').value;
|
||||
const data = {
|
||||
name: document.getElementById('userName').value,
|
||||
username: document.getElementById('userUsername').value,
|
||||
email: document.getElementById('userEmail').value,
|
||||
phone: document.getElementById('userPhone').value
|
||||
};
|
||||
|
||||
const url = id ? '/dashboard/api/user/' + id : '/dashboard/api/user';
|
||||
const method = id ? 'PUT' : 'POST';
|
||||
|
||||
fetch(url, {
|
||||
method: method,
|
||||
headers: { 'Content-Type': 'application/json' },
|
||||
body: JSON.stringify(data)
|
||||
})
|
||||
.then(response => response.json())
|
||||
.then(result => {
|
||||
if (result.success) {
|
||||
showCustomAlert('success', '成功', '保存成功');
|
||||
closeUserModal();
|
||||
setTimeout(() => location.reload(), 1500);
|
||||
} else {
|
||||
showCustomAlert('error', '错误', '保存失败:' + (result.message || '未知错误'));
|
||||
}
|
||||
})
|
||||
.catch(error => {
|
||||
console.error('Error:', error);
|
||||
showCustomAlert('error', '错误', '保存失败');
|
||||
});
|
||||
}
|
||||
</script>
|
||||
Reference in New Issue
Block a user