@extends('admin.main')
@section('content')
@if($user->role == "1")
<div class="row">
   <!-- ICON BG -->
   <div class="col-lg-12 col-md-12 col-sm-12">
      <div class="card card-icon-bg card-icon-bg-primary mb-4">
         <form id="statics_search" action="{{ route('dashboard') }}" method="POST">
            @csrf
            <div class="card-body bg-primary">
               <!-- <div class="row"> -->
                  <div class="col-md-3">
                     <h3 class="text-white">Dashboard Details</h3>
                  </div>
                  <div class="col-md-2 text-right">
                  </div>
                  <div class="col-md-3">
                     <div class="input-group">
                       <div class="input-group-prepend">
                         <span class="input-group-text" id="">Start Date</span>
                       </div>
                       <input id="start_date" type="date" max="{{ date('Y-m-d')}}" class="form-control" name="start_date" value="{{old('start_date',$start_date)}}">
                     </div>
                  </div>
                  <div class="col-md-3">
                     <div class="input-group">
                       <div class="input-group-prepend">
                         <span class="input-group-text" id="">End Date</span>
                       </div>
                       <input id="end_date" type="date" max="{{ date('Y-m-d')}}" class="form-control" name="end_date" value="{{old('end_date',$end_date)}}">
                     </div>
                  </div>
                  <div class="col-md-1">
                     <button class="btn btn-secondary">Search</button>
                  </div>
               <!-- </div> -->
            </div>
         </form>
      </div>
   </div>
</div>
<div class="row">
   <div class="col-md-6 col-sm-6">
      <div class="card card-icon-bg card-icon-bg-primary o-hidden mb-4">
         <div class="card-body text-center">
            <i class="i-Conference" style="font-size: 28px !important;"></i>
            <table class="w-100">
                <tr>
                    <td class="text-muted">Total Leads</td>
                </tr>
                <tr>
                    <td class="text-primary text-20">{{($leads_data->total_leads)?$leads_data->total_leads:0}}</td>
                </tr>
            </table>
         </div>
      </div>
      <div class="card card-icon-bg card-icon-bg-primary o-hidden mb-4">
         <div class="card-body text-center">
            <i class="i-Consulting" style="font-size: 28px !important;"></i>
            <table class="w-100">
                <tr>
                    <td class="text-muted">Total Appointments</td>
                </tr>
                <tr>
                    <td class="text-primary text-20">{{($appointments->total_counts)?$appointments->total_counts:0}}</td>
                </tr>
            </table>
         </div>
      </div>
      <div class="card card-icon-bg card-icon-bg-primary o-hidden mb-4">
         <div class="card-body text-center">
            <i class="i-Calendar-4" style="font-size: 28px !important;"></i>
            <table class="w-100">
                <tr>
                    <td class="text-muted">Leads Into  Appointments</td>
                </tr>
                <tr>
                    <td class="text-primary text-20">{{($appointments->leads_into_appointment)?$appointments->leads_into_appointment:0}}</td>
                </tr>
            </table>
         </div>
      </div>
      <div class="card card-icon-bg card-icon-bg-primary o-hidden mb-4">
         <div class="card-body text-center">
            <!-- <i class="i-Stethoscope"></i> -->
            <img src="{{asset('img/spine.svg')}}" width="100">
            <table class="w-100">
                <tr>
                    <td class="text-muted">Recommended Procedure</td>
                    <td class="text-muted"></td>
                    <td class="text-muted">Done Surgeries</td>
                </tr>
                <tr>
                    <td class="text-primary text-20">{{($rec_procedure)?$rec_procedure:0}}</td>
                    <td class="text-primary text-20">VS</td>
                    <td class="text-primary text-20">0</td>
                </tr>
            </table>
         </div>
      </div>
   </div>
   <!-- ICON BG -->
   <div class="col-md-6 col-sm-6">
      <div class="card mb-4">
        <div class="card-body">
            <div class="card-title text-muted">Leads by Source</div>
            <div id="leads_pie1" style="height: 395px;"></div>
        </div>
       </div>
   </div>

   <div class="col-md-12">
       <div class="card mb-4">
         <div class="card-body text-center">
            <h5 class="font-weight-bold text-left mb-3">Lead Stages</h5>
               <div class="table-responsive">
                  <table class="w-100 table table-bordered">
                      <tr>
                         @if(count($stage_list) > 0)
                           @foreach($stage_list as $stage)
                            @if($stage['name'] != 'SURGICAL ESTIMATE')
                               <td class="text-muted">
                                 @php
                                    $sName = strtolower($stage['name']);
                                 @endphp
                                    {{ ucfirst($sName) }}
                                  <p class="mt-2 text-primary text-20"> {{$stage['count']}}</p>
                               </td>
                            @endif
                           @endforeach
                        @endif
                        <td class="text-muted">
                            Total Dropped Leads
                            <p class="mt-2 text-primary text-20"> {{$totalDroppedCount}}</p>
                         </td>
                      </tr>
                  </table>
                </div>
         </div>
      </div>

       <div class="card mb-4">
         <div class="card-body text-center">
            <h5 class="font-weight-bold text-left mb-3">Dropped Leads </h5>
               <div class="table-responsive">
                  <table class="w-100 table table-bordered">
                      <tr>
                         @if(count($regionsWithCount) > 0)
                           @foreach($regionsWithCount as $region)
                               <td class="text-muted">
                                 @php
                                    $rName = strtolower($region['name']);
                                 @endphp
                                    {{ ucfirst($rName) }}
                                  <p class="mt-2 text-primary text-20"> {{$region['count']}}</p>
                               </td>
                           @endforeach                           
                        @endif
                      </tr>
                  </table>
                </div>
         </div>
      </div>
   </div>

