@extends('layouts.digitar')
@section('Breadcrumbs')
    {!! Breadcrumbs::render('documents.attachment') !!}
@endsection
@section('content')
    <style>
        #my-dropzone {
            border: 2px dashed #007bff;
            padding: 20px;
            margin: 20px 0;
            background: #f8f9fa;
        }

        .group-btn {
            margin-right: 10px;
            /* Aumenta o espaçamento entre os botões */
        }

        .btn-group-toggle .btn {
            min-width: 120px;
            /* Define uma largura mínima para os botões */
        }

        .file-attachament,
        .btn-include {
            display: inline-block;
            width: 180px;
            height: 50px;
            padding: 5px 15px;
            background-color: #adadadd6;
            color: white;
            border: none;
            border-radius: 4px;
            cursor: pointer;
            transition: background-color 0.3s ease, transform 0.2s ease;
            font-weight: bold;
        }

        .file-attachament:hover,
        .btn-include:hover {
            background-color: #9c9c9cc7;
            transform: translateY(-2px);
        }

        /* Esconde o texto "Nenhum arquivo selecionado" */
        .file-attachament::-webkit-file-upload-button {
            visibility: hidden;
        }

        .file-attachament::before {
            content: 'Selecionar Arquivo';
            display: inline-block;
            color: white;
            font-weight: bold;
        }

        .custom-include-attachament {
            margin-left: 2px;
        }


        .document-row {
            cursor: pointer;
        }

        .document-row:hover {
            cursor: pointer;
            background-color: #f1f1f1;
            /* cor de fundo ao passar o mouse */
        }

        /* .document-row:hover::after {
                                                                                                                                                                                                                                                                                                                                                                                                                                                                        content: 'Histórico do documento';
                                                                                                                                                                                                                                                                                                                                                                                                                                                                        color: #666;
                                                                                                                                                                                                                                                                                                                                                                                                                                                                    } */
    </style>

    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/dropzone/5.9.2/basic.css">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/dropzone/5.9.2/dropzone.css">

    <link href="/assets/plugins/chosen/chosen.min.css" rel="stylesheet">

    <a href="{{ url('documents') }}"><button type="button" class="btn btn-dark" style="margin-bottom: 10px; color: #0A0A0A"><i
                class="glyphicon glyphicon-chevron-left"></i>Voltar</button>
    </a>

    <div class="rounded the-box">
        <div class="set_loading" id="set_loading">
            <h3 class="title-loading">processando...</h3>
            <img class="loading-img" src="{{ asset('assets/images/loading.gif') }}" />
        </div>

        <div class="row">
            <div class="row">
                <div class="col-md-12">
                    @include('flash::message')
                    <h3 style="margin-left:5px;">Upload de Arquivos</h3>
                    <h5 style="margin-left:5px;">É possível converter arquivos no formato (PDF) pesquisáveis (OCR/ICR)
                        previamente digitalizados após
                        o
                        upload<br /><br /></h5>
                    <div id="my-dropzone" data-document-id="{{ $document->id }}" class="dropzone"></div>

                    <div id="uploadProgress"></div>

                    <button id="uploadButton" style="margin-top: 10px; margin-left:5px;">Enviar arquivos</button>
                </div>

                <div class="col-md-4" style="margin-left:5px; margin-top:20px;">
                    <div class="btn-group btn-group-toggle" data-toggle="buttons">
                        <label class="btn btn-success group-btn active fas fa-pen-alt" onclick="multipleSign()">
                            <input type="radio" name="options" id="sign-button" checked> Assinar
                        </label>
                        <label class="btn btn-primary group-btn active fa fa-edit">
                            <input type="radio" name="options" id="edit-button"> Editar
                        </label>
                        <label class="btn btn-danger group-btn active fas fa-times-circle">
                            <input type="radio" name="options" id="cancel-button"> Cancelar
                        </label>
                    </div>
                </div>

            </div><br />

            <table class="table table-bordered table-striped">
                <tr>
                    <th></th>
                    <th>Arquivo</th>
                    <th>Paginas</th>
                    <th>Ações</th>
                </tr>
                @foreach ($document_files as $file)
                    <tr>
                        <td>
                            @php
                                $checkDocumentIsSigned = \App\Models\ProcessingDocumentsSignature::where(
                                    'id_document',
                                    '=',
                                    $file->id,
                                )->first();

                                $checkStatusSignature = \App\Models\SignatureSigners::where(
                                    'id_document',
                                    '=',
                                    $file->id,
                                )->first();
                            @endphp
                            @if (!isset($checkDocumentIsSigned->id_document))
                                <input type="checkbox" class="custom-checkbox" onclick="getFileId({{ $file->id }})"
                                    value="{{ $file->id }}" id="checkbox-documents">
                            @else
                                <input type="checkbox" class="custom-checkbox" onclick="getFileId({{ $file->id }})"
                                    value="{{ $file->id }}" id="checkbox-documents" disabled>
                            @endif
                        </td>



                        <td width="80%" id="tr{{ $file->id }}" class="document-row">
                            @if (isset(\App\Models\SignatureSigners::where('id_document', '=', $file->id)->first()->status))
                                @if (\App\Models\SignatureSigners::where('id_document', '=', $file->id)->first()->status == 'SIGNED')
                                    <a @popper(DOWNLOAD)
                                        href="https://superlegis.nyc3.digitaloceanspaces.com/{{ $file->filename }}"
                                        style="text-decoration:none color:black;" target="_blank"
                                        id="link-{{ \App\Models\SignatureSigners::where('id_document', '=', $file->id)->first()->signerNonce }}">
                                        @if ($file->filename_origin)
                                            {{ $file->filename_origin }}
                                        @elseif ($file->filename)
                                            {{ $file->filename }}
                                        @endif
                                    </a>
                                @else
                                    <a @popper(DOWNLOAD) class="disabled-link"
                                        href="https://superlegis.nyc3.digitaloceanspaces.com/{{ $file->filename }}"
                                        target="_blank" style="text-decoration:none color:black;"
                                        id="link-{{ \App\Models\SignatureSigners::where('id_document', '=', $file->id)->first()->signerNonce }}"
                                        data-id="{{ \App\Models\SignatureSigners::where('id_document', '=', $file->id)->first()->signerNonce }}">
                                        @if ($file->filename_origin)
                                            {{ $file->filename_origin }}
                                        @elseif ($file->filename)
                                            {{ $file->filename }}
                                        @endif
                                    </a>
                                @endif
                            @else
                                <a @popper(DOWNLOAD)
                                    href="https://superlegis.nyc3.digitaloceanspaces.com/{{ $file->filename }}"
                                    style="text-decoration:none; color:black;" target="_blank">
                                    @if ($file->filename_origin)
                                        {{ $file->filename_origin }}
                                    @elseif ($file->filename)
                                        {{ $file->filename }}
                                    @endif
                                </a>
                            @endif

                        </td>
                        <td>{{ $file->num_pag }}</td>
                        @php
                            $explode_file = explode('document/', $file->filename);
                        @endphp
                        @if ($file)
                            @php $url = $_SERVER['HTTP_HOST']; @endphp
                            <td align="center">
                                @if (isset(\App\Models\SignatureSigners::where('id_document', '=', $file->id)->first()->status))
                                    @if (\App\Models\SignatureSigners::where('id_document', '=', $file->id)->first()->status == 'SIGNED')
                                        <a @popper(DOWNLOAD)
                                            href="https://superlegis.nyc3.digitaloceanspaces.com/{{ $file->filename }}"
                                            target="_blank"
                                            id="link-{{ \App\Models\SignatureSigners::where('id_document', '=', $file->id)->first()->signerNonce }}">
                                            <span class="label label-success"><i class="far fa-eye"></i></span>
                                        </a>
                                    @else
                                        <a @popper(DOWNLOAD) class="disabled-link"
                                            href="https://superlegis.nyc3.digitaloceanspaces.com/{{ $file->filename }}"
                                            target="_blank"
                                            id="link-{{ \App\Models\SignatureSigners::where('id_document', '=', $file->id)->first()->signerNonce }}"
                                            data-id="{{ \App\Models\SignatureSigners::where('id_document', '=', $file->id)->first()->signerNonce }}">
                                            <span class="label label-default"><i class="far fa-eye"></i></span>
                                        </a>
                                    @endif
                                @else
                                    <a @popper(DOWNLOAD)
                                        href="https://superlegis.nyc3.digitaloceanspaces.com/{{ $file->filename }}"
                                        target="_blank">
                                        <span class="label label-success"><i class="far fa-eye"></i></span>
                                    </a>
                                @endif
                                @if (
                                    $url == 'cmladario.localhost:8000' ||
                                        $url == 'pmaralmoreira.localhost:8000' ||
                                        $url == 'cmladario.legissuper.com.br' ||
                                        $url == 'pmaralmoreira.legissuper.com.br')
                                    @if (isset($file->ocr) && !empty($file->ocr))
                                        <a @popper(OCR)
                                            href="{{ url('/convert-to-ocr/pdf/ocr/' . $file->id . '/' . $document->id) }}"
                                            onclick="return false" class="disabled-link" target="_blank">
                                            <span class="label label-default icon-red"><i
                                                    class="fa fa-file-pdf-o icon-red"></i></span>
                                        </a>
                                    @else
                                        <a @popper(OCR)
                                            href="{{ url('/convert-to-ocr/pdf/ocr/' . $file->id . '/' . $document->id) }}"
                                            target="_blank">
                                            <span class="label label-primary"><i
                                                    class="fa fa-file-pdf-o icon-white"></i></span>
                                        </a>
                                    @endif
                                @endif
                                @if (isset($file->icr) && !empty($file->icr))
                                    <a @popper(PESQUISAVEL)
                                        href="{{ url('/convert/pdf/ocr/' . $file->id . '/' . $document->id) }}"
                                        onclick="return false" class="disabled-link" target="_blank">
                                        <span class="label label-default icon-blue"><i
                                                class="fa fa-search icon-blue"></i></span>
                                    </a>
                                @else
                                    <a @popper(PESQUISAVEL)
                                        href="{{ url('/convert/pdf/ocr/' . $file->id . '/' . $document->id) }}"
                                        target="_blank">
                                        <span class="label label-primary"><i class="fa fa-search"></i></span>
                                    </a>
                                @endif

                                <a @popper(EDITAR) style="cursor:pointer;" data-toggle="modal"
                                    data-target="#modalEditNameFile"
                                    onclick="updateFilename('{{ $file->id }}', '{{ $file->filnename_origin }}')"
                                    target="_blank">
                                    <span class="label label-info"><i class="fa fa-edit"></i></span>
                                </a>

                                <a @popper(DELETAR) style="text-decoration: none;cursor:pointer;" id="delFile"
                                    onclick="deleteFile({{ $file->id }})" target="_blank">
                                    <span class="label label-danger"><i class="fa fa-trash"></i></span>
                                </a>
                                <a onclick="openAuditModal({{ $file->id }})">
                                    <span class="label label-warning" style="text-decoration: none;cursor:pointer;"><i
                                            class="fa fa-info"></i></span>
                                </a>
                            </td>
                    </tr>
                @endif
                @endforeach
            </table>

            {{ $document_files->links() }}
            <hr class="hr">
        </div>


        <!-- Modal Auditoria-->
        @include('documents.modal_auditoria')
        {{-- @endsection --}}



        <script>
            // Função para abrir o modal
            function openAuditModal(fileId) {
                $('#modalAuditoria').modal('show');
            }
        </script>

        <!-- Modal -->
        <div class="modal fade" id="modalEditNameFile" tabindex="-1" role="dialog"
            aria-labelledby="exampleModalLongTitle" aria-hidden="true">
            <div class="modal-dialog" role="document">
                <div class="modal-content">
                    <div class="modal-header">
                        <h5 class="modal-title" id="exampleModalLongTitle">Editar Nome do arquivo</h5>
                        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                            <span aria-hidden="true">&times;</span>
                        </button>
                    </div>

                    {!! Form::open(['method' => 'POST', 'id' => 'form-filename']) !!}
                    <div class="modal-body">
                        <br />
                        <div class="form-group">
                            {!! Form::label('filename_origin', 'Nome do arquivo', ['class' => 'required']) !!}
                            {!! Form::text('filename_origin', null, ['class' => 'form-control', 'id' => 'filename_origin']) !!}
                        </div>
                    </div>

                    <hr>
                    <div class="modal-footer">
                        <button type="button" class="btn btn-secondary" data-dismiss="modal">Cancelar</button>
                        <button type="submit" class="btn btn-primary">Validar</button>
                    </div>
                    {!! Form::close() !!}

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

        <!-- Modal Signature Lot-->
        <div class="modal fade" id="modalSignatureLot" tabindex="-1" aria-labelledby="exampleModalLabel"
            aria-hidden="true">
            <div class="modal-dialog modal-lg">
                <div class="modal-content">
                    <div class="modal-header text-center">
                        <img src="{{ asset('assets/images/assinatura-digital-image.png') }}" style="width: 100px;">
                        <h5 class="modal-title" id="lot-modal-title">Configurações de Assinatura</h5>
                        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                            <span aria-hidden="true">&times;</span>
                        </button>
                    </div>

                    <form id="signature-documents-file-lot" enctype="multipart/form-data">
                        @csrf
                        <div class="modal-body">
                            <input type="text" name="documents_lot" value="" id="files-ids" hidden />
                            <div class="row">
                                <div class="col-md-4">
                                    <h4>Configurações</h4>
                                    <div class="form-group">
                                        <label>Papel (A0, A1)</label>
                                        <br><label for="large_paper">
                                            <input name="large_paper" id="large_paper" class="switch" data-on-text="Sim"
                                                data-off-text="Não" data-off-color="danger" data-on-color="success"
                                                data-size="normal" type="checkbox">
                                        </label>
                                    </div>

                                    <div class="form-group">
                                        <label>Documento (+50MB)</label>
                                        <label for="large_file">
                                            <input name="large_file" id="large_file" class="switch" data-on-text="Sim"
                                                data-off-text="Não" data-off-color="danger" data-on-color="success"
                                                data-size="normal" type="checkbox" onchange="changeInputsDisabled()">
                                        </label>
                                    </div>
                                </div>

                                <div class="col-md-8">

                                    <!-- Certificado  -->
                                    <div class="form-group">
                                        <label for="formFileSm" class="form-label">Certificado</label>
                                        <input name="certificate" class="form-control form-control-sm" id="formFileSm"
                                            type="file" disabled>
                                    </div>

                                    <!-- Senha -->
                                    <div class="form-group">
                                        {!! Form::label('cert_password', 'Senha') !!}
                                        <input type="password" name="cert_password" class="form-control"
                                            id="cert_password" disabled>
                                    </div>

                                    <!-- Parlamentares Assinando -->
                                    <div class="form-group">
                                        <label for="assemblymen" class="d-block">
                                            <i class="fa fa-user-plus"></i> Parlamentares Assinando
                                        </label>
                                        {!! Form::select('assemblymensList[]', $assemblymensList, null, [
                                            'class' => 'form-control assemblymenChosen',
                                            'id' => 'multiple-select-clear-field',
                                            'multiple' => true,
                                            'style' => 'width: 100%;',
                                            'data-placeholder' => 'Selecione o parlamentar...',
                                        ]) !!}
                                    </div>

                                    <!-- Modo de Assinatura -->
                                    <div class="form-group">
                                        {!! Form::label('module', 'Modo de assinatura', ['class' => 'required']) !!}
                                        {!! Form::select(
                                            'module',
                                            [
                                                'SIMPLE' => 'Simples',
                                                'ADVANCED' => 'Avançada',
                                                'QUALIFIED' => 'Qualificada',
                                            ],
                                            null,
                                            [
                                                'class' => 'form-control',
                                                'id' => 'select-state',
                                            ],
                                        ) !!}
                                    </div>
                                </div>
                            </div>
                        </div>

                        <!-- Modal Footer -->
                        <div class="modal-footer justify-content-between">
                            <button type="button" class="btn btn-secondary" data-dismiss="modal">Cancelar</button>
                            <button type="submit" class="btn btn-success">Assinar</button>
                        </div>
                    </form>
                </div>
            </div>
        </div>


        <!-- Modal Signature-->
        <div class="modal fade" id="modalSignature" tabindex="-1" role="dialog"
            aria-labelledby="exampleModalLongTitle" aria-hidden="true">
            <div class="modal-dialog" role="document">
                <div class="modal-content">
                    <div class="modal-header">
                        <center>
                            <img src="{{ asset('assets/images/assinatura-digital-image.png') }}" style="width:100px;">
                            <h5 class="modal-title" id="exampleModalLongTitle">Assinar Documentos</h5>
                        </center>
                        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                            <span aria-hidden="true">&times;</span>
                        </button>
                    </div>

                    {!! Form::open([
                        'method' => 'POST',
                        'url' => '/document/signature/upload-file',
                        'id' => 'signature-documents-file',
                        'file' => true,
                    ]) !!}
                    <div class="modal-body">
                        <br />
                        <div class="form-group">
                            <input id="idFile" type="text" name="crt_id" hidden>
                            <input id="idDocument" type="text" name="id_document" value="{{ $document->id }}"
                                hidden>
                            <div class="row">
                                <h4></h4>

                                <div class="form-group col-sm-12">
                                    <div class="form-group col-sm-12">
                                        <center><i class="fa fa-user-plus"></i> {!! Form::label('assemblymen', 'Parlamentares Assinando') !!}</center><br />
                                        {!! Form::select('assemblymensList[]', $assemblymensList, null, [
                                            'class' => 'form-control assemblymenChosen',
                                            'id' => 'multiple-select-clear-field',
                                            'multiple',
                                            'style' => 'width:100%;',
                                            'data-placeholder' => 'Selecione o parlamentar...',
                                        ]) !!}
                                        <br />
                                        {!! Form::label('module', 'Modo de assinatura', ['class' => 'required']) !!}

                                        {!! Form::select(
                                            'module',
                                            [
                                                'SIMPLE' => 'Simples',
                                                'ADVANCED' => 'Avançada',
                                                'QUALIFIED' => 'Qualificada',
                                            ],
                                            null,
                                            [
                                                'class' => 'form-control',
                                            ],
                                        ) !!}

                                    </div>

                                </div>
                                <div class="form-group col-sm-9">
                                    <div class="modal-footer">
                                        <button type="button" class="btn btn-secondary"
                                            data-dismiss="modal">Cancelar</button>
                                        <button type="submit" class="btn btn-primary">Assinar</button>
                                    </div>
                                </div>

                                {!! Form::close() !!}

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

                    <script src="https://www.bry.com.br/downloads/extension/v2/api/v1/extension-api.js"></script>
                    <script src="{{ asset('assets/brysignature/js/script-customizavel.js') }}"></script>
                    <script src="https://cdn.asprise.com/scannerjs/scanner.js" type="text/javascript"></script>
                    <script src="{!! asset('chosen_v1.8.7/chosen.jquery.js') !!}" type="text/javascript"></script>

                    <!-- Dropzone -->
                    <script src="https://cdnjs.cloudflare.com/ajax/libs/dropzone/5.9.2/dropzone.js"></script>
                    <link rel="stylesheet"
                        href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.4/css/all.min.css">

                    <script>
                        function changeInputsDisabled() {
                            const isChecked = $('#large_file').is(':checked');

                            $('#formFileSm').prop('disabled', !isChecked);
                            $('#cert_password').prop('disabled', !isChecked);
                        }
                    </script>
                    <script>
                        Dropzone.autoDiscover = false;

                        $(document).ready(function() {
                            const documentId = $('#my-dropzone').data('document-id');
                            let isUploading = false;

                            const loadingIndicator = $(
                                '<div id="loading" style="display:none; text-align:center; margin-top:20px;"><i class="fas fa-spinner fa-spin"></i> Carregando...</div>'
                            );

                            $('#my-dropzone').after(loadingIndicator);

                            const myDropzone = new Dropzone("#my-dropzone", {
                                url: "/documents/" + documentId + "/attachament-upload",
                                autoProcessQueue: false,
                                paramName: "file",
                                maxFilesize: 200,
                                acceptedFiles: ".jpeg,.jpg,.png,.gif,.tif,.pdf",
                                addRemoveLinks: true,
                                dictDefaultMessage: "Arraste e solte os arquivos aqui ou clique para fazer o upload",
                                dictResponseError: "Erro ao fazer upload do arquivo",
                                headers: {
                                    'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                                },
                                init: function() {
                                    this.on("addedfile", function(file) {});

                                    this.on("removedfile", function(file) {});

                                    $("#uploadButton").on("click", async function() {
                                        if (isUploading) return;

                                        isUploading = true;
                                        loadingIndicator.show();

                                        const formData = new FormData();

                                        myDropzone.files.forEach(function(file) {
                                            formData.append("file[]",
                                                file);
                                        });

                                        try {
                                            const response = await $.ajax({
                                                url: myDropzone.options.url,
                                                type: "POST",
                                                data: formData,
                                                processData: false,
                                                contentType: false
                                            });

                                            alert(response.status === 'success' ?
                                                "Upload concluído com sucesso!" :
                                                "Erro ao fazer upload: " + (response.message ||
                                                    "Erro desconhecido"));
                                            location.reload();
                                        } catch (error) {
                                            alert("Erro no upload: " + (error.responseJSON.message ||
                                                "Erro desconhecido"));
                                            location.reload();
                                        } finally {
                                            isUploading = false;
                                            loadingIndicator.hide();
                                        }
                                    });
                                }
                            });
                        });
                    </script>

                    <script>
                        $(".assemblymenChosen").chosen({
                            disable_search_threshold: 10,
                            no_results_text: "Oops, nothing found!",
                            width: "95%"
                        });

                        function getIdfileSignature(id, name) {
                            var id = $('#idFile').val(id);
                        }
                    </script>

                    <script>
                        var idFile;

                        document.addEventListener("DOMContentLoaded", function() {
                            const form = document.getElementById('signature-documents-file');
                            const submitButton = form.querySelector('button[type="submit"]');

                            form.addEventListener('submit', function() {
                                submitButton.disabled = true;
                                submitButton.innerHTML = 'Processando...'
                            });
                        });

                        function updateFilename(id, name) {
                            idFile = id;
                            $('#filename_origin').val(name);
                        }


                        $('#form-filename').submit(function(e) {
                            e.preventDefault();

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

                            var filename = $('#filename_origin').val();

                            $.ajax({
                                method: 'POST',
                                url: '/documents/attachament/edit/filename-origin',
                                data: {
                                    id: idFile,
                                    filename: filename
                                },
                                dataType: 'json'
                            }).done(function(result) {
                                console.log(result);
                                if (result.success) {
                                    alert('Nome do arquivo atualizado com sucesso!');
                                    reloadTable();
                                } else {
                                    alert('Ocorreu um erro ao atualizar o nome do arquivo.');
                                }
                            }).fail(function(jqXHR, textStatus, errorThrown) {
                                console.error("Erro: " + textStatus + ": " + errorThrown);
                            });
                        });

                        function reloadTable() {
                            location.reload();
                        }

                        function deleteFile(id) {
                            var r = confirm('Deseja realmente apagar?');
                            if (r == true) {
                                var url = "{{ url('document-file-delete') }}/" + id;
                                $.ajax({
                                    method: "GET",
                                    url: url,
                                    dataType: "json"
                                }).done(function(result) {
                                    if (result == true) {
                                        $('#tr' + id).remove();
                                        location.reload();
                                    } else {
                                        alert('Erro ao deletar o arquivo.');
                                    }
                                }).fail(function(jqXHR, textStatus, errorThrown) {
                                    console.error("Erro: " + textStatus + ": " + errorThrown);
                                });
                            }
                        }

                        $('.close-actions-format').click(function() {
                            $('#text-title-actions-format').hide();
                            $('.title-container-format').hide();
                            $('.close-actions-format').hide();
                        })

                        $('.close-actions-buttons').click(function() {
                            $('.title-container-buttons').hide();
                            $('.close-actions-buttons').hide();
                        });

                        $('input:checkbox').not(this).prop('checked', '');

                        $("#checkAll").click(function() {
                            $('input:checkbox').not(this).prop('checked', this.checked);
                        });

                        var totalDocumentsToSign = 0;

                        let selectedFiles = {
                            ids: []
                        };

                        function getFileId(id) {
                            const index = selectedFiles.ids.indexOf(id);

                            if (index === -1) {
                                console.log(selectedFiles.ids.push(id));
                            } else {
                                console.log(selectedFiles.ids.splice(index, 1));
                            }

                            if (index >= 10) {
                                alert('O limite de documentos por lote é 10');
                            } else if (index === 10) {
                                alert('Você já ultrapassou o limite de arquivos permitido');
                            }
                        }

                        function multipleSign(id) {
                            let totalDocumentsToSign = $('#checkbox-documents:checked').length;

                            if (totalDocumentsToSign === 0) {

                                alert('Você precisa selecionar um documento');
                                $('#modalSignatureLot').modal('hide');

                            } else {

                                $('#modalSignatureLot').modal('show');

                                $('#files-ids').val(selectedFiles.ids);

                                $('#lot-modal-title').html('<br /><div class="container-total-doc"><div>Total de documentos: </div>' +
                                        '<div class="modal-total-doc">' + totalDocumentsToSign) +
                                    '</div></div>';
                            }

                        }

                        $('#signature-documents-file-lot').submit(function(e) {
                            e.preventDefault();

                            $('#modalSignatureLot').modal('hide');
                            var loading = document.getElementById('set_loading');

                            loading.style.display = "flex";

                            let url = '/document/signature/upload-file';

                            let formData = new FormData(this);

                            $.ajax({
                                url: url,
                                method: "POST",
                                data: formData,
                                processData: false,
                                contentType: false,
                            }).success(function(result) {
                                let response = JSON.parse(result)

                                if (response.success === true) {

                                    loading.style.display = "none";
                                    $('#multiple-select-clear-field').val([]).trigger('chosen:updated');
                                    $('#select-state').val('SIMPLE');

                                    resetCheckboxes();

                                    toastr.success('Assinatura processada com sucesso!');

                                    location.reload();
                                } else {

                                    loading.style.display = "none";
                                    $('#multiple-select-clear-field').val([]).trigger('chosen:updated');
                                    $('#select-state').val('SIMPLE');
                                    resetCheckboxes();

                                    toastr.error('Não foi possivel finalizar a assinatura entre em contato com o suporte!');

                                }
                            })
                        });

                        function resetCheckboxes() {
                            var checkboxes = document.querySelectorAll('input[type="checkbox"]');
                            checkboxes.forEach(function(checkbox) {
                                checkbox.checked = false;
                            });
                        }
                    </script>

                    <script>
                        //
                        // Please read scanner.js developer's guide at: http://asprise.com/document-scan-upload-image-browser/ie-chrome-firefox-scanner-docs.html
                        //

                        /** Scan: output PDF original and JPG thumbnails */
                        function scanToPdfWithThumbnails() {
                            scanner.scan(displayImagesOnPage, {
                                "output_settings": [{
                                        "type": "return-base64",
                                        "format": "pdf",
                                        "pdf_text_line": "By ${USERNAME} on ${DATETIME}"
                                    },
                                    {
                                        "type": "return-base64-thumbnail",
                                        "format": "jpg",
                                        "thumbnail_height": 200
                                    }
                                ]
                            });
                        }

                        /** Processes the scan result */
                        function displayImagesOnPage(successful, mesg, response) {
                            if (!successful) { // On error
                                console.error('Failed: ' + mesg);
                                return;
                            }

                            if (successful && mesg != null && mesg.toLowerCase().indexOf('user cancel') >= 0) { // User cancelled.
                                console.info('User cancelled');
                                return;
                            }

                            var scannedImages = scanner.getScannedImages(response, true, false); // returns an array of ScannedImage
                            for (var i = 0;
                                (scannedImages instanceof Array) && i < scannedImages.length; i++) {
                                var scannedImage = scannedImages[i];
                                processOriginal(scannedImage);
                            }

                            var thumbnails = scanner.getScannedImages(response, false, true); // returns an array of ScannedImage
                            for (var i = 0;
                                (thumbnails instanceof Array) && i < thumbnails.length; i++) {
                                var thumbnail = thumbnails[i];
                                processThumbnail(thumbnail);
                            }
                        }

                        /** Images scanned so far. */
                        var imagesScanned = [];

                        /** Processes an original */
                        function processOriginal(scannedImage) {
                            imagesScanned.push(scannedImage);
                        }

                        /** Processes a thumbnail */
                        function processThumbnail(scannedImage) {
                            var elementImg = scanner.createDomElementFromModel({
                                'name': 'img',
                                'attributes': {
                                    'class': 'scanned',
                                    'src': scannedImage.src
                                }
                            });
                            document.getElementById('images').appendChild(elementImg);
                        }

                        /** Upload scanned images by submitting the form */
                        function submitFormWithScannedImages() {
                            if (scanner.submitFormWithImages('form1', imagesScanned, function(xhr) {
                                    if (xhr.readyState == 4) { // 4: request finished and response is ready
                                        document.getElementById('server_response').innerHTML =
                                            '<div class="alert alert-success" role="alert">Dados enviados com sucesso</div>'
                                        //xhr.responseText;
                                        document.getElementById('images').innerHTML = ''; // clear images
                                        imagesScanned = [];
                                    }
                                })) {
                                document.getElementById('server_response').innerHTML =
                                    '<div class="alert alert-warning" role="alert">Aguarde processando dados ...</div>';
                            } else {
                                document.getElementById('server_response').innerHTML =
                                    '<div class="alert alert-danger" role="alert">Ooops! é preciso digitalizar um documento, tente novamente</div>';
                            }
                        }

                        var channel = Echo.channel('signer');

                        channel.listen('.SignerUpdate', function(data) {
                            var signerNonce = data.message.signerNonce;
                            var linkElement = document.getElementById('link-' + signerNonce);

                            if (linkElement) {
                                linkElement.classList.remove('disabled-link');

                                var labelElement = linkElement.querySelector('span');
                                if (labelElement) {
                                    labelElement.classList.remove('label-default');
                                    labelElement.classList.add('label-success');
                                }
                            }
                        });
                    </script>
                @endsection