@extends('layouts.master')

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

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

<!-- 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" />

<!-- boostrap datepicker -->
<link rel="stylesheet"
    href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.4.1/css/bootstrap-datepicker3.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

<!-- content insert -->

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

@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

<div class="container-fluid px-md-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.debtorcat.index') }}">{{
                __('basic.suppliers') }} | </a>
            <a class="text-gray-300">{{ __('basic.all suppliers') }}</a>
        </span>
    </div>



    <div class="row">

        <div class="col me-0 me-md-3 mb-3 mb-md-0 px-0 ">

            <div class="position-relative" style="top: 0; left: 0; width: 100%; height: 100%;">

                <div class="bg-white b-r-s-cont shadow pb-4 position-sticky top-0">
                    <h6 class="mb-0 p-3 main-color-bg text-white" style="border-radius: 18px 18px 0px 0px;"><i
                            class="fas fa-filter"></i> {{ __('basic.search filter') }}</h6>

                    <form id="myform" class="mt-1" method="GET" action="{{ route('sett.debtor_smart_search') }}">

                        <div class="accordion search-accordion" id="accordionExample">

                            <div class="accordion-item">
                                <h2 class="accordion-header" id="headingSpec">
                                    <button class="accordion-button" type="button" data-bs-toggle="collapse"
                                        data-bs-target="#collapseReco" aria-expanded="true"
                                        aria-controls="collapseReco">
                                        <i class="fas fa-wallet me-1"></i> {{ __('basic.wallet balance') }}
                                    </button>
                                </h2>
                                <div id="collapseReco" class="accordion-collapse collapse show"
                                    aria-labelledby="headingSpec" data-bs-parent="#accordionExample">
                                    <div class="accordion-body py-0 px-3">

                                        <div class="form-group">
                                            <div class="form-check mb-1">
                                                <input class="form-check-input" value="below_0" type="radio"
                                                    name="wallet_srch" id="r1" @if (request()->get('wallet_srch') ===
                                                "below_0") checked
                                                @endif>
                                                <label class="form-check-label" for="r1">
                                                    {{ __('basic.below') }} - 0
                                                </label>
                                            </div>
                                            <div class="form-check mb-1">
                                                <input class="form-check-input" value="below_1000" type="radio"
                                                    name="wallet_srch" id="be1000" @if (request()->get('wallet_srch')
                                                ===
                                                "below_1000") checked @endif>
                                                <label class="form-check-label" for="be1000">
                                                    {{ __('basic.below') }} - 1000
                                                </label>
                                            </div>
                                            <div class="form-check mb-1">
                                                <input class="form-check-input" value="below_10000" type="radio"
                                                    name="wallet_srch" id="be10000" @if (request()->get('wallet_srch')
                                                ===
                                                "below_10000") checked @endif>
                                                <label class="form-check-label" for="be10000">
                                                    {{ __('basic.below') }} - 10000
                                                </label>
                                            </div>
                                            <div class="form-check mb-1">
                                                <input class="form-check-input" value="above_0" type="radio"
                                                    name="wallet_srch" id="ab0" @if (request()->get('wallet_srch') ===
                                                "above_0") checked
                                                @endif>
                                                <label class="form-check-label" for="ab0">
                                                    {{ __('basic.above') }} + 0
                                                </label>
                                            </div>
                                            <div class="form-check mb-1">
                                                <input class="form-check-input" value="above_10000" type="radio"
                                                    name="wallet_srch" id="ab10000" @if (request()->get('wallet_srch')
                                                ===
                                                "above_10000") checked @endif>
                                                <label class="form-check-label" for="ab10000">
                                                    {{ __('basic.above') }} + 10000
                                                </label>
                                            </div>
                                        </div>

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

                            <div class="accordion-item">
                                <h2 class="accordion-header" id="headingOne">
                                    <button class="accordion-button collapsed" type="button" data-bs-toggle="collapse"
                                        data-bs-target="#collapseOne" aria-expanded="true" aria-controls="collapseOne">
                                        <i class="fas fa-map-marker-alt me-1"></i> {{ __('basic.branch') }}
                                    </button>
                                </h2>
                                <div id="collapseOne" class="accordion-collapse collapse" aria-labelledby="headingOne"
                                    data-bs-parent="#accordionExample">
                                    <div class="accordion-body py-0 px-3">

                                        <div class="form-group">
                                            @foreach ($branch as $item)
                                            <div class="form-check mb-1">
                                                <input class="form-check-input" value="{{ $item->id }}" type="radio"
                                                    name="branch_id_srch" id="br{{ $item->id }}">
                                                <label class="form-check-label" for="br{{ $item->id }}">
                                                    {{ $item->name }}
                                                </label>
                                            </div>
                                            @endforeach
                                        </div>

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

                            <div class="accordion-item">
                                <h2 class="accordion-header" id="headingThree">
                                    <button class="accordion-button collapsed" type="button" data-bs-toggle="collapse"
                                        data-bs-target="#date_side_search" aria-expanded="false"
                                        aria-controls="date_side_search">
                                        <i class="fas fa-calendar-alt me-1"></i> {{ __('basic.date') }}
                                    </button>
                                </h2>
                                <div id="date_side_search" class="accordion-collapse collapse"
                                    aria-labelledby="headingThree" data-bs-parent="#accordionExample">
                                    <div class="accordion-body py-0 px-3">

                                        <div class="form-group">

                                            <input name="date_srch" type="text"
                                                class="form-control datepicker_time bg-white"
                                                value="{{ request()->get('date_srch') }}" placeholder="YYYY/MM/DD HM"
                                                data-enable-time="true" required>
                                        </div>

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

                        </div>

                        <div class="d-flex justify-content-center align-items-center mt-3">
                            <a class="text-gray-300 me-2" href="{{ route('sett.pat_show_all_patients') }}">{{
                                __('basic.reset') }}</a>
                            <button class="b-r-l-cont btn btn-primary px-4">{{ __('basic.search') }}</button>
                        </div>
                    </form>

                </div>

            </div>

        </div>

        <div class="col-12 col-md-9">

            <div class="d-flex justify-content-between align-items-center mb-2">
                <p class="text-gray-400 mb-0">{{ __('patientappo.total patients') }}
                    <span>{{ $patients->total() }}</span>
                </p>
                <a data-bs-toggle="modal" data-bs-target="#send_sms"
                    class="main-color-bg text-white btn btn-sm shadow-sm b-r-l-cont p-2 px-4"><i
                        class="fas fa-mobile-alt fa-sm me-1"></i> {{ __('basic.sms') }}</a>
            </div>

            <div class="modal fade" id="send_sms" 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.debtor_smart_search') }}" method="GET"
                        style="display: contents">

                        <input name="wallet_srch" value="{{ request()->input('wallet_srch') }}" type="hidden">
                        <input name="branch_srch" value="{{ request()->input('branch_id_srch') }}" type="hidden">
                        <input name="type_srch" value="{{ request()->input('type_srch') }}" type="hidden">
                        <input name="date_srch" value="{{ request()->input('date_srch') }}" type="hidden">

                        <div class="modal-content b-r-s-cont border-0">
                            <div class="modal-header">
                                <h5 class="modal-title" id="exampleModalLabel"><i class="fas fa-mobile-alt me-1"></i>
                                    {{ __('patientappo.send sms') }}</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">
                                    <div class="col-12 mb-2">
                                        <label class="form-label">{{ __('patientappo.sms content') }}
                                            <small>({{ __('basic.required') }})</small></label>
                                        <textarea name="sms_content" class="form-control"
                                            placeholder="Write here your the sms content .." rows="4" spellcheck="false"
                                            required></textarea>

                                        @error('sms_content')
                                        <span class="error-msg-form">
                                            {{ $message }}
                                        </span>
                                        @enderror
                                    </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.send') }}</button>
                                </div>
                            </div>

                        </div>
                    </form>

                </div>

            </div>

            <div>


                @foreach ($patients as $item)

                <div class="row align-items-center shadow b-r-s-cont bg-white p-2 mb-2">

                    <div class="col-12 col-md-4 d-flex align-items-center mb-2 mb-md-0">
                        <img class="rounded-circle avatar-small2 me-3"
                            src="{{ URL::asset('img/debtor/' . $item->avatar) }}">
                        <div class="">
                            <p class="mb-0 text-xs text-gray-300">
                                {{ date('d M Y', strtotime($item->created_at)) }}</p>
                            <a href="{{ route('sett.debtorcat.show', $item->id) }}"
                                class="mb-1 fw-bold text-s text-gray-600">
                                {{ $item->name }}
                            </a>
                            <p class="mb-0 text-xs text-gray-400"><strong>
                                    <i class="fas fa-circle text-xxs"></i>
                                    @if ($item->branch)
                                    {{ $item->branch->name }}
                                    @else
                                    No branch
                                    @endif
                                </strong>
                            </p>
                        </div>
                    </div>

                    <div class="col text-center">
                        <h6 class="text-gray-300 text-xs mb-1">{{ __('basic.wallet') }}</h6>
                        <h6 class="text-s text-gray-500 text-truncate">{{ $item->wallet }}</h6>
                    </div>

                    <div class="col text-center">
                        <h6 class="text-gray-300 text-xs mb-1">{{ __('patientappo.phone number') }}</h6>
                        <h6 class="text-s text-gray-500 text-truncate">{{ $item->phone_number }}
                        </h6>
                    </div>

                    <div class="col text-center">
                        <h6 class="text-gray-300 text-xs mb-1">{{ __('basic.responsable') }}</h6>
                        <h6 class="text-s text-gray-500 text-truncate">{{ $item->name }}
                        </h6>
                    </div>

                    <div class="col text-center">
                        <h6 class="text-gray-300 text-xs mb-1">{{ __('basic.created') }}</h6>
                        <h6 class="text-s text-gray-500 text-truncate">
                            {{ $item->created_at }}
                        </h6>
                    </div>

                </div>

                @endforeach
            </div>

            <div class="d-flex mt-4 justify-content-end">
                {{ $patients->appends(request()->input())->links() }}
            </div>

        </div>
    </div>


