{{--
|--------------------------------------------------------------------------
| hospital-profile is common Component (Can be shown in any screen)
|--------------------------------------------------------------------------
| you can show this component in any screen by referring to the following
| snippet:
|-----------
|
| @component('components.hospital-profile',[])|
| @endcomponent
|
--}}



@if (Auth::guard('hospital')->check())
<!-- image upload css start-->
<style>
img {
    max-width: 100%;
    display: block;
}

.img-uploade-row {
    display: flex;
    margin: -10px;

}

.upload-column {
    width: calc(100% / 2);
    position: relative;
    padding: 10px 10px;
    border: 1px;
}

.img-uploaders {
    width: 120px;
    height: 120px;
    margin: 0;
    border: 1px dashed #CACACA;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
}


</style>

<form method="POST" action="" id="hospital_aboutus_form" class="col-lg-12 col-sm-12">
    <!-- buttons for profile start -->
    <div class="mb-3">
       
        <button type="button" id="edit_aboutUs_btn" class="badge badge-success ml-2 mr-2" style="font-size: smaller;">Edit
            About us</button>
       
        <a href="{{url('/')}}/{{Auth::user()->slug}}"  type="button" class="badge badge-primary" target="_blank">Public
            view</a>
    </div>
    <!-- buttons for profile end -->
    <div class="sp-v-scrollbar sp-v-scrollbar-w4" style="max-height:300vh;">

        <div class="col-12 mt-3">

            <div id="aboutus-view">

            </div>

        </div>
    </div>

</form>


<!-- <form class="form-horizontal" method="POST" action="{{ route('hospitals.update.about', ['id' => Auth::user()->id]) }}"
    id="edit-hospital-aboutus-form" enctype="multipart/form-data">
    {{ csrf_field() }}
    {{ method_field('PATCH') }} -->

    <form method="post" action="{{route('hospitals.update.about',['id' => Auth::user()->id])}}"
                        enctype="multipart/form-data" id="edit-hospital-aboutus-form">
    {{ csrf_field() }}

    <input type="hidden" class="form-control" name="case" id="case" value="first-hospital" />

    <div class="form-group">
        <label for="comment">About us:</label>
        <div  id="refresh_about_page">
        <textarea class="ckeditor form-control" id="description" name="aboutUs"
            required placeholder="enter your text here...">{{Auth::user()->about_us}}</textarea></div>
    </div>
    <button type="submit" class="btn btn-primary" id="edit-hospital-aboutus-submit">Save</button>
    <a onclick="$.hospital_dashboard.showCard(event, 7, true)" showcard="hospital_about_us" 
    class="w3-bar-item w3-button" style="background-color: #db3545; color: white; border-radius: 5px;">
    Cancel
 </a>
</form>
@else
<p class="text-danger">
    You are not authorized to see this page
</p>
@endif
<!-- modal popup for profile pic -->

<!-- Modal for update Brochure end -->
<script src="{{ asset('js/blade-components/hospital_about_us.js') }}"></script>

<!-- alert popup sms -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/limonte-sweetalert2/7.29.2/sweetalert2.all.js"></script>
<!-- profile pic update ajax function -->
<script>
// $(function() {
//     $(document).on("click", ".update_post_btn", function(event) {
//         event.preventDefault();
//         let check = userHasUploadedAvatar();
//         if (check) {
//             let myForm = document.getElementById('updateAvatarForm');
//             let formData = new FormData(myForm);
//             uploadAvatar(formData);

//         }
//     });
// });

// function uploadAvatar(formData) {

//     // $.ajaxSetup({
//     //     headers: {
//     //         'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
//     //     }
//     // });
//     const id = $('#id').val();
//     $.ajax({
//         type: "POST",
//         data: formData,
//         dataType: 'JSON',
//         contentType: false,
//         cache: false,
//         processData: false,
//         url: "update_avatar/" + id,
//         success: function(data) {
//             if (data.status) {
//                 $(".fade").hide();
//                 // showCustomSucces(data.message);
//                 let msgHtml = 'Hospital Avatar uploaded successfully <br/>';
//                 $.sp_globals.showSPSuccessDialogue('Great', msgHtml);
//                 setTimeout(function() {
//                     $.hospital_about_us.onAboutUsClick();
//                 }, 1000);
//                 $.sp_globals.toggleSPLoadingSpinner(false);
//             } else {
//                 showCustomError(data.error)
//             }
//         },
//         error: function(err) {
//             showCustomError('Something went Wrong!')
//         }
//     });
// }



function userHasUploadedAvatar() {
    let check = true;
    let file = $('#avatar').get(0).files[0];
    console.log(file);
    if (file == undefined || file == null) {
        check = false;
        handleErrors();
        return check;
    }

    handleErrors();
    return check;
}


function handleErrors() {
    let file = $("#avatar").get(0).files[0];
    if (file == undefined || file == null) {
        $("#error_screenshot").show();
    } else {
        $("#error_screenshot").hide();
    }
}

function doAfterSelectImage(input) {
    readURL(input);
}

function readURL(input) {
    if (input.files && input.files[0]) {
        var reader = new FileReader();
        reader.onload = function(e) {
            $('#post_user_image_').attr('src', e.target.result);
        };
        reader.readAsDataURL(input.files[0]);
    }
}

// sweet alert function for custom success and error message
function showCustomSucces(text) {
    Swal.fire(
        'Success!',
        text,
        'success'
    )
}

function showDeletedDialog(text) {
    Swal.fire(
        'Deleted!',
        text,
        'Success'
    )
}

function showCustomError(text) {
    Swal.fire({
        icon: 'error',
        title: 'Oops...',
        text: text
    })
}
</script>
<!-- script for multi language select -->
<script>
$(document).ready(function() {
    $('#choices-multiple-remove-button').select2();
    $('#n_q_r_category').select2();
    $('#n_q_r_accridation').select2();

});
</script>