Compare commits

...

No commits in common. "main" and "master" have entirely different histories.
main ... master

118 changed files with 29278 additions and 1 deletions

18
.editorconfig Normal file
View File

@ -0,0 +1,18 @@
root = true
[*]
charset = utf-8
end_of_line = lf
indent_size = 4
indent_style = space
insert_final_newline = true
trim_trailing_whitespace = true
[*.md]
trim_trailing_whitespace = false
[*.{yml,yaml}]
indent_size = 2
[docker-compose.yml]
indent_size = 4

66
.env.example Normal file
View File

@ -0,0 +1,66 @@
APP_NAME=Laravel
APP_ENV=local
APP_KEY=base64:XezKe3raFggOy5el7fSP8dIJ/tMs5h9XZXDnsb9yfMM=
APP_DEBUG=true
APP_TIMEZONE=UTC
APP_URL=http://localhost
APP_LOCALE=en
APP_FALLBACK_LOCALE=en
APP_FAKER_LOCALE=en_US
APP_MAINTENANCE_DRIVER=file
# APP_MAINTENANCE_STORE=database
PHP_CLI_SERVER_WORKERS=4
BCRYPT_ROUNDS=12
LOG_CHANNEL=stack
LOG_STACK=single
LOG_DEPRECATIONS_CHANNEL=null
LOG_LEVEL=debug
DB_CONNECTION=mysql
DB_HOST=db_mysql
DB_PORT=3306
DB_DATABASE=laravel-cms
DB_USERNAME=laravel_user
DB_PASSWORD=password
SESSION_DRIVER=database
SESSION_LIFETIME=120
SESSION_ENCRYPT=false
SESSION_PATH=/
SESSION_DOMAIN=null
BROADCAST_CONNECTION=log
FILESYSTEM_DISK=local
QUEUE_CONNECTION=database
CACHE_STORE=database
CACHE_PREFIX=
MEMCACHED_HOST=127.0.0.1
REDIS_CLIENT=phpredis
REDIS_HOST=127.0.0.1
REDIS_PASSWORD=null
REDIS_PORT=6379
MAIL_MAILER=log
MAIL_SCHEME=null
MAIL_HOST=127.0.0.1
MAIL_PORT=2525
MAIL_USERNAME=null
MAIL_PASSWORD=null
MAIL_FROM_ADDRESS="hello@example.com"
MAIL_FROM_NAME="${APP_NAME}"
AWS_ACCESS_KEY_ID=
AWS_SECRET_ACCESS_KEY=
AWS_DEFAULT_REGION=us-east-1
AWS_BUCKET=
AWS_USE_PATH_STYLE_ENDPOINT=false
VITE_APP_NAME="${APP_NAME}"

11
.gitattributes vendored Normal file
View File

@ -0,0 +1,11 @@
* text=auto eol=lf
*.blade.php diff=html
*.css diff=css
*.html diff=html
*.md diff=markdown
*.php diff=php
/.github export-ignore
CHANGELOG.md export-ignore
.styleci.yml export-ignore

23
.gitignore vendored Normal file
View File

@ -0,0 +1,23 @@
/.phpunit.cache
/node_modules
/public/build
/public/hot
/public/storage
/storage/*.key
/storage/pail
/vendor
.env
.env.backup
.env.production
.phpactor.json
.phpunit.result.cache
Homestead.json
Homestead.yaml
npm-debug.log
yarn-error.log
/auth.json
/.fleet
/.idea
/.nova
/.vscode
/.zed

View File

@ -1,2 +1,66 @@
# cms-frontend <p align="center"><a href="https://laravel.com" target="_blank"><img src="https://raw.githubusercontent.com/laravel/art/master/logo-lockup/5%20SVG/2%20CMYK/1%20Full%20Color/laravel-logolockup-cmyk-red.svg" width="400" alt="Laravel Logo"></a></p>
<p align="center">
<a href="https://github.com/laravel/framework/actions"><img src="https://github.com/laravel/framework/workflows/tests/badge.svg" alt="Build Status"></a>
<a href="https://packagist.org/packages/laravel/framework"><img src="https://img.shields.io/packagist/dt/laravel/framework" alt="Total Downloads"></a>
<a href="https://packagist.org/packages/laravel/framework"><img src="https://img.shields.io/packagist/v/laravel/framework" alt="Latest Stable Version"></a>
<a href="https://packagist.org/packages/laravel/framework"><img src="https://img.shields.io/packagist/l/laravel/framework" alt="License"></a>
</p>
## About Laravel
Laravel is a web application framework with expressive, elegant syntax. We believe development must be an enjoyable and creative experience to be truly fulfilling. Laravel takes the pain out of development by easing common tasks used in many web projects, such as:
- [Simple, fast routing engine](https://laravel.com/docs/routing).
- [Powerful dependency injection container](https://laravel.com/docs/container).
- Multiple back-ends for [session](https://laravel.com/docs/session) and [cache](https://laravel.com/docs/cache) storage.
- Expressive, intuitive [database ORM](https://laravel.com/docs/eloquent).
- Database agnostic [schema migrations](https://laravel.com/docs/migrations).
- [Robust background job processing](https://laravel.com/docs/queues).
- [Real-time event broadcasting](https://laravel.com/docs/broadcasting).
Laravel is accessible, powerful, and provides tools required for large, robust applications.
## Learning Laravel
Laravel has the most extensive and thorough [documentation](https://laravel.com/docs) and video tutorial library of all modern web application frameworks, making it a breeze to get started with the framework.
You may also try the [Laravel Bootcamp](https://bootcamp.laravel.com), where you will be guided through building a modern Laravel application from scratch.
If you don't feel like reading, [Laracasts](https://laracasts.com) can help. Laracasts contains thousands of video tutorials on a range of topics including Laravel, modern PHP, unit testing, and JavaScript. Boost your skills by digging into our comprehensive video library.
## Laravel Sponsors
We would like to extend our thanks to the following sponsors for funding Laravel development. If you are interested in becoming a sponsor, please visit the [Laravel Partners program](https://partners.laravel.com).
### Premium Partners
- **[Vehikl](https://vehikl.com/)**
- **[Tighten Co.](https://tighten.co)**
- **[WebReinvent](https://webreinvent.com/)**
- **[Kirschbaum Development Group](https://kirschbaumdevelopment.com)**
- **[64 Robots](https://64robots.com)**
- **[Curotec](https://www.curotec.com/services/technologies/laravel/)**
- **[Cyber-Duck](https://cyber-duck.co.uk)**
- **[DevSquad](https://devsquad.com/hire-laravel-developers)**
- **[Jump24](https://jump24.co.uk)**
- **[Redberry](https://redberry.international/laravel/)**
- **[Active Logic](https://activelogic.com)**
- **[byte5](https://byte5.de)**
- **[OP.GG](https://op.gg)**
## Contributing
Thank you for considering contributing to the Laravel framework! The contribution guide can be found in the [Laravel documentation](https://laravel.com/docs/contributions).
## Code of Conduct
In order to ensure that the Laravel community is welcoming to all, please review and abide by the [Code of Conduct](https://laravel.com/docs/contributions#code-of-conduct).
## Security Vulnerabilities
If you discover a security vulnerability within Laravel, please send an e-mail to Taylor Otwell via [taylor@laravel.com](mailto:taylor@laravel.com). All security vulnerabilities will be promptly addressed.
## License
The Laravel framework is open-sourced software licensed under the [MIT license](https://opensource.org/licenses/MIT).

View File

@ -0,0 +1,9 @@
<?php
namespace App\Http\Controllers;
abstract class Controller
{
//
}

48
app/Models/User.php Normal file
View File

@ -0,0 +1,48 @@
<?php
namespace App\Models;
// use Illuminate\Contracts\Auth\MustVerifyEmail;
use Illuminate\Database\Eloquent\Factories\HasFactory;
use Illuminate\Foundation\Auth\User as Authenticatable;
use Illuminate\Notifications\Notifiable;
class User extends Authenticatable
{
/** @use HasFactory<\Database\Factories\UserFactory> */
use HasFactory, Notifiable;
/**
* The attributes that are mass assignable.
*
* @var list<string>
*/
protected $fillable = [
'name',
'email',
'password',
];
/**
* The attributes that should be hidden for serialization.
*
* @var list<string>
*/
protected $hidden = [
'password',
'remember_token',
];
/**
* Get the attributes that should be cast.
*
* @return array<string, string>
*/
protected function casts(): array
{
return [
'email_verified_at' => 'datetime',
'password' => 'hashed',
];
}
}

View File

@ -0,0 +1,24 @@
<?php
namespace App\Providers;
use Illuminate\Support\ServiceProvider;
class AppServiceProvider extends ServiceProvider
{
/**
* Register any application services.
*/
public function register(): void
{
//
}
/**
* Bootstrap any application services.
*/
public function boot(): void
{
//
}
}

100
app/Services/ApiService.php Normal file
View File

@ -0,0 +1,100 @@
<?php
namespace App\Services;
use Illuminate\Support\Facades\Http;
use Illuminate\Support\Facades\Session;
use Illuminate\Support\Facades\Log;
class ApiService
{
protected $baseUrl;
public function __construct()
{
$this->baseUrl = config('app.api_base_url');
}
public function fetchData($url, $token = null)
{
try {
$response = Http::withHeaders([
'Authorization' => 'Bearer ' . ($token ?: Session::get('token', '')),
])->get($this->baseUrl . $url);
if ($response->successful()) {
return $response->json();
} else {
$this->handleError($response);
return null;
}
} catch (\Exception $e) {
Log::error('API Fetch Error: ' . $e->getMessage());
Session::flash('error', 'Failed to fetch data: ' . $e->getMessage());
return null;
}
}
public function logout($token = null)
{
try {
$response = Http::withHeaders([
'Authorization' => 'Bearer ' . ($token ?: Session::get('token', '')),
])->get($this->baseUrl . '/logout');
if ($response->successful()) {
Session::forget('token');
Session::flash('success', 'Logged out successfully.');
return true;
} else {
$this->handleError($response);
return false;
}
} catch (\Exception $e) {
Log::error('Logout Error: ' . $e->getMessage());
Session::flash('error', 'Logout failed: ' . $e->getMessage());
return false;
}
}
public function handleError($response)
{
$status = $response->status();
if ($status === 401) {
Session::forget('token');
throw new \Exception('Session expired. Please login again.');
} elseif ($status === 404) {
throw new \Exception('API resource not found.');
} else {
throw new \Exception('API error: ' . ($response->body() ?: 'Unknown error'));
}
}
public function get($url, $params = [])
{
$token = $this->cookieService->getCookie()['token'] ?? null;
$this->defaultHeaders['Authorization'] = 'Bearer ' . $token;
return $this->makeRequest('get', $url, $params);
}
public function post($url, $params = [])
{
return $this->makeRequest('post', $url, $params);
}
public function put($url, $params = [])
{
return $this->makeRequest('put', $url, $params);
}
public function delete($url, $params = [])
{
return $this->makeRequest('delete', $url, ['params' => $params]);
}
public function postMultipart($url, $data)
{
return $this->makeRequest('postMultipart', $url, $data);
}
}

View File

@ -0,0 +1,89 @@
<?php
namespace App\Services;
use Illuminate\Support\Facades\Http;
use Illuminate\Support\Facades\Session;
use Illuminate\Support\Facades\Log;
use App\Livewire\ErrorHandler;
class BaseApiService
{
protected $baseUrl;
protected $defaultHeaders = [];
public function __construct(string $baseUrl)
{
$this->baseUrl = $baseUrl;
}
protected function makeRequest($method, $url, $params = [], $headers = [])
{
try {
$fullHeaders = array_merge($this->defaultHeaders, $headers, [
'Authorization' => 'Bearer ' . Session::get('token', ''),
]);
$response = Http::withHeaders($fullHeaders)->{$method}($this->baseUrl . $url, $params);
if ($response->successful()) {
return $response->json();
} else {
$this->handleError($response);
return null;
}
} catch (\Exception $e) {
Log::error('API Request Error: ' . $e->getMessage());
Session::flash('error', 'API request failed: ' . $e->getMessage());
return null;
}
}
protected function handleError($response)
{
$status = $response->status();
if ($status === 401) {
Session::forget('token');
throw new \Exception('Session expired. Please login again.');
} elseif ($status === 422) {
throw new \Exception('Validation error: ' . ($response->body() ?: 'Unknown validation error'));
} elseif ($status === 404) {
throw new \Exception('API resource not found.');
} else {
throw new \Exception('API error: ' . ($response->body() ?: 'Unknown error'));
}
}
public function postMultipart($url, $data)
{
try {
$headers = array_merge($this->defaultHeaders, [
'Authorization' => 'Bearer ' . Session::get('token', ''),
'Content-Type' => 'multipart/form-data',
]);
$response = Http::withHeaders($headers)->asMultipart();
foreach ($data as $key => $value) {
if ($value instanceof \Illuminate\Http\UploadedFile) {
$response = $response->attach($key, $value->get(), $value->getClientOriginalName());
} else {
$response = $response->attach($key, $value);
}
}
$response = $response->post($this->baseUrl . $url);
if ($response->successful()) {
return $response->json();
} else {
$this->handleError($response);
return null;
}
} catch (\Exception $e) {
Log::error('Multipart API Request Error: ' . $e->getMessage());
throw $e;
}
}
}

View File

@ -0,0 +1,55 @@
<?php
namespace App\Services;
use Illuminate\Support\Facades\Cookie;
use Illuminate\Support\Facades\Crypt;
use Illuminate\Support\Facades\Log;
class CookieService
{
const COOKIE_NAME = 'FRONT_END_REST';
const PUBLIC_KEY = 'PUBLIC_00001';
const TIME_OUT_HOURS = 1; // 60 minutes
public function setCookie(array $params, string $name = self::COOKIE_NAME): bool
{
try {
if (!is_array($params)) {
throw new \TypeError('setCookie params should be an array.', 'CookieService.php', 20);
}
$expiration = now()->addHours(self::TIME_OUT_HOURS);
$encryptedValue = Crypt::encryptString(json_encode($params));
Cookie::queue($name, $encryptedValue, $expiration->diffInMinutes(), '/', null, false, true);
return true;
} catch (\Exception $e) {
Log::error('Cookie Set Error: ' . $e->getMessage());
return false;
}
}
public function getCookie(string $name = self::COOKIE_NAME)
{
$cookie = Cookie::get($name);
if (!$cookie) {
return null;
}
try {
return json_decode(Crypt::decryptString($cookie), true);
} catch (\Exception $e) {
Log::error('Cookie Get Error: ' . $e->getMessage());
return null;
}
}
public function removeCookie(string $name = self::COOKIE_NAME): bool
{
Cookie::queue(Cookie::forget($name));
return true;
}
}

View File

@ -0,0 +1,50 @@
<?php
namespace App\Services;
use Illuminate\Support\Facades\Session;
class EncryptionService
{
const ALGORITHM = 'aes-256-ctr';
private $password;
public function __construct()
{
$this->password = $this->getPasswordFromCookie();
}
private function getPasswordFromCookie()
{
$cookieService = app(CookieService::class);
$cookie = $cookieService->getCookie(process.env.REACT_APP_TOKEN ?? 'token');
return $cookie['token'] ?? 'default_password'; // Fallback if token not found
}
public function encrypt(string $text): string
{
$iv = random_bytes(16); // Initialization vector
$encrypted = openssl_encrypt($text, self::ALGORITHM, $this->password, 0, $iv);
return base64_encode($iv . $encrypted); // Combine IV and encrypted data
}
public function decrypt(string $text): string|bool
{
$data = base64_decode($text);
$iv = substr($data, 0, 16);
$encrypted = substr($data, 16);
$decrypted = openssl_decrypt($encrypted, self::ALGORITHM, $this->password, 0, $iv);
if ($decrypted === false) {
return false;
}
// Check if the result is hexadecimal (simulating your JS check)
if (preg_match('/^[0-9a-fA-F]+$/', $decrypted)) {
return $decrypted;
}
return false;
}
}

View File

@ -0,0 +1,21 @@
<?php
namespace App\Services;
class NotificationApiService extends BaseApiService
{
public function __construct()
{
parent::__construct(config('app.notif_api_base_url'));
}
public function getNotification($url, $params = [])
{
return $this->makeRequest('get', $url, $params);
}
public function postNotification($url, $params = [])
{
return $this->makeRequest('post', $url, $params);
}
}

View File

@ -0,0 +1,56 @@
<?php
namespace App\Services;
class StationApiService extends BaseApiService
{
public function __construct()
{
parent::__construct(config('app.station_api_base_url'));
$this->defaultHeaders = array_merge($this->defaultHeaders, [
'X-Requested-With' => 'station-locator-api',
]);
}
public function getBranch($url, $params = [])
{
return $this->makeRequest('get', $url, $params);
}
public function postBranch($url, $params = [])
{
return $this->makeRequest('post', $url, $params);
}
public function putBranch($url, $params = [])
{
return $this->makeRequest('put', $url, $params);
}
public function deleteBranch($url, $params = [])
{
return $this->makeRequest('delete', $url, ['params' => $params]);
}
public function postFuel($url, $params = [])
{
return $this->makeRequest('post', $url, $params);
}
public function putFuel($url, $params = [])
{
return $this->makeRequest('put', $url, $params);
}
public function getFuels($url, $params = [])
{
return $this->makeRequest('get', $url, $params);
}
public function getCsv($url, $params = [])
{
return Http::withHeaders(array_merge($this->defaultHeaders, [
'Authorization' => 'Bearer ' . Session::get('token', ''),
]))->get($this->baseUrl . $url, $params)->body(); // Return raw text for CSV
}
}

15
artisan Executable file
View File

@ -0,0 +1,15 @@
#!/usr/bin/env php
<?php
use Symfony\Component\Console\Input\ArgvInput;
define('LARAVEL_START', microtime(true));
// Register the Composer autoloader...
require __DIR__.'/vendor/autoload.php';
// Bootstrap Laravel and handle the command...
$status = (require_once __DIR__.'/bootstrap/app.php')
->handleCommand(new ArgvInput);
exit($status);

18
bootstrap/app.php Normal file
View File

@ -0,0 +1,18 @@
<?php
use Illuminate\Foundation\Application;
use Illuminate\Foundation\Configuration\Exceptions;
use Illuminate\Foundation\Configuration\Middleware;
return Application::configure(basePath: dirname(__DIR__))
->withRouting(
web: __DIR__.'/../routes/web.php',
commands: __DIR__.'/../routes/console.php',
health: '/up',
)
->withMiddleware(function (Middleware $middleware) {
//
})
->withExceptions(function (Exceptions $exceptions) {
//
})->create();

2
bootstrap/cache/.gitignore vendored Executable file
View File

@ -0,0 +1,2 @@
*
!.gitignore

5
bootstrap/providers.php Normal file
View File

@ -0,0 +1,5 @@
<?php
return [
App\Providers\AppServiceProvider::class,
];

72
composer.json Normal file
View File

@ -0,0 +1,72 @@
{
"$schema": "https://getcomposer.org/schema.json",
"name": "laravel/laravel",
"type": "project",
"description": "The skeleton application for the Laravel framework.",
"keywords": ["laravel", "framework"],
"license": "MIT",
"require": {
"php": "^8.2",
"laravel/framework": "^11.31",
"laravel/tinker": "^2.9",
"livewire/livewire": "^3.6"
},
"require-dev": {
"fakerphp/faker": "^1.23",
"laravel/pail": "^1.1",
"laravel/pint": "^1.13",
"laravel/sail": "^1.26",
"mockery/mockery": "^1.6",
"nunomaduro/collision": "^8.1",
"phpunit/phpunit": "^11.0.1"
},
"autoload": {
"psr-4": {
"App\\": "app/",
"Database\\Factories\\": "database/factories/",
"Database\\Seeders\\": "database/seeders/"
}
},
"autoload-dev": {
"psr-4": {
"Tests\\": "tests/"
}
},
"scripts": {
"post-autoload-dump": [
"Illuminate\\Foundation\\ComposerScripts::postAutoloadDump",
"@php artisan package:discover --ansi"
],
"post-update-cmd": [
"@php artisan vendor:publish --tag=laravel-assets --ansi --force"
],
"post-root-package-install": [
"@php -r \"file_exists('.env') || copy('.env.example', '.env');\""
],
"post-create-project-cmd": [
"@php artisan key:generate --ansi",
"@php -r \"file_exists('database/database.sqlite') || touch('database/database.sqlite');\"",
"@php artisan migrate --graceful --ansi"
],
"dev": [
"Composer\\Config::disableProcessTimeout",
"npx concurrently -c \"#93c5fd,#c4b5fd,#fb7185,#fdba74\" \"php artisan serve\" \"php artisan queue:listen --tries=1\" \"php artisan pail --timeout=0\" \"npm run dev\" --names=server,queue,logs,vite"
]
},
"extra": {
"laravel": {
"dont-discover": []
}
},
"config": {
"optimize-autoloader": true,
"preferred-install": "dist",
"sort-packages": true,
"allow-plugins": {
"pestphp/pest-plugin": true,
"php-http/discovery": true
}
},
"minimum-stability": "stable",
"prefer-stable": true
}

8153
composer.lock generated Normal file

File diff suppressed because it is too large Load Diff

126
config/app.php Normal file
View File

@ -0,0 +1,126 @@
<?php
return [
/*
|--------------------------------------------------------------------------
| Application Name
|--------------------------------------------------------------------------
|
| This value is the name of your application, which will be used when the
| framework needs to place the application's name in a notification or
| other UI elements where an application name needs to be displayed.
|
*/
'name' => env('APP_NAME', 'Laravel'),
/*
|--------------------------------------------------------------------------
| Application Environment
|--------------------------------------------------------------------------
|
| This value determines the "environment" your application is currently
| running in. This may determine how you prefer to configure various
| services the application utilizes. Set this in your ".env" file.
|
*/
'env' => env('APP_ENV', 'production'),
/*
|--------------------------------------------------------------------------
| Application Debug Mode
|--------------------------------------------------------------------------
|
| When your application is in debug mode, detailed error messages with
| stack traces will be shown on every error that occurs within your
| application. If disabled, a simple generic error page is shown.
|
*/
'debug' => (bool) env('APP_DEBUG', false),
/*
|--------------------------------------------------------------------------
| Application URL
|--------------------------------------------------------------------------
|
| This URL is used by the console to properly generate URLs when using
| the Artisan command line tool. You should set this to the root of
| the application so that it's available within Artisan commands.
|
*/
'url' => env('APP_URL', 'http://localhost'),
/*
|--------------------------------------------------------------------------
| Application Timezone
|--------------------------------------------------------------------------
|
| Here you may specify the default timezone for your application, which
| will be used by the PHP date and date-time functions. The timezone
| is set to "UTC" by default as it is suitable for most use cases.
|
*/
'timezone' => env('APP_TIMEZONE', 'UTC'),
/*
|--------------------------------------------------------------------------
| Application Locale Configuration
|--------------------------------------------------------------------------
|
| The application locale determines the default locale that will be used
| by Laravel's translation / localization methods. This option can be
| set to any locale for which you plan to have translation strings.
|
*/
'locale' => env('APP_LOCALE', 'en'),
'fallback_locale' => env('APP_FALLBACK_LOCALE', 'en'),
'faker_locale' => env('APP_FAKER_LOCALE', 'en_US'),
/*
|--------------------------------------------------------------------------
| Encryption Key
|--------------------------------------------------------------------------
|
| This key is utilized by Laravel's encryption services and should be set
| to a random, 32 character string to ensure that all encrypted values
| are secure. You should do this prior to deploying the application.
|
*/
'cipher' => 'AES-256-CBC',
'key' => env('APP_KEY'),
'previous_keys' => [
...array_filter(
explode(',', env('APP_PREVIOUS_KEYS', ''))
),
],
/*
|--------------------------------------------------------------------------
| Maintenance Mode Driver
|--------------------------------------------------------------------------
|
| These configuration options determine the driver used to determine and
| manage Laravel's "maintenance mode" status. The "cache" driver will
| allow maintenance mode to be controlled across multiple machines.
|
| Supported drivers: "file", "cache"
|
*/
'maintenance' => [
'driver' => env('APP_MAINTENANCE_DRIVER', 'file'),
'store' => env('APP_MAINTENANCE_STORE', 'database'),
],
];

115
config/auth.php Normal file
View File

@ -0,0 +1,115 @@
<?php
return [
/*
|--------------------------------------------------------------------------
| Authentication Defaults
|--------------------------------------------------------------------------
|
| This option defines the default authentication "guard" and password
| reset "broker" for your application. You may change these values
| as required, but they're a perfect start for most applications.
|
*/
'defaults' => [
'guard' => env('AUTH_GUARD', 'web'),
'passwords' => env('AUTH_PASSWORD_BROKER', 'users'),
],
/*
|--------------------------------------------------------------------------
| Authentication Guards
|--------------------------------------------------------------------------
|
| Next, you may define every authentication guard for your application.
| Of course, a great default configuration has been defined for you
| which utilizes session storage plus the Eloquent user provider.
|
| All authentication guards have a user provider, which defines how the
| users are actually retrieved out of your database or other storage
| system used by the application. Typically, Eloquent is utilized.
|
| Supported: "session"
|
*/
'guards' => [
'web' => [
'driver' => 'session',
'provider' => 'users',
],
],
/*
|--------------------------------------------------------------------------
| User Providers
|--------------------------------------------------------------------------
|
| All authentication guards have a user provider, which defines how the
| users are actually retrieved out of your database or other storage
| system used by the application. Typically, Eloquent is utilized.
|
| If you have multiple user tables or models you may configure multiple
| providers to represent the model / table. These providers may then
| be assigned to any extra authentication guards you have defined.
|
| Supported: "database", "eloquent"
|
*/
'providers' => [
'users' => [
'driver' => 'eloquent',
'model' => env('AUTH_MODEL', App\Models\User::class),
],
// 'users' => [
// 'driver' => 'database',
// 'table' => 'users',
// ],
],
/*
|--------------------------------------------------------------------------
| Resetting Passwords
|--------------------------------------------------------------------------
|
| These configuration options specify the behavior of Laravel's password
| reset functionality, including the table utilized for token storage
| and the user provider that is invoked to actually retrieve users.
|
| The expiry time is the number of minutes that each reset token will be
| considered valid. This security feature keeps tokens short-lived so
| they have less time to be guessed. You may change this as needed.
|
| The throttle setting is the number of seconds a user must wait before
| generating more password reset tokens. This prevents the user from
| quickly generating a very large amount of password reset tokens.
|
*/
'passwords' => [
'users' => [
'provider' => 'users',
'table' => env('AUTH_PASSWORD_RESET_TOKEN_TABLE', 'password_reset_tokens'),
'expire' => 60,
'throttle' => 60,
],
],
/*
|--------------------------------------------------------------------------
| Password Confirmation Timeout
|--------------------------------------------------------------------------
|
| Here you may define the amount of seconds before a password confirmation
| window expires and users are asked to re-enter their password via the
| confirmation screen. By default, the timeout lasts for three hours.
|
*/
'password_timeout' => env('AUTH_PASSWORD_TIMEOUT', 10800),
];

