File: /var/www/html/sarvodayahospital/resources/views/pages/home.blade.php
@extends('layouts.main')
@section('content')
<section class="banner-sec relative">
<div class="container">
<div class="row justify-content-between align-items-center pb-4 pb-md-0">
<div class="col-md-6">
<p class="fw-400 text-md-start text-center f-sm-18 mb-3 f-28 text-white banner-top-text">
Our Medical Experts are here for you.
</p>
<h1
class="text-white f-50 text-md-start text-center f-sm-24 fw-500 l-sm-19 mb-md-4 mb-3 banner-heading">
Get quality medical care and treatment with us.
</h1>
<p class="fw-400 text-md-start f-20 text-center f-sm-15 f-16 lh-19 text-white">
Find the required doctor and schedule your appointment now.
</p>
</div>
<div class="col-md-6 pt-md-5 text-md-end text-center">
<img class="img-fluid banner-img" src="{{ asset('img/group-doctor.png') }}" alt="Sarvodaya doctors"/>
</div>
</div>
</div>
</section>
<div class="pb-md-4 pt-md-0 py-3 tabbed-sec banner-points-box-sec absolute">
<div class="container">
<div class="row justify-content-center">
<div class="col-lg-10">
<div class="banner-points-box">
<form class="px-md-2 row px-4 align-items-center justify-content-center py-md-2 py-4"
id="call-back-form" method="GET" action="{{ route('make-an-appointment') }}">
<div class="col-md-4 pe-md-1">
<div class="input-group suggestion-search-box position-relative">
<span class="input-group-text">
<img src="{{ asset('img/user-blue.svg') }}" alt="Sarvodaya search icon" />
</span>
<input type="text" placeholder="Search for Doctor / Specialities"
class="form-control search-doctor-input-h" id="query" autocomplete="off" />
<input type="hidden" name="doctor" id="selectedDoctor" value="">
<input type="hidden" name="speciality" id="selectedSpeciality" value="">
<input type="hidden" name="hospital" id="selectedHospital" value="">
<input type="hidden" name="selectedDoctorT" id="selectedDoctorT" value="">
<input type="hidden" name="selectedSpecialityT" id="selectedSpecialityT" value="">
<input type="hidden" name="selectedHospitals" id="selectedHospitals" value="">
<input type="hidden" name="selectedHospitald" id="selectedHospitald" value="">
<!-- Suggestion Search Box -->
<div id="test1" style="display: none;">
<div class="suggestion-box-wrapper suggestion1">
<div class="suggestion-inner-content">
<div id="suggestion-box-result" class="suggestion-box specialities">
<h6 id="doctorResult" class="suggestion-total-count clrBlueDark f-16 fw-400 mb-2">Select Doctor</h6>
<ul class="suggestion-listing doctorResult"></ul>
<h6 id="specialityResult" class="suggestion-total-count clrBlueDark f-16 fw-400 mb-2 mt-1">Select Speciality</h6>
<ul class="suggestion-listing specialityResult"></ul>
</div>
</div>
{{-- <div class="apply-specialties-box d-flex align-items-center">
<button id="apply-doc-spec" type="button" class="btn btn-small btn-primary">Apply</button>
</div> --}}
</div>
</div>
<!-- Suggestion -->
<input type="hidden" id="search-id" name="search-id" />
</div>
</div>
<div class="col-md-5 pe-lg-1">
<div class="input-group suggestion-search-box position-relative location-suggestion-box">
<span class="input-group-text">
<img src="{{ asset('img/map-location.svg') }}" alt="Sarvodaya location marker" />
</span>
<input type="text" placeholder="Select Location" class="form-control border-0"
id="location" autocomplete="off" />
<!-- Suggestion Search Box -->
<div class="suggestion-box-wrapper" id="locationResult">
<div class="suggestion-inner-content">
<div class="suggestion-box specialities">
<div class="d-flex justify-content-between align-items-center appy-btn-fix ">
<h6 class="suggestion-total-count clrBlueDark f-16 fw-400 mb-2">
Select Location
</h6>
<div class="apply-specialties-box ">
<button type="button" class="btn btn-small btn-primary m-0"
id="apply-location">Apply
</button>
</div>
</div>
<ul class="suggestion-listing">
@foreach ($filteredHospitals as $hospital)
<li>
<input type="checkbox" id="location-{{ $hospital->Slug }}"
class="locationList"
data-location="{{ $hospital->HospitalShortName }},{{ $hospital->Location }}"
value="{{ $hospital->Slug }}">
<label
for="location{{ $loop->index }}">{{ $hospital->HospitalShortName }},
{{ $hospital->Location }}</label>
<span class="checkmark-doctor-search"></span>
</li>
@endforeach
</ul>
</div>
</div>
</div>
<!-- Suggestion -->
</div>
</div>
<div class="col-md-3 pe-md-1 ps-md-0 text-end">
<button type="submit" id="shree-map"
class="btn rounded-pill text-white f-16 py-3 fw-500 bgBlueDark w-100 btn-block mt-3 mt-md-0 call-btn">
Book Appointment
<img class="d-inline-block ms-3" src="{{ asset('img/right-arrow-white.svg') }}" alt="Sarvodaya Book Appointment" />
</button>
</div>
</form>
</div>
</div>
</div>
</div>
</div>
<section class="quick-access-sec mt-3">
<div class="container">
<div class="col-xl-11 px-xl-4 mx-auto">
<div class="row px-xl-3">
<div class="col-lg-3 col-6 mb-lg-0 mb-4">
<a href="{{ route('phc') }}" class="quick-sec-box border border-primary rounded-3 d-flex align-items-center text-decoration-none p-2 px-3">
<img src="{{ asset('img/dr-icon.svg') }}">
<span class="text-color ps-3 lh-1 color-5c5c5c">Get Health <br> Checkup</span>
<img src="{{ asset('img/arrow-new-cus.svg') }}" class="ms-auto d-md-inline-block d-none">
</a>
</div>
<div class="col-lg-3 col-6 mb-lg-0 mb-4">
<a href="https://www.housepital.in/" class="quick-sec-box border border-primary rounded-3 d-flex align-items-center text-decoration-none p-2 px-3" target="_blank">
<img src="{{ asset('img/homecare.svg') }}">
<span class="text-color ps-3 lh-1 color-5c5c5c">Homecare</span>
<img src="{{ asset('img/arrow-new-cus.svg') }}" class="ms-auto d-md-inline-block d-none">
</a>
</div>
<div class="col-lg-3 col-6 mb-lg-0 mb-4">
<a href="https://www.sarvodayadiagnostics.com/" class="quick-sec-box border border-primary rounded-3 d-flex align-items-center text-decoration-none p-2 px-3" target="_blank">
<img src="{{ asset('img/book-test.svg') }}">
<span class="text-color ps-3 lh-1 color-5c5c5c">Book a Test</span>
<img src="{{ asset('img/arrow-new-cus.svg') }}" class="ms-auto d-md-inline-block d-none">
</a>
</div>
<div class="col-lg-3 col-6 mb-lg-0 mb-4">
<a href="{{ route('international-patient') }}" class="quick-sec-box border border-primary rounded-3 d-flex align-items-center text-decoration-none p-2 px-3">
<img src="{{ asset('img/international-icon.svg') }}">
<span class="text-color ps-3 lh-1 color-5c5c5c">International Patients</span>
<img src="{{ asset('img/arrow-new-cus.svg') }}" class="ms-auto d-md-inline-block d-none">
</a>
</div>
</div>
</div>
</div>
</section>
<section class="pt-lg-4 py-3 mt-5 schedule-appointment-sec">
<div class="container">
<div class="row">
{{-- <div class="col-12">
<div class="row mb-md-5 mb-4 justify-content-center align-items-center">
<div class="col-md-6 clrBlueDark">
<div class="d-flex schedule align-items-center flex-column justrify-content-center">
<h3 class=" mb-0 f-sm-22 text-center">
<span class="f-25 f-sm-20">Schedule Your Appointment Online</span>
</h3>
<p class="f-20 mb-0 f-sm-14 text-center">Get 10% Discount on all In-Hospital appointments</p>
</div>
</div>
</div>
</div> --}}
<div class="col-12">
<div class="row">
<div class="col-md-10">
<h3 class="text-md-start f-sm-18 f-22 mb-3 clrBlueDark">
<span class="heading-line f-22 f-sm-22 fw-500">Our Specialities</span>
</h3>
</div>
</div>
</div>
<div class="col-lg-6">
<div class="owl-carousel our-specialist-slider">
@foreach ($specialities->chunk(3) as $speciality)
<div>
@foreach ($speciality as $s)
<a href="{{ route('specialities.show', $s->Slug) }}"
class="border bbg-wt sp-card border-1 pt-3 pb-3 px-3 d-block rounded-3">
<div class="d-flex align-items-center">
<div class="me-md-3 me-3">
<img src="{{ $s->media->thumbnail_url ?? asset('img/Cardiology.png') }}"
alt="{{ $s->SpecialityName }}" />
</div>
<div>
<h4 class="text-md-start f-14 f-sm-12 mb-0 text-center clrGreyDark">
{{ $s->SpecialityName }}
</h4>
</div>
</div>
</a>
@endforeach
</div>
@endforeach
</div>
<div class="row align-items-center justify-content-between">
<div class="col-md-4 text-md-start text-end">
<p class="mb-0">
<a href="{{ route('specialities') }}" class="fw-500 fs-16 f-16 clrBlueDark">View All
</a>
</p>
</div>
</div>
</div>
<div class="col-lg-6 ps-md-0 mt-2 mt-lg-0">
<div class="bgBlueLight rounded-3 pt-md-4 px-3 pb-md-4 pb-2 mt-4 mt-md-0" style="max-height: 265px; min-height: 265px">
<div class="row justify-content-center pt-3 pb-2">
<div class="col-md-5">
<h3 class="text-md-start f-sm-22 f-20 mb-md-2 clrBlueDark fw-500">
Unsure of the speciality?
</h3>
<p class="text-md-start f-sm-16 f-16 f-400 mb-2 clr5c">
Select the body part
</p>
<div class="input-group mb-3 dropdown-btn mt-md-0 mt-3">
<select name="organs" class="form-control home-organ-select f-1 mt-3">
<option value="">Select</option>
@foreach ($organs as $organ)
<option value="{{ $organ->Slug }}">{{ $organ->Name }}</option>
@endforeach
</select>
</div>
</div>
<div class="col-md-6">
<div class="unsure-slider pb-md-4 pt-2">
@foreach ($organs as $organ)
@foreach ($organ->speciality as $os)
<a href="{{ route('specialities.show', $os->Slug) }}"
class="heart-d-bg p-3 d-block text-center no-underline shree-{{ $organ->Slug }}">
<img src="{{ $os->media ? $os->media->thumbnail_url : asset('img/unsure-default.svg') }}"
class="img-fluid d-block mx-auto" alt="{{ $os->SpecialityName }}" />
<p class="text-center f-14 m-0 mt-1">
<span class="">{{ $os->SpecialityName }}</span>
</p>
</a>
@endforeach
@endforeach
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
<section id="hospital" class="lb-bg py-md-4 py-3 px-0 hospital-home-sec mt-3 mt-md-5">
<div class="container">
<div class="row justify-content-center mt-md-3">
<div class="col-md-10">
<h3 class="text-md-start f-sm-22 mb-md-0 mb-3 fw-500 clrBlueDark">
<span class="heading-line f-22 f-sm-22 fw-500">Our Network</span>
</h3>
</div>
<div class="col-md-2 d-md-block d-none">
<p class="text-end f-sm-16 f-16 mb-3">
<a href="{{ route('hospitals') }}" class=" clrBlueDark fw-500">View All</a>
</p>
</div>
</div>
<x-hospital :hospitals="$hospitals"></x-hospital>
<div class="d-md-none pb-md-4">
<p class="text-end f-sm-16 f-16 mb-0 text-end">
<a href="{{ route('hospitals') }}" class=" clrBlueDark fw-500">View All</a>
</p>
</div>
</div>
</section>
<section class="lb-bg section tech-section mt-md-4">
<div class="container px-md-0">
<div class="d-flex justify-content-between align-items-center">
<h3 class="text-md-start f-sm-22 mb-2 mt-4 text-center clrBlueDark ">
<span class="heading-line f-25 ">World Class Technology</span>
</h3>
<p class="text-end f-sm-15 f-16 mb-2 d-none d-md-block">
<a href="{{ route('technologies') }}" class="fw-500 clrBlueDark">View All</a>
</p>
</div>
<p class="f-15 new-b fw-400 text-justify">
Sarvodaya brings enabling technology for high-end diagnosis, examination and treatment. One of the best hospitals in Faridabad, we are North India’s First Hospital to house two Fully Active Robots for Joint Replacement along with Zeiss Tivato 700 Neuro-surgical Microscope for complex brain surgeries; Versa HD 6D LINAC for radiotherapies and radiosurgery with sub-mm accuracy and more.
</p>
<div class="position-relative ">
<div class="technology-slider slick-slider pb-4">
@foreach ($technologies as $technology)
<div class="technology-slider-item">
<div class="technology-content-box border rounded-3 bg-white">
<div class="technology-image-box">
@if (!is_null($technology->media))
<img src="{{ $technology->media->thumbnail_url }}"
alt="{{ $technology->Title }}" class="w-100 technology-img-new" alt="{{ $technology->DisplayName }}">
@else
<img src="{{ asset('img/technology_placeholder.png') }}"
alt="{{ $technology->Title }}" class="w-100 technology-img-new" alt="{{ $technology->DisplayName }}">
@endif
</div>
<div class="technology-content-box">
<a href="javascript:void(0)" class="text-decoration-none d-flex align-item-center p-2 px-2 technology-slider-title show-tech-modal show-tech-modal{{ $technology->id }}">
{{ $technology->DisplayName }}
<img src="{{ asset('img/arrow-new-cus.svg') }}" class="ms-4" alt="right arrow"/>
</a>
</div>
</div>
</div>
@endforeach
</div>
@foreach ($technologies as $technology)
<div class="modal-custom tech-modal{{ $technology->id }}">
<div class="text-end">
<img src="{{ asset('img/close-icon-cus.svg') }}" class="close-custom-modal close-custom-modals{{ $technology->id }}">
</div>
<div class="modal-content-box">
<div class="row">
<div class="col-md-3 mb-3 mb-md-0">
@if (!is_null($technology->media))
<img src="{{ $technology->media->thumbnail_url }}"
alt="{{ $technology->Title }}" class="rounded-3 w-100" alt="{{ $technology->DisplayName }}">
@else
<img src="{{ asset('img/technology_placeholder.png') }}"
alt="{{ $technology->Title }}" class="rounded-3 w-100" alt="{{ $technology->DisplayName }}">
@endif
</div>
<div class="col-md-9 pe-md-5">
<h3 class="clrBlueDark f-sm-16">
{{ $technology->DisplayName }}
</h3>
<div class="tech-contents">
{!! $technology->Description !!}
</div>
</div>
</div>
</div>
</div>
@endforeach
</div>
</div>
</section>
<section class="bgBlueDark py-5 why-choose-sarvodaya">
<div class="container">
<div class="row mb-md-5 justify-content-between">
<div class="col-lg-3 ">
<h3 class="text-md-start f-22 fw-500 f-sm-22 mb-0 text-white">
Why Choose Sarvodaya <br /> Healthcare?
</h3>
</div>
<div class="col-lg-9">
<p class="text-justify f-16 f-sm-16 mt-md-0 mt-2 mb-0 text-white">
Sarvodaya Healthcare, ranked as the top and best hospital in Faridabad has been serving people with quality medical services and empathetic care for the last 33 years. We bring you experienced medical and non-medical professionals, advanced technology & frontier infrastructure to offer quality clinical services, ensuring good health for you and your family.
</p>
</div>
</div>
</div>
</section>
<section class="why-choose-sec">
<div class="container">
<div class="row">
<div class="col-md-12">
<div class="why-choose-cvr d-flex justify-content-between">
<div class="why-card">
<div class="why-card-content">
<img class="d-block mx-auto" src="{{ asset('img/excellence-people.svg') }}" alt="excellent people icon" />
<p class="text-center mt-3 mb-0 f-14">Excellent People</p>
<div class="why-card-hover-box">
<div class="d-flex align-items-center">
<img class="d-block me-3" src="{{ asset('img/excellence-people.svg') }}" alt="excellent people icon" />
<p class="text-start mb-0 f-14 fw-500">Excellent People</p>
</div>
<p class="mb-0 f-14">
Sarvodaya owes much of its success to the exceptional capabilities of its
well-trained and highly-qualified professionals. Our core strength is our 'excellent
people' across all specialties and more importantly our support staff that enables a
seamless delivery.
</p>
</div>
</div>
</div>
<div class="why-card">
<div class="why-card-content">
<img class="d-block mx-auto" src="{{ asset('img/unmatched-care.svg') }}" alt="unmatched care icon " />
<p class="text-center mt-3 mb-0 f-14">Unmatched Care </p>
<div class="why-card-hover-box">
<div class="d-flex align-items-center">
<img class="d-block me-3" src="{{ asset('img/unmatched-care.svg') }}" alt="unmatched care icon "/>
<p class="text-start mb-0 f-14 fw-500">Unmatched Care</p>
</div>
<p class="mb-0 f-14">
We know what matters the most, especially when it comes to you, or your family's
health. Sarvodaya aims to provide unmatched care through our qualified & empathetic
doctors,nurses, and staff, while working towards the holistic well-being of each
individual.
</p>
</div>
</div>
</div>
<div class="why-card">
<div class="why-card-content">
<img class="d-block mx-auto" src="{{ asset('img/shield-trust.svg') }}" alt="sarvodaya logo ,shield of trust "/>
<p class="text-center mt-3 mb-0 f-14">Shield of Trust</p>
<div class="why-card-hover-box opacity-0">
<div class="d-flex align-items-center">
<img class="d-block me-3" src="{{ asset('img/shield-trust.svg') }}" alt="sarvodaya logo ,shield of trust "/>
<p class="text-start mb-0 f-14 fw-500">Shield of Trust</p>
</div>
<p class="mb-0 f-14">
We believe in providing the utmost convenience to our patients as well as our
surgeons. We ensure our doctors have access to world class technology, which enables
them to provide quick & accurate diagnosis, and perform minimally invasive surgeries
to ensure best results and quicker recovery of our patients.
</p>
</div>
</div>
</div>
<div class="why-card">
<div class="why-card-content">
<img class="d-block mx-auto" src="{{ asset('img/world-class-tech.svg') }}" alt="sarvodaya world-class technology icon"/>
<p class="text-center mt-3 mb-0">World-class Technology</p>
<div class="why-card-hover-box">
<div class="d-flex align-items-center">
<img class="d-block me-3" src="{{ asset('img/world-class-tech.svg') }}" alt="sarvodaya world-class technology icon"/>
<p class="text-start mb-0 f-14 fw-500">World-class Technology</p>
</div>
<p class="mb-0 f-14">
Sarvodaya brings enabling technology for high-end diagnosis, examination and treatment. One of the best hospitals in Faridabad, we are North India’s First Hospital to house two Fully Active Robots for Joint Replacement along with Zeiss Tivato 700 Neuro-surgical Microscope for complex brain surgeries; Versa HD 6D LINAC for radiotherapies and radiosurgery with sub-mm accuracy and more.
</p>
</div>
</div>
</div>
<div class="why-card">
<div class="why-card-content">
<img class="d-block mx-auto" src="{{ asset('img/health-club.svg') }}" alt="healthcare hub " />
<p class="text-center mt-3 mb-0 f-14">Healthcare Hub</p>
<div class="why-card-hover-box">
<div class="d-flex align-items-center">
<img class="d-block me-3" src="{{ asset('img/health-club.svg') }}" alt="healthcare hub " />
<p class="text-center mb-0 f-14 fw-500">Healthcare Hub</p>
</div>
<p class="mb-0 f-14">
Sarvodaya is a healthcare hub that brings the finest of primary, secondary and
tertiary care under one roof. We combine the best of specialists and advanced
equipment to provide you nothing short of best in Healthcare.
</p>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
<section class="mt-lg-5 mt-4 px-0 lb-bg">
<div class="container">
<div class="d-flex justify-content-between align-items-center pt-4">
<h3 class="text-md-start f-22 f-sm-22 mb-2 text-center clrBlueDark fw-500">
Awards
</h3>
<p class="text-end f-sm-15 f-16 mb-2 d-none d-md-block">
<a href="{{ route('awards') }}" class="fw-500 clrBlueDark">View All</a>
</p>
</div>
<div class="row align-items-center men-handu-row position-relative">
<div class="col-md-3 col-3 d-none d-md-block">
<img src="{{ asset('img/doc.png') }}" alt="sarvodaya awards and achievements" class="img-fluid text-right man-hand-up" />
</div>
<div class="col-md-9 text-center pe-0 col-12">
<div class="awards-slider mb-md-5 mb-3">
<x-award :awards="$awards"></x-award>
</div>
<p class="text-end f-sm-16 f-16 mb-4 pt-2 text-end pe-2 d-md-none">
<a href="{{ route('awards') }}" class=" fw-500 clrBlueDark">View All</a>
</p>
</div>
</div>
</div>
</section>
<section class="mt-md-5 mt-4 rare-case-main-sec">
<div class="container">
<div class="row align-items-center">
<div class="col-md-12">
<div class="row justify-content-center">
<div class="d-flex justify-content-between align-items-center">
<h3 class="text-md-start f-22 f-sm-22 mb-3 fw-500 text-center clrBlueDark">
Rare Cases
</h3>
<p class="text-end f-sm-16 f-16 mb-3 pe-2 d-none d-md-block">
<a href="{{ route('rarecases') }}" class="fw-500 clrBlueDark">View All</a>
</p>
</div>
</div>
<div class="row">
<div class="rare-cases-slider pe-0">
<x-rare-cases :rarecases="$rarecases"></x-rare-cases>
</div>
<p class="text-end f-sm-16 f-16 mb-3 pe-2 d-md-none">
<a href="{{ route('rarecases') }}" class="fw-500 clrBlueDark">View All</a>
</p>
</div>
</div>
</div>
</div>
</section>
<section class="mt-md-5 mt-0 rare-case-sec">
<div class="container">
<div class="row">
<div class="col-md-4 ps-0 radius-full-column">
<img src="{{ asset('img/news.png') }}" alt="sarvodaya news" class="img-fluid h-100 object-fit-cover" />
</div>
<div class="col-md-8">
<div class="row justify-content-center">
<div class="d-flex justify-content-between align-items-center news-column-p">
<h3 class="text-md-start f-22 fw-500 f-sm-22 mb-3 text-center clrBlueDark">
Sarvodaya in News
</h3>
</div>
</div>
<div class="row rare-case-mobile-slide">
<x-news :news="$news"></x-news>
</div>
<p class="text-end f-sm-16 f-16 mb-3 text-end">
<a href="{{ route('news') }}" class="fw-500 clrBlueDark">View All</a>
</p>
</div>
</div>
</div>
</section>
<section class="section preventive-health-checkup php-home">
<div class="container">
<div class="row justify-content-between">
<div class="col-lg-6 ">
<h3 class="text-md-start f-sm-22 f-22 mb-1 clrBlueDark fw-500">
Health Check-Ups
</h3>
<p class="text-justify f-sm-16 f-16 clrGrey mb-3">
Sarvodaya’s dedicated Wellness Centre provides Preventive Healthcare Checkup services and facilities for adults and children. We have garnered the trust of millions of patients, being the best hospital in Faridabad, and offer personalised general and comprehensive packages for whole-body checkups, cancer screening, senior citizen check-ups, heart check-ups, kids' health, women's health and many more to timely diagnose, monitor and prevent health problems of people.
</p>
<div class="row d-md-flex d-none">
<x-preventive-health-checkup :phc="$phc"></x-preventive-health-checkup>
<div class="col-md-6">
<a href="{{ route('phc') }}" class="clrBlueDark fw-500 f-16">View All</a>
</div>
</div>
</div>
<div class="col-lg-5 mt-lg-0">
<img src="{{ asset('img/PreventiveHealthCheckup.png') }}" alt="heath-checkups at sarvodaya" class="img-fluid" />
<div class="row d-md-none mt-4">
<x-preventive-health-checkup :phc="$phc"></x-preventive-health-checkup>
<div class="col-md-6 text-end">
<a href="{{ route('phc') }}" class="clrBlueDark fw-500">View All</a>
</div>
</div>
</div>
</div>
</div>
</section>
<section class="testimonial-home-sec">
<div class="container">
<div class="row">
<div class="col-md-6 db-bg section position-relative">
<div class="d-flex justify-content-between align-item-center px-md-2 mb-3">
<h3 class="text-md-start f-sm-22 mb-0 clrBlueDark">
<span class="heading-line f-sm-22 f-22 fw-500">Patients Testimonials</span>
</h3>
<p class="text-end f-sm-16 f-16 mb-0 d-md-block d-none">
<a href="{{ route('testimonials') }}" class=" clrBlueDark fw-500">View All</a>
</p>
</div>
<x-testimonial :testimonials="$testimonials" sliderClass="home-testimonial-slider pb-md-4"></x-testimonial>
<p class="text-end f-sm-16 f-16 mb-0 d-md-none text-end pe-2">
<a href="{{ route('testimonials') }}" class=" clrBlueDark fw-500">View All</a>
</p>
</div>
<div class="col-md-6 lb-bg section position-relative ps-md-3">
<div class="d-flex align-items-center justify-content-between mb-3">
<h3 class="f-sm-22 mb-0 clrBlueDark ps-md-2">
<span class="heading-line f-sm-22 f-22 fw-500">Patient Education by Experts</span>
</h3>
<p class="text-end f-sm-16 f-16 mb-0 d-none d-md-block">
<a href="{{ route('doctor-videos') }}" class=" clrBlueDark fw-500 mx-2">View All</a>
</p>
</div>
<div class="doctor-testimonial-slider testimonial-slider">
<x-doctor-video :doctorvideos="$doctorvideos"></x-doctor-video>
</div>
<p class="text-end f-sm-15 f-16 mb-0 text-end d-md-none">
<a href="{{ route('doctor-videos') }}" class=" clrBlueDark fw-500 mx-2">View All</a>
</p>
</div>
</div>
</div>
</section>
<section class="section blog-section" id="blogs">
<div class="container">
<div class="row justify-content-center">
<div class="col-md-10">
<h3 class="text-start f-sm-22 mb-3 clrBlueDark">
<span class="heading-line fs-22 f-22 fw-500">Our Blogs</span>
</h3>
</div>
<div class="col-md-2 d-md-block d-none">
<p class="text-end f-sm-16 f-16 mb-3">
<a href="{{ route('blogs') }}" class="clrBlueDark fw-500">View All</a>
</p>
</div>
</div>
<div class="blog-slider-wrapper">
<div class="blogs-slider">
<x-blog-slider :blogs="$blogs"></x-blog-slider>
</div>
<div class="row d-md-none mt-3">
<div class="col-12">
<p class="text-end f-sm-16 f-16 mb-3 text-end">
<a href="{{ route('blogs') }}" class="clrBlueDark fw-500">View All</a>
</p>
</div>
</div>
</div>
</div>
</section>
@include('partials.page-popup')
@endsection
@section('css')
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@fancyapps/ui@5.0/dist/fancybox/fancybox.css"/>
<style>
.fancybox__container{z-index: 9999;}
.testimonial-home-sec h4 {
min-height: 38.4px;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
overflow: hidden;
}
.unsure-slider{
opacity: 0;
visibility: hidden;
transition: opacity 1s ease;
-webkit-transition: opacity 1s ease;
}
.unsure-slider.slick-initialized {
visibility: visible;
opacity: 1;
}
.mobile-margin-o .slick-track {
margin-bottom: 0;
}
.slick-track {
display: flex;
}
.testimonial-home-sec .slick-track {
margin-bottom: 20px;
}
.slick-slide {
height: auto;
}
.slick-track .sp-card {
margin-bottom: 0;
height: 100%;
}
</style>
@endsection
@section('javascript')
<script src="https://cdn.jsdelivr.net/npm/@fancyapps/ui@5.0/dist/fancybox/fancybox.umd.js"></script>
<script>
$(document).ready(function(){
@foreach ($technologies as $technology)
$(".show-tech-modal{{$technology->id}}").click(function(){
$(".tech-modal{{$technology->id}}").show();
});
$(".close-custom-modals{{$technology->id}}").click(function(){
$(".tech-modal{{$technology->id}}").hide();
});
@endforeach
});
Fancybox.bind('[data-fancybox="news"]', {
hideScrollbar: false,
Dots: false,
});
$('#call-back-form').click(function() {
$(window).scrollTop(300);
$('#query').focus();
});
$(window).on('load', function() {
$('#fraudAlertModal').modal('show');
// let isCookieAvailable = getCookie('alert_popup');
// setCookie('alert_popup', true, 1);
// if (!isCookieAvailable) {
// setTimeout(function(){
// $('#fraudAlertModal').modal('show');
// }, 50);
// }
});
</script>
<script>
function capitalizeFirstLetter(string) {
return string.charAt(0).toUpperCase() + string.slice(1);
}
$(document).ready(function() {
$(document).on('click', '.apply-specialties-box button', function(e) {
e.preventDefault();
$(this).parent().parent().hide();
});
let queryInputBoxSelector = $('#query');
let locationBoxSelector = $('#locationResult');
queryInputBoxSelector.on('focus', function() {
if ($(this).val().length >= 3) {
$('#test1').show();
}
$('.suggestion1').show();
});
locationBoxSelector.hide();
$('#location').on('click', function(e) {
locationBoxSelector.show();
$('#test1').hide();
});
queryInputBoxSelector.on('keyup', function() {
if ($(this).val().length >= 3) {
let searchQuery = $(this).val();
let apiURL = `{{ route('search-doctors') }}`;
$('.doctorResult li').remove();
$.ajax({
url: apiURL,
dataType: "json",
type: "POST",
async: true,
data: {
searchQuery: searchQuery
},
success: function(response) {
//console.log('Doctor Global Filter')
//console.log(response);
let uniqueLocation = [];
$('.doctorResult li').remove();
$('.specialityResult li').remove();
$("#suggestion-box-result .doctorResult").html = '';
$("#suggestion-box-result .specialityResult").html = '';
if ((response.data).length <= 0) {
clearResult();
} else {
$.each(response.data, function(key, value) {
uniqueLocation.push(value.locations);
if (value.type == "doctor") {
let responseHTML = `<li>
<input type="radio" data-type="${value.type}" id="${value.id}" data-hospitals="${value.hslug}" class="checkboxResult" name="${value.type}" data-radio-value="${value.match}" value="${value.id}">
<label for="${key}">${value.match}</label>
<span class="float-end d-none">${capitalizeFirstLetter(value.type)}</span>
<span class="checkmark-doctor-search"></span>
</li>`;
$("#suggestion-box-result .doctorResult")
.append(
responseHTML);
}
if (value.type == "speciality") {
let responseHTML = `<li>
<input type="radio" data-type="${value.type}" id="${value.id}" data-hospitals="${value.hslug}" class="checkboxResult" name="${value.type}" data-radio-value="${value.match}" value="${value.id}">
<label for="${key}">${value.match}</label>
<span class="float-end d-none">${capitalizeFirstLetter(value.type)}</span>
<span class="checkmark-doctor-search"></span>
</li>`;
$("#suggestion-box-result .specialityResult")
.append(responseHTML);
}
});
if ($("#suggestion-box-result .specialityResult").html() ==
'') {
$('#specialityResult').hide();
} else {
$('#specialityResult').show();
}
if ($("#suggestion-box-result .doctorResult").html() == '') {
$('#doctorResult').hide();
} else {
$('#doctorResult').show();
}
$('#test1').show();
let locations = Array.prototype.concat(...uniqueLocation)
.filter(
function(itm, i, a) {
return i === a.indexOf(itm);
});
}
},
error: function(error) {
console.log(error);
}
});
} else {
clearResult();
}
})
let setSelectedValue = [];
let setSelectedDoctor = [];
let setSelectedDoctorT = [];
let setSelectedSpeciality = [];
let setSelectedSpecialityT = [];
$(document.body).on('click', '.checkboxResult', function() {
if ($(this).is(':checked')) {
let currentElem = $(this).attr("data-type");
if (currentElem === 'speciality') {
$('#selectedSpeciality').val($(this).attr('value'));
$('#selectedSpecialityT').val($(this).attr('data-radio-value'));
$('#selectedHospitals').val($(this).attr('data-hospitals'));
}
if (currentElem === 'doctor') {
$('#selectedDoctor').val($(this).attr('value'));
$('#selectedDoctorT').val($(this).attr('data-radio-value'));
$('#selectedHospitald').val($(this).attr('data-hospitals'));
}
setSelectedValue = [];
if ($('#selectedDoctorT').val() != '') {
setSelectedValue.push($('#selectedDoctorT').val());
}
if ($('#selectedSpecialityT').val() != '') {
setSelectedValue.push($('#selectedSpecialityT').val());
}
$('#query').val(setSelectedValue.join(", "));
$('.suggestion-box-wrapper').css("display", "none");
}
});
});
$(document.body).on('click', '#apply-location', function() {
setSelectedValue = [];
setSelectedLocation = [];
$('.locationList').each(function(e) {
if ($(this).is(':checked')) {
setSelectedValue.push($(this).attr('value'));
setSelectedLocation.push($(this).attr('data-location'));
}
});
$('#selectedHospital').val(setSelectedValue.toString());
$('#location').val(setSelectedLocation.join(", "));
});
// $(document.body).on('click', '#apply-doc-spec', function() {
// setSelectedValue = [];
// if ($('#selectedDoctorT').val() != '') {
// setSelectedValue.push($('#selectedDoctorT').val());
// }
// if ($('#selectedSpecialityT').val() != '') {
// setSelectedValue.push($('#selectedSpecialityT').val());
// }
// $('#query').val(setSelectedValue.join(", "));
// });
</script>
<script>
$('.our-specialist-slider').owlCarousel({
loop: true,
autoplay: true,
nav: true,
dots: false,
arrows: false,
margin: 0,
responsiveClass: true,
responsive: {
0: {
items: 2,
margin: 10,
nav: false,
loop: true
},
768: {
items: 2,
nav: false
},
992: {
items: 2,
nav: true
},
1000: {
items: 3,
nav: true,
loop: true
}
}
});
$('.owl-network').owlCarousel({
loop: true,
autoplay: true,
nav: true,
margin: 10,
responsiveClass: true,
responsive: {
0: {
items: 1,
nav: true,
loop: true
},
600: {
items: 2,
nav: true
},
1000: {
items: 2,
nav: true,
loop: true
}
}
})
</script>
<script type="text/javascript">
$('#search').on('keyup', function() {
$value = $(this).val();
$.ajax({
type: 'get',
url: '{{ route('search-home.show') }}',
data: {
'search': $value
},
success: function(data) {
if (data !== '') {
$('.suggestion-box-wrapper').css("display", "block");
$('.suggestion-inner-content').html(data);
} else {
$('.suggestion-box-wrapper').css("display", "none");
$('.suggestion-inner-content').html(data);
}
}
});
})
</script>
<script type="text/javascript">
$.ajaxSetup({
headers: {
'csrftoken': '{{ csrf_token() }}'
}
});
</script>
<script type="text/javascript">
function search(val) {
$('#search-id').val(val);
$('.suggestion-box-wrapper').css("display", "none");
$('#search').val($('#' + val).text());
}
</script>
<script type="text/javascript">
var filtered = false;
$('select[name="organs"]').change(function() {
slug = $(this).val();
$('.unsure-slider').slick('slickUnfilter');
if (slug != '') {
$('.unsure-slider').slick('slickFilter', '.shree-' + slug);
}
});
</script>
<script>
$(document).ready(function() {
$(document).on('click', 'body', function(e) {
if (($(e.target).is('#location')) || ($(e.target).is(
'.suggestion-listing [id^="location"]'))) {
let locs = [];
let locd = [];
if ($('#selectedHospitals').val() != '') {
locs = $('#selectedHospitals').val().split(',');
}
if ($('#selectedHospitald') != '') {
locd = $('#selectedHospitald').val().split(',');
}
let childloc = locs.concat(locd);
setSelectedValue = [];
setSelectedLocation = [];
$('.locationList').each(function(e) {
if ($(this).is(':checked')) {
setSelectedValue.push($(this).attr('value'));
setSelectedLocation.push($(this).attr('data-location'));
}
});
$('#selectedHospital').val(setSelectedValue.toString());
$('#location').val(setSelectedLocation.join(", "));
unique = new Set(childloc);
$('.locationList').each(function(e) {
$(this).parent().show();
});
if ((unique.size > 0) && (childloc != '') && ($('#query').val() != '')) {
$('.locationList').each(function(e) {
if (!inArray($(this).attr('value'), Array.from(unique))) {
$(this).parent().hide();
}
});
}
//pass
} else {
$('#locationResult').css("display", "none");
}
if (($(e.target).is('.search-doctor-input-h')) || ($(e.target).is(
'.doctorResult li input')) || ($(e.target).is('.suggestion1')) || ($(e.target).is('.apply-specialties-box'))) {
//pass suggestion-listing
} else {
$('.suggestion1').css("display", "none");
}
});
});
$(document).ready(function() {
$('form#call-back-form').submit(function(e) {
if (($('#query').val() != '') || ($('#location').val() != '')) {
form.submit();
} else {
e.preventDefault();
return false;
}
});
});
function inArray(needle, haystack) {
var length = haystack.length;
for (var i = 0; i < length; i++) {
if (haystack[i] == needle) return true;
}
return false;
}
</script>
<script>
function clearResult() {
$('.doctorResult li').remove();
$('.specialityResult li').remove();
$("#suggestion-box-result .doctorResult").html = '';
$("#suggestion-box-result .specialityResult").html = '';
$('#test1').hide();
$('#selectedSpeciality').val('');
$('#selectedSpecialityT').val('');
$('#selectedHospitals').val('');
$('#selectedDoctor').val('');
$('#selectedDoctorT').val('');
$('#selectedHospitald').val('');
}
</script>
@endsection