@extends('layouts.master')

@section('title', 'All Leads | Alboosh - Timeless authenticity, born of the desert')

@section('title-topbar', __('basic.all leads'))

<!-- css insert -->
@section('css')
<!-- select 2 -->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/select2/4.1.0-rc.0/css/select2.min.css"
    integrity="sha512-aD9ophpFQ61nFZP6hXYu4Q/b/USW7rpLCQLX6Bi0WJHXNO7Js/fUENpBQf/+P4NtpzNX0jSgR5zVvPOJp+W2Kg=="
    crossorigin="anonymous" referrerpolicy="no-referrer" />

<!-- -- datatables plugin -- -->
<link rel="stylesheet" href="https://cdn.datatables.net/1.11.2/css/dataTables.bootstrap5.min.css">
<link rel="stylesheet" href="https://cdn.datatables.net/buttons/2.0.0/css/buttons.bootstrap5.min.css">
<link rel="stylesheet" href="https://cdn.datatables.net/autofill/2.3.9/css/autoFill.bootstrap5.min.css">

<!-- tables -->
<link rel="stylesheet" href="https://cdn.datatables.net/1.11.2/css/dataTables.bootstrap5.min.css">
<link rel="stylesheet" href="https://cdn.datatables.net/buttons/2.0.1/css/buttons.bootstrap5.min.css">
<link rel="stylesheet" href="https://cdn.datatables.net/autofill/2.3.9/css/autoFill.bootstrap5.min.css">


<!-- datepicker time and date -->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/flatpickr/4.6.13/flatpickr.min.css"
    integrity="sha512-MQXduO8IQnJVq1qmySpN87QQkiR1bZHtorbJBD0tzy7/0U9+YIC93QWHeGTEoojMVHWWNkoCp8V6OzVSYrX0oQ=="
    crossorigin="anonymous" referrerpolicy="no-referrer" />
<link rel="stylesheet" href="https://fastly.jsdelivr.net/npm/flatpickr@4.6.13/dist/plugins/monthSelect/style.min.css">
@endsection



@section('fixedcontent')

<!-- session successful message -->
@if (Session::has('success'))
<div id="flash-msg" class="shadow pt-3">
    <div class="d-flex justify-content-between mb-2">
        <i class="fas fs-1 fa-check"></i>
        <a id="flash-msg-btn" class="text-blue-300 clickable-item-pointer"><i class="fas fa-times"></i></a>
    </div>
    <h3>Sent Successfully</h3>
    <p class="text-blue-300">{{ Session::get('success') }}</p>
</div>
@endif

@endsection