</div>

<div class="row">
   <!-- ICON BG -->
   <div class="col-md-12 col-sm-12">
      <div class="card mb-4">
        <div class="card-body bg-primary">
            <h3 class="text-left text-white">Daily Patient Statistics</h3>
        </div>
       </div>
   </div>
</div>
<div class="row">
   <!-- ICON BG -->
   <div class="col-lg-6 col-md-6 col-sm-6">
      <div class="card card-icon-bg card-icon-bg-primary o-hidden mb-4">
         <div class="card-body text-center">
            <i class="i-Mens" style="font-size: 28px !important;"></i>
            <table class="w-100">
                <tr>
                    <td class="text-muted">New Patient Consultations Today</td>
                </tr>
                <tr>
                    <td class="text-primary text-20">{{$new_patient_appointment}}</td>
                </tr>
            </table>
            <!-- <div class="content">
               <p class="text-muted mt-2 mb-0">New Patient Consultations Today</p>
               <p class="text-primary text-24 line-height-1 mb-2">{{$new_patient_appointment}}</p>
            </div> -->
         </div>
      </div>
   </div>
   <div class="col-lg-6 col-md-6 col-sm-6">
      <div class="card card-icon-bg card-icon-bg-primary o-hidden mb-4">
         <div class="card-body text-center">
            <i class="i-Checked-User" style="font-size: 28px !important;"></i>
            <table class="w-100">
                <tr>
                    <td class="text-muted">Follow-up Patients Today</td>
                </tr>
                <tr>
                    <td class="text-primary text-20">0</td>
                </tr>
            </table>
            <!-- <div class="content">
               <p class="text-muted mt-2 mb-0">Follow-up Patients Today</p>
               <p class="text-primary text-24 line-height-1 mb-2">0+</p>
            </div> -->
         </div>
      </div>
   </div>
