@extends('layout.padrao')
@section('title', 'Client (Cliente)')
@section('content')

    @include('haulingProcess.bookinginformation')

    @if($errors->any())
        <div class="alert alert-danger">
            @foreach($errors->all() as $error)
                {{ $error }} <br>
            @endforeach
        </div>
    @endif

    <div class="row folha-interna4 col-lg-12 col-md-12 col-sm-12">
        <h3>Loading Details <small>(Detalhes do Carregamento)</small></h3>
    </div>

    <form method="POST" action="{{route('haulingprocess.update.step3',  ['haulingprocess' => $haulingProcess->id]) }}" accept-charset="UTF-8" enctype="multipart/form-data" id="form_haulingprocess">

        {{ method_field('PUT') }}
        {{ csrf_field() }}

        {{-- This variable control all inputs names--}}
        @php  $divNumber = 0; $divAttachNumber = 0;  $totalLoaded = 0; @endphp


        {{-- Update a Hauling Process--}}
        @foreach($haulingProcess->haulingProcessDetails as $haulingProcessDetails)
{{--            @if($haulingProcessDetails->countAttachments('HP2'))--}}
                @php  $totalLoaded += $haulingProcessDetails->qtyLoaded;  @endphp
                @if(!(isset($haulingProcessDetails->hauling_process_details_id)))
                    @php  $divNumber += 1;  @endphp
                    @include('haulingProcess.step3.form')
                @endif
{{--            @endif--}}
        @endforeach

        <div class="col offset-lg-9 offset-md-9 col-lg-3 col-md-3 col-sm-12 text-right">
            <p style="margin: 0px;">Qtd Total Nomeada: <b>{{(isset($loadingRequest->maxQtyLoaded)) ? $loadingRequest->maxQtyLoaded . ' T' : ''}}</b></p>
            <p style="margin: 0px;">Qtd Total Carregada: <b>{{(isset($totalLoaded)) ? $totalLoaded . ' T' : ''}}</b></p>
            <p style="margin: 0px;">Qtd Restante: <b>{{(isset($loadingRequest->maxQtyLoaded)) ? (($loadingRequest->maxQtyLoaded - $totalLoaded) . ' T') : ''}}</b></p>
        </div>

        <div id="commentsArea" class="row folha-interna4 col-lg-12 col-md-12 col-sm-12">
            <h3>Attachments / Comments <small>(Anexos / Comentários)</small></h3>
        </div>

        <div class="row folha-interna4 col-lg-12 col-md-12 col-sm-12 shadow p-3 mb-5 bg-white rounded">
            <div class="row col-lg-12 col-md-12 col-sm-12">
                <div class="col col-lg-8 col-md-8 col-sm-12 form-group {{ $errors->has('tipoPrincipal')? 'has-error':''}}" >
                    @php  $divAttachNumber = 1;  @endphp
                    @include('haulingProcess.form_attachments')

                    <div class="row col-lg-12 col-md-12 col-sm-12">
                        <ul>
                        @foreach($loadingRequest->anexo_types as $haulingProcessFiles)
                            @php  $divAttachNumber += 1;  @endphp
                            @if($haulingProcessFiles->pivot->stage <> 'HP1' )
                                @continue
                            @endif
                            <li>
                                <input type="checkbox" class="form-check-input" name="attachmentDestroy[{{$haulingProcessFiles->pivot->id}}][]">
                                <label class="form-check-label text-danger"><i class="fas fa-trash" title="Excluir anexo"></i></label class="form-check-label">
                                <small> - {{$haulingProcessFiles->descricao}} ({{$haulingProcessFiles->pivot->stage}})</small> -
                                <a href="/storage/{{$haulingProcessFiles->pivot->path . '/' . $haulingProcessFiles->pivot->nmAnexo}}" download>
                                    {{$haulingProcessFiles->pivot->nmAnexo}}
                                </a>
                            </li>
                        @endforeach
                        </ul>
                    </div>
                </div>

                <div class="col col-lg-4 col-md-4 col-sm-12 form-group {{ $errors->has('tipoPrincipal')? 'has-error':''}}" >
                    <label for="comment" class="w-100 control-label">Comments (Comentário)</label>
                    <textarea class="form-control " placeholder=" " name="comment" cols="50" rows="10" maxlength="500" id="comment"></textarea>
                </div>
            </div>
        </div>

        <div class="w-100 form-group">
            <div class="col-sm-offset-2 col-sm-10 text-right">
                <button type="submit" class="btn btn-padrao" onclick='submitDisable()'> Save </button>
                <button type="reset" class="btn btn-padrao" onClick="history.go(-1)"> Cancel </button>
                <a id="btnPdfStep1" href="{{route('haulingprocess.pdf.step2',  ['haulingprocess' => (isset($haulingProcess->id) ? $haulingProcess->id : 0) ])}}" class="btn btn-padrao {{isset($haulingProcess->id) ? '' : 'disabled'}}" role="button" aria-pressed="true"> Ordem C. <i class="fas fa-file-download"></i> </a>
                <a id="btnDownloadPDFStepFiles" href="{{route('haulingprocess.download',  [$haulingProcess->loading_requests_id ?? 0, 'step' => 'HP3', 'extension' => 'pdf' ])}}" class="btn btn-padrao {{isset($haulingProcess->id) ? '' : 'disabled'}}" role="button" aria-pressed="true">PDF Files <i class="fas fa-file-download"></i> </a>
                <a id="btnDownloadPDFStepFiles" href="{{route('haulingprocess.download',  [$haulingProcess->loading_requests_id ?? 0, 'step' => 'HP3', 'extension' => 'xml' ])}}" class="btn btn-padrao {{isset($haulingProcess->id) ? '' : 'disabled'}}" role="button" aria-pressed="true">XML Files <i class="fas fa-file-download"></i> </a>                
            </div>
        </div>
        @include('haulingProcess.comments')
    </form>
