admin/3dtours
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Chỉnh sửa giao diện của admin, phân hồ sơ thành 2 cột

Browse Source
This commit is contained in:
locphamtran
2026-06-09 16:35:18 +07:00
parent 13e1c6049d
commit b4b193c72c
4 changed files with 141 additions and 29 deletions
Download Patch File Download Diff File Expand all files Collapse all files
backend/uploads/processed_1780896376296_4715c6e4.JPG.jpg
BIN
View File
Binary file not shown.
Side by Side

Before

Width:  |  Height:  |  Size: 3.9 MiB

backend/uploads/processed_1780970998028_047bd312.JPG.jpg
BIN
View File
Binary file not shown.
Side by Side

Before

Width:  |  Height:  |  Size: 4.3 MiB

frontend/css/style.css
+119 -8
View File
@@ -66,7 +66,6 @@ html, body {
display: block;
margin-bottom: 5px;
font-weight: 600;
color: #333;
}
.form-group input, .form-group select {
@@ -77,15 +76,16 @@ html, body {
}
.submit-btn {
width: 100%;
padding: 12px;
background-color: #28a745;
color: white;
border: none;
background: transparent !important;
color: #fff;
padding: 0 20px;
height: 36px;
border: 1px solid rgba(255, 255, 255, 0.2) !important;
border-radius: 4px;
cursor: pointer;
font-weight: bold;
font-size: 16px;
font-size: 13px;
transition: background 0.2s;
white-space: nowrap;
}
.submit-btn:hover {
@@ -423,12 +423,40 @@ html, body {
}
/* Profile Styles */
.profile-grid {
display: grid !important;
grid-template-columns: 1fr 1fr !important; /* Ép buộc chia 2 cột đều nhau */
gap: 10px 25px !important;
margin-bottom: 20px;
width: 100% !important;
}
/* Responsive cho mobile */
@media (max-width: 768px) {
.profile-grid {
grid-template-columns: 1fr !important;
}
}
#profile-form .form-group {
margin-bottom: 10px;
}
.profile-header-edit {
display: flex;
justify-content: center;
margin-bottom: 25px;
}
#profile-form input {
background: #2a2a2a !important; /* Đồng bộ màu nền xám tối như admin table */
border: 1px solid #444 !important; /* Viền sắc nét hơn */
color: #fff !important;
padding: 8px 12px !important;
border-radius: 4px;
font-size: 13px;
}
.avatar-edit-container {
position: relative;
width: 100px;
@@ -465,6 +493,24 @@ html, body {
transform: scale(1.1);
}
.profile-submit-btn {
width: auto !important;
margin: 20px auto 0 !important;
display: block !important;
background: transparent !important; /* Loại bỏ hoàn toàn nền xanh */
border: 1px solid rgba(255, 255, 255, 0.15) !important;
color: #fff !important;
padding: 8px 25px !important;
border-radius: 6px !important;
font-weight: 500 !important;
font-size: 14px !important;
transition: background 0.2s;
}
.profile-submit-btn:hover {
background: rgba(255, 255, 255, 0.08) !important;
}
/* Storage Progress Bar */
.storage-info {
margin-top: 25px;
@@ -1080,6 +1126,71 @@ html, body {
width: 100%;
}
/* Admin User Management Header */
.admin-management-header {
display: flex;
align-items: center;
justify-content: flex-end;
margin-bottom: 20px;
padding-bottom: 10px;
border-bottom: 1px solid rgba(255, 255, 255, 0.05);
}
.cleanup-btn {
background: transparent; /* Nền trùng màu dashboard */
color: #fff;
padding: 6px 12px;
font-size: 13px;
border: 1px solid rgba(255, 255, 255, 0.1);
border-radius: 4px;
cursor: pointer;
transition: background 0.2s;
}
.cleanup-btn:hover {
background: rgba(255, 255, 255, 0.1); /* Màu xám active của dashboard */
}
.admin-search-container {
display: flex;
flex-direction: row; /* Chuyển sang hàng ngang */
align-items: center;
gap: 10px;
margin-bottom: 20px;
width: 100%;
}
.admin-search-container input {
flex: 1; /* Trải dài toàn bộ chiều rộng còn lại */
background: rgba(255, 255, 255, 0.1) !important; /* Nền xám như màu active */
border: 1px solid rgba(255, 255, 255, 0.1) !important;
color: #000 !important; /* Text màu đen */
padding: 8px 15px !important;
border-radius: 4px;
font-size: 14px;
height: 36px;
}
.admin-search-container input::placeholder {
color: #555;
}
.admin-search-btn {
background: transparent !important;
color: #fff;
padding: 0 20px;
height: 36px;
border: 1px solid rgba(255, 255, 255, 0.2) !important;
border-radius: 4px;
cursor: pointer;
font-size: 13px;
transition: background 0.2s;
white-space: nowrap;
}
.admin-search-btn:hover {
background: rgba(255, 255, 255, 0.1);
}
/* Pagination Styles */
.pagination-container {
display: flex;
frontend/index.html
+7 -6
View File
@@ -91,7 +91,6 @@
</div>
<div id="dashboard-tab-content">
<div id="tab-profile" class="dashboard-tab-pane active">
<h3>Thông tin hồ sơ</h3>
<form id="profile-form" onsubmit="updateProfile(event)">
<div class="profile-header-edit">
<div class="avatar-edit-container">
@@ -103,6 +102,7 @@
<input type="file" id="profile-avatar-input" name="avatar" accept="image/*" onchange="previewAvatar(this)" style="display:none;">
</div>
</div>
<div class="profile-grid"> <!-- Đảm bảo class này được sử dụng -->
<div class="form-group">
<label>Họ và tên</label>
<input type="text" id="profile-fullname" name="fullName" required>
@@ -119,7 +119,8 @@
<label>Mật khẩu mới (để trống nếu không đổi)</label>
<input type="password" id="profile-password" name="password" placeholder="********">
</div>
<button type="submit" class="submit-btn">Cập nhật hồ sơ</button>
</div>
<button type="submit" class="submit-btn profile-submit-btn">Cập nhật</button>
</form>
</div>
<div id="tab-my-scenes" class="dashboard-tab-pane">
@@ -137,10 +138,10 @@
</div>
</div>
<div id="tab-user-management" class="dashboard-tab-pane admin-only">
<h3>Quản lí người dùng</h3>
<div class="admin-maintenance-header" style="margin-bottom: 20px;">
<button class="edit-btn-large" onclick="openManualCleanupConfirm()" style="background: #17a2b8; width: auto; padding: 10px 20px; font-size: 14px;">
🧹 Dọn dẹp dữ liệu mồ côi
<div class="admin-management-header">
<button class="cleanup-btn" onclick="openManualCleanupConfirm()">
🧹 Dọn dẹp dữ liệu
</button>
</div>
<div class="admin-search-container">