@extends('usuarios.funcionarios.digitalizacao.dashboard.master')
@section('conteudo')

<script type="text/javascript" src="https://code.jquery.com/jquery-2.1.1.min.js"></script>
<link href="{{asset('js/digitalizacao_plugins/css/plugins/dataTables/datatables.min.css')}}" rel="stylesheet">

    <link href="{{asset('js/digitalizacao_plugins/css/bootstrap.min.css')}}" rel="stylesheet">
    <link href="{{asset('js/digitalizacao_plugins/font-awesome/css/font-awesome.css')}}" rel="stylesheet">


    <link href="{{asset('js/digitalizacao_plugins/css/plugins/jsTree/style.min.css')}}" rel="stylesheet">

<style>
    #conteudoGeral
    {
        margin-right: -80px;
    }

.panel-body {
    max-width: 100%;
    width: inherit;
}
#ba {
    height: 200px;
    overflow: auto;
}
.quadrado{
    max-width: 100%;
    width: 260px;
    border: .1px dashed red;
    height: 200px;
    margin-left: 0px;
}
.container {
    width: 1840px;
}
.col-lg-4 {
    padding: 5px 20px;

    color: #0b0b0b;
    }
    .ba{
        margin: 2px;
        border: 1px solid;
        border-radius: 15px 15px;
        }



        #the-canvas {
        border: 1px solid black;
        direction: ltr;
        }

        tbody tr td {
        font-size: 8pt;
         }

         thead tr th {
            font-size: 8pt;
        }
</style>




<script src="{{asset('js/jquery.dataTables.min.js') }}"></script>
<link href="{{url('css/alertaTemporario.css')}}" rel="stylesheet" />
<link href="{{asset('js/digitalizacao_plugins/css/bootstrap.min.css')}}" rel="stylesheet">
<link href="{{asset('js/jquery.css/plugins/dataTables/datatables.min.css')}}" rel="stylesheet">

<script>

  $("button.link").click(function(){
  let codigo=$(this).find('.foto').val();
    alert("Códigobaza");
  });

</script>