108
config/cache.php Normal file
View File

@ -0,0 +1,108 @@
<?php
use Illuminate\Support\Str;
return [
/*
|--------------------------------------------------------------------------
| Default Cache Store
|--------------------------------------------------------------------------
|
| This option controls the default cache store that will be used by the
| framework. This connection is utilized if another isn't explicitly
| specified when running a cache operation inside the application.
|
*/
'default' => env('CACHE_STORE', 'database'),
/*
|--------------------------------------------------------------------------
| Cache Stores
|--------------------------------------------------------------------------
|
| Here you may define all of the cache "stores" for your application as
| well as their drivers. You may even define multiple stores for the
| same cache driver to group types of items stored in your caches.
|
| Supported drivers: "array", "database", "file", "memcached",
| "redis", "dynamodb", "octane", "null"
|
*/
'stores' => [
'array' => [
'driver' => 'array',
'serialize' => false,
],
'database' => [
'driver' => 'database',
'connection' => env('DB_CACHE_CONNECTION'),
'table' => env('DB_CACHE_TABLE', 'cache'),
'lock_connection' => env('DB_CACHE_LOCK_CONNECTION'),
'lock_table' => env('DB_CACHE_LOCK_TABLE'),
],
'file' => [
'driver' => 'file',
'path' => storage_path('framework/cache/data'),
'lock_path' => storage_path('framework/cache/data'),
],
'memcached' => [
'driver' => 'memcached',
'persistent_id' => env('MEMCACHED_PERSISTENT_ID'),
'sasl' => [
env('MEMCACHED_USERNAME'),
env('MEMCACHED_PASSWORD'),
],
'options' => [
// Memcached::OPT_CONNECT_TIMEOUT => 2000,
],
'servers' => [
[
'host' => env('MEMCACHED_HOST', '127.0.0.1'),
'port' => env('MEMCACHED_PORT', 11211),
'weight' => 100,
],
],
],
'redis' => [
'driver' => 'redis',
'connection' => env('REDIS_CACHE_CONNECTION', 'cache'),
'lock_connection' => env('REDIS_CACHE_LOCK_CONNECTION', 'default'),
],
'dynamodb' => [
'driver' => 'dynamodb',
'key' => env('AWS_ACCESS_KEY_ID'),
'secret' => env('AWS_SECRET_ACCESS_KEY'),
'region' => env('AWS_DEFAULT_REGION', 'us-east-1'),
'table' => env('DYNAMODB_CACHE_TABLE', 'cache'),
'endpoint' => env('DYNAMODB_ENDPOINT'),
],
'octane' => [
'driver' => 'octane',
],
],
/*
|--------------------------------------------------------------------------
| Cache Key Prefix
|--------------------------------------------------------------------------
|
| When utilizing the APC, database, memcached, Redis, and DynamoDB cache
| stores, there might be other applications using the same cache. For
| that reason, you may prefix every cache key to avoid collisions.
|
*/
'prefix' => env('CACHE_PREFIX', Str::slug(env('APP_NAME', 'laravel'), '_').'_cache_'),
];

173
config/database.php Normal file
View File

@ -0,0 +1,173 @@
<?php
use Illuminate\Support\Str;
return [
/*
|--------------------------------------------------------------------------
| Default Database Connection Name
|--------------------------------------------------------------------------
|
| Here you may specify which of the database connections below you wish
| to use as your default connection for database operations. This is
| the connection which will be utilized unless another connection
| is explicitly specified when you execute a query / statement.
|
*/
'default' => env('DB_CONNECTION', 'sqlite'),
/*
|--------------------------------------------------------------------------
| Database Connections
|--------------------------------------------------------------------------
|
| Below are all of the database connections defined for your application.
| An example configuration is provided for each database system which
| is supported by Laravel. You're free to add / remove connections.
|
*/
'connections' => [
'sqlite' => [
'driver' => 'sqlite',
'url' => env('DB_URL'),
'database' => env('DB_DATABASE', database_path('database.sqlite')),
'prefix' => '',
'foreign_key_constraints' => env('DB_FOREIGN_KEYS', true),
'busy_timeout' => null,
'journal_mode' => null,
'synchronous' => null,
],
'mysql' => [
'driver' => 'mysql',
'url' => env('DB_URL'),
'host' => env('DB_HOST', 'db_mysql'),
'port' => env('DB_PORT', '3306'),
'database' => env('DB_DATABASE', 'laravel-cms'),
'username' => env('DB_USERNAME', 'laravel_user'),
'password' => env('DB_PASSWORD', 'password'),
'unix_socket' => env('DB_SOCKET', ''),
'charset' => env('DB_CHARSET', 'utf8mb4'),
'collation' => env('DB_COLLATION', 'utf8mb4_unicode_ci'),
'prefix' => '',
'prefix_indexes' => true,
'strict' => true,
'engine' => null,
'options' => extension_loaded('pdo_mysql') ? array_filter([
PDO::MYSQL_ATTR_SSL_CA => env('MYSQL_ATTR_SSL_CA'),
]) : [],
],
'mariadb' => [
'driver' => 'mariadb',
'url' => env('DB_URL'),
'host' => env('DB_HOST', '127.0.0.1'),
'port' => env('DB_PORT', '3306'),
'database' => env('DB_DATABASE', 'laravel'),
'username' => env('DB_USERNAME', 'root'),
'password' => env('DB_PASSWORD', ''),
'unix_socket' => env('DB_SOCKET', ''),
'charset' => env('DB_CHARSET', 'utf8mb4'),
'collation' => env('DB_COLLATION', 'utf8mb4_unicode_ci'),
'prefix' => '',
'prefix_indexes' => true,
'strict' => true,
'engine' => null,
'options' => extension_loaded('pdo_mysql') ? array_filter([
PDO::MYSQL_ATTR_SSL_CA => env('MYSQL_ATTR_SSL_CA'),
]) : [],
],
'pgsql' => [
'driver' => 'pgsql',
'url' => env('DB_URL'),
'host' => env('DB_HOST', '127.0.0.1'),
'port' => env('DB_PORT', '5432'),
'database' => env('DB_DATABASE', 'laravel'),
'username' => env('DB_USERNAME', 'root'),
'password' => env('DB_PASSWORD', ''),
'charset' => env('DB_CHARSET', 'utf8'),
'prefix' => '',
'prefix_indexes' => true,
'search_path' => 'public',
'sslmode' => 'prefer',
],
'sqlsrv' => [
'driver' => 'sqlsrv',
'url' => env('DB_URL'),
'host' => env('DB_HOST', 'localhost'),
'port' => env('DB_PORT', '1433'),
'database' => env('DB_DATABASE', 'laravel'),
'username' => env('DB_USERNAME', 'root'),
'password' => env('DB_PASSWORD', ''),
'charset' => env('DB_CHARSET', 'utf8'),
'prefix' => '',
'prefix_indexes' => true,
// 'encrypt' => env('DB_ENCRYPT', 'yes'),
// 'trust_server_certificate' => env('DB_TRUST_SERVER_CERTIFICATE', 'false'),
],
],
/*
|--------------------------------------------------------------------------
| Migration Repository Table
|--------------------------------------------------------------------------
|
| This table keeps track of all the migrations that have already run for
| your application. Using this information, we can determine which of
| the migrations on disk haven't actually been run on the database.
|
*/
'migrations' => [
'table' => 'migrations',
'update_date_on_publish' => true,
],
/*
|--------------------------------------------------------------------------
| Redis Databases
|--------------------------------------------------------------------------
|
| Redis is an open source, fast, and advanced key-value store that also
| provides a richer body of commands than a typical key-value system
| such as Memcached. You may define your connection settings here.
|
*/
'redis' => [
'client' => env('REDIS_CLIENT', 'phpredis'),
'options' => [
'cluster' => env('REDIS_CLUSTER', 'redis'),
'prefix' => env('REDIS_PREFIX', Str::slug(env('APP_NAME', 'laravel'), '_').'_database_'),
],
'default' => [
'url' => env('REDIS_URL'),
'host' => env('REDIS_HOST', '127.0.0.1'),
'username' => env('REDIS_USERNAME'),
'password' => env('REDIS_PASSWORD'),
'port' => env('REDIS_PORT', '6379'),
'database' => env('REDIS_DB', '0'),
],
'cache' => [
'url' => env('REDIS_URL'),
'host' => env('REDIS_HOST', '127.0.0.1'),
'username' => env('REDIS_USERNAME'),
'password' => env('REDIS_PASSWORD'),
'port' => env('REDIS_PORT', '6379'),
'database' => env('REDIS_CACHE_DB', '1'),
],
],
];

80
config/filesystems.php Normal file
View File

@ -0,0 +1,80 @@
<?php
return [
/*
|--------------------------------------------------------------------------
| Default Filesystem Disk
|--------------------------------------------------------------------------
|
| Here you may specify the default filesystem disk that should be used
| by the framework. The "local" disk, as well as a variety of cloud
| based disks are available to your application for file storage.
|
*/
'default' => env('FILESYSTEM_DISK', 'local'),
/*
|--------------------------------------------------------------------------
| Filesystem Disks
|--------------------------------------------------------------------------
|
| Below you may configure as many filesystem disks as necessary, and you
| may even configure multiple disks for the same driver. Examples for
| most supported storage drivers are configured here for reference.
|
| Supported drivers: "local", "ftp", "sftp", "s3"
|
*/
'disks' => [
'local' => [
'driver' => 'local',
'root' => storage_path('app/private'),
'serve' => true,
'throw' => false,
'report' => false,
],
'public' => [
'driver' => 'local',
'root' => storage_path('app/public'),
'url' => env('APP_URL').'/storage',
'visibility' => 'public',
'throw' => false,
'report' => false,
],
's3' => [
'driver' => 's3',
'key' => env('AWS_ACCESS_KEY_ID'),
'secret' => env('AWS_SECRET_ACCESS_KEY'),
'region' => env('AWS_DEFAULT_REGION'),
'bucket' => env('AWS_BUCKET'),
'url' => env('AWS_URL'),
'endpoint' => env('AWS_ENDPOINT'),
'use_path_style_endpoint' => env('AWS_USE_PATH_STYLE_ENDPOINT', false),
'throw' => false,
'report' => false,
],
],
/*
|--------------------------------------------------------------------------
| Symbolic Links
|--------------------------------------------------------------------------
|
| Here you may configure the symbolic links that will be created when the
| `storage:link` Artisan command is executed. The array keys should be
| the locations of the links and the values should be their targets.
|
*/
'links' => [
public_path('storage') => storage_path('app/public'),
],
];

160
config/livewire.php Normal file
View File

@ -0,0 +1,160 @@
<?php
return [
/*
|---------------------------------------------------------------------------
| Class Namespace
|---------------------------------------------------------------------------
|
| This value sets the root class namespace for Livewire component classes in
| your application. This value will change where component auto-discovery
| finds components. It's also referenced by the file creation commands.
|
*/
'class_namespace' => 'App\\Livewire',
/*
|---------------------------------------------------------------------------
| View Path
|---------------------------------------------------------------------------
|
| This value is used to specify where Livewire component Blade templates are
| stored when running file creation commands like `artisan make:livewire`.
| It is also used if you choose to omit a component's render() method.
|
*/
'view_path' => resource_path('views/livewire'),
/*
|---------------------------------------------------------------------------
| Layout
|---------------------------------------------------------------------------
| The view that will be used as the layout when rendering a single component
| as an entire page via `Route::get('/post/create', CreatePost::class);`.
| In this case, the view returned by CreatePost will render into $slot.
|
*/
'layout' => 'components.layouts.app',
/*
|---------------------------------------------------------------------------
| Lazy Loading Placeholder
|---------------------------------------------------------------------------
| Livewire allows you to lazy load components that would otherwise slow down
| the initial page load. Every component can have a custom placeholder or
| you can define the default placeholder view for all components below.
|
*/
'lazy_placeholder' => null,
/*
|---------------------------------------------------------------------------
| Temporary File Uploads
|---------------------------------------------------------------------------
|
| Livewire handles file uploads by storing uploads in a temporary directory
| before the file is stored permanently. All file uploads are directed to
| a global endpoint for temporary storage. You may configure this below:
|
*/
'temporary_file_upload' => [
'disk' => null, // Example: 'local', 's3' | Default: 'default'
'rules' => null, // Example: ['file', 'mimes:png,jpg'] | Default: ['required', 'file', 'max:12288'] (12MB)
'directory' => null, // Example: 'tmp' | Default: 'livewire-tmp'
'middleware' => null, // Example: 'throttle:5,1' | Default: 'throttle:60,1'
'preview_mimes' => [ // Supported file types for temporary pre-signed file URLs...
'png', 'gif', 'bmp', 'svg', 'wav', 'mp4',
'mov', 'avi', 'wmv', 'mp3', 'm4a',
'jpg', 'jpeg', 'mpga', 'webp', 'wma',
],
'max_upload_time' => 5, // Max duration (in minutes) before an upload is invalidated...
'cleanup' => true, // Should cleanup temporary uploads older than 24 hrs...
],
/*
|---------------------------------------------------------------------------
| Render On Redirect
|---------------------------------------------------------------------------
|
| This value determines if Livewire will run a component's `render()` method
| after a redirect has been triggered using something like `redirect(...)`
| Setting this to true will render the view once more before redirecting
|
*/
'render_on_redirect' => false,
/*
|---------------------------------------------------------------------------
| Eloquent Model Binding
|---------------------------------------------------------------------------
|
| Previous versions of Livewire supported binding directly to eloquent model
| properties using wire:model by default. However, this behavior has been
| deemed too "magical" and has therefore been put under a feature flag.
|
*/
'legacy_model_binding' => false,
/*
|---------------------------------------------------------------------------
| Auto-inject Frontend Assets
|---------------------------------------------------------------------------
|
| By default, Livewire automatically injects its JavaScript and CSS into the
| <head> and <body> of pages containing Livewire components. By disabling
| this behavior, you need to use @livewireStyles and @livewireScripts.
|
*/
'inject_assets' => true,
/*
|---------------------------------------------------------------------------
| Navigate (SPA mode)
|---------------------------------------------------------------------------
|
| By adding `wire:navigate` to links in your Livewire application, Livewire
| will prevent the default link handling and instead request those pages
| via AJAX, creating an SPA-like effect. Configure this behavior here.
|
*/
'navigate' => [
'show_progress_bar' => true,
'progress_bar_color' => '#2299dd',
],
/*
|---------------------------------------------------------------------------
| HTML Morph Markers
|---------------------------------------------------------------------------
|
| Livewire intelligently "morphs" existing HTML into the newly rendered HTML
| after each update. To make this process more reliable, Livewire injects
| "markers" into the rendered Blade surrounding @if, @class & @foreach.
|
*/
'inject_morph_markers' => true,
/*
|---------------------------------------------------------------------------
| Pagination Theme
|---------------------------------------------------------------------------
|
| When enabling Livewire's pagination feature by using the `WithPagination`
| trait, Livewire will use Tailwind templates to render pagination views
| on the page. If you want Bootstrap CSS, you can specify: "bootstrap"
|
*/
'pagination_theme' => 'tailwind',
];

132
config/logging.php Normal file
View File

@ -0,0 +1,132 @@
<?php
use Monolog\Handler\NullHandler;
use Monolog\Handler\StreamHandler;
use Monolog\Handler\SyslogUdpHandler;
use Monolog\Processor\PsrLogMessageProcessor;
return [
/*
|--------------------------------------------------------------------------
| Default Log Channel
|--------------------------------------------------------------------------
|
| This option defines the default log channel that is utilized to write
| messages to your logs. The value provided here should match one of
| the channels present in the list of "channels" configured below.
|
*/
'default' => env('LOG_CHANNEL', 'stack'),
/*
|--------------------------------------------------------------------------
| Deprecations Log Channel
|--------------------------------------------------------------------------
|
| This option controls the log channel that should be used to log warnings
| regarding deprecated PHP and library features. This allows you to get
| your application ready for upcoming major versions of dependencies.
|
*/
'deprecations' => [
'channel' => env('LOG_DEPRECATIONS_CHANNEL', 'null'),
'trace' => env('LOG_DEPRECATIONS_TRACE', false),
],
/*
|--------------------------------------------------------------------------
| Log Channels
|--------------------------------------------------------------------------
|
| Here you may configure the log channels for your application. Laravel
| utilizes the Monolog PHP logging library, which includes a variety
| of powerful log handlers and formatters that you're free to use.
|
| Available drivers: "single", "daily", "slack", "syslog",
| "errorlog", "monolog", "custom", "stack"
|
*/
'channels' => [
'stack' => [
'driver' => 'stack',
'channels' => explode(',', env('LOG_STACK', 'single')),
'ignore_exceptions' => false,
],
'single' => [
'driver' => 'single',
'path' => storage_path('logs/laravel.log'),
'level' => env('LOG_LEVEL', 'debug'),
'replace_placeholders' => true,
],
'daily' => [
'driver' => 'daily',
'path' => storage_path('logs/laravel.log'),
'level' => env('LOG_LEVEL', 'debug'),
'days' => env('LOG_DAILY_DAYS', 14),
'replace_placeholders' => true,
],
'slack' => [
'driver' => 'slack',
'url' => env('LOG_SLACK_WEBHOOK_URL'),
'username' => env('LOG_SLACK_USERNAME', 'Laravel Log'),
'emoji' => env('LOG_SLACK_EMOJI', ':boom:'),
'level' => env('LOG_LEVEL', 'critical'),
'replace_placeholders' => true,
],
'papertrail' => [
'driver' => 'monolog',
'level' => env('LOG_LEVEL', 'debug'),
'handler' => env('LOG_PAPERTRAIL_HANDLER', SyslogUdpHandler::class),
'handler_with' => [
'host' => env('PAPERTRAIL_URL'),
'port' => env('PAPERTRAIL_PORT'),
'connectionString' => 'tls://'.env('PAPERTRAIL_URL').':'.env('PAPERTRAIL_PORT'),
],
'processors' => [PsrLogMessageProcessor::class],
],
'stderr' => [
'driver' => 'monolog',
'level' => env('LOG_LEVEL', 'debug'),
'handler' => StreamHandler::class,
'formatter' => env('LOG_STDERR_FORMATTER'),
'with' => [
'stream' => 'php://stderr',
],
'processors' => [PsrLogMessageProcessor::class],
],
'syslog' => [
'driver' => 'syslog',
'level' => env('LOG_LEVEL', 'debug'),
'facility' => env('LOG_SYSLOG_FACILITY', LOG_USER),
'replace_placeholders' => true,
],
'errorlog' => [
'driver' => 'errorlog',
'level' => env('LOG_LEVEL', 'debug'),
'replace_placeholders' => true,
],
'null' => [
'driver' => 'monolog',
'handler' => NullHandler::class,
],
'emergency' => [
'path' => storage_path('logs/laravel.log'),
],
],
];

116
config/mail.php Normal file
View File

@ -0,0 +1,116 @@
<?php
return [
/*
|--------------------------------------------------------------------------
| Default Mailer
|--------------------------------------------------------------------------
|
| This option controls the default mailer that is used to send all email
| messages unless another mailer is explicitly specified when sending
| the message. All additional mailers can be configured within the
| "mailers" array. Examples of each type of mailer are provided.
|
*/
'default' => env('MAIL_MAILER', 'log'),
/*
|--------------------------------------------------------------------------
| Mailer Configurations
|--------------------------------------------------------------------------
|
| Here you may configure all of the mailers used by your application plus
| their respective settings. Several examples have been configured for
| you and you are free to add your own as your application requires.
|
| Laravel supports a variety of mail "transport" drivers that can be used
| when delivering an email. You may specify which one you're using for
| your mailers below. You may also add additional mailers if needed.
|
| Supported: "smtp", "sendmail", "mailgun", "ses", "ses-v2",
| "postmark", "resend", "log", "array",
| "failover", "roundrobin"
|
*/
'mailers' => [
'smtp' => [
'transport' => 'smtp',
'scheme' => env('MAIL_SCHEME'),
'url' => env('MAIL_URL'),
'host' => env('MAIL_HOST', '127.0.0.1'),
'port' => env('MAIL_PORT', 2525),
'username' => env('MAIL_USERNAME'),
'password' => env('MAIL_PASSWORD'),
'timeout' => null,
'local_domain' => env('MAIL_EHLO_DOMAIN', parse_url(env('APP_URL', 'http://localhost'), PHP_URL_HOST)),
],
'ses' => [
'transport' => 'ses',
],
'postmark' => [
'transport' => 'postmark',
// 'message_stream_id' => env('POSTMARK_MESSAGE_STREAM_ID'),
// 'client' => [
// 'timeout' => 5,
// ],
],
'resend' => [
'transport' => 'resend',
],
'sendmail' => [
'transport' => 'sendmail',
'path' => env('MAIL_SENDMAIL_PATH', '/usr/sbin/sendmail -bs -i'),
],
'log' => [
'transport' => 'log',
'channel' => env('MAIL_LOG_CHANNEL'),
],
'array' => [
'transport' => 'array',
],
'failover' => [
'transport' => 'failover',
'mailers' => [
'smtp',
'log',
],
],
'roundrobin' => [
'transport' => 'roundrobin',
'mailers' => [
'ses',
'postmark',
],
],
],
/*
|--------------------------------------------------------------------------
| Global "From" Address
|--------------------------------------------------------------------------
|
| You may wish for all emails sent by your application to be sent from
| the same address. Here you may specify a name and address that is
| used globally for all emails that are sent by your application.
|
*/
'from' => [
'address' => env('MAIL_FROM_ADDRESS', 'hello@example.com'),
'name' => env('MAIL_FROM_NAME', 'Example'),
],
];

112
config/queue.php Normal file
View File

@ -0,0 +1,112 @@
<?php
return [
/*
|--------------------------------------------------------------------------
| Default Queue Connection Name
|--------------------------------------------------------------------------
|
| Laravel's queue supports a variety of backends via a single, unified
| API, giving you convenient access to each backend using identical
| syntax for each. The default queue connection is defined below.
|
*/
'default' => env('QUEUE_CONNECTION', 'database'),
/*
|--------------------------------------------------------------------------
| Queue Connections
|--------------------------------------------------------------------------
|
| Here you may configure the connection options for every queue backend
| used by your application. An example configuration is provided for
| each backend supported by Laravel. You're also free to add more.
|
| Drivers: "sync", "database", "beanstalkd", "sqs", "redis", "null"
|
*/
'connections' => [
'sync' => [
'driver' => 'sync',
],
'database' => [
'driver' => 'database',
'connection' => env('DB_QUEUE_CONNECTION'),
'table' => env('DB_QUEUE_TABLE', 'jobs'),
'queue' => env('DB_QUEUE', 'default'),
'retry_after' => (int) env('DB_QUEUE_RETRY_AFTER', 90),
'after_commit' => false,
],
'beanstalkd' => [
'driver' => 'beanstalkd',
'host' => env('BEANSTALKD_QUEUE_HOST', 'localhost'),
'queue' => env('BEANSTALKD_QUEUE', 'default'),
'retry_after' => (int) env('BEANSTALKD_QUEUE_RETRY_AFTER', 90),
'block_for' => 0,
'after_commit' => false,
],
'sqs' => [
'driver' => 'sqs',
'key' => env('AWS_ACCESS_KEY_ID'),
'secret' => env('AWS_SECRET_ACCESS_KEY'),
'prefix' => env('SQS_PREFIX', 'https://sqs.us-east-1.amazonaws.com/your-account-id'),
'queue' => env('SQS_QUEUE', 'default'),
'suffix' => env('SQS_SUFFIX'),
'region' => env('AWS_DEFAULT_REGION', 'us-east-1'),
'after_commit' => false,
],
'redis' => [
'driver' => 'redis',
'connection' => env('REDIS_QUEUE_CONNECTION', 'default'),
'queue' => env('REDIS_QUEUE', 'default'),
'retry_after' => (int) env('REDIS_QUEUE_RETRY_AFTER', 90),
'block_for' => null,
'after_commit' => false,
],
],
/*
|--------------------------------------------------------------------------
| Job Batching
|--------------------------------------------------------------------------
|
| The following options configure the database and table that store job
| batching information. These options can be updated to any database
| connection and table which has been defined by your application.
|
*/
'batching' => [
'database' => env('DB_CONNECTION', 'sqlite'),
'table' => 'job_batches',
],
/*
|--------------------------------------------------------------------------
| Failed Queue Jobs
|--------------------------------------------------------------------------
|
| These options configure the behavior of failed queue job logging so you
| can control how and where failed jobs are stored. Laravel ships with
| support for storing failed jobs in a simple file or in a database.
|
| Supported drivers: "database-uuids", "dynamodb", "file", "null"
|
*/
'failed' => [
'driver' => env('QUEUE_FAILED_DRIVER', 'database-uuids'),
'database' => env('DB_CONNECTION', 'sqlite'),
'table' => 'failed_jobs',
],
];

38
config/services.php Normal file
View File

@ -0,0 +1,38 @@
<?php
return [
/*
|--------------------------------------------------------------------------
| Third Party Services
|--------------------------------------------------------------------------
|
| This file is for storing the credentials for third party services such
| as Mailgun, Postmark, AWS and more. This file provides the de facto
| location for this type of information, allowing packages to have
| a conventional file to locate the various service credentials.
|
*/
'postmark' => [
'token' => env('POSTMARK_TOKEN'),
],
'ses' => [
'key' => env('AWS_ACCESS_KEY_ID'),
'secret' => env('AWS_SECRET_ACCESS_KEY'),
'region' => env('AWS_DEFAULT_REGION', 'us-east-1'),
],
'resend' => [
'key' => env('RESEND_KEY'),
],
'slack' => [
'notifications' => [
'bot_user_oauth_token' => env('SLACK_BOT_USER_OAUTH_TOKEN'),
'channel' => env('SLACK_BOT_USER_DEFAULT_CHANNEL'),
],
],
];