<!-- content insert -->
@section('content')
<div class="container-fluid px-2 mt-3">

    <!-- page title link -->
    <div class="d-sm-flex align-items-center justify-content-between mb-3">
        <span class="mb-0">
            <a class="link-cust-text text-gray-200 fw-light" href="{{ route('sett.home') }}">{{ __('basic.dashboard') }}
                |</a>
            <a class="link-cust-text text-gray-200 fw-light" href="{{ route('sett.leads.index') }}">{{
                __('basic.leads center') }}
                |</a>
            <a class="text-gray-300">{{ __('basic.all leads') }}</a>
        </span>
        <div class="d-flex justify-content-center mt-2 mt-md-0">

            <a class="main-color-bg text-white btn btn-sm shadow-sm b-r-l-cont p-2 px-4 me-1" data-bs-toggle="modal"
                data-bs-target="#new_record"><i class="fas fa-filter fa-sm me-1"></i> {{ __('basic.search filter')
                }}</a>

            <!-- Modal for search filtering -->
            <div class="modal fade" id="new_record" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel"
                aria-hidden="true">
                <div class="modal-dialog modal-dialog-centered modal-dialog-scrollable">

                    <form class="mb-0" action="{{ route('sett.leads.show', 'all_leads') }}" method="GET"
                        style="display: contents">

                        <div class="modal-content b-r-s-cont border-0">
                            <div class="modal-header">
                                <h5 class="modal-title" id="exampleModalLabel"><i class="fas fa-clipboard me-1"></i>
                                    {{ __('basic.search filter') }}
                                </h5>
                                <button type="button" class="btn-close" data-bs-dismiss="modal"
                                    aria-label="Close"></button>
                            </div>

                            <!-- Modal content -->
                            <div class="modal-body px-5 py-3">

                                <div class="row">

                                    <div class="me-2 mb-3">
                                        <label class="form-label">{{ __('basic.date') }}
                                            <small>({{ __('basic.required') }})</small></label>
                                        <select id="date_filter" name="date_serc"
                                            class="js-example-basic-single js-example-basic-single select2-hidden-accessible">
                                            <option @if($date_serc==="today" ) selected @endif value="today">
                                                {{ __('basic.today')}}
                                            </option>
                                            <option @if($date_serc==="last_week" ) selected @endif value="last_week">
                                                {{ __('basic.last week')}}
                                            </option>
                                            <option @if($date_serc==="last_month" ) selected @endif value="last_month">
                                                {{ __('basic.last month')}}
                                            </option>
                                            <option @if($date_serc==="this_month" ) selected @endif value="this_month">
                                                {{ __('basic.this month')}}
                                            </option>
                                            <option @if($date_serc==="this_year" ) selected @elseif(!$date_serc)
                                                selected @endif value="this_year">
                                                {{ __('basic.this year')}}
                                            </option>
                                            <option @if($date_serc==="last_year" ) selected @endif value="last_year">
                                                {{ __('basic.last year')}}
                                            </option>
                                            <option @if ($date_serc==="date_between" ) selected @endif
                                                value="date_between">
                                                {{ __('basic.date')}}
                                            </option>
                                        </select>
                                    </div>

                                    <div class="col-12 mb-2" id="date_between_cont" @if ($date_serc !=="date_between" )
                                        style="display: none" @endif>
                                        <label class="form-label">{{ __('basic.date between') }}
                                            <small>({{ __('basic.required') }})</small></label>
                                        <div class="input-group">
                                            <div class="input-group-prepend">
                                                <div class="input-group-text"><i class="bi bi-calendar2-week-fill"></i>
                                                </div>
                                            </div>
                                            <input name="day_srch" type="text"
                                                class="form-control datepicker_time bg-white" value="{{ $day_srch }}"
                                                placeholder="YYYY/MM/DD HM" data-enable-time="true">
                                        </div>
                                        @error('date')
                                        <span class="error-msg-form">
                                            {{ $message }}
                                        </span>
                                        @enderror
                                    </div>
                                    <div class="me-2 mb-3">
                                        <label class="form-label">{{ __('basic.branch') }}
                                            <small>({{ __('basic.required') }})</small></label>
                                        <select id="branch_serc" name="branch_serc"
                                            class="js-example-basic-single js-example-basic-single select2-hidden-accessible">
                                            <option value="all">
                                                {{ __('basic.all')}}
                                            </option>
                                            @foreach ($branches as $item)
                                            <option @if ($branch_serc==$item->id) selected @endif value="{{ $item->id
                                                }}">
                                                {{ $item->name }}
                                            </option>
                                            @endforeach
                                        </select>
                                    </div>
                                    <div class="me-2 mb-3">
                                        <label class="form-label">{{ __('basic.client cats') }}
                                            <small>({{ __('basic.required') }})</small></label>
                                        <select id="client_cat_serc" name="client_cat_serc"
                                            class="js-example-basic-single js-example-basic-single select2-hidden-accessible">
                                            <option value="all">
                                                {{ __('basic.all')}}
                                            </option>
                                            @foreach ($client_cats as $item)
                                            <option @if ($client_cat_serc==$item->id) selected @endif value="{{
                                                $item->id
                                                }}">
                                                {{ $item->name }}
                                            </option>
                                            @endforeach
                                        </select>
                                    </div>
                                    <div class="me-2 mb-3">
                                        <label class="form-label">{{ __('basic.worker') }}
                                            <small>({{ __('basic.required') }})</small></label>
                                        <select id="worker_serc" name="worker_serc"
                                            class="js-example-basic-single js-example-basic-single select2-hidden-accessible">
                                            <option value="all">
                                                {{ __('basic.all')}}
                                            </option>
                                            @foreach ($workers as $item)
                                            <option @if ($worker_serc==$item->id) selected @endif value="{{ $item->id
                                                }}">
                                                {{ $item->name }}
                                            </option>
                                            @endforeach
                                        </select>
                                    </div>

                                    <div class="me-2 mb-3">
                                        <label class="form-label">{{ __('basic.action') }}
                                            <small>({{ __('basic.required') }})</small></label>
                                        <select name="action_serc"
                                            class="js-example-basic-single select2-hidden-accessible">
                                            <option value="all" @if($action_serc==="all" ) selected @endif>
                                                {{ __('basic.all')}}
                                            </option>
                                            @foreach ($action_cats as $item)
                                            <option value="{{ $item->id }}" @if($action_serc==$item->id ) selected
                                                @endif>
                                                {{ $item->name}}
                                            </option>
                                            @endforeach
                                        </select>
                                    </div>

                                    <div class="me-2 mb-3">
                                        <label class="form-label">{{ __('basic.resource') }}
                                            <small>({{ __('basic.required') }})</small></label>
                                        <select id="resource_serc" name="resource_serc"
                                            class="js-example-basic-single js-example-basic-single select2-hidden-accessible">
                                            <option value="all">
                                                {{ __('basic.all')}}
                                            </option>
                                            @foreach ($resources as $item)
                                            <option @if ($resource_serc==$item->id) selected @endif value="{{ $item->id
                                                }}">
                                                {{ $item->name }}
                                            </option>
                                            @endforeach
                                        </select>
                                    </div>
                                    <div class="me-2 mb-3">
                                        <label class="form-label">{{ __('basic.campaign') }}
                                            <small>({{ __('basic.required') }})</small></label>
                                        <select id="campaign_serc" name="campaign_serc"
                                            class="js-example-basic-single js-example-basic-single select2-hidden-accessible">
                                            <option value="all">
                                                {{ __('basic.all')}}
                                            </option>
                                            @foreach ($campaigns as $item)
                                            <option @if ($campaign_serc==$item->id) selected @endif value="{{ $item->id
                                                }}">
                                                {{ $item->name }}
                                            </option>
                                            @endforeach
                                        </select>
                                    </div>
                                    <div class="me-2 mb-3">
                                        <label class="form-label">{{ __('basic.project') }}
                                            <small>({{ __('basic.required') }})</small></label>
                                        <select id="project_serc" name="project_serc"
                                            class="js-example-basic-single js-example-basic-single select2-hidden-accessible">
                                            <option value="all">
                                                {{ __('basic.all')}}
                                            </option>
                                            @foreach ($projects as $item)
                                            <option @if ($project_serc==$item->id) selected @endif value="{{ $item->id
                                                }}">
                                                {{ $item->name }}
                                            </option>
                                            @endforeach
                                        </select>
                                    </div>
                                </div>

                            </div>

                            <div class="modal-footer">
                                <div class="left-side">
                                    <button type="button" class="btn btn-default btn-link" data-bs-dismiss="modal">{{
                                        __('basic.never mind') }}</button>
                                </div>
                                <div class="divider"></div>
                                <div class="right-side">
                                    <button type="submit" class="btn btn-default btn-link main-color">{{
                                        __('basic.search') }}</button>
                                </div>
                            </div>
                        </div>
                    </form>

                </div>

            </div>

            <a class="main-color-bg text-white btn btn-sm shadow-sm b-r-l-cont p-2 px-4 me-1" data-bs-toggle="modal"
                data-bs-target="#create_new_modal"><i class="fas fa-plus fa-sm me-1"></i> {{ __('basic.new lead')
                }}</a>

            <!-- Store Modal -->
            <div class="modal side_modal_prox fade" id="create_new_modal" tabindex="-1"
                aria-labelledby="exampleModalLabel" aria-hidden="true">
                <div class="modal-dialog modal-lg shadow-lgg modal-dialog-scrollable">

                    <form id="myform" class="mb-0" action="{{ route('sett.leads.store') }}" method="POST"
                        enctype="multipart/form-data" style="display: contents">
                        @csrf

                        <div class="modal-content">
                            <div class="modal-header">
                                <h5 class="modal-title" id="exampleModalLabel"><i class="fas fa-plus me-1"></i>{{
                                    __('basic.new lead') }}</h5>
                                <button type="button" class="btn-close" data-bs-dismiss="modal"
                                    aria-label="Close"></button>
                            </div>
                            <div class="modal-body px-5">


                                <div class="row mb-1">

                                    <div class="col-12 col-md-5 align-self-center mb-2">
                                        <div class="avatar-update-container">
                                            <div class="picture">
                                                <img src="{{ URL::asset('img/dashboard/avatars/default-pp.png') }}"
                                                    class="picture-src" id="mib_PicturePreview" title="" />
                                                <input type="file" name='avatar' accept="image/*" id="mib_img_input">
                                            </div>
                                            <h6 class="text-gray-300">{{ __('basic.choose pic') }}</h6>
                                            @error('avatar')
                                            <span class="error-msg-form">
                                                {{ $message }}
                                            </span>
                                            @enderror
                                        </div>
                                    </div>

                                    <div class="col-12 col-md-7 mb-2">

                                        <div class="mb-3">
                                            <label class="form-label">
                                                {{ __('patientappo.first name') }}
                                                <small>({{ __('basic.required') }})</small></label>
                                            <input name="first_name" type="text"
                                                class="form-control @error('first_name') is-invalid @enderror"
                                                placeholder="Write your first name here" required
                                                value="{{ old('first_name') }}">
                                        </div>

                                        @error('first_name')
                                        <span class="error-msg-form">
                                            {{ $message }}
                                        </span>
                                        @enderror

                                        <div class="mb-3 company_cont">
                                            <label class="form-label">{{ __('patientappo.second name') }}
                                                <small>({{ __('basic.required') }})</small></label>
                                            <input name="second_name" type="text"
                                                class="form-control @error('second_name') is-invalid @enderror"
                                                placeholder="Write your second name here" required
                                                value="{{ old('second_name') }}">
                                        </div>

                                        @error('second_name')
                                        <span class="error-msg-form">
                                            {{ $message }}
                                        </span>
                                        @enderror
                                    </div>

                                    <div class="row mb-2">
                                        <div class="col-12 col-md-6 mb-2">
                                            <label class="form-label">{{ __('patientappo.phone number') }}
                                                <small>({{ __('basic.required') }})</small></label>
                                            <input id="int-miphone" name="phone_number" type="tel"
                                                class="form-control @error('phone_number') is-invalid @enderror"
                                                required value="{{ old('phone_number') }}">

                                            <div id="phonenumber-js-error-valid"></div>
                                            <span class="error-msg-form">
                                                {{ $errors->first('phone_number') }}
                                            </span>
                                        </div>
                                        <div class="col-12 col-md-6 mb-2">
                                            <label class="form-label">{{ __('basic.email') }}
                                                <small>({{ __('basic.optional') }})</small></label>
                                            <input id="email" name="email" type="text"
                                                class="form-control @error('email') is-invalid @enderror"
                                                placeholder="Email ..">
                                        </div>
                                    </div>

                                    <div class="row mb-2">
                                        <div class="col-12 col-md-4 mb-2">
                                            <label class="form-label">{{ __('basic.branch') }}
                                                <small>({{ __('basic.required') }})</small></label>
                                            <select name="first_branch_id"
                                                class="js-example-basic-single_new js-example-basic-single select2-hidden-accessible">
                                                @foreach ($branches as $item)
                                                <option value="{{ $item->id }}">
                                                    {{ $item->name }}
                                                </option>
                                                @endforeach
                                            </select>
                                            @error('first_branch_id')
                                            <span class="error-msg-form">
                                                {{ $message }}
                                            </span>
                                            @enderror
                                        </div>
                                        <div class="col-12 col-md-4 mb-2">
                                            <label class="form-label">{{ __('basic.client cats') }}
                                                <small>({{ __('basic.required') }})</small></label>
                                            <select name="client_cat_id"
                                                class="js-example-basic-single_new js-example-basic-single select2-hidden-accessible">
                                                @foreach ($client_cats as $item)
                                                <option value="{{ $item->id }}">
                                                    {{ $item->name }}
                                                </option>
                                                @endforeach
                                            </select>
                                            @error('client_cat_id')
                                            <span class="error-msg-form">
                                                {{ $message }}
                                            </span>
                                            @enderror
                                        </div>

                                        <div class="col-12 col-md-4 mb-2">
                                            <label class="form-label">{{ __('basic.assign to') }}
                                                <small>({{ __('basic.optional') }})</small></label>
                                            <select name="lead_assign_to_worker_id"
                                                class="js-example-basic-single_new js-example-basic-single select2-hidden-accessible">
                                                <option></option>
                                                @foreach ($workers as $item)
                                                <option value="{{$item->id }}">
                                                    {{ $item->name }}
                                                </option>
                                                @endforeach
                                            </select>
                                            @error('lead_assign_to_worker_id')
                                            <span class="error-msg-form">
                                                {{ $message }}
                                            </span>
                                            @enderror
                                        </div>
                                    </div>


                                    <div class="row mb-2">
                                        <div class="col-12 col-md-4 mb-2">
                                            <label class="form-label">{{ __('patientappo.country') }}
                                                <small>({{ __('basic.required') }})</small></label>
                                            <select
                                                class="js-example-basic-single select2-hidden-accessible @error('country_id') is-invalid @enderror"
                                                name="country_id" required>
                                                @foreach ($countries as $iteam)
                                                <option value="{{ $iteam->id }}">{{ $iteam->name }}
                                                </option>
                                                @endforeach
                                            </select>
                                            <div id="country-js-error-valid"></div>

                                            @error('country_id')
                                            <span class="error-msg-form">
                                                {{ $message }}
                                            </span>
                                            @enderror
                                        </div>
                                        <div class="col-12 col-md-4 mb-2">
                                            <label class="form-label">{{ __('patientappo.city') }}
                                                <small>({{ __('basic.required') }})</small></label>
                                            <select
                                                class="js-example-basic-single select2-hidden-accessible @error('city_id') is-invalid @enderror"
                                                name="city_id" required>
                                                <option disabled selected>Open this select menu</option>
                                            </select>

                                            <div id="city-js-error-valid"></div>

                                            @if ($errors->has('city_id'))
                                            <span class="error-msg-form">
                                                {{ $errors->first('city_id') }}
                                            </span>
                                            @else
                                            <div class="form-text text-gray-200">{{ __('patientappo.city msg') }}
                                            </div>
                                            @endif
                                        </div>

                                        <div class="col-12 col-md-4 mb-2">
                                            <label class="form-label">{{ __('basic.region') }}
                                                <small>({{ __('basic.required') }})</small></label>
                                            <select
                                                class="js-example-basic-single select2-hidden-accessible @error('region_id') is-invalid @enderror"
                                                name="region_id" required>
                                                <option value="1">Not Selected</option>
                                            </select>

                                            <div id="region-js-error-valid"></div>

                                            @error('region_id')
                                            <span class="error-msg-form">
                                                {{ $message }}
                                            </span>
                                            @enderror
                                        </div>
                                    </div>

                                    <hr>
                                    <div class="row mb-2">
                                        <div class="col-12 col-md-6 mb-2">
                                            <label class="form-label">{{ __('basic.lead source') }}
                                                <small>({{ __('basic.optional') }})</small></label>
                                            <select name="from_recourse_id"
                                                class="js-example-basic-single js-example-basic-single select2-hidden-accessible">
                                                @foreach ($resources as $item)
                                                <option value="{{ $item->id }}">
                                                    {{ $item->name }}
                                                </option>
                                                @endforeach
                                            </select>
                                        </div>
                                        <div class="col-12 col-md-6 mb-2">
                                            <label class="form-label">{{ __('basic.campaign') }}
                                                <small>({{ __('basic.optional') }})</small></label>
                                            <select name="crm_campaign_id"
                                                class="js-example-basic-single js-example-basic-single select2-hidden-accessible">
                                                <option></option>
                                                @foreach ($campaigns as $item)
                                                <option value="{{ $item->id }}">
                                                    {{ $item->name }}
                                                </option>
                                                @endforeach
                                            </select>
                                        </div>
                                    </div>

                                    <div class="row mb-2">
                                        <div class="col-12 col-md-4 mb-2">
                                            <label class="form-label">{{ __('basic.project') }}
                                                <small>({{ __('basic.optional') }})</small></label>
                                            <select name="project_id"
                                                class="js-example-basic-single js-example-basic-single select2-hidden-accessible">
                                                <option></option>
                                                @foreach ($projects as $item)
                                                <option value="{{ $item->id }}">
                                                    {{ $item->name }}
                                                </option>
                                                @endforeach
                                            </select>
                                        </div>

                                        <div class="col-12 col-md-4 mb-2">
                                            <label class="form-label">{{ __('basic.action stage') }}
                                                <small>({{ __('basic.optional') }})</small></label>
                                            <select name="last_crm_leads_action_cat_id"
                                                class="js-example-basic-single js-example-basic-single select2-hidden-accessible">
                                                @foreach ($action_cats as $item)
                                                <option value="{{ $item->id }}">
                                                    {{ $item->name }}
                                                </option>
                                                @endforeach
                                            </select>
                                        </div>

                                        <div class="col-12 col-md-4 mb-2">
                                            <label class="form-label">{{ __('basic.action') }}
                                                <small>({{ __('basic.optional') }})</small></label>
                                            <select
                                                class="js-example-basic-single select2-hidden-accessible last_crm_leads_action_sub_cat_id @error('last_crm_leads_action_sub_cat_id') is-invalid @enderror"
                                                name="last_crm_leads_action_sub_cat_id">
                                                <option disabled selected>- Select action stage -</option>
                                            </select>
                                            <div id="last_crm_leads_action_sub_cat_id-js-error-valid"></div>
                                            @if ($errors->has('last_crm_leads_action_sub_cat_id'))
                                            <span class="error-msg-form">
                                                {{ $errors->first('last_crm_leads_action_sub_cat_id') }}
                                            </span>
                                            @endif
                                        </div>

                                    </div>

                                    <div class="row mb-2">
                                        <div class="col-12 mb-0">
                                            <label class="form-label">{{ __('basic.comment') }}
                                                <small>({{ __('basic.optional') }})</small></label>
                                            <textarea name="last_crm_comment" class="form-control"
                                                placeholder="Write here your comment .." rows="4"
                                                spellcheck="false">{{ old('last_crm_comment') }}</textarea>
                                        </div>
                                        @error('last_crm_comment')
                                        <span class="error-msg-form">
                                            {{ $message }}
                                        </span>
                                        @enderror
                                    </div>

                                </div>
                            </div>
                            <div class="modal-footer">
                                <span class="text-gray-300 clickable-item-pointer me-3" data-bs-dismiss="modal">{{
                                    __('basic.close') }}</span>
                                <button type="submit" class="btn btn-primary px-5">{{ __('basic.send') }}</button>
                            </div>
                        </div>
                    </form>
                </div>
            </div>

        </div>
    </div>


    <div class="text-center mb-4">
        <h5 class="fw-bold">{{ __('basic.leads list') }}</h5>

        <h6 class="text-gray-500">{{ __('basic.leads') }}</h6>

        <h6 class="text-gray-500">
            <span>{{ __('basic.from') }} </span> {{ $date_from }}
            <span>{{ __('basic.to') }} </span> {{ $date_to }}
        </h6>
    </div>



    <div class="row">
        <!-- total doctors -->
        <div class="col-xl-3 col-md-6 mb-4">
            <div class="card shadow h-100 main-color-bg p-1 ">
                <div class="card-body p-2 px-5 px-md-4">
                    <div class="row align-items-center">
                        <p class="text-center text-xs fw-bold text-blue-200 px-0">
                            {{ __('basic.total leads') }}
                        </p>
                        <div class="col me-2 p-0">
                            <div class="h3 mb-0 fw-bold text-white"> {{ $month_leads }}
                            </div>
                            <div class="text-xxs text-blue-300 text-uppercase">
                                {{ __('basic.leads') }}</div>
                        </div>
                        <div class="col text-end p-0 text-white">
                            <i class="fas fa-bullseye text-xl fs-1"></i>
                        </div>
                    </div>
                </div>
            </div>
        </div>

        <!-- total doctors -->
        <div class="col-xl-3 col-md-6 mb-4">
            <div class="card shadow h-100 p-1 ">
                <div class="card-body p-2 px-5 px-md-4">
                    <div class="row align-items-center">
                        <p class="text-center text-xs fw-bold text-gray-400 px-0">
                            {{ __('basic.total conversion to clients')
                            }}</p>
                        <div class="col-6 me-2 p-0">
                            <div class="h3 mb-0 fw-bold text-grat-800">{{ $month_leads_converted }}
                            </div>
                            <div class="text-xxs text-gray-400 text-uppercase">
                                {{ __('basic.converted to client') }}</div>
                        </div>
                        <div class="col text-end p-0 text-gray-300">
                            <i class="fas fa-tasks text-xl fs-1"></i>
                        </div>
                    </div>
                </div>
            </div>
        </div>

        <!-- total doctors -->
        <div class="col-xl-3 col-md-6 mb-4">
            <div class="card shadow h-100 p-1 ">
                <div class="card-body p-2 px-5 px-md-4">
                    <div class="row align-items-center">
                        <p class="text-center text-xs fw-bold text-gray-400 px-0">
                            {{ __('basic.conversion rate to clients') }}</p>
                        <div class="col-7 me-2 p-0">
                            @php
                            $conversion_to_client_precentage_month = round($month_leads_converted != 0 ?
                            $month_leads_converted / $month_leads * 100 : 0, 2);
                            @endphp
                            <div class="h3 mb-0 fw-bold text-grat-800"> {{ $conversion_to_client_precentage_month }} %
                            </div>

                        </div>
                        <div class="col text-end p-0 text-gray-300">
                            <i class="fas fa-tasks text-xl fs-1"></i>
                        </div>
                    </div>
                </div>
            </div>
        </div>


        <!-- total doctors -->
        <div class="col-xl-3 col-md-6 mb-4">
            <div class="card shadow h-100 p-1 ">
                <div class="card-body p-2 px-5 px-md-4">
                    <div class="row align-items-center">
                        <p class="text-center text-xs fw-bold text-gray-400 px-0">
                            {{ __('basic.action with leads')
                            }}</p>
                        <div class="col me-2 p-0">
                            <div class="h3 mb-0 fw-bold text-grat-800"> {{ $month_action }}
                            </div>
                            <div class="text-xxs text-gray-400 text-uppercase">
                                {{ __('basic.leads') }}</div>
                        </div>
                        <div class="col text-end p-0 text-gray-300">
                            <i class="fas fa-check text-xl fs-1"></i>
                        </div>
                    </div>
                </div>
            </div>
        </div>

        <!-- total doctors -->
        <div class="col-xl-3 col-md-6 mb-4">
            <div class="card shadow h-100 p-1 ">
                <div class="card-body p-2 px-5 px-md-4">
                    <div class="row align-items-center">
                        <p class="text-center text-xs fw-bold text-gray-400 px-0">{{
                            __('basic.no action with leads') }}</p>
                        <div class="col me-2 p-0">
                            <div class="h3 mb-0 fw-bold text-grat-800"> {{ $month_no_action }}
                            </div>
                            <div class="text-xxs text-gray-400 text-uppercase">
                                {{ __('basic.leads') }}</div>
                        </div>

                        <div class="col text-end p-0 text-gray-300">
                            <i class="fas fa-times text-xl fs-1"></i>
                        </div>
                    </div>
                </div>
            </div>
        </div>

        <!-- total doctors -->
        <div class="col-xl-3 col-md-6 mb-4">
            <div class="card shadow h-100 p-1 ">
                <div class="card-body p-2 px-5 px-md-4">
                    <div class="row align-items-center">
                        <p class="text-center text-xs fw-bold text-gray-400 px-0">{{ __('basic.not interested')
                            }}</p>
                        <div class="col me-2 p-0">
                            <div class="h3 mb-0 fw-bold text-grat-800">
                                {{ $month_junk_lost }}
                            </div>
                            <div class="text-xxs text-gray-400 text-uppercase">
                                {{ __('basic.leads') }}</div>

                        </div>

                        <div class="col text-end p-0 text-gray-300">
                            <i class="fas fa-question text-xl fs-1"></i>
                        </div>

                    </div>
                </div>
            </div>
        </div>

        <!-- total income -->
        <div class="col-xl-3 col-md-6 mb-4">
            <div class="card shadow h-100 p-1 ">
                <div class="card-body p-2 px-5 px-md-4">
                    <div class="row align-items-center">
                        <p class="text-center text-xs fw-bold text-gray-400 px-0">{{
                            __('basic.contacted') }}
                        </p>
                        <div class="col me-2 p-0">
                            <div class="h3 mb-0 fw-bold text-grat-800">
                                {{ $month_attempted_to_contact }}
                            </div>
                            <div class="text-xxs text-gray-400 text-uppercase">
                                {{ __('basic.leads') }}</div>
                        </div>
                        <div class="col text-end p-0 text-gray-300">
                            <i class="fas fa-phone text-xl fs-1"></i>
                        </div>

                    </div>
                </div>
            </div>
        </div>

        <!-- total expenses -->
        <div class="col-xl-3 col-md-6 mb-4">
            <div class="card shadow h-100 p-1 ">
                <div class="card-body p-2 px-5 px-md-4">
                    <div class="row align-items-center">
                        <p class="text-center text-xs fw-bold text-gray-400 px-0">{{ __('basic.interested') }}</p>
                        <div class="col me-2 p-0 text-truncate">
                            <div class="h3 text-truncate mb-0 fw-bold text-grat-800">
                                {{ $month_following }}
                            </div>
                            <div class="text-xxs text-gray-400 text-uppercase">
                                {{ __('basic.leads') }}</div>
                        </div>
                        <div class="col text-end p-0 text-gray-300">
                            <i class="fas fa-stream text-xl fs-1"></i>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>


    <div class="card shadow mb-3 pb-2">

        <!-- Card Header - Dropdown -->
        <div class="card-header py-3 d-flex flex-row align-items-center justify-content-between">
            <h6 class="m-0 fw-bold text-gray-500"><i class="fas fa-bullhorn me-2"></i>{{ __('basic.leads') }}
            </h6>
            <div class="dropdown no-arrow">
                <a class="dropdown-toggle" href="#" role="button" id="dropdownMenuLink" data-bs-toggle="dropdown"
                    aria-haspopup="true" aria-expanded="false">
                    <i class="fas fa-ellipsis-v fa-sm fa-fw text-gray-300"></i>
                </a>
                <div class="dropdown-menu dropdown-menu-right shadow animated--fade-in"
                    aria-labelledby="dropdownMenuLink">
                    <div class="dropdown-header">Action:</div>
                </div>
            </div>
        </div>

        <!-- Card Body -->
        <div class="card-body">

            @foreach ($errors->all() as $error)
            <div class="text-red"><i class="fas fa-exclamation me-1"></i> {{ $error }}</div>
            @endforeach

            <div class="table-responsive">
                <table class="table display datatable-modal" id="p-lab-table" width="100%" cellspacing="0">
                    <thead>
                        <tr>
                            <th class="text-xs text-center">{{ __('basic.client') }}</th>
                            <th class="text-xs text-center">{{ __('basic.phone') }}</th>
                            <th class="text-xs text-center">{{ __('basic.project') }}</th>
                            <th class="text-xs text-center">{{ __('basic.campaign') }}</th>
                            <th class="text-xs text-center">{{ __('basic.assigned to') }}</th>
                            <th class="text-xs text-center">{{ __('basic.branch') }}</th>
                            <th class="text-xs text-center">{{ __('basic.last action') }}</th>
                            <th class="text-xs text-center">{{ __('basic.last comment') }}</th>
                            <th class="text-xs text-center">{{ __('basic.created') }}</th>
                            <th class="text-xs text-center">{{ __('basic.handle') }}</th>
                        </tr>
                    </thead>
                    <tbody>
                        @php
                        $total_sell = 0;
                        @endphp
                        @foreach ($leads as $item)
                        @if ($item->type == 1)
                        @php
                        $text_color = 'main-color-btn';
                        $msg = __('basic.real client');
                        $icon = "fas fa-check";
                        @endphp
                        @elseif ($item->type == 2)
                        @php
                        $text_color = 'not_accepted-color-btn';
                        $msg = __('basic.cold');
                        $icon = "fas fa-snowflake";
                        @endphp
                        @elseif ($item->type == 3)
                        @php
                        $text_color = 'prog-color-btn';
                        $msg = __('basic.warm');
                        $icon = "fas fa-mug-hot";
                        @endphp
                        @elseif ($item->type == 4)
                        @php
                        $text_color = 'active-color-btn';
                        $msg = __('basic.hot');
                        $icon = "fas fa-fire";
                        @endphp
                        @elseif ($item->type == 5)
                        @php
                        $text_color = 'cancel-color-btn';
                        $msg = __('basic.not interested');
                        $icon = "fas fa-times";
                        @endphp
                        @else
                        @php
                        $text_color = 'not_accepted-color-btn';
                        $msg = __('basic.not interested');
                        $icon = "fas fa-times";
                        @endphp
                        @endif

                        <tr>

                            <td class="text-center">
                                <a class="link-cust-text text-gray-400" href="{{ route('sett.patient.show',
                        $item->id) }}">{{ $item->full_name }}</a>
                            </td>
                            <td class="text-center">
                                <a class="link-cust-text text-gray-400" href="tel:+{{  $item->phone_number }}">{{
                                    $item->phone_number
                                    }}</a>
                            </td>

                            {{-- <td class="text-center"> <span
                                    class="badge rounded-pill {{ $text_color }} badge-padd-l ,e"><i
                                        class="{{ $icon }} me-2"></i>{{
                                    $msg
                                    }}</span>
                            </td> --}}
                            <td>
                                @if($item->project)
                                {{ $item->project->name }}
                                @endif
                            </td>
                            <td>
                                @if($item->campaign)
                                {{ $item->campaign->name }}
                                @endif
                            </td>
                            <td class="text-center">
                                @if($item->responsible)
                                {{ $item->responsible->full_name}}
                                @endif
                            </td>
                            <td>
                                @if($item->branch)
                                {{ $item->branch->name }}
                                @else
                                {{ __('basic.not selected') }}
                                @endif
                            </td>
                            <td>
                                @if($item->last_leads_action)
                                <span class="badge rounded-pill badge-padd-l text-gray-600"
                                    style="background-color: {{ $item->last_leads_action->color }};"><i
                                        class="{{ $item->last_leads_action->icon }} me-2"></i>{{
                                    $item->last_leads_action->name
                                    }}

                                    @if($item->last_leads_sub_action)
                                    | {{ $item->last_leads_sub_action->name }}
                                    @endif
                                </span>
                                @else
                                <div>
                                    <span class="badge rounded-pill badge-padd-l text-gray-600"
                                        style="background-color:#f1f1f1;"> <i
                                            class="fas fa-circle text-red me-1 text-xs"></i>
                                        {{ __('basic.no action') }}</span>

                                </div>
                                @endif
                            </td>
                            <td>
                                {{ $item->last_crm_comment }}
                            </td>
                            <td>
                                @if($item->creator)
                                <p class="mb-0"> - {{ $item->creator->full_name }}</p>
                                <p class="mb-0"> - {{ date('d M Y', strtotime($item->created_at)) }}</p>

                                @else
                                {{ __('basic.not selected') }}
                                @endif
                            </td>

                            <td>
                                <div class="badge rounded-pill bg-gray-500 badge-padd-l text-s">
                                    <a target="_blank"
                                        href="{{ 'https://wa.me/2' . $item->phone_number . '?text=Hello ' . $item->first_name . "
                                        have a nice day" }}">
                                        <i class="fab fa-whatsapp me-1 text-green "></i></a>

                                    <a target="_blank"
                                        href="{{ 'https://www.truecaller.com/search/eg/' . $item->phone_number }}">
                                        <img class="me-1" src="{{ URL::asset('img/icons/truecaller_icon.svg') }}"
                                            style="width: 16px;" alt="TrueCaller" /></a>

                                    <a href="tel:+{{  $item->phone_number }}"> <i
                                            class="fas fa-phone me-1 text-gray-500"></i></a>


                                    <a alt="convert to client" class="clickable-item-pointer" data-bs-toggle="modal"
                                        data-bs-target="#convert_modal_{{ $item->id }}"> <i
                                            class="fas fa-exchange-alt me-1 "></i></a>

                                    @if (count($item->actions) > 0)
                                    <a class="clickable-item-pointer" data-bs-toggle="modal"
                                        data-bs-target="#show_actions_{{ $item->id }}"> <i
                                            class="fas fa-history me-1 "></i></a>
                                    @endif

                                    <a data-id="{{ $item->id }}" data-bs-toggle="modal"
                                        data-bs-target="#update_lead_modal_{{ $item->id }}"
                                        class="clickable-item-pointer"> <i
                                            class="fas fa-edit me-1 text-green-ligh"></i></a>

                                    <a data-id="{{ $item->id }}" class="new_action_modal_btn clickable-item-pointer"> <i
                                            class="fas fa-plus me-1 main-color"></i></a>

                                </div>

                                <!-- Modal -->
                                <div class="modal fade" id="convert_modal_{{ $item->id }}" tabindex="-1"
                                    aria-labelledby="exampleModalLabel" aria-hidden="true">
                                    <div class="modal-dialog modal-dialog-centered modal-dialog-scrollable ">
                                        <div class="modal-content b-r-s-cont border-0">

                                            <div class="modal-header">
                                                <div class="modal-title" id="exampleModalLabel"><i
                                                        class="fas fa-exchange-alt me-1"></i>
                                                    {{ __('basic.convert to client') }}</div>
                                                <button type="button" class="btn-close" data-bs-dismiss="modal"
                                                    aria-label="Close"></button>
                                            </div>

                                            <form action="{{ route('sett.convert_to_client') }}" method="post">
                                                {{ method_field('post') }}
                                                {{ csrf_field() }}

                                                <!-- Modal content -->
                                                <div class="modal-body px-4">
                                                    <div class="modal-body delete-conf-input text-center py-0">
                                                        <p class="mb-0">{{ __('basic.convert to client') }}</p><br>
                                                        <input type="hidden" name="item_id" value="{{ $item->id }}">
                                                    </div>
                                                </div>

                                                <div class="modal-footer">
                                                    <div class="left-side">
                                                        <button type="button" class="btn btn-default btn-link"
                                                            data-bs-dismiss="modal">{{
                                                            __('basic.never mind') }}</button>
                                                    </div>
                                                    <div class="divider"></div>
                                                    <div class="right-side">
                                                        <button type="submit" class="btn btn-default btn-link text-red">
                                                            {{ __('basic.convert') }}
                                                        </button>
                                                    </div>

                                                </div>
                                            </form>

                                        </div>
                                    </div>
                                </div>

                                <!-- Store Modal -->
                                <div class="modal side_modal_prox fade" id="update_lead_modal_{{ $item->id }}"
                                    tabindex="-1" aria-labelledby="exampleModalLabel" aria-hidden="true">
                                    <div class="modal-dialog modal-lg shadow-lgg modal-dialog-scrollable">

                                        <form id="myform" class="mb-0"
                                            action="{{ route('sett.leads.update', $item->id) }}" method="POST"
                                            enctype="multipart/form-data" style="display: contents">
                                            {{ method_field('PUT') }}
                                            @csrf

                                            <div class="modal-content">
                                                <div class="modal-header">
                                                    <h5 class="modal-title" id="exampleModalLabel"><i
                                                            class="fas fa-plus me-1"></i>{{
                                                        __('basic.update lead') }}</h5>
                                                    <button type="button" class="btn-close" data-bs-dismiss="modal"
                                                        aria-label="Close"></button>
                                                </div>
                                                <div class="modal-body px-5">

                                                    <div class="row mb-1">

                                                        <div class="col-12 col-md-5 align-self-center mb-2">
                                                            <div class="avatar-update-container">
                                                                <div class="picture">
                                                                    <img src="{{ URL::asset('img/useravatar/' . $item->avatar) }}"
                                                                        class="picture-src" id="mib_PicturePreview"
                                                                        title="" />
                                                                    <input type="file" name='avatar' accept="image/*"
                                                                        id="mib_img_input">
                                                                </div>
                                                                <h6 class="text-gray-300">{{ __('basic.choose pic') }}
                                                                </h6>
                                                                @error('avatar')
                                                                <span class="error-msg-form">
                                                                    {{ $message }}
                                                                </span>
                                                                @enderror
                                                            </div>
                                                        </div>

                                                        <div class="col-12 col-md-7 mb-2">

                                                            <div class="mb-3">
                                                                <label class="form-label">
                                                                    {{ __('basic.first name') }}
                                                                    <small>({{ __('basic.required') }})</small></label>
                                                                <input name="first_name" type="text"
                                                                    class="form-control @error('first_name') is-invalid @enderror"
                                                                    placeholder="Write your first name here" required
                                                                    value="{{ $item->first_name }}">
                                                            </div>

                                                            @error('first_name')
                                                            <span class="error-msg-form">
                                                                {{ $message }}
                                                            </span>
                                                            @enderror

                                                            <div class="mb-3 company_cont">
                                                                <label class="form-label">
                                                                    {{ __('basic.second name') }}
                                                                    <small>({{ __('basic.optional') }})</small></label>
                                                                <input name="second_name" type="text"
                                                                    class="form-control @error('second_name') is-invalid @enderror"
                                                                    placeholder="Write your second name here"
                                                                    value="{{ $item->second_name }}">
                                                            </div>

                                                            @error('second_name')
                                                            <span class="error-msg-form">
                                                                {{ $message }}
                                                            </span>
                                                            @enderror
                                                        </div>

                                                        <div class="row mb-2">
                                                            <div class="col-12 col-md-6 mb-2">
                                                                <label class="form-label">
                                                                    {{ __('basic.phone number') }}
                                                                    <small>({{ __('basic.required') }})</small></label>
                                                                <input id="int-miphone" name="phone_number" type="tel"
                                                                    class="form-control @error('phone_number') is-invalid @enderror"
                                                                    required value="{{ $item->phone_number }}">

                                                                <div id="phonenumber-js-error-valid"></div>
                                                                <span class="error-msg-form">
                                                                    {{ $errors->first('phone_number') }}
                                                                </span>
                                                            </div>
                                                            <div class="col-12 col-md-6 mb-2">
                                                                <label class="form-label">{{ __('basic.email') }}
                                                                    <small>({{ __('basic.optional') }})</small></label>
                                                                <input id="email" name="email" type="text"
                                                                    class="form-control @error('email') is-invalid @enderror"
                                                                    placeholder="Email .." value="{{ $item->email }}">
                                                            </div>
                                                        </div>

                                                        <div class="row mb-2">
                                                            <div class="col-12 col-md-4 mb-2">
                                                                <label class="form-label">{{ __('basic.branch') }}
                                                                    <small>({{ __('basic.required') }})</small></label>
                                                                <select name="first_branch_id"
                                                                    class="js-example-basic-single select2-hidden-accessible">
                                                                    @foreach ($branches as $item_br)
                                                                    <option @if($item_br->id ==
                                                                        $item->first_branch_id) selected
                                                                        @endif value="{{ $item_br->id }}">
                                                                        {{ $item_br->name }}
                                                                    </option>
                                                                    @endforeach
                                                                </select>
                                                                @error('first_branch_id')
                                                                <span class="error-msg-form">
                                                                    {{ $message }}
                                                                </span>
                                                                @enderror
                                                            </div>
                                                            <div class="col-12 col-md-4 mb-2">
                                                                <label class="form-label">{{ __('basic.client cats') }}
                                                                    <small>({{ __('basic.required') }})</small></label>
                                                                <select name="client_cat_id"
                                                                    class="js-example-basic-single_new js-example-basic-single select2-hidden-accessible">
                                                                    @foreach ($client_cats as $item_cat)
                                                                    <option value="{{ $item->id }}" @if($item_cat->id
                                                                        == $item->client_cat_id) selected
                                                                        @endif>
                                                                        {{ $item_cat->name }}
                                                                    </option>
                                                                    @endforeach
                                                                </select>
                                                                @error('client_cat_id')
                                                                <span class="error-msg-form">
                                                                    {{ $message }}
                                                                </span>
                                                                @enderror
                                                            </div>

                                                            <div class="col-12 col-md-4 mb-2">
                                                                <label class="form-label">{{ __('basic.assign to') }}
                                                                    <small>({{ __('basic.optional') }})</small></label>
                                                                <select name="lead_assign_to_worker_id"
                                                                    class="js-example-basic-single select2-hidden-accessible">
                                                                    <option></option>
                                                                    @foreach ($workers as $item_wrok)
                                                                    <option @if($item_wrok->id ==
                                                                        $item->lead_assign_to_worker_id) selected
                                                                        @endif value="{{$item_wrok->id }}">
                                                                        {{ $item_wrok->name }}
                                                                    </option>
                                                                    @endforeach
                                                                </select>
                                                                @error('lead_assign_to_worker_id')
                                                                <span class="error-msg-form">
                                                                    {{ $message }}
                                                                </span>
                                                                @enderror
                                                            </div>
                                                        </div>


                                                        <div class="row mb-2">

                                                            <div class="col-12 col-md-4 mb-2">
                                                                <label class="form-label">{{ __('patientappo.country')
                                                                    }}
                                                                    <small>({{ __('basic.required') }})</small></label>
                                                                <select
                                                                    class="js-example-basic-single select2-hidden-accessible @error('country_id') is-invalid @enderror"
                                                                    name="country_id" required>
                                                                    <option value="{{ $item->country_id }}">{{
                                                                        $item->country->name }}</option>
                                                                    @foreach ($countries as $iteam)
                                                                    <option value="{{ $iteam->id }}">{{ $iteam->name }}
                                                                    </option>
                                                                    @endforeach
                                                                </select>
                                                                <div id="country-js-error-valid"></div>

                                                                @error('country_id')
                                                                <span class="error-msg-form">
                                                                    {{ $message }}
                                                                </span>
                                                                @enderror
                                                            </div>

                                                            <div class="col-12 col-md-4 mb-2">
                                                                <label class="form-label">{{ __('patientappo.city') }}
                                                                    <small>({{ __('basic.required') }})</small></label>
                                                                <select
                                                                    class="js-example-basic-single select2-hidden-accessible @error('city_id') is-invalid @enderror"
                                                                    name="city_id" required>
                                                                    <option value="{{ $item->city_id }}">{{
                                                                        $item->city->name }}</option>
                                                                    </option>
                                                                </select>

                                                                <div id="city-js-error-valid"></div>

                                                                @if ($errors->has('city_id'))
                                                                <span class="error-msg-form">
                                                                    {{ $errors->first('city_id') }}
                                                                </span>
                                                                @else
                                                                <div class="form-text text-gray-200">{{
                                                                    __('patientappo.city msg') }}
                                                                </div>
                                                                @endif
                                                            </div>


                                                            <div class="col-12 col-md-4 mb-2">
                                                                <label class="form-label">{{ __('basic.region') }}
                                                                    <small>({{ __('basic.required') }})</small></label>
                                                                <select
                                                                    class="js-example-basic-single select2-hidden-accessible @error('region_id') is-invalid @enderror"
                                                                    name="region_id" required>
                                                                    <option value="{{ $item->region_id }}">{{
                                                                        $item->region->name }}</option>
                                                                </select>

                                                                <div id="region-js-error-valid"></div>

                                                                @error('region_id')
                                                                <span class="error-msg-form">
                                                                    {{ $message }}
                                                                </span>
                                                                @enderror
                                                            </div>

                                                        </div>

                                                        <hr>
                                                        <div class="row mb-2">
                                                            <div class="col-12 col-md-6 mb-2">
                                                                <label class="form-label">{{ __('basic.lead source') }}
                                                                    <small>({{ __('basic.optional') }})</small></label>
                                                                <select name="from_recourse_id"
                                                                    class="js-example-basic-single select2-hidden-accessible">
                                                                    @foreach ($resources as $item_res)
                                                                    <option @if($item_res->id ==
                                                                        $item->from_recourse_id) selected
                                                                        @endif value="{{ $item_res->id }}">
                                                                        {{ $item_res->name }}
                                                                    </option>
                                                                    @endforeach
                                                                </select>
                                                            </div>
                                                            <div class="col-12 col-md-6 mb-2">
                                                                <label class="form-label">{{ __('basic.campaign') }}
                                                                    <small>({{ __('basic.optional') }})</small></label>
                                                                <select name="crm_campaign_id"
                                                                    class="js-example-basic-single select2-hidden-accessible">
                                                                    <option></option>
                                                                    @foreach ($campaigns as $item_camp)
                                                                    <option @if($item_camp->id ==
                                                                        $item->crm_campaign_id)
                                                                        selected
                                                                        @endif value="{{ $item_camp->id }}">
                                                                        {{ $item_camp->name }}
                                                                    </option>
                                                                    @endforeach
                                                                </select>
                                                            </div>
                                                        </div>

                                                        <div class="row mb-2">
                                                            <div class="col-12 mb-2">
                                                                <label class="form-label">{{ __('basic.project') }}
                                                                    <small>({{ __('basic.optional') }})</small></label>
                                                                <select name="project_id"
                                                                    class="js-example-basic-single select2-hidden-accessible">
                                                                    <option></option>
                                                                    @foreach ($projects as $item_pro)
                                                                    <option @if($item_pro->id == $item->project_id)
                                                                        selected
                                                                        @endif value="{{ $item_pro->id }}">
                                                                        {{ $item_pro->name }}
                                                                    </option>
                                                                    @endforeach
                                                                </select>
                                                            </div>
                                                        </div>

                                                    </div>
                                                </div>
                                                <div class="modal-footer">
                                                    <span class="text-gray-300 clickable-item-pointer me-3"
                                                        data-bs-dismiss="modal">{{
                                                        __('basic.close') }}</span>
                                                    <button type="submit" class="btn btn-primary px-5">{{
                                                        __('basic.update') }}</button>
                                                </div>
                                            </div>
                                        </form>
                                    </div>
                                </div>

                                <!-- Modal for note -->
                                <div class="modal fade" id="show_actions_{{ $item->id }}" tabindex="-1" role="dialog"
                                    aria-labelledby="exampleModalLabel" aria-hidden="true">
                                    <div class="modal-dialog modal-dialog-centered modal-dialog-scrollable">

                                        <div class="modal-content b-r-s-cont border-0">
                                            <div class="modal-header">
                                                <h5 class="modal-title" id="exampleModalLabel"><i
                                                        class="fas fa-wallet me-1"></i>
                                                    {{ __('basic.actions history') }}</h5>
                                                <button type="button" class="btn-close" data-bs-dismiss="modal"
                                                    aria-label="Close"></button>
                                            </div>

                                            <!-- Modal content -->
                                            <div class="modal-body px-5 py-3">

                                                <div class="row mb-2">
                                                    <ul class="list-group patient-timeline">
                                                        @if (count($item->actions) > 0)
                                                        @foreach ($item->actions as $item2)

                                                        @if ($item2->status == 3)
                                                        @php
                                                        $text_color = 'done-color';
                                                        $msg = __('basic.interested');
                                                        @endphp
                                                        @elseif ($item2->status == 4)
                                                        @php
                                                        $text_color = 'cancel-color';
                                                        $msg = __('basic.not interested');
                                                        @endphp
                                                        @else
                                                        @php
                                                        $text_color = 'cancel-color';
                                                        $msg = __('basic.not interested');
                                                        @endphp
                                                        @endif

                                                        <li
                                                            class="row flex-nowrap list-group-item d-flex justify-content-between position-relative">

                                                            <i
                                                                class="col patient-timeline-pointer fas fa-circle text-xxs mb-0 {{ $text_color }}"></i>

                                                            <div class="col me-1">
                                                                <p class="text-xs fw-bold text-gray-300 mb-0">
                                                                    {{ $item2->creator->full_name }}</p>
                                                                <h6 class="text-s fw-bold {{ $text_color }} mb-0">
                                                                    {{ date('d M Y', strtotime($item2->created_at))
                                                                    }}
                                                                </h6>
                                                                <p class="text-xs {{ $text_color }} fw-bold mb-0">
                                                                    @if($item2->action)
                                                                    {{ $item2->action->name }}
                                                                    @if($item2->sub_action)
                                                                    | {{ $item2->sub_action->name }}
                                                                    @endif
                                                                    @endif
                                                                </p>
                                                            </div>

                                                            <div class="col text-center align-self-center me-1">
                                                                <p class="text-xs text-gray-200 mb-0">
                                                                    {{ __('basic.comment') }}
                                                                </p>
                                                                <h6 class="text-s text-gray-400">
                                                                    {{ $item2->comment }}
                                                                </h6>
                                                            </div>

                                                        </li>
                                                        @endforeach
                                                        @else
                                                        {{ __('basic.no action has added yet') }}
                                                        @endif
                                                    </ul>
                                                </div>

                                            </div>

                                            <div class="modal-footer">
                                                <div class="left-side">
                                                    <button type="button" class="btn btn-default btn-link"
                                                        data-bs-dismiss="modal">{{
                                                        __('basic.never mind') }}</button>
                                                </div>
                                                <div class="divider"></div>
                                                <div class="right-side">
                                                    <button data-id="{{ $item->id }}"
                                                        class="btn btn-default btn-link main-color new_action_modal_btn">{{
                                                        __('basic.new action') }}</button>
                                                </div>
                                            </div>

                                        </div>
                                    </div>
                                </div>

                            </td>
                        </tr>
                        @endforeach

                    </tbody>
                </table>
            </div>

        </div>

    </div>