<button class="link" hidden><input value="foto" class="foto"></button>
<div class="row wrapper border-bottom white-bg page-heading" id="conteudoGeral">
    <div class="col-lg-12">
        <br>
        <h3>Pesquisar Metadados</h3>
        <ol class="breadcrumb">
            <li class="breadcrumb-item">
                <a href="{{ route('us.digit.confdigi.index') }}">home</a>
            </li>
            <li class="breadcrumb-item">
                <a>Classe Documental</a>
            </li>
            <li class="breadcrumb-item active">
                <strong>Pesquisar</strong>
            </li>
        </ol>
    </div>

                    <div class="col-lg-12">
                        <div class="row">



                                        <div class="col-lg-12 ba" id="ba">
                                            <div class="ibox ">
                                                <div class="ibox-content">

                                                    @if( isset($dados) )
                                                    <div id="jstree1">
                                                        <ul>
                                                            @php $meu_banco=\App\Models\Cliente::find($id_cliente)->getUser->getPessoa; @endphp
                                                            <li class="jstree-open">{{$meu_banco->nome}}
                                                                <ul>


                                                                            @forelse ($dados as $dado)
                                                                            @php
                                                                                $dois=(rand(0,1000)+rand(10,100)-1);
                                                                            @endphp


                                                                            <li data-jstree='"type":"css"}'><span class="aiconserie{{$dois}}" onclick="abrirserie(this)">{{$dado->seriedoc}}</span>
                                                                                <input value="{{$dado->id}}" id="{{$dado->seriedoc}}" hidden>
                                                                                @php $meusub_parametro=\App\Models\SubParametroDocumental::where('parametrodocumental_id',$dado->id)
                                                                                                                                        ->where('id_recursivo',null)->get();
                                                                                                            $idPai=$dado->id;
                                                                                                                    @endphp

                                                                                @if($meusub_parametro)
                                                                                @forelse ($meusub_parametro as $dado2)
                                                                                <ul>
                                                                                    @php $dois2=(rand(0,1000)+rand(200,800)-6-$dois); @endphp

                                                                                    <li data-jstree='"type":"html"}'><span class="aiconsub{{$dois2}}" onclick="abrircamposdina(this)">{{$dado2->subseriedoc}}</span>
                                                                                    <form class="form{{$dois2}}" action="{{ route('us.digit.confdigi.pesquisa.trazer.click2.refresh.pesquisa2') }}" method="get">
                                                                                        @csrf
                                                                                    <input value="{{$dado2->id}}" name="subserie" hidden id="{{$dado2->subseriedoc}}">
                                                                                    <input value="{{$id_cliente}}"  name="cliente" hidden ></form>
                                                                                                    @php


                                                                                                    $minha_class=new \App\Http\Controllers\PesquiDigitalController();

                                                                                                    $minha_classe_as=$minha_class->recursivo($dado2->id,$idPai);
                                                                                                    @endphp


                                                                                    </li>
                                                                                </ul>
                                                                                @empty

                                                                                @endforelse
                                                                                @endif


                                                                            </li>
                                                                            @empty
                                                                            <li data-jstree='"type":"css"}'>Sem Série Cadastradas</li>
                                                                            @endforelse


                                                                </ul>
                                                            </li>
                                                        </ul>

                                                    </div>
                                                    @endif

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





                                        <!-----
                                        <div class="col-lg-3 ba" id="ba">
                                            <div class="ibox ">
                                                <div class="ibox-title text-center">
                                                    <h4 class="text-center"> Previsualizar</h4>
                                                </div>



                                                    <div>
                                                        <script src="//mozilla.github.io/pdf.js/build/pdf.js"></script>

                                                                        <div>
                                                                        <button id="prev">Previous</button>
                                                                        <button id="next">Next</button>
                                                                        &nbsp; &nbsp;
                                                                        <span>Page: <span id="page_num"></span> / <span id="page_count"></span></span>
                                                                        </div>

                                                                        <canvas id="the-canvas"></canvas>

                                                    </div>

                                            </div>
                                        </div>

                                        ----->


                             </div>
                     </div>

                    <div class="col-lg-12">
                          <div class="row">


                                    <div class="ibox-title text-center">

                                    </div>
                                    <div class="table-responsive">
                                                                        <nav class="col-lg-12 table-responsive" id="nova_tabela_exibir">
                                                                            <br> <br>
                                                                            <table class="table table-striped table-bordered table-hover dataTables-example" >
                                                                                <thead id="cabeca_tabela">
                                                                                <tr>
                                                                                    <th>Sem colunas (serie/sub-serie documental) selecionada</th>
                                                                                </tr>
                                                                                </thead>
                                                                                <tbody>

                                                                                    <tr>
                                                                                        <td>sem dados</td>
                                                                                    </tr>


                                                                                </tbody>
                                                                                <tfoot>
                                                                                <tr>

                                                                                </tr>
                                                                                </tfoot>
                                                                        </table>
                                                                        </nav>
                                                            </div>



                            </div>
                    </div>



</div>


<br><br>



 <!-- Mainly scripts -->
 <script src="{{asset('js/digitalizacao_plugins/js/jquery-3.1.1.min.js')}}"></script>


 <script src="{{asset('js/digitalizacao_plugins/js/plugins/dataTables/datatables.min.js')}}"></script>
 <script src="{{asset('js/digitalizacao_plugins/js/plugins/dataTables/dataTables.bootstrap4.min.js')}}"></script>

 <!-- Custom and plugin javascript -->
 <script src="{{asset('js/digitalizacao_plugins/js/inspinia.js')}}"></script>
 <script src="{{asset('js/digitalizacao_plugins/js/plugins/pace/pace.min.js')}}"></script>

 <script src="{{asset('js/digitalizacao_plugins/js/bootstrap.js')}}"></script>
 <!-- Page-Level Scripts -->


 <script src="{{asset('js/digitalizacao_plugins/js/plugins/jsTree/jstree.min.js')}}"></script>

<style>
    .jstree-open > .jstree-anchor > .fa-folder:before {
        content: "\f07c";
    }

    .jstree-default .jstree-icon.none {
        width: 0;
    }
</style>