217
config/session.php Normal file
View File

@ -0,0 +1,217 @@
<?php
use Illuminate\Support\Str;
return [
/*
|--------------------------------------------------------------------------
| Default Session Driver
|--------------------------------------------------------------------------
|
| This option determines the default session driver that is utilized for
| incoming requests. Laravel supports a variety of storage options to
| persist session data. Database storage is a great default choice.
|
| Supported: "file", "cookie", "database", "apc",
| "memcached", "redis", "dynamodb", "array"
|
*/
'driver' => env('SESSION_DRIVER', 'database'),
/*
|--------------------------------------------------------------------------
| Session Lifetime
|--------------------------------------------------------------------------
|
| Here you may specify the number of minutes that you wish the session
| to be allowed to remain idle before it expires. If you want them
| to expire immediately when the browser is closed then you may
| indicate that via the expire_on_close configuration option.
|
*/
'lifetime' => (int) env('SESSION_LIFETIME', 120),
'expire_on_close' => env('SESSION_EXPIRE_ON_CLOSE', false),
/*
|--------------------------------------------------------------------------
| Session Encryption
|--------------------------------------------------------------------------
|
| This option allows you to easily specify that all of your session data
| should be encrypted before it's stored. All encryption is performed
| automatically by Laravel and you may use the session like normal.
|
*/
'encrypt' => env('SESSION_ENCRYPT', false),
/*
|--------------------------------------------------------------------------
| Session File Location
|--------------------------------------------------------------------------
|
| When utilizing the "file" session driver, the session files are placed
| on disk. The default storage location is defined here; however, you
| are free to provide another location where they should be stored.
|
*/
'files' => storage_path('framework/sessions'),
/*
|--------------------------------------------------------------------------
| Session Database Connection
|--------------------------------------------------------------------------
|
| When using the "database" or "redis" session drivers, you may specify a
| connection that should be used to manage these sessions. This should
| correspond to a connection in your database configuration options.
|
*/
'connection' => env('SESSION_CONNECTION'),
/*
|--------------------------------------------------------------------------
| Session Database Table
|--------------------------------------------------------------------------
|
| When using the "database" session driver, you may specify the table to
| be used to store sessions. Of course, a sensible default is defined
| for you; however, you're welcome to change this to another table.
|
*/
'table' => env('SESSION_TABLE', 'sessions'),
/*
|--------------------------------------------------------------------------
| Session Cache Store
|--------------------------------------------------------------------------
|
| When using one of the framework's cache driven session backends, you may
| define the cache store which should be used to store the session data
| between requests. This must match one of your defined cache stores.
|
| Affects: "apc", "dynamodb", "memcached", "redis"
|
*/
'store' => env('SESSION_STORE'),
/*
|--------------------------------------------------------------------------
| Session Sweeping Lottery
|--------------------------------------------------------------------------
|
| Some session drivers must manually sweep their storage location to get
| rid of old sessions from storage. Here are the chances that it will
| happen on a given request. By default, the odds are 2 out of 100.
|
*/
'lottery' => [2, 100],
/*
|--------------------------------------------------------------------------
| Session Cookie Name
|--------------------------------------------------------------------------
|
| Here you may change the name of the session cookie that is created by
| the framework. Typically, you should not need to change this value
| since doing so does not grant a meaningful security improvement.
|
*/
'cookie' => env(
'SESSION_COOKIE',
Str::slug(env('APP_NAME', 'laravel'), '_').'_session'
),
/*
|--------------------------------------------------------------------------
| Session Cookie Path
|--------------------------------------------------------------------------
|
| The session cookie path determines the path for which the cookie will
| be regarded as available. Typically, this will be the root path of
| your application, but you're free to change this when necessary.
|
*/
'path' => env('SESSION_PATH', '/'),
/*
|--------------------------------------------------------------------------
| Session Cookie Domain
|--------------------------------------------------------------------------
|
| This value determines the domain and subdomains the session cookie is
| available to. By default, the cookie will be available to the root
| domain and all subdomains. Typically, this shouldn't be changed.
|
*/
'domain' => env('SESSION_DOMAIN'),
/*
|--------------------------------------------------------------------------
| HTTPS Only Cookies
|--------------------------------------------------------------------------
|
| By setting this option to true, session cookies will only be sent back
| to the server if the browser has a HTTPS connection. This will keep
| the cookie from being sent to you when it can't be done securely.
|
*/
'secure' => env('SESSION_SECURE_COOKIE'),
/*
|--------------------------------------------------------------------------
| HTTP Access Only
|--------------------------------------------------------------------------
|
| Setting this value to true will prevent JavaScript from accessing the
| value of the cookie and the cookie will only be accessible through
| the HTTP protocol. It's unlikely you should disable this option.
|
*/
'http_only' => env('SESSION_HTTP_ONLY', true),
/*
|--------------------------------------------------------------------------
| Same-Site Cookies
|--------------------------------------------------------------------------
|
| This option determines how your cookies behave when cross-site requests
| take place, and can be used to mitigate CSRF attacks. By default, we
| will set this value to "lax" to permit secure cross-site requests.
|
| See: https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Set-Cookie#samesitesamesite-value
|
| Supported: "lax", "strict", "none", null
|
*/
'same_site' => env('SESSION_SAME_SITE', 'lax'),
/*
|--------------------------------------------------------------------------
| Partitioned Cookies
|--------------------------------------------------------------------------
|
| Setting this value to true will tie the cookie to the top-level site for
| a cross-site context. Partitioned cookies are accepted by the browser
| when flagged "secure" and the Same-Site attribute is set to "none".
|
*/
'partitioned' => env('SESSION_PARTITIONED_COOKIE', false),
];

1
database/.gitignore vendored Normal file
View File

@ -0,0 +1 @@
*.sqlite*

View File

@ -0,0 +1,44 @@
<?php
namespace Database\Factories;
use Illuminate\Database\Eloquent\Factories\Factory;
use Illuminate\Support\Facades\Hash;
use Illuminate\Support\Str;
/**
* @extends \Illuminate\Database\Eloquent\Factories\Factory<\App\Models\User>
*/
class UserFactory extends Factory
{
/**
* The current password being used by the factory.
*/
protected static ?string $password;
/**
* Define the model's default state.
*
* @return array<string, mixed>
*/
public function definition(): array
{
return [
'name' => fake()->name(),
'email' => fake()->unique()->safeEmail(),
'email_verified_at' => now(),
'password' => static::$password ??= Hash::make('password'),
'remember_token' => Str::random(10),
];
}
/**
* Indicate that the model's email address should be unverified.
*/
public function unverified(): static
{
return $this->state(fn (array $attributes) => [
'email_verified_at' => null,
]);
}
}

View File

@ -0,0 +1,49 @@
<?php
use Illuminate\Database\Migrations\Migration;
use Illuminate\Database\Schema\Blueprint;
use Illuminate\Support\Facades\Schema;
return new class extends Migration
{
/**
* Run the migrations.
*/
public function up(): void
{
Schema::create('users', function (Blueprint $table) {
$table->id();
$table->string('name');
$table->string('email')->unique();
$table->timestamp('email_verified_at')->nullable();
$table->string('password');
$table->rememberToken();
$table->timestamps();
});
Schema::create('password_reset_tokens', function (Blueprint $table) {
$table->string('email')->primary();
$table->string('token');
$table->timestamp('created_at')->nullable();
});
Schema::create('sessions', function (Blueprint $table) {
$table->string('id')->primary();
$table->foreignId('user_id')->nullable()->index();
$table->string('ip_address', 45)->nullable();
$table->text('user_agent')->nullable();
$table->longText('payload');
$table->integer('last_activity')->index();
});
}
/**
* Reverse the migrations.
*/
public function down(): void
{
Schema::dropIfExists('users');
Schema::dropIfExists('password_reset_tokens');
Schema::dropIfExists('sessions');
}
};

View File

@ -0,0 +1,35 @@
<?php
use Illuminate\Database\Migrations\Migration;
use Illuminate\Database\Schema\Blueprint;
use Illuminate\Support\Facades\Schema;
return new class extends Migration
{
/**
* Run the migrations.
*/
public function up(): void
{
Schema::create('cache', function (Blueprint $table) {
$table->string('key')->primary();
$table->mediumText('value');
$table->integer('expiration');
});
Schema::create('cache_locks', function (Blueprint $table) {
$table->string('key')->primary();
$table->string('owner');
$table->integer('expiration');
});
}
/**
* Reverse the migrations.
*/
public function down(): void
{
Schema::dropIfExists('cache');
Schema::dropIfExists('cache_locks');
}
};

View File

@ -0,0 +1,57 @@
<?php
use Illuminate\Database\Migrations\Migration;
use Illuminate\Database\Schema\Blueprint;
use Illuminate\Support\Facades\Schema;
return new class extends Migration
{
/**
* Run the migrations.
*/
public function up(): void
{
Schema::create('jobs', function (Blueprint $table) {
$table->id();
$table->string('queue')->index();
$table->longText('payload');
$table->unsignedTinyInteger('attempts');
$table->unsignedInteger('reserved_at')->nullable();
$table->unsignedInteger('available_at');
$table->unsignedInteger('created_at');
});
Schema::create('job_batches', function (Blueprint $table) {
$table->string('id')->primary();
$table->string('name');
$table->integer('total_jobs');
$table->integer('pending_jobs');
$table->integer('failed_jobs');
$table->longText('failed_job_ids');
$table->mediumText('options')->nullable();
$table->integer('cancelled_at')->nullable();
$table->integer('created_at');
$table->integer('finished_at')->nullable();
});
Schema::create('failed_jobs', function (Blueprint $table) {
$table->id();
$table->string('uuid')->unique();
$table->text('connection');
$table->text('queue');
$table->longText('payload');
$table->longText('exception');
$table->timestamp('failed_at')->useCurrent();
});
}
/**
* Reverse the migrations.
*/
public function down(): void
{
Schema::dropIfExists('jobs');
Schema::dropIfExists('job_batches');
Schema::dropIfExists('failed_jobs');
}
};

View File

@ -0,0 +1,23 @@
<?php
namespace Database\Seeders;
use App\Models\User;
// use Illuminate\Database\Console\Seeds\WithoutModelEvents;
use Illuminate\Database\Seeder;
class DatabaseSeeder extends Seeder
{
/**
* Seed the application's database.
*/
public function run(): void
{
// User::factory(10)->create();
User::factory()->create([
'name' => 'Test User',
'email' => 'test@example.com',
]);
}
}

80
docker-compose.yml Normal file
View File

@ -0,0 +1,80 @@
version: '3.8'
services:
# Laravel App
app:
build:
context: ./docker/php
dockerfile: Dockerfile
container_name: laravel-app
restart: always
working_dir: /var/www
volumes:
- .:/var/www
depends_on:
db_mysql:
condition: service_healthy
command: >
/bin/sh -c '
mkdir -p /var/www/storage /var/www/bootstrap/cache &&
chown -R www-data:www-data /var/www/storage /var/www/bootstrap/cache &&
chmod -R 775 /var/www/storage /var/www/bootstrap/cache &&
composer install --no-dev --optimize-autoloader &&
php artisan migrate --force &&
php-fpm '
healthcheck:
test: ["CMD", "sh", "-c", "pgrep php-fpm"]
interval: 30s
timeout: 10s
retries: 10
networks:
- app_network
# MySQL
db_mysql:
image: mysql:8.0
container_name: db_mysql
restart: always
environment:
MYSQL_ROOT_PASSWORD: newpassword
MYSQL_DATABASE: laravel-cms
MYSQL_USER: laravel_user
MYSQL_PASSWORD: password
MYSQL_ALLOW_EMPTY_PASSWORD: "no"
volumes:
- mysql-data:/var/lib/mysql
healthcheck:
test: ["CMD", "mysqladmin", "ping", "-h", "localhost", "-uroot", "-pnewpassword"]
interval: 10s
timeout: 5s
retries: 5
networks:
- app_network
# Nginx
web:
image: nginx:1.26.3-alpine
container_name: web
restart: always
ports:
- "8000:80"
volumes:
- .:/var/www
- ./docker/nginx/default.conf:/etc/nginx/conf.d/default.conf:rw
depends_on:
app:
condition: service_healthy
healthcheck:
test: ["CMD", "curl", "-f", "http://localhost"]
interval: 30s
timeout: 10s
retries: 5
networks:
- app_network
volumes:
mysql-data:
networks:
app_network:
driver: bridge

28
docker/nginx/default.conf Normal file
View File

@ -0,0 +1,28 @@
server {
listen 80;
server_name localhost;
root /var/www/public;
index index.php index.html;
location / {
try_files $uri $uri/ /index.php?$query_string;
}
location ~ \.php$ {
try_files $uri =404;
include fastcgi.conf;
fastcgi_pass app:9000;
fastcgi_index index.php;
fastcgi_param SCRIPT_FILENAME $realpath_root$fastcgi_script_name;
fastcgi_param DOCUMENT_ROOT $realpath_root;
}
# Deny access to .htaccess files
location ~ /\.ht {
deny all;
}
error_log /var/log/nginx/error.log;
access_log /var/log/nginx/access.log;
}

41
docker/php/Dockerfile Normal file
View File

@ -0,0 +1,41 @@
# Use PHP 8.2 Alpine (compatible with Laravel 11)
FROM php:8.2-fpm-alpine
# Install required dependencies
RUN apk add --no-cache \
oniguruma-dev \
libpng-dev \
libjpeg-turbo-dev \
libwebp-dev \
freetype-dev \
libzip-dev \
zip \
unzip \
openssl # Laravel requires OpenSSL for encryption
# Install required extensions
RUN docker-php-ext-configure gd --with-freetype --with-jpeg --with-webp \
&& docker-php-ext-install gd pdo pdo_mysql bcmath mbstring zip
# Install Composer (using official Composer image)
COPY --from=composer:2.7 /usr/bin/composer /usr/bin/composer
# Set working directory
WORKDIR /var/www
# Copy Laravel application files BEFORE running composer install
COPY . /var/www/
# Ensure composer.json exists before running install
RUN if [ -f "composer.json" ]; then composer install --no-dev --optimize-autoloader; else echo "composer.json not found!"; fi
# Ensure required Laravel directories exist and set permissions
RUN mkdir -p /var/www/storage /var/www/bootstrap/cache && \
chown -R www-data:www-data /var/www && \
chmod -R 775 /var/www/storage /var/www/bootstrap/cache
# Expose PHP-FPM port
EXPOSE 9000
# Start PHP-FPM server
CMD ["php-fpm"]

2967
package-lock.json generated Normal file

File diff suppressed because it is too large Load Diff

21
package.json Normal file
View File

@ -0,0 +1,21 @@
{
"private": true,
"type": "module",
"scripts": {
"build": "vite build",
"dev": "vite"
},
"devDependencies": {
"autoprefixer": "^10.4.20",
"axios": "^1.7.4",
"concurrently": "^9.0.1",
"laravel-vite-plugin": "^1.2.0",
"postcss": "^8.4.47",
"tailwindcss": "^3.4.13",
"vite": "^6.0.11"
},
"dependencies": {
"@popperjs/core": "^2.11.8",
"bootstrap": "^5.3.5"
}
}

33
phpunit.xml Normal file
View File

@ -0,0 +1,33 @@
<?xml version="1.0" encoding="UTF-8"?>
<phpunit xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xsi:noNamespaceSchemaLocation="vendor/phpunit/phpunit/phpunit.xsd"
bootstrap="vendor/autoload.php"
colors="true"
>
<testsuites>
<testsuite name="Unit">
<directory>tests/Unit</directory>
</testsuite>
<testsuite name="Feature">
<directory>tests/Feature</directory>
</testsuite>
</testsuites>
<source>
<include>
<directory>app</directory>
</include>
</source>
<php>
<env name="APP_ENV" value="testing"/>
<env name="APP_MAINTENANCE_DRIVER" value="file"/>
<env name="BCRYPT_ROUNDS" value="4"/>
<env name="CACHE_STORE" value="array"/>
<!-- <env name="DB_CONNECTION" value="sqlite"/> -->
<!-- <env name="DB_DATABASE" value=":memory:"/> -->
<env name="MAIL_MAILER" value="array"/>
<env name="PULSE_ENABLED" value="false"/>
<env name="QUEUE_CONNECTION" value="sync"/>
<env name="SESSION_DRIVER" value="array"/>
<env name="TELESCOPE_ENABLED" value="false"/>
</php>
</phpunit>

6
postcss.config.js Normal file
View File

@ -0,0 +1,6 @@
export default {
plugins: {
tailwindcss: {},
autoprefixer: {},
},
};

25
public/.htaccess Normal file
View File

@ -0,0 +1,25 @@
<IfModule mod_rewrite.c>
<IfModule mod_negotiation.c>
Options -MultiViews -Indexes
</IfModule>
RewriteEngine On
# Handle Authorization Header
RewriteCond %{HTTP:Authorization} .
RewriteRule .* - [E=HTTP_AUTHORIZATION:%{HTTP:Authorization}]
# Handle X-XSRF-Token Header
RewriteCond %{HTTP:x-xsrf-token} .
RewriteRule .* - [E=HTTP_X_XSRF_TOKEN:%{HTTP:X-XSRF-Token}]
# Redirect Trailing Slashes If Not A Folder...
RewriteCond %{REQUEST_FILENAME} !-d
RewriteCond %{REQUEST_URI} (.+)/$
RewriteRule ^ %1 [L,R=301]
# Send Requests To Front Controller...
RewriteCond %{REQUEST_FILENAME} !-d
RewriteCond %{REQUEST_FILENAME} !-f
RewriteRule ^ index.php [L]
</IfModule>

3
public/css/app.css Normal file
View File

@ -0,0 +1,3 @@
@tailwind base;
@tailwind components;
@tailwind utilities;

10003
public/css/bootstrap.min.css vendored Normal file

File diff suppressed because it is too large Load Diff

779
public/css/custom.css Normal file
View File

@ -0,0 +1,779 @@
@import url('https://fonts.googleapis.com/css?family=Nova+Slim&display=swap');
body,
html {
line-height: 1.8;
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
color: #555e58;
text-transform: capitalize;
text-rendering: optimizeLegibility !important;
-webkit-font-smoothing: antialiased !important;
font-weight: 400;
margin: 0px;
padding: 0px;
}
h1,
h2,
h3,
h4,
h5,
h6,
.h1,
.h2,
.h3,
.h4 {
font-weight: 400;
line-height: 1.5em;
}
p {
font-size: 15px;
margin: 12px 0 0;
line-height: 24px;
}
a {
color: #333;
font-weight: 400;
}
button:focus {
box-shadow: none;
outline: none;
border: none;
}
button {
cursor: pointer;
}
ul,
ol {
padding: 0;
margin: 0px;
list-style: none;
}
a,
a:hover,
a:focus {
color: #333;
text-decoration: none;
transition: all 0.3s;
}
/*=======================================================
material-icons copy & paste form site google material-icons
==================================================*/
@font-face {
font-family: 'Material Icons';
font-style: normal;
font-weight: 400;
src: url(https://example.com/MaterialIcons-Regular.eot);
/* For IE6-8 */
src: local('Material Icons'),
local('MaterialIcons-Regular'),
url(https://example.com/MaterialIcons-Regular.woff2) format('woff2'),
url(https://example.com/MaterialIcons-Regular.woff) format('woff'),
url(https://example.com/MaterialIcons-Regular.ttf) format('truetype');
}
.material-icons {
font-family: 'Material Icons';
font-weight: normal;
font-style: normal;
font-size: 24px;
/* Preferred icon size */
display: inline-block;
line-height: 1;
text-transform: none;
letter-spacing: normal;
word-wrap: normal;
white-space: nowrap;
direction: ltr;
/* Support for all WebKit browsers. */
-webkit-font-smoothing: antialiased;
/* Support for Safari and Chrome. */
text-rendering: optimizeLegibility;
/* Support for Firefox. */
-moz-osx-font-smoothing: grayscale;
/* Support for IE. */
font-feature-settings: 'liga';
}
/*=======================================================
material-icons copy & paste form site google material-icons
==================================================*/
.wrapper {
position: relative;
width: 100%;
overflow: auto;
}
/* ---------------------------------------------------
SIDEBAR STYLE start
----------------------------------------------------- */
#sidebar {
position: fixed;
height: 100vh !important;
top: 0;
bottom: 0;
left: 0;
z-index: 11;
width: 260px;
overflow: auto;
transition: all 0.3s;
background: #FFFFFF;
box-shadow: 0 10px 30px -12px rgb(0 0 0 / 42%), 0 4px 25px 0px rgb(0 0 0 / 12%), 0 8px 10px -5px rgb(0 0 0 / 20%);
}
#sidebar::-webkit-scrollbar {
width: 5px;
border-radius: 10px;
background-color: #eee;
display: none;
}
#sidebar::-webkit-scrollbar-thumbs {
width: 5px;
border-radius: 10px;
background-color: #333;
display: none;
}
#sidebar:hover::-webkit-scrollbar {
display: block;
}
#sidebar:hover::-webkit-scrollbar-thumbs {
display: block;
}
#sidebar .sidebar-header {
padding: 20px;
background-color: #ffffff;
border-bottom: 1px solid #eee;
}
.sidebar-header h3 {
color: #333;
font-size: 17px;
margin: 0px;
text-transform: uppercase;
transition: all 0.5s ease;
font-weight: 600;
}
.sidebar-header h3 img {
width: 120px;
margin-right: 10px;
}
#sidebar ul li {
padding: 2px 7px;
}
#sidebar ul li.active>a {
color: #333;
background-color: rgba(200, 200, 200, 0.2);
}
#sidebar ul li a:hover {
color: #333;
background-color: rgba(200, 200, 200, 0.2);
}
.dropdown-toggle::after {
position: absolute;
right: 10px;
top: 23px;
}
#sidebar ul li.drodown {
position: sticky;
}
#sidebar ul.components {
padding: 20px 0;
}
#sidebar ul li a {
padding: 10px;
line-height: 30px;
border-radius: 5px;
font-size: 15px;
position: relative;
font-weight: 400;
display: block;
}
#sidebar ul li a span {
text-transform: capitalize;
display: inline-block;
}
#sidebar ul li a i {
position: relative;
margin-right: 10px;
top: 5px;
color: #555555;
margin-left: 10px;
}
/* ---------------------------------------------------
sidebar end
----------------------------------------------------- */
/*=======================================================
main-content navbar-design start
===============================================*/
#content {
position: relative;
transition: all 0.3s;
background-color: #EEEEEE;
}
.top-navbar {
width: 100%;
z-index: 9;
position: relative;
}
.main-content {
padding: 10px 20px 0px 20px;
position: relative;
width: 100%;
}
.navbar {
background-color: #2196F3;
color: #FFFFFF;
}
.navbar-brand {
color: #FFFFFF;
}
.navbar button {
background-color: transparent;
border: none;
}
.navbar button span {
color: #fff;
}
#sidebarCollapse {
border-radius: 50%;
width: 45px;
height: 45px;
text-align: center;
line-height: 45px;
margin-right: 20px;
border: none;
color: #FFFFFF;
background-color: rgba(0, 0, 0, 0.09);
}
#sidebarCollapse span {
margin: 9px;
padding: 0px;
}
.navbar-nav>li.active {
color: #FFFFFF;
border-radius: 4px;
background-color: rgba(0, 0, 0, 0.08);
}
.navbar-nav>li>a {
color: #FFFFFF;
}
.navbar .notification {
position: absolute;
top: 5px;
right: 10px;
display: block;
font-size: 9px;
border: 0px;
font-size: 10px;
background: #d9534f;
min-width: 15px;
text-align: center;
padding: 1px 5px;
height: 15px;
border-radius: 2px;
line-height: 14px;
}
.navbar-nav>li.show .dropdown-menu {
transform: translate3d(0, 0, 0);
opacity: 1;
visibility: visible;
}
.dropdown-menu li>a {
font-size: 13px;
padding: 10px 20px;
margin: 0 5px;
border-radius: 2px;
font-weight: 400;
transition: all 150ms linear;
}
.navbar-nav>.active>a:focus {
color: #FFFFFF;
background-color: rgba(0, 0, 0, 0.08);
}
.navbar-nav li a {
position: relative;
display: block;
padding: 10px 15px !important;
}
/*=======================================================
main-content navbar-design end
===============================================*/
/*=======================================================
main-content navbar-design start
===============================================*/
/*=======================================================
main-content inner design like card start
===============================================*/
.card {
margin: 10px 0;
}
.card {
border-radius: 0px !important;
}
.card {
display: inline-block;
position: relative;
border: none !important;
width: 100%;
margin: 15px 0;
box-shadow: 0 1px 2px rgb(0 0 0 / 8%);
border-radius: 6px;
color: rgba(0, 0, 0, 0.87);
background: #fff;
}
.card-stats .card-header {
float: left;
text-align: center;
}
.card .card-header {
padding: 15px 20px 0;
z-index: 3;
background-color: #fff !important;
border-bottom: none;
}
.card .card-footer .stats .material-icons {
position: relative;
top: 4px;
font-size: 16px;
}
.card-stats .card-header span {
font-size: 36px;
line-height: 56px;
width: 56px;
height: 56px;
}
.icon.icon-warning {
color: #ff9800;
}
.icon.icon-rose {
color: #e91e63;
}
.icon.icon-success {
color: #4caf50;
}
.icon.icon-info {
color: #00bcd4;
}
.card .card-footer {
margin: 0 7px 0px;
padding-top: 10px;
background-color: #fff;
border-top: 1px solid #eeeeee;
}
.text-info {
color: #03A9F4 !important;
}
.card-stats .card-content {
text-align: right;
padding-top: 10px;
}
.card .card-content {
padding: 15px 20px;
position: relative;
}
.card .card-content .category {
margin-bottom: 0;
}
.card .category:not([class*="text-"]) {
color: #555555;
font-size: 14px;
font-weight: 400;
}
.card .card-title:not(.card-calendar .card-title) {
margin-top: 0;
margin-bottom: 5px;
}
.card-stats .card-title {
margin: 0;
}
.card .card-footer .stats {
line-height: 22px;
color: #555555;
font-size: 15px;
}
.card .card-footer div {
display: inline-block;
}
.card .card-header-text h4 {
margin-top: 0;
margin-bottom: 3px;
font-size: 19px;
font-weight: 400;
color: #222222;
text-decoration: none;
}
.table>thead>tr>th {
border-bottom-width: 1px;
font-size: 16px;
font-weight: 400;
}
.card .card-content {
padding: 15px 20px;
position: relative;
}
.streamline .sl-primary {
border-left-color: #188ae2;
}
.streamline .sl-item {
position: relative;
padding-bottom: 12px;
border-left: 1px solid #ccc;
}
.streamline .sl-item:before {
content: '';
position: absolute;
left: -6px;
top: 0;
background-color: #ccc;
width: 12px;
height: 12px;
border-radius: 100%;
}
.streamline .sl-primary:before,
.streamline .sl-primary:last-child:after {
background-color: #188ae2;
}
.streamline .sl-danger:before,
.streamline .sl-danger:last-child:after {
background-color: #ff5b5b;
}
.streamline .sl-success {
border-left-color: #10c469;
}
.streamline .sl-success:before,
.streamline .sl-success:last-child:after {
background-color: #10c469;
}
.streamline .sl-warning {
border-left-color: #f9c851;
}
.streamline .sl-warning:before,
.streamline .sl-warning:last-child:after {
background-color: #f9c851;
}
.streamline .sl-danger {
border-left-color: #ff5b5b;
}
.streamline .sl-item .sl-content {
margin-left: 24px;
}
.streamline .sl-item .text-muted {
color: inherit;
opacity: .6;
font-size: 12px;
}
.streamline .sl-item p {
font-size: 14px;
color: #333;
}
/*=======================================================
main-content inner design like card end
===============================================*/
/*=============================================
footer design start
=========================================*/
.footer {
border-top: 1px solid #e7e7e7;
}
footer {
padding: 10px 0;
position: relative;
width: 100%;
}
footer ul li {
display: inline-block;
}
footer ul li a {
color: inherit;
padding: 15px;
font-weight: 500;
font-size: 12px;
text-transform: uppercase;
border-radius: 3px;
text-decoration: none;
position: relative;
display: block;
}
footer .copyright {
padding: 15px;
font-size: 14px;
margin: 0;
}
/*=============================================
footer design end
=========================================*/
#sidebar.show-nav,
.body-overlay.show-nav {
transform: translatex(0%);
opacity: 1;
display: block;
visibility: visible;
z-index: 15;
}
/* ---------------------------------------------------
MEDIAQUERIES
----------------------------------------------------- */
@media only screen and (min-width:992px) {
#sidebar.active {
width: 80px;
height: 100% !important;
position: absolute !important;
overflow: visible !important;
top: 0 !important;
z-index: 666;
float: left !important;
bottom: 0 !important;
}
#sidebar.active .sidebar-header h3 span {
display: none;
transition: all 0.5s ease;
}
#sidebar.active ul li a span {
display: none;
transition: all 0.5s ease;
}
#sidebar.active .dropdown-toggle::after {
display: none;
transition: all 0.5s ease;
}
#content {
width: calc(100% - 260px);
position: relative;
float: right;
transition: all 0.3s;
background-color: #EEEEEE;
}
#content.active {
width: calc(100% - 80px);
}
#sidebar.active .menu {
position: absolute;
left: 81px;
background-color: white;
width: 180px;
height: auto;
margin: 5px 0;
top: 0;
border: 1px solid #dcd9d9;
z-index: 4;
}
}
@media only screen and (min-width:992px) {
.dropdown-menu {
border: 0;
box-shadow: 0 2px 5px 0 rgb(0 0 0 / 26%);
transform: translate3d(0, -20px, 0);
visibility: hidden;
transition: all 150ms linear;
display: block;
min-width: 15rem;
right: 0;
left: auto;
opacity: 0;
}
}
/*===============small-screen overlay sidebar design media queries==============*/
@media only screen and (max-width:992px) {
#sidebar {
position: fixed;
top: 0;
bottom: 0;
z-index: 10;
width: 260px;
transform: translatex(-100%);
transition: all 150ms linear;
box-shadow: none !important;
}
.body-overlay {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
display: none;
visibility: hidden;
opacity: 0;
z-index: 3;
transition: all 150ms linear;
background-color: rgba(0, 0, 0, 0.5);
}
}
/*===============small-screen overlay sidebar design media queries==============*/
/* ---------------------------------------------------
MEDIAQUERIES
----------------------------------------------------- */