</div>


<!-- Modal -->
<div class="modal side_modal_prox fade" id="new_action" tabindex="-1" aria-labelledby="exampleModalLabel"
    aria-hidden="true">
    <div class="modal-dialog shadow-lgg modal-dialog-scrollable">

        <form id="myform" class="mb-0" action="{{ route('sett.add_leads_action') }}" method="POST"
            enctype="multipart/form-data" style="display: contents">
            @csrf
            <div class="modal-content">
                <div class="modal-header">
                    <h5 class="modal-title" id="exampleModalLabel"><i class="fas fa-plus me-1"></i>{{
                        __('basic.new action') }}</h5>
                    <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
                </div>
                <div class="modal-body px-5">
                    <div class="row mb-2">
                        <div class="col-12 mb-2">
                            <label class="form-label">{{ __('basic.stage') }}
                                <small>({{ __('basic.required')
                                    }})</small></label>
                            <select name="last_crm_leads_action_cat_id"
                                class="js-example-basic-single_new_action js-example-basic-single select2-hidden-accessible">
                                <option></option>
                                @foreach ($action_cats as $item_act)
                                @if($item_act->id != 1)
                                <option value="{{ $item_act->id }}">
                                    {{ $item_act->name }}
                                </option>
                                @endif
                                @endforeach
                            </select>
                        </div>

                        <div class="col-12 mb-2">
                            <label class="form-label">{{ __('basic.action') }}
                                <small>({{ __('basic.required') }})</small></label>
                            <select
                                class="js-example-basic-single select2-hidden-accessible last_crm_leads_action_sub_cat_id @error('last_crm_leads_action_sub_cat_id') is-invalid @enderror"
                                name="last_crm_leads_action_sub_cat_id" required>
                                <option disabled selected>- Select action stage -</option>
                            </select>
                            <div id="last_crm_leads_action_sub_cat_id-js-error-valid"></div>
                            @if ($errors->has('last_crm_leads_action_sub_cat_id'))
                            <span class="error-msg-form">
                                {{ $errors->first('last_crm_leads_action_sub_cat_id') }}
                            </span>
                            @endif
                        </div>
                    </div>


                    <div class="row mb-4">
                        <div class="col-12 mb-0">
                            <label class="form-label">{{ __('basic.comment') }}
                                <small>({{ __('basic.optional')
                                    }})</small></label>
                            <textarea name="crm_comment" class="form-control" placeholder="Write here your comment .."
                                rows="4" spellcheck="false">{{ old('crm_comment') }}</textarea>
                        </div>
                    </div>

                    <div class="row mb-0">
                        <div class="d-flex justify-content-lg-between">
                            <div class="">
                                {{ __('basic.set up reminder') }}
                            </div>
                            <div class="switch-checkbox">
                                <input name="reminder" type="checkbox" value="1" id="switch_{{ $item_act->id }}"
                                    data-id="{{ $item_act->id }}"><label for="switch_{{ $item_act->id }}">Toggle</label>
                            </div>
                        </div>
                    </div>

                    <div class="row mb-4" id="remind_cont_{{ $item_act->id }}" style="display: none;">
                        <div class="col-12">
                            <label class="form-label">{{ __('basic.remind date') }}
                                <small>({{ __('basic.required') }})</small></label>
                            <div class="input-group">
                                <div class="input-group-prepend">
                                    <div class="input-group-text"><i class="bi bi-calendar2-week-fill"></i>
                                    </div>
                                </div>
                                <input name="remind_date" type="text" class="form-control datepicker_time_true bg-white"
                                    value="{{ old('remind_date') }}" placeholder="YYYY/MM/DD" required>
                            </div>
                            @error('remind_date')
                            <span class="error-msg-form">
                                {{ $message }}
                            </span>
                            @enderror
                        </div>
                    </div>

                </div>
                <div class="modal-footer">
                    <span class="text-gray-300 clickable-item-pointer me-3" data-bs-dismiss="modal">{{
                        __('basic.close') }}</span>
                    <input type="hidden" id="new_act_client_id" name="new_act_client_id" value="">
                    <button type="submit" class="btn btn-primary px-5">{{
                        __('basic.send') }}</button>
                </div>
            </div>
        </form>
    </div>