@endsection

@include('haulingProcess.script')

{{--Verificar com a Lu se ela quer usar essa lib--}}
<script src="https://cdn.jsdelivr.net/npm/sweetalert2@10.11.1/dist/sweetalert2.all.min.js"></script>

<script>
    function loadData(fileInput, idInput, myInputFile) {
        let file = fileInput.files[0];
        let fileURL = URL.createObjectURL(file);
        let req = new XMLHttpRequest();
        req.open('GET', fileURL);
        req.onload = function() {
            URL.revokeObjectURL(fileURL);
            populateData(this.responseXML, idInput, myInputFile);
        };
        req.onerror = function() {
            URL.revokeObjectURL(fileURL);
            console.log('Error loading XML file.');
        };
        req.send();
    }

    function populateData(xmlDoc, myElement, myInputFile) {
        let root = xmlDoc.documentElement;

        if (root.querySelector('CNPJ')) {
            let localCNPJ = root.querySelector('CNPJ');

            $.ajax({
                    url: '/jsonCheckCNPJClient',
                    data: { 
                        "cnpj": (localCNPJ.textContent).replace(/^(\d{2})(\d{3})(\d{3})(\d{4})(\d{2})/, "$1.$2.$3/$4-$5"), 
                        "loading_requests_id": $("input[name=loading_requests_id]").val()
                    },
                    cache: false,
                    type: "get",
                    dataType: 'json',
                    success: function (response) {
                        if (response[0]) {
                            console.log('Check CNPJ Ok')    
                        }
                        else {
                            Swal.fire({
                                icon: 'error',
                                title: 'The selected file is not a valid XML file for this client. (1)',
                                text: '',
                                footer: 'Invalid CNPJ! Please check your XML file.'
                            })
                            $('#' + myElement).val('');
                            $('#' + myInputFile).val('');
                        }
                    },
                    error: function () {
                        Swal.fire({
                            icon: 'error',
                            title: 'The selected file is not a valid XML file for this client. (2)',
                            text: '',
                            footer: 'Invalid CNPJ! Please check your XML file.'
                        })
                        $('#' + myElement).val('');
                        $('#' + myInputFile).val('');
                    }
                });
        }
        else {
            Swal.fire({
                icon: 'error',
                title: 'The selected file is not a valid XML file. (3)',
                text: '',
                footer: 'Cannot find declaration of element "CNPJ"'
            })
            $('#' + myElement).val('');
            $('#' + myInputFile).val('');
        }



        if (root.querySelector('qCom')) {
            let x = root.querySelector('qCom');
            if ($('#' + myElement).val() == '') {
                $('#' + myElement).val(parseInt(x.textContent));
            }
        }
        else {
            // alert ("Atenção! Verifique o arquivo XML selecionado. \r\n Não foi possível localizar a quantidade carregada.");
            Swal.fire({
                icon: 'error',
                title: 'The selected file is not a valid XML file.',
                text: '',
                footer: 'Cannot find declaration of element "qCom"'
            })
            $('#' + myElement).val('');
            $('#' + myInputFile).val('');
        }

    }

</script>

@include('haulingProcess.notification')