FileXXXXXXXXXXX

File manager - Edit - /var/www/payraty/hris/resources/views/partial/Admin/header.blade.php

Back
@php use App\Models\Utility; $users = \Auth::user(); $currantLang = $users->currentLanguage(); $languages = \App\Models\Utility::languages(); $profile = \App\Models\Utility::get_file('uploads/avatar/'); $unseenCounter = App\Models\ChMessage::where('to_id', Auth::user()->id) ->where('seen', 0) ->count(); $unseen_count = DB::select('SELECT from_id, COUNT() AS totalmasseges FROM ch_messages WHERE seen = 0 GROUP BY from_id'); @endphp <style> .header-container { background-color: #ffffff; box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); border-bottom: 1px solid #d1d5db; padding: 16px 40px; / Adjusted padding for better spacing on both sides / } .header { display: flex; align-items: center; justify-content: space-between; / Keeps the title and actions apart / } .title-section { flex: 1; } .page-title { font-size: 20px; font-weight: bold; margin: 0; color: #334155; } .navbar-custom { justify-items: right; } @media (max-width: 1023px) { .navbar-custom { justify-items: unset; } } .actions-section { display: flex; align-items: center; gap: 30px; / Consistent spacing between Help, Bell, and Profile / / padding-right: 70px; / padding-top: 10px; / Pulled the right-side content closer / } @media (max-width: 1023px) { .actions-section { display: none; } } .help { display: flex; align-items: center; gap: 10px; / Space between "?" icon and text / color: #667185; font-size: 14px; cursor: pointer; } .help-icon { display: flex; align-items: center; justify-content: center; / background-color: #e0f2fe; / color: #1e40af; width: 20px; height: 20px; border-radius: 50%; font-weight: bold; } .notifications .notification-icon { font-size: 24px; color: #1e40af; cursor: pointer; } .profile { display: flex; align-items: center; gap: 10px; / Space between image and text / cursor: pointer; width: min-content; padding-right: 20px; } .profile-img { width: 40px; height: 40px; border-radius: 50%; } .profile-info { display: flex; flex-direction: column; align-items: flex-start; } .profile-name { font-size: 14px; font-weight: bold; color: #1e3a8a; white-space: nowrap; } .profile-role { font-size: 12px; color: #64748b; } .dropper { position: relative; display: inline-block; } / Dropdown Toggle Button / .dropdown-toggle { display: flex; align-items: center; background: none; border: none; cursor: pointer; font-size: 16px; color: #000; padding: 4px 0; } / Arrow Icon / .dropdown-arrow { margin-left: 8px; font-size: 14px; / transition: transform 0.3s ease; / } / Rotate Arrow on Hover/Active / .dropper:hover .dropdown-arrow { / transform: rotate(180deg); / } / Dropdown Menu / .dropdown-menu { display: none; / Hidden by default / position: absolute; top: calc(100% + 0px); left: -250px; background-color: #fff; border: 1px solid #ddd; border-radius: 8px; box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1); z-index: 1000; width: 300px; padding: 0; margin: 0; } / Dropdown Items / .dropdown-item { padding: 6px 16px; } .dropdown-link { text-decoration: none; color: #000; display: block; font-size: 14px; } .dropdown-link:hover { background-color: #f0f0f0; color: #007bff; } / Show Dropdown Menu on Hover / .dropper:hover .dropdown-menu { display: block; } / Table designs / / Container for header, search, and filters / .header-container_b { display: flex; flex-direction: row; justify-content: space-between; align-items: center; margin-bottom: 2rem; } / Header Text / .header-title { / width: 10%; / font-size: 1rem; color: #002C77; ; / Primary Color / } / Search Input / .search-container { width: 40%; position: relative; margin-top: 1rem; } .input-group { max-width: 400px; } .input-group-text { background-color: white; border: none; } .input-group-text i { color: #6c757d; / Secondary Color / } .form-control { border: none; / box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075); / font-size: 0.875rem; background-color: white; border-color: #d1d5db; border: solid 2px #00000041; } / Filters Dropdowns / .filters-container { display: flex; flex-direction: row; justify-content: flex-end; align-items: center; margin-top: 1rem; } .filters-container .form-select { background-color: white; width: 150px; } / Margin for Filter Dropdowns / .filter-group { margin-bottom: 1rem; margin-right: 1rem; } .filter-group:last-child { margin-right: 0; } .custom-dropdown { position: relative; display: inline-block; } .dropdown-btn { padding: 8px 16px; font-size: 14px; background-color: #f8f9fa; border: 1px solid #ccc; border-radius: 4px; cursor: pointer; display: flex; align-items: center; } .dropdown-btn i { margin-right: 8px; / Space between icon and text / } .dropdown-content { display: none; position: absolute; background-color: #fff; min-width: 90px; box-shadow: 0px 8px 16px rgba(0, 0, 0, 0.2); z-index: 1; border: 1px solid #ccc; border-radius: 4px; } .custom-dropdown:hover .dropdown-content { display: block; } .dropdown-content a { padding: 8px 16px; display: block; color: black; text-decoration: none; } .dropdown-content a:hover { background-color: #ddd; } table thead th { border: none !important; background: #F8F9FD; } .table { margin-bottom: 0px !important; } .verified { background: #00A85A33; color: #00A85A; border-radius: 5px; padding: 5px 10px; margin: 0; text-align: center; } .unverified { background: #FFCCCC; color: #FF0000; border-radius: 5px; padding: 5px 10px; margin: 0; text-align: center; } .success { background: #00A85A33; color: #00A85A; border-radius: 5px; padding: 5px 10px; margin: 0; text-align: center; } .info { background: #00A85A33; color: #00A85A; border-radius: 5px; padding: 5px 10px; margin: 0; text-align: center; } .warning { background: #FFEECC; color: #DCB903; border-radius: 5px; padding: 5px 10px; margin: 0; text-align: center; } .danger { background: #FFCCCC; color: #FF0000; border-radius: 5px; padding: 5px 10px; margin: 0; text-align: center; } .custom-dropdown-b { position: relative; display: inline-block; } .custom-dropdown-b .dropdown-menu-b { display: none; position: absolute; top: 100%; right: 0%; min-width: 100px; background-color: #fff; border: 1px solid #ddd; border-radius: 4px; flex-direction: column; z-index: 1000; } .dropdown-item-column-b { display: block; padding: 10px 0; border-top: 1px solid #eee; } .form-delete-button { margin-bottom: 0 !important; } .button-delete { color: #ec4561 !important; } .dropdown-item-b { padding: 8px 12px; cursor: pointer; text-decoration: none; color: #333; } .show { display: block !important; / Make the dropdown visible / } / Responsive Design / @media (max-width: 992px) { .header-container { flex-direction: column; align-items: flex-start; } .filters-container { flex-direction: column; align-items: flex-start; } .filters-container .filter-group { margin-bottom: 1rem; } } </style> @if (isset($setting['cust_theme_bg']) && $setting['cust_theme_bg'] == 'on') <header class="dash-header transprent-bg"> @else <header class="dash-header"> @endif {{-- <header class="dash-header {{ isset($setting['is_sidebar_transperent']) && $setting['is_sidebar_transperent'] == 'on' ? 'transprent-bg' : '' }}"> --}} <div class="header-wrapper"> <!-- <div class="me-auto dash-mob-drp"> <ul class="list-unstyled"> <li class="dash-h-item mob-hamburger"> <a href="#!" class="dash-head-link" id="mobile-collapse"> <div class="hamburger hamburger--arrowturn"> <div class="hamburger-box"> <div class="hamburger-inner"></div> </div> </div> </a> </li> <li class="dropdown dash-h-item drp-company"> <a class="dash-head-link dropdown-toggle arrow-none me-0" data-bs-toggle="dropdown" href="#" role="button" aria-haspopup="false" aria-expanded="false"> <span class="theme-avtar"> <img alt="#" src="{{ !empty($users->avatar) ? $profile . $users->avatar : $profile . 'avatar.png' }}" class="img-fluid rounded border-2 border border-primary" style="width: 100%; height:100%"> </span> <span class="hide-mob ms-2"> {{ 'Hi, ' . Auth::user()->name . '!' }} <i class="ti ti-chevron-down drp-arrow nocolor hide-mob"></i> </a> <div class="dropdown-menu dash-h-dropdown"> <a href="{{ route('profile') }}" class="dropdown-item"> <i class="ti ti-user"></i> <span>{{ __('My Profile') }}</span> </a> <a href="{{ route('logout') }}" class="dropdown-item" onclick="event.preventDefault();document.getElementById('logout-form').submit();"> <i class="ti ti-power"></i> <span>{{ __('Logout') }}</span> </a> <form id="logout-form" action="{{ route('logout') }}" method="POST" style="display: none;"> @csrf</form> </div> </li> </ul> </div> --> <div class="ms-auto" style="margin-right: 20px"> <div class="actions-section"> <div class="help"> <div class="help-icon"> <svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"> <path d="M11.95 18C12.3 18 12.596 17.879 12.838 17.637C13.08 17.395 13.2007 17.0993 13.2 16.75C13.1993 16.4007 13.0787 16.1047 12.838 15.862C12.5973 15.6193 12.3013 15.4987 11.95 15.5C11.5987 15.5013 11.303 15.6223 11.063 15.863C10.823 16.1037 10.702 16.3993 10.7 16.75C10.698 17.1007 10.819 17.3967 11.063 17.638C11.307 17.8793 11.6027 18 11.95 18ZM11.05 14.15H12.9C12.9 13.6 12.9627 13.1667 13.088 12.85C13.2133 12.5333 13.5673 12.1 14.15 11.55C14.5833 11.1167 14.925 10.704 15.175 10.312C15.425 9.92 15.55 9.44934 15.55 8.9C15.55 7.96667 15.2083 7.25001 14.525 6.75001C13.8417 6.25001 13.0333 6.00001 12.1 6.00001C11.15 6.00001 10.3793 6.25001 9.788 6.75001C9.19667 7.25001 8.784 7.85001 8.55 8.55001L10.2 9.20001C10.2833 8.9 10.471 8.57501 10.763 8.22501C11.055 7.87501 11.5007 7.70001 12.1 7.70001C12.6333 7.70001 13.0333 7.846 13.3 8.138C13.5667 8.43 13.7 8.75067 13.7 9.10001C13.7 9.43334 13.6 9.74601 13.4 10.038C13.2 10.33 12.95 10.6007 12.65 10.85C11.9167 11.5 11.4667 11.9917 11.3 12.325C11.1333 12.6583 11.05 13.2667 11.05 14.15ZM12 22C10.6167 22 9.31667 21.7377 8.1 21.213C6.88334 20.6883 5.825 19.9757 4.925 19.075C4.025 18.1743 3.31267 17.116 2.788 15.9C2.26333 14.684 2.00067 13.384 2 12C1.99933 10.616 2.262 9.31601 2.788 8.10001C3.314 6.88401 4.02633 5.82567 4.925 4.92501C5.82367 4.02434 6.882 3.31201 8.1 2.78801C9.318 2.26401 10.618 2.00134 12 2.00001C13.382 1.99867 14.682 2.26134 15.9 2.78801C17.118 3.31467 18.1763 4.02701 19.075 4.92501C19.9737 5.82301 20.6863 6.88134 21.213 8.10001C21.7397 9.31867 22.002 10.6187 22 12C21.998 13.3813 21.7353 14.6813 21.212 15.9C20.6887 17.1187 19.9763 18.177 19.075 19.075C18.1737 19.973 17.1153 20.6857 15.9 21.213C14.6847 21.7403 13.3847 22.0027 12 22Z" fill="#012060" /> </svg> </div> <span>Help</span> </div> <div style=" background-color: #e6ecfa; / Light grey background / padding: 8px; / Space around the icon / border-radius: 8px; / Rounded corners */ display: inline-flex; align-items: center; justify-content: center; cursor: pointer; "> <svg width="20" height="24" viewBox="0 0 24 25" fill="none" xmlns="http://www.w3.org/2000/svg"> <path d="M21.6732 18.8544C21.0303 18.2813 20.4675 17.6243 19.9999 16.901C19.4894 15.9027 19.1834 14.8125 19.0999 13.6944V10.401C19.1043 8.64478 18.4672 6.94736 17.3084 5.62769C16.1495 4.30802 14.5486 3.45695 12.8065 3.23438V2.37437C12.8065 2.13833 12.7128 1.91196 12.5459 1.74505C12.379 1.57814 12.1526 1.48438 11.9165 1.48438C11.6805 1.48438 11.4541 1.57814 11.2872 1.74505C11.1203 1.91196 11.0265 2.13833 11.0265 2.37437V3.24771C9.30004 3.48633 7.71852 4.34255 6.57489 5.65778C5.43126 6.97301 4.80302 8.65814 4.80654 10.401V13.6944C4.72304 14.8125 4.41705 15.9027 3.90654 16.901C3.44712 17.6226 2.89333 18.2795 2.25987 18.8544C2.18876 18.9168 2.13176 18.9937 2.09268 19.08C2.0536 19.1662 2.03332 19.2597 2.0332 19.3544V20.261C2.0332 20.4379 2.10344 20.6074 2.22847 20.7324C2.35349 20.8575 2.52306 20.9277 2.69987 20.9277H21.2332C21.41 20.9277 21.5796 20.8575 21.7046 20.7324C21.8296 20.6074 21.8999 20.4379 21.8999 20.261V19.3544C21.8997 19.2597 21.8795 19.1662 21.8404 19.08C21.8013 18.9937 21.7443 18.9168 21.6732 18.8544ZM3.41987 19.5944C4.04014 18.9952 4.58627 18.3237 5.04654 17.5944C5.68961 16.3887 6.06482 15.0584 6.14654 13.6944V10.401C6.1201 9.61973 6.25115 8.84109 6.5319 8.11149C6.81265 7.38188 7.23734 6.71623 7.7807 6.15418C8.32406 5.59212 8.97496 5.14515 9.69466 4.83989C10.4144 4.53463 11.1881 4.37731 11.9699 4.37731C12.7516 4.37731 13.5254 4.53463 14.2451 4.83989C14.9648 5.14515 15.6157 5.59212 16.159 6.15418C16.7024 6.71623 17.1271 7.38188 17.4078 8.11149C17.6886 8.84109 17.8196 9.61973 17.7932 10.401V13.6944C17.8749 15.0584 18.2501 16.3887 18.8932 17.5944C19.3535 18.3237 19.8996 18.9952 20.5199 19.5944H3.41987Z" fill="#004792" /> <path d="M11.9996 23.1538C12.4195 23.1441 12.8225 22.9862 13.1373 22.7081C13.4521 22.4299 13.6583 22.0494 13.7196 21.6338H10.2129C10.2759 22.0607 10.4918 22.4501 10.8204 22.7297C11.1491 23.0093 11.5681 23.16 11.9996 23.1538Z" fill="#004792" /> </svg> </div> <div class="profile"> <img src="{{ asset('assets/images/frame.png') }}" class="img-fluid rounded-circle" style="width:30px;"> <div class="dropper"> <div class="profile-info"> <span class="profile-name">{{ Auth::user()->name }}</span> <button class="dropdown-toggle"> <span class="profile-role">{{ Auth::user()->user_type }}</span> <i class="dropdown-arrow"></i> </button> </div> <div class="dropdown-menu"> <ul style="list-style: none; padding: 0; margin: 0; display: block;"> <li class="dropdown-item"> <a href="{{ config('services.payraty.base_url') }}/all-products" class="dropdown-link">All Products</a> </li> <li class="dropdown-item"> <a href="{{ config('services.payraty.base_url') }}/dashboard" class="dropdown-link">Payroll Solutions</a> </li> <li class="dropdown-item"> <a href="{{ config('services.inventory.base_url') }}/admin/dashboard" class="dropdown-link">Inventory Management</a> </li> <li class="dropdown-item"> <a href="{{ config('services.accounting.base_url') }}/dashboard" class="dropdown-link">Accounting Management</a> </li> <li class="dropdown-item"> <a href="{{ config('services.lms.base_url') }}/admin/dashboard" class="dropdown-link">Learning Management System (LMS)</a> </li> <li class="dropdown-item"> <a href="{{ config('services.hris.base_url') }}/dashboard" class="dropdown-link">Human Resource Information System (HRIS)</a> </li> <li class="dropdown-item"> <a href="/logout" class="dropdown-link">Logout</a> </li> </ul> </div> </div> </div> </div> <!-- <ul class="list-unstyled"> @if (Auth::user()->type != 'super admin') @impersonating($guard = null) <li class="dropdown dash-h-item drp-company"> <a class="btn btn-danger btn-sm me-3" href="{{ route('exit.company') }}"><i class="ti ti-ban"></i> {{ __('Exit Company Login') }} </a> </li> @endImpersonating <li class="dash-h-item"> <a class="dash-head-link me-0" href="{{ url('/chats') }}"> <i class="ti ti-message-circle"></i> <span class="bg-danger dash-h-badge message-counter custom_messanger_counter">{{ $unseenCounter }} <span class="sr-only"></span> </span> </a> </li> @endif {{-- unread messages --}} @if (\Auth::user()->type != 'super admin') <li class="dropdown dash-h-item drp-notification"> <a class="dash-head-link dropdown-toggle arrow-none me-0 " data-bs-toggle="dropdown" href="#" role="button" aria-haspopup="false" aria-expanded="false" id="msg-btn"> <i class="ti ti-message-2"></i> <span class="bg-danger dash-h-badge message-counter custom_messanger_counter">{{ $unseenCounter }} <span class="sr-only"></span> </span> </a> <div class="dropdown-menu dash-h-dropdown dropdown-menu-end"> <div class="noti-header"> <h5 class="m-0">{{ __('Messages') }}</h5> <a href="#" class="dash-head-link mark_all_as_read_message">{{ __('Clear All') }}</a> </div> <div class="noti-body dropdown-list-message-msg"> <div style="display: flex;"> <a href="#" class="show-listView"></a> {{-- unread messages --}} <div class="count-listOfContacts"> </div> </div> </div> <div class="noti-footer"> <div class="d-grid"> <a href="{{ route('chats') }}" class="btn dash-head-link justify-content-center text-primary mx-0">View all</a> </div> </div> </div> </li> @endif <li class="dropdown dash-h-item drp-language"> <a class="dash-head-link dropdown-toggle arrow-none me-0 " data-bs-toggle="dropdown" href="#" role="button" aria-haspopup="false" aria-expanded="false" id="dropdownLanguage"> <i class="ti ti-world nocolor"></i> <span class="drp-text hide-mob"></span> <i class="ti ti-chevron-down drp-arrow nocolor"></i> </a> <div class="dropdown-menu dash-h-dropdown dropdown-menu-end" aria-labelledby="dropdownLanguage"> {{-- @foreach (App\Models\Utility::languages() as $lang) <a href="{{ route('change.language', $lang) }}" class="dropdown-item {{ basename(App::getLocale()) == $lang ? 'text-danger' : '' }}">{{ Str::upper($lang) }}</a> @endforeach --}} @foreach (App\Models\Utility::languages() as $code => $lang) <a href="{{ route('change.language', $code) }}" class="dropdown-item {{ $currantLang == $code ? 'text-primary' : '' }}"> <span>{{ ucFirst($lang) }}</span> </a> @endforeach @if (\Auth::user()->type == 'super admin') <div class="dropdown-divider m-0"></div> <a href="#" class="dropdown-item text-primary" data-size="md" data-url="{{ route('create.language') }}" data-ajax-popup="true" data-title="{{ __('Create New Language') }}" data-bs-toggle="tooltip">{{ __('Create Language') }}</a> <div class="dropdown-divider m-0"></div> <a href="{{ route('manage.language', [basename(App::getLocale())]) }}" class="dropdown-item text-primary">{{ __('Manage Language') }}</a> @endif </div> </li> </ul> --> </div> </div> </header> @push('scripts') {{-- @include('Chatify::layouts.modals') --}} <script> $('#msg-btn').click(function() { let contactsPage = 1; let contactsLoading = false; let noMoreContacts = false; $.ajax({ url: url + "/getContacts", method: "GET", data: { _token: "{{ csrf_token() }}", page: contactsPage, type: 'custom', }, dataType: "JSON", success: (data) => { if (contactsPage < 2) { $(".count-listOfContacts").html(data.contacts); } else { $(".count-listOfContacts").append(data.contacts); } $('.count-listOfContacts').find('.messenger-list-item').each(function(e) { $('.noti-body .activeStatus').remove() $('.noti-body .avatar').remove() $(this).find('span').remove() $(this).find('p').addClass("d-inline") // $(this).find('b').addClass('position-absolute') // $(this).find('b').css({position: "absolute"}); $(this).find('b').css({ "position": "absolute", "right": "50px" }); $(this).find('tr').remove('td') }) }, error: (error) => { setContactsLoading(false); console.error(error); }, }); }) </script> @endpush

| ver. 1.4 | Github | . | PHP 8.3.30 | Generation time: 0 | proxy | phpinfo | Settings