</div>

@endsection

<!-- js insert -->
@section('js')

<!-- -- datatables plugin -- -->
<script type="text/javascript" src="https://cdn.datatables.net/1.11.3/js/jquery.dataTables.min.js"></script>
<script type="text/javascript" src="https://cdn.datatables.net/1.11.3/js/dataTables.bootstrap5.min.js"></script>
<script type="text/javascript" src="https://cdn.datatables.net/buttons/2.0.1/js/dataTables.buttons.min.js">
</script>
<script type="text/javascript" src="https://cdn.datatables.net/buttons/2.0.1/js/buttons.bootstrap5.min.js">
</script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jszip/3.1.3/jszip.min.js"></script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.1.53/pdfmake.min.js">
</script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.1.53/vfs_fonts.js">
</script>
<script type="text/javascript" src="https://cdn.datatables.net/buttons/2.0.1/js/buttons.html5.min.js"></script>
<script type="text/javascript" language="javascript"
    src="https://cdn.datatables.net/buttons/2.0.1/js/buttons.print.min.js"></script>

<script type="text/javascript" language="javascript"
    src="https://cdn.datatables.net/buttons/2.0.1/js/buttons.colVis.min.js"></script>
<script
    src="https://nightly.datatables.net/fixedheader/js/dataTables.fixedHeader.js?_=f0de745b101295e88f1504c17177ff49">
