add-user and delete functions works
This commit is contained in:
parent
93fb6eff66
commit
bab9e0cd3e
|
|
@ -0,0 +1,59 @@
|
|||
<?php
|
||||
namespace App\Http\Controllers;
|
||||
|
||||
use Illuminate\Support\Facades\Http;
|
||||
use Illuminate\Support\Facades\Session;
|
||||
use Illuminate\Support\Facades\Log;
|
||||
|
||||
class PhotoSliderViewController extends Controller
|
||||
{
|
||||
protected $apiBaseUrl;
|
||||
|
||||
public function __construct()
|
||||
{
|
||||
$this->apiBaseUrl = config('services.api.base_url'); // put your base URL in config/services.php
|
||||
}
|
||||
|
||||
public function index()
|
||||
{
|
||||
try {
|
||||
$user = Session::get('user');
|
||||
$accessToken = $user['access_token'] ?? null;
|
||||
|
||||
if (!$accessToken) {
|
||||
Log::info('No access token found, redirecting to login from photo-slider');
|
||||
return redirect()->route('login')->with('error', 'Please log in to view photo sliders.');
|
||||
}
|
||||
|
||||
$response = Http::withHeaders([
|
||||
'Accept' => 'application/json',
|
||||
'Authorization' => 'Bearer ' . $accessToken,
|
||||
])->get("{$this->apiBaseUrl}/cms/photoSlider");
|
||||
|
||||
$json = $response->json();
|
||||
Log::info('Photo Slider API Response: ', $json);
|
||||
|
||||
if ($response->successful() && isset($json['data']) && is_array($json['data'])) {
|
||||
$sliders = array_map(function ($slider) {
|
||||
return [
|
||||
'id' => $slider['id'],
|
||||
'title' => $slider['title'],
|
||||
'type' => $slider['type'],
|
||||
'startDate' => $slider['start_date'],
|
||||
'endDate' => $slider['end_date'],
|
||||
];
|
||||
}, $json['data']);
|
||||
|
||||
return view('pages.home page.photo-slider', [
|
||||
'sliders' => $sliders,
|
||||
]);
|
||||
} else {
|
||||
Log::warning('No slider data found or invalid API response: ', $json);
|
||||
return view('pages.home page.photo-slider', ['sliders' => []]);
|
||||
}
|
||||
} catch (\Exception $e) {
|
||||
Log::error('Error fetching photo slider data: ' . $e->getMessage());
|
||||
return view('pages.home page.photo-slider', ['sliders' => []]);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -9,15 +9,11 @@ use Illuminate\Support\Facades\Session;
|
|||
|
||||
class UserManagementController extends Controller
|
||||
{
|
||||
protected $apiBaseUrl = 'http://192.168.100.6:8081/api'; // Same as in AuthController
|
||||
protected $apiBaseUrl = 'http://192.168.100.6:8081/api';
|
||||
|
||||
/**
|
||||
* Display the user management page with user data
|
||||
*/
|
||||
public function index()
|
||||
{
|
||||
try {
|
||||
// Fetch the access token from the session
|
||||
$user = Session::get('user');
|
||||
$accessToken = $user['access_token'] ?? null;
|
||||
|
||||
|
|
@ -26,7 +22,6 @@ class UserManagementController extends Controller
|
|||
return redirect()->route('login')->with('error', 'Please log in to view user management.');
|
||||
}
|
||||
|
||||
// Make the API call to fetch admin users
|
||||
$response = Http::withHeaders([
|
||||
'Accept' => 'application/json',
|
||||
'Authorization' => 'Bearer ' . $accessToken,
|
||||
|
|
@ -37,34 +32,340 @@ class UserManagementController extends Controller
|
|||
Log::info('User Management API Response: ', $json);
|
||||
|
||||
if ($response->successful() && isset($json['data']) && is_array($json['data'])) {
|
||||
// Transform the API response into the format expected by the table component
|
||||
$users = array_map(function ($admin) {
|
||||
return [
|
||||
|
||||
'admin_uuid' => $admin['admin_uuid'],
|
||||
'username' => $admin['username'],
|
||||
'firstName' => $admin['firstname'],
|
||||
'lastName' => $admin['lastname'],
|
||||
'role' => 'Admin', // Adjust if the API provides role data
|
||||
'role' => 'Admin',
|
||||
'email' => $admin['email'],
|
||||
// 'status' => $admin['is_active'] ? 'Active' : 'Inactive',
|
||||
'status' => $admin['status'] ? 'Active' : 'Inactive',
|
||||
];
|
||||
}, $json['data']);
|
||||
|
||||
// Pass the transformed data to the view
|
||||
return view('pages.user-management', [
|
||||
'users' => $users,
|
||||
]);
|
||||
} else {
|
||||
Log::warning('No user data found or invalid API response: ', $json);
|
||||
return view('pages.user-management', [
|
||||
'users' => [], // Pass an empty array if no data
|
||||
'users' => [],
|
||||
]);
|
||||
}
|
||||
} catch (\Exception $e) {
|
||||
Log::error('Error fetching user data: ' . $e->getMessage());
|
||||
return view('pages.user-management', [
|
||||
'users' => [], // Pass an empty array on error
|
||||
'users' => [],
|
||||
]);
|
||||
}
|
||||
}
|
||||
|
||||
public function create()
|
||||
{
|
||||
return view('pages.user-management.add-user');
|
||||
}
|
||||
|
||||
public function store(Request $request)
|
||||
{
|
||||
try {
|
||||
$user = Session::get('user');
|
||||
$accessToken = $user['access_token'] ?? null;
|
||||
|
||||
if (!$accessToken) {
|
||||
return redirect()->route('login')->with('error', 'Please log in to add 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',
|
||||
'status' => 'required|in:active,inactive',
|
||||
]);
|
||||
|
||||
// Generate password via API
|
||||
$passwordResponse = Http::withHeaders([
|
||||
'Accept' => 'application/json',
|
||||
'Authorization' => 'Bearer ' . $accessToken,
|
||||
])->post("{$this->apiBaseUrl}/cms/generatePassword");
|
||||
|
||||
$passwordJson = $passwordResponse->json();
|
||||
|
||||
if (!$passwordResponse->successful() || !isset($passwordJson['data']['password'])) {
|
||||
Log::error('Failed to generate password: ', $passwordJson);
|
||||
return redirect()->back()->with('error', 'Failed to generate password.');
|
||||
}
|
||||
|
||||
$generatedPassword = $passwordJson['data']['password'];
|
||||
|
||||
$payload = [
|
||||
'username' => $validated['username'],
|
||||
'firstname' => $validated['firstName'],
|
||||
'lastname' => $validated['lastName'],
|
||||
'role' => $validated['role'],
|
||||
'email' => $validated['email'],
|
||||
'password' => $generatedPassword,
|
||||
'status' => $validated['status'], // Send as 'active' or 'inactive'
|
||||
];
|
||||
|
||||
Log::info('API Payload for creating user: ', $payload);
|
||||
|
||||
$response = Http::withHeaders([
|
||||
'Accept' => 'application/json',
|
||||
'Authorization' => 'Bearer ' . $accessToken,
|
||||
])->post("{$this->apiBaseUrl}/cms/admin", $payload);
|
||||
|
||||
$json = $response->json();
|
||||
|
||||
if ($response->successful()) {
|
||||
Log::info('User created successfully: ', $json);
|
||||
return redirect()->route('user.management')
|
||||
->with('success', "User added successfully. Generated password: {$generatedPassword}");
|
||||
} else {
|
||||
Log::error('Failed to create user: ', $json);
|
||||
return redirect()->back()->with('error', $json['message'] ?? 'Failed to add user.');
|
||||
}
|
||||
} catch (\Exception $e) {
|
||||
Log::error('Error creating user: ' . $e->getMessage());
|
||||
return redirect()->back()->with('error', 'An error occurred while adding the user.');
|
||||
}
|
||||
}
|
||||
|
||||
public function show($uuid)
|
||||
{
|
||||
try {
|
||||
$user = Session::get('user');
|
||||
$accessToken = $user['access_token'] ?? null;
|
||||
|
||||
if (!$accessToken) {
|
||||
return response()->json(['error' => 'Unauthorized'], 401);
|
||||
}
|
||||
|
||||
$response = Http::withHeaders([
|
||||
'Accept' => 'application/json',
|
||||
'Authorization' => 'Bearer ' . $accessToken,
|
||||
])->get("{$this->apiBaseUrl}/cms/admin/{$uuid}");
|
||||
|
||||
$json = $response->json();
|
||||
|
||||
if ($response->successful() && isset($json['data'])) {
|
||||
$userData = [
|
||||
'admin_uuid' => $json['data']['admin_uuid'],
|
||||
'username' => $json['data']['username'],
|
||||
'firstName' => $json['data']['firstname'],
|
||||
'lastName' => $json['data']['lastname'],
|
||||
'role' => 'Admin',
|
||||
'email' => $json['data']['email'],
|
||||
'status' => $json['data']['status'] ? 'Active' : 'Inactive',
|
||||
'generated_password' => $json['data']['generated_password'] ?? null,
|
||||
];
|
||||
return response()->json(['data' => $userData]);
|
||||
} else {
|
||||
Log::warning('User not found: ', $json);
|
||||
return response()->json(['error' => $json['message'] ?? 'User not found'], 404);
|
||||
}
|
||||
} catch (\Exception $e) {
|
||||
Log::error('Error fetching user: ' . $e->getMessage());
|
||||
return response()->json(['error' => 'An error occurred'], 500);
|
||||
}
|
||||
}
|
||||
|
||||
public function edit($uuid)
|
||||
{
|
||||
try {
|
||||
$user = Session::get('user');
|
||||
$accessToken = $user['access_token'] ?? null;
|
||||
|
||||
if (!$accessToken) {
|
||||
Log::info('No access token found, redirecting to login from user-management edit');
|
||||
return redirect()->route('login')->with('error', 'Please log in to edit a user.');
|
||||
}
|
||||
|
||||
$response = Http::withHeaders([
|
||||
'Accept' => 'application/json',
|
||||
'Authorization' => 'Bearer ' . $accessToken,
|
||||
])->get("{$this->apiBaseUrl}/cms/admin/{$uuid}");
|
||||
|
||||
$json = $response->json();
|
||||
|
||||
if ($response->successful() && isset($json['data'])) {
|
||||
$userData = [
|
||||
'admin_uuid' => $json['data']['admin_uuid'],
|
||||
'username' => $json['data']['username'],
|
||||
'firstName' => $json['data']['firstname'],
|
||||
'lastName' => $json['data']['lastname'],
|
||||
'role' => 'Admin',
|
||||
'email' => $json['data']['email'],
|
||||
'status' => $json['data']['status'] ? 'Active' : 'Inactive',
|
||||
];
|
||||
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.');
|
||||
}
|
||||
} 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.');
|
||||
}
|
||||
}
|
||||
|
||||
public function update(Request $request, $uuid)
|
||||
{
|
||||
try {
|
||||
$user = Session::get('user');
|
||||
$accessToken = $user['access_token'] ?? null;
|
||||
|
||||
if (!$accessToken) {
|
||||
return response()->json(['error' => 'Unauthorized'], 401);
|
||||
}
|
||||
|
||||
$validated = $request->validate([
|
||||
'username' => 'required|string|max:255',
|
||||
'firstName' => 'required|string|max:255',
|
||||
'lastName' => 'required|string|max:255',
|
||||
'email' => 'required|email|max:255',
|
||||
'password' => 'nullable|string|min:8',
|
||||
'status' => 'required|in:active,inactive',
|
||||
]);
|
||||
|
||||
$data = [
|
||||
'username' => $validated['username'],
|
||||
'firstname' => $validated['firstName'],
|
||||
'lastname' => $validated['lastName'],
|
||||
'email' => $validated['email'],
|
||||
'status' => $validated['status'],
|
||||
];
|
||||
|
||||
if (!empty($validated['password'])) {
|
||||
$data['password'] = $validated['password'];
|
||||
}
|
||||
|
||||
$response = Http::withHeaders([
|
||||
'Accept' => 'application/json',
|
||||
'Authorization' => 'Bearer ' . $accessToken,
|
||||
])->put("{$this->apiBaseUrl}/cms/admin/{$uuid}", $data);
|
||||
|
||||
$json = $response->json();
|
||||
|
||||
if ($response->successful()) {
|
||||
Log::info('User updated successfully: ', $json);
|
||||
return response()->json(['message' => $json['message'] ?? 'User updated successfully']);
|
||||
} else {
|
||||
Log::error('Failed to update user: ', $json);
|
||||
return response()->json(['error' => $json['message'] ?? 'Failed to update user'], 400);
|
||||
}
|
||||
} catch (\Exception $e) {
|
||||
Log::error('Error updating user: ' . $e->getMessage());
|
||||
return response()->json(['error' => 'An error occurred'], 500);
|
||||
}
|
||||
}
|
||||
|
||||
public function destroy($uuid)
|
||||
{
|
||||
try {
|
||||
$user = Session::get('user');
|
||||
$accessToken = $user['access_token'] ?? null;
|
||||
|
||||
if (!$accessToken) {
|
||||
return response()->json(['error' => 'Unauthorized'], 401);
|
||||
}
|
||||
|
||||
$response = Http::withHeaders([
|
||||
'Accept' => 'application/json',
|
||||
'Authorization' => 'Bearer ' . $accessToken,
|
||||
])->delete("{$this->apiBaseUrl}/cms/admin/{$uuid}");
|
||||
|
||||
$json = $response->json();
|
||||
|
||||
if ($response->successful()) {
|
||||
Log::info('User deleted successfully: ', $json);
|
||||
return response()->json(['message' => $json['message'] ?? 'User deleted successfully']);
|
||||
} else {
|
||||
Log::error('Failed to delete user: ', $json);
|
||||
return response()->json(['error' => $json['message'] ?? 'Failed to delete user'], 400);
|
||||
}
|
||||
} catch (\Exception $e) {
|
||||
Log::error('Error deleting user: ' . $e->getMessage());
|
||||
return response()->json(['error' => 'An error occurred'], 500);
|
||||
}
|
||||
}
|
||||
|
||||
public function batchDelete(Request $request)
|
||||
{
|
||||
try {
|
||||
$user = Session::get('user');
|
||||
$accessToken = $user['access_token'] ?? null;
|
||||
|
||||
if (!$accessToken) {
|
||||
return response()->json(['error' => 'Unauthorized'], 401);
|
||||
}
|
||||
|
||||
$uuids = $request->input('admin_uuid', []);
|
||||
|
||||
if (empty($uuids)) {
|
||||
return response()->json(['error' => 'No users selected'], 400);
|
||||
}
|
||||
|
||||
$response = Http::withHeaders([
|
||||
'Accept' => 'application/json',
|
||||
'Authorization' => 'Bearer ' . $accessToken,
|
||||
])->delete("{$this->apiBaseUrl}/cms/adminBatchDelete", [
|
||||
'admin_uuid' => $uuids,
|
||||
]);
|
||||
|
||||
$json = $response->json();
|
||||
|
||||
if ($response->successful()) {
|
||||
Log::info('Batch delete successful for UUIDs: ' . implode(',', $uuids));
|
||||
return response()->json(['message' => $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);
|
||||
}
|
||||
} catch (\Exception $e) {
|
||||
Log::error('Error in batch delete: ' . $e->getMessage());
|
||||
return response()->json(['error' => 'An error occurred'], 500);
|
||||
}
|
||||
}
|
||||
|
||||
public function changeStatus(Request $request, $uuid)
|
||||
{
|
||||
try {
|
||||
$user = Session::get('user');
|
||||
$accessToken = $user['access_token'] ?? null;
|
||||
|
||||
if (!$accessToken) {
|
||||
return response()->json(['error' => 'Unauthorized'], 401);
|
||||
}
|
||||
|
||||
$validated = $request->validate([
|
||||
'status' => 'required|in:active,inactive',
|
||||
]);
|
||||
|
||||
$response = Http::withHeaders([
|
||||
'Accept' => 'application/json',
|
||||
'Authorization' => 'Bearer ' . $accessToken,
|
||||
])->post("{$this->apiBaseUrl}/cms/adminChangeStatus", [
|
||||
'admin_uuid' => $uuid,
|
||||
'status' => $validated['status'],
|
||||
]);
|
||||
|
||||
$json = $response->json();
|
||||
|
||||
if ($response->successful()) {
|
||||
Log::info('Status changed successfully for UUID: ' . $uuid);
|
||||
return response()->json(['message' => $json['message'] ?? 'Status updated successfully']);
|
||||
} else {
|
||||
Log::error('Failed to change status: ', $json);
|
||||
return response()->json(['error' => $json['message'] ?? 'Failed to update status'], 400);
|
||||
}
|
||||
} catch (\Exception $e) {
|
||||
Log::error('Error changing status: ' . $e->getMessage());
|
||||
return response()->json(['error' => 'An error occurred'], 500);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,607 @@
|
|||
@props([
|
||||
'pageTitle' => '',
|
||||
'data' => [],
|
||||
'columns' => [],
|
||||
'actions' => [],
|
||||
'showAddButton' => false,
|
||||
'addButtonUrl' => '#',
|
||||
'showCheckboxes' => false,
|
||||
'showBatchDelete' => false,
|
||||
'showEditModal' => false,
|
||||
'showViewModal' => false
|
||||
])
|
||||
|
||||
<div class="card-header border-0 bg-transparent">
|
||||
<div class="d-flex justify-content-between align-items-center">
|
||||
<h5 class="mb-0 fw-bold text-dark">{{ $pageTitle }}</h5>
|
||||
@if ($showAddButton)
|
||||
<a href="{{ $addButtonUrl }}" class="btn btn-primary btn-sm px-3">
|
||||
<i class="fa-solid fa-plus me-1"></i> Add {{ $pageTitle }}
|
||||
</a>
|
||||
@endif
|
||||
</div>
|
||||
</div>
|
||||
<div class="card-body">
|
||||
<!-- Search and Filters -->
|
||||
<div class="row mb-3 align-items-center">
|
||||
<div class="col-12 col-md-6 mb-2 mb-md-0">
|
||||
<div class="input-group input-group-sm">
|
||||
<span class="input-group-text bg-light border-end-0">
|
||||
<i class="fa-solid fa-magnifying-glass text-muted"></i>
|
||||
</span>
|
||||
<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">
|
||||
<button class="btn btn-outline-secondary btn-sm" id="clearFilters">
|
||||
<i class="fa-solid fa-filter-circle-xmark me-1"></i> Clear Filters
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Table -->
|
||||
<div class="table-container">
|
||||
<table class="table table-hover align-middle">
|
||||
<thead class="table-light">
|
||||
<tr>
|
||||
@if ($showCheckboxes)
|
||||
<th class="text-center" style="width: 40px;">
|
||||
<input type="checkbox" id="selectAll">
|
||||
</th>
|
||||
@endif
|
||||
@foreach ($columns as $index => $column)
|
||||
<th class="{{ $column['sortable'] ? 'sortable' : '' }}" data-column="{{ $index + 1 }}">
|
||||
{{ $column['name'] }}
|
||||
@if ($column['sortable'])
|
||||
<i class="fa-solid fa-sort"></i>
|
||||
@endif
|
||||
</th>
|
||||
@endforeach
|
||||
@if (!empty($actions))
|
||||
<th class="text-center" style="width: 120px;">Action</th>
|
||||
@endif
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody id="tableBody"></tbody>
|
||||
</table>
|
||||
</div>
|
||||
|
||||
<!-- Batch Delete and Pagination -->
|
||||
<div class="d-flex justify-content-between align-items-center mt-4">
|
||||
@if ($showBatchDelete)
|
||||
<div>
|
||||
<button class="btn btn-danger btn-sm" id="deleteSelected" disabled>
|
||||
<i class="fa-solid fa-trash-can me-1"></i> Delete Selected
|
||||
</button>
|
||||
</div>
|
||||
@endif
|
||||
<nav aria-label="Page navigation">
|
||||
<ul class="pagination pagination-sm" id="pagination"></ul>
|
||||
</nav>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<style>
|
||||
.card,
|
||||
.table,
|
||||
.btn,
|
||||
.form-control,
|
||||
.input-group-text {
|
||||
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;
|
||||
}
|
||||
.table thead th {
|
||||
font-weight: 500;
|
||||
font-size: 0.8rem;
|
||||
}
|
||||
.form-label {
|
||||
font-weight: 500;
|
||||
font-size: 0.9rem;
|
||||
}
|
||||
.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;
|
||||
}
|
||||
.sortable {
|
||||
cursor: pointer;
|
||||
}
|
||||
.sortable:hover {
|
||||
background-color: #f1f3f5;
|
||||
}
|
||||
.table {
|
||||
font-size: 0.85rem;
|
||||
width: 100%;
|
||||
table-layout: auto;
|
||||
}
|
||||
.table th,
|
||||
.table td {
|
||||
padding: 0.5rem;
|
||||
vertical-align: middle;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
.table th:first-child,
|
||||
.table td:first-child {
|
||||
width: 40px;
|
||||
text-align: center;
|
||||
}
|
||||
.table th:last-child,
|
||||
.table td:last-child {
|
||||
width: 120px;
|
||||
text-align: center;
|
||||
}
|
||||
.table td:nth-child(5),
|
||||
.table th:nth-child(5) {
|
||||
width: 100px;
|
||||
}
|
||||
.table td:nth-child(6),
|
||||
.table th:nth-child(6) {
|
||||
max-width: 200px;
|
||||
}
|
||||
.table td:nth-child(7),
|
||||
.table th:nth-child(7) {
|
||||
width: 120px;
|
||||
}
|
||||
.status-btn {
|
||||
font-size: 0.75rem;
|
||||
padding: 0.2rem 0.5rem;
|
||||
}
|
||||
.dropdown-menu-sm {
|
||||
min-width: 120px;
|
||||
}
|
||||
.dropdown-item {
|
||||
font-size: 0.85rem;
|
||||
}
|
||||
.table thead .sortable i {
|
||||
font-size: 0.7rem;
|
||||
vertical-align: middle;
|
||||
}
|
||||
.table-container {
|
||||
overflow-x: hidden;
|
||||
}
|
||||
.pagination-sm .page-link {
|
||||
padding: 0.25rem 0.5rem;
|
||||
font-size: 0.85rem;
|
||||
border-color: #E74610;
|
||||
color: #E74610;
|
||||
}
|
||||
.pagination-sm .page-item.active .page-link {
|
||||
background-color: #E74610;
|
||||
border-color: #E74610;
|
||||
color: #fff;
|
||||
}
|
||||
.pagination-sm .page-link:hover {
|
||||
background-color: #E74610;
|
||||
border-color: #E74610;
|
||||
color: #fff;
|
||||
}
|
||||
.pagination-sm .page-item.disabled .page-link {
|
||||
border-color: #dee2e6;
|
||||
color: #6c757d;
|
||||
}
|
||||
.edit-btn {
|
||||
border-color: #E74610;
|
||||
color: #E74610;
|
||||
}
|
||||
.edit-btn:hover {
|
||||
background-color: #E74610;
|
||||
border-color: #E74610;
|
||||
color: #fff;
|
||||
}
|
||||
.table-hover tbody tr:hover {
|
||||
cursor: pointer;
|
||||
background-color: #f8f9fa;
|
||||
}
|
||||
@media (max-width: 576px) {
|
||||
.table {
|
||||
font-size: 0.75rem;
|
||||
}
|
||||
.table thead th {
|
||||
font-size: 0.75rem;
|
||||
}
|
||||
.table th,
|
||||
.table td {
|
||||
padding: 0.3rem;
|
||||
}
|
||||
.btn-sm {
|
||||
padding: 0.2rem 0.4rem;
|
||||
font-size: 0.75rem;
|
||||
}
|
||||
.input-group-sm>.form-control {
|
||||
font-size: 0.75rem;
|
||||
}
|
||||
.status-btn {
|
||||
font-size: 0.65rem;
|
||||
}
|
||||
.dropdown-item {
|
||||
font-size: 0.75rem;
|
||||
}
|
||||
.table thead .sortable i {
|
||||
font-size: 0.65rem;
|
||||
}
|
||||
.pagination-sm .page-link {
|
||||
padding: 0.2rem 0.4rem;
|
||||
font-size: 0.75rem;
|
||||
}
|
||||
.table td:nth-child(6) {
|
||||
max-width: 150px;
|
||||
}
|
||||
.form-control,
|
||||
.form-select {
|
||||
font-size: 0.85rem;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
<script>
|
||||
const tableConfig = {
|
||||
data: @json($data),
|
||||
columns: @json($columns),
|
||||
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() }}'
|
||||
};
|
||||
|
||||
const rowsPerPage = 5;
|
||||
let currentPage = 1;
|
||||
let filteredRows = [...tableConfig.data];
|
||||
let originalRows = [...tableConfig.data].map(row => ({ ...row }));
|
||||
let sortDirection = {};
|
||||
|
||||
function renderTable() {
|
||||
const tableBody = document.getElementById('tableBody');
|
||||
if (!tableBody) return;
|
||||
tableBody.innerHTML = '';
|
||||
|
||||
const start = (currentPage - 1) * rowsPerPage;
|
||||
const end = start + rowsPerPage;
|
||||
const paginatedRows = filteredRows.slice(start, end);
|
||||
|
||||
paginatedRows.forEach(row => {
|
||||
const tr = document.createElement('tr');
|
||||
tr.setAttribute('data-id', row.admin_uuid);
|
||||
tr.classList.add('clickable-row');
|
||||
let rowHtml = '';
|
||||
|
||||
if (tableConfig.showCheckboxes) {
|
||||
rowHtml += `<td class="text-center"><input type="checkbox" class="rowCheckbox"></td>`;
|
||||
}
|
||||
|
||||
tableConfig.columns.forEach(col => {
|
||||
if (col.key === 'status') {
|
||||
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>
|
||||
</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">
|
||||
<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">
|
||||
<i class="fa-solid fa-xmark text-danger" style="font-size: 14px;"></i>
|
||||
<span>Inactive</span>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</td>`;
|
||||
} else {
|
||||
rowHtml += `<td>${row[col.key] || ''}</td>`;
|
||||
}
|
||||
});
|
||||
|
||||
if (tableConfig.actions.length > 0) {
|
||||
rowHtml += `<td class="text-center">`;
|
||||
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">
|
||||
<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">
|
||||
<i class="fa-solid fa-eye"></i>
|
||||
</a>`;
|
||||
} else if (action === 'delete') {
|
||||
rowHtml += `
|
||||
<button class="btn btn-sm btn-outline-danger delete-btn" title="Delete" data-id="${row.admin_uuid}">
|
||||
<i class="fa-solid fa-trash-can"></i>
|
||||
</button>`;
|
||||
}
|
||||
});
|
||||
rowHtml += `</td>`;
|
||||
}
|
||||
|
||||
tr.innerHTML = rowHtml;
|
||||
tableBody.appendChild(tr);
|
||||
});
|
||||
|
||||
attachEventListeners();
|
||||
updateDeleteButtonState();
|
||||
}
|
||||
|
||||
function renderPagination() {
|
||||
const pagination = document.getElementById('pagination');
|
||||
if (!pagination) return;
|
||||
pagination.innerHTML = '';
|
||||
|
||||
const pageCount = Math.ceil(filteredRows.length / rowsPerPage);
|
||||
|
||||
const prevLi = document.createElement('li');
|
||||
prevLi.className = `page-item ${currentPage === 1 ? 'disabled' : ''}`;
|
||||
prevLi.innerHTML = `<a class="page-link" href="#" aria-label="Previous"><span aria-hidden="true">«</span></a>`;
|
||||
prevLi.addEventListener('click', (e) => {
|
||||
e.preventDefault();
|
||||
if (currentPage > 1) {
|
||||
currentPage--;
|
||||
renderTable();
|
||||
renderPagination();
|
||||
}
|
||||
});
|
||||
pagination.appendChild(prevLi);
|
||||
|
||||
for (let i = 1; i <= pageCount; i++) {
|
||||
const li = document.createElement('li');
|
||||
li.className = `page-item ${currentPage === i ? 'active' : ''}`;
|
||||
li.innerHTML = `<a class="page-link" href="#">${i}</a>`;
|
||||
li.addEventListener('click', (e) => {
|
||||
e.preventDefault();
|
||||
currentPage = i;
|
||||
renderTable();
|
||||
renderPagination();
|
||||
});
|
||||
pagination.appendChild(li);
|
||||
}
|
||||
|
||||
const nextLi = document.createElement('li');
|
||||
nextLi.className = `page-item ${currentPage === pageCount ? 'disabled' : ''}`;
|
||||
nextLi.innerHTML = `<a class="page-link" href="#" aria-label="Next"><span aria-hidden="true">»</span></a>`;
|
||||
nextLi.addEventListener('click', (e) => {
|
||||
e.preventDefault();
|
||||
if (currentPage < pageCount) {
|
||||
currentPage++;
|
||||
renderTable();
|
||||
renderPagination();
|
||||
}
|
||||
});
|
||||
pagination.appendChild(nextLi);
|
||||
}
|
||||
|
||||
function attachEventListeners() {
|
||||
// Search
|
||||
const searchInput = document.getElementById('searchInput');
|
||||
if (searchInput) {
|
||||
searchInput.addEventListener('input', function() {
|
||||
const searchTerm = this.value.toLowerCase();
|
||||
filteredRows = tableConfig.data.filter(row => {
|
||||
return Object.values(row).some(value =>
|
||||
value && value.toString().toLowerCase().includes(searchTerm)
|
||||
);
|
||||
});
|
||||
currentPage = 1;
|
||||
renderTable();
|
||||
renderPagination();
|
||||
});
|
||||
}
|
||||
|
||||
// Sort
|
||||
document.querySelectorAll('.sortable').forEach(header => {
|
||||
header.addEventListener('click', function() {
|
||||
const columnIndex = parseInt(this.getAttribute('data-column')) - 1;
|
||||
const key = tableConfig.columns[columnIndex].key;
|
||||
|
||||
sortDirection[columnIndex] = !sortDirection[columnIndex] ? 'asc' : sortDirection[columnIndex] === 'asc' ? 'desc' : 'asc';
|
||||
|
||||
document.querySelectorAll('.sortable i').forEach(icon => {
|
||||
icon.classList.remove('fa-sort-up', 'fa-sort-down');
|
||||
icon.classList.add('fa-sort');
|
||||
});
|
||||
const icon = this.querySelector('i');
|
||||
if (icon) {
|
||||
icon.classList.remove('fa-sort');
|
||||
icon.classList.add(sortDirection[columnIndex] === 'asc' ? 'fa-sort-up' : 'fa-sort-down');
|
||||
}
|
||||
|
||||
filteredRows.sort((a, b) => {
|
||||
const aValue = (a[key] || '').toString().toLowerCase();
|
||||
const bValue = (b[key] || '').toString().toLowerCase();
|
||||
return sortDirection[columnIndex] === 'asc' ? aValue.localeCompare(bValue) : bValue.localeCompare(aValue);
|
||||
});
|
||||
|
||||
currentPage = 1;
|
||||
renderTable();
|
||||
renderPagination();
|
||||
});
|
||||
});
|
||||
|
||||
// Clear Filters
|
||||
const clearFilters = document.getElementById('clearFilters');
|
||||
if (clearFilters) {
|
||||
clearFilters.addEventListener('click', function() {
|
||||
if (searchInput) searchInput.value = '';
|
||||
document.querySelectorAll('.sortable i').forEach(icon => {
|
||||
icon.classList.remove('fa-sort-up', 'fa-sort-down');
|
||||
icon.classList.add('fa-sort');
|
||||
});
|
||||
sortDirection = {};
|
||||
filteredRows = [...tableConfig.data];
|
||||
currentPage = 1;
|
||||
renderTable();
|
||||
renderPagination();
|
||||
});
|
||||
}
|
||||
|
||||
// Checkboxes
|
||||
if (tableConfig.showCheckboxes) {
|
||||
const selectAll = document.getElementById('selectAll');
|
||||
if (selectAll) {
|
||||
selectAll.addEventListener('change', function() {
|
||||
const checkboxes = document.querySelectorAll('.rowCheckbox');
|
||||
checkboxes.forEach(checkbox => {
|
||||
checkbox.checked = this.checked;
|
||||
});
|
||||
updateDeleteButtonState();
|
||||
});
|
||||
}
|
||||
|
||||
document.querySelectorAll('.rowCheckbox').forEach(checkbox => {
|
||||
checkbox.addEventListener('change', updateDeleteButtonState);
|
||||
});
|
||||
}
|
||||
|
||||
// Batch Delete
|
||||
if (tableConfig.showBatchDelete) {
|
||||
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 selectedIds = Array.from(checkboxes)
|
||||
.filter(cb => cb.checked)
|
||||
.map(cb => cb.closest('tr').getAttribute('data-id'));
|
||||
|
||||
axios.delete('{{ route('user-management.batchDelete') }}', {
|
||||
headers: {
|
||||
'X-CSRF-TOKEN': tableConfig.csrfToken
|
||||
},
|
||||
data: {
|
||||
admin_uuid: selectedIds
|
||||
}
|
||||
}).then(response => {
|
||||
filteredRows = filteredRows.filter(row => !selectedIds.includes(row.admin_uuid));
|
||||
tableConfig.data = tableConfig.data.filter(row => !selectedIds.includes(row.admin_uuid));
|
||||
originalRows = originalRows.filter(row => !selectedIds.includes(row.admin_uuid));
|
||||
|
||||
const maxPage = Math.ceil(filteredRows.length / rowsPerPage);
|
||||
if (currentPage > maxPage) {
|
||||
currentPage = maxPage || 1;
|
||||
}
|
||||
|
||||
renderTable();
|
||||
renderPagination();
|
||||
if (selectAll) selectAll.checked = false;
|
||||
alert(response.data.message || 'Users deleted successfully');
|
||||
}).catch(error => {
|
||||
console.error('Batch delete error:', error);
|
||||
alert(error.response?.data?.message || 'Failed to delete users. You may have included your own account.');
|
||||
});
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
// Status
|
||||
document.querySelectorAll('.status-option').forEach(option => {
|
||||
option.addEventListener('click', function(e) {
|
||||
e.preventDefault();
|
||||
const newStatus = this.getAttribute('data-status');
|
||||
const row = this.closest('tr');
|
||||
const userId = row.getAttribute('data-id');
|
||||
const statusText = row.querySelector('.status-text');
|
||||
|
||||
if (statusText) {
|
||||
statusText.textContent = newStatus;
|
||||
}
|
||||
|
||||
const rowData = filteredRows.find(r => r.admin_uuid === userId);
|
||||
if (rowData) {
|
||||
rowData.status = newStatus;
|
||||
axios.post(`{{ route('user-management.changeStatus', '') }}/${userId}`, {
|
||||
status: newStatus,
|
||||
_token: tableConfig.csrfToken
|
||||
}).then(response => {
|
||||
alert(response.data.message || `User account is ${newStatus.toLowerCase()}`);
|
||||
}).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;
|
||||
});
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
// Delete
|
||||
document.querySelectorAll('.delete-btn').forEach(button => {
|
||||
button.addEventListener('click', function(e) {
|
||||
e.stopPropagation();
|
||||
const userId = this.getAttribute('data-id');
|
||||
if (confirm('Are you sure you want to delete this item?')) {
|
||||
axios.delete(`{{ route('user-management.destroy', '') }}/${userId}`, {
|
||||
headers: {
|
||||
'X-CSRF-TOKEN': tableConfig.csrfToken
|
||||
}
|
||||
}).then(response => {
|
||||
filteredRows = filteredRows.filter(row => row.admin_uuid !== userId);
|
||||
tableConfig.data = tableConfig.data.filter(row => row.admin_uuid !== userId);
|
||||
originalRows = originalRows.filter(row => row.admin_uuid !== userId);
|
||||
|
||||
const maxPage = Math.ceil(filteredRows.length / rowsPerPage);
|
||||
if (currentPage > maxPage) {
|
||||
currentPage = maxPage || 1;
|
||||
}
|
||||
|
||||
renderTable();
|
||||
renderPagination();
|
||||
alert(response.data.message || 'User deleted successfully');
|
||||
}).catch(error => {
|
||||
console.error('Delete error:', error);
|
||||
alert(error.response?.data?.message || 'Failed to delete user. You cannot delete your own account.');
|
||||
});
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
// Row click to view
|
||||
document.querySelectorAll('.clickable-row').forEach(row => {
|
||||
row.addEventListener('click', function(e) {
|
||||
if (e.target.closest('.rowCheckbox, .status-btn, .edit-btn, .view-btn, .delete-btn, .dropdown-menu')) {
|
||||
return;
|
||||
}
|
||||
const userId = this.getAttribute('data-id');
|
||||
window.location.href = `{{ route('user-management.show', '') }}/${userId}`;
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
function updateDeleteButtonState() {
|
||||
if (tableConfig.showBatchDelete) {
|
||||
const checkboxes = document.querySelectorAll('.rowCheckbox');
|
||||
const checkedCount = Array.from(checkboxes).filter(cb => cb.checked).length;
|
||||
const deleteButton = document.getElementById('deleteSelected');
|
||||
if (deleteButton) {
|
||||
deleteButton.disabled = checkedCount < 1;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
renderTable();
|
||||
renderPagination();
|
||||
</script>
|
||||
<script src="https://cdn.jsdelivr.net/npm/axios/dist/axios.min.js"></script>
|
||||
|
|
@ -3,56 +3,9 @@
|
|||
@section('page_title', 'Photo Slider')
|
||||
|
||||
@section('content')
|
||||
@php
|
||||
$sliders = [
|
||||
[
|
||||
'id' => 1,
|
||||
'title' => 'Homepage Banner',
|
||||
'type' => 'Banner',
|
||||
'startDate' => '2025-04-10',
|
||||
'endDate' => '2025-04-20'
|
||||
],
|
||||
[
|
||||
'id' => 2,
|
||||
'title' => 'Product Carousel',
|
||||
'type' => 'Carousel',
|
||||
'startDate' => '2025-04-15',
|
||||
'endDate' => '2025-04-25'
|
||||
],
|
||||
[
|
||||
'id' => 3,
|
||||
'title' => 'Seasonal Promo',
|
||||
'type' => 'Banner',
|
||||
'startDate' => '2025-04-20',
|
||||
'endDate' => '2025-05-01'
|
||||
],
|
||||
[
|
||||
'id' => 4,
|
||||
'title' => 'Flash Sale Slider',
|
||||
'type' => 'Slider',
|
||||
'startDate' => '2025-04-22',
|
||||
'endDate' => '2025-04-24'
|
||||
],
|
||||
[
|
||||
'id' => 5,
|
||||
'title' => 'New Arrivals',
|
||||
'type' => 'Carousel',
|
||||
'startDate' => '2025-04-25',
|
||||
'endDate' => '2025-05-05'
|
||||
],
|
||||
[
|
||||
'id' => 6,
|
||||
'title' => 'Event Highlight',
|
||||
'type' => 'Banner',
|
||||
'startDate' => '2025-04-30',
|
||||
'endDate' => '2025-05-10'
|
||||
]
|
||||
];
|
||||
@endphp
|
||||
|
||||
@include('components.table-component', [
|
||||
'pageTitle' => 'Photo Slider',
|
||||
'data' => $sliders,
|
||||
// 'data' => $sliders,
|
||||
'columns' => [
|
||||
['name' => 'Title', 'key' => 'title', 'sortable' => true],
|
||||
['name' => 'Type', 'key' => 'type', 'sortable' => true],
|
||||
|
|
@ -67,14 +20,4 @@
|
|||
'showEditModal' => true,
|
||||
'showViewModal' => true
|
||||
])
|
||||
|
||||
<script>
|
||||
const storedSliders = JSON.parse(sessionStorage.getItem('sliders') || '[]');
|
||||
if (storedSliders.length > 0) {
|
||||
const tableConfig = window.tableConfig || {};
|
||||
tableConfig.data = [...tableConfig.data, ...storedSliders];
|
||||
window.renderTable();
|
||||
window.renderPagination();
|
||||
}
|
||||
</script>
|
||||
@endsection
|
||||
|
|
@ -1,31 +1,30 @@
|
|||
<!-- resources/views/pages/user-management.blade.php -->
|
||||
@extends('layouts.app')
|
||||
|
||||
@section('page_title', 'User Management')
|
||||
|
||||
@section('content')
|
||||
<div id="user-table">
|
||||
@include('components.table-component', [
|
||||
@include('components.user-management-component', [
|
||||
'pageTitle' => 'User Management',
|
||||
'data' => $users, // Use the data passed from the controller
|
||||
'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]
|
||||
['name' => 'Status', 'key' => 'status', 'sortable' => true],
|
||||
],
|
||||
'actions' => ['edit', 'view', 'delete'],
|
||||
'showAddButton' => true,
|
||||
'addButtonUrl' => '/add-user',
|
||||
'addButtonUrl' => route('user-management.create'),
|
||||
'showCheckboxes' => true,
|
||||
'showBatchDelete' => true,
|
||||
'showEditModal' => true,
|
||||
'showViewModal' => true
|
||||
'showEditModal' => false,
|
||||
'showViewModal' => false,
|
||||
])
|
||||
<div id="no-data-message" style="display: {{ empty($users) ? 'block' : 'none' }}; text-align: center; margin-top: 20px;">
|
||||
<p>No Data Found</p>
|
||||
<p>No users found.</p>
|
||||
</div>
|
||||
</div>
|
||||
@endsection
|
||||
|
|
@ -1,84 +1,72 @@
|
|||
@extends('layouts.app')
|
||||
|
||||
@section('page_title', 'Add User')
|
||||
|
||||
@section('content')
|
||||
|
||||
<div class="card-header border-0 bg-transparent py-2">
|
||||
<h5 class="mb-0 fw-bold text-dark" style="font-size: 1.25rem;">Add New User</h5>
|
||||
<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">Add New User</h5>
|
||||
</div>
|
||||
<div class="card-body">
|
||||
<form id="addUserForm" action="{{ route('user-management.store') }}" method="POST">
|
||||
@csrf
|
||||
<div class="mb-3">
|
||||
<label class="form-label">Username</label>
|
||||
<input type="text" class="form-control" id="username" name="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" 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" 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" required>
|
||||
@error('email')
|
||||
<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">Admin</option>
|
||||
<option value="0">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">Active</option>
|
||||
<option value="inactive">Inactive</option>
|
||||
</select>
|
||||
@error('status')
|
||||
<span class="text-danger">{{ $message }}</span>
|
||||
@enderror
|
||||
</div>
|
||||
<div class="text-end">
|
||||
<a href="{{ route('user.management') }}" class="btn btn-secondary">Cancel</a>
|
||||
<button type="submit" class="btn btn-primary">Add User</button>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card-body py-2">
|
||||
<form action="#" method="POST" id="addUserForm">
|
||||
@csrf
|
||||
<div class="mb-2">
|
||||
<label for="username" class="form-label mb-1">Username</label>
|
||||
<input type="text" class="form-control form-control-sm" id="username" name="username" required>
|
||||
</div>
|
||||
<div class="mb-2">
|
||||
<label for="firstName" class="form-label mb-1">First Name</label>
|
||||
<input type="text" class="form-control form-control-sm" id="firstName" name="firstName" required>
|
||||
</div>
|
||||
<div class="mb-2">
|
||||
<label for="lastName" class="form-label mb-1">Last Name</label>
|
||||
<input type="text" class="form-control form-control-sm" id="lastName" name="lastName" required>
|
||||
</div>
|
||||
<div class="mb-2">
|
||||
<label for="role" class="form-label mb-1">User Role</label>
|
||||
<select class="form-select form-select-sm" id="status" name="status" required>
|
||||
<option value="1">1</option>
|
||||
<option value="0">0</option>
|
||||
</select> </div>
|
||||
<div class="mb-2">
|
||||
<label for="email" class="form-label mb-1">Email</label>
|
||||
<input type="email" class="form-control form-control-sm" id="email" name="email" required>
|
||||
</div>
|
||||
<div class="mb-2">
|
||||
<label for="status" class="form-label mb-1">Status</label>
|
||||
<select class="form-select form-select-sm" id="status" name="status" required>
|
||||
<option value="Active">Active</option>
|
||||
<option value="Inactive">Inactive</option>
|
||||
</select>
|
||||
</div>
|
||||
<div class="d-flex justify-content-end mt-3">
|
||||
<a href="{{ url('user-management') }}" class="btn btn-outline-secondary btn-sm me-2" style="margin-right:5px">Cancel</a>
|
||||
<button type="submit" class="btn btn-primary btn-sm">Add User</button>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
|
||||
|
||||
<style>
|
||||
.card {
|
||||
border-radius: 8px;
|
||||
}
|
||||
.form-control,
|
||||
.form-select {
|
||||
font-size: 0.85rem;
|
||||
border-radius: 4px;
|
||||
padding: 0.375rem 0.75rem;
|
||||
}
|
||||
.form-label {
|
||||
font-weight: 500;
|
||||
font-size: 0.85rem;
|
||||
line-height: 1.2;
|
||||
}
|
||||
.btn-primary {
|
||||
background-color: #E74610;
|
||||
border-color: #E74610;
|
||||
font-size: 0.85rem;
|
||||
padding: 0.375rem 0.75rem;
|
||||
}
|
||||
.btn-primary:hover {
|
||||
background-color: #d63f0e;
|
||||
border-color: #d63f0e;
|
||||
}
|
||||
.btn-outline-secondary {
|
||||
font-size: 0.85rem;
|
||||
padding: 0.375rem 0.75rem;
|
||||
}
|
||||
.form-control-sm,
|
||||
.form-select-sm {
|
||||
height: calc(1.5em + 0.5rem + 2px);
|
||||
}
|
||||
</style>
|
||||
</div>
|
||||
</div>
|
||||
@endsection
|
||||
|
|
@ -0,0 +1,93 @@
|
|||
@extends('layouts.app')
|
||||
|
||||
@section('content')
|
||||
<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">Edit User</h5>
|
||||
</div>
|
||||
<div class="card-body">
|
||||
<form id="editUserForm" action="{{ route('user-management.update', $user['admin_uuid']) }}" method="POST">
|
||||
@csrf
|
||||
@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>
|
||||
@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>
|
||||
@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>
|
||||
@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>
|
||||
@error('email')
|
||||
<span class="text-danger">{{ $message }}</span>
|
||||
@enderror
|
||||
</div>
|
||||
<div class="mb-3">
|
||||
<label class="form-label">Password (leave blank to keep unchanged)</label>
|
||||
<input type="password" class="form-control" id="password" name="password">
|
||||
@error('password')
|
||||
<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>
|
||||
</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>
|
||||
<button type="submit" class="btn btn-primary">Update User</button>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</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
|
||||
|
|
@ -0,0 +1,82 @@
|
|||
@extends('layouts.app')
|
||||
|
||||
@section('page_title', 'View User')
|
||||
|
||||
@section('content')
|
||||
<div class="container mt-4">
|
||||
<div class="card">
|
||||
<div class="card-header border-0 bg-transparent">
|
||||
<h5 class="mb-0 fw-bold text-dark">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>
|
||||
<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
|
||||
|
|
@ -4,6 +4,7 @@ use Illuminate\Support\Facades\Route;
|
|||
use Illuminate\Support\Facades\Http;
|
||||
use App\Http\Controllers\AuthController;
|
||||
use App\Http\Controllers\UserManagementController;
|
||||
use App\Http\Controllers\PhotoSliderViewController;
|
||||
|
||||
|
||||
|
||||
|
|
@ -24,7 +25,8 @@ Route::get('/dashboard', function () {
|
|||
return view('dashboard');
|
||||
});
|
||||
|
||||
Route::get('/user-management', [UserManagementController::class, 'index'])->name('user.management');
|
||||
|
||||
Route::get('/photo-slider', [PhotoSliderViewController::class, 'index'])->name('photo-slider.index');
|
||||
|
||||
Route::get('/notification', function () {
|
||||
return view('pages.notification');
|
||||
|
|
@ -38,9 +40,7 @@ Route::get('/locked-accounts', function () {
|
|||
return view('pages.member management.locked-accounts');
|
||||
})->name('locked-accounts');
|
||||
|
||||
Route::get('/photo-slider', function () {
|
||||
return view('pages.home page.photo-slider');
|
||||
})->name('photo-slider');
|
||||
|
||||
|
||||
Route::get('/promotions', function () {
|
||||
return view('pages.promotions');
|
||||
|
|
@ -156,3 +156,13 @@ Route::get('/fuel-price-update-logs', function () {
|
|||
return view('pages.fuel-price-update-logs');
|
||||
})->name('fuel-price-update-logs');
|
||||
|
||||
//User
|
||||
Route::get('user-management', [UserManagementController::class, 'index'])->name('user.management');
|
||||
Route::get('user-management/create', [UserManagementController::class, 'create'])->name('user-management.create');
|
||||
Route::post('user-management', [UserManagementController::class, 'store'])->name('user-management.store');
|
||||
Route::get('user-management/{uuid}', [UserManagementController::class, 'show'])->name('user-management.show');
|
||||
Route::get('user-management/{uuid}/edit', [UserManagementController::class, 'edit'])->name('user-management.edit');
|
||||
Route::put('user-management/{uuid}', [UserManagementController::class, 'update'])->name('user-management.update');
|
||||
Route::delete('user-management/{uuid}', [UserManagementController::class, 'destroy'])->name('user-management.destroy');
|
||||
Route::delete('user-management/batch', [UserManagementController::class, 'batchDelete'])->name('user-management.batchDelete');
|
||||
Route::post('user-management/{uuid}/status', [UserManagementController::class, 'changeStatus'])->name('user-management.changeStatus');
|
||||
Loading…
Reference in New Issue