129
public/css/style.css Normal file
View File

@ -0,0 +1,129 @@
* {
margin: 0;
padding: 0; }
*,
::after,
::before {
-webkit-box-sizing: border-box;
box-sizing: border-box; }
a {
text-decoration: none;
-webkit-transition: all 0.5s ease-in-out 0s;
-o-transition: all 0.5s ease-in-out 0s;
transition: all 0.5s ease-in-out 0s; }
a:hover {
text-decoration: none; }
/*-----------------------------
News Ticker
------------------------------*/
.acme-news-ticker {
background: #fff;
position: relative;
height: 45px;
border: 1px solid #1974d2;
margin-top: 45px; }
@media (min-width: 768px) {
.acme-news-ticker {
margin-top: 0; } }
.acme-news-ticker-label {
background: #1974d2;
padding: 10px;
width: auto;
float: left;
margin-right: 15px;
line-height: normal;
height: 100%;
color: #fff; }
@media (max-width: 575px) {
.acme-news-ticker-label {
position: absolute;
top: -45px; } }
.acme-news-ticker-box {
height: 100%;
padding-top: 10px;
overflow: hidden; }
@media (max-width: 575px) {
.acme-news-ticker-box {
padding-left: 10px;
padding-right: 120px; } }
.acme-news-ticker-box ul {
width: 100%;
list-style-type: none !important;
padding: 0;
margin: 0; }
.acme-news-ticker-box ul li a {
text-decoration: none; }
.acme-news-ticker-controls {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
position: absolute;
height: 100%;
right: 0;
top: 0; }
.acme-news-ticker-controls button {
height: 100%;
background: #f6f6f6;
padding: 0;
width: 40px;
border-color: #eeeeee;
border-style: solid;
border-width: 0 0 0 1px;
cursor: pointer;
display: inline-block; }
.acme-news-ticker-controls button:hover {
background: #eeeeee; }
.acme-news-ticker-controls button.acme-news-ticker-arrow {
margin: 0;
display: inline-block;
position: relative; }
.acme-news-ticker-controls button.acme-news-ticker-arrow:after {
border-color: #999;
border-bottom-style: solid;
border-bottom-width: 2px;
border-right-style: solid;
border-right-width: 2px;
content: '';
display: inline-block;
height: 8px;
left: 50%;
position: absolute;
top: 50%;
width: 8px; }
.acme-news-ticker-controls button.acme-news-ticker-pause {
position: relative;
display: inline-block; }
.acme-news-ticker-controls button.acme-news-ticker-pause:before {
position: absolute;
content: "";
width: 10px;
height: 10px;
border-color: #999;
border-style: solid;
border-width: 0 2px 0;
-webkit-transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
left: 50%;
top: 50%; }
.acme-news-ticker-controls.acme-news-ticker-horizontal-controls button.acme-news-ticker-prev:after {
-webkit-transform: translate(-50%, -50%) rotate(135deg);
-ms-transform: translate(-50%, -50%) rotate(135deg);
transform: translate(-50%, -50%) rotate(135deg); }
.acme-news-ticker-controls.acme-news-ticker-horizontal-controls button.acme-news-ticker-next:after {
-webkit-transform: translate(-50%, -50%) rotate(315deg);
-ms-transform: translate(-50%, -50%) rotate(315deg);
transform: translate(-50%, -50%) rotate(315deg); }
.acme-news-ticker-controls.acme-news-ticker-vertical-controls button.acme-news-ticker-prev:after {
-webkit-transform: translate(-50%, -50%) rotate(225deg);
-ms-transform: translate(-50%, -50%) rotate(225deg);
transform: translate(-50%, -50%) rotate(225deg); }
.acme-news-ticker-controls.acme-news-ticker-vertical-controls button.acme-news-ticker-next:after {
-webkit-transform: translate(-50%, -50%) rotate(405deg);
-ms-transform: translate(-50%, -50%) rotate(405deg);
transform: translate(-50%, -50%) rotate(405deg); }
/*# sourceMappingURL=style.css.map */

0
public/favicon.ico Normal file
View File

BIN
public/img/bg_cms.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 224 KiB

1
public/img/ic_error.svg Normal file
View File

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 57.834 57.955"><defs><style>.a{fill:#f4825c;stroke:#707070;}.b{fill:#e74610;}.c{stroke:none;}.d{fill:none;}</style></defs><g transform="translate(-0.498 0.199)"><g transform="translate(0 0)"><g class="a" transform="translate(1.009 0.934)"><circle class="c" cx="27.989" cy="27.989" r="27.989"/><circle class="d" cx="27.989" cy="27.989" r="27.489"/></g><g transform="translate(-26.502 -27.6)"><g transform="translate(27 27.4)"><path class="b" d="M55.917,85.355A28.978,28.978,0,1,1,84.834,56.317,29.012,29.012,0,0,1,55.917,85.355Zm0-54.31A25.272,25.272,0,1,0,81.189,56.317,25.253,25.253,0,0,0,55.917,31.045Z" transform="translate(-27 -27.4)"/><g transform="translate(18.529 18.65)"><path class="b" d="M59.638,63.344a1.827,1.827,0,0,1-1.337-.486l-8.5-8.5a1.762,1.762,0,0,1,0-2.551l8.5-8.5a1.8,1.8,0,0,1,2.551,2.551l-7.168,7.168,7.168,7.169a1.762,1.762,0,0,1,0,2.551A1.234,1.234,0,0,1,59.638,63.344Z" transform="translate(-40.745 -42.75)"/><path class="b" d="M44.133,63.323a1.827,1.827,0,0,1-1.336-.486,1.762,1.762,0,0,1,0-2.551l7.169-7.169L42.8,45.948A1.8,1.8,0,0,1,45.348,43.4l8.5,8.5a1.762,1.762,0,0,1,0,2.551l-8.5,8.5A1.814,1.814,0,0,1,44.133,63.323Z" transform="translate(-42.25 -42.729)"/></g></g></g></g></g></svg>

After

Width:  |  Height:  |  Size: 1.2 KiB

View File

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 58.184 58.184"><defs><style>.a{fill:#56b68b;stroke:#707070;}.b{fill:#018952;fill-rule:evenodd;}.c{stroke:none;}.d{fill:none;}</style></defs><g transform="translate(-138.502 -248.613)"><g transform="translate(138.502 248.613)"><g transform="translate(0 0)"><g class="a" transform="translate(1.009 0.934)"><circle class="c" cx="27.989" cy="27.989" r="27.989"/><circle class="d" cx="27.989" cy="27.989" r="27.489"/></g><path class="b" d="M47.664,22.747l2.3,2.3L31.8,43.209l-2.3,2.3-2.3-2.3-8.978-8.978,2.3-2.3L29.5,40.913ZM34.092,5A29.092,29.092,0,1,1,5,34.092,29.079,29.079,0,0,1,34.092,5Zm0,3.967A25.16,25.16,0,1,1,8.967,34.092,25.173,25.173,0,0,1,34.092,8.967Z" transform="translate(-5 -5)"/></g></g></g></svg>

After

Width:  |  Height:  |  Size: 763 B

BIN
public/img/logo.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 93 KiB

BIN
public/img/logo_unioil.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 8.1 KiB

17
public/index.php Normal file
View File

@ -0,0 +1,17 @@
<?php
use Illuminate\Http\Request;
define('LARAVEL_START', microtime(true));
// Determine if the application is in maintenance mode...
if (file_exists($maintenance = __DIR__.'/../storage/framework/maintenance.php')) {
require $maintenance;
}
// Register the Composer autoloader...
require __DIR__.'/../vendor/autoload.php';
// Bootstrap Laravel and handle the request...
(require_once __DIR__.'/../bootstrap/app.php')
->handleRequest(Request::capture());

1
public/js/app.js Normal file
View File

@ -0,0 +1 @@
import './bootstrap';

4
public/js/bootstrap.js vendored Normal file
View File

@ -0,0 +1,4 @@
import axios from 'axios';
window.axios = axios;
window.axios.defaults.headers.common['X-Requested-With'] = 'XMLHttpRequest';

7
public/js/bootstrap.min.js vendored Normal file

File diff suppressed because one or more lines are too long

2
public/js/jquery-3.3.1.min.js vendored Normal file

File diff suppressed because one or more lines are too long

2
public/js/jquery-3.3.1.slim.min.js vendored Normal file

File diff suppressed because one or more lines are too long

6
public/js/jquery.js vendored Normal file

File diff suppressed because one or more lines are too long

5
public/js/popper.min.js vendored Normal file

File diff suppressed because one or more lines are too long

2
public/robots.txt Normal file
View File

@ -0,0 +1,2 @@
User-agent: *
Disallow:

View File

@ -0,0 +1,766 @@
@props([
'pageTitle' => '',
'data' => [],
'columns' => [],
'actions' => [],
'showAddButton' => false,
'addButtonUrl' => '#',
'showCheckboxes' => false,
'showBatchDelete' => false,
'showEditModal' => false,
'showViewModal' => false
])
<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">
</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 + 1 }}">
{{ $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 modal-dialog-centered">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="editModalLabel">Edit {{ $pageTitle }}</h5>
<button type="button" class="modal-close-btn" data-bs-dismiss="modal" aria-label="Close">
<i class="fa-solid fa-xmark"></i>
</button>
</div>
<div class="modal-body">
<form id="editForm">
@foreach ($columns as $column)
<div class="mb-3">
<label for="edit{{ ucfirst($column['key']) }}" class="form-label">{{ $column['name'] }}</label>
@if ($column['key'] === 'status')
<select class="form-select" id="edit{{ ucfirst($column['key']) }}">
<option value="Active">Active</option>
<option value="Inactive">Inactive</option>
</select>
@else
<input type="{{ $column['key'] === 'email' ? 'email' : 'text' }}"
class="form-control"
id="edit{{ ucfirst($column['key']) }}"
{{ $column['key'] === 'username' || $column['key'] === 'memberId' ? 'readonly' : '' }}>
@endif
</div>
@endforeach
</form>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-outline-secondary" data-bs-dismiss="modal">Cancel</button>
<button type="button" class="btn btn-primary" id="updateBtn">Update</button>
</div>
</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 modal-dialog-centered">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="viewModalLabel">View {{ $pageTitle }} Details</h5>
<button type="button" class="modal-close-btn" data-bs-dismiss="modal" aria-label="Close">
<i class="fa-solid fa-xmark"></i>
</button>
</div>
<div class="modal-body">
<div class="view-details">
@foreach ($columns as $column)
<p><strong>{{ $column['name'] }}:</strong> <span id="view{{ ucfirst($column['key']) }}"></span></p>
@endforeach
</div>
</div>
<div class="modal-footer">
@if ($pageTitle === 'Locked Account')
<button type="button" class="btn btn-success" id="activateAccountBtn">Activate Account</button>
@endif
<button type="button" class="btn btn-outline-secondary" data-bs-dismiss="modal">Close</button>
</div>
</div>
</div>
</div>
@endif
<!-- CSS (unchanged from your original) -->
<style>
.card,
.table,
.btn,
.form-control,
.input-group-text,
.modal-content {
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
font-weight: 400;
line-height: 1.5;
}
.card-header h5,
.modal-title {
font-weight: 500;
}
.table thead th {
font-weight: 500;
font-size: 0.8rem;
}
.form-label {
font-weight: 500;
font-size: 0.9rem;
}
.card {
border-radius: 10px;
}
.card-header {
background-color: transparent;
}
.btn-primary {
background-color: #E74610;
border-color: #E74610;
}
.btn-primary:hover {
background-color: #E74610;
border-color: #E74610;
}
.sortable {
cursor: pointer;
}
.sortable:hover {
background-color: #f1f3f5;
}
.table {
font-size: 0.85rem;
width: 100%;
table-layout: auto;
}
.table th,
.table td {
padding: 0.5rem;
vertical-align: middle;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.table th:first-child,
.table td:first-child {
width: 40px;
text-align: center;
}
.table th:last-child,
.table td:last-child {
width: 120px;
text-align: center;
}
.table td:nth-child(5),
.table th:nth-child(5) {
width: 100px;
}
.table td:nth-child(6),
.table th:nth-child(6) {
max-width: 200px;
}
.table td:nth-child(7),
.table th:nth-child(7) {
width: 120px;
}
.status-btn {
font-size: 0.75rem;
padding: 0.2rem 0.5rem;
}
.dropdown-menu-sm {
min-width: 120px;
}
.dropdown-item {
font-size: 0.85rem;
}
.table thead .sortable i {
font-size: 0.7rem;
vertical-align: middle;
}
.table-container {
overflow-x: hidden;
}
.modal-content {
border-radius: 8px;
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}
.modal-header {
border-bottom: 1px solid #e9ecef;
position: relative;
}
.modal-footer {
border-top: 1px solid #e9ecef;
}
.form-control,
.form-select {
font-size: 0.9rem;
border-radius: 5px;
}
.modal-close-btn {
background: none;
border: none;
font-size: 1rem;
color: #6c757d;
position: absolute;
right: 15px;
top: 15px;
cursor: pointer;
}
.modal-close-btn:hover {
color: #343a40;
}
.view-details p {
margin-bottom: 0.75rem;
font-size: 0.9rem;
}
.view-details strong {
display: inline-block;
width: 120px;
font-weight: 500;
color: #343a40;
}
.view-details span {
color: #495057;
}
.pagination-sm .page-link {
padding: 0.25rem 0.5rem;
font-size: 0.85rem;
border-color: #E74610;
color: #E74610;
}
.pagination-sm .page-item.active .page-link {
background-color: #E74610;
border-color: #E74610;
color: #fff;
}
.pagination-sm .page-link:hover {
background-color: #E74610;
border-color: #E74610;
color: #fff;
}
.pagination-sm .page-item.disabled .page-link {
border-color: #dee2e6;
color: #6c757d;
}
.edit-btn {
border-color: #E74610;
color: #E74610;
}
.edit-btn:hover {
background-color: #E74610;
border-color: #E74610;
color: #fff;
}
@media (max-width: 576px) {
.table {
font-size: 0.75rem;
}
.table thead th {
font-size: 0.75rem;
}
.table th,
.table td {
padding: 0.3rem;
}
.btn-sm {
padding: 0.2rem 0.4rem;
font-size: 0.75rem;
}
.input-group-sm>.form-control {
font-size: 0.75rem;
}
.status-btn {
font-size: 0.65rem;
}
.dropdown-item {
font-size: 0.75rem;
}
.table thead .sortable i {
font-size: 0.65rem;
}
.pagination-sm .page-link {
padding: 0.2rem 0.4rem;
font-size: 0.75rem;
}
.table td:nth-child(6) {
max-width: 150px;
}
.form-control,
.form-select {
font-size: 0.85rem;
}
.modal-close-btn {
font-size: 0.9rem;
}
.view-details p {
font-size: 0.85rem;
}
.view-details strong {
width: 100px;
}
}
</style>
<!-- JavaScript -->
<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)
};
const rowsPerPage = 5;
let currentPage = 1;
let filteredRows = [...tableConfig.data];
let originalRows = [...tableConfig.data].map(row => ({ ...row }));
let sortDirection = {};
let currentRowId = null; // Track the row being viewed
function renderTable() {
const tableBody = document.getElementById('tableBody');
if (!tableBody) return;
tableBody.innerHTML = '';
const start = (currentPage - 1) * rowsPerPage;
const end = start + rowsPerPage;
const paginatedRows = filteredRows.slice(start, end);
paginatedRows.forEach(row => {
const tr = document.createElement('tr');
tr.setAttribute('data-id', row.id);
let rowHtml = '';
if (tableConfig.showCheckboxes) {
rowHtml += `<td class="text-center"><input type="checkbox" class="rowCheckbox"></td>`;
}
tableConfig.columns.forEach(col => {
if (col.key === 'status') {
rowHtml += `
<td>
<div class="dropdown">
<button class="btn btn-sm btn-outline-secondary status-btn" type="button" id="statusDropdown${row.id}" data-bs-toggle="dropdown" aria-expanded="false">
<span class="status-text">${row[col.key]}</span>
</button>
<ul class="dropdown-menu dropdown-menu-end dropdown-menu-sm" aria-labelledby="statusDropdown${row.id}">
<li>
<a class="dropdown-item d-flex align-items-center gap-2 status-option" href="#" data-status="Active">
<i class="fa-solid fa-check text-success" style="font-size: 14px;"></i>
<span>Active</span>
</a>
</li>
<li>
<a class="dropdown-item d-flex align-items-center gap-2 status-option" href="#" data-status="Inactive">
<i class="fa-solid fa-xmark text-danger" style="font-size: 14px;"></i>
<span>Inactive</span>
</a>
</li>
</ul>
</div>
</td>`;
} else {
rowHtml += `<td>${row[col.key] || ''}</td>`;
}
});
if (tableConfig.actions.length > 0) {
rowHtml += `<td class="text-center">`;
tableConfig.actions.forEach(action => {
if (action === 'edit' && tableConfig.showEditModal) {
rowHtml += `
<a href="#" class="btn btn-sm edit-btn me-1" title="Edit" data-id="${row.id}">
<i class="fa-solid fa-pen-to-square"></i>
</a>`;
} else if (action === 'view' && tableConfig.showViewModal) {
rowHtml += `
<a href="#" class="btn btn-sm btn-outline-secondary me-1 view-btn" title="View" data-id="${row.id}">
<i class="fa-solid fa-eye"></i>
</a>`;
} else if (action === 'delete') {
rowHtml += `
<button class="btn btn-sm btn-outline-danger delete-btn" title="Delete" data-id="${row.id}">
<i class="fa-solid fa-trash-can"></i>
</button>`;
}
});
rowHtml += `</td>`;
}
tr.innerHTML = rowHtml;
tableBody.appendChild(tr);
});
attachEventListeners();
updateDeleteButtonState();
}
function renderPagination() {
const pagination = document.getElementById('pagination');
if (!pagination) return;
pagination.innerHTML = '';
const pageCount = Math.ceil(filteredRows.length / rowsPerPage);
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--;
renderTable();
renderPagination();
}
});
pagination.appendChild(prevLi);
for (let i = 1; i <= pageCount; 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;
renderTable();
renderPagination();
});
pagination.appendChild(li);
}
const nextLi = document.createElement('li');
nextLi.className = `page-item ${currentPage === pageCount ? '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 < pageCount) {
currentPage++;
renderTable();
renderPagination();
}
});
pagination.appendChild(nextLi);
}
function attachEventListeners() {
// Search
const searchInput = document.getElementById('searchInput');
if (searchInput) {
searchInput.addEventListener('input', function() {
const searchTerm = this.value.toLowerCase();
filteredRows = tableConfig.data.filter(row => {
return Object.values(row).some(value =>
value && value.toString().toLowerCase().includes(searchTerm)
);
});
currentPage = 1;
renderTable();
renderPagination();
});
}
// Sort
document.querySelectorAll('.sortable').forEach(header => {
header.addEventListener('click', function() {
const columnIndex = parseInt(this.getAttribute('data-column')) - 1;
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');
}
filteredRows.sort((a, b) => {
const aValue = (a[key] || '').toString().toLowerCase();
const bValue = (b[key] || '').toString().toLowerCase();
return sortDirection[columnIndex] === 'asc' ? aValue.localeCompare(bValue) : bValue.localeCompare(aValue);
});
currentPage = 1;
renderTable();
renderPagination();
});
});
// Clear Filters
const clearFilters = document.getElementById('clearFilters');
if (clearFilters) {
clearFilters.addEventListener('click', function() {
if (searchInput) searchInput.value = '';
document.querySelectorAll('.sortable i').forEach(icon => {
icon.classList.remove('fa-sort-up', 'fa-sort-down');
icon.classList.add('fa-sort');
});
sortDirection = {};
filteredRows = [...tableConfig.data];
currentPage = 1;
renderTable();
renderPagination();
});
}
// Checkboxes
if (tableConfig.showCheckboxes) {
const selectAll = document.getElementById('selectAll');
if (selectAll) {
selectAll.addEventListener('change', function() {
const checkboxes = document.querySelectorAll('.rowCheckbox');
checkboxes.forEach(checkbox => {
checkbox.checked = this.checked;
});
updateDeleteButtonState();
});
}
document.querySelectorAll('.rowCheckbox').forEach(checkbox => {
checkbox.addEventListener('change', updateDeleteButtonState);
});
}
// Batch Delete
if (tableConfig.showBatchDelete) {
const deleteSelected = document.getElementById('deleteSelected');
if (deleteSelected) {
deleteSelected.addEventListener('click', function() {
if (confirm('Are you sure you want to delete the selected items?')) {
const checkboxes = document.querySelectorAll('.rowCheckbox');
const selectedIds = Array.from(checkboxes)
.filter(cb => cb.checked)
.map(cb => cb.closest('tr').getAttribute('data-id'));
filteredRows = filteredRows.filter(row => !selectedIds.includes(row.id.toString()));
tableConfig.data = tableConfig.data.filter(row => !selectedIds.includes(row.id.toString()));
originalRows = originalRows.filter(row => !selectedIds.includes(row.id.toString()));
const maxPage = Math.ceil(filteredRows.length / rowsPerPage);
if (currentPage > maxPage) {
currentPage = maxPage || 1;
}
renderTable();
renderPagination();
if (selectAll) selectAll.checked = false;
}
});
}
}
// Status
document.querySelectorAll('.status-option').forEach(option => {
option.addEventListener('click', function(e) {
e.preventDefault();
const newStatus = this.getAttribute('data-status');
const row = this.closest('tr');
const userId = row.getAttribute('data-id');
const statusText = row.querySelector('.status-text');
if (statusText) {
statusText.textContent = newStatus;
}
const rowData = filteredRows.find(r => r.id == userId);
if (rowData) {
rowData.status = newStatus;
}
});
});
// Edit
if (tableConfig.showEditModal) {
document.querySelectorAll('.edit-btn').forEach(button => {
button.addEventListener('click', function(e) {
e.preventDefault();
const userId = this.getAttribute('data-id');
const user = filteredRows.find(row => row.id == userId);
if (user) {
tableConfig.columns.forEach(col => {
const input = document.getElementById(`edit${col.key.charAt(0).toUpperCase() + col.key.slice(1)}`);
if (input) {
input.value = user[col.key] || '';
}
});
const modal = new bootstrap.Modal(document.getElementById('editModal'));
modal.show();
}
});
});
const updateBtn = document.getElementById('updateBtn');
if (updateBtn) {
updateBtn.addEventListener('click', function() {
const userId = document.querySelector('.edit-btn[data-id]')?.getAttribute('data-id');
const user = filteredRows.find(row => row.id == userId);
if (user) {
tableConfig.columns.forEach(col => {
const input = document.getElementById(`edit${col.key.charAt(0).toUpperCase() + col.key.slice(1)}`);
if (input && !input.readOnly) {
user[col.key] = input.value;
}
});
}
const modal = bootstrap.Modal.getInstance(document.getElementById('editModal'));
modal.hide();
renderTable();
});
}
}
// View
if (tableConfig.showViewModal) {
document.querySelectorAll('.view-btn').forEach(button => {
button.addEventListener('click', function(e) {
e.preventDefault();
currentRowId = this.getAttribute('data-id');
const user = filteredRows.find(row => row.id == currentRowId);
if (user) {
tableConfig.columns.forEach(col => {
const span = document.getElementById(`view${col.key.charAt(0).toUpperCase() + col.key.slice(1)}`);
if (span) {
span.textContent = user[col.key] || '';
}
});
const modal = new bootstrap.Modal(document.getElementById('viewModal'));
modal.show();
}
});
});
// Activate Account for Locked Account page
if (tableConfig.pageTitle === 'Locked Account') {
const activateAccountBtn = document.getElementById('activateAccountBtn');
if (activateAccountBtn) {
activateAccountBtn.addEventListener('click', function() {
if (currentRowId) {
const user = filteredRows.find(row => row.id == currentRowId);
if (user) {
user.status = 'Active';
}
const modal = bootstrap.Modal.getInstance(document.getElementById('viewModal'));
modal.hide();
renderTable();
currentRowId = null;
}
});
}
}
}
// Delete
document.querySelectorAll('.delete-btn').forEach(button => {
button.addEventListener('click', function() {
const userId = this.getAttribute('data-id');
if (confirm('Are you sure you want to delete this item?')) {
filteredRows = filteredRows.filter(row => row.id != userId);
tableConfig.data = tableConfig.data.filter(row => row.id != userId);
originalRows = originalRows.filter(row => row.id != userId);
const maxPage = Math.ceil(filteredRows.length / rowsPerPage);
if (currentPage > maxPage) {
currentPage = maxPage || 1;
}
renderTable();
renderPagination();
}
});
});
}
function updateDeleteButtonState() {
if (tableConfig.showBatchDelete) {
const checkboxes = document.querySelectorAll('.rowCheckbox');
const checkedCount = Array.from(checkboxes).filter(cb => cb.checked).length;
const deleteButton = document.getElementById('deleteSelected');
if (deleteButton) {
deleteButton.disabled = checkedCount < 2;
}
}
}
renderTable();
renderPagination();
</script>

View File

View File

@ -0,0 +1,247 @@
<!Doctype html>
<html lang="en">
<head>
<!-- Required meta tags -->
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<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">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;500;700;900&display=swap" rel="stylesheet">
<link rel="icon" type="image/png" href="{{ asset('img/favicon_unioil.ico') }}">
<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" />
</head>
<body>
<div class="wrapper">
<div class="body-overlay"></div>
@php
$memberManagement = ['card-member', 'locked-accounts'];
$homePage = ['photo-slider'];
$aboutUs = ['card-types', 'terms-and-privacy'];
$reports = ['registration-report', 'top-up-usage-report', 'mobile-usage-report', 'station-rating-report'];
$stationLocator = ['branches', 'stations', 'fuels'];
@endphp
<!-- Sidebar -->
<nav id="sidebar">
<div class="sidebar-header">
<h3><img src="img/logo.png" class="img-fluid" /><span></span></h3>
</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">
<i class="fa-solid fa-users" style="padding-top:3px"></i><span>User Management</span>
</a>
</li>
<li class="{{ Request::is('notification') ? 'active' : '' }}">
<a href="{{ route('notification') }}" class="dashboard" style="display:flex">
<i class="fa-solid fa-bell" style="padding-top:3px"></i><span>Notifications</span>
</a>
</li>
<!-- Member Management -->
<li class="dropdown {{ in_array(Request::path(), $memberManagement) }}">
<a href="#homeSubmenu1" data-toggle="collapse"
aria-expanded="{{ in_array(Request::path(), $memberManagement) ? 'true' : 'false' }}"
class="dropdown-toggle" style="display:flex">
<i class="fa-solid fa-users-gear" style="padding-top:3px"></i><span>Member Management</span>
</a>
<ul class="collapse list-unstyled menu {{ in_array(Request::path(), $memberManagement) ? 'show' : '' }}"
id="homeSubmenu1">
<li class="{{ Request::is('card-member') ? 'active' : '' }}">
<a href="{{ route('card-member') }}">Card Member</a>
</li>
<li class="{{ Request::is('locked-accounts') ? 'active' : '' }}">
<a href="{{ route('locked-accounts') }}">Locked Accounts</a>
</li>
</ul>
</li>
<!-- Home Page -->
<li class="dropdown {{ in_array(Request::path(), $homePage) }}">
<a href="#pageSubmenu2" data-toggle="collapse"
aria-expanded="{{ in_array(Request::path(), $homePage) ? 'true' : 'false' }}"
class="dropdown-toggle" style="display:flex">
<i class="fa-solid fa-mobile-screen" style="padding-top:3px"></i><span>Home Page (Mobile)</span>
</a>
<ul class="collapse list-unstyled menu {{ in_array(Request::path(), $homePage) ? 'show' : '' }}"
id="pageSubmenu2">
<li class="{{ Request::is('photo-slider') ? 'active' : '' }}">
<a href="{{ route('photo-slider') }}">Photo Slider</a>
</li>
</ul>
</li>
<!-- Static -->
<li class="{{ Request::is('promotions') ? 'active' : '' }}">
<a href="{{ route('promotions') }}" class="dashboard" style="display:flex">
<i class="fa-solid fa-tag" style="padding-top:3px"></i><span>Promotions</span>
</a>
</li>
<li class="{{ Request::is('top-up') ? 'active' : '' }}">
<a href="{{ route('top-up') }}" class="dashboard" style="display:flex">
<i class="fa-solid fa-wallet" style="padding-top:3px"></i><span>Top-Up</span>
</a>
</li>
<!-- About Us -->
<li class="dropdown {{ in_array(Request::path(), $aboutUs) }}">
<a href="#pageSubmenu3" data-toggle="collapse"
aria-expanded="{{ in_array(Request::path(), $aboutUs) ? 'true' : 'false' }}"
class="dropdown-toggle" style="display:flex">
<i class="fa-solid fa-circle-info" style="padding-top:3px"></i><span>About Us</span>
</a>
<ul class="collapse list-unstyled menu {{ in_array(Request::path(), $aboutUs) ? 'show' : '' }}"
id="pageSubmenu3">
<li class="{{ Request::is('card-types') ? 'active' : '' }}">
<a href="{{ route('card-types') }}">Card Types</a>
</li>
<li class="{{ Request::is('terms-and-privacy') ? 'active' : '' }}">
<a href="{{ route('terms-and-privacy') }}">Terms & Privacy</a>
</li>
</ul>
</li>
<!-- Reports -->
<li class="dropdown {{ in_array(Request::path(), $reports) }}">
<a href="#pageSubmenu4" data-toggle="collapse"
aria-expanded="{{ in_array(Request::path(), $reports) ? 'true' : 'false' }}"
class="dropdown-toggle" style="display:flex">
<i class="fa-solid fa-chart-column" style="padding-top:3px"></i><span>Reports</span>
</a>
<ul class="collapse list-unstyled menu {{ in_array(Request::path(), $reports) ? 'show' : '' }}"
id="pageSubmenu4">
<li class="{{ Request::is('registration-report') ? 'active' : '' }}">
<a href="{{ route('registration-report') }}">Registration Report</a>
</li>
<li class="{{ Request::is('top-up-usage-report') ? 'active' : '' }}">
<a href="{{ route('top-up-usage-report') }}">Top-Up Usage Report</a>
</li>
<li class="{{ Request::is('mobile-usage-report') ? 'active' : '' }}">
<a href="{{ route('mobile-usage-report') }}">Mobile Usage Report</a>
</li>
<li class="{{ Request::is('station-rating-report') ? 'active' : '' }}">
<a href="{{ route('station-rating-report') }}">Station Rating Report</a>
</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>
<!-- Station Locator -->
<li class="dropdown {{ in_array(Request::path(), $stationLocator) }}">
<a href="#pageSubmenu5" data-toggle="collapse"
aria-expanded="{{ in_array(Request::path(), $stationLocator) ? 'true' : 'false' }}"
class="dropdown-toggle" style="display:flex">
<i class="fa-solid fa-location-dot" style="padding-top:3px"></i><span>Station Locator</span>
</a>
<ul class="collapse list-unstyled menu {{ in_array(Request::path(), $stationLocator) ? 'show' : '' }}"
id="pageSubmenu5">
<li class="{{ Request::is('branches') ? 'active' : '' }}">
<a href="{{ route('branches') }}">Branches</a>
</li>
<li class="{{ Request::is('stations') ? 'active' : '' }}">
<a href="{{ route('stations') }}">Stations</a>
</li>
<li class="{{ Request::is('fuels') ? 'active' : '' }}">
<a href="{{ route('fuels') }}">Fuels</a>
</li>
</ul>
</li>
</ul>
</nav>
<!-- 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">
<span class="fa-solid fa-arrow-left"></span>
</button>
<button class="d-inline-block d-lg-none ml-auto more-button" type="button"
data-toggle="collapse" data-target="#navbarSupportedContent"
aria-controls="navbarSupportedContent" aria-expanded="false"
aria-label="Toggle navigation">
<i class="fas fa-ellipsis-v"></i>
</button>
<div class="collapse navbar-collapse d-lg-block d-xl-block d-sm-none d-md-none d-none"
id="navbarSupportedContent">
<ul class="nav navbar-nav ml-auto">
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle d-flex align-items-center gap-2" href="#"
role="button" data-toggle="dropdown">
<span style="margin-right:5px">LBTek Systems</span>
<i class="fa-solid fa-user-circle" style="padding-right:5px"></i>
</a>
<ul class="dropdown-menu dropdown-menu-end dropdown-menu-sm">
<li style="margin-right:5px">
<a class="dropdown-item d-flex align-items-center gap-2"
href="{{ route('my-profile') }}">
<i class="fa-solid fa-user" style="font-size:16px; color:gray;"></i>
<span style="margin-left:5px">My Profile</span>
</a>
</li>
<li>
<a class="dropdown-item d-flex align-items-center gap-2"
href="{{ route('login') }}">
<i class="fa-solid fa-right-from-bracket"
style="font-size:16px; color:gray;"></i>
<span style="margin-left:5px">Logout</span>
</a>
</li>
</ul>
</li>
</ul>
</div>
</div>
</nav>
</div>
<div class="main-content container-xxl">
<div class="row">
<div class="col-12">
<div class="card" style="min-height: 500px;">
<div class="card-header">
@yield('content')
</div>
</div>
</div>
</div>
</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>
<script src="js/popper.min.js"></script>
<script src="js/bootstrap.min.js"></script>
<script src="js/jquery-3.3.1.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$('#sidebarCollapse').on('click', function() {
$('#sidebar').toggleClass('active');
$('#content').toggleClass('active');
});
$('.more-button,.body-overlay').on('click', function() {
$('#sidebar,.body-overlay').toggleClass('show-nav');
});
});
</script>
</body>
</html>

View File

@ -0,0 +1,34 @@
<!DOCTYPE html>
<html lang="{{ str_replace('_', '-', app()->getLocale()) }}">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Login - Laravel</title>
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-QWTKZyjpPEjISv5WaRU9OFeRpok6YctnYmDr5pNlyT2bRjXh0JMhjY6hW+ALEwIH" crossorigin="anonymous">
<link href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.css" rel="stylesheet">
<link rel="icon" type="image/png" href="{{ asset('img/favicon_unioil.ico') }}">
<link rel="icon" type="image/png" href="{{ asset('img/favicon_unioil.ico') }}">
</head>
<body>
<div class="min-vh-100 d-flex">
<!-- Sider -->
<div class="col-md-6 d-none d-md-block" style="background: url('/img/bg_cms.png') center / cover no-repeat;"></div>
<!-- Content and Footer -->
<div class="col-md-6 d-flex flex-column justify-content-between">
<div class="p-4 flex-grow-1">
@yield('content')
</div>
<footer class="text-center py-3" style="font-size: 12px;">
<div class="mx-auto px-0 py-4" style="width: 325px; border-top: 1px solid #e0e0e0; text-align: left; color: #8E8E93;">
By logging in you agree to Unioil's Terms of Service, <br>Privacy Policy and Content Policies.
</div>
</footer>
</div>
</div>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js" integrity="sha384-YvpcrYf0tY3lHB60NNkmXc5s9fDVZLESaAA55NDzOxhy9GkcIdslK1eN7N6jIeHz" crossorigin="anonymous"></script>
</body>
</html>

View File

@ -0,0 +1,64 @@
@extends('layouts.login')
@section('content')
<div class="container py-5">
<div class="row justify-content-center">
<div class="col-12 col-md-6">
<img src="{{ asset('img/logo.png') }}" alt="Unioil Logo" class="img-fluid" style="max-width: 150px;">
<div class="mb-3 text-center">
<h4 class="mb-1 fw-bold">Welcome</h4>
<span style="font-size: 14px;" class="text-muted">Sign in to continue</span>
</div>
<form>
<div class="mb-3">
<label class="form-label fw-semibold" style="font-size: 13px; color: #003366;">Enter
Username</label>
<input type="text" class="form-control" placeholder="Username">
</div>
<!-- Mockup password input -->
<div class="mb-3">
<label class="form-label fw-semibold text-primary"
style="font-size: 13px; color: #003366 !important;">Enter Password</label>
<input type="password" class="form-control" placeholder="Password">
</div>
<div class="row mt-4">
<div class="col-6">
<a href="#" class="text-decoration-none text-primary">Forgot Username</a>
</div>
<div class="col-6 text-end">
<a href="{{ url('/my-profile') }}" class="btn btn-primary w-100"
style="background-color: #E74610; border-color: #E74610;">
Login
</a>
</div>
</div>
</form>
<!-- Modal Simulation -->
<!-- <div class="modal fade show d-block mt-5" tabindex="-1" style="background-color: rgba(0,0,0,0.3); display: none;">
<div class="modal-dialog modal-dialog-centered" style="max-width: 337px;">
<div class="modal-content">
<div class="modal-body">
<h4>Forgot Password</h4>
<p>
To have your password reset, please contact <br>
Unioil's admin at <a href="mailto:admin@unioil.com" class="text-primary">admin@unioil.com</a>
</p>
</div>
<div class="modal-footer justify-content-end">
<button class="btn btn-primary" style="background-color: #E74610; border-color: #E74610; width: 64px;">Ok</button>
</div>
</div>
</div>
</div> -->
</div>
</div>
</div>
@endsection

View File

@ -0,0 +1,125 @@
@extends('layouts.app')
@section('page_title', 'Card Types')
@section('content')
@php
$cardTypes = [
[
'id' => 1,
'cardCode' => 'VISA01',
'cardTypeDescription' => 'Visa Platinum Card',
'cardTypeShortDescription' => 'Premium Visa card',
'cardTypeImage' => '',
'virtualCardFontColor' => 'White',
'cardTypeCoverImage' => '',
'idNumberRequired' => 'Yes',
'idNumberDescription' => 'Government-issued ID required',
'termsAndConditions' => 'Valid for 5 years. Annual fee applies.',
'faqs' => 'Q: What is the credit limit? A: Up to $10,000.'
],
[
'id' => 2,
'cardCode' => 'MC02',
'cardTypeDescription' => 'MasterCard Gold',
'cardTypeShortDescription' => 'Gold MasterCard',
'cardTypeImage' => '',
'virtualCardFontColor' => 'Black',
'cardTypeCoverImage' => '',
'idNumberRequired' => 'No',
'idNumberDescription' => '',
'termsAndConditions' => 'No annual fee for first year.',
'faqs' => 'Q: Can I use it abroad? A: Yes, globally accepted.'
],
[
'id' => 3,
'cardCode' => 'AMEX03',
'cardTypeDescription' => 'Amex Rewards Card',
'cardTypeShortDescription' => 'Amex Rewards',
'cardTypeImage' => '',
'virtualCardFontColor' => 'White',
'cardTypeCoverImage' => '',
'idNumberRequired' => 'Yes',
'idNumberDescription' => 'Passport or drivers license',
'termsAndConditions' => 'Earn 2x points on travel.',
'faqs' => 'Q: How to redeem points? A: Via app.'
],
[
'id' => 4,
'cardCode' => 'VISA04',
'cardTypeDescription' => 'Visa Classic Card',
'cardTypeShortDescription' => 'Basic Visa card',
'cardTypeImage' => '',
'virtualCardFontColor' => 'Black',
'cardTypeCoverImage' => '',
'idNumberRequired' => 'No',
'idNumberDescription' => '',
'termsAndConditions' => 'Standard rates apply.',
'faqs' => 'Q: Is there a fee? A: No hidden fees.'
],
[
'id' => 5,
'cardCode' => 'MC05',
'cardTypeDescription' => 'MasterCard Premium',
'cardTypeShortDescription' => 'Premium MasterCard',
'cardTypeImage' => '',
'virtualCardFontColor' => 'White',
'cardTypeCoverImage' => '',
'idNumberRequired' => 'Yes',
'idNumberDescription' => 'ID for verification',
'termsAndConditions' => 'Free lounge access.',
'faqs' => 'Q: Lounge access? A: At major airports.'
],
[
'id' => 6,
'cardCode' => 'AMEX06',
'cardTypeDescription' => 'Amex Business Card',
'cardTypeShortDescription' => 'Business Amex',
'cardTypeImage' => '',
'virtualCardFontColor' => 'Black',
'cardTypeCoverImage' => '',
'idNumberRequired' => 'No',
'idNumberDescription' => '',
'termsAndConditions' => 'For business expenses.',
'faqs' => 'Q: Tax benefits? A: Consult accountant.'
]
];
@endphp
@include('components.table-component', [
'pageTitle' => 'Card Types',
'data' => $cardTypes,
'columns' => [
['name' => 'Card Type Code', 'key' => 'cardCode', 'sortable' => true],
['name' => 'Card Type Description', 'key' => 'cardTypeDescription', 'sortable' => true]
],
'allFields' => [
['name' => 'Card Code', 'key' => 'cardCode', 'type' => 'text', 'required' => true],
['name' => 'Card Type Description', 'key' => 'cardTypeDescription', 'type' => 'text', 'required' => true],
['name' => 'Card Type Short Description', 'key' => 'cardTypeShortDescription', 'type' => 'text', 'required' => true],
['name' => 'Card Type Image', 'key' => 'cardTypeImage', 'type' => 'file'],
['name' => 'Virtual Card Font Color', 'key' => 'virtualCardFontColor', 'type' => 'select', 'options' => ['White', 'Black'], 'required' => true],
['name' => 'Card Type Cover Image', 'key' => 'cardTypeCoverImage', 'type' => 'file'],
['name' => 'ID Number Required?', 'key' => 'idNumberRequired', 'type' => 'select', 'options' => ['Yes', 'No'], 'required' => true],
['name' => 'ID Number Description', 'key' => 'idNumberDescription', 'type' => 'text'],
['name' => 'Terms and Conditions', 'key' => 'termsAndConditions', 'type' => 'textarea', 'required' => true],
['name' => 'FAQs', 'key' => 'faqs', 'type' => 'textarea', 'required' => true]
],
'actions' => ['edit', 'view', 'delete'],
'showAddButton' => true,
'addButtonUrl' => '/add-card-types',
'showCheckboxes' => true,
'showBatchDelete' => true,
'showEditModal' => true,
'showViewModal' => true
])
<script>
const storedCardTypes = JSON.parse(sessionStorage.getItem('cardTypes') || '[]');
if (storedCardTypes.length > 0) {
tableConfig.data = [...tableConfig.data, ...storedCardTypes];
renderTable();
renderPagination();
}
</script>
@endsection

View File

@ -0,0 +1,76 @@
@extends('layouts.app')
@section('page_title', 'Terms and Privacy')
@section('content')
@php
$termsAndPrivacy = [
[
'id' => 1,
'title' => 'User Agreement',
'details' => 'Users must agree to use the platform responsibly and comply with all applicable laws.',
'type' => 'Terms'
],
[
'id' => 2,
'title' => 'Privacy Policy',
'details' => 'We collect personal data to improve services, with consent, and protect user information.',
'type' => 'Privacy'
],
[
'id' => 3,
'title' => 'Service Terms',
'details' => 'Details on how services are provided, including limitations and user obligations.',
'type' => 'Terms'
],
[
'id' => 4,
'title' => 'Data Protection',
'details' => 'Our commitment to GDPR compliance and secure data handling practices.',
'type' => 'Privacy'
],
[
'id' => 5,
'title' => 'Refund Policy',
'details' => 'Conditions under which refunds are issued for services or subscriptions.',
'type' => 'Terms'
],
[
'id' => 6,
'title' => 'Cookie Policy',
'details' => 'How we use cookies to enhance user experience and track site usage.',
'type' => 'Privacy'
]
];
@endphp
@include('components.table-component', [
'pageTitle' => 'Terms and Privacy',
'data' => $termsAndPrivacy,
'columns' => [
['name' => 'Title', 'key' => 'title', 'sortable' => true],
['name' => 'Details', 'key' => 'details', 'sortable' => true],
['name' => 'Type', 'key' => 'type', 'sortable' => true]
],
'allFields' => [
['name' => 'Title', 'key' => 'title', 'type' => 'text', 'required' => true],
['name' => 'Details', 'key' => 'details', 'type' => 'textarea', 'required' => true]
],
'actions' => ['edit', 'view', 'delete'],
'showAddButton' => true,
'addButtonUrl' => '/add-terms-and-privacy',
'showCheckboxes' => true,
'showBatchDelete' => true,
'showEditModal' => true,
'showViewModal' => true
])
<script>
const storedTerms = JSON.parse(sessionStorage.getItem('termsAndPrivacy') || '[]');
if (storedTerms.length > 0) {
tableConfig.data = [...tableConfig.data, ...storedTerms];
renderTable();
renderPagination();
}
</script>
@endsection

View File

@ -0,0 +1,83 @@
@extends('layouts.app')
@section('page_title', 'Add Branch')
@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 Branch</h5>
</div>
<div class="row justify-content-center">
<div class="card-body p-3">
<form id="addBranchForm">
<div class="mb-3">
<label for="branchCode" class="form-label">Branch Code</label>
<input type="text" class="form-control" id="branchCode" placeholder="Enter branch code" required>
</div>
<div class="mb-3">
<label for="branchName" class="form-label">Branch Name</label>
<input type="text" class="form-control" id="branchName" placeholder="Enter branch name" required>
</div>
<div class="mb-3">
<label for="details" class="form-label">Details</label>
<textarea class="form-control" id="details" rows="6" placeholder="Enter details" required></textarea>
</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 Branch</button>
</div>
</form>
</div>
</div>
<style>
.card {
border-radius: 5px;
border: 1px solid #dee2e6;
}
.form-label {
font-size: 0.95rem;
}
.form-control,
textarea.form-control {
font-size: 0.9rem;
width: 100%;
}
</style>
<script>
document.getElementById('addBranchForm').addEventListener('submit', function(e) {
e.preventDefault();
const branchCode = document.getElementById('branchCode').value;
const branchName = document.getElementById('branchName').value;
const details = document.getElementById('details').value;
if (!branchCode || !branchName || !details) {
alert('Please fill out all required fields.');
return;
}
const currentDate = new Date().toISOString().split('T')[0]; // e.g., "2025-04-15"
const newBranch = {
id: Date.now(),
branchCode,
branchName,
details,
dateCreated: currentDate,
createdBy: 'Admin',
dateModified: currentDate
};
let branches = JSON.parse(sessionStorage.getItem('branches') || '[]');
branches.push(newBranch);
sessionStorage.setItem('branches', JSON.stringify(branches));
alert('Branch added successfully!');
window.location.href = '/branches';
});
document.querySelector('.btn-outline-secondary').addEventListener('click', function() {
window.location.href = '/branches';
});
</script>
@endsection

View File

@ -0,0 +1,131 @@
@extends('layouts.app')
@section('page_title', 'Add Card Type')
@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 Card Type</h5>
</div>
<div class="row justify-content-center">
<div class="card-body p-3">
<form id="addCardTypeForm">
<div class="mb-3">
<label for="cardCode" class="form-label">Card Code</label>
<input type="text" class="form-control" id="cardCode" placeholder="Enter card code" required>
</div>
<div class="mb-3">
<label for="cardTypeDescription" class="form-label">Card Type Description</label>
<input type="text" class="form-control" id="cardTypeDescription" placeholder="Enter description" required>
</div>
<div class="mb-3">
<label for="cardTypeShortDescription" class="form-label">Card Type Short Description</label>
<input type="text" class="form-control" id="cardTypeShortDescription" placeholder="Enter short description" required>
</div>
<div class="mb-3">
<label for="cardTypeImage" class="form-label">Upload Card Type Image</label>
<input type="file" class="form-control" id="cardTypeImage" accept=".jpg,.jpeg,.png">
</div>
<div class="mb-3">
<label for="virtualCardFontColor" class="form-label">Virtual Card Font Color</label>
<select class="form-select" id="virtualCardFontColor" required>
<option value="" disabled selected>Select font color</option>
<option value="White">White</option>
<option value="Black">Black</option>
</select>
</div>
<div class="mb-3">
<label for="cardTypeCoverImage" class="form-label">Upload Card Type Cover Image</label>
<input type="file" class="form-control" id="cardTypeCoverImage" accept=".jpg,.jpeg,.png">
</div>
<div class="mb-3">
<label for="idNumberRequired" class="form-label">ID Number Required?</label>
<select class="form-select" id="idNumberRequired" required>
<option value="" disabled selected>Select option</option>
<option value="Yes">Yes</option>
<option value="No">No</option>
</select>
</div>
<div class="mb-3">
<label for="idNumberDescription" class="form-label">ID Number Description</label>
<input type="text" class="form-control" id="idNumberDescription" placeholder="Enter ID description">
</div>
<div class="mb-3">
<label for="termsAndConditions" class="form-label">Terms and Conditions</label>
<textarea class="form-control" id="termsAndConditions" rows="4" placeholder="Enter terms and conditions" required></textarea>
</div>
<div class="mb-3">
<label for="faqs" class="form-label">FAQs</label>
<textarea class="form-control" id="faqs" rows="4" placeholder="Enter FAQs" required></textarea>
</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 Card Type</button>
</div>
</form>
</div>
</div>
<style>
.card {
border-radius: 5px;
border: 1px solid #dee2e6;
}
.form-label {
font-size: 0.95rem;
}
.form-control,
.form-select,
textarea.form-control {
font-size: 0.9rem;
width: 100%;
}
</style>
<script>
document.getElementById('addCardTypeForm').addEventListener('submit', function(e) {
e.preventDefault();
const cardCode = document.getElementById('cardCode').value;
const cardTypeDescription = document.getElementById('cardTypeDescription').value;
const cardTypeShortDescription = document.getElementById('cardTypeShortDescription').value;
const cardTypeImage = document.getElementById('cardTypeImage').files[0]?.name || '';
const virtualCardFontColor = document.getElementById('virtualCardFontColor').value;
const cardTypeCoverImage = document.getElementById('cardTypeCoverImage').files[0]?.name || '';
const idNumberRequired = document.getElementById('idNumberRequired').value;
const idNumberDescription = document.getElementById('idNumberDescription').value;
const termsAndConditions = document.getElementById('termsAndConditions').value;
const faqs = document.getElementById('faqs').value;
if (!cardCode || !cardTypeDescription || !cardTypeShortDescription ||
!virtualCardFontColor || !idNumberRequired || !termsAndConditions || !faqs) {
alert('Please fill out all required fields.');
return;
}
const newCardType = {
id: Date.now(),
cardCode,
cardTypeDescription,
cardTypeShortDescription,
cardTypeImage,
virtualCardFontColor,
cardTypeCoverImage,
idNumberRequired,
idNumberDescription,
termsAndConditions,
faqs
};
let cardTypes = JSON.parse(sessionStorage.getItem('cardTypes') || '[]');
cardTypes.push(newCardType);
sessionStorage.setItem('cardTypes', JSON.stringify(cardTypes));
alert('Card Type added successfully!');
window.location.href = '/card-types';
});
document.querySelector('.btn-outline-secondary').addEventListener('click', function() {
window.location.href = '/card-types';
});
</script>
@endsection

View File

@ -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

View File

@ -0,0 +1,135 @@
@extends('layouts.app')
@section('page_title', 'Add Notification')
@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 Notification</h5>
</div>
<div class="row justify-content-center">
<div class="card-body px-3 pb-4">
<form id="addNotificationForm">
<div class="row">
<div class="col-12 mb-4">
<label for="subject" class="form-label">Subject</label>
<input type="text" class="form-control w-100" id="subject" placeholder="Enter notification subject" required>
</div>
<div class="col-12 mb-4">
<label for="content" class="form-label">Content</label>
<textarea class="form-control w-100" id="content" rows="3" placeholder="Enter notification content" required></textarea>
</div>
<div class="col-12 mb-4">
<label for="isScheduled" class="form-label">Is Scheduled</label>
<select class="form-select w-100" id="isScheduled" required>
<option value="" disabled selected>Select option</option>
<option value="Yes">Yes</option>
<option value="No">No</option>
</select>
</div>
</div>
<div class="d-flex justify-content-end mt-4">
<button type="button" class="btn btn-outline-secondary me-2 px-4" style="margin-right:5px">Cancel</button>
<button type="submit" class="btn btn-primary px-4">Add Notification</button>
</div>
</form>
</div>
</div>
<style>
.card {
border-radius: 10px;
font-family: 'Roboto', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
border: 1px solid #dee2e6;
}
.card-header {
background-color: transparent;
}
.form-label {
font-weight: 500;
font-size: 0.95rem;
color: #343a40;
}
.form-control,
.form-select {
font-size: 0.9rem;
border-radius: 5px;
border: 1px solid #ced4da;
transition: border-color 0.2s, box-shadow 0.2s;
}
.form-control:focus,
.form-select:focus {
border-color: #E74610;
box-shadow: 0 0 0 0.2rem rgba(231, 70, 16, 0.25);
}
textarea.form-control {
resize: vertical;
min-height: 60px;
}
.btn-primary {
background-color: #E74610;
border-color: #E74610;
font-size: 0.9rem;
transition: background-color 0.2s;
}
.btn-primary:hover {
background-color: #c63d0e;
border-color: #c63d0e;
}
.btn-outline-secondary {
font-size: 0.9rem;
border-color: #6c757d;
transition: background-color 0.2s;
}
.btn-outline-secondary:hover {
background-color: #f8f9fa;
border-color: #6c757d;
}
.container {
max-width: 1400px;
}
</style>
<script>
document.getElementById('addNotificationForm').addEventListener('submit', function(e) {
e.preventDefault();
const subject = document.getElementById('subject').value;
const content = document.getElementById('content').value;
const isScheduled = document.getElementById('isScheduled').value;
if (!subject || !content || !isScheduled) {
alert('Please fill out all fields.');
return;
}
// Simulate adding notification (frontend-only)
const newNotification = {
id: Date.now(),
subject: subject,
content: content,
isScheduled: isScheduled === 'Yes' ? 'Scheduled' : 'Not Scheduled',
schedule: isScheduled === 'Yes' ? new Date().toISOString().slice(0, 16).replace('T', ' ') : '',
expiration: new Date(Date.now() + 7 * 24 * 60 * 60 * 1000).toISOString().slice(0, 16).replace('T', ' ')
};
// Store in sessionStorage
let notifications = JSON.parse(sessionStorage.getItem('notifications') || '[]');
notifications.push(newNotification);
sessionStorage.setItem('notifications', JSON.stringify(notifications));
alert('Notification added successfully!');
window.location.href = '/notification';
});
// Cancel button click handler
document.querySelector('.btn-outline-secondary').addEventListener('click', function() {
window.location.href = '/notification';
});
</script>
@endsection

View File

@ -0,0 +1,99 @@
@extends('layouts.app')
@section('page_title', 'Add Photo Slider')
@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 Photo Slider</h5>
</div>
<div class="row justify-content-center">
<div class="card-body p-3">
<form id="addPhotoSliderForm">
<div class="mb-3">
<label for="title" class="form-label">Title</label>
<input type="text" class="form-control" id="title" placeholder="Enter title" required>
</div>
<div class="mb-3">
<label for="type" class="form-label">Type</label>
<select class="form-select" id="type" required>
<option value="" disabled selected>Select type</option>
<option value="Banner">Banner</option>
<option value="Carousel">Carousel</option>
<option value="Slider">Slider</option>
</select>
</div>
<div class="mb-3">
<label for="startDate" class="form-label">Start Date</label>
<input type="date" class="form-control" id="startDate" required>
</div>
<div class="mb-3">
<label for="endDate" class="form-label">End Date</label>
<input type="date" class="form-control" id="endDate" 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 Photo Slider</button>
</div>
</form>
</div>
</div>
<style>
.card {
border-radius: 5px;
border: 1px solid #dee2e6;
}
.form-label {
font-size: 0.95rem;
}
.form-control,
.form-select {
font-size: 0.9rem;
width: 100%;
}
</style>
<script>
document.getElementById('addPhotoSliderForm').addEventListener('submit', function(e) {
e.preventDefault();
const title = document.getElementById('title').value;
const type = document.getElementById('type').value;
const startDate = document.getElementById('startDate').value;
const endDate = document.getElementById('endDate').value;
if (!title || !type || !startDate || !endDate) {
alert('Please fill out all fields.');
return;
}
// Simulate adding photo slider (frontend-only)
const newSlider = {
id: Date.now(),
title: title,
type: type,
startDate: startDate,
endDate: endDate
};
// Store in sessionStorage
let sliders = JSON.parse(sessionStorage.getItem('sliders') || '[]');
sliders.push(newSlider);
sessionStorage.setItem('sliders', JSON.stringify(sliders));
alert('Photo Slider added successfully!');
window.location.href = '/photo-slider';
});
// Cancel button click handler
document.querySelector('.btn-outline-secondary').addEventListener('click', function() {
window.location.href = '/photo-slider';
});
</script>
@endsection

View File

@ -0,0 +1,104 @@
@extends('layouts.app')
@section('page_title', 'Add Promotion')
@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 Promotion</h5>
</div>
<div class="row justify-content-center">
<div class="card-body p-3">
<form id="addPromotionForm">
<div class="mb-3">
<label for="title" class="form-label">Title</label>
<input type="text" class="form-control" id="title" placeholder="Enter title" required>
</div>
<div class="mb-3">
<label for="type" class="form-label">Type</label>
<select class="form-select" id="type" required>
<option value="" disabled selected>Select type</option>
<option value="Discount">Discount</option>
<option value="Flash Sale">Flash Sale</option>
<option value="Reward">Reward</option>
<option value="Bundle">Bundle</option>
</select>
</div>
<div class="mb-3">
<label for="startDate" class="form-label">Start Date</label>
<input type="date" class="form-control" id="startDate" required>
</div>
<div class="mb-3">
<label for="endDate" class="form-label">End Date</label>
<input type="date" class="form-control" id="endDate" required>
</div>
<div class="mb-3">
<label for="status" class="form-label">Status</label>
<select class="form-select" id="status" required>
<option value="" disabled selected>Select status</option>
<option value="Done">Done</option>
<option value="On Going">On Going</option>
</select>
</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 Promotion</button>
</div>
</form>
</div>
</div>
<style>
.card {
border-radius: 5px;
border: 1px solid #dee2e6;
}
.form-label {
font-size: 0.95rem;
}
.form-control,
.form-select {
font-size: 0.9rem;
width: 100%;
}
</style>
<script>
document.getElementById('addPromotionForm').addEventListener('submit', function(e) {
e.preventDefault();
const title = document.getElementById('title').value;
const type = document.getElementById('type').value;
const startDate = document.getElementById('startDate').value;
const endDate = document.getElementById('endDate').value;
const status = document.getElementById('status').value;
if (!title || !type || !startDate || !endDate || !status) {
alert('Please fill out all fields.');
return;
}
// Simulate adding promotion (frontend-only)
const newPromotion = {
id: Date.now(),
title: title,
type: type,
startDate: startDate,
endDate: endDate,
status: status
};
// Store in sessionStorage
let promotions = JSON.parse(sessionStorage.getItem('promotions') || '[]');
promotions.push(newPromotion);
sessionStorage.setItem('promotions', JSON.stringify(promotions));
alert('Promotion added successfully!');
window.location.href = '/promotions';
});
// Cancel button click handler
document.querySelector('.btn-outline-secondary').addEventListener('click', function() {
window.location.href = '/promotions';
});
</script>
@endsection

View File

@ -0,0 +1,86 @@
@extends('layouts.app')
@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>
<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

View File

@ -0,0 +1,84 @@
@extends('layouts.app')
@section('page_title', 'Add Terms and Privacy')
@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 Terms and Privacy</h5>
</div>
<div class="row justify-content-center">
<div class="card-body p-3">
<form id="addTermsAndPrivacyForm">
<div class="mb-3">
<label for="title" class="form-label">Title</label>
<input type="text" class="form-control" id="title" placeholder="Enter title" required>
</div>
<div class="mb-3">
<label for="details" class="form-label">Details</label>
<textarea class="form-control" id="details" rows="6" placeholder="Enter details" required></textarea>
</div>
<div class="mb-3">
<label for="type" class="form-label">Type</label>
<select class="form-select" id="type" required>
<option value="" disabled selected>Select type</option>
<option value="Terms">Terms</option>
<option value="Privacy">Privacy</option>
</select>
</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 Terms and Privacy</button>
</div>
</form>
</div>
</div>
<style>
.card {
border-radius: 5px;
border: 1px solid #dee2e6;
}
.form-label {
font-size: 0.95rem;
}
.form-control,
.form-select,
textarea.form-control {
font-size: 0.9rem;
width: 100%;
}
</style>
<script>
document.getElementById('addTermsAndPrivacyForm').addEventListener('submit', function(e) {
e.preventDefault();
const title = document.getElementById('title').value;
const details = document.getElementById('details').value;
const type = document.getElementById('type').value;
if (!title || !details || !type) {
alert('Please fill out all required fields.');
return;
}
const newTerm = {
id: Date.now(),
title,
details,
type
};
let termsAndPrivacy = JSON.parse(sessionStorage.getItem('termsAndPrivacy') || '[]');
termsAndPrivacy.push(newTerm);
sessionStorage.setItem('termsAndPrivacy', JSON.stringify(termsAndPrivacy));
alert('Terms and Privacy added successfully!');
window.location.href = '/terms-and-privacy';
});
document.querySelector('.btn-outline-secondary').addEventListener('click', function() {
window.location.href = '/terms-and-privacy';
});
</script>
@endsection

View File

@ -0,0 +1,93 @@
@extends('layouts.app')
@section('page_title', 'Add Top-Up')
@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 Top-Up</h5>
</div>
<div class="row justify-content-center">
<div class="card-body p-3">
<form id="addTopUpForm">
<div class="mb-3">
<label for="freeCode" class="form-label">Free Code</label>
<input type="text" class="form-control" id="freeCode" placeholder="Enter free code" required>
</div>
<div class="mb-3">
<label for="name" class="form-label">Name</label>
<input type="text" class="form-control" id="name" placeholder="Enter name" required>
</div>
<div class="mb-3">
<label for="value" class="form-label">Value</label>
<input type="number" class="form-control" id="value" placeholder="Enter value" step="0.01" required>
</div>
<div class="mb-3">
<label for="type" class="form-label">Type</label>
<select class="form-select" id="type" required>
<option value="" disabled selected>Select type</option>
<option value="Prepaid">Prepaid</option>
<option value="Postpaid">Postpaid</option>
<option value="Bonus">Bonus</option>
</select>
</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 Top-Up</button>
</div>
</form>
</div>
</div>
<style>
.card {
border-radius: 5px;
border: 1px solid #dee2e6;
}
.form-label {
font-size: 0.95rem;
}
.form-control,
.form-select {
font-size: 0.9rem;
width: 100%;
}
</style>
<script>
document.getElementById('addTopUpForm').addEventListener('submit', function(e) {
e.preventDefault();
const freeCode = document.getElementById('freeCode').value;
const name = document.getElementById('name').value;
const value = document.getElementById('value').value;
const type = document.getElementById('type').value;
if (!freeCode || !name || !value || !type) {
alert('Please fill out all fields.');
return;
}
// Simulate adding top-up (frontend-only)
const newTopUp = {
id: Date.now(),
freeCode: freeCode,
name: name,
value: value,
type: type
};
// Store in sessionStorage
let topups = JSON.parse(sessionStorage.getItem('topups') || '[]');
topups.push(newTopUp);
sessionStorage.setItem('topups', JSON.stringify(topups));
alert('Top-Up added successfully!');
window.location.href = '/top-up';
});
// Cancel button click handler
document.querySelector('.btn-outline-secondary').addEventListener('click', function() {
window.location.href = '/top-up';
});
</script>
@endsection

View File

@ -0,0 +1,80 @@
@extends('layouts.app')
@section('page_title', 'Photo Slider')
@section('content')
@php
$sliders = [
[
'id' => 1,
'title' => 'Homepage Banner',
'type' => 'Banner',
'startDate' => '2025-04-10',
'endDate' => '2025-04-20'
],
[
'id' => 2,
'title' => 'Product Carousel',
'type' => 'Carousel',
'startDate' => '2025-04-15',
'endDate' => '2025-04-25'
],
[
'id' => 3,
'title' => 'Seasonal Promo',
'type' => 'Banner',
'startDate' => '2025-04-20',
'endDate' => '2025-05-01'
],
[
'id' => 4,
'title' => 'Flash Sale Slider',
'type' => 'Slider',
'startDate' => '2025-04-22',
'endDate' => '2025-04-24'
],
[
'id' => 5,
'title' => 'New Arrivals',
'type' => 'Carousel',
'startDate' => '2025-04-25',
'endDate' => '2025-05-05'
],
[
'id' => 6,
'title' => 'Event Highlight',
'type' => 'Banner',
'startDate' => '2025-04-30',
'endDate' => '2025-05-10'
]
];
@endphp
@include('components.table-component', [
'pageTitle' => 'Photo Slider',
'data' => $sliders,
'columns' => [
['name' => 'Title', 'key' => 'title', 'sortable' => true],
['name' => 'Type', 'key' => 'type', 'sortable' => true],
['name' => 'Start Date', 'key' => 'startDate', 'sortable' => true],
['name' => 'End Date', 'key' => 'endDate', 'sortable' => true]
],
'actions' => ['edit', 'view', 'delete'],
'showAddButton' => true,
'addButtonUrl' => '/add-photo-slider',
'showCheckboxes' => true,
'showBatchDelete' => true,
'showEditModal' => true,
'showViewModal' => true
])
<script>
const storedSliders = JSON.parse(sessionStorage.getItem('sliders') || '[]');
if (storedSliders.length > 0) {
const tableConfig = window.tableConfig || {};
tableConfig.data = [...tableConfig.data, ...storedSliders];
window.renderTable();
window.renderPagination();
}
</script>
@endsection

View File

@ -0,0 +1,33 @@
@extends('layouts.app')
@section('page_title', 'Card Member')
@section('content')
@php
$members = [
['id' => 1, 'cardNumber' => '1234-5678-9012-3456', 'firstName' => 'John', 'lastName' => 'Doe', 'birthday' => '1990-05-15', 'cardType' => 'Gold', 'status' => 'Active'],
['id' => 2, 'cardNumber' => '9876-5432-1098-7654', 'firstName' => 'Jane', 'lastName' => 'Smith', 'birthday' => '1985-11-22', 'cardType' => 'Silver', 'status' => 'Inactive'],
['id' => 3, 'cardNumber' => '4567-8901-2345-6789', 'firstName' => 'Alice', 'lastName' => 'Johnson', 'birthday' => '1992-03-10', 'cardType' => 'Platinum', 'status' => 'Active'],
['id' => 4, 'cardNumber' => '3210-9876-5432-1098', 'firstName' => 'Bob', 'lastName' => 'Brown', 'birthday' => '1988-07-30', 'cardType' => 'Gold', 'status' => 'Active']
];
@endphp
@include('components.table-component', [
'pageTitle' => 'Card Member',
'data' => $members,
'columns' => [
['name' => 'Card Number', 'key' => 'cardNumber', 'sortable' => true],
['name' => 'First Name', 'key' => 'firstName', 'sortable' => true],
['name' => 'Last Name', 'key' => 'lastName', 'sortable' => true],
['name' => 'Birthday', 'key' => 'birthday', 'sortable' => true],
['name' => 'Card Type', 'key' => 'cardType', 'sortable' => true],
['name' => 'Status', 'key' => 'status', 'sortable' => true]
],
'actions' => ['view'],
'showAddButton' => false,
'showCheckboxes' => false,
'showBatchDelete' => false,
'showEditModal' => false,
'showViewModal' => true
])
@endsection

View File

@ -0,0 +1,33 @@
@extends('layouts.app')
@section('page_title', 'Locked Account')
@section('content')
@php
$members = [
['id' => 1, 'cardNumber' => '1234-5678-9012-3456', 'firstName' => 'John', 'lastName' => 'Doe', 'birthday' => '1990-05-15', 'cardType' => 'Gold', 'status' => 'Inactive'],
['id' => 2, 'cardNumber' => '9876-5432-1098-7654', 'firstName' => 'Jane', 'lastName' => 'Smith', 'birthday' => '1985-11-22', 'cardType' => 'Silver', 'status' => 'Inactive'],
['id' => 3, 'cardNumber' => '4567-8901-2345-6789', 'firstName' => 'Alice', 'lastName' => 'Johnson', 'birthday' => '1992-03-10', 'cardType' => 'Platinum', 'status' => 'Inactive'],
['id' => 4, 'cardNumber' => '3210-9876-5432-1098', 'firstName' => 'Bob', 'lastName' => 'Brown', 'birthday' => '1988-07-30', 'cardType' => 'Gold', 'status' => 'Inactive']
];
@endphp
@include('components.table-component', [
'pageTitle' => 'Locked Account',
'data' => $members,
'columns' => [
['name' => 'Card Number', 'key' => 'cardNumber', 'sortable' => true],
['name' => 'First Name', 'key' => 'firstName', 'sortable' => true],
['name' => 'Last Name', 'key' => 'lastName', 'sortable' => true],
['name' => 'Birthday', 'key' => 'birthday', 'sortable' => true],
['name' => 'Card Type', 'key' => 'cardType', 'sortable' => true],
['name' => 'Status', 'key' => 'status', 'sortable' => true]
],
'actions' => ['view'],
'showAddButton' => false,
'showCheckboxes' => false,
'showBatchDelete' => false,
'showEditModal' => false,
'showViewModal' => true
])
@endsection

View File

@ -0,0 +1,130 @@
@extends('layouts.app')
@section('page_title', 'My Profile')
@section('content')
<div class="card w-100">
<!-- Banner -->
<div class="banner d-flex align-items-center p-3">
<div class="banner-icon me-3">
<i class="fas fa-user-circle" style="font-size: 40px; color: #6c757d;"></i>
</div>
<h4 class="fw-bold text-primary mb-0" style="margin-left:10px">LBTek Systems</h4>
</div>
<!-- Profile Section -->
<div class="card-body p-4">
<div class="row">
<!-- Profile Information -->
<div class="col-md-9">
<h3 class="fw-bold mb-3" style="font-size: 20px; font-weight:400">My Information</h3>
<div class="mb-2">
<span class="fw-bold text-dark">Username: </span>
<span>lbteksupport</span>
</div>
<div class="mb-2">
<span class="fw-bold text-dark">Email: </span>
<a href="mailto:support@lbteksystems.com" class="text-primary">support@lbteksystems.com</a>
</div>
<div>
<span class="fw-bold text-dark">Access Role: </span>
<span>System Admin</span>
</div>
</div>
</div>
</div>
</div>
<style>
.card {
border-radius: 5px;
border: 1px solid #dee2e6;
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
margin-top: 1rem;
}
.banner {
background-color: #e6f0fa;
border-top-left-radius: 5px;
border-top-right-radius: 5px;
border-bottom: 1px solid #dee2e6;
}
.text-primary {
color: #003087 !important;
}
.text-dark {
color: #343a40 !important;
}
.profile-picture img {
transition: all 0.3s ease;
}
.profile-picture img:hover {
opacity: 0.9;
}
.card-body {
font-size: 0.9rem;
}
.card-body .fw-bold {
font-size: 0.95rem;
}
.btn-primary {
background-color: #0d6efd;
border-color: #0d6efd;
font-size: 0.85rem;
padding: 0.25rem 0.75rem;
}
.btn-primary:hover {
background-color: #0b5ed7;
border-color: #0b5ed7;
}
@media (max-width: 576px) {
.profile-picture img {
width: 60px;
height: 60px;
}
.card-body {
font-size: 0.85rem;
}
.card-body .fw-bold {
font-size: 0.9rem;
}
.banner {
padding: 1.5rem;
}
.banner-icon i {
font-size: 30px;
}
.banner h4 {
font-size: 1.25rem;
}
}
</style>
<script>
const profileImage = document.getElementById('profileImage');
const pictureInput = document.getElementById('profilePictureInput');
const changePictureBtn = document.getElementById('changePicture');
// Load saved profile picture
const savedPicture = sessionStorage.getItem('profilePicture');
if (savedPicture) {
profileImage.src = savedPicture;
}
changePictureBtn?.addEventListener('click', () => {
pictureInput?.click();
});
pictureInput?.addEventListener('change', (e) => {
const file = e.target.files[0];
if (file) {
const reader = new FileReader();
reader.onload = (event) => {
profileImage.src = event.target.result;
sessionStorage.setItem('profilePicture', event.target.result);
};
reader.readAsDataURL(file);
}
});
</script>
@endsection

View File

@ -0,0 +1,44 @@
@extends('layouts.app')
@section('page_title', 'Notification')
@section('content')
@php
$notifications = [
['id' => 1, 'subject' => 'Welcome Message', 'content' => 'Welcome to our platform! Get started today.', 'isScheduled' => 'Scheduled', 'schedule' => '2025-04-16 10:00', 'expiration' => '2025-04-30 23:59'],
['id' => 2, 'subject' => 'System Update', 'content' => 'Scheduled maintenance on April 20th.', 'isScheduled' => 'Scheduled', 'schedule' => '2025-04-20 02:00', 'expiration' => '2025-04-21 02:00'],
['id' => 3, 'subject' => 'Promotion Offer', 'content' => '50% off your next purchase this week!', 'isScheduled' => 'Not Scheduled', 'schedule' => '', 'expiration' => '2025-04-22 23:59'],
['id' => 4, 'subject' => 'Account Reminder', 'content' => 'Please update your profile details.', 'isScheduled' => 'Scheduled', 'schedule' => '2025-04-18 09:00', 'expiration' => '2025-04-25 23:59']
];
@endphp
@include('components.table-component', [
'pageTitle' => 'Notification',
'data' => $notifications,
'columns' => [
['name' => 'ID', 'key' => 'id', 'sortable' => true],
['name' => 'Subject', 'key' => 'subject', 'sortable' => true],
['name' => 'Content', 'key' => 'content', 'sortable' => true],
['name' => 'Is Scheduled', 'key' => 'isScheduled', 'sortable' => true],
['name' => 'Schedule', 'key' => 'schedule', 'sortable' => true],
['name' => 'Expiration', 'key' => 'expiration', 'sortable' => true]
],
'showAddButton' => true,
'addButtonUrl' => '/add-notification',
'showCheckboxes' => false,
'showBatchDelete' => false,
'showEditModal' => false,
'showViewModal' => true
])
<script>
const storedNotifications = JSON.parse(sessionStorage.getItem('notifications') || '[]');
if (storedNotifications.length > 0) {
const tableConfig = window.tableConfig || {};
tableConfig.data = [...tableConfig.data, ...storedNotifications];
window.renderTable();
window.renderPagination();
}
</script>
@endsection

View File

@ -0,0 +1,87 @@
@extends('layouts.app')
@section('page_title', 'Promotions')
@section('content')
@php
$promotions = [
[
'id' => 1,
'title' => 'Spring Sale',
'type' => 'Discount',
'startDate' => '2025-04-10',
'endDate' => '2025-04-20',
'status' => 'Done'
],
[
'id' => 2,
'title' => 'Flash Deal',
'type' => 'Flash Sale',
'startDate' => '2025-04-15',
'endDate' => '2025-04-17',
'status' => 'On Going'
],
[
'id' => 3,
'title' => 'Loyalty Promo',
'type' => 'Reward',
'startDate' => '2025-04-20',
'endDate' => '2025-05-01',
'status' => 'Done'
],
[
'id' => 4,
'title' => 'Holiday Bundle',
'type' => 'Bundle',
'startDate' => '2025-04-25',
'endDate' => '2025-05-05',
'status' => 'On Going'
],
[
'id' => 5,
'title' => 'Back-to-School',
'type' => 'Discount',
'startDate' => '2025-04-30',
'endDate' => '2025-05-10',
'status' => 'Done'
],
[
'id' => 6,
'title' => 'Clearance Sale',
'type' => 'Flash Sale',
'startDate' => '2025-05-01',
'endDate' => '2025-05-03',
'status' => 'On Going'
]
];
@endphp
@include('components.table-component', [
'pageTitle' => 'Promotions',
'data' => $promotions,
'columns' => [
['name' => 'Title', 'key' => 'title', 'sortable' => true],
['name' => 'Type', 'key' => 'type', 'sortable' => true],
['name' => 'Start Date', 'key' => 'startDate', 'sortable' => true],
['name' => 'End Date', 'key' => 'endDate', 'sortable' => true],
['name' => 'Status', 'key' => 'status', 'sortable' => true]
],
'actions' => ['edit', 'view', 'delete'],
'showAddButton' => true,
'addButtonUrl' => '/add-promotions',
'showCheckboxes' => true,
'showBatchDelete' => true,
'showEditModal' => true,
'showViewModal' => true
])
<script>
const storedPromotions = JSON.parse(sessionStorage.getItem('promotions') || '[]');
if (storedPromotions.length > 0) {
const tableConfig = window.tableConfig || {};
tableConfig.data = [...tableConfig.data, ...storedPromotions];
window.renderTable();
window.renderPagination();
}
</script>
@endsection

View File

@ -0,0 +1,154 @@
@extends('layouts.app')
@section('page_title', 'Mobile Usage Report')
@section('content')
@php
$mobileUsageData = [
['id' => 1, 'date' => '2025-04-16', 'activeUsers' => 100, 'inactiveUsers' => 20, 'lockedUsers' => 5],
['id' => 2, 'date' => '2025-04-15', 'activeUsers' => 95, 'inactiveUsers' => 22, 'lockedUsers' => 4],
['id' => 3, 'date' => '2025-04-14', 'activeUsers' => 98, 'inactiveUsers' => 18, 'lockedUsers' => 6],
['id' => 4, 'date' => '2025-04-13', 'activeUsers' => 102, 'inactiveUsers' => 19, 'lockedUsers' => 3],
['id' => 5, 'date' => '2025-04-12', 'activeUsers' => 99, 'inactiveUsers' => 21, 'lockedUsers' => 4],
['id' => 6, 'date' => '2025-04-11', 'activeUsers' => 101, 'inactiveUsers' => 20, 'lockedUsers' => 5],
['id' => 7, 'date' => '2025-04-10', 'activeUsers' => 100, 'inactiveUsers' => 19, 'lockedUsers' => 4],
];
@endphp
<div class="mb-3">
<h5 class="mb-0 fw-bold text-dark" style="font-size: 1.25rem;">Mobile Usage Report</h5>
</div>
<div class="row justify-content-center">
<div class="card-body p-3">
<!-- Filters -->
<div class="d-flex justify-content-between mb-3 flex-wrap gap-2">
<div class="d-flex align-items-center gap-2">
<div class="d-flex flex-column">
<label for="startDate" class="form-label mb-1">Start Date</label>
<div class="input-group">
<span class="input-group-text"><i class="fas fa-calendar-alt"></i></span>
<input type="date" class="form-control" id="startDate">
</div>
</div>
<div class="d-flex flex-column">
<label for="endDate" class="form-label mb-1">End Date</label>
<div class="input-group">
<input type="date" class="form-control" id="endDate">
</div>
</div>
</div>
<div class="d-flex gap-2">
<button type="button" class="btn btn-export-csv" id="exportCsv" style="margin:20px">Export CSV</button>
</div>
</div>
<!-- Table -->
@include('components.table-component', [
'data' => $mobileUsageData,
'columns' => [
['name' => 'Date', 'key' => 'date', 'sortable' => true, 'format' => 'date'],
['name' => 'Active Registered Users', 'key' => 'activeUsers', 'sortable' => true],
['name' => 'Inactive Registered Users', 'key' => 'inactiveUsers', 'sortable' => true],
['name' => 'Locked Registered Users', 'key' => 'lockedUsers', 'sortable' => true]
],
'allFields' => [],
'actions' => [],
'showAddButton' => false,
'showCheckboxes' => false,
'showBatchDelete' => false,
'showEditModal' => false,
'showViewModal' => false,
'showSearch' => false
])
</div>
</div>
<style>
.card {
border-radius: 5px;
border: 1px solid #dee2e6;
}
.form-control {
font-size: 0.9rem;
}
.btn-outline-secondary {
border-color: #6c757d;
color: #6c757d;
}
.btn-outline-secondary:hover {
background-color: #f8f9fa;
}
.btn-export-csv {
background-color: #ff6200;
color: white;
border: none;
}
.btn-export-csv:hover {
background-color: #e65a00;
}
.input-group-text {
background-color: #f8f9fa;
}
</style>
<script>
let originalData = [...tableConfig.data];
const storedData = JSON.parse(sessionStorage.getItem('mobileUsageReport') || '[]');
if (storedData.length > 0) {
tableConfig.data = [...tableConfig.data, ...storedData];
originalData = [...tableConfig.data];
}
const startDateInput = document.getElementById('startDate');
const endDateInput = document.getElementById('endDate');
const exportCsvBtn = document.getElementById('exportCsv');
function filterData() {
const startDate = startDateInput.value ? new Date(startDateInput.value) : null;
const endDate = endDateInput.value ? new Date(endDateInput.value) : null;
tableConfig.data = originalData.filter(item => {
const itemDate = new Date(item.date);
if (startDate && itemDate < startDate) return false;
if (endDate) {
const endDateAdjusted = new Date(endDate);
endDateAdjusted.setHours(23, 59, 59, 999);
if (itemDate > endDateAdjusted) return false;
}
return true;
});
currentPage = 1;
renderTable();
renderPagination();
}
startDateInput.addEventListener('change', filterData);
endDateInput.addEventListener('change', filterData);
exportCsvBtn.addEventListener('click', () => {
const headers = tableConfig.columns.map(col => col.name).join(',');
const rows = tableConfig.data.map(item => {
return [
item.date,
item.activeUsers,
item.inactiveUsers,
item.lockedUsers
].join(',');
});
const csvContent = [headers, ...rows].join('\n');
const blob = new Blob([csvContent], { type: 'text/csv;charset=utf-8;' });
const link = document.createElement('a');
const url = URL.createObjectURL(blob);
link.setAttribute('href', url);
link.setAttribute('download', 'mobile-usage-report.csv');
document.body.appendChild(link);
link.click();
document.body.removeChild(link);
});
// Initial render
renderTable();
renderPagination();
</script>
@endsection

View File

@ -0,0 +1,209 @@
@extends('layouts.app')
@section('page_title', 'Registration Report')
@section('content')
@php
$registrationData = [
[
'id' => 1,
'date' => '2025-04-16',
'activatedCards' => 2,
'registeredMembers' => 2
],
[
'id' => 2,
'date' => '2025-04-14',
'activatedCards' => 1,
'registeredMembers' => 1
],
[
'id' => 3,
'date' => '2025-03-20',
'activatedCards' => 1,
'registeredMembers' => 1
],
[
'id' => 4,
'date' => '2025-03-10',
'activatedCards' => 1,
'registeredMembers' => 1
],
[
'id' => 5,
'date' => '2025-03-01',
'activatedCards' => 1,
'registeredMembers' => 1
],[
'id' => 6,
'date' => '2025-03-01',
'activatedCards' => 1,
'registeredMembers' => 1
],[
'id' => 7,
'date' => '2025-03-01',
'activatedCards' => 1,
'registeredMembers' => 1
],
];
@endphp
<div class="mb-3">
<h5 class="mb-0 fw-bold text-dark" style="font-size: 1.25rem;">Registration Report</h5>
</div>
<div class="row justify-content-center">
<div class="card-body p-3">
<!-- Filters -->
<div class="d-flex justify-content-between mb-3 flex-wrap gap-2">
<div class="d-flex align-items-center gap-2">
<div class="d-flex flex-column">
<label for="startDate" class="form-label mb-1">Start Date</label>
<div class="input-group">
<span class="input-group-text"><i class="fas fa-calendar-alt"></i></span>
<input type="date" class="form-control" id="startDate">
</div>
</div>
<div class="d-flex flex-column">
<label for="endDate" class="form-label mb-1">End Date</label>
<div class="input-group">
<input type="date" class="form-control" id="endDate">
</div>
</div>
</div>
<div class="d-flex gap-2">
<button type="button" class="btn btn-export-csv" id="exportCsv" style="margin:20px">Export CSV</button>
</div>
</div>
@include('components.table-component', [
'data' => $registrationData,
'columns' => [
['name' => 'Date', 'key' => 'date', 'sortable' => true, 'format' => 'date'],
['name' => 'No. of Activated Cards', 'key' => 'activatedCards', 'sortable' => true],
['name' => 'No. of Registered Members', 'key' => 'registeredMembers', 'sortable' => true]
],
'allFields' => [],
'actions' => [],
'showAddButton' => false,
'showCheckboxes' => false,
'showBatchDelete' => false,
'showEditModal' => false,
'showViewModal' => false,
'showSearch' => false
])
</div>
</div>
<style>
.card {
border-radius: 5px;
border: 1px solid #dee2e6;
}
.form-control {
font-size: 0.9rem;
}
.btn-outline-secondary {
border-color: #6c757d;
color: #6c757d;
}
.btn-outline-secondary:hover {
background-color: #f8f9fa;
}
.btn-export-csv {
background-color: #ff6200;
color: white;
border: none;
}
.btn-export-csv:hover {
background-color: #e65a00;
}
.input-group-text {
background-color: #f8f9fa;
}
</style>
<script>
let originalData = [...tableConfig.data];
const storedData = JSON.parse(sessionStorage.getItem('registrationReport') || '[]');
if (storedData.length > 0) {
tableConfig.data = [...tableConfig.data, ...storedData];
originalData = [...tableConfig.data];
}
const startDateInput = document.getElementById('startDate');
const endDateInput = document.getElementById('endDate');
const clearFiltersBtn = document.getElementById('clearFilters');
const exportCsvBtn = document.getElementById('exportCsv');
function formatDateForDisplay(dateStr) {
const date = new Date(dateStr);
const options = { day: '2-digit', month: 'short', year: 'numeric' };
return date.toLocaleDateString('en-US', options).replace(/,/, '');
}
function filterData() {
const startDate = startDateInput.value ? new Date(startDateInput.value) : null;
const endDate = endDateInput.value ? new Date(endDateInput.value) : null;
tableConfig.data = originalData.filter(item => {
const itemDate = new Date(item.date);
if (startDate && itemDate < startDate) return false;
if (endDate) {
const endDateAdjusted = new Date(endDate);
endDateAdjusted.setHours(23, 59, 59, 999);
if (itemDate > endDateAdjusted) return false;
}
return true;
});
currentPage = 1;
renderTable();
renderPagination();
}
startDateInput.addEventListener('change', filterData);
endDateInput.addEventListener('change', filterData);
clearFiltersBtn.addEventListener('click', () => {
startDateInput.value = '';
endDateInput.value = '';
tableConfig.data = [...originalData];
currentPage = 1;
renderTable();
renderPagination();
});
exportCsvBtn.addEventListener('click', () => {
const headers = tableConfig.columns.map(col => col.name).join(',');
const rows = tableConfig.data.map(item => {
return [
formatDateForDisplay(item.date),
item.activatedCards,
item.registeredMembers
].join(',');
});
const csvContent = [headers, ...rows].join('\n');
const blob = new Blob([csvContent], { type: 'text/csv;charset=utf-8;' });
const link = document.createElement('a');
const url = URL.createObjectURL(blob);
link.setAttribute('href', url);
link.setAttribute('download', 'registration-report.csv');
document.body.appendChild(link);
link.click();
document.body.removeChild(link);
});
// Initial render with formatted dates
tableConfig.data.forEach(item => {
item.displayDate = formatDateForDisplay(item.date);
});
renderTable();
renderPagination();
</script>
@endsection

View File

@ -0,0 +1,155 @@
@extends('layouts.app')
@section('page_title', 'Station Rating Report')
@section('content')
@php
$stationRatingData = [
['id' => 1, 'transactionDateTime' => '2025-04-16 10:30:00', 'cardNumber' => '4111111111111111', 'salesInvoice' => 'INV001', 'station' => 'Station A', 'ratings' => 4.5],
['id' => 2, 'transactionDateTime' => '2025-04-15 14:45:00', 'cardNumber' => '4012888888881881', 'salesInvoice' => 'INV002', 'station' => 'Station B', 'ratings' => 3.8],
['id' => 3, 'transactionDateTime' => '2025-04-14 09:15:00', 'cardNumber' => '5555555555554444', 'salesInvoice' => 'INV003', 'station' => 'Station C', 'ratings' => 4.2],
['id' => 4, 'transactionDateTime' => '2025-04-13 16:20:00', 'cardNumber' => '378282246310005', 'salesInvoice' => 'INV004', 'station' => 'Station D', 'ratings' => 4.0],
['id' => 5, 'transactionDateTime' => '2025-04-12 11:00:00', 'cardNumber' => '6011111111111117', 'salesInvoice' => 'INV005', 'station' => 'Station E', 'ratings' => 3.9],
['id' => 6, 'transactionDateTime' => '2025-04-11 08:50:00', 'cardNumber' => '3530111333300000', 'salesInvoice' => 'INV006', 'station' => 'Station F', 'ratings' => 4.3],
['id' => 7, 'transactionDateTime' => '2025-04-10 12:10:00', 'cardNumber' => '4917610000000000', 'salesInvoice' => 'INV007', 'station' => 'Station G', 'ratings' => 4.1],
];
@endphp
<div class="mb-3">
<h5 class="mb-0 fw-bold text-dark" style="font-size: 1.25rem;">Station Rating Report</h5>
</div>
<div class="row justify-content-center">
<div class="card-body p-3">
<!-- Filters -->
<div class="d-flex justify-content-between mb-3 flex-wrap gap-2">
<div class="d-flex align-items-center gap-2">
<div class="d-flex flex-column">
<label for="startDate" class="form-label mb-1">Start Date</label>
<div class="input-group">
<span class="input-group-text"><i class="fas fa-calendar-alt"></i></span>
<input type="date" class="form-control" id="startDate">
</div>
</div>
<div class="d-flex flex-column">
<label for="endDate" class="form-label mb-1">End Date</label>
<div class="input-group">
<input type="date" class="form-control" id="endDate">
</div>
</div>
</div>
<div class="d-flex gap-2">
<button type="button" class="btn btn-export-csv" id="exportCsv" style="margin:20px">Export CSV</button>
</div>
</div>
<!-- Table -->
@include('components.table-component', [
'data' => $stationRatingData,
'columns' => [
['name' => 'Transaction Date and Time', 'key' => 'transactionDateTime', 'sortable' => true],
['name' => 'Card Number', 'key' => 'cardNumber', 'sortable' => true],
['name' => 'Sales Invoice', 'key' => 'salesInvoice', 'sortable' => true],
['name' => 'Station', 'key' => 'station', 'sortable' => true],
['name' => 'Ratings', 'key' => 'ratings', 'sortable' => true]
],
'allFields' => [],
'actions' => [],
'showAddButton' => false,
'showCheckboxes' => false,
'showBatchDelete' => false,
'showEditModal' => false,
'showViewModal' => false,
'showSearch' => false
])
</div>
</div>
<style>
.card {
border-radius: 5px;
border: 1px solid #dee2e6;
}
.form-control {
font-size: 0.9rem;
}
.btn-outline-secondary {
border-color: #6c757d;
color: #6c757d;
}
.btn-outline-secondary:hover {
background-color: #f8f9fa;
}
.btn-export-csv {
background-color: #ff6200;
color: white;
border: none;
}
.btn-export-csv:hover {
background-color: #e65a00;
}
.input-group-text {
background-color: #f8f9fa;
}
</style>
<script>
let originalData = [...tableConfig.data];
const storedData = JSON.parse(sessionStorage.getItem('stationRatingReport') || '[]');
if (storedData.length > 0) {
tableConfig.data = [...tableConfig.data, ...storedData];
originalData = [...tableConfig.data];
}
const startDateInput = document.getElementById('startDate');
const endDateInput = document.getElementById('endDate');
const exportCsvBtn = document.getElementById('exportCsv');
function filterData() {
const startDate = startDateInput.value ? new Date(startDateInput.value) : null;
const endDate = endDateInput.value ? new Date(endDateInput.value) : null;
tableConfig.data = originalData.filter(item => {
const itemDate = new Date(item.date);
if (startDate && itemDate < startDate) return false;
if (endDate) {
const endDateAdjusted = new Date(endDate);
endDateAdjusted.setHours(23, 59, 59, 999);
if (itemDate > endDateAdjusted) return false;
}
return true;
});
currentPage = 1;
renderTable();
renderPagination();
}
startDateInput.addEventListener('change', filterData);
endDateInput.addEventListener('change', filterData);
exportCsvBtn.addEventListener('click', () => {
const headers = tableConfig.columns.map(col => col.name).join(',');
const rows = tableConfig.data.map(item => {
return [
item.date,
item.activeUsers,
item.inactiveUsers,
item.lockedUsers
].join(',');
});
const csvContent = [headers, ...rows].join('\n');
const blob = new Blob([csvContent], { type: 'text/csv;charset=utf-8;' });
const link = document.createElement('a');
const url = URL.createObjectURL(blob);
link.setAttribute('href', url);
link.setAttribute('download', 'station-rating-report.csv');
document.body.appendChild(link);
link.click();
document.body.removeChild(link);
});
// Initial render
renderTable();
renderPagination();
</script>
@endsection

View File

@ -0,0 +1,187 @@
@extends('layouts.app')
@section('page_title', 'Top-Up Usage Report')
@section('content')
@php
$topUpData = [
[
'id' => 1,
'transactionDateTime' => '2025-04-16 10:30:00',
'cardNumber' => '4111111111111111',
'topUpAmount' => '50.00'
],
[
'id' => 2,
'transactionDateTime' => '2025-04-15 14:45:00',
'cardNumber' => '4012888888881881',
'topUpAmount' => '20.00'
],
[
'id' => 3,
'transactionDateTime' => '2025-04-14 09:15:00',
'cardNumber' => '5555555555554444',
'topUpAmount' => '30.00'
],
[
'id' => 4,
'transactionDateTime' => '2025-04-13 16:20:00',
'cardNumber' => '378282246310005',
'topUpAmount' => '10.00'
],
[
'id' => 5,
'transactionDateTime' => '2025-04-12 11:00:00',
'cardNumber' => '6011111111111117',
'topUpAmount' => '40.00'
],
[
'id' => 6,
'transactionDateTime' => '2025-04-11 08:50:00',
'cardNumber' => '3530111333300000',
'topUpAmount' => '25.00'
],
[
'id' => 7,
'transactionDateTime' => '2025-04-10 12:10:00',
'cardNumber' => '4917610000000000',
'topUpAmount' => '15.00'
]
];
@endphp
<div class="mb-3">
<h5 class="mb-0 fw-bold text-dark" style="font-size: 1.25rem;">Top-Up Usage Report</h5>
</div>
<div class="row justify-content-center">
<div class="card-body p-3">
<!-- Filters -->
<div class="d-flex justify-content-between mb-3 flex-wrap gap-2">
<div class="d-flex align-items-center gap-2">
<div class="d-flex flex-column">
<label for="startDate" class="form-label mb-1">Start Date</label>
<div class="input-group">
<span class="input-group-text"><i class="fas fa-calendar-alt"></i></span>
<input type="date" class="form-control" id="startDate">
</div>
</div>
<div class="d-flex flex-column">
<label for="endDate" class="form-label mb-1">End Date</label>
<div class="input-group">
<input type="date" class="form-control" id="endDate">
</div>
</div>
</div>
<div class="d-flex gap-2">
<button type="button" class="btn btn-export-csv" id="exportCsv" style="margin:20px">Export CSV</button>
</div>
</div>
<!-- Table -->
@include('components.table-component', [
'data' => $topUpData,
'columns' => [
['name' => 'Transaction Date and Time', 'key' => 'transactionDateTime', 'sortable' => true],
['name' => 'Card Number', 'key' => 'cardNumber', 'sortable' => true],
['name' => 'Top-Up Amount', 'key' => 'topUpAmount', 'sortable' => true]
],
'allFields' => [],
'actions' => [],
'showAddButton' => false,
'showCheckboxes' => false,
'showBatchDelete' => false,
'showEditModal' => false,
'showViewModal' => false,
'showSearch' => false
])
</div>
</div>
<style>
.card {
border-radius: 5px;
border: 1px solid #dee2e6;
}
.form-control {
font-size: 0.9rem;
}
.btn-outline-secondary {
border-color: #6c757d;
color: #6c757d;
}
.btn-outline-secondary:hover {
background-color: #f8f9fa;
}
.btn-export-csv {
background-color: #ff6200;
color: white;
border: none;
}
.btn-export-csv:hover {
background-color: #e65a00;
}
.input-group-text {
background-color: #f8f9fa;
}
</style>
<script>
let originalData = [...tableConfig.data];
const storedData = JSON.parse(sessionStorage.getItem('topUpUsageReport') || '[]');
if (storedData.length > 0) {
tableConfig.data = [...tableConfig.data, ...storedData];
originalData = [...tableConfig.data];
}
const startDateInput = document.getElementById('startDate');
const endDateInput = document.getElementById('endDate');
const exportCsvBtn = document.getElementById('exportCsv');
function filterData() {
const startDate = startDateInput.value ? new Date(startDateInput.value) : null;
const endDate = endDateInput.value ? new Date(endDateInput.value) : null;
tableConfig.data = originalData.filter(item => {
const itemDate = new Date(item.transactionDateTime.split(' ')[0]); // Extract date part
if (startDate && itemDate < startDate) return false;
if (endDate) {
const endDateAdjusted = new Date(endDate);
endDateAdjusted.setHours(23, 59, 59, 999);
if (itemDate > endDateAdjusted) return false;
}
return true;
});
currentPage = 1;
renderTable();
renderPagination();
}
startDateInput.addEventListener('change', filterData);
endDateInput.addEventListener('change', filterData);
exportCsvBtn.addEventListener('click', () => {
const headers = tableConfig.columns.map(col => col.name).join(',');
const rows = tableConfig.data.map(item => {
return [
item.transactionDateTime,
item.cardNumber,
item.topUpAmount
].join(',');
});
const csvContent = [headers, ...rows].join('\n');
const blob = new Blob([csvContent], { type: 'text/csv;charset=utf-8;' });
const link = document.createElement('a');
const url = URL.createObjectURL(blob);
link.setAttribute('href', url);
link.setAttribute('download', 'top-up-usage-report.csv');
document.body.appendChild(link);
link.click();
document.body.removeChild(link);
});
// Initial render
renderTable();
renderPagination();
</script>
@endsection

View File

@ -0,0 +1,98 @@
@extends('layouts.app')
@section('page_title', 'Branches')
@section('content')
@php
$branches = [
[
'id' => 1,
'branchCode' => 'BR001',
'branchName' => 'Main Branch',
'details' => 'Located at downtown, open 9 AM to 5 PM.',
'dateCreated' => '2025-01-01',
'createdBy' => 'Admin',
'dateModified' => '2025-04-01'
],
[
'id' => 2,
'branchCode' => 'BR002',
'branchName' => 'Westside Branch',
'details' => 'Serves western district, parking available.',
'dateCreated' => '2025-02-01',
'createdBy' => 'Admin',
'dateModified' => '2025-04-10'
],
[
'id' => 3,
'branchCode' => 'BR003',
'branchName' => 'East End Branch',
'details' => 'Newly opened, extended hours.',
'dateCreated' => '2025-03-01',
'createdBy' => 'Admin',
'dateModified' => '2025-03-01'
],
[
'id' => 4,
'branchCode' => 'BR004',
'branchName' => 'North Branch',
'details' => 'Located near industrial area.',
'dateCreated' => '2025-01-15',
'createdBy' => 'Admin',
'dateModified' => '2025-04-05'
],
[
'id' => 5,
'branchCode' => 'BR005',
'branchName' => 'South Branch',
'details' => 'Family-friendly, open weekends.',
'dateCreated' => '2025-02-15',
'createdBy' => 'Admin',
'dateModified' => '2025-02-15'
],
[
'id' => 6,
'branchCode' => 'BR006',
'branchName' => 'Central Branch',
'details' => 'Central location, 24/7 ATM.',
'dateCreated' => '2025-03-15',
'createdBy' => 'Admin',
'dateModified' => '2025-04-12'
]
];
@endphp
@include('components.table-component', [
'pageTitle' => 'Branches',
'data' => $branches,
'columns' => [
['name' => 'Branch Code', 'key' => 'branchCode', 'sortable' => true],
['name' => 'Branch Name', 'key' => 'branchName', 'sortable' => true],
['name' => 'Details', 'key' => 'details', 'sortable' => true],
['name' => 'Date Created', 'key' => 'dateCreated', 'sortable' => true],
['name' => 'Created By', 'key' => 'createdBy', 'sortable' => true],
['name' => 'Date Modified', 'key' => 'dateModified', 'sortable' => true]
],
'allFields' => [
['name' => 'Branch Code', 'key' => 'branchCode', 'type' => 'text', 'required' => true],
['name' => 'Branch Name', 'key' => 'branchName', 'type' => 'text', 'required' => true],
['name' => 'Details', 'key' => 'details', 'type' => 'textarea', 'required' => true]
],
'actions' => ['edit', 'delete'],
'showAddButton' => true,
'addButtonUrl' => '/add-branches',
'showCheckboxes' => false,
'showBatchDelete' => false,
'showEditModal' => true,
'showViewModal' => false
])
<script>
const storedBranches = JSON.parse(sessionStorage.getItem('branches') || '[]');
if (storedBranches.length > 0) {
tableConfig.data = [...tableConfig.data, ...storedBranches];
renderTable();
renderPagination();
}
</script>
@endsection

View File

@ -0,0 +1,75 @@
@extends('layouts.app')
@section('page_title', 'Fuels')
@section('content')
@php
$fuels = [
[
'id' => 1,
'fuelName' => 'Unleaded 91',
'dateCreated' => '2025-01-01',
'dateModified' => '2025-04-01'
],
[
'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

View File

@ -0,0 +1,181 @@
@extends('layouts.app')
@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', [
'pageTitle' => 'Station Management',
'data' => $stations,
'columns' => [
['name' => 'Station Code', 'key' => 'station_code', 'sortable' => true],
['name' => 'Station Name', 'key' => 'station_name', 'sortable' => true],
['name' => 'Branch Name', 'key' => 'branch_name', 'sortable' => true],
['name' => 'Date Created', 'key' => 'date_created', 'sortable' => true],
['name' => 'Created By', 'key' => 'created_by', 'sortable' => true],
['name' => 'Modified By', 'key' => 'modified_by', 'sortable' => true],
['name' => 'Date Modified', 'key' => 'date_modified', 'sortable' => true]
],
'actions' => ['edit', 'view', 'delete'],
'showAddButton' => true,
'addButtonUrl' => '/add-station',
'showCheckboxes' => false,
'showBatchDelete' => false,
'showEditModal' => true,
'showViewModal' => true
])
@endsection

View File

@ -0,0 +1,184 @@
@extends('layouts.app')
@section('page_title', 'System Parameters')
@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;">System Parameters</h5>
</div>
<div class="row justify-content-center">
<div class="card-body p-3">
<form id="systemParametersForm">
<!-- Company Logo -->
<h4 class="fw-bold mb-3 mt-4">Company Logo</h4>
<div class="mb-3">
<label for="companyLogo" class="form-label">Upload Logo</label>
<input type="file" class="form-control" id="companyLogo" accept=".jpg,.jpeg,.png">
</div>
<!-- GPS Radius -->
<h4 class="fw-bold mb-3 mt-4">GPS Radius</h4>
<div class="mb-3">
<label for="gpsRadius" class="form-label">GPS Radius (in meters)</label>
<input type="number" class="form-control" id="gpsRadius" min="0" placeholder="Enter radius" required>
</div>
<!-- Customer Service Details -->
<h4 class="fw-bold mb-3 mt-4">Customer Service Details</h4>
<div class="mb-3">
<label for="contactEmail" class="form-label">Contact Email Address</label>
<input type="email" class="form-control" id="contactEmail" placeholder="Enter email" required>
</div>
<div class="mb-3">
<label for="contactNumber" class="form-label">Contact Number</label>
<input type="tel" class="form-control" id="contactNumber" placeholder="Enter number" required>
</div>
<!-- System Administrator Details -->
<h4 class="fw-bold mb-3 mt-4">System Administrator Details</h4>
<div class="mb-3">
<label for="adminContact" class="form-label">Contact Details</label>
<textarea class="form-control" id="adminContact" rows="4" placeholder="Enter details" required></textarea>
</div>
<!-- Information Guide Details -->
<h4 class="fw-bold mb-3 mt-4">Information Guide Details</h4>
<div class="mb-3">
<label for="infoGuideDetails" class="form-label">Details</label>
<textarea class="form-control" id="infoGuideDetails" rows="4" placeholder="Enter details" required></textarea>
</div>
<!-- Android Version Update -->
<h4 class="fw-bold mb-3 mt-4">Android Version Update</h4>
<div class="mb-3">
<label for="androidVersion" class="form-label">Android Version</label>
<input type="text" class="form-control" id="androidVersion" placeholder="e.g., 1.0.0" required>
</div>
<div class="mb-3">
<label for="androidVersionMessage" class="form-label">Version Update Message</label>
<textarea class="form-control" id="androidVersionMessage" rows="4" placeholder="Enter message" required></textarea>
</div>
<div class="mb-3">
<label for="androidVersionAction" class="form-label">Version Action</label>
<select class="form-select" id="androidVersionAction" required>
<option value="" disabled selected>Select action</option>
<option value="Force Update">Force Update</option>
<option value="Optional Update">Optional Update</option>
</select>
</div>
<!-- iOS Version Update -->
<h4 class="fw-bold mb-3 mt-4">iOS Version Update</h4>
<div class="mb-3">
<label for="iosVersion" class="form-label">iOS Version</label>
<input type="text" class="form-control" id="iosVersion" placeholder="e.g., 1.0.0" required>
</div>
<div class="mb-3">
<label for="iosVersionMessage" class="form-label">Version Update Message</label>
<textarea class="form-control" id="iosVersionMessage" rows="4" placeholder="Enter message" required></textarea>
</div>
<div class="mb-3">
<label for="iosVersionAction" class="form-label">Version Action</label>
<select class="form-select" id="iosVersionAction" required>
<option value="" disabled selected>Select action</option>
<option value="Force Update">Force Update</option>
<option value="Optional Update">Optional Update</option>
</select>
</div>
<!-- Update Details -->
<h4 class="fw-bold mb-3 mt-4">Update Details</h4>
<div class="mb-3">
<button type="button" class="btn btn-primary" id="syncData">Sync Data</button>
</div>
<!-- Submit -->
<div class="d-flex justify-content-end mt-4">
<button type="submit" class="btn btn-primary">Submit</button>
</div>
</form>
</div>
</div>
<style>
.card {
border-radius: 5px;
border: 1px solid #dee2e6;
}
.form-label {
font-size: 0.95rem;
}
.form-control,
.form-select,
textarea.form-control {
font-size: 0.9rem;
width: 100%;
}
h4 {
color: #343a40;
}
</style>
<script>
document.getElementById('systemParametersForm').addEventListener('submit', function(e) {
e.preventDefault();
const fields = {
companyLogo: document.getElementById('companyLogo').files[0]?.name || '',
gpsRadius: document.getElementById('gpsRadius').value,
contactEmail: document.getElementById('contactEmail').value,
contactNumber: document.getElementById('contactNumber').value,
adminContact: document.getElementById('adminContact').value,
infoGuideDetails: document.getElementById('infoGuideDetails').value,
androidVersion: document.getElementById('androidVersion').value,
androidVersionMessage: document.getElementById('androidVersionMessage').value,
androidVersionAction: document.getElementById('androidVersionAction').value,
iosVersion: document.getElementById('iosVersion').value,
iosVersionMessage: document.getElementById('iosVersionMessage').value,
iosVersionAction: document.getElementById('iosVersionAction').value
};
// Validate required fields (exclude companyLogo)
for (const [key, value] of Object.entries(fields)) {
if (key !== 'companyLogo' && !value) {
alert('Please fill out all required fields.');
return;
}
}
// Validate email format
const emailPattern = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
if (!emailPattern.test(fields.contactEmail)) {
alert('Please enter a valid email address.');
return;
}
sessionStorage.setItem('systemParameters', JSON.stringify(fields));
alert('Settings saved successfully!');
});
document.getElementById('syncData').addEventListener('click', function() {
alert('Data synced!');
});
document.querySelector('.btn-outline-secondary').addEventListener('click', function() {
window.location.href = '/';
});
// Load saved data
const savedData = JSON.parse(sessionStorage.getItem('systemParameters') || '{}');
if (savedData) {
document.getElementById('gpsRadius').value = savedData.gpsRadius || '';
document.getElementById('contactEmail').value = savedData.contactEmail || '';
document.getElementById('contactNumber').value = savedData.contactNumber || '';
document.getElementById('adminContact').value = savedData.adminContact || '';
document.getElementById('infoGuideDetails').value = savedData.infoGuideDetails || '';
document.getElementById('androidVersion').value = savedData.androidVersion || '';
document.getElementById('androidVersionMessage').value = savedData.androidVersionMessage || '';
document.getElementById('androidVersionAction').value = savedData.androidVersionAction || '';
document.getElementById('iosVersion').value = savedData.iosVersion || '';
document.getElementById('iosVersionMessage').value = savedData.iosVersionMessage || '';
document.getElementById('iosVersionAction').value = savedData.iosVersionAction || '';
}
</script>
@endsection

View File

@ -0,0 +1,80 @@
@extends('layouts.app')
@section('page_title', 'Top-Up')
@section('content')
@php
$topups = [
[
'id' => 1,
'freeCode' => 'CODE123',
'name' => 'Monthly Top-Up',
'value' => '100.00',
'type' => 'Prepaid'
],
[
'id' => 2,
'freeCode' => 'CODE456',
'name' => 'Annual Plan',
'value' => '500.00',
'type' => 'Postpaid'
],
[
'id' => 3,
'freeCode' => 'CODE789',
'name' => 'Welcome Bonus',
'value' => '50.00',
'type' => 'Bonus'
],
[
'id' => 4,
'freeCode' => 'CODE101',
'name' => 'Data Boost',
'value' => '200.00',
'type' => 'Prepaid'
],
[
'id' => 5,
'freeCode' => 'CODE202',
'name' => 'Family Plan',
'value' => '300.00',
'type' => 'Postpaid'
],
[
'id' => 6,
'freeCode' => 'CODE303',
'name' => 'Loyalty Credit',
'value' => '75.00',
'type' => 'Bonus'
]
];
@endphp
@include('components.table-component', [
'pageTitle' => 'Top-Up',
'data' => $topups,
'columns' => [
['name' => 'Free Code', 'key' => 'freeCode', 'sortable' => true],
['name' => 'Name', 'key' => 'name', 'sortable' => true],
['name' => 'Value', 'key' => 'value', 'sortable' => true],
['name' => 'Type', 'key' => 'type', 'sortable' => true]
],
'actions' => ['edit', 'view', 'delete'],
'showAddButton' => true,
'addButtonUrl' => '/add-top-up',
'showCheckboxes' => true,
'showBatchDelete' => true,
'showEditModal' => true,
'showViewModal' => true
])
<script>
const storedTopups = JSON.parse(sessionStorage.getItem('topups') || '[]');
if (storedTopups.length > 0) {
const tableConfig = window.tableConfig || {};
tableConfig.data = [...tableConfig.data, ...storedTopups];
window.renderTable();
window.renderPagination();
}
</script>
@endsection

View File

@ -0,0 +1,37 @@
@extends('layouts.app')
@section('page_title', 'User Management')
@section('content')
@php
$users = [
['id' => 1, 'username' => 'superadmin', 'firstName' => 'Maryse', 'lastName' => 'Howe', 'role' => 'Admin', 'email' => 'maryse.howe@qqq.com', 'status' => 'Inctive'],
['id' => 2, 'username' => 'superadmin1', 'firstName' => 'Joseph', 'lastName' => 'Sazon', 'role' => 'Admin', 'email' => 'mis.specialist@unioil.com', 'status' => 'Active'],
['id' => 3, 'username' => 'graxia', 'firstName' => 'Graxia', 'lastName' => 'Montino', 'role' => 'Admin', 'email' => 'business.analyst@unioil.com', 'status' => 'Inctive'],
['id' => 4, 'username' => 'cinerosimo', 'firstName' => 'Cine', 'lastName' => 'Rosimo', 'role' => 'Admin', 'email' => 'frosimo1@yopmail.com', 'status' => 'Active'],
['id' => 5, 'username' => 'graxia5', 'firstName' => 'Graxia', 'lastName' => 'Montino', 'role' => 'Admin', 'email' => 'business.analyst@unioil.com', 'status' => 'Inctive'],
['id' => 6, 'username' => 'graxia6', 'firstName' => 'Graxia', 'lastName' => 'Montino', 'role' => 'Admin', 'email' => 'business.analyst@unioil.com', 'status' => 'Inctive'],
['id' => 7, 'username' => 'graxia7', 'firstName' => 'Graxia', 'lastName' => 'Montino', 'role' => 'Admin', 'email' => 'business.analyst@unioil.com', 'status' => 'Active']
];
@endphp
@include('components.table-component', [
'pageTitle' => 'User Management',
'data' => $users,
'columns' => [
['name' => 'Username', 'key' => 'username', 'sortable' => true],
['name' => 'First Name', 'key' => 'firstName', 'sortable' => true],
['name' => 'Last Name', 'key' => 'lastName', 'sortable' => true],
['name' => 'User Role', 'key' => 'role', 'sortable' => true],
['name' => 'Email', 'key' => 'email', 'sortable' => true],
['name' => 'Status', 'key' => 'status', 'sortable' => true]
],
'actions' => ['edit', 'view', 'delete'],
'showAddButton' => true,
'addButtonUrl' => '/add-user',
'showCheckboxes' => true,
'showBatchDelete' => true,
'showEditModal' => true,
'showViewModal' => true
])
@endsection

View File

@ -0,0 +1,82 @@
@extends('layouts.app')
@section('page_title', 'Add User')
@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 User</h5>
</div>
<div class="card-body py-2">
<form action="#" method="POST" id="addUserForm">
@csrf
<div class="mb-2">
<label for="username" class="form-label mb-1">Username</label>
<input type="text" class="form-control form-control-sm" id="username" name="username" required>
</div>
<div class="mb-2">
<label for="firstName" class="form-label mb-1">First Name</label>
<input type="text" class="form-control form-control-sm" id="firstName" name="firstName" required>
</div>
<div class="mb-2">
<label for="lastName" class="form-label mb-1">Last Name</label>
<input type="text" class="form-control form-control-sm" id="lastName" name="lastName" required>
</div>
<div class="mb-2">
<label for="role" class="form-label mb-1">User Role</label>
<input type="text" class="form-control form-control-sm" id="role" name="role" required>
</div>
<div class="mb-2">
<label for="email" class="form-label mb-1">Email</label>
<input type="email" class="form-control form-control-sm" id="email" name="email" required>
</div>
<div class="mb-2">
<label for="status" class="form-label mb-1">Status</label>
<select class="form-select form-select-sm" id="status" name="status" required>
<option value="Active">Active</option>
<option value="Inactive">Inactive</option>
</select>
</div>
<div class="d-flex justify-content-end mt-3">
<a href="{{ url('user-management') }}" 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 User</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

View File

@ -0,0 +1,102 @@
@php
if (! isset($scrollTo)) {
$scrollTo = 'body';
}
$scrollIntoViewJsSnippet = ($scrollTo !== false)
? <<<JS
(\$el.closest('{$scrollTo}') || document.querySelector('{$scrollTo}')).scrollIntoView()
JS
: '';
@endphp
<div>
@if ($paginator->hasPages())
<nav class="d-flex justify-items-center justify-content-between">
<div class="d-flex justify-content-between flex-fill d-sm-none">
<ul class="pagination">
{{-- Previous Page Link --}}
@if ($paginator->onFirstPage())
<li class="page-item disabled" aria-disabled="true">
<span class="page-link">@lang('pagination.previous')</span>
</li>
@else
<li class="page-item">
<button type="button" dusk="previousPage{{ $paginator->getPageName() == 'page' ? '' : '.' . $paginator->getPageName() }}" class="page-link" wire:click="previousPage('{{ $paginator->getPageName() }}')" x-on:click="{{ $scrollIntoViewJsSnippet }}" wire:loading.attr="disabled">@lang('pagination.previous')</button>
</li>
@endif
{{-- Next Page Link --}}
@if ($paginator->hasMorePages())
<li class="page-item">
<button type="button" dusk="nextPage{{ $paginator->getPageName() == 'page' ? '' : '.' . $paginator->getPageName() }}" class="page-link" wire:click="nextPage('{{ $paginator->getPageName() }}')" x-on:click="{{ $scrollIntoViewJsSnippet }}" wire:loading.attr="disabled">@lang('pagination.next')</button>
</li>
@else
<li class="page-item disabled" aria-disabled="true">
<span class="page-link" aria-hidden="true">@lang('pagination.next')</span>
</li>
@endif
</ul>
</div>
<div class="d-none flex-sm-fill d-sm-flex align-items-sm-center justify-content-sm-between">
<div>
<p class="small text-muted">
{!! __('Showing') !!}
<span class="fw-semibold">{{ $paginator->firstItem() }}</span>
{!! __('to') !!}
<span class="fw-semibold">{{ $paginator->lastItem() }}</span>
{!! __('of') !!}
<span class="fw-semibold">{{ $paginator->total() }}</span>
{!! __('results') !!}
</p>
</div>
<div>
<ul class="pagination">
{{-- Previous Page Link --}}
@if ($paginator->onFirstPage())
<li class="page-item disabled" aria-disabled="true" aria-label="@lang('pagination.previous')">
<span class="page-link" aria-hidden="true">&lsaquo;</span>
</li>
@else
<li class="page-item">
<button type="button" dusk="previousPage{{ $paginator->getPageName() == 'page' ? '' : '.' . $paginator->getPageName() }}" class="page-link" wire:click="previousPage('{{ $paginator->getPageName() }}')" x-on:click="{{ $scrollIntoViewJsSnippet }}" wire:loading.attr="disabled" aria-label="@lang('pagination.previous')">&lsaquo;</button>
</li>
@endif
{{-- Pagination Elements --}}
@foreach ($elements as $element)
{{-- "Three Dots" Separator --}}
@if (is_string($element))
<li class="page-item disabled" aria-disabled="true"><span class="page-link">{{ $element }}</span></li>
@endif
{{-- Array Of Links --}}
@if (is_array($element))
@foreach ($element as $page => $url)
@if ($page == $paginator->currentPage())
<li class="page-item active" wire:key="paginator-{{ $paginator->getPageName() }}-page-{{ $page }}" aria-current="page"><span class="page-link">{{ $page }}</span></li>
@else
<li class="page-item" wire:key="paginator-{{ $paginator->getPageName() }}-page-{{ $page }}"><button type="button" class="page-link" wire:click="gotoPage({{ $page }}, '{{ $paginator->getPageName() }}')" x-on:click="{{ $scrollIntoViewJsSnippet }}">{{ $page }}</button></li>
@endif
@endforeach
@endif
@endforeach
{{-- Next Page Link --}}
@if ($paginator->hasMorePages())
<li class="page-item">
<button type="button" dusk="nextPage{{ $paginator->getPageName() == 'page' ? '' : '.' . $paginator->getPageName() }}" class="page-link" wire:click="nextPage('{{ $paginator->getPageName() }}')" x-on:click="{{ $scrollIntoViewJsSnippet }}" wire:loading.attr="disabled" aria-label="@lang('pagination.next')">&rsaquo;</button>
</li>
@else
<li class="page-item disabled" aria-disabled="true" aria-label="@lang('pagination.next')">
<span class="page-link" aria-hidden="true">&rsaquo;</span>
</li>
@endif
</ul>
</div>
</div>
</nav>
@endif
</div>

View File

@ -0,0 +1,53 @@
@php
if (! isset($scrollTo)) {
$scrollTo = 'body';
}
$scrollIntoViewJsSnippet = ($scrollTo !== false)
? <<<JS
(\$el.closest('{$scrollTo}') || document.querySelector('{$scrollTo}')).scrollIntoView()
JS
: '';
@endphp
<div>
@if ($paginator->hasPages())
<nav>
<ul class="pagination">
{{-- Previous Page Link --}}
@if ($paginator->onFirstPage())
<li class="page-item disabled" aria-disabled="true">
<span class="page-link">@lang('pagination.previous')</span>
</li>
@else
@if(method_exists($paginator,'getCursorName'))
<li class="page-item">
<button dusk="previousPage" type="button" class="page-link" wire:key="cursor-{{ $paginator->getCursorName() }}-{{ $paginator->previousCursor()->encode() }}" wire:click="setPage('{{$paginator->previousCursor()->encode()}}','{{ $paginator->getCursorName() }}')" x-on:click="{{ $scrollIntoViewJsSnippet }}" wire:loading.attr="disabled">@lang('pagination.previous')</button>
</li>
@else
<li class="page-item">
<button type="button" dusk="previousPage{{ $paginator->getPageName() == 'page' ? '' : '.' . $paginator->getPageName() }}" class="page-link" wire:click="previousPage('{{ $paginator->getPageName() }}')" x-on:click="{{ $scrollIntoViewJsSnippet }}" wire:loading.attr="disabled">@lang('pagination.previous')</button>
</li>
@endif
@endif
{{-- Next Page Link --}}
@if ($paginator->hasMorePages())
@if(method_exists($paginator,'getCursorName'))
<li class="page-item">
<button dusk="nextPage" type="button" class="page-link" wire:key="cursor-{{ $paginator->getCursorName() }}-{{ $paginator->nextCursor()->encode() }}" wire:click="setPage('{{$paginator->nextCursor()->encode()}}','{{ $paginator->getCursorName() }}')" x-on:click="{{ $scrollIntoViewJsSnippet }}" wire:loading.attr="disabled">@lang('pagination.next')</button>
</li>
@else
<li class="page-item">
<button type="button" dusk="nextPage{{ $paginator->getPageName() == 'page' ? '' : '.' . $paginator->getPageName() }}" class="page-link" wire:click="nextPage('{{ $paginator->getPageName() }}')" x-on:click="{{ $scrollIntoViewJsSnippet }}" wire:loading.attr="disabled">@lang('pagination.next')</button>
</li>
@endif
@else
<li class="page-item disabled" aria-disabled="true">
<span class="page-link">@lang('pagination.next')</span>
</li>
@endif
</ul>
</nav>
@endif
</div>

View File

@ -0,0 +1,56 @@
@php
if (! isset($scrollTo)) {
$scrollTo = 'body';
}
$scrollIntoViewJsSnippet = ($scrollTo !== false)
? <<<JS
(\$el.closest('{$scrollTo}') || document.querySelector('{$scrollTo}')).scrollIntoView()
JS
: '';
@endphp
<div>
@if ($paginator->hasPages())
<nav role="navigation" aria-label="Pagination Navigation" class="flex justify-between">
<span>
{{-- Previous Page Link --}}
@if ($paginator->onFirstPage())
<span class="relative inline-flex items-center px-4 py-2 text-sm font-medium text-gray-500 bg-white border border-gray-300 cursor-default leading-5 rounded-md dark:text-gray-600 dark:bg-gray-800 dark:border-gray-600">
{!! __('pagination.previous') !!}
</span>
@else
@if(method_exists($paginator,'getCursorName'))
<button type="button" dusk="previousPage" wire:key="cursor-{{ $paginator->getCursorName() }}-{{ $paginator->previousCursor()->encode() }}" wire:click="setPage('{{$paginator->previousCursor()->encode()}}','{{ $paginator->getCursorName() }}')" x-on:click="{{ $scrollIntoViewJsSnippet }}" wire:loading.attr="disabled" class="relative inline-flex items-center px-4 py-2 text-sm font-medium text-gray-700 bg-white border border-gray-300 leading-5 rounded-md hover:text-gray-500 focus:outline-none focus:ring ring-blue-300 focus:border-blue-300 active:bg-gray-100 active:text-gray-700 transition ease-in-out duration-150 dark:bg-gray-800 dark:border-gray-600 dark:text-gray-300 dark:focus:border-blue-700 dark:active:bg-gray-700 dark:active:text-gray-300">
{!! __('pagination.previous') !!}
</button>
@else
<button
type="button" wire:click="previousPage('{{ $paginator->getPageName() }}')" x-on:click="{{ $scrollIntoViewJsSnippet }}" wire:loading.attr="disabled" dusk="previousPage{{ $paginator->getPageName() == 'page' ? '' : '.' . $paginator->getPageName() }}" class="relative inline-flex items-center px-4 py-2 text-sm font-medium text-gray-700 bg-white border border-gray-300 leading-5 rounded-md hover:text-gray-500 focus:outline-none focus:ring ring-blue-300 focus:border-blue-300 active:bg-gray-100 active:text-gray-700 transition ease-in-out duration-150 dark:bg-gray-800 dark:border-gray-600 dark:text-gray-300 dark:focus:border-blue-700 dark:active:bg-gray-700 dark:active:text-gray-300">
{!! __('pagination.previous') !!}
</button>
@endif
@endif
</span>
<span>
{{-- Next Page Link --}}
@if ($paginator->hasMorePages())
@if(method_exists($paginator,'getCursorName'))
<button type="button" dusk="nextPage" wire:key="cursor-{{ $paginator->getCursorName() }}-{{ $paginator->nextCursor()->encode() }}" wire:click="setPage('{{$paginator->nextCursor()->encode()}}','{{ $paginator->getCursorName() }}')" x-on:click="{{ $scrollIntoViewJsSnippet }}" wire:loading.attr="disabled" class="relative inline-flex items-center px-4 py-2 text-sm font-medium text-gray-700 bg-white border border-gray-300 leading-5 rounded-md hover:text-gray-500 focus:outline-none focus:ring ring-blue-300 focus:border-blue-300 active:bg-gray-100 active:text-gray-700 transition ease-in-out duration-150 dark:bg-gray-800 dark:border-gray-600 dark:text-gray-300 dark:focus:border-blue-700 dark:active:bg-gray-700 dark:active:text-gray-300">
{!! __('pagination.next') !!}
</button>
@else
<button type="button" wire:click="nextPage('{{ $paginator->getPageName() }}')" x-on:click="{{ $scrollIntoViewJsSnippet }}" wire:loading.attr="disabled" dusk="nextPage{{ $paginator->getPageName() == 'page' ? '' : '.' . $paginator->getPageName() }}" class="relative inline-flex items-center px-4 py-2 text-sm font-medium text-gray-700 bg-white border border-gray-300 leading-5 rounded-md hover:text-gray-500 focus:outline-none focus:ring ring-blue-300 focus:border-blue-300 active:bg-gray-100 active:text-gray-700 transition ease-in-out duration-150 dark:bg-gray-800 dark:border-gray-600 dark:text-gray-300 dark:focus:border-blue-700 dark:active:bg-gray-700 dark:active:text-gray-300">
{!! __('pagination.next') !!}
</button>
@endif
@else
<span class="relative inline-flex items-center px-4 py-2 text-sm font-medium text-gray-500 bg-white border border-gray-300 cursor-default leading-5 rounded-md dark:text-gray-600 dark:bg-gray-800 dark:border-gray-600">
{!! __('pagination.next') !!}
</span>
@endif
</span>
</nav>
@endif
</div>

Some files were not shown because too many files have changed in this diff Show More