</script>

<script>
    $(document).ready(function() {

        var table = $('#p-lab-table').DataTable({
                lengthChange: false,
                "pageLength": 20,
                "order": [
                    [6, "ASC"]
                ],
                buttons: {
                    dom: {
                        button: {
                            className: 'btn btn-table-export me-0' //Primary class for all buttons
                        }
                    },
                    buttons: [{
                            extend: 'copyHtml5',
                            footer: true
                        },
                        {
                            extend: 'excelHtml5',
                            footer: true
                        },
                        {
                            extend: 'pdfHtml5',
                            footer: true
                        },
                        {
                            extend: 'print',
                            footer: true
                        }
                    ]
                }
            }

        );
        table.buttons().container()
            .appendTo('#p-lab-table_wrapper .col-md-6:eq(0)');

    });
</script>

<!-- select 2 -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/select2/4.1.0-rc.0/js/select2.min.js"
    integrity="sha512-4MvcHwcbqXKUHB6Lx3Zb5CEAVoE9u84qN+ZSMM6s7z8IeJriExrV3ND5zRze9mxNlABJ6k864P/Vl8m0Sd3DtQ=="
    crossorigin="anonymous" referrerpolicy="no-referrer"></script>
<script>
    $(document).ready(function() {

        $('.js-example-basic-single_new').select2({
            dropdownParent: $("#create_new_modal"),
        });

        $('.js-example-basic-single_new_action').select2({
            dropdownParent: $("#new_action"),
        });

        $('.js-example-basic-single').each(function() {
            $(this).select2({ dropdownParent: $(this).closest('.modal')});
        })

        //hide search
        $('.select2-no-search').select2({
            minimumResultsForSearch: -1
        });
    });
