on-demand and top-up settings screen added
This commit is contained in:
parent
5bc2782198
commit
55e6136de7
Binary file not shown.
|
After Width: | Height: | Size: 2.7 MiB |
|
|
@ -6,8 +6,7 @@
|
|||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
|
||||
|
||||
<title>CMS-Laravel
|
||||
</title>
|
||||
<title>CMS-Laravel</title>
|
||||
<link rel="stylesheet" href="{{ asset('css/bootstrap.min.css') }}">
|
||||
<link rel="stylesheet" href="{{ asset('css/custom.css') }}">
|
||||
<link rel="preconnect" href="https://fonts.googleapis.com">
|
||||
|
|
@ -17,6 +16,21 @@
|
|||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.0/css/all.min.css"
|
||||
integrity="sha512-..." crossorigin="anonymous" referrerpolicy="no-referrer" />
|
||||
|
||||
<!-- Inline CSS to fix sidebar spacing -->
|
||||
<style>
|
||||
#sidebar .components li {
|
||||
margin-bottom: 5px; /* Reduce gap between sidebar items */
|
||||
}
|
||||
#sidebar .components li.dropdown {
|
||||
margin-bottom: 0; /* Ensure dropdown items don't add extra space when collapsed */
|
||||
}
|
||||
#sidebar .components li.dropdown .menu {
|
||||
margin-top: 0; /* Remove extra space above dropdown menu */
|
||||
}
|
||||
#sidebar .components li a {
|
||||
padding: 10px 15px; /* Consistent padding for all sidebar links */
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
|
@ -29,6 +43,7 @@
|
|||
$aboutUs = ['card-types', 'terms-and-privacy'];
|
||||
$reports = ['registration-report', 'top-up-usage-report', 'mobile-usage-report', 'station-rating-report'];
|
||||
$stationLocator = ['branches', 'stations', 'fuels'];
|
||||
$fuelPriceUpdate = ['fuel-price-on-demand', 'fuel-price-schedule', 'fuel-price-update-logs'];
|
||||
@endphp
|
||||
|
||||
<!-- Sidebar -->
|
||||
|
|
@ -38,7 +53,6 @@
|
|||
</div>
|
||||
|
||||
<ul class="list-unstyled components">
|
||||
|
||||
<!-- Static Items -->
|
||||
<li class="{{ Request::is('user-management') ? 'active' : '' }}">
|
||||
<a href="{{ route('user.management') }}" class="dashboard" style="display:flex">
|
||||
|
|
@ -52,7 +66,7 @@
|
|||
</li>
|
||||
|
||||
<!-- Member Management -->
|
||||
<li class="dropdown {{ in_array(Request::path(), $memberManagement) }}">
|
||||
<li class="dropdown {{ in_array(Request::path(), $memberManagement) ? 'active' : '' }}">
|
||||
<a href="#homeSubmenu1" data-toggle="collapse"
|
||||
aria-expanded="{{ in_array(Request::path(), $memberManagement) ? 'true' : 'false' }}"
|
||||
class="dropdown-toggle" style="display:flex">
|
||||
|
|
@ -70,7 +84,7 @@
|
|||
</li>
|
||||
|
||||
<!-- Home Page -->
|
||||
<li class="dropdown {{ in_array(Request::path(), $homePage) }}">
|
||||
<li class="dropdown {{ in_array(Request::path(), $homePage) ? 'active' : '' }}">
|
||||
<a href="#pageSubmenu2" data-toggle="collapse"
|
||||
aria-expanded="{{ in_array(Request::path(), $homePage) ? 'true' : 'false' }}"
|
||||
class="dropdown-toggle" style="display:flex">
|
||||
|
|
@ -96,8 +110,15 @@
|
|||
<i class="fa-solid fa-wallet" style="padding-top:3px"></i><span>Top-Up</span>
|
||||
</a>
|
||||
</li>
|
||||
|
||||
<li class="{{ Request::is('top-up-settings') ? 'active' : '' }}">
|
||||
<a href="{{ route('top-up-settings') }}" class="dashboard" style="display:flex">
|
||||
<i class="fa-solid fa-cog" style="padding-top:3px"></i><span>Top Up Settings</span>
|
||||
</a>
|
||||
</li>
|
||||
|
||||
<!-- About Us -->
|
||||
<li class="dropdown {{ in_array(Request::path(), $aboutUs) }}">
|
||||
<li class="dropdown {{ in_array(Request::path(), $aboutUs) ? 'active' : '' }}">
|
||||
<a href="#pageSubmenu3" data-toggle="collapse"
|
||||
aria-expanded="{{ in_array(Request::path(), $aboutUs) ? 'true' : 'false' }}"
|
||||
class="dropdown-toggle" style="display:flex">
|
||||
|
|
@ -113,8 +134,9 @@
|
|||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
|
||||
<!-- Reports -->
|
||||
<li class="dropdown {{ in_array(Request::path(), $reports) }}">
|
||||
<li class="dropdown {{ in_array(Request::path(), $reports) ? 'active' : '' }}">
|
||||
<a href="#pageSubmenu4" data-toggle="collapse"
|
||||
aria-expanded="{{ in_array(Request::path(), $reports) ? 'true' : 'false' }}"
|
||||
class="dropdown-toggle" style="display:flex">
|
||||
|
|
@ -136,14 +158,37 @@
|
|||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
|
||||
<!-- Static -->
|
||||
<li class="{{ Request::is('system-parameters') ? 'active' : '' }}">
|
||||
<a href="{{ route('system-parameters') }}" style="display:flex">
|
||||
<i class="fa-solid fa-sliders" style="padding-top:3px"></i><span>System Parameters</span>
|
||||
</a>
|
||||
</li>
|
||||
|
||||
<!-- Fuel Price Update -->
|
||||
<li class="dropdown {{ in_array(Request::path(), $fuelPriceUpdate) ? 'active' : '' }}">
|
||||
<a href="#pageSubmenu6" data-toggle="collapse"
|
||||
aria-expanded="{{ in_array(Request::path(), $fuelPriceUpdate) ? 'true' : 'false' }}"
|
||||
class="dropdown-toggle" style="display:flex">
|
||||
<i class="fa-solid fa-gas-pump" style="padding-top:3px"></i><span>Fuel Price Update</span>
|
||||
</a>
|
||||
<ul class="collapse list-unstyled menu {{ in_array(Request::path(), $fuelPriceUpdate) ? 'show' : '' }}"
|
||||
id="pageSubmenu6">
|
||||
<li class="{{ Request::is('fuel-price-on-demand') ? 'active' : '' }}">
|
||||
<a href="{{ route('fuel-price-on-demand') }}">On-Demand</a>
|
||||
</li>
|
||||
<li class="{{ Request::is('fuel-price-schedule') ? 'active' : '' }}">
|
||||
<a href="{{ route('fuel-price-schedule') }}">Schedule</a>
|
||||
</li>
|
||||
<li class="{{ Request::is('fuel-price-update-logs') ? 'active' : '' }}">
|
||||
<a href="{{ route('fuel-price-update-logs') }}">Update Logs</a>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
|
||||
<!-- Station Locator -->
|
||||
<li class="dropdown {{ in_array(Request::path(), $stationLocator) }}">
|
||||
<li class="dropdown {{ in_array(Request::path(), $stationLocator) ? 'active' : '' }}">
|
||||
<a href="#pageSubmenu5" data-toggle="collapse"
|
||||
aria-expanded="{{ in_array(Request::path(), $stationLocator) ? 'true' : 'false' }}"
|
||||
class="dropdown-toggle" style="display:flex">
|
||||
|
|
@ -164,12 +209,13 @@
|
|||
</li>
|
||||
</ul>
|
||||
</nav>
|
||||
<!-- Page Content -->
|
||||
|
||||
<!-- Page Content -->
|
||||
<div id="content">
|
||||
<div class="top-navbar">
|
||||
<nav class="navbar navbar-expand-lg" style="background-color:rgba(231, 70, 16, 0.84)">
|
||||
<div class="container-fluid">
|
||||
<button type="button" id="sidebarCollapse" class="d-xl-block d-lg-block d-md-mone d-none">
|
||||
<button type="button" id="sidebarCollapse" class="d-xl-block d-lg-block d-md-none d-none">
|
||||
<span class="fa-solid fa-arrow-left"></span>
|
||||
</button>
|
||||
<button class="d-inline-block d-lg-none ml-auto more-button" type="button"
|
||||
|
|
@ -223,7 +269,7 @@
|
|||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Optional JavaScript -->
|
||||
<!-- jQuery first, then Popper.js, then Bootstrap JS -->
|
||||
<script src="js/jquery-3.3.1.slim.min.js"></script>
|
||||
|
|
|
|||
|
|
@ -0,0 +1,84 @@
|
|||
@extends('layouts.app')
|
||||
|
||||
@section('page_title', 'Fuel Price On-Demand')
|
||||
|
||||
@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;font-weight:500">Fuel Price On-Demand</h5>
|
||||
</div>
|
||||
<div class="row justify-content-center align-items-center">
|
||||
<div class="col-12 col-md-8 col-lg-6">
|
||||
<div class="card-body p-3">
|
||||
<form id="fuelPriceForm">
|
||||
<!-- Import File Section -->
|
||||
<div class="mb-3">
|
||||
<label class="form-label fw-bold" style="font-size: 1.5rem;">Import File</label>
|
||||
<div class="input-group mb-3">
|
||||
<input type="file" class="form-control" id="fuelPriceFile" style="font-size: 0.9rem; margin: 10px;">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<!-- Buttons -->
|
||||
<div class="d-flex justify-content-center gap-3" >
|
||||
<button type="submit" class="btn btn-primary d-flex align-items-center" style="background-color: #E74610; border-color: #E74610; font-size: 1.2rem; padding: 10px 20px;">
|
||||
SUBMIT <i class="fas fa-paper-plane ms-2"></i>
|
||||
</button>
|
||||
<button type="button" id="exportFuelPrices" class="btn btn-secondary d-flex align-items-center" style="font-size: 1.2rem; padding: 10px 20px;">
|
||||
EXPORT FUEL PRICES <i class="fas fa-cloud-download-alt ms-2"></i>
|
||||
</button>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<style>
|
||||
.card {
|
||||
border-radius: 5px;
|
||||
border: 1px solid #dee2e6;
|
||||
}
|
||||
.form-label {
|
||||
font-size: 1.2rem;
|
||||
}
|
||||
.form-control {
|
||||
font-size: 1.2rem;
|
||||
}
|
||||
.btn-primary:hover {
|
||||
background-color: #e07b30;
|
||||
border-color: #e07b30;
|
||||
}
|
||||
.btn-secondary {
|
||||
background-color: #6c757d;
|
||||
border-color: #6c757d;
|
||||
}
|
||||
.btn-secondary:hover {
|
||||
background-color: #5a6268;
|
||||
border-color: #5a6268;
|
||||
}
|
||||
.d-flex.justify-content-center {
|
||||
gap: 1rem; /* Space between buttons */
|
||||
}
|
||||
</style>
|
||||
|
||||
<script>
|
||||
document.getElementById('fuelPriceForm').addEventListener('submit', function(e) {
|
||||
e.preventDefault();
|
||||
|
||||
const fileInput = document.getElementById('fuelPriceFile');
|
||||
if (!fileInput.files.length) {
|
||||
alert('Please select a file to import.');
|
||||
return;
|
||||
}
|
||||
|
||||
// Simulate file import (frontend-only)
|
||||
alert('File imported successfully!');
|
||||
fileInput.value = ''; // Reset file input
|
||||
});
|
||||
|
||||
document.getElementById('exportFuelPrices').addEventListener('click', function() {
|
||||
// Simulate export action (frontend-only)
|
||||
alert('Fuel prices exported successfully!');
|
||||
});
|
||||
</script>
|
||||
@endsection
|
||||
|
|
@ -0,0 +1,83 @@
|
|||
@extends('layouts.app')
|
||||
|
||||
@section('page_title', 'Top-Up Settings')
|
||||
|
||||
@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;font-weight:500">Top-Up Settings</h5>
|
||||
</div>
|
||||
<div class="row justify-content-center align-items-center">
|
||||
<div class="col-12 col-md-8 col-lg-6">
|
||||
<div class="card-body p-3">
|
||||
<form id="topUpSettingsForm">
|
||||
<!-- Current Discount Display -->
|
||||
<div class="mb-2">
|
||||
<label class="form-label fw-bold" style="font-size: 1.5rem;">
|
||||
Current Discount: <span style="color: #E74610;">2%</span>
|
||||
</label>
|
||||
</div>
|
||||
|
||||
<!-- Top Up Discount Input -->
|
||||
<div class="mb-2">
|
||||
<label for="discount" class="form-label" style="font-size: 1.2rem;">Top Up Discount (%)</label>
|
||||
<div class="d-flex align-items-center">
|
||||
<input type="number" class="form-control me-2" id="discount" placeholder="Enter discount percentage" value="3" step="0.01" required style="width: 300px; font-size: 1.2rem; padding: 10px;">
|
||||
<button type="submit" class="btn btn-primary" style="background-color: #E74610; border-color: #E74610; font-size: 1.2rem; padding: 10px 20px;">SUBMIT</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Card Image -->
|
||||
<div class="mt-3 text-center">
|
||||
<img src="{{ asset('img/card.png') }}" alt="Loyalty Card" style="max-width: 300px;">
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<style>
|
||||
.card {
|
||||
border-radius: 5px;
|
||||
border: 1px solid #dee2e6;
|
||||
}
|
||||
.form-label {
|
||||
font-size: 1.2rem;
|
||||
}
|
||||
.form-control {
|
||||
font-size: 1.2rem;
|
||||
}
|
||||
.btn-primary:hover {
|
||||
background-color: #e07b30;
|
||||
border-color: #e07b30;
|
||||
}
|
||||
/* Ensure the input and button are closely aligned */
|
||||
.d-flex.align-items-center {
|
||||
gap: 0.5rem; /* Small gap between input and button */
|
||||
}
|
||||
</style>
|
||||
|
||||
<script>
|
||||
document.getElementById('topUpSettingsForm').addEventListener('submit', function(e) {
|
||||
e.preventDefault();
|
||||
|
||||
const discount = document.getElementById('discount').value;
|
||||
|
||||
if (!discount || discount < 0) {
|
||||
alert('Please enter a valid discount percentage.');
|
||||
return;
|
||||
}
|
||||
|
||||
// Simulate updating the discount (frontend-only)
|
||||
sessionStorage.setItem('topUpDiscount', discount);
|
||||
|
||||
alert('Discount updated successfully!');
|
||||
window.location.reload(); // Reload to reflect the new "Current Discount"
|
||||
});
|
||||
|
||||
// On page load, update the current discount display if stored in sessionStorage
|
||||
window.addEventListener('load', function() {
|
||||
const storedDiscount = sessionStorage.getItem('topUpDiscount') || '2';
|
||||
document.querySelector('.form-label.fw-bold span').textContent = `${storedDiscount}%`;
|
||||
});
|
||||
</script>
|
||||
@endsection
|
||||
|
|
@ -131,3 +131,21 @@ Route::get('/add-fuels', function () {
|
|||
Route::get('/add-station', function () {
|
||||
return view('pages.add-station');
|
||||
})->name('add-station');
|
||||
|
||||
//CMS-extension
|
||||
|
||||
Route::get('/top-up-settings', function () {
|
||||
return view('pages.top-up-settings');
|
||||
})->name('top-up-settings');
|
||||
|
||||
Route::get('/fuel-price-on-demand', function () {
|
||||
return view('pages.fuel-price-on-demand');
|
||||
})->name('fuel-price-on-demand');
|
||||
|
||||
Route::get('/fuel-price-schedule', function () {
|
||||
return view('pages.fuel-price-schedule');
|
||||
})->name('fuel-price-schedule');
|
||||
|
||||
Route::get('/fuel-price-update-logs', function () {
|
||||
return view('pages.fuel-price-update-logs');
|
||||
})->name('fuel-price-update-logs');
|
||||
Loading…
Reference in New Issue