diff --git a/backend/routes/adminRoutes.js b/backend/routes/adminRoutes.js index cbf4976..65cd930 100644 --- a/backend/routes/adminRoutes.js +++ b/backend/routes/adminRoutes.js @@ -97,13 +97,16 @@ router.get('/users', protect, async (req, res) => { router.put('/users/:id', protect, async (req, res) => { if (req.user.role !== 'admin' && req.user.role !== 'Chủ sở hữu') return res.status(403).json({ message: 'Forbidden' }); try { - const { fullName, email, role, password } = req.body; + const { fullName, email, role, password, quota } = req.body; const user = await User.findById(req.params.id); if (!user) return res.status(404).json({ message: 'User not found' }); if (fullName) user.fullName = fullName; if (email) user.email = email; if (role && user.role !== 'admin') user.role = role; if (password) user.password = password; + if (quota !== undefined) { + user.storage = { ...user.storage, quota: parseInt(quota) * 1024 * 1024 }; + } await user.save(); res.json({ message: 'User updated' }); } catch (error) { res.status(500).json({ message: error.message }); } diff --git a/frontend/css/style.css b/frontend/css/style.css index 4585d7f..1b00352 100644 --- a/frontend/css/style.css +++ b/frontend/css/style.css @@ -1173,8 +1173,9 @@ html, body { .admin-table th:nth-child(1) { min-width: 160px; } /* Họ tên */ .admin-table th:nth-child(2) { min-width: 120px; } /* Username */ .admin-table th:nth-child(3) { min-width: 200px; } /* Email */ -.admin-table th:nth-child(4) { min-width: 130px; } /* Quyền hạn */ -.admin-table th:nth-child(5) { min-width: 140px; } /* Reset Password */ +.admin-table th:nth-child(4) { min-width: 120px; } /* Quyền hạn */ +.admin-table th:nth-child(5) { min-width: 100px; } /* Dung lượng */ +.admin-table th:nth-child(6) { min-width: 140px; } /* Reset Password */ .admin-table th:nth-child(6) { min-width: 140px; } /* Thao tác */ .admin-table td input, .admin-table td select { @@ -1204,28 +1205,127 @@ html, body { } /* Admin User Management Header */ -.admin-management-header { +.admin-management-controls { display: flex; - align-items: center; - justify-content: flex-end; + flex-direction: column; + gap: 15px; margin-bottom: 20px; padding-bottom: 10px; border-bottom: 1px solid rgba(255, 255, 255, 0.05); } +.cleanup-row { + display: flex; + justify-content: flex-end; +} + .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); + background: #444444 !important; + color: #222222 !important; + padding: 0 20px !important; + height: 36px; + border: none !important; border-radius: 4px; cursor: pointer; + font-size: 13px; transition: background 0.2s; + white-space: nowrap; } .cleanup-btn:hover { - background: rgba(255, 255, 255, 0.1); /* Màu xám active của dashboard */ + background: #555555 !important; +} + +.admin-search-container { + display: flex; + gap: 0; /* Sát cạnh nhau */ + width: 100%; +} + +.admin-search-container input { + flex: 1; + background: #262626 !important; + border: 1px solid #000000 !important; + color: #ffffff !important; + padding: 8px 15px !important; + border-radius: 6px 0 0 6px !important; + height: 38px; +} + +.admin-search-btn { + background: #444444 !important; + color: #ffffff !important; + border: 1px solid #000000 !important; + padding: 0 25px !important; + border-radius: 0 6px 6px 0 !important; + cursor: pointer; + font-size: 13px; + transition: background 0.2s; +} + +/* Card layout styles */ +.admin-user-card { + background: #262626 !important; + border: 1px solid #404040 !important; + border-radius: 12px !important; + padding: 16px; + display: grid; + grid-template-columns: 1.5fr 1fr 2fr 1fr 1fr 1fr 1fr; + align-items: center; + gap: 15px; + margin-bottom: 12px; +} + +.admin-users-header-row { + display: grid; + grid-template-columns: 1.5fr 1fr 2fr 1fr 1fr 1fr 1fr; + gap: 15px; + padding: 0 16px 12px 16px; + color: #a3a3a3; + font-size: 11px; + text-transform: uppercase; + font-weight: 600; +} + +.card-field input:not(:disabled), .card-field select:not(:disabled) { + background: #ffffff !important; + color: #000000 !important; + border: 1px solid #404040; + border-radius: 4px; + padding: 6px 10px; + width: 100%; +} + +.card-field input:disabled, .card-field select:disabled { + background: #404040 !important; + color: #a3a3a3 !important; + border: 1px solid #525252; + border-radius: 4px; + padding: 6px 10px; + width: 100%; +} + +/* Màu sắc linh hoạt cho Input theo trạng thái */ +.card-field input[type="text"], .card-field input[type="email"], .card-field input[type="number"] { + background: #ffffff !important; + color: #000000 !important; +} + +.card-field input:disabled, .card-field select:disabled { + background: #404040 !important; /* Nền xám tối */ + color: #a3a3a3 !important; /* Chữ xám mờ */ + border-color: #525252 !important; + cursor: not-allowed; +} + +.card-field .edit-btn-small { + background: #28a745 !important; /* Nền xanh lá */ + width: 100%; + height: 34px; + border-radius: 4px; + color: #fff; + border: none; + cursor: pointer; } .admin-search-container { diff --git a/frontend/index.html b/frontend/index.html index 4d5d89c..b190cc6 100644 --- a/frontend/index.html +++ b/frontend/index.html @@ -140,17 +140,7 @@
-
- - -
-
- - -
-
+
diff --git a/frontend/js/main_map.js b/frontend/js/main_map.js index 88b6688..533ea7b 100644 --- a/frontend/js/main_map.js +++ b/frontend/js/main_map.js @@ -1986,49 +1986,78 @@ async function loadAdminUsers(page = 1) { const { users, totalPages, currentPage, totalUsers } = data; let html = ` - - - - - - - - - - - - +
+
+ +
+
+ + +
+
+ +
+ +
+
Họ tên
+
Username
+
Email
+
Quyền hạn
+
Dung lượng
+
Reset Password
+
Thao tác
+
`; users.forEach(user => { - const isRootAdmin = user.role === 'admin'; + const isRootAdmin = user.role === 'admin' || user.role === 'Chủ sở hữu'; + const quotaMB = user.storage?.quota ? Math.floor(user.storage.quota / (1024 * 1024)) : 0; + const usedMB = user.storage?.used ? (user.storage.used / (1024 * 1024)).toFixed(1) : 0; html += ` -
- - - - - - - + + +
+ + Đã dùng: ${usedMB} MB +
+ +
+ +
+ +
+ +
+ `; }); - html += '
Họ tênUsernameEmailQuyền hạnReset PasswordThao tác
${user.username} - + + +
+ ${user.username} +
+ +
+ +
+ +
+ -
- - ${isRootAdmin ? '' : ``} -
'; + html += '
'; container.innerHTML = html; - // Render Pagination UI if (paginationContainer && totalPages > 1) { paginationContainer.innerHTML = ` @@ -2040,14 +2069,14 @@ async function loadAdminUsers(page = 1) { container.innerHTML = `

Lỗi: ${e.message}

`; } } - window.updateUserByAdmin = async function(userId) { const token = localStorage.getItem('jwt'); const payload = { fullName: document.getElementById(`adm-fn-${userId}`).value, email: document.getElementById(`adm-em-${userId}`).value, role: document.getElementById(`adm-role-${userId}`).value, - password: document.getElementById(`adm-pw-${userId}`).value + password: document.getElementById(`adm-pw-${userId}`).value, + quota: document.getElementById(`adm-quota-${userId}`).value }; try {