</div>

@endsection


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

<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>
    $('.js-example-basic-single').select2({
        minimumResultsForSearch: -1,
    });
    $(".myselect2-additem-insert").select2({
        dropdownParent: $("#add_notes")
    });
    //hide search
    $('.select2-no-search-additem').select2({
        dropdownParent: $("#add_notes"),
        minimumResultsForSearch: -1
    });
</script>

<!-- jquery ui datepicker -->
<script type="text/javascript"
    src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.4.1/js/bootstrap-datepicker.min.js"></script>
<script>
    $(function() {
        $('.hasdatetimepicker').datepicker({
            todayHighlight: true,
            format: "yyyy-mm-dd",
        });
    });
</script>

<!-- datapicker date and time -->
<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 src="https://fastly.jsdelivr.net/npm/flatpickr@4.6.13/dist/plugins/monthSelect/index.min.js"></script>

<script>
    $(document).ready(function() {
        //-------- datepicker time --------
        $('.datepicker_time').flatpickr({
            enableTime: true,
            mode: "range",
            locale: {
                rangeSeparator: 'to'
            },
            plugins: [
                new monthSelectPlugin({
                    shorthand: true, //defaults to false
                    dateFormat: "m-Y", //defaults to "F Y"
                    altFormat: "F Y", //defaults to "F Y"
                    theme: "dark", // defaults to "light"
                })
            ]
        });

    })