<script>

    var vector_guarda_camposDinamicos=[];
    var Geral_id_subCLasse=0;

    $(document).ready(function(){





        $('#jstree1').jstree({
            'core' : {
                'check_callback' : true
            },
            'plugins' : [ 'types', 'dnd' ],
            'types' : {
                'default' : {
                    'icon' : 'fa fa-folder'
                },
                'html' : {
                    'icon' : 'fa fa-file-code-o'
                },
                'svg' : {
                    'icon' : 'fa fa-file-picture-o'
                },
                'css' : {
                    'icon' : 'fa fa-file-code-o'
                },
                'img' : {
                    'icon' : 'fa fa-file-image-o'
                },
                'js' : {
                    'icon' : 'fa fa-file-text-o'
                }

            }
        });

        // $('#using_json').jstree({
        //     'core' : {
        //     'data' : [
        //         'Empty Folder',
        //         {
        //             'text': 'Resources',
        //             'state': {
        //                 'opened': true
        //             },
        //             'children': [
        //                 {
        //                     'text': 'css',
        //                     'children': [
        //                         {
        //                             'text': 'animate.css', 'icon': 'none'
        //                         },
        //                         {
        //                             'text': 'bootstrap.css', 'icon': 'none'
        //                         },
        //                         {
        //                             'text': 'main.css', 'icon': 'none'
        //                         },
        //                         {
        //                             'text': 'style.css', 'icon': 'none'
        //                         }
        //                     ],
        //                     'state': {
        //                         'opened': true
        //                     }
        //                 },
        //                 {
        //                     'text': 'js',
        //                     'children': [
        //                         {
        //                             'text': 'bootstrap.js', 'icon': 'none'
        //                         },
        //                         {
        //                             'text': 'inspinia.min.js', 'icon': 'none'
        //                         },
        //                         {
        //                             'text': 'jquery.min.js', 'icon': 'none'
        //                         },
        //                         {
        //                             'text': 'jsTree.min.js', 'icon': 'none'
        //                         },
        //                         {
        //                             'text': 'custom.min.js', 'icon': 'none'
        //                         }
        //                     ],
        //                     'state': {
        //                         'opened': true
        //                     }
        //                 },
        //                 {
        //                     'text': 'html',
        //                     'children': [
        //                         {
        //                             'text': 'layout.html', 'icon': 'none'
        //                         },
        //                         {
        //                             'text': 'navigation.html', 'icon': 'none'
        //                         },
        //                         {
        //                             'text': 'navbar.html', 'icon': 'none'
        //                         },
        //                         {
        //                             'text': 'footer.html', 'icon': 'none'
        //                         },
        //                         {
        //                             'text': 'sidebar.html', 'icon': 'none'
        //                         }
        //                     ],
        //                     'state': {
        //                         'opened': true
        //                     }
        //                 }
        //             ]
        //         },
        //         'Fonts',
        //         'Images',
        //         'Scripts',
        //         'Templates',
        //     ]
        // } });

    });
</script>

 <script>
     $(document).ready(function(){
         $('.dataTables-example').DataTable({
             pageLength: 25,
             responsive: true,
             dom: '<"html5buttons"B>lTfgitp',
             buttons: [
                 { extend: 'copy'},
                 {extend: 'csv'},
                 {extend: 'excel', title: 'ExampleFile'},
                 {extend: 'pdf', title: 'ExampleFile'},

                 {extend: 'print',
                  customize: function (win){
                         $(win.document.body).addClass('white-bg');
                         $(win.document.body).css('font-size', '10px');

                         $(win.document.body).find('table')
                                 .addClass('compact')
                                 .css('font-size', 'inherit');
                 }
                 }
             ]

         });

     });


 </script>
<script>


       function abrircamposdina(minhatag)
       {
         var campo_show,campo_next;
         Geral_id_subCLasse=0;
           console.log("clicaste numa classe documental")
           console.log(minhatag);
            campo_show=$(minhatag).attr("class");
            console.log(campo_show);

            //
            campo_next=$("."+campo_show).next()
            form_class=$(campo_next).attr("class");
            console.log(form_class);

            $("."+form_class).submit()

       }

       function abrirserie(minhatag_serie)
       {
           $("#form_campo_dinamico_div").empty();
           console.log("clicaste numa serie documental")
           console.log(minhatag_serie);
       }


        function pesquisar_click_serie(campo_next)
        {

                        $.post("{{ route('us.digit.confdigi.pesquisa.trazer.dados.click2') }}",
                                        { '_token': '{{ csrf_token() }}',
                                        'subserie_id':campo_next,
                                        },
                            ).fail(function(){
                                console.log("erro ao buscar series pa preecnher a tabela");
                            });
                    //E N D       N A    B A  S  E       D   E    D   A   D  O  S



        }




</script>


@endsection
