Skip to content

Commit 1eee840

Browse files
add
1 parent 38db986 commit 1eee840

10 files changed

Lines changed: 1559 additions & 0 deletions

user/components/sidebar.html

Lines changed: 49 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,49 @@
1+
<!-- SIDEBAR CONTENT -->
2+
<div class="flex flex-col h-full p-6">
3+
<!-- Logo -->
4+
<div class="flex items-center gap-3 mb-10 cursor-pointer" onclick="resetHome()">
5+
<div
6+
class="w-8 h-8 bg-indigo-600 rounded-lg flex items-center justify-center text-white shadow-lg shadow-indigo-200">
7+
<i class="ph-bold ph-chats-circle text-lg"></i>
8+
</div>
9+
<span class="font-bold text-lg tracking-tight text-slate-800">UniChat<span
10+
class="text-indigo-600">.</span></span>
11+
</div>
12+
13+
<!-- Navigation -->
14+
<nav class="space-y-2 flex-1">
15+
<a href="#" onclick="resetHome()"
16+
class="flex items-center gap-3 px-4 py-3 bg-white/50 text-indigo-700 rounded-xl font-semibold shadow-sm border border-white/50">
17+
<i class="ph-fill ph-house text-xl"></i>
18+
<span>Trang chủ</span>
19+
</a>
20+
<a href="my-documents.html"
21+
class="flex items-center gap-3 px-4 py-3 text-slate-500 hover:bg-white/40 hover:text-slate-700 rounded-xl transition">
22+
<i class="ph ph-files text-xl"></i>
23+
<span>Tài liệu của tôi</span>
24+
</a>
25+
<a href="history.html"
26+
class="flex items-center gap-3 px-4 py-3 text-slate-500 hover:bg-white/40 hover:text-slate-700 rounded-xl transition">
27+
<i class="ph ph-clock-counter-clockwise text-xl"></i>
28+
<span>Lịch sử câu hỏi</span>
29+
</a>
30+
<a href="#"
31+
class="flex items-center gap-3 px-4 py-3 text-slate-500 hover:bg-white/40 hover:text-slate-700 rounded-xl transition">
32+
<i class="ph ph-bookmark-simple text-xl"></i>
33+
<span>Đã lưu</span>
34+
</a>
35+
</nav>
36+
37+
<!-- Bottom Actions -->
38+
<div class="space-y-2 mt-auto pt-6 border-t border-slate-200/50">
39+
<a href="settings.html"
40+
class="flex items-center gap-3 px-4 py-3 text-slate-500 hover:bg-white/40 hover:text-slate-700 rounded-xl transition">
41+
<i class="ph ph-gear text-xl"></i>
42+
<span>Cài đặt</span>
43+
</a>
44+
<button onclick="toggleSidebar()"
45+
class="md:hidden flex items-center gap-3 px-4 py-3 text-red-500 rounded-xl w-full hover:bg-red-50 transition">
46+
<i class="ph ph-x text-xl"></i> Đóng Menu
47+
</button>
48+
</div>
49+
</div>

user/data/documents.json

Lines changed: 42 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,42 @@
1+
[
2+
{
3+
"id": 1,
4+
"name": "Quy_che_daotao_2024.pdf",
5+
"type": "pdf",
6+
"size": "2.4 MB",
7+
"date": "2024-12-15",
8+
"url": "https://www.w3.org/WAI/ER/tests/xhtml/testfiles/resources/pdf/dummy.pdf"
9+
},
10+
{
11+
"id": 2,
12+
"name": "Huong_dan_dang_ky_mon_hoc.pdf",
13+
"type": "pdf",
14+
"size": "1.1 MB",
15+
"date": "2024-12-20",
16+
"url": "https://pdfobject.com/pdf/sample.pdf"
17+
},
18+
{
19+
"id": 3,
20+
"name": "Bieu_mau_don_xin_phep.docx",
21+
"type": "word",
22+
"size": "450 KB",
23+
"date": "2024-11-05",
24+
"url": "https://calibre-ebook.com/downloads/demos/demo.docx"
25+
},
26+
{
27+
"id": 4,
28+
"name": "Lich_thi_hoc_ky_1.xlsx",
29+
"type": "excel",
30+
"size": "85 KB",
31+
"date": "2024-12-28",
32+
"url": "https://go.microsoft.com/fwlink/?LinkID=521962"
33+
},
34+
{
35+
"id": 5,
36+
"name": "Slide_gioi_thieu_khoa.pptx",
37+
"type": "ppt",
38+
"size": "5.2 MB",
39+
"date": "2024-10-10",
40+
"url": "#"
41+
}
42+
]