</script>

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

        //--------------------- fetch appoingtments -------------------

        //rate insert
        $(document).on('keyup', '#search-eng', function() {

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


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

            $.ajax({
                url: url,
                type: "POST",
                data: {
                    '_token': "{{ csrf_token() }}",
                    '_method': "PATCH",
                    'status': 4,
                },
                success: function(data) {
                    if (data.status == 1) {
                        $("#successful_msg").html(' ').show();
                        $("#successful_msg").html(
                            '<div class="flash-msg shadow pt-3 text-center" style="background-color: #20cd7d;">' +
                            '<div class="mb-2">' +
                            '<i class="far fa-smile-beam text-xl"></i>' +
                            '</div>' +
                            '<h3>Welcome ' + data.name + '!</h3>' +
                            '<p style="color:#cfffe4">Happy to see you again</p>' +
                            '</div>').delay(5000).fadeOut()
                        $("#search-eng").val('');
                    } else {
                        $("#successful_msg").html(' ').show();
                        $("#successful_msg").html(
                            '<div class="flash-msg shadow pt-3 text-center" style="background-color:#ff4152;">' +
                            '<div class="mb-2 text-center">' +
                            '<i class="text-center far fa-frown text-xl"></i>' +
                            '</div>' +
                            '<h3>Sorry, it is invalid QR or date</h3>' +
                            '<p style="color:#ffb4bc">Please try again</p>' +
                            '</div>').delay(5000).fadeOut()
                        $("#search-eng").val('');
                    }
                }
            });

        });

        $(document).on('click', ".patient_lead_history", function() {

            $('.modal').modal('hide');
            $('#add_notes').modal('show');

        })

    });
</script>

@endsection