@extends('layouts.transparencia.painel')
@section('content')
    <style>
        .ui-autocomplete-loading {
            background: white url({{url('img/gif/ajax-loader.gif')}}) right center no-repeat;
        }
    </style>

    <h3 class="page-header"><span class="glyphicon glyphicon-file" aria-hidden="true"></span> Resumo {{$modulo[1]}}</h3>
    <table class="table table-bordered">
        <thead>
        <tr>
            <th width="5%">Código</th>
            <th width="5%">Enviado</th>
            <th width="40%">Referência</th>
            <th width="45%">Descrição</th>
        </tr>
        </thead>
        <tbody>
        <tr>
            <td>{{str_pad($dados->cov_id,6,0,STR_PAD_LEFT)}}</td>
            <td>{{dataYMD_DMY($dados->cov_data_publicacao)}}</td>
            <td>{{$dados->cov_ref}}</td>
            <td></td>
        </tr>
        </tbody>
    </table>

    <h5 class="page-header"><span class="glyphicon glyphicon-paperclip" aria-hidden="true"></span> Anexo(s)</h5>
    <table class="table table-hover">
        <thead>
        <tr>
            <th width="5%">Código</th>
            <th width="80%">Aquivo</th>
            <th width="10%">Visualizar</th>
            <th width="5%">Excluir</th>
        </tr>
        </thead>
        <tbody>
        @if(!empty($uploads))
            @foreach($uploads as $upload)
                <tr>
                    <td>{{str_pad($upload->upd_id,4,0,STR_PAD_LEFT)}}</td>
                    <td>{{$upload->upd_nome_original}}</td>
                    <td><a href="{{asset("storage/transparencia/" . clearString(Config::get('myConstants.instituicao.nome'))."/".$modulo[2]."/".$upload->upd_nome_encrypt)}}" target="_blank" title="Visualizar Anexo"><span class="glyphicon glyphicon-folder-open" aria-hidden="true"></span></a></td>
                    <td align="center">
                        <button class="delete-record btn btn-danger btn-xs" data-id="{{$upload->upd_id}}" title="Excluir Anexo"><span class="glyphicon glyphicon-trash" aria-hidden="true"></span></button>
                    </td>
                </tr>
            @endforeach
        @else
            <tr>
                <td colspan="4">Sem anexo</td>
            </tr>
        @endif
        </tbody>
    </table>
    <hr>

    <form name="FrmUpload" action="{{route('upload-transparencia.store')}}" method="post" id="file-upload" enctype="multipart/form-data">
        @csrf
        <div class="form-row align-items-center">
            <div class="col-md-6 col-md-offset-5">
                <input type="file" name="file" class="form-control" required>
                <input type="hidden" name="publicacao_id" value="{{$dados->cov_id}}">
                <input type="hidden" name="modulo_id" value="{{$modulo[0]}}">
                <input type="hidden" name="diretorio" value="{{$modulo[2]}}">
            </div>
            <div class="col-md-1">
                <button type="submit" class="btn btn-warning"><i class="fa fa-plus" aria-hidden="true"></i> Anexar</button>
            </div>
        </div>
    </form>
    <div class="row">
        <div class="col-md-12">
            <a href="{{route('covid-19.index')}}" class="btn btn-default"><i class="fa fa-server" aria-hidden="true"></i> Lista Todos</a>
        </div>
    </div>
    <hr>
@endsection
@push('script')
    <script>
        $(function () {
            $.ajaxSetup({
                headers: {
                    'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                }
            });

            $('#file-upload').submit(function (e) {
                e.preventDefault();

                let formData = new FormData(this);
                $('#file-input-error').text('');

                $.ajax({
                    type: 'POST',
                    url: $(this).attr('action'),
                    cache: false,
                    data: formData,
                    contentType: false,
                    processData: false,
                    beforeSend: function () {
                        $.blockUI({css: {backgroundColor: '#f00', color: '#fff'}, onOverlayClick: $.unblockUI});
                    },
                    success: (response) => {
                        if (response) {
                            this.reset();
                            $.blockUI({
                                message: '<div class="alert alert-success alert-dismissible" role="alert"><strong><span class="glyphicon glyphicon-ok" aria-hidden="true"></span> Parabéns: </strong> O arquivo foi enviado com sucesso (:</div>',
                                timeout: 1500,
                                onOverlayClick: $.unblockUI
                            });
                            window.location.reload();
                        }
                    },
                    error: function (response) {
                        $.each(response.responseJSON.errors, function (key, value) {
                            $.blockUI({
                                message: '<div class="alert alert-danger alert-dismissible" role="alert"><span class="glyphicon glyphicon-alert" aria-hidden="true"></span>&nbsp;' + value[0] + ' ):' + '</div>',
                                timeout: 8000,
                                onOverlayClick: $.unblockUI
                            });
                        });
                    }
                });
            });

            $(document).on("click", ".delete-record", function () {
                let id = $(this).attr('data-id');
                let diretorio = $("input[name=diretorio]").val();

                if (window.confirm("Deseja excluir registro?")) {
                    $.ajax(
                        {
                            url: urlBase + '/transparencia/painel/upload-transparencia/' + id,
                            type: 'DELETE',
                            data: {
                                "id": id,
                                "dir": diretorio
                            },
                            success: function () {
                                $.blockUI({
                                    message: '<div class="alert alert-success alert-dismissible" role="alert"><strong><span class="glyphicon glyphicon-ok" aria-hidden="true"></span> Parabéns: </strong> registro excluído com sucesso (:</div>',
                                    timeout: 1500,
                                    onOverlayClick: $.unblockUI
                                });

                                window.location.reload();
                            },
                            error: function (response) {
                                if (data.status === 405) {
                                    //alert('Você não tem permissão para esta ação.')
                                    $.blockUI({
                                        message: '<div class="alert alert-warning alert-dismissible" role="alert"><strong><span class="glyphicon glyphicon-ok" aria-hidden="true">Você não tem permissão para esta ação.</div>',
                                        timeout: 1500,
                                        onOverlayClick: $.unblockUI
                                    });
                                } else {
                                    $.each(response.responseJSON.errors, function (key, value) {
                                        $.blockUI({
                                            message: '<div class="alert alert-danger alert-dismissible" role="alert"><span class="glyphicon glyphicon-alert" aria-hidden="true"></span>&nbsp;' + value[0] + ' ):' + '</div>',
                                            timeout: 8000,
                                            onOverlayClick: $.unblockUI
                                        });
                                    });
                                }
                            }
                        });
                }
            })
        })
    </script>
@endpush