added fuels and add-fuels pages
This commit is contained in:
parent
c921660d77
commit
0533545869
|
|
@ -0,0 +1,69 @@
|
||||||
|
@extends('layouts.app')
|
||||||
|
|
||||||
|
@section('page_title', 'Add Fuel')
|
||||||
|
|
||||||
|
@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 Fuel</h5>
|
||||||
|
</div>
|
||||||
|
<div class="row justify-content-center">
|
||||||
|
<div class="card-body p-3">
|
||||||
|
<form id="addFuelForm">
|
||||||
|
<div class="mb-3">
|
||||||
|
<label for="fuelName" class="form-label">Fuel Name</label>
|
||||||
|
<input type="text" class="form-control" id="fuelName" placeholder="Enter fuel name" required>
|
||||||
|
</div>
|
||||||
|
<div class="d-flex justify-content-end mt-3">
|
||||||
|
<button type="button" class="btn btn-outline-secondary me-2" style="margin-right:5px">Cancel</button>
|
||||||
|
<button type="submit" class="btn btn-primary">Add Fuel</button>
|
||||||
|
</div>
|
||||||
|
</form>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<style>
|
||||||
|
.card {
|
||||||
|
border-radius: 5px;
|
||||||
|
border: 1px solid #dee2e6;
|
||||||
|
}
|
||||||
|
.form-label {
|
||||||
|
font-size: 0.95rem;
|
||||||
|
}
|
||||||
|
.form-control {
|
||||||
|
font-size: 0.9rem;
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
document.getElementById('addFuelForm').addEventListener('submit', function(e) {
|
||||||
|
e.preventDefault();
|
||||||
|
|
||||||
|
const fuelName = document.getElementById('fuelName').value;
|
||||||
|
|
||||||
|
if (!fuelName) {
|
||||||
|
alert('Please fill out the required field.');
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
const currentDate = new Date().toISOString().split('T')[0]; // e.g., "2025-04-16"
|
||||||
|
const newFuel = {
|
||||||
|
id: Date.now(),
|
||||||
|
fuelName,
|
||||||
|
dateCreated: currentDate,
|
||||||
|
dateModified: currentDate
|
||||||
|
};
|
||||||
|
|
||||||
|
let fuels = JSON.parse(sessionStorage.getItem('fuels') || '[]');
|
||||||
|
fuels.push(newFuel);
|
||||||
|
sessionStorage.setItem('fuels', JSON.stringify(fuels));
|
||||||
|
|
||||||
|
alert('Fuel added successfully!');
|
||||||
|
window.location.href = '/fuels';
|
||||||
|
});
|
||||||
|
|
||||||
|
document.querySelector('.btn-outline-secondary').addEventListener('click', function() {
|
||||||
|
window.location.href = '/fuels';
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
@endsection
|
||||||
|
|
@ -1,14 +1,75 @@
|
||||||
@extends('layouts.app')
|
@extends('layouts.app')
|
||||||
|
|
||||||
@section('page_title', 'Station Locator')
|
@section('page_title', 'Fuels')
|
||||||
|
|
||||||
@section('content')
|
@section('content')
|
||||||
<div class="card" style="min-height: 500px;">
|
@php
|
||||||
<div class="card-header">
|
$fuels = [
|
||||||
<i class="fa-solid fa-location-dot" style="color:gray;"> Fuels</i>
|
[
|
||||||
</div>
|
'id' => 1,
|
||||||
<div class="card-body">
|
'fuelName' => 'Unleaded 91',
|
||||||
<p>This is the Fuels page content.</p>
|
'dateCreated' => '2025-01-01',
|
||||||
</div>
|
'dateModified' => '2025-04-01'
|
||||||
</div>
|
],
|
||||||
|
[
|
||||||
|
'id' => 2,
|
||||||
|
'fuelName' => 'Unleaded 95',
|
||||||
|
'dateCreated' => '2025-02-01',
|
||||||
|
'dateModified' => '2025-04-10'
|
||||||
|
],
|
||||||
|
[
|
||||||
|
'id' => 3,
|
||||||
|
'fuelName' => 'Diesel',
|
||||||
|
'dateCreated' => '2025-03-01',
|
||||||
|
'dateModified' => '2025-03-01'
|
||||||
|
],
|
||||||
|
[
|
||||||
|
'id' => 4,
|
||||||
|
'fuelName' => 'Premium Unleaded 98',
|
||||||
|
'dateCreated' => '2025-01-15',
|
||||||
|
'dateModified' => '2025-04-05'
|
||||||
|
],
|
||||||
|
[
|
||||||
|
'id' => 5,
|
||||||
|
'fuelName' => 'Kerosene',
|
||||||
|
'dateCreated' => '2025-02-15',
|
||||||
|
'dateModified' => '2025-02-15'
|
||||||
|
],
|
||||||
|
[
|
||||||
|
'id' => 6,
|
||||||
|
'fuelName' => 'Biofuel E10',
|
||||||
|
'dateCreated' => '2025-03-15',
|
||||||
|
'dateModified' => '2025-04-12'
|
||||||
|
]
|
||||||
|
];
|
||||||
|
@endphp
|
||||||
|
|
||||||
|
@include('components.table-component', [
|
||||||
|
'pageTitle' => 'Fuels',
|
||||||
|
'data' => $fuels,
|
||||||
|
'columns' => [
|
||||||
|
['name' => 'Fuel Name', 'key' => 'fuelName', 'sortable' => true],
|
||||||
|
['name' => 'Date Created', 'key' => 'dateCreated', 'sortable' => true],
|
||||||
|
['name' => 'Date Modified', 'key' => 'dateModified', 'sortable' => true]
|
||||||
|
],
|
||||||
|
'allFields' => [
|
||||||
|
['name' => 'Fuel Name', 'key' => 'fuelName', 'type' => 'text', 'required' => true]
|
||||||
|
],
|
||||||
|
'actions' => ['edit', 'delete'],
|
||||||
|
'showAddButton' => true,
|
||||||
|
'addButtonUrl' => '/add-fuels',
|
||||||
|
'showCheckboxes' => false,
|
||||||
|
'showBatchDelete' => false,
|
||||||
|
'showEditModal' => true,
|
||||||
|
'showViewModal' => false
|
||||||
|
])
|
||||||
|
|
||||||
|
<script>
|
||||||
|
const storedFuels = JSON.parse(sessionStorage.getItem('fuels') || '[]');
|
||||||
|
if (storedFuels.length > 0) {
|
||||||
|
tableConfig.data = [...tableConfig.data, ...storedFuels];
|
||||||
|
renderTable();
|
||||||
|
renderPagination();
|
||||||
|
}
|
||||||
|
</script>
|
||||||
@endsection
|
@endsection
|
||||||
|
|
@ -123,3 +123,7 @@ Route::get('/add-terms-and-privacy', function () {
|
||||||
Route::get('/add-branches', function () {
|
Route::get('/add-branches', function () {
|
||||||
return view('pages.add-branches');
|
return view('pages.add-branches');
|
||||||
})->name('add-branches');
|
})->name('add-branches');
|
||||||
|
|
||||||
|
Route::get('/add-fuels', function () {
|
||||||
|
return view('pages.add-fuels');
|
||||||
|
})->name('add-fuels');
|
||||||
Loading…
Reference in New Issue