add-user, edit, view, delete working

This commit is contained in:
armiejean 2025-05-15 15:31:57 +08:00
parent bab9e0cd3e
commit b274e95cd2
5 changed files with 265 additions and 203 deletions

View File

@ -9,6 +9,7 @@ use Illuminate\Support\Facades\Session;
class UserManagementController extends Controller
{
protected $apiBaseUrl = 'http://192.168.100.6:8081/api';
public function index()
@ -38,7 +39,7 @@ class UserManagementController extends Controller
'username' => $admin['username'],
'firstName' => $admin['firstname'],
'lastName' => $admin['lastname'],
'role' => 'Admin',
'role' => $admin['role'] == '1' ? 'Admin' : 'User',
'email' => $admin['email'],
'status' => $admin['status'] ? 'Active' : 'Inactive',
];
@ -107,7 +108,7 @@ class UserManagementController extends Controller
'role' => $validated['role'],
'email' => $validated['email'],
'password' => $generatedPassword,
'status' => $validated['status'], // Send as 'active' or 'inactive'
'status' => $validated['status'],
];
Log::info('API Payload for creating user: ', $payload);
@ -140,7 +141,8 @@ class UserManagementController extends Controller
$accessToken = $user['access_token'] ?? null;
if (!$accessToken) {
return response()->json(['error' => 'Unauthorized'], 401);
Log::info('No access token found, redirecting to login from user-management show');
return redirect()->route('login')->with('error', 'Please log in to view user details.');
}
$response = Http::withHeaders([
@ -156,19 +158,19 @@ class UserManagementController extends Controller
'username' => $json['data']['username'],
'firstName' => $json['data']['firstname'],
'lastName' => $json['data']['lastname'],
'role' => 'Admin',
'role' => $json['data']['role'] == '1' ? 'Admin' : 'User',
'email' => $json['data']['email'],
'status' => $json['data']['status'] ? 'Active' : 'Inactive',
'generated_password' => $json['data']['generated_password'] ?? null,
];
return response()->json(['data' => $userData]);
return view('pages.user-management.show-user', ['user' => $userData]);
} else {
Log::warning('User not found: ', $json);
return response()->json(['error' => $json['message'] ?? 'User not found'], 404);
return redirect()->route('user.management')->with('error', $json['message'] ?? 'User not found.');
}
} catch (\Exception $e) {
Log::error('Error fetching user: ' . $e->getMessage());
return response()->json(['error' => 'An error occurred'], 500);
return redirect()->route('user.management')->with('error', 'An error occurred while fetching the user.');
}
}
@ -196,20 +198,18 @@ class UserManagementController extends Controller
'username' => $json['data']['username'],
'firstName' => $json['data']['firstname'],
'lastName' => $json['data']['lastname'],
'role' => 'Admin',
'role' => $json['data']['role'] == '1' ? 'Admin' : 'User',
'email' => $json['data']['email'],
'status' => $json['data']['status'] ? 'Active' : 'Inactive',
];
return view('pages.user-management.edit-user', [
'user' => $userData,
]);
return view('pages.user-management.edit-user', ['user' => $userData]);
} else {
Log::warning('User not found: ', $json);
return redirect()->route('user-management.index')->with('error', $json['message'] ?? 'User not found.');
return redirect()->route('user.management')->with('error', $json['message'] ?? 'User not found.');
}
} catch (\Exception $e) {
Log::error('Error fetching user for edit: ' . $e->getMessage());
return redirect()->route('user-management.index')->with('error', 'An error occurred while fetching the user.');
return redirect()->route('user.management')->with('error', 'An error occurred while fetching the user.');
}
}
@ -220,13 +220,14 @@ class UserManagementController extends Controller
$accessToken = $user['access_token'] ?? null;
if (!$accessToken) {
return response()->json(['error' => 'Unauthorized'], 401);
return redirect()->route('login')->with('error', 'Please log in to update a user.');
}
$validated = $request->validate([
'username' => 'required|string|max:255',
'firstName' => 'required|string|max:255',
'lastName' => 'required|string|max:255',
'role' => 'required|in:0,1',
'email' => 'required|email|max:255',
'password' => 'nullable|string|min:8',
'status' => 'required|in:active,inactive',
@ -236,6 +237,7 @@ class UserManagementController extends Controller
'username' => $validated['username'],
'firstname' => $validated['firstName'],
'lastname' => $validated['lastName'],
'role' => $validated['role'],
'email' => $validated['email'],
'status' => $validated['status'],
];
@ -244,6 +246,8 @@ class UserManagementController extends Controller
$data['password'] = $validated['password'];
}
Log::info('API Payload for updating user: ', $data);
$response = Http::withHeaders([
'Accept' => 'application/json',
'Authorization' => 'Bearer ' . $accessToken,
@ -253,14 +257,15 @@ class UserManagementController extends Controller
if ($response->successful()) {
Log::info('User updated successfully: ', $json);
return response()->json(['message' => $json['message'] ?? 'User updated successfully']);
return redirect()->route('user.management')
->with('success', $json['message'] ?? 'User updated successfully');
} else {
Log::error('Failed to update user: ', $json);
return response()->json(['error' => $json['message'] ?? 'Failed to update user'], 400);
return redirect()->back()->with('error', $json['message'] ?? 'Failed to update user.');
}
} catch (\Exception $e) {
Log::error('Error updating user: ' . $e->getMessage());
return response()->json(['error' => 'An error occurred'], 500);
return redirect()->back()->with('error', 'An error occurred while updating the user.');
}
}
@ -271,7 +276,7 @@ class UserManagementController extends Controller
$accessToken = $user['access_token'] ?? null;
if (!$accessToken) {
return response()->json(['error' => 'Unauthorized'], 401);
return redirect()->route('login')->with('error', 'Please log in to delete a user.');
}
$response = Http::withHeaders([
@ -283,14 +288,15 @@ class UserManagementController extends Controller
if ($response->successful()) {
Log::info('User deleted successfully: ', $json);
return response()->json(['message' => $json['message'] ?? 'User deleted successfully']);
return redirect()->route('user.management')
->with('success', $json['message'] ?? 'User deleted successfully');
} else {
Log::error('Failed to delete user: ', $json);
return response()->json(['error' => $json['message'] ?? 'Failed to delete user'], 400);
return redirect()->back()->with('error', $json['message'] ?? 'Failed to delete user.');
}
} catch (\Exception $e) {
Log::error('Error deleting user: ' . $e->getMessage());
return response()->json(['error' => 'An error occurred'], 500);
return redirect()->back()->with('error', 'An error occurred while deleting the user.');
}
}
@ -301,15 +307,17 @@ class UserManagementController extends Controller
$accessToken = $user['access_token'] ?? null;
if (!$accessToken) {
return response()->json(['error' => 'Unauthorized'], 401);
return redirect()->route('login')->with('error', 'Please log in to delete users.');
}
$uuids = $request->input('admin_uuid', []);
if (empty($uuids)) {
return response()->json(['error' => 'No users selected'], 400);
return redirect()->back()->with('error', 'No users selected for deletion.');
}
Log::info('Batch delete UUIDs: ', $uuids);
$response = Http::withHeaders([
'Accept' => 'application/json',
'Authorization' => 'Bearer ' . $accessToken,
@ -320,15 +328,16 @@ class UserManagementController extends Controller
$json = $response->json();
if ($response->successful()) {
Log::info('Batch delete successful for UUIDs: ' . implode(',', $uuids));
return response()->json(['message' => $json['message'] ?? 'Users deleted successfully']);
Log::info('Batch delete successful for UUIDs: ', $uuids);
return redirect()->route('user.management')
->with('success', $json['message'] ?? 'Users deleted successfully');
} else {
Log::error('Failed to batch delete users: ', $json);
return response()->json(['error' => $json['message'] ?? 'Failed to delete users'], 400);
return redirect()->back()->with('error', $json['message'] ?? 'Failed to delete users.');
}
} catch (\Exception $e) {
Log::error('Error in batch delete: ' . $e->getMessage());
return response()->json(['error' => 'An error occurred'], 500);
return redirect()->back()->with('error', 'An error occurred while deleting users.');
}
}
@ -339,33 +348,38 @@ class UserManagementController extends Controller
$accessToken = $user['access_token'] ?? null;
if (!$accessToken) {
return response()->json(['error' => 'Unauthorized'], 401);
return redirect()->route('login')->with('error', 'Please log in to change user status.');
}
$validated = $request->validate([
'status' => 'required|in:active,inactive',
]);
$payload = [
'admin_uuid' => $uuid,
'status' => $validated['status'],
];
Log::info('API Payload for changing status: ', $payload);
$response = Http::withHeaders([
'Accept' => 'application/json',
'Authorization' => 'Bearer ' . $accessToken,
])->post("{$this->apiBaseUrl}/cms/adminChangeStatus", [
'admin_uuid' => $uuid,
'status' => $validated['status'],
]);
])->post("{$this->apiBaseUrl}/cms/adminChangeStatus", $payload);
$json = $response->json();
if ($response->successful()) {
Log::info('Status changed successfully for UUID: ' . $uuid);
return response()->json(['message' => $json['message'] ?? 'Status updated successfully']);
return redirect()->route('user.management')
->with('success', $json['message'] ?? 'Status updated successfully');
} else {
Log::error('Failed to change status: ', $json);
return response()->json(['error' => $json['message'] ?? 'Failed to update status'], 400);
return redirect()->back()->with('error', $json['message'] ?? 'Failed to update status.');
}
} catch (\Exception $e) {
Log::error('Error changing status: ' . $e->getMessage());
return response()->json(['error' => 'An error occurred'], 500);
return redirect()->back()->with('error', 'An error occurred while changing status.');
}
}
}