</script>

<script src="https://cdnjs.cloudflare.com/ajax/libs/flatpickr/4.6.13/flatpickr.min.js"
    integrity="sha512-K/oyQtMXpxI4+K0W7H25UopjM8pzq0yrVdFdG21Fh5dBe91I40pDd9A4lzNlHPHBIP2cwZuoxaUSX0GJSObvGA=="
    crossorigin="anonymous" referrerpolicy="no-referrer"></script>

<script>
    $(document).ready(function() {


        //-------- datepicker time --------
        $('.datepicker_time').flatpickr({
            mode: "range",
            enableTime: false,
            dateFormat: "Y-m-d",
            locale: {
                rangeSeparator: 'to'
            },
        });

        //-------- datepicker time --------
         $('.datepicker_time_true').flatpickr({
            enableTime: true,
            dateFormat: "Y-m-d H:i",
        });
    })


    $('.new_action_modal_btn').on('click', function(e) {
        var id = $(this).data('id');
        $('#new_act_client_id').val(id);
        $('.modal').modal('hide');
        $('#new_action').modal('show');
    });


    $('#date_filter').on('change', function(e) {

        var value = $(this).val();

        if (value === "date_between") {
            $('#date_between_cont').show();
        } else {
            $('#date_between_cont').hide();
        }
    });
