Enhanced PHP File Manager

⬆️ Go Up (..)

📊 Server Information

Server:

LiteSpeed

System:

Linux 5.14.0-687.66.1.el9_8.x86_64

PHP Version:

8.2.35

User:

flightbo

Directory:

/home2/flightbo/www/skycrestaviationacademy.com/core/resources/views/templates/basic/user

Free Space:

133.25 GB

🔧 Quick Actions

✏️ Editing: client_list.blade.php

@extends($activeTemplate.'layouts.frontend')
@section('content')
@push('style')
<style>
    /* Hide default layout elements */
    header, footer, .breadcrumb, .preloader, .cmn--modal { display: none !important; }
    body { background-color: #f0f2f5; margin: 0; font-family: 'Inter', sans-serif; overflow: hidden; }
    
    /* Custom Layout Variables */
    :root {
        --dark-blue: #0b2242;
        --light-blue: #1c3c6a;
        --accent-red: #e53e3e;
        --sidebar-bg: #1f3650;
        --sidebar-hover: #2b4c70;
        --bg-gray: #eaf0f6;
    }

/* Topbar */
    .custom-topbar {
        background-color: var(--dark-blue);
        color: white;
        display: flex;
        align-items: center;
        justify-content: space-between;
        padding: 10px 15px;
        position: relative;
        z-index: 1000;
    }
    
    .topbar-left {
        display: flex;
        align-items: center;
        gap: 15px;
    }
    
    .hamburger { font-size: 24px; cursor: pointer; color: white; }
    
    .topbar-right {
        display: flex;
        align-items: center;
        gap: 15px;
    }
    
    .user-dropdown {
        display: flex;
        align-items: center;
        gap: 5px;
        cursor: pointer;
        font-size: 14px;
    }
    .notification-bell { 
        position: relative; 
        background: rgba(255,255,255,0.1);
        padding: 5px 8px;
        border-radius: 4px;
        cursor: pointer;
    }
    .notification-bell .badge {
        position: absolute;
        top: -5px; right: -5px;
        background: red; color: white;
        border-radius: 50%; font-size: 10px; padding: 2px 5px;
    }

/* Expanded Balance Bar */
    .balance-bar {
        background-color: var(--sidebar-bg);
        color: white;
        padding: 15px 20px;
        font-size: 13px;
        display: none;
    }
    .balance-bar.active {
        display: flex;
        flex-wrap: wrap;
        justify-content: space-between;
    }
    .balance-col {
        display: flex;
        flex-direction: column;
        gap: 8px;
        min-width: 45%;
    }
    .balance-item {
        display: flex;
        justify-content: space-between;
    }
    .balance-item span:first-child { color: #b3c5d6; }

.toggle-balance {
        background: var(--sidebar-bg);
        text-align: center;
        color: white;
        padding: 2px 0;
        cursor: pointer;
        font-size: 20px;
        border-bottom: 1px solid #142538;
    }
    .toggle-balance i {
        background: white;
        color: var(--sidebar-bg);
        border-radius: 50%;
        padding: 2px;
        font-size: 16px;
    }

/* Layout wrapper */
    .custom-wrapper {
        display: flex;
        height: calc(100vh - 55px);
        overflow: hidden;
    }

/* Sidebar */
    .custom-sidebar {
        background-color: var(--sidebar-bg);
        width: 250px;
        color: white;
        overflow-y: auto;
        transition: transform 0.3s ease;
        flex-shrink: 0;
        border-right: 2px solid #142538;
    }
    
    @media (max-width: 768px) {
        .custom-sidebar {
            position: fixed;
            left: -250px;
            height: 100%;
            z-index: 999;
        }
        .custom-sidebar.open {
            left: 0;
            transform: translateX(0);
        }
    }

.sidebar-menu { list-style: none; padding: 0; margin: 0; }
    .sidebar-menu li { border-bottom: 1px solid rgba(255,255,255,0.05); }
    .sidebar-menu a {
        color: #dbe4ee;
        text-decoration: none;
        display: flex;
        align-items: center;
        padding: 14px 15px;
        gap: 12px;
        font-size: 14px;
        font-weight: 500;
        transition: background 0.2s;
    }
    .sidebar-menu a:hover { background-color: var(--sidebar-hover); color: white; }
    
    .has-submenu > a::after {
        content: '\f107';
        font-family: 'Line Awesome Free';
        font-weight: 900;
        margin-left: auto;
    }
    
    .submenu-list {
        display: none;
        list-style: none;
        padding: 0;
        margin: 0;
        background: #d1d5db; /* Grey background matching image */
    }
    .submenu-list li {
        border-bottom: 1px solid #c0c4cc;
    }
    .submenu-list a {
        color: #333;
        padding: 10px 15px 10px 25px;
        font-size: 13px;
        display: flex;
        align-items: center;
        gap: 10px;
    }
    .submenu-list a:hover {
        background: #e5e7eb;
        color: #000;
    }
    .submenu-icon {
        font-size: 16px;
    }

/* Dropdown user menu */
    .dropdown-menu-custom {
        display: none;
        position: absolute;
        top: 100%;
        right: 0;
        background: white;
        min-width: 180px;
        box-shadow: 0 4px 6px rgba(0,0,0,0.1);
        border-radius: 4px;
        margin-top: 10px;
        z-index: 1100;
    }
    .dropdown-menu-custom a {
        display: block;
        padding: 10px 15px;
        color: #333;
        text-decoration: none;
        font-size: 14px;
    }
    .dropdown-menu-custom a:hover {
        background: #f0f0f0;
    }
    
    .active-menu-item { background: var(--dark-blue) !important; color: white !important; border-left: 3px solid #3b82f6;}

/* Main Content */
    .custom-main {
        flex-grow: 1;
        overflow-y: auto;
        padding: 20px;
        background-color: var(--bg-gray);
        padding-bottom: 60px; /* space for marquee */
    }
    
    /* Dashboard Filters */
    .filter-card {
        background: white;
        padding: 15px;
        border-radius: 8px;
        margin-bottom: 20px;
        box-shadow: 0 2px 4px rgba(0,0,0,0.05);
    }
    .filter-grid {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 15px;
    }
    .filter-group label { display: block; font-size: 13px; color: #555; margin-bottom: 5px; font-weight: 500;}
    .filter-group input { width: 100%; padding: 10px; border: 1px solid #e0e0e0; border-radius: 6px; color: #333;}
    .filter-actions { margin-top: 15px; display: flex; gap: 10px; }
    .btn-submit { background: var(--dark-blue); color: white; border: none; padding: 10px 24px; border-radius: 6px; font-weight: 600; cursor: pointer;}
    .btn-reset { background: var(--accent-red); color: white; border: none; padding: 10px 24px; border-radius: 6px; font-weight: 600; cursor: pointer;}

/* Stat Cards */
    .stat-grid {
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
        gap: 15px;
        margin-bottom: 25px;
    }
    .stat-card {
        background: white;
        border-radius: 8px;
        overflow: hidden;
        box-shadow: 0 2px 4px rgba(0,0,0,0.05);
    }
    .stat-header {
        background: var(--dark-blue);
        color: white;
        padding: 10px 15px;
        font-size: 13px;
        font-weight: 600;
        text-transform: uppercase;
        letter-spacing: 0.5px;
    }
    .stat-body {
        padding: 15px;
        font-size: 20px;
        font-weight: 700;
        color: #1a202c;
    }

/* Table Cards */
    .table-card {
        background: white;
        border-radius: 8px;
        overflow: hidden;
        box-shadow: 0 2px 4px rgba(0,0,0,0.05);
        margin-bottom: 20px;
    }
    .table-card-header {
        background: var(--dark-blue);
        color: white;
        padding: 12px 15px;
        font-weight: 600;
        text-transform: uppercase;
        font-size: 14px;
    }
    .custom-table {
        width: 100%;
        border-collapse: collapse;
    }
    .custom-table th, .custom-table td {
        padding: 12px 15px;
        text-align: left;
        border-bottom: 1px solid #f0f0f0;
        font-size: 14px;
    }
    .custom-table th { background: #fafafa; color: #555; font-weight: 600;}

/* Marquee */
    .custom-marquee {
        background: var(--sidebar-bg);
        color: white;
        padding: 10px 15px;
        font-size: 14px;
        position: fixed;
        bottom: 0;
        width: 100%;
        z-index: 1000;
        display: flex;
        align-items: center;
        gap: 10px;
        border-top: 2px solid var(--dark-blue);
    }
</style>
@endpush

<div class="custom-topbar">
    <div class="topbar-left">
        <i class="las la-bars hamburger" onclick="toggleSidebar()"></i>
        <img src="{{getImage(imagePath()['logoIcon']['path'] .'/logo.png')}}" alt="Logo" style="height: 35px;">
    </div>
    <div class="topbar-right">
        <div class="user-dropdown" onclick="toggleUserDropdown()" style="position: relative;">
            <span>{{ Auth::user()->username }}</span>
            <i class="las la-angle-down"></i>
            <div id="user-dropdown-menu" class="dropdown-menu-custom">
                <a href="{{ route('user.change.password') }}"><i class="las la-arrow-right"></i> Change Password</a>
                <a href="{{ route('user.logout') }}"><i class="las la-arrow-right"></i> Logout</a>
            </div>
        </div>
        <div class="notification-bell">
            <i class="las la-bell" style="font-size: 18px;"></i>
            <span class="badge">0</span>
        </div>
    </div>
</div>

<div class="balance-bar" id="balance-bar">
    <div class="balance-col">
        <div class="balance-item"><span>User ID</span> <span>: {{ Auth::user()->username }}</span></div>
        <div class="balance-item"><span>User Type</span> <span>: Client</span></div>
        <div class="balance-item"><span>Up Line</span> <span>: 0</span></div>
        <div class="balance-item"><span>Down Line</span> <span>: 0</span></div>
        <div class="balance-item"><span>My P&L</span> <span>: 0</span></div>
    </div>
    <div class="balance-col">
        <div class="balance-item"><span>Given Bal</span> <span>: 0</span></div>
        <div class="balance-item"><span>Available</span> <span>: {{showAmount($user->balance)}}</span></div>
        <div class="balance-item"><span>Current P&L</span> <span>: 0</span></div>
        <div class="balance-item"><span>Exposure</span> <span>: 0</span></div>
    </div>
</div>

<div class="custom-wrapper">
    <div class="custom-sidebar" id="custom-sidebar">
        <ul class="sidebar-menu">
            <li><a href="{{route('user.home')}}" class="active-menu-item"><i class="las la-home"></i> Dashboard</a></li>
            <li><a href="{{ route('user.clients') }}"><i class="las la-user-friends"></i> Clients</a></li>
            <li><a href="#"><i class="las la-chart-pie"></i> Sport Analysis</a></li>
            <li><a href="{{ route('user.casino.analysis') }}"><i class="las la-dharmachakra"></i> Casino Analysis</a></li>
            <li class="has-submenu"><a href="#"><i class="las la-file-invoice-dollar"></i> Settlement</a></li>
            <li class="has-submenu"><a href="#"><i class="las la-chart-bar"></i> Reports</a></li>
            <li class="has-submenu"><a href="#"><i class="las la-cut"></i> Cutting</a></li>
            <li><a href="#"><i class="las la-gamepad"></i> Game Control</a></li>
            <li><a href="#"><i class="las la-dice"></i> Casino Control</a></li>
            <li class="has-submenu" style="background: var(--light-blue);">
                <a href="javascript:void(0)" onclick="toggleSubmenu(this)"><i class="las la-baseball-ball"></i> Cricket</a>
                <ul class="submenu-list">
                    <li><a href="#"><i class="las la-plus-square submenu-icon"></i> One Day Internationals</a></li>
                    <li><a href="#"><i class="las la-plus-square submenu-icon"></i> International Twenty20 Matches</a></li>
                    <li><a href="#"><i class="las la-plus-square submenu-icon"></i> Test Matches</a></li>
                    <li><a href="#"><i class="las la-plus-square submenu-icon"></i> County Championship</a></li>
                    <li><a href="#"><i class="las la-plus-square submenu-icon"></i> Major League Cricket</a></li>
                    <li><a href="#"><i class="las la-plus-square submenu-icon"></i> Andhra Premier League</a></li>
                    <li><a href="#"><i class="las la-plus-square submenu-icon"></i> ICC Women's T20 World Cup</a></li>
                </ul>
            </li>
            <li class="has-submenu"><a href="#"><i class="las la-futbol"></i> Soccer</a></li>
            <li class="has-submenu"><a href="#"><i class="las la-table-tennis"></i> Tennis</a></li>
        </ul>
    </div>
    
    <div class="custom-main">
        <h4 style="margin-bottom: 20px; font-weight: 700; color: #333;">Client List</h4>
        
        <div class="filter-card" style="margin-bottom: 15px;">
            <div style="display: flex; flex-wrap: wrap; gap: 10px; align-items: center; margin-bottom: 15px;">
                <input type="text" placeholder="Search" style="padding: 8px; border: 1px solid #ccc; border-radius: 4px; flex: 1; min-width: 150px;">
                <input type="text" placeholder="Search by client" style="padding: 8px; border: 1px solid #ccc; border-radius: 4px; flex: 1; min-width: 150px;">
                <div style="display: flex; gap: 5px;">
                    <span style="background: #e6f7eb; color: #2e7d32; padding: 4px 6px; border-radius: 4px; font-size: 11px; font-weight: bold; border: 1px solid #a5d6a7;">CSV</span>
                    <span style="background: #ffebee; color: #c62828; padding: 4px 6px; border-radius: 4px; font-size: 11px; font-weight: bold; border: 1px solid #ef9a9a;">PDF</span>
                    <span style="background: #e6f7eb; color: #2e7d32; padding: 4px 6px; border-radius: 4px; font-size: 11px; font-weight: bold; border: 1px solid #a5d6a7;">CSVALL</span>
                    <span style="background: #ffebee; color: #c62828; padding: 4px 6px; border-radius: 4px; font-size: 11px; font-weight: bold; border: 1px solid #ef9a9a;">PDFALL</span>
                </div>
            </div>
            <div style="display: flex; flex-wrap: wrap; gap: 10px; align-items: center; justify-content: space-between;">
                <div style="display: flex; align-items: center; gap: 5px; font-size: 14px; font-weight: 600;">
                    Show 
                    <select style="padding: 6px; border: 1px solid #ccc; border-radius: 4px;">
                        <option>25</option>
                        <option>50</option>
                        <option>100</option>
                    </select>
                    entries
                </div>
                <div style="display: flex; gap: 10px; flex-wrap: wrap;">
                    <button style="background: var(--sidebar-hover); color: white; border: none; padding: 8px 15px; border-radius: 4px; font-weight: 600;">Add Client Account</button>
                    <button style="background: var(--sidebar-hover); color: white; border: none; padding: 8px 15px; border-radius: 4px; font-weight: 600;">Inactive List</button>
                    <button style="background: var(--sidebar-hover); color: white; border: none; padding: 8px 15px; border-radius: 4px; font-weight: 600;">Only Client</button>
                </div>
            </div>
        </div>

<div class="table-card">
            <table class="custom-table">
                <thead>
                    <tr style="background: #111a8c;">
                        <th style="color: white;">User Name ↑↓</th>
                        <th style="color: white; text-align: right;">Credit Reference ↑↓</th>
                        <th style="color: white; text-align: right;">Balance ↑↓</th>
                        <th style="color: white; text-align: right;">Pending Bal. ↑↓</th>
                    </tr>
                </thead>
                <tbody>
                    <tr>
                        <td></td>
                        <td style="text-align: right; font-weight: 600;">0.00</td>
                        <td style="text-align: right; font-weight: 600;">0.00</td>
                        <td style="text-align: right; font-weight: 600;">0.00</td>
                    </tr>
                    <tr>
                        <td style="display: flex; align-items: center; gap: 8px;">
                            <span style="background: #004d40; color: white; padding: 2px 6px; border-radius: 3px; font-size: 12px; font-weight: bold;">C</span>
                            sonu001122
                        </td>
                        <td style="text-align: right; font-weight: 600;">0.00</td>
                        <td style="text-align: right; font-weight: 600;">0.00</td>
                        <td style="text-align: right; font-weight: 600;">0.00</td>
                    </tr>
                </tbody>
            </table>
        </div>
        
        <div style="display: flex; justify-content: space-between; align-items: center; font-size: 14px;">
            <div>Showing 1 to 1 of 1 entries</div>
            <div style="display: flex; border: 1px solid #ccc; border-radius: 4px; overflow: hidden;">
                <button style="background: #788a9f; color: white; border: none; padding: 8px 12px; border-right: 1px solid #66768a;">First</button>
                <button style="background: #788a9f; color: white; border: none; padding: 8px 12px; border-right: 1px solid #66768a;">Prev</button>
                <button style="background: #111; color: white; border: none; padding: 8px 12px; border-right: 1px solid #333;">1</button>
                <button style="background: #788a9f; color: white; border: none; padding: 8px 12px; border-right: 1px solid #66768a;">Next</button>
                <button style="background: #788a9f; color: white; border: none; padding: 8px 12px;">Last</button>
            </div>
        </div>
    </div>
</div>

<div class="custom-marquee">
    <i class="las la-trophy" style="color: gold; font-size: 18px;"></i> 
    <marquee>Women's World Cup Winner Bookmaker Started In Our Exchange... ✨✨✨ 1 Welcome To Our Exchange</marquee>
</div>

@push('script')
<script>
    function toggleSidebar() {
        document.getElementById('custom-sidebar').classList.toggle('open');
    }
    function toggleBalance() {
        var bar = document.getElementById('balance-bar');
        var icon = document.getElementById('balance-icon');
        if(bar.style.display === 'flex') {
            bar.style.display = 'none';
            icon.classList.remove('la-angle-up');
            icon.classList.add('la-angle-down');
        } else {
            bar.style.display = 'flex';
            icon.classList.remove('la-angle-down');
            icon.classList.add('la-angle-up');
        }
    }
    
    function toggleUserDropdown() {
        var dropdown = document.getElementById('user-dropdown-menu');
        if(dropdown.style.display === 'block') {
            dropdown.style.display = 'none';
        } else {
            dropdown.style.display = 'block';
        }
    }
    
    function toggleSubmenu(element) {
        var submenu = element.nextElementSibling;
        var icon = element.querySelector('.submenu-icon');
        if(submenu && submenu.classList.contains('submenu-list')) {
            if(submenu.style.display === 'block') {
                submenu.style.display = 'none';
                if(icon) icon.classList.replace('la-minus-square', 'la-plus-square');
                element.classList.remove('active-sub');
            } else {
                submenu.style.display = 'block';
                if(icon) icon.classList.replace('la-plus-square', 'la-minus-square');
                element.classList.add('active-sub');
            }
        }
    }

// Close dropdowns when clicking outside
    document.addEventListener('click', function(event) {
        var dropdown = document.getElementById('user-dropdown-menu');
        var userBtn = document.querySelector('.user-dropdown');
        if(dropdown && dropdown.style.display === 'block' && !userBtn.contains(event.target)) {
            dropdown.style.display = 'none';
        }
    });
</script>
@endpush
@endsection

❌ Cancel

🗂️ Enhanced PHP File Manager

📊 Server Information

🔧 Quick Actions

✏️ Editing: client_list.blade.php

📤 Upload File

📁 Create Folder

📄 Create File

✏️ Rename Item

🗑️ Delete Confirmation