105 lines
4.6 KiB
PHTML
Executable File
105 lines
4.6 KiB
PHTML
Executable File
<?php
|
|
/**
|
|
* Main index view for the EcoBuddy application
|
|
*
|
|
* This file serves as the main view for the application, displaying
|
|
* a table of facilities with various actions depending on the user's
|
|
* access level. It includes modals for creating, updating, deleting,
|
|
* and viewing statuses of facilities.
|
|
*
|
|
* The table is populated dynamically using JavaScript, with the data
|
|
* stored in sessionStorage.
|
|
*/
|
|
require('template/header.phtml')
|
|
?>
|
|
|
|
<div class="row">
|
|
<div class="col-12 p-0" id="facilityContent">
|
|
<!-- Main content -->
|
|
<div class="card shadow-sm border-0 rounded-3">
|
|
<!-- Title and add button (admins only) -->
|
|
<div class="card-header bg-light py-3">
|
|
<div class="d-flex justify-content-between align-items-center">
|
|
<div class="d-flex align-items-center">
|
|
<h5 class="mb-0 fw-bold text-primary">
|
|
<i class="bi bi-geo-alt-fill me-2 text-success"></i>Facilities
|
|
</h5>
|
|
<!-- Badge showing the number of facilities -->
|
|
<span class="badge bg-success rounded-pill ms-2" id="facilityCount"></span>
|
|
</div>
|
|
<?php if($view->user->getAccessLevel() == 1): ?>
|
|
<!-- Add new facility button (admin only) -->
|
|
<button type="button" class="btn btn-success" data-bs-toggle="modal" data-bs-target="#createModal">
|
|
<i class="bi bi-plus-circle me-1"></i>Add New Facility
|
|
</button>
|
|
<?php endif; ?>
|
|
</div>
|
|
</div>
|
|
<!-- Pagination controls -->
|
|
<div class="card-footer bg-white py-2">
|
|
<?php require('template/pagination.phtml');?>
|
|
</div>
|
|
<!-- Facilities table -->
|
|
<div class="card-body p-0">
|
|
<div class="table-responsive">
|
|
<table class="table table-hover align-middle mb-0" id="facilityTable">
|
|
<thead class="table-light">
|
|
<tr>
|
|
<?php if($view->user->getAccessLevel() == 1): ?>
|
|
<th class="fw-semibold" style="width: 40px;">ID</th>
|
|
<?php else: ?>
|
|
<th class="d-none">ID</th>
|
|
<?php endif; ?>
|
|
<th class="fw-semibold" style="width: 15%;">Title</th>
|
|
<th class="fw-semibold text-center" style="width: 10%;">Category</th>
|
|
<th class="fw-semibold" style="width: 25%;">Description</th>
|
|
<th class="fw-semibold" style="width: 20%;">Address</th>
|
|
<th class="fw-semibold text-center" style="width: 8%;" hidden>Postcode</th>
|
|
<th class="fw-semibold text-center" style="width: 12%;">Coordinates</th>
|
|
<th class="fw-semibold text-center" style="width: 8%;">Contributor</th>
|
|
<th class="fw-semibold text-center" style="width: 10%;">Actions</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody class="border-top-0">
|
|
<!-- Table content will be dynamically populated by JavaScript -->
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Include modal templates -->
|
|
<?php require('template/createModal.phtml') ?>
|
|
<?php require('template/updateModal.phtml') ?>
|
|
<?php require('template/deleteModal.phtml') ?>
|
|
<?php require('template/statusModal.phtml') ?>
|
|
|
|
<!-- Script to update the facility count badge -->
|
|
<script>
|
|
document.addEventListener('DOMContentLoaded', function() {
|
|
// Update facility count badge based on data in sessionStorage
|
|
const updateFacilityCount = () => {
|
|
const facilityData = JSON.parse(sessionStorage.getItem('facilityData') || '[]');
|
|
const countBadge = document.getElementById('facilityCount');
|
|
if (countBadge) {
|
|
countBadge.textContent = `${facilityData.length} facilities`;
|
|
}
|
|
};
|
|
|
|
// Initial count update when the page loads
|
|
updateFacilityCount();
|
|
|
|
// Listen for changes in facility data to update the count
|
|
window.addEventListener('storage', function(e) {
|
|
if (e.key === 'facilityData') {
|
|
updateFacilityCount();
|
|
}
|
|
});
|
|
});
|
|
</script>
|
|
|
|
<?php require('template/footer.phtml');?>
|
|
|