user/documents/5_TH_DSSB_TSNN.xlsx

51.8 KB
Binary file not shown.
22.2 KB
Binary file not shown.
Binary file not shown.
Binary file not shown.

user/history.html

Lines changed: 155 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,155 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
4+
<head>
5+
<meta charset="UTF-8">
6+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
7+
<title>Lịch sử câu hỏi - UniChat</title>
8+
<script src="https://cdn.tailwindcss.com"></script>
9+
<script src="https://unpkg.com/@phosphor-icons/web"></script>
10+
<style>
11+
@import url('https://fonts.googleapis.com/css2?family=Be+Vietnam+Pro:wght@300;400;500;600;700&display=swap');
12+
13+
:root {
14+
--primary: #4F46E5;
15+
}
16+
17+
body {
18+
font-family: 'Be Vietnam Pro', sans-serif;
19+
background-color: #f8fafc;
20+
}
21+
22+
.glass-panel {
23+
background: rgba(255, 255, 255, 0.8);
24+
backdrop-filter: blur(12px);
25+
border-right: 1px solid rgba(255, 255, 255, 0.5);
26+
}
27+
</style>
28+
</head>
29+
30+
<body
31+
class="text-slate-700 h-screen flex overflow-hidden bg-[url('https://images.unsplash.com/photo-1618005182384-a83a8bd57fbe?q=80&w=2564&auto=format&fit=crop')] bg-cover bg-center">
32+
33+
<!-- Privacy Layer -->
34+
<div class="absolute inset-0 bg-slate-50/95 z-0"></div>
35+
36+
<!-- SIDEBAR -->
37+
<aside class="w-64 glass-panel h-full relative z-20 hidden md:flex transition-all duration-300" id="sidebar">
38+
<!-- Loaded via JS -->
39+
</aside>
40+
41+
<!-- CONTENT -->
42+
<div class="flex-1 flex flex-col h-full relative z-10 overflow-hidden">
43+
<!-- Header -->
44+
<header
45+
class="h-16 border-b border-slate-200 bg-white/50 backdrop-blur flex items-center justify-between px-6 shrink-0">
46+
<h1 class="text-xl font-bold text-slate-800 flex items-center gap-2">
47+
<i class="ph-fill ph-clock-counter-clockwise text-indigo-600"></i> Lịch sử câu hỏi
48+
</h1>
49+
<div class="flex items-center gap-4">
50+
<div class="relative">
51+
<i class="ph ph-magnifying-glass absolute left-3 top-2.5 text-slate-400"></i>
52+
<input type="text" placeholder="Tìm kiếm lịch sử..."
53+
class="pl-10 pr-4 py-2 bg-white border border-slate-200 rounded-lg text-sm focus:outline-none focus:ring-2 focus:ring-indigo-500/50 w-64">
54+
</div>
55+
</div>
56+
</header>
57+
58+
<!-- Main Content -->
59+
<main class="flex-1 overflow-y-auto p-6">
60+
<div class="max-w-4xl mx-auto space-y-6">
61+
62+
<!-- Month Group -->
63+
<div>
64+
<h3 class="text-xs font-bold text-slate-400 uppercase tracking-wider mb-3 px-2">Tháng 12, 2024</h3>
65+
<div class="bg-white/60 backdrop-blur border border-slate-200 rounded-xl overflow-hidden shadow-sm">
66+
67+
<!-- Item 1 -->
68+
<div class="p-4 border-b border-slate-100 hover:bg-white transition cursor-pointer group">
69+
<div class="flex justify-between items-start mb-1">
70+
<h4 class="font-medium text-slate-700 group-hover:text-indigo-600 transition">Cách đăng
71+
ký tín chỉ học phần GDTC?</h4>
72+
<span class="text-xs text-slate-400">20/12/2024</span>
73+
</div>
74+
<p class="text-sm text-slate-500 line-clamp-2">Để đăng ký tín chỉ học phần Giáo dục thể
75+
chất, sinh viên cần truy cập vào cổng thông tin đào tạo, chọn mục Đăng ký học phần...
76+
</p>
77+
</div>
78+
79+
<!-- Item 2 -->
80+
<div class="p-4 border-b border-slate-100 hover:bg-white transition cursor-pointer group">
81+
<div class="flex justify-between items-start mb-1">
82+
<h4 class="font-medium text-slate-700 group-hover:text-indigo-600 transition">Quy định
83+
về xét học bổng khuyến khích?</h4>
84+
<span class="text-xs text-slate-400">18/12/2024</span>
85+
</div>
86+
<p class="text-sm text-slate-500 line-clamp-2">Học bổng khuyến khích học tập được xét dựa
87+
trên kết quả học tập và rèn luyện của sinh viên trong từng kỳ học...</p>
88+
</div>
89+
90+
<!-- Item 3 -->
91+
<div class="p-4 hover:bg-white transition cursor-pointer group">
92+
<div class="flex justify-between items-start mb-1">
93+
<h4 class="font-medium text-slate-700 group-hover:text-indigo-600 transition">Lịch thi
94+
cuối kỳ I năm học 2024-2025</h4>
95+
<span class="text-xs text-slate-400">15/12/2024</span>
96+
</div>
97+
<p class="text-sm text-slate-500 line-clamp-2">Lịch thi dự kiến đã được công bố trên website
98+
của Phòng Đào Tạo. Sinh viên lưu ý theo dõi để không bỏ lỡ...</p>
99+
</div>
100+
</div>
101+
</div>
102+
103+
<!-- Month Group -->
104+
<div>
105+
<h3 class="text-xs font-bold text-slate-400 uppercase tracking-wider mb-3 px-2">Tháng 11, 2024</h3>
106+
<div class="bg-white/60 backdrop-blur border border-slate-200 rounded-xl overflow-hidden shadow-sm">
107+
<!-- Item 4 -->
108+
<div class="p-4 hover:bg-white transition cursor-pointer group">
109+
<div class="flex justify-between items-start mb-1">
110+
<h4 class="font-medium text-slate-700 group-hover:text-indigo-600 transition">Thủ tục
111+
xin cấp lại thẻ sinh viên</h4>
112+
<span class="text-xs text-slate-400">28/11/2024</span>
113+
</div>
114+
<p class="text-sm text-slate-500 line-clamp-2">Sinh viên cần làm đơn xin cấp lại thẻ (theo
115+
mẫu) và nộp tại Phòng Công tác Sinh viên (C1-102)...</p>
116+
</div>
117+
</div>
118+
</div>
119+
120+
</div>
121+
</main>
122+
</div>
123+
124+
<script>
125+
document.addEventListener('DOMContentLoaded', () => {
126+
loadSidebar();
127+
});
128+
129+
async function loadSidebar() {
130+
try {
131+
const response = await fetch('components/sidebar.html');
132+
const html = await response.text();
133+
const container = document.getElementById('sidebar');
134+
container.innerHTML = html;
135+
136+
// Highlight active link
137+
const navLinks = container.querySelectorAll('nav a');
138+
// History is 3rd link (index 2)
139+
if (navLinks[2]) {
140+
navLinks[2].classList.remove('text-slate-500', 'hover:bg-white/40');
141+
navLinks[2].classList.add('bg-white/50', 'text-indigo-700', 'font-semibold', 'shadow-sm', 'border', 'border-white/50');
142+
}
143+
} catch (error) {
144+
console.error("Failed to load sidebar", error);
145+
}
146+
}
147+
148+
function resetHome() {
149+
window.location.href = 'index.html';
150+
}
151+
function toggleSidebar() { }
152+
</script>
153+
</body>
154+
155+
</html>

0 commit comments

Comments
 (0)