</div>
<script type="text/javascript">
    $(document).ready(function() {
      var leads_by_source = @json($leads_data); 
      let leadsBySource = [];
      let sourceByColor = [];
      let totalLeads = 0;
      if (leads_by_source) {
         if (leads_by_source['total_leads']) {
            totalLeads = leads_by_source['total_leads'];
         }
         if (leads_by_source['facebook'] && leads_by_source['facebook'] > 0) {
            sourceByColor.push("#4285f4");
            leadsBySource.push({ value: leads_by_source['facebook'], name: "Facebook" });
            totalLeads -= leads_by_source['facebook'];
         }
         if (leads_by_source['walk_in'] && leads_by_source['walk_in'] > 0) {
            sourceByColor.push("#F27E30");
            leadsBySource.push({ value: leads_by_source['walk_in'], name: "Walk in" });
            totalLeads -= leads_by_source['walk_in'];
         }

         if (leads_by_source['knowlarity'] && leads_by_source['knowlarity'] > 0) {
            sourceByColor.push("#07B0A7");
            leadsBySource.push({ value: leads_by_source['knowlarity'], name: "Knowlarity" });
            totalLeads -= leads_by_source['knowlarity'];
         }
         
         if (leads_by_source['whatsapp'] && leads_by_source['whatsapp'] > "0") {
            sourceByColor.push("#075e54");
            leadsBySource.push({ value: leads_by_source['whatsapp'], name: "Whatsapp" });
            totalLeads -= leads_by_source['whatsapp'];
         }
         if (leads_by_source['ig'] && leads_by_source['ig'] > "0") {
            sourceByColor.push("#d62976");
            leadsBySource.push({ value: leads_by_source['ig'], name: "Instagram" });
            totalLeads -= leads_by_source['ig'];
         }
         if (leads_by_source['web_search'] && leads_by_source['web_search'] > "0") {
            sourceByColor.push("#ffc107");
            leadsBySource.push({ value: leads_by_source['web_search'], name: "Web Search" });
            totalLeads -= leads_by_source['web_search'];
         }
         if (leads_by_source['referred_by_doctor'] && leads_by_source['referred_by_doctor'] > "0") {
            sourceByColor.push("#20c997");
            leadsBySource.push({ value: leads_by_source['referred_by_doctor'], name: "Referred by Doctor" });
            totalLeads -= leads_by_source['referred_by_doctor'];
         }
         if (leads_by_source['referred_by_patient'] && leads_by_source['referred_by_patient'] > "0") {
            sourceByColor.push("#673ab7");
            leadsBySource.push({ value: leads_by_source['referred_by_patient'], name: "Referred by Patient" });
            totalLeads -= leads_by_source['referred_by_patient'];
         }
         // if (totalLeads>0) {
         //    sourceByColor.push("#20c997");
         //    leadsBySource.push({ value: totalLeads , name: "Others" });
         // }
      }
        let echartElemPie = document.getElementById('leads_pie1');
        if (echartElemPie) {
            let leads_pie = echarts.init(echartElemPie);
            leads_pie.setOption({
                color: sourceByColor,
                tooltip: {
                    show: true,
                    backgroundColor: 'rgba(0, 0, 0, .8)'
                },

                series: [{
                        name: 'Leads by Source',
                        type: 'pie',
                        radius: '60%',
                        center: ['50%', '50%'],
                        data: leadsBySource,
                        label: {
                            show: true,
                            fontSize: 10, 
                        },
                        itemStyle: {
                            emphasis: {
                                shadowBlur: 10,
                                shadowOffsetX: 0,
                                shadowColor: 'rgba(0, 0, 0, 0.5)'
                            }
                        }
                    }

                ]
            });
            $(window).on('resize', function() {
                setTimeout(() => {
                    leads_pie.resize();
                }, 1000);
            });
        }
        $("#statics_search").submit(function(e){
            e.preventDefault();
            if ($("#start_date").val() <= $("#end_date").val()) {
               e.target.submit();
            }else{
               swal({
                   title: 'Invalid Date',
                   text: 'start date can not be greater then end date',
                   icon: 'error',
                   timer: 3000,
                   buttons: true,
               });
            }
        })
    })
</script>
@elseif($user->role == "2")
   <div class="col-md-12">
       <div class="card mb-4">
         <div class="card-body text-center">
            <h5 class="font-weight-bold text-left mb-3">Lead Stages</h5>
               <table class="w-100 table table-bordered">
                   <tr>
                     @if(count($stage_list) > 0)
                         @foreach($stage_list as $stage)
                               <td class="text-muted">
                                 @php
                                    $sName = strtolower($stage['name']);
                                 @endphp
                                    {{ ucfirst($sName) }}
                                  <p class="mt-2 text-primary text-20"> {{$stage['count']}}</p>
                               </td>
                           @endforeach
                     @endif
                   </tr>
               </table>
         </div>
      </div>
       <div class="card mb-4">
         <div class="card-body text-center">
            <h5 class="font-weight-bold text-left mb-3">Dropped Leads </h5>
               <div class="table-responsive">
                  <table class="w-100 table table-bordered">
                      <tr>
                         @if(count($regionsWithCount) > 0)
                           @foreach($regionsWithCount as $region)
                               <td class="text-muted">
                                 @php
                                    $rName = strtolower($region['name']);
                                 @endphp
                                    {{ ucfirst($rName) }}
                                  <p class="mt-2 text-primary text-20"> {{$region['count']}}</p>
                               </td>
                           @endforeach
                        @endif
                      </tr>
                  </table>
                </div>
         </div>
      </div>
   </div>
@elseif($user->role == "5")
@elseif($user->role == "8")
   <div class="row">
       <div class="col-md-3">
          <div class="card mb-4 border">
            <div class="card-body text-center">
               <h5 class="font-weight-bold mb-3">Procedure Advised</h5>
               <p class="mt-2 text-primary text-20"> {{$procedureAdviceCount}} </p>
            </div>
         </div>
      </div>
      <div class="col-md-3">
          <div class="card mb-4 border">
            <div class="card-body text-center">
               <h5 class="font-weight-bold mb-3">Package Counselling</h5>
               <p class="mt-2 text-primary text-20"> {{ $packageCounsellingCount }}</p>
            </div>
         </div>
      </div>
      <div class="col-md-3">
          <div class="card mb-4 border">
            <div class="card-body text-center">
               <h5 class="font-weight-bold mb-3">Surgery</h5>
               <p class="mt-2 text-primary text-20"> {{ $surgeryCount }}</p>
            </div>
         </div>
      </div>
      <div class="col-md-3">
          <div class="card mb-4 border">
            <div class="card-body text-center">
               <h5 class="font-weight-bold mb-3">Follow-up</h5>
               <p class="mt-2 text-primary text-20"> {{ $followUpCount }}</p>
            </div>
         </div>
      </div>
   </div>