View File

@ -6,9 +6,7 @@
'showAddButton' => false,
'addButtonUrl' => '#',
'showCheckboxes' => false,
'showBatchDelete' => false,
'showEditModal' => false,
'showViewModal' => false
'showBatchDelete' => false
])
<div class="card-header border-0 bg-transparent">
@ -32,7 +30,7 @@
<input type="text" class="form-control border-start-0" placeholder="Search..." id="searchInput">
</div>
</div>
<div class=open('') col-12 col-md-6 d-flex justify-content-end">
<div class="col-12 col-md-6 d-flex justify-content-end">
<button class="btn btn-outline-secondary btn-sm" id="clearFilters">
<i class="fa-solid fa-filter-circle-xmark me-1"></i> Clear Filters
</button>
@ -172,7 +170,7 @@
vertical-align: middle;
}
.table-container {
overflow-x: hidden;
overflow-x: auto;
}
.pagination-sm .page-link {
padding: 0.25rem 0.5rem;
@ -234,6 +232,7 @@
.table thead .sortable i {
font-size: 0.65rem;
}
. personally identifiable information like names, addresses, or other sensitive data.
.pagination-sm .page-link {
padding: 0.2rem 0.4rem;
font-size: 0.75rem;
@ -255,8 +254,6 @@
actions: @json($actions),
showCheckboxes: {{ json_encode($showCheckboxes) }},
showBatchDelete: {{ json_encode($showBatchDelete) }},
showEditModal: {{ json_encode($showEditModal) }},
showViewModal: {{ json_encode($showViewModal) }},
pageTitle: @json($pageTitle),
csrfToken: '{{ csrf_token() }}'
};
@ -287,22 +284,26 @@
}
tableConfig.columns.forEach(col => {
if (col.key === 'status') {
let value = row[col.key] || '';
if (col.key === 'role') {
value = row[col.key] === '1' ? 'Admin' : 'User';
} else if (col.key === 'status') {
const displayStatus = value === 'Active' ? 'Active' : 'Inactive';
rowHtml += `
<td>
<div class="dropdown">
<button class="btn btn-sm btn-outline-secondary status-btn" type="button" id="statusDropdown${row.admin_uuid}" data-bs-toggle="dropdown" aria-expanded="false">
<span class="status-text">${row[col.key]}</span>
<span class="status-text">${displayStatus}</span>
</button>
<ul class="dropdown-menu dropdown-menu-end dropdown-menu-sm" aria-labelledby="statusDropdown${row.admin_uuid}">
<li>
<a class="dropdown-item d-flex align-items-center gap-2 status-option" href="#" data-status="Active">
<a class="dropdown-item d-flex align-items-center gap-2 status-option" href="#" data-status="active">
<i class="fa-solid fa-check text-success" style="font-size: 14px;"></i>
<span>Active</span>
</a>
</li>
<li>
<a class="dropdown-item d-flex align-items-center gap-2 status-option" href="#" data-status="Inactive">
<a class="dropdown-item d-flex align-items-center gap-2 status-option" href="#" data-status="inactive">
<i class="fa-solid fa-xmark text-danger" style="font-size: 14px;"></i>
<span>Inactive</span>
</a>
@ -310,9 +311,9 @@
</ul>
</div>
</td>`;
} else {
rowHtml += `<td>${row[col.key] || ''}</td>`;
return;
}
rowHtml += `<td>${value}</td>`;
});
if (tableConfig.actions.length > 0) {
@ -320,12 +321,12 @@
tableConfig.actions.forEach(action => {
if (action === 'edit') {
rowHtml += `
<a href="{{ route('user-management.edit', '') }}/${row.admin_uuid}" class="btn btn-sm edit-btn me-1" title="Edit">
<a href="${'{{ route('user-management.edit', '') }}'}/${row.admin_uuid}" class="btn btn-sm edit-btn me-1" title="Edit">
<i class="fa-solid fa-pen-to-square"></i>
</a>`;
} else if (action === 'view') {
rowHtml += `
<a href="{{ route('user-management.show', '') }}/${row.admin_uuid}" class="btn btn-sm btn-outline-secondary me-1 view-btn" title="View">
<a href="${'{{ route('user-management.show', '') }}'}/${row.admin_uuid}" class="btn btn-sm btn-outline-secondary me-1 view-btn" title="View">
<i class="fa-solid fa-eye"></i>
</a>`;
} else if (action === 'delete') {
@ -344,6 +345,7 @@
attachEventListeners();
updateDeleteButtonState();
updateNoDataMessage();
}
function renderPagination() {
@ -393,6 +395,13 @@
pagination.appendChild(nextLi);
}
function updateNoDataMessage() {
const noDataMessage = document.getElementById('no-data-message');
if (noDataMessage) {
noDataMessage.style.display = filteredRows.length === 0 ? 'block' : 'none';
}
}
function attachEventListeners() {
// Search
const searchInput = document.getElementById('searchInput');
@ -413,7 +422,7 @@
// Sort
document.querySelectorAll('.sortable').forEach(header => {
header.addEventListener('click', function() {
const columnIndex = parseInt(this.getAttribute('data-column')) - 1;
const columnIndex = parseInt(this.getAttribute('data-column')) - (tableConfig.showCheckboxes ? 1 : 0);
const key = tableConfig.columns[columnIndex].key;
sortDirection[columnIndex] = !sortDirection[columnIndex] ? 'asc' : sortDirection[columnIndex] === 'asc' ? 'desc' : 'asc';
@ -429,12 +438,15 @@
}
filteredRows.sort((a, b) => {
const aValue = (a[key] || '').toString().toLowerCase();
const bValue = (b[key] || '').toString().toLowerCase();
let aValue = (a[key] || '').toString().toLowerCase();
let bValue = (b[key] || '').toString().toLowerCase();
if (key === 'role') {
aValue = a[key] === '1' ? 'Admin' : 'User';
bValue = b[key] === '1' ? 'Admin' : 'User';
}
return sortDirection[columnIndex] === 'asc' ? aValue.localeCompare(bValue) : bValue.localeCompare(aValue);
});
currentPage = 1;
renderTable();
renderPagination();
});
@ -480,12 +492,16 @@
const deleteSelected = document.getElementById('deleteSelected');
if (deleteSelected) {
deleteSelected.addEventListener('click', function() {
if (confirm('Are you sure you want to delete the selected items?')) {
const checkboxes = document.querySelectorAll('.rowCheckbox');
const checkboxes = document.querySelectorAll('.rowCheckbox:checked');
const selectedIds = Array.from(checkboxes)
.filter(cb => cb.checked)
.map(cb => cb.closest('tr').getAttribute('data-id'));
if (selectedIds.length === 0) {
alert('Please select at least one user to delete.');
return;
}
if (confirm('Are you sure you want to delete the selected users?')) {
axios.delete('{{ route('user-management.batchDelete') }}', {
headers: {
'X-CSRF-TOKEN': tableConfig.csrfToken
@ -499,14 +515,14 @@
originalRows = originalRows.filter(row => !selectedIds.includes(row.admin_uuid));
const maxPage = Math.ceil(filteredRows.length / rowsPerPage);
if (currentPage > maxPage) {
currentPage = maxPage || 1;
if (currentPage > maxPage && maxPage > 0) {
currentPage = maxPage;
}
renderTable();
renderPagination();
if (selectAll) selectAll.checked = false;
alert(response.data.message || 'Users deleted successfully');
window.location.reload();
}).catch(error => {
console.error('Batch delete error:', error);
alert(error.response?.data?.message || 'Failed to delete users. You may have included your own account.');
@ -524,24 +540,25 @@
const row = this.closest('tr');
const userId = row.getAttribute('data-id');
const statusText = row.querySelector('.status-text');
const originalStatus = statusText.textContent;
if (statusText) {
statusText.textContent = newStatus;
statusText.textContent = newStatus.charAt(0).toUpperCase() + newStatus.slice(1);
}
const rowData = filteredRows.find(r => r.admin_uuid === userId);
if (rowData) {
rowData.status = newStatus;
rowData.status = newStatus.charAt(0).toUpperCase() + newStatus.slice(1);
axios.post(`{{ route('user-management.changeStatus', '') }}/${userId}`, {
status: newStatus,
_token: tableConfig.csrfToken
}).then(response => {
alert(response.data.message || `User account is ${newStatus.toLowerCase()}`);
window.location.reload();
}).catch(error => {
console.error('Status update error:', error);
alert(error.response?.data?.message || 'Failed to update status. You cannot update your own account.');
// Revert status on error
statusText.textContent = rowData.status;
statusText.textContent = originalStatus;
rowData.status = originalStatus;
});
}
});
@ -552,7 +569,7 @@
button.addEventListener('click', function(e) {
e.stopPropagation();
const userId = this.getAttribute('data-id');
if (confirm('Are you sure you want to delete this item?')) {
if (confirm('Are you sure you want to delete this user?')) {
axios.delete(`{{ route('user-management.destroy', '') }}/${userId}`, {
headers: {
'X-CSRF-TOKEN': tableConfig.csrfToken
@ -563,13 +580,13 @@
originalRows = originalRows.filter(row => row.admin_uuid !== userId);
const maxPage = Math.ceil(filteredRows.length / rowsPerPage);
if (currentPage > maxPage) {
currentPage = maxPage || 1;
if (currentPage > maxPage && maxPage > 0) {
currentPage = maxPage;
}
renderTable();
renderPagination();
alert(response.data.message || 'User deleted successfully');
window.location.reload();
}).catch(error => {
console.error('Delete error:', error);
alert(error.response?.data?.message || 'Failed to delete user. You cannot delete your own account.');
@ -578,6 +595,27 @@
});
});
//Edit
document.querySelectorAll('.edit-btn').forEach(button => {
button.addEventListener('click', function(e) {
e.preventDefault();
const userId = this.getAttribute('data-id');
const href = this.getAttribute('href').replace(':id', userId);
window.location.href = href;
});
});
// View
document.querySelectorAll('.view-btn').forEach(button => {
button.addEventListener('click', function(e) {
e.preventDefault();
e.stopPropagation();
const href = this.getAttribute('href');
console.log('View redirect:', href); // Debug
window.location.href = href;
});
});
// Row click to view
document.querySelectorAll('.clickable-row').forEach(row => {
row.addEventListener('click', function(e) {
@ -585,7 +623,9 @@
return;
}
const userId = this.getAttribute('data-id');
window.location.href = `{{ route('user-management.show', '') }}/${userId}`;
const url = `{{ route('user-management.show', '') }}/${userId}`;
console.log('Row redirect:', url); // Debug
window.location.href = url;
});
});
}

View File

@ -1,30 +1,80 @@
@extends('layouts.app')
@section('page_title', 'User Management')
@section('content')
<div id="user-table">
@include('components.user-management-component', [
'pageTitle' => 'User Management',
'data' => $users,
'columns' => [
['name' => 'Username', 'key' => 'username', 'sortable' => true],
['name' => 'First Name', 'key' => 'firstName', 'sortable' => true],
['name' => 'Last Name', 'key' => 'lastName', 'sortable' => true],
['name' => 'User Role', 'key' => 'role', 'sortable' => true],
['name' => 'Email', 'key' => 'email', 'sortable' => true],
['name' => 'Status', 'key' => 'status', 'sortable' => true],
],
'actions' => ['edit', 'view', 'delete'],
'showAddButton' => true,
'addButtonUrl' => route('user-management.create'),
'showCheckboxes' => true,
'showBatchDelete' => true,
'showEditModal' => false,
'showViewModal' => false,
])
<div id="no-data-message" style="display: {{ empty($users) ? 'block' : 'none' }}; text-align: center; margin-top: 20px;">
<p>No users found.</p>
<div class="container-fluid py-4">
<div class="row">
<div class="col-12">
<div class="card">
<div class="card-header border-0 bg-transparent">
<div class="d-flex justify-content-between">
<h5 class="mb-0">User Management</h5>
<a href="{{ route('user-management.create') }}" class="btn btn-primary">Add User</a>
</div>
</div>
<div class="card-body">
@if (session('success'))
<div class="alert alert-success">{{ session('success') }}</div>
@endif
@if (session('error'))
<div class="alert alert-danger">{{ session('error') }}</div>
@endif
<form id="batchDeleteForm" action="{{ route('user-management.batchDelete') }}" method="POST">
@csrf
@method('DELETE')
<div class="mb-3">
<button type="submit" class="btn btn-danger" onclick="return confirm('Are you sure you want to delete selected users?')">Delete Selected</button>
</div>
<table class="table table-bordered">
<thead>
<tr>
<th><input type="checkbox" id="selectAll"></th>
<th>Username</th>
<th>Name</th>
<th>Email</th>
<th>Role</th>
<th>Status</th>
<th>Actions</th>
</tr>
</thead>
<tbody>
@forelse ($users as $user)
<tr>
<td><input type="checkbox" name="admin_uuid[]" value="{{ $user['admin_uuid'] }}"></td>
<td>{{ $user['username'] }}</td>
<td>{{ $user['firstName'] }} {{ $user['lastName'] }}</td>
<td>{{ $user['email'] }}</td>
<td>{{ $user['role'] }}</td>
<td>{{ $user['status'] }}</td>
<td>
<a href="{{ route('user-management.show', $user['admin_uuid']) }}" class="btn btn-sm btn-info">View</a>
<a href="{{ route('user-management.edit', $user['admin_uuid']) }}" class="btn btn-sm btn-primary">Edit</a>
<form action="{{ route('user-management.destroy', $user['admin_uuid']) }}" method="POST" style="display:inline;" onsubmit="return confirm('Are you sure you want to delete this user?');">
@csrf
@method('DELETE')
<button type="submit" class="btn btn-sm btn-danger">Delete</button>
</form>
</td>
</tr>
@empty
<tr>
<td colspan="7" class="text-center">No users found.</td>
</tr>
@endforelse
</tbody>
</table>
</form>
</div>
</div>
</div>
</div>
</div>
@endsection
@section('scripts')
<script>
document.getElementById('selectAll').addEventListener('change', function() {
let checkboxes = document.querySelectorAll('input[name="admin_uuid[]"]');
checkboxes.forEach(checkbox => checkbox.checked = this.checked);
});
</script>
@endsection

View File

@ -1,3 +1,4 @@
@extends('layouts.app')
@section('content')
@ -14,28 +15,28 @@
@method('PUT')
<div class="mb-3">
<label class="form-label">Username</label>
<input type="text" class="form-control" id="username" name="username" value="{{ $user['username'] }}" required>
<input type="text" class="form-control" id="username" name="username" value="{{ old('username', $user['username']) }}" required>
@error('username')
<span class="text-danger">{{ $message }}</span>
@enderror
</div>
<div class="mb-3">
<label class="form-label">First Name</label>
<input type="text" class="form-control" id="firstName" name="firstName" value="{{ $user['firstName'] }}" required>
<input type="text" class="form-control" id="firstName" name="firstName" value="{{ old('firstName', $user['firstName']) }}" required>
@error('firstName')
<span class="text-danger">{{ $message }}</span>
@enderror
</div>
<div class="mb-3">
<label class="form-label">Last Name</label>
<input type="text" class="form-control" id="lastName" name="lastName" value="{{ $user['lastName'] }}" required>
<input type="text" class="form-control" id="lastName" name="lastName" value="{{ old('lastName', $user['lastName']) }}" required>
@error('lastName')
<span class="text-danger">{{ $message }}</span>
@enderror
</div>
<div class="mb-3">
<label class="form-label">Email</label>
<input type="email" class="form-control" id="email" name="email" value="{{ $user['email'] }}" required>
<input type="email" class="form-control" id="email" name="email" value="{{ old('email', $user['email']) }}" required>
@error('email')
<span class="text-danger">{{ $message }}</span>
@enderror
@ -47,18 +48,28 @@
<span class="text-danger">{{ $message }}</span>
@enderror
</div>
<div class="mb-3">
<label class="form-label">User Role</label>
<select class="form-control" id="role" name="role" required>
<option value="1" {{ $user['role'] == 'Admin' ? 'selected' : '' }}>Admin</option>
<option value="0" {{ $user['role'] != 'Admin' ? 'selected' : '' }}>User</option>
</select>
@error('role')
<span class="text-danger">{{ $message }}</span>
@enderror
</div>
<div class="mb-3">
<label class="form-label">Status</label>
<select class="form-control" id="status" name="status" required>
<option value="Active" {{ $user['status'] === 'Active' ? 'selected' : '' }}>Active</option>
<option value="Inactive" {{ $user['status'] === 'Inactive' ? 'selected' : '' }}>Inactive</option>
<option value="active" {{ $user['status'] == 'Active' ? 'selected' : '' }}>Active</option>
<option value="inactive" {{ $user['status'] == 'Inactive' ? 'selected' : '' }}>Inactive</option>
</select>
@error('status')
<span class="text-danger">{{ $message }}</span>
@enderror
</div>
<div class="text-end">
<a href="{{ route('user-management.index') }}" class="btn btn-secondary">Cancel</a>
<a href="{{ route('user.management') }}" class="btn btn-secondary">Cancel</a>
<button type="submit" class="btn btn-primary">Update User</button>
</div>
</form>
@ -67,27 +78,4 @@
</div>
</div>
</div>
@push('scripts')
<script>
document.getElementById('editUserForm').addEventListener('submit', async function(e) {
e.preventDefault();
const form = this;
const formData = new FormData(form);
try {
const response = await axios.post(form.action, formData, {
headers: {
'X-CSRF-TOKEN': '{{ csrf_token() }}'
}
});
alert(response.data.message || 'User updated successfully');
window.location.href = '{{ route('user-management.index') }}';
} catch (error) {
console.error('Update error:', error);
alert(error.response?.data?.error || 'Failed to update user');
}
});
</script>
@endpush
@endsection

View File

@ -1,82 +1,52 @@
```blade
@extends('layouts.app')
@section('page_title', 'View User')
@section('content')
<div class="container mt-4">
<div class="container-fluid py-4">
<div class="row justify-content-center">
<div class="col-md-8">
<div class="card">
<div class="card-header border-0 bg-transparent">
<h5 class="mb-0 fw-bold text-dark">View User Details</h5>
<h5 class="mb-0">View User Details</h5>
</div>
<div class="card-body">
<div class="view-details">
<p><strong>Username:</strong> <span>{{ $user['username'] }}</span></p>
<p><strong>First Name:</strong> <span>{{ $user['firstName'] }}</span></p>
<p><strong>Last Name:</strong> <span>{{ $user['lastName'] }}</span></p>
<p><strong>User Role:</strong> <span>{{ $user['role'] }}</span></p>
<p><strong>Email:</strong> <span>{{ $user['email'] }}</span></p>
<p><strong>Status:</strong> <span>{{ $user['status'] }}</span></p>
<div class="mb-3">
<label class="form-label">Username</label>
<input type="text" class="form-control" value="{{ $user['username'] }}" readonly>
</div>
<div class="mb-3">
<label class="form-label">First Name</label>
<input type="text" class="form-control" value="{{ $user['firstName'] }}" readonly>
</div>
<div class="mb-3">
<label class="form-label">Last Name</label>
<input type="text" class="form-control" value="{{ $user['lastName'] }}" readonly>
</div>
<div class="mb-3">
<label class="form-label">Email</label>
<input type="email" class="form-control" value="{{ $user['email'] }}" readonly>
</div>
<div class="mb-3">
<label class="form-label">User Role</label>
<input type="text" class="form-control" value="{{ $user['role'] }}" readonly>
</div>
<div class="mb-3">
<label class="form-label">Status</label>
<input type="text" class="form-control" value="{{ $user['status'] }}" readonly>
</div>
@if($user['generated_password'])
<div class="mb-3">
<label class="form-label">Generated Password</label>
<input type="text" class="form-control" value="{{ $user['generated_password'] }}" readonly>
</div>
@endif
<div class="text-end">
<a href="{{ route('user.management') }}" class="btn btn-primary">Back to Users</a>
</div>
</div>
<div class="d-flex justify-content-end mt-4">
<a href="{{ route('user-management.edit', $user['admin_uuid']) }}" class="btn btn-primary me-2">
<i class="fa-solid fa-pen-to-square me-1"></i> Edit
</a>
<a href="{{ route('user-management.index') }}" class="btn btn-outline-secondary">
<i class="fa-solid fa-arrow-left me-1"></i> Back
</a>
</div>
</div>
</div>
</div>
<style>
.card,
.btn {
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
font-weight: 400;
line-height: 1.5;
}
.card-header h5 {
font-weight: 500;
}
.card {
border-radius: 10px;
}
.card-header {
background-color: transparent;
}
.btn-primary {
background-color: #E74610;
border-color: #E74610;
}
.btn-primary:hover {
background-color: #E74610;
border-color: #E74610;
}
.view-details p {
margin-bottom: 0.75rem;
font-size: 0.9rem;
}
.view-details strong {
display: inline-block;
width: 120px;
font-weight: 500;
color: #343a40;
}
.view-details span {
color: #495057;
}
@media (max-width: 576px) {
.view-details p {
font-size: 0.85rem;
}
.view-details strong {
width: 100px;
}
.btn {
padding: 0.2rem 0.4rem;
font-size: 0.75rem;
}
}
</style>
@endsection
```