</script>

<script>
    fetchLeadSubAction();

//for country and cities ajax inputs
function fetchLeadSubAction() {

    action_id =  $('select[name="last_crm_leads_action_cat_id"]').val();
    closestActionStage =  $('select[name="last_crm_leads_action_sub_cat_id"]');

    var url = "{{ route('sett.fetch_leads_action_sub_cats_ajax', ':id') }}";
    url = url.replace(':id', action_id);

    if (action_id) {
        $.ajax({
            url: url
            , type: "GET"
            , dataType: "json"
            , success: function(data) {
                closestActionStage.empty();
                $.each(data, function(key, value) {
                    closestActionStage.append('<option value="' + value.id + '">' + value.name + '</option>');
                });
            }
        });
    } else {
        closestActionStage.empty();
    }
}

$('select[name="last_crm_leads_action_cat_id"]').on('change', function(e) {

    action_id =  $(this).val();
    closestActionStage =  $(this).parent().parent().find('.last_crm_leads_action_sub_cat_id');

    var url = "{{ route('sett.fetch_leads_action_sub_cats_ajax', ':id') }}";
    url = url.replace(':id', action_id);

    if (action_id) {
        $.ajax({
            url: url
            , type: "GET"
            , dataType: "json"
            , success: function(data) {
                closestActionStage.empty();
                $.each(data, function(key, value) {
                    closestActionStage.append('<option value="' + value.id + '">' + value.name + '</option>');
                });
            }
        });
    } else {
        closestActionStage.empty();
    }
});