@elseif($user->role == "9")
@elseif($user->role == "10")
@else
   <div class="row">
      


   @if($user && $user->role == 3)


   <div class="col-lg-4 d-none">
      <div class="card">
         <div class="card-body">
            <div class="card-title">Upcoming Reminder Notifications</div>
               <div>
                  <ul class="list-group list-group-flush">
                     @foreach($remainders as $remin)
                        <li class="list-group-item d-flex justify-content-between align-items-center">
                            <div>
                              <strong>{{$remin->subject}}</strong>
                              <small class="mb-0 text-muted d-block">{{ $remin->reminder_at }}</small>
                           </div>
                           <span class="badge badge-success badge-pill">New</span>
                        </li>
                     @endforeach
                  </ul>
               </div>
         </div>
      </div>
   </div>

   <div class="col-lg-4">
      <div class="card">
         <div class="card-body">
            <h5 class="card-title mb-4">Upcoming Appointments</h5>
            <div>
               <ul class="list-group list-group-flush booking_list" route="{{ route('get-appointments-info')}}">
                  @if($appointments1->isNotEmpty())
                     @foreach($appointments1 as $k => $booking)
                         @if((strtotime($booking->appointment_date) > strtotime(date("d-m-Y"))) || (strtotime($booking->appointment_date) == strtotime(date("d-m-Y")) && strtotime($booking->start_time) >= strtotime(date("H:i:s"))))
                           <li class="list-group-item d-flex justify-content-between align-items-center py-3">
                              <div>
                                 <div> <a href="javascript:void(0);" class="booking_modal" booking-id="{{ $booking->id }}" patient-id="{{ $booking->patient->id }}" prescription-link = "{{ route('visitor.edit', ['id' => $booking->id,'p_id' => $booking->patient->id]) }}"><strong> {{ ucfirst($booking->title) }} </strong></a> </div>
                                 <div><strong>DateTime:</strong> {{ $booking->appointment_date }}
                                       {{ $booking->start_time }} to 
                                       {{ $booking->end_time }}<br>
                                 </div>
                              </div>
                                <span class="badge badge-primary badge-pill">New</span>
                           </li>
                         @endif
                     @endforeach
                  @else
                     <li class="list-group-item d-flex justify-content-between align-items-center py-3">
                        <div>
                           <div><strong> No appointments for today </strong> </div>
                        </div>
                     </li>
                  @endif
               </ul>
            </div>
         </div>
      </div>
   </div>
   @include('admin.appointment-modal')
   @else
   <!-- ICON BG -->
   <div class="col-lg-4 col-md-6 col-sm-6 d-none">
      <div class="card card-icon-bg card-icon-bg-primary o-hidden mb-4">
         <div class="card-body text-center">
            <i class="i-Add-User"></i>
            <div class="content">
               <p class="text-muted mt-2 mb-0">Doctors</p>
               <p class="text-primary text-24 line-height-1 mb-2">{{$total_doctor}}+</p>
            </div>
         </div>
      </div>
   </div>
   <div class="col-lg-4 col-md-6 col-sm-6 d-none">
      <div class="card card-icon-bg card-icon-bg-primary o-hidden mb-4">
         <div class="card-body text-center">
            <i class="i-Add-User"></i>
            <div class="content">
               <p class="text-muted mt-2 mb-0">Patients</p>
               <p class="text-primary text-24 line-height-1 mb-2">{{$total_patient}}+</p>
            </div>
         </div>
      </div>
   </div>
   <div class="col-lg-4 col-md-6 col-sm-6 d-none">
      <div class="card card-icon-bg card-icon-bg-primary o-hidden mb-4">
         <div class="card-body text-center">
            <i class="i-Add-User"></i>
            <div class="content">
               <p class="text-muted mt-2 mb-0">Staff</p>
               <p class="text-primary text-24 line-height-1 mb-2">{{$total_staff}}+</p>
            </div>
         </div>
      </div>
   </div>
   @endif
   </div>
@endif
@endsection