Feat: Activites Organised

This commit is contained in:
Sallu9007
2025-03-24 01:54:58 +05:30
parent 4352abdbd1
commit 98522c4213
12 changed files with 1061 additions and 10 deletions

View File

@@ -0,0 +1,234 @@
@extends('layouts.app')
@section('content')
<div class="max-w-full mx-auto px-4 sm:px-6 lg:px-8">
<div class="bg-white overflow-hidden shadow sm:rounded-lg">
<div class="px-4 py-5 sm:px-6">
<h3 class="text-xl leading-6 font-semibold text-gray-900">
All Activities Organised
</h3>
</div>
<div class="px-4 py-5 sm:px-6">
<div class="overflow-x-auto w-full max-w-screen-lg mx-auto">
<table id="responses-table" class="table-auto w-full table-striped border-collapse border border-gray-200 rounded-lg">
<thead class="bg-gray-100">
<tr>
<th class="px-4 py-2 border border-gray-200">ID</th>
<th class="px-4 py-2 border border-gray-200">Title</th>
<th class="px-4 py-2 border border-gray-200">Resource Person</th>
<th class="px-4 py-2 border border-gray-200">Organisation</th>
<th class="px-4 py-2 border border-gray-200">Target Audience</th>
<th class="px-4 py-2 border border-gray-200">Department</th>
<th class="px-4 py-2 border border-gray-200">Faculty</th>
<th class="px-4 py-2 border border-gray-200">Start Date</th>
<th class="px-4 py-2 border border-gray-200">End Date</th>
<th class="px-4 py-2 border border-gray-200">Num Days</th>
<th class="px-4 py-2 border border-gray-200">Venue</th>
<th class="px-4 py-2 border border-gray-200">Activity Type</th>
<th class="px-4 py-2 border border-gray-200">Category</th>
<th class="px-4 py-2 border border-gray-200">Level</th>
<th class="px-4 py-2 border border-gray-200">Participants</th>
<th class="px-4 py-2 border border-gray-200">Actions</th>
</tr>
</thead>
<tbody>
</tbody>
</table>
</div>
</div>
</div>
</div>
@endsection
@section('scripts')
<!-- DataTables JS -->
<link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/1.13.1/css/jquery.dataTables.min.css">
<link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/1.13.1/css/dataTables.bootstrap5.min.css">
<script src="https://code.jquery.com/jquery-3.5.1.js"></script>
<script src="https://cdn.datatables.net/1.13.1/js/jquery.dataTables.min.js"></script>
<script src="https://cdn.datatables.net/1.13.1/js/dataTables.bootstrap5.min.js"></script>
<script src="https://cdn.datatables.net/buttons/2.2.3/js/dataTables.buttons.min.js"></script>
<script src="https://cdn.datatables.net/buttons/2.2.3/js/buttons.html5.min.js"></script>
<script src="https://cdn.datatables.net/buttons/2.2.3/js/buttons.print.min.js"></script>
<script>
$(document).ready(function() {
const sheetName = "Activities Organised";
var initAjaxRoute = function(route) {
table = $("#responses-table").DataTable({
fnDestroy: true,
processing: true,
serverSide: true,
responsive: true,
ajax: {
url: route,
},
columns: [{
data: 'id',
name: 'id'
},
{
data: 'title',
name: 'title',
orderable: false
},
{
data: 'resource_person_name',
name: 'resource_person_name',
orderable: false
},
{
data: 'resource_person_organization',
name: 'resource_person_organization',
orderable: false
},
{
data: 'target_audience',
name: 'target_audience',
orderable: false
},
{
data: 'department_name',
name: 'department',
orderable: false
},
{
data: 'user_name',
name: 'user_name',
orderable: false
},
{
data: 'start_date',
name: 'start_date',
orderable: false
},
{
data: 'end_date',
name: 'end_date',
orderable: false
},
{
data: 'num_days',
name: 'num_days',
orderable: false
},
{
data: 'venue',
name: 'venue',
orderable: false
},
{
data: 'activity_type',
name: 'activity_type',
orderable: false
},
{
data: 'category',
name: 'category',
orderable: false
},
{
data: 'level',
name: 'level',
orderable: false
},
{
data: 'number_of_participants',
name: 'number_of_participants',
orderable: false
},
{
data: 'action',
name: 'action',
orderable: false,
searchable: false
},
],
columnDefs: [{
targets: '_all',
className: 'text-center wrap-text'
}, ],
dom: 'Bfrtip',
buttons: [{
extend: 'copy',
title: sheetName,
exportOptions: exportOptions()
},
{
extend: 'csv',
title: sheetName,
exportOptions: exportOptions()
},
{
extend: 'excel',
title: sheetName,
exportOptions: exportOptions()
},
{
extend: 'pdf',
title: sheetName,
exportOptions: exportOptions()
},
{
extend: 'print',
title: sheetName,
exportOptions: exportOptions()
}
]
});
};
// Delete button event handler
$('#responses-table').on('click', '.delete-btn', function() {
if (confirm('Are you sure you want to delete this record?')) {
const id = $(this).data('id');
const url = $(this).data('url');
$.ajax({
url: url,
type: 'DELETE',
data: {
"_token": "{{ csrf_token() }}"
},
success: function(result) {
table.ajax.reload();
alert('Record deleted successfully');
},
error: function(error) {
console.error(error);
alert('Error deleting record');
}
});
}
});
function exportOptions() {
return {
columns: ':visible',
format: {
body: function(data, row, column, node) {
if ($(node).find('select').length) {
return $(node).find("select option:selected").text();
}
return $(node).text();
}
}
};
}
// Set appropriate route based on user role
const userRole = "{{ auth()->user()->role->name }}";
let dataRoute = "{{ route('admin.ActivitiesOrganisedResponses.data') }}";
if (userRole === 'Coordinator') {
dataRoute = "{{ route('coordinator.ActivitiesOrganisedResponses.data') }}";
}
if (userRole === 'Faculty') {
dataRoute = "{{ route('faculty.ActivitiesOrganisedResponses.data') }}";
}
initAjaxRoute(dataRoute);
});
</script>
@endsection