fetchCity();

//for country and cities ajax inputs
function fetchCity(countryID = $('select[name="country_id"]').val()) {

    var url = "{{ route('sett.createcityajax', ':id') }}";
    url = url.replace(':id', countryID);

    if (countryID) {
        $.ajax({
            url: url
            , type: "GET"
            , dataType: "json"
            , success: function(data) {
                $('select[name="city_id"]').empty();
                $.each(data, function(key, value) {
                    $('select[name="city_id"]').append('<option value="' + value.id + '">' + value.name + '</option>');
                });
            }
        });
    } else {
        $('select[name="city_id"]').empty();
    }
}

$('select[name="country_id"]').on('change', function(e) {
    var country_id = $(this).val();
    fetchCity(country_id)
});

fetchRegion();

//for country and cities ajax inputs
function fetchRegion(countryID = $('select[name="city_id"]').val()) {

    var url = "{{ route('sett.pat_createregionajax', ':id') }}";
    url = url.replace(':id', countryID);

    if (countryID) {
        $.ajax({
            url: url
            , type: "GET"
            , dataType: "json"
            , success: function(data) {
                $('select[name="region_id"]').empty();
                if(data.length > 0){
                    $.each(data, function(key, value) {
                        $('select[name="region_id"]').append('<option value="' + value.id + '">' + value.name + '</option>');
                    });
                }else{
                    $('select[name="region_id"]').html('<option value="1">{{ __("basic.not selected") }}</option>');
                }
            }
        });
    } else {
        $('select[name="region_id"]').html('<option value="1">{{ __("basic.not selected") }}</option>');
    }
}

$('select[name="city_id"]').on('change', function(e) {
    var country_id = $(this).val();
    fetchRegion(country_id)
});




// make reminder

$('input[name="reminder"]').on('change', function(e) {

    var reminder = $(this);
    var action_id =  "remind_cont_" + $(this).data('id');
        if(reminder.is(':checked')){
        $('#' + action_id).show();
    }else{
        $('#' + action_id).hide();
    }
})

</script>
@endsection