Enhance Activities Organised Page with Filters, Column Selector, and Download Functionality
- Updated the page title icon color for better visibility. - Added filter controls for Department, Category, and Date Range. - Implemented a column selector for customizable table views. - Integrated reusable components for sending emails and downloading proofs. - Enhanced DataTable initialization with dynamic filtering based on user selections. - Added functionality for selecting/deselecting all rows and managing download button state. - Implemented toast notifications for user feedback on actions. - Improved styling for checkboxes and dropdown menus for better user experience.
This commit is contained in:
Sallu9007
29
resources/views/components/column-selector.blade.php
Normal file
29
resources/views/components/column-selector.blade.php
Normal file
@@ -0,0 +1,29 @@
|
||||
@props(['columns' => []])
|
||||
<div class="dropdown">
|
||||
<button class="btn btn-danger dropdown-toggle" type="button" id="columnSelectorDropdown" data-bs-toggle="dropdown" aria-expanded="false">
|
||||
<i class="fas fa-columns me-1"></i> Customize Columns
|
||||
</button>
|
||||
<div class="dropdown-menu p-3 shadow-sm column-selector-dropdown" style="width: 320px;">
|
||||
<h6 class="dropdown-header border-bottom pb-2 mb-2">Toggle Columns Visibility</h6>
|
||||
<div class="row g-2">
|
||||
@foreach($columns as $column)
|
||||
<div class="col-6">
|
||||
<div class="form-check form-switch">
|
||||
<input class="form-check-input column-checkbox" type="checkbox" value="{{ $column['value'] }}" id="{{ $column['id'] }}" @checked($column['checked'] ?? false)>
|
||||
<label class="form-check-label" for="{{ $column['id'] }}">{{ $column['label'] }}</label>
|
||||
</div>
|
||||
</div>
|
||||
@endforeach
|
||||
</div>
|
||||
<div class="dropdown-divider my-2"></div>
|
||||
<div class="d-flex justify-content-between">
|
||||
<button id="select-all-columns" class="btn btn-sm btn-outline-danger" type="button">
|
||||
<i class="fas fa-check-square me-1"></i> Select All
|
||||
</button>
|
||||
<button id="deselect-all-columns" class="btn btn-sm btn-outline-secondary" type="button">
|
||||
<i class="fas fa-square me-1"></i> Deselect All
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
94
resources/views/components/send-email.blade.php
Normal file
94
resources/views/components/send-email.blade.php
Normal file
@@ -0,0 +1,94 @@
|
||||
@if(auth()->user()->role->name === 'Admin')
|
||||
<button type="button" class="btn btn-danger" data-bs-toggle="modal" data-bs-target="#missingProofsModal">
|
||||
<i class="fas fa-search me-1"></i> Check Missing Proofs
|
||||
</button>
|
||||
@endif
|
||||
|
||||
<!-- Missing Proofs Modal -->
|
||||
@if(auth()->user()->role->name === 'Admin')
|
||||
<div class="modal fade" id="missingProofsModal" tabindex="-1" aria-labelledby="missingProofsModalLabel" aria-hidden="true">
|
||||
<div class="modal-dialog modal-dialog-centered">
|
||||
<div class="modal-content">
|
||||
<div class="modal-header bg-light">
|
||||
<h5 class="modal-title" id="missingProofsModalLabel">
|
||||
<i class="fas fa-check-square me-2 text-danger"></i>Select Categories to Check
|
||||
</h5>
|
||||
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
|
||||
</div>
|
||||
<form id="missingProofsForm" action="{{ route('missing-proofs.check') }}" method="POST">
|
||||
@csrf
|
||||
<div class="modal-body">
|
||||
<div class="row">
|
||||
<div class="col-md-6">
|
||||
<div class="form-check mb-3">
|
||||
<input class="form-check-input" type="checkbox" name="categories[]" value="activities_attended" id="checkActivitiesAttended">
|
||||
<label class="form-check-label" for="checkActivitiesAttended">
|
||||
1. Activities Attended
|
||||
</label>
|
||||
</div>
|
||||
<div class="form-check mb-3">
|
||||
<input class="form-check-input" type="checkbox" name="categories[]" value="activities_organised" id="checkActivitiesOrganised">
|
||||
<label class="form-check-label" for="checkActivitiesOrganised">
|
||||
2. Activities Organised
|
||||
</label>
|
||||
</div>
|
||||
<div class="form-check mb-3">
|
||||
<input class="form-check-input" type="checkbox" name="categories[]" value="iv_organised" id="checkIVOrganised">
|
||||
<label class="form-check-label" for="checkIVOrganised">
|
||||
3. IV Organised
|
||||
</label>
|
||||
</div>
|
||||
<div class="form-check mb-3">
|
||||
<input class="form-check-input" type="checkbox" name="categories[]" value="publications" id="checkPublications">
|
||||
<label class="form-check-label" for="checkPublications">
|
||||
4. Publications
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-6">
|
||||
<div class="form-check mb-3">
|
||||
<input class="form-check-input" type="checkbox" name="categories[]" value="books_published" id="checkBooksPublished">
|
||||
<label class="form-check-label" for="checkBooksPublished">
|
||||
5. Books Published
|
||||
</label>
|
||||
</div>
|
||||
<div class="form-check mb-3">
|
||||
<input class="form-check-input" type="checkbox" name="categories[]" value="external_engagement" id="checkExternalEngagement">
|
||||
<label class="form-check-label" for="checkExternalEngagement">
|
||||
6. External Engagement
|
||||
</label>
|
||||
</div>
|
||||
<div class="form-check mb-3">
|
||||
<input class="form-check-input" type="checkbox" name="categories[]" value="online_courses" id="checkOnlineCourses">
|
||||
<label class="form-check-label" for="checkOnlineCourses">
|
||||
7. Online Courses
|
||||
</label>
|
||||
</div>
|
||||
<div class="form-check mb-3">
|
||||
<input class="form-check-input" type="checkbox" name="categories[]" value="patents_copyrights" id="checkPatentsCopyrights">
|
||||
<label class="form-check-label" for="checkPatentsCopyrights">
|
||||
8. Patents/Copyrights
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-check mb-2">
|
||||
<input class="form-check-input" type="checkbox" id="selectAll">
|
||||
<label class="form-check-label" for="selectAll">
|
||||
<strong>Select All Categories</strong>
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<button type="button" class="btn btn-outline-secondary" data-bs-dismiss="modal">
|
||||
<i class="fas fa-times me-1"></i>Close
|
||||
</button>
|
||||
<button type="submit" class="btn btn-danger">
|
||||
<i class="fas fa-paper-plane me-1"></i>Send Email
|
||||
</button>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@endif
|
||||
Reference in New Issue
Block a user