armiejean
/
cms-frontend
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

station function

This commit is contained in:
armiejean 2025-05-16 17:37:36 +08:00
parent 4061579428
commit 9e5a466a5b
7 changed files with 821 additions and 247 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

200
app/Http/Controllers/StationController.php Normal file
View File

@ -0,0 +1,200 @@
<?php
namespace App\Http\Controllers;
use Illuminate\Http\Request;
use Illuminate\Support\Facades\Http;
use Illuminate\Support\Str;
class StationController extends Controller
{
protected $apiBaseUrl = 'http://192.168.100.6:8081/api/';
public function index(Request $request)
{
$params = [
'page' => $request->input('page', 1),
'page_size' => 5,
'_search' => $request->input('_search'),
'sort' => $request->input('sort', 'code|asc'),
];
$response = Http::get($this->apiBaseUrl . 'cms/getStations', $params);
$data = $response->json();
$stations = [];
$currentPage = $params['page'];
$lastPage = 1;
$total = 0;
if ($response->successful() && isset($data['data'])) {
$stations = array_map(function ($item) {
return [
'id' => $item['station_uuid'],
'station_code' => $item['code'],
'station_name' => $item['description'],
'branch_name' => 'N/A', // Mocked; replace with actual API field if available
'date_created' => 'N/A', // Mocked
'created_by' => 'N/A', // Mocked
'modified_by' => 'N/A', // Mocked
'date_modified' => 'N/A', // Mocked
];
}, $data['data']);
// Mock pagination since API may not support it
$total = count($data['data']);
$lastPage = ceil($total / $params['page_size']);
$currentPage = min($currentPage, $lastPage);
// Handle search client-side if API doesn't support _search
if ($params['_search']) {
$searchTerm = strtolower($params['_search']);
$stations = array_filter($stations, function ($station) use ($searchTerm) {
return str_contains(strtolower($station['station_code']), $searchTerm) ||
str_contains(strtolower($station['station_name']), $searchTerm) ||
str_contains(strtolower($station['branch_name']), $searchTerm);
});
$stations = array_values($stations);
$total = count($stations);
$lastPage = ceil($total / $params['page_size']);
}
// Handle sorting client-side if API doesn't support sort
if ($params['sort']) {
[$sortField, $sortDir] = explode('|', $params['sort']);
usort($stations, function ($a, $b) use ($sortField, $sortDir) {
$aValue = $a[$sortField] ?? '';
$bValue = $b[$sortField] ?? '';
return $sortDir === 'asc' ? strcmp($aValue, $bValue) : strcmp($bValue, $aValue);
});
}
// Paginate manually
$start = ($currentPage - 1) * $params['page_size'];
$stations = array_slice($stations, $start, $params['page_size']);
}
return view('pages.station locator.stations', compact('stations', 'currentPage', 'lastPage', 'total'));
}
// public function create()
// {
// return view('pages.add-station');
// }
// public function store(Request $request)
// {
// $request->validate([
// 'station_code' => 'required|string|max:50|unique:stations,station_code',
// 'station_name' => 'required|string|max:255',
// 'branch_name' => 'required|string|max:255',
// ]);
// // Mock API call to store station
// $response = Http::post($this->apiBaseUrl . 'cms/stations/store', [
// 'code' => $request->station_code,
// 'description' => $request->station_name,
// 'branch_name' => $request->branch_name,
// 'is_viewable' => 1,
// 'is_active' => 1,
// ]);
// if ($response->successful()) {
// return redirect()->route('station-management')->with('success', 'Station added successfully');
// }
// return back()->withErrors(['error' => 'Failed to add station']);
// }
// public function show($id)
// {
// $response = Http::get($this->apiBaseUrl . 'cms/getStations');
// $data = $response->json();
// $station = null;
// if ($response->successful() && isset($data['data'])) {
// $station = collect($data['data'])->firstWhere('station_uuid', $id);
// if ($station) {
// $station = [
// 'id' => $station['station_uuid'],
// 'station_code' => $station['code'],
// 'station_name' => $station['description'],
// 'branch_name' => 'N/A',
// 'date_created' => 'N/A',
// 'created_by' => 'N/A',
// 'modified_by' => 'N/A',
// 'date_modified' => 'N/A',
// ];
// }
// }
// if (!$station) {
// abort(404, 'Station not found');
// }
// return view('pages.view-station', compact('station'));
// }
// public function edit($id)
// {
// $response = Http::get($this->apiBaseUrl . 'cms/getStations');
// $data = $response->json();
// $station = null;
// if ($response->successful() && isset($data['data'])) {
// $station = collect($data['data'])->firstWhere('station_uuid', $id);
// if ($station) {
// $station = [
// 'id' => $station['station_uuid'],
// 'station_code' => $station['code'],
// 'station_name' => $station['description'],
// 'branch_name' => 'N/A',
// 'date_created' => 'N/A',
// 'created_by' => 'N/A',
// 'modified_by' => 'N/A',
// 'date_modified' => 'N/A',
// ];
// }
// }
// if (!$station) {
// abort(404, 'Station not found');
// }
// return view('pages.edit-station', compact('station'));
// }
// public function update(Request $request, $id)
// {
// $request->validate([
// 'station_code' => 'required|string|max:50|unique:stations,station_code,' . $id . ',id',
// 'station_name' => 'required|string|max:255',
// 'branch_name' => 'required|string|max:255',
// ]);
// // Mock API call to update station
// $response = Http::put($this->apiBaseUrl . 'cms/stations/update/' . $id, [
// 'code' => $request->station_code,
// 'description' => $request->station_name,
// 'branch_name' => $request->branch_name,
// ]);
// if ($response->successful()) {
// return redirect()->route('station-management')->with('success', 'Station updated successfully');
// }
// return back()->withErrors(['error' => 'Failed to update station']);
// }
// public function destroy($id)
// {
// // Mock API call to delete station
// $response = Http::delete($this->apiBaseUrl . 'cms/stations/delete/' . $id);
// if ($response->successful()) {
// return redirect()->route('station-management')->with('success', 'Station deleted successfully');
// }
// return back()->withErrors(['error' => 'Failed to delete station']);
// }
}

