@extends('layouts.app')
@section('title', $viewData["title"])
@section('subtitle', $viewData["subtitle"])
@section('content')

<div class="modal fade" id="myModal" tabindex="-1" aria-labelledby="exampleModalLabel" aria-hidden="true">
    <div class="modal-dialog modal-xl">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title" id="exampleModalLabel">Organization message</h5>
                <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
            </div>
            <div class="modal-body" id="modal_body">
                ...
            </div>
        </div>
    </div>
</div>

<div class="card">
    <div class="card-header">
        Input organization file - {{ $viewData['customer_name'] }}
    </div>
    <div class="card-body">
    @if($errors->any())
        <ul class="alert alert-danger list-unstyled">
            @foreach($errors->all() as $error)
            <li>- {{ $error }}</li>
            @endforeach
        </ul>
        @endif
        <form method="POST" action="" id="form_data" name="form_data" enctype="multipart/form-data">
            @csrf
            <div class="row">
                <div class="col">
                    <div class="input-group mb-3">
                        <label class="input-file">Update your organization by uploading an organization file</label>
                    </div>
                </div>
            </div>            
            <div class="row">
                <div class="col">
                    <div class="input-group mb-3">
                        <input id="file_1" name="file_1" value="" type="file" class="form-control">
                    </div>
                </div>
            </div>
            <button type="button" class="btn btn-primary" id="open_link"
            data-attr="{{ route('organization_management.upload_file') }}"
            title="Update your organization with the selected file">
            Upload file</button>
        </form>
    </div>
</div>
<BR>
<div class="card">
    <div class="card-header">
        Download current organization file - {{ $viewData['customer_name'] }}
    </div>
    <div class="card-body">
    @if($errors->any())
        <ul class="alert alert-danger list-unstyled">
            @foreach($errors->all() as $error)
            <li>- {{ $error }}</li>
            @endforeach
        </ul>
        @endif
            <button type="button" class="btn btn-primary" id="open_link2"
            data-attr="{{ route('organization_management.download_file') }}"
            title="Update your organization with the selected file">
            Download current organization file</button>

    </div>
</div>

<script>

$(document).on('click', '#open_link', function(event) {
    event.preventDefault();
    var obj_form = document.forms.namedItem("form_data");
    var donnee_form = new FormData(obj_form);    
    let href = $(this).attr('data-attr');

    $.ajaxSetup({
    headers: {
        'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
    }
    });

    $.ajax({
        type: "POST",
        url: href,
        data: donnee_form,   
        contentType: false,
        processType: false,
        processData: false,
        beforeSend: function() {
            $('#loader').show();
        },
        // return the result
        success: function(result) {
            $('#myModal').modal("show");
            $('#modal_body').html(result).show();
        },
        complete: function() {
            $('#loader').hide();
        },
        error: function(jqXHR, testStatus, error) {
            console.log(error);
            alert("Page " + href + " cannot open. Error:" + error);
            $('#loader').hide();
        },
        timeout: 8000
    })
});

$(document).on('click', '#open_link2', function(event) {
    event.preventDefault();
    let href = $(this).attr('data-attr');
    window.location = href;
});

</script>
@endsection