@extends('form.corpo')
@section('corpo')
@php
$ok = 0; $tipo = "form";
@endphp
<link rel="stylesheet" href="{{url('')}}/css/fileinput.min.css" type="text/css">
        <div class="container">
            <form method="POST" action="{{ routeTenant('site.form.documentos', ['type' => $type]) }}" enctype="multipart/form-data">
                @csrf
                <input type="hidden" value="{{$form->token}}" name="dado_id">
                <div class="panel panel-default">
                    <div class="panel-heading">
                         <h4 style="font-weight: bold; color: #0A246A;"> <i style="font-size: 25px;" class="fa fa-file"></i> Documentos Necessários</h4>
                        <div class="clearfix"></div>
                    </div>
                    <div class="panel-body">
                        <table class="table table-bordered table-condensed container-items">
                            <tbody id="conteudo-tabela">
                                <tr>
                                <th style="width: 50%;text-align: center;">Descrição</th>
                                <th style="width: 10%; text-align: center;">Tipo </th>
                                <th style="width: 40%; text-align: center;">Arquivo</th>
                            </tr>
                            @php
                                $conta = 0;
                            @endphp
                                @foreach($documentos as $documento)
                                    <input type="hidden" name="Arquivo[{{$conta}}][tipo_documento_id]" value="{{$documento->id}}">
                                    <tr class="item item-{{$conta}}">
                                        <td>
                                            <div class="form-group field-arquivo-0-tipo_documento_id required">

                                                <i style="font-size: 25px; padding-right: 30px; padding-left: 10px; padding-top: 10px; color: red;" class="fa fa-exclamation-circle"></i>
                                                {{$documento->descricao}}
                                                <p class="help-block help-block-error"></p>
                                            </div>
                                        </td>
                                        <td style="padding-top: 5px; text-align: center;">

                                            @if($documento->obrigatorio == 1)
                                            <button class="btn btn-danger btn-sm">Obrigatório</button>
                                            @else
                                            <button class="btn btn-success btn-sm">Opcional</button>
                                            @endif
                                        </td>
                                        <td>
                                            <div class="form-group field-arquivo-0-file">
                                                <input type="hidden" name="Arquivo[{{$conta}}][file]" value=""><div class="file-input file-input-new">
                                                    <div class="kv-upload-progress kv-hidden" style="display: none;"><div class="progress">
                                                            <div class="progress-bar bg-success progress-bar-success progress-bar-striped active" role="progressbar" aria-valuenow="0" aria-valuemin="0" aria-valuemax="100" style="width:0%;">
                                                                0%
                                                            </div>
                                                        </div>
                                                    </div>
                                                    <div class="clearfix"></div>
                                                    <div class="input-group file-caption-main">
                                                        <div class="file-caption form-control kv-fileinput-caption" tabindex="500">
                                                            <span class="file-caption-icon"></span>
                                                            <input class="file-caption-name" name="arquivo-{{$conta}}" onkeydown="return false;" onpaste="return false;">
                                                        </div>
                                                        <div class="input-group-btn input-group-append">
                                                            <button type="button" tabindex="500" title="Remover ficheiros seleccionados" class="btn btn-default btn-secondary fileinput-remove fileinput-remove-button"><i class="glyphicon glyphicon-trash"></i> <span class="hidden-xs">Remover</span></button>
                                                            <button type="button" tabindex="500" title="Abortar carregamento " class="btn btn-default btn-secondary kv-hidden fileinput-cancel fileinput-cancel-button"><i class="glyphicon glyphicon-ban-circle"></i> <span class="hidden-xs">Cancelar</span></button>

                                                            <div tabindex="500" class="btn btn-primary btn-file">
                                                                <i class="glyphicon glyphicon-folder-open"></i>&nbsp;
                                                                <span class="hidden-xs">Selecione</span><input type="file" id="arquivo-{{$conta}}" class="form-control" name="Arquivo[{{$conta}}][file]" data-krajee-fileinput="fileinput_f93e59fe" @if($documento->obrigatorio == 1)required @endif>
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>
                                                <p class="help-block help-block-error"></p>
                                            </div>
                                        </td>
                                    </tr>
                                    @php $conta++ @endphp
                                @endforeach
                            </tbody>
                        </table>
                    </div>
                </div>
                <input type="submit" class="btn btn-success pull-right" style="font-weight: bold; padding: 10px;" value="Enviar Documentos">
            </form>
        </div>