467
resources/views/components/station-component.blade.php Normal file
View File

@ -0,0 +1,467 @@
@props([
'pageTitle' => '',
'data' => [],
'columns' => [],
'actions' => [],
'showAddButton' => false,
'addButtonUrl' => '#',
'showCheckboxes' => false,
'showBatchDelete' => false,
'showEditModal' => false,
'showViewModal' => false,
'currentPage' => 1,
'lastPage' => 1,
'total' => 0,
])
<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" data-search-param="_search">
</div>
</div>
<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>
</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 + ($showCheckboxes ? 1 : 0) }}">
{{ $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>
<!-- Edit Modal -->
@if ($showEditModal)
<div class="modal fade" id="editModal" tabindex="-1" aria-labelledby="editModalLabel" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="editModalLabel">Edit {{ $pageTitle }}</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<form id="editForm" method="POST">
@csrf
@method('PUT')
<div class="modal-body">
<input type="hidden" name="id" id="editId">
@foreach ($columns as $column)
@if (!in_array($column['key'], ['date_created', 'created_by', 'modified_by', 'date_modified']))
<div class="mb-3">
<label for="edit_{{ $column['key'] }}" class="form-label">{{ $column['name'] }}</label>
<input type="text" class="form-control" id="edit_{{ $column['key'] }}" name="{{ $column['key'] }}" required>
</div>
@endif
@endforeach
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button>
<button type="submit" class="btn btn-primary">Save changes</button>
</div>
</form>
</div>
</div>
</div>
@endif
<!-- View Modal -->
@if ($showViewModal)
<div class="modal fade" id="viewModal" tabindex="-1" aria-labelledby="viewModalLabel" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="viewModalLabel">View {{ $pageTitle }}</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body" id="viewModalBody"></div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button>
</div>
</div>
</div>
</div>
@endif
<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;
}
.table-container {
overflow-x: auto;
}
.table th, .table td {
white-space: nowrap;
}
.sortable {
cursor: pointer;
position: relative;
}
.sortable:hover {
background-color: #f8f9fa;
}
.sortable i {
margin-left: 5px;
color: #6c757d;
}
.clickable-row:hover {
background-color: #f1f1f1;
cursor: pointer;
}
.view-btn { border-color: #0d6efd; color: #0d6efd; }
.view-btn:hover { background-color: #0d6efd; color: #fff; }
.edit-btn { border-color: #ffc107; color: #ffc107; }
.edit-btn:hover { background-color: #ffc107; color: #fff; }
.delete-btn { border-color: #dc3545; color: #dc3545; }
.delete-btn:hover { background-color: #dc3545; color: #fff; }
</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() }}',
currentPage: {{ $currentPage }},
lastPage: {{ $lastPage }},
total: {{ $total }},
};
const rowsPerPage = 5;
let currentPage = tableConfig.currentPage;
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 startIndex = (currentPage - 1) * rowsPerPage;
const endIndex = startIndex + rowsPerPage;
const paginatedRows = filteredRows.slice(startIndex, endIndex);
paginatedRows.forEach(row => {
const tr = document.createElement('tr');
tr.setAttribute('data-id', row.id);
tr.classList.add('clickable-row');
let rowHtml = '';
if (tableConfig.showCheckboxes) {
rowHtml += `<td class="text-center"><input type="checkbox" class="rowCheckbox" value="${row.id}"></td>`;
}
tableConfig.columns.forEach(col => {
let value = row[col.key] || '';
if (col.key.includes('date')) {
value = value && value !== 'N/A' ? new Date(value).toLocaleDateString() : 'N/A';
}
rowHtml += `<td>${value}</td>`;
});
if (tableConfig.actions.length > 0) {
rowHtml += `<td class="text-center">`;
tableConfig.actions.forEach(action => {
const routeBase = 'stations';
if (action === 'view') {
rowHtml += `<a href="/${routeBase}/${row.id}" class="btn btn-sm view-btn me-1" title="View"><i class="fa-solid fa-eye"></i></a>`;
} else if (action === 'edit') {
rowHtml += `<button class="btn btn-sm edit-btn me-1" title="Edit" onclick="openEditModal('${row.id}')"><i class="fa-solid fa-pen"></i></button>`;
} else if (action === 'delete') {
rowHtml += `<a href="/${routeBase}/${row.id}" class="btn btn-sm delete-btn" title="Delete" onclick="event.preventDefault(); if(confirm('Are you sure you want to delete this station?')) { document.getElementById('delete-form-${row.id}').submit(); }"><i class="fa-solid fa-trash"></i></a>
<form id="delete-form-${row.id}" action="/${routeBase}/${row.id}" method="POST" style="display: none;">
@csrf
@method('DELETE')
</form>`;
}
});
rowHtml += `</td>`;
}
tr.innerHTML = rowHtml;
tableBody.appendChild(tr);
});
attachEventListeners();
updateNoDataMessage();
}
function renderPagination() {
const pagination = document.getElementById('pagination');
if (!pagination) return;
pagination.innerHTML = '';
const totalPages = Math.max(tableConfig.lastPage, 1);
const routeName = tableConfig.pageTitle.toLowerCase().replace(/\s+/g, '-') + '.index';
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--;
updateUrl(currentPage, document.getElementById('searchInput')?.value || '');
}
});
pagination.appendChild(prevLi);
for (let i = 1; i <= totalPages; 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;
updateUrl(currentPage, document.getElementById('searchInput')?.value || '');
});
pagination.appendChild(li);
}
const nextLi = document.createElement('li');
nextLi.className = `page-item ${currentPage === totalPages ? '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 < totalPages) {
currentPage++;
updateUrl(currentPage, document.getElementById('searchInput')?.value || '');
}
});
pagination.appendChild(nextLi);
}
function updateUrl(page, search = '') {
const url = new URL(window.location);
url.searchParams.set('page', page);
if (search) {
url.searchParams.set('_search', search);
} else {
url.searchParams.delete('_search');
}
Object.keys(sortDirection).forEach(colIndex => {
const key = tableConfig.columns[colIndex].key;
url.searchParams.set('sort', `${key}|${sortDirection[colIndex]}`);
});
window.location.href = url.toString();
}
function updateNoDataMessage() {
const noDataMessage = document.getElementById('no-data-message');
if (noDataMessage) {
noDataMessage.style.display = filteredRows.length === 0 ? 'block' : 'none';
}
}
function openEditModal(id) {
const row = tableConfig.data.find(row => row.id === id);
if (!row) return;
const editForm = document.getElementById('editForm');
if (editForm) {
editForm.action = `/stations/${id}`;
document.getElementById('editId').value = id;
tableConfig.columns.forEach(col => {
const input = document.getElementById(`edit_${col.key}`);
if (input) {
input.value = row[col.key] || '';
}
});
const modal = new bootstrap.Modal(document.getElementById('editModal'));
modal.show();
}
}
function openViewModal(id) {
const row = tableConfig.data.find(row => row.id === id);
if (!row) return;
const modalBody = document.getElementById('viewModalBody');
if (modalBody) {
let html = '';
tableConfig.columns.forEach(col => {
let value = row[col.key] || 'N/A';
if (col.key.includes('date')) {
value = value && value !== 'N/A' ? new Date(value).toLocaleDateString() : 'N/A';
}
html += `<p><strong>${col.name}:</strong> ${value}</p>`;
});
modalBody.innerHTML = html;
const modal = new bootstrap.Modal(document.getElementById('viewModal'));
modal.show();
}
}
function attachEventListeners() {
const searchInput = document.getElementById('searchInput');
if (searchInput) {
searchInput.addEventListener('input', function() {
updateUrl(1, this.value);
});
}
document.querySelectorAll('.sortable').forEach(header => {
header.addEventListener('click', function() {
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';
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');
}
updateUrl(1, document.getElementById('searchInput')?.value || '');
});
});
const clearFilters = document.getElementById('clearFilters');
if (clearFilters) {
clearFilters.addEventListener('click', function() {
if (searchInput) searchInput.value = '';
sortDirection = {};
document.querySelectorAll('.sortable i').forEach(icon => {
icon.classList.remove('fa-sort-up', 'fa-sort-down');
icon.classList.add('fa-sort');
});
updateUrl(1, '');
});
}
const checkboxes = document.querySelectorAll('.rowCheckbox');
const selectAll = document.getElementById('selectAll');
const deleteSelected = document.getElementById('deleteSelected');
if (selectAll) {
selectAll.addEventListener('change', function() {
checkboxes.forEach(checkbox => checkbox.checked = this.checked);
updateDeleteButton();
});
}
if (checkboxes.length > 0) {
checkboxes.forEach(checkbox => {
checkbox.addEventListener('change', updateDeleteButton);
});
}
if (deleteSelected) {
deleteSelected.addEventListener('click', function() {
const selectedIds = Array.from(document.querySelectorAll('.rowCheckbox:checked')).map(cb => cb.value);
if (selectedIds.length > 0 && confirm('Are you sure you want to delete the selected stations?')) {
fetch('/stations/batch-delete', {
method: 'POST',
headers: {
'X-CSRF-TOKEN': tableConfig.csrfToken,
'Content-Type': 'application/json',
'Accept': 'application/json',
},
body: JSON.stringify({ station_ids: selectedIds })
}).then(response => response.json())
.then(data => {
if (data.success) {
location.reload();
} else {
alert(data.message || 'Error deleting stations');
}
})
.catch(error => {
console.error('Error:', error);
alert('An error occurred while deleting the stations.');
});
}
});
}
document.querySelectorAll('.clickable-row').forEach(row => {
row.addEventListener('click', function(e) {
if (e.target.closest('.rowCheckbox, .edit-btn, .view-btn, .delete-btn')) {
return;
}
const id = this.getAttribute('data-id');
if (tableConfig.showViewModal) {
openViewModal(id);
} else {
window.location.href = `/stations/${id}`;
}
});
});
}
function updateDeleteButton() {
const deleteSelected = document.getElementById('deleteSelected');
const checkedBoxes = document.querySelectorAll('.rowCheckbox:checked');
deleteSelected.disabled = checkedBoxes.length === 0;
}
renderTable();
renderPagination();
</script>
<script src="https://cdn.jsdelivr.net/npm/axios/dist/axios.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js"></script>

120
resources/views/pages/add-station.blade.php
View File

@ -3,84 +3,46 @@
@section('page_title', 'Add Station')
@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 Station</h5>
<div class="container">
<div class="row justify-content-center">
<div class="col-md-8">
<div class="card">
<div class="card-header">{{ __('Add Station') }}</div>
<div class="card-body">
@if (session('success'))
<div class="alert alert-success">{{ session('success') }}</div>
@endif
@if ($errors->any())
<div class="alert alert-danger">
<ul>
@foreach ($errors->all() as $error)
<li>{{ $error }}</li>
@endforeach
</ul>
</div>
@endif
<form method="POST" action="{{ route('stations.store') }}">
@csrf
<div class="mb-3">
<label for="station_code" class="form-label">{{ __('Station Code') }}</label>
<input type="text" class="form-control" id="station_code" name="station_code" value="{{ old('station_code') }}" required>
</div>
<div class="mb-3">
<label for="station_name" class="form-label">{{ __('Station Name') }}</label>
<input type="text" class="form-control" id="station_name" name="station_name" value="{{ old('station_name') }}" required>
</div>
<div class="mb-3">
<label for="branch_name" class="form-label">{{ __('Branch Name') }}</label>
<input type="text" class="form-control" id="branch_name" name="branch_name" value="{{ old('branch_name') }}" required>
</div>
<div class="d-flex justify-content-end">
<a href="{{ route('stations') }}" class="btn btn-secondary me-2">{{ __('Cancel') }}</a>
<button type="submit" class="btn btn-primary">{{ __('Add Station') }}</button>
</div>
</form>
</div>
</div>
</div>
</div>
</div>
<div class="card-body py-2">
<form action="#" method="POST" id="addStationForm">
@csrf
<div class="mb-2">
<label for="stationCode" class="form-label mb-1">Station Code</label>
<input type="text" class="form-control form-control-sm" id="stationCode" name="stationCode" required>
</div>
<div class="mb-2">
<label for="stationName" class="form-label mb-1">Station Name</label>
<input type="text" class="form-control form-control-sm" id="stationName" name="stationName" required>
</div>
<div class="mb-2">
<label for="stationLocation" class="form-label mb-1">Station Location</label>
<input type="text" class="form-control form-control-sm" id="stationLocation" name="stationLocation" required>
</div>
<div class="mb-2">
<label for="mapUrl" class="form-label mb-1">Map URL</label>
<input type="url" class="form-control form-control-sm" id="mapUrl" name="mapUrl" required>
</div>
<div class="mb-2">
<label for="latitude" class="form-label mb-1">Latitude</label>
<input type="text" class="form-control form-control-sm" id="latitude" name="latitude" required>
</div>
<div class="mb-2">
<label for="longitude" class="form-label mb-1">Longitude</label>
<input type="text" class="form-control form-control-sm" id="longitude" name="longitude" required>
</div>
<div class="mb-2">
<label for="contactNumber" class="form-label mb-1">Contact Number</label>
<input type="text" class="form-control form-control-sm" id="contactNumber" name="contactNumber" required>
</div>
<div class="mb-2">
<label for="branch" class="form-label mb-1">Branch</label>
<input type="text" class="form-control form-control-sm" id="branch" name="branch" required>
</div>
<div class="d-flex justify-content-end mt-3">
<a href="{{ url('stations') }}" 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 Station</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>
@endsection

49
resources/views/pages/edit-station.blde.php Normal file
View File

@ -0,0 +1,49 @@
@extends('layouts.app')
@section('page_title', 'Edit Station')
@section('content')
<div class="container">
<div class="row justify-content-center">
<div class="col-md-8">
<div class="card">
<div class="card-header">{{ __('Edit Station') }}</div>
<div class="card-body">
@if (session('success'))
<div class="alert alert-success">{{ session('success') }}</div>
@endif
@if ($errors->any())
<div class="alert alert-danger">
<ul>
@foreach ($errors->all() as $error)
<li>{{ $error }}</li>
@endforeach
</ul>
</div>
@endif
<form method="POST" action="{{ route('stations.update', $station['id']) }}">
@csrf
@method('PUT')
<div class="mb-3">
<label for="station_code" class="form-label">{{ __('Station Code') }}</label>
<input type="text" class="form-control" id="station_code" name="station_code" value="{{ old('station_code', $station['station_code']) }}" required>
</div>
<div class="mb-3">
<label for="station_name" class="form-label">{{ __('Station Name') }}</label>
<input type="text" class="form-control" id="station_name" name="station_name" value="{{ old('station_name', $station['station_name']) }}" required>
</div>
<div class="mb-3">
<label for="branch_name" class="form-label">{{ __('Branch Name') }}</label>
<input type="text" class="form-control" id="branch_name" name="branch_name" value="{{ old('branch_name', $station['branch_name']) }}" required>
</div>
<div class="d-flex justify-content-end">
<a href="{{ route('station-management') }}" class="btn btn-secondary me-2">{{ __('Cancel') }}</a>
<button type="submit" class="btn btn-primary">{{ __('Update Station') }}</button>
</div>
</form>
</div>
</div>
</div>
</div>
</div>
@endsection

171
resources/views/pages/station locator/stations.blade.php
View File

@ -3,164 +3,9 @@
@section('page_title', 'Station Management')
@section('content')
@php
$stations = [
[
'id' => 1,
'station_code' => 'ST001',
'station_name' => 'North Station',
'branch_name' => 'Quezon City Branch',
'date_created' => '2023-05-01',
'created_by' => 'Maryse Howe',
'modified_by' => 'Joseph Sazon',
'date_modified' => '2023-06-15'
],
[
'id' => 2,
'station_code' => 'ST002',
'station_name' => 'East Hub',
'branch_name' => 'Pasig Branch',
'date_created' => '2023-05-10',
'created_by' => 'Graxia Montino',
'modified_by' => 'Cine Rosimo',
'date_modified' => '2023-07-01'
],
[
'id' => 3,
'station_code' => 'ST003',
'station_name' => 'West Terminal',
'branch_name' => 'Makati Branch',
'date_created' => '2023-06-20',
'created_by' => 'Cine Rosimo',
'modified_by' => 'Graxia Montino',
'date_modified' => '2023-08-05'
],
[
'id' => 4,
'station_code' => 'ST004',
'station_name' => 'Central Depot',
'branch_name' => 'Manila Branch',
'date_created' => '2023-07-05',
'created_by' => 'Maryse Howe',
'modified_by' => 'Maryse Howe',
'date_modified' => '2023-09-10'
],
[
'id' => 5,
'station_code' => 'ST005',
'station_name' => 'South Station',
'branch_name' => 'Parañaque Branch',
'date_created' => '2023-08-15',
'created_by' => 'Joseph Sazon',
'modified_by' => 'Graxia Montino',
'date_modified' => '2023-10-01'
],
[
'id' => 1,
'station_code' => 'ST001',
'station_name' => 'North Station',
'branch_name' => 'Quezon City Branch',
'date_created' => '2023-05-01',
'created_by' => 'Maryse Howe',
'modified_by' => 'Joseph Sazon',
'date_modified' => '2023-06-15'
],
[
'id' => 2,
'station_code' => 'ST002',
'station_name' => 'East Hub',
'branch_name' => 'Pasig Branch',
'date_created' => '2023-05-10',
'created_by' => 'Graxia Montino',
'modified_by' => 'Cine Rosimo',
'date_modified' => '2023-07-01'
],
[
'id' => 3,
'station_code' => 'ST003',
'station_name' => 'West Terminal',
'branch_name' => 'Makati Branch',
'date_created' => '2023-06-20',
'created_by' => 'Cine Rosimo',
'modified_by' => 'Graxia Montino',
'date_modified' => '2023-08-05'
],
[
'id' => 4,
'station_code' => 'ST004',
'station_name' => 'Central Depot',
'branch_name' => 'Manila Branch',
'date_created' => '2023-07-05',
'created_by' => 'Maryse Howe',
'modified_by' => 'Maryse Howe',
'date_modified' => '2023-09-10'
],
[
'id' => 5,
'station_code' => 'ST005',
'station_name' => 'South Station',
'branch_name' => 'Parañaque Branch',
'date_created' => '2023-08-15',
'created_by' => 'Joseph Sazon',
'modified_by' => 'Graxia Montino',
'date_modified' => '2023-10-01'
],
[
'id' => 1,
'station_code' => 'ST001',
'station_name' => 'North Station',
'branch_name' => 'Quezon City Branch',
'date_created' => '2023-05-01',
'created_by' => 'Maryse Howe',
'modified_by' => 'Joseph Sazon',
'date_modified' => '2023-06-15'
],
[
'id' => 2,
'station_code' => 'ST002',
'station_name' => 'East Hub',
'branch_name' => 'Pasig Branch',
'date_created' => '2023-05-10',
'created_by' => 'Graxia Montino',
'modified_by' => 'Cine Rosimo',
'date_modified' => '2023-07-01'
],
[
'id' => 3,
'station_code' => 'ST003',
'station_name' => 'West Terminal',
'branch_name' => 'Makati Branch',
'date_created' => '2023-06-20',
'created_by' => 'Cine Rosimo',
'modified_by' => 'Graxia Montino',
'date_modified' => '2023-08-05'
],
[
'id' => 4,
'station_code' => 'ST004',
'station_name' => 'Central Depot',
'branch_name' => 'Manila Branch',
'date_created' => '2023-07-05',
'created_by' => 'Maryse Howe',
'modified_by' => 'Maryse Howe',
'date_modified' => '2023-09-10'
],
[
'id' => 5,
'station_code' => 'ST005',
'station_name' => 'South Station',
'branch_name' => 'Parañaque Branch',
'date_created' => '2023-08-15',
'created_by' => 'Joseph Sazon',
'modified_by' => 'Graxia Montino',
'date_modified' => '2023-10-01'
],
];
@endphp
@include('components.table-component', [
@include('components.station-component', [
'pageTitle' => 'Station Management',
'data' => $stations,
'data' => $stations ?? [],
'columns' => [
['name' => 'Station Code', 'key' => 'station_code', 'sortable' => true],
['name' => 'Station Name', 'key' => 'station_name', 'sortable' => true],
@ -170,12 +15,18 @@
['name' => 'Modified By', 'key' => 'modified_by', 'sortable' => true],
['name' => 'Date Modified', 'key' => 'date_modified', 'sortable' => true]
],
'actions' => ['edit', 'view', 'delete'],
'actions' => ['view', 'edit', 'delete'],
'showAddButton' => true,
'addButtonUrl' => '/add-station',
'addButtonUrl' => route('stations.create'),
'showCheckboxes' => false,
'showBatchDelete' => false,
'showEditModal' => true,
'showViewModal' => true
'showViewModal' => true,
'currentPage' => $currentPage ?? 1,
'lastPage' => $lastPage ?? 1,
'total' => $total ?? 0,
])
<div id="no-data-message" style="display: {{ empty($stations ?? []) ? 'block' : 'none' }}; text-align: center; margin-top: 20px;">
<p>No stations found.</p>
</div>
@endsection

41
resources/views/pages/view-station.blade.php Normal file
View File

@ -0,0 +1,41 @@
@extends('layouts.app')
@section('page_title', 'View Station')
@section('content')
<div class="container">
<div class="row justify-content-center">
<div class="col-md-8">
<div class="card">
<div class="card-header">{{ __('Station Details') }}</div>
<div class="card-body">
<div class="mb-3">
<strong>{{ __('Station Code') }}:</strong> {{ $station['station_code'] }}
</div>
<div class="mb-3">
<strong>{{ __('Station Name') }}:</strong> {{ $station['station_name'] }}
</div>
<div class="mb-3">
<strong>{{ __('Branch Name') }}:</strong> {{ $station['branch_name'] }}
</div>
<div class="mb-3">
<strong>{{ __('Date Created') }}:</strong> {{ $station['date_created'] }}
</div>
<div class="mb-3">
<strong>{{ __('Created By') }}:</strong> {{ $station['created_by'] }}
</div>
<div class="mb-3">
<strong>{{ __('Modified By') }}:</strong> {{ $station['modified_by'] }}
</div>
<div class="mb-3">
<strong>{{ __('Date Modified') }}:</strong> {{ $station['date_modified'] }}
</div>
<div class="d-flex justify-content-end">
<a href="{{ route('station-management') }}" class="btn btn-secondary">{{ __('Back') }}</a>
</div>
</div>
</div>
</div>
</div>
</div>
@endsection

16
routes/web.php
View File

@ -12,7 +12,7 @@ use App\Http\Controllers\PromotionController;
use App\Http\Controllers\TermsAndPrivacyController;
use App\Http\Controllers\CardTypeController;
use App\Http\Controllers\ReportsController;
use App\Http\Controllers\StationController;
Route::get('/', function () {
return redirect()->route('login');
@ -55,9 +55,7 @@ Route::get('/branches', function () {
return view('pages.station locator.branches');
})->name('branches');
Route::get('/stations', function () {
return view('pages.station locator.stations');
})->name('stations');
Route::get('/fuels', function () {
return view('pages.station locator.fuels');
@ -205,6 +203,12 @@ Route::get('/registration-report', [ReportsController::class, 'registration'])->
Route::get('/station-rating-report', [ReportsController::class, 'stationRating'])->name('station-rating-report');
Route::get('/top-up-usage-report', [ReportsController::class, 'topUp'])->name('top-up-usage-report');
//Station
Route::get('/station-management', [StationController::class, 'index'])->name('stations');
Route::get('/stations/create', [StationController::class, 'create'])->name('stations.create');
// Route::post('/stations', [StationController::class, 'store'])->name('stations.store');
// Route::get('/stations/{id}', [StationController::class, 'show'])->name('stations.show');
// Route::get('/stations/{id}/edit', [StationController::class, 'edit'])->name('stations.edit');
// Route::put('/stations/{id}', [StationController::class, 'update'])->name('stations.update');
// Route::delete('/stations/{id}', [StationController::class, 'destroy'])->name('stations.destroy');