<script>
        

    function readURL(input) {

        var url = input.value;

        $('input[name='+input.id+']').val(url);
    }

    function deletar(input) {

        var url = input.id;

        $('.item-'+url+'').remove();
    }

    var clique = 300;
    $(".add-item").click(function() {
         clique++;
            $('#conteudo-tabela').append('   <tr class="item item-'+clique+'">\n' +
                '                                <td><div class="form-group field-arquivo-0-tipo_documento_id required">\n' +
                '\n' +
                '                                        <select id="arquivo-'+clique+'-tipo_documento_id" class="form-control" name="Arquivo['+clique+'][tipo_documento_id]">\n' +
                '                                            <option value="">-- SELECIONE --</option>\n' +

                '                                        </select>\n' +
                '\n' +
                '                                        <p class="help-block help-block-error"></p>\n' +
                '                                    </div></td>\n' +
                '\n' +
                '                                <td>\n' +
                '                                    <div class="form-group field-arquivo-0-file">\n' +
                '\n' +
                '                                        <input type="hidden" name="Arquivo['+clique+'][file]" value=""><div class="file-input file-input-new">\n' +
                '                                            <div class="kv-upload-progress kv-hidden" style="display: none;"><div class="progress">\n' +
                '                                                    <div class="progress-bar bg-success progress-bar-success progress-bar-striped active" role="progressbar" aria-valuenow="0" aria-valuemin="0" aria-valuemax="100" style="width:0%;">\n' +
                '                                                        0%\n' +
                '                                                    </div>\n' +
                '                                                </div></div><div class="clearfix"></div>\n' +
                '                                            <div class="input-group file-caption-main">\n' +
                '                                                <div class="file-caption form-control kv-fileinput-caption" tabindex="500">\n' +
                '                                                    <span class="file-caption-icon"></span>\n' +
                '                                                    <input class="file-caption-name"  name="arquivo-'+clique+'" onkeydown="return false;" onpaste="return false;">\n' +
                '                                                </div>\n' +
                '                                                <div class="input-group-btn input-group-append">\n' +
                '                                                    <button type="button" tabindex="500" title="Remover ficheiros seleccionados"\n' +
                '                                                            class="btn btn-default btn-secondary fileinput-remove fileinput-remove-button"><i class="glyphicon glyphicon-trash"></i>  <span class="hidden-xs">Remover</span></button>\n' +
                '                                                    <button type="button" tabindex="500" title="Abortar carregamento "\n' +
                '                                                            class="btn btn-default btn-secondary kv-hidden fileinput-cancel fileinput-cancel-button"><i class="glyphicon glyphicon-ban-circle"></i>  <span class="hidden-xs">Cancelar</span></button>\n' +
                '\n' +
                '                                                    <div tabindex="500" class="btn btn-primary btn-file">\n' +
                '                                                        <i class="glyphicon glyphicon-folder-open"></i>&nbsp;\n' +
                '                                                        <span class="hidden-xs">Selecione</span><input type="file" id="arquivo-'+clique+'"\n' +
                '                                                                                                       class="form-control"\n' +
                '                                                                                                       name="Arquivo['+clique+'][file]" onchange="readURL(this)"></div>\n' +
                '                                                </div>\n' +
                '                                            </div></div>\n' +
                '                               \n' +
                '\n' +
                '                                        <p class="help-block help-block-error"></p>\n' +
                '                                    </div>                        </td>\n' +
                '\n' +
                '                                <td style="padding-top: 5px">\n' +
                '                                    <button onclick="deletar(this)" type="button" id="'+clique+'" class="pull-right on remove-item btn btn-danger btn-sm">\n' +
                '                                        <i class="fa fa-trash"></i></button>\n' +
                '                                </td>\n' +
                '                            </tr>');

    });



</script>
@endsection