@extends('fragments.fullTemplate')
@section('titulo')
    Incisos
@endsection
@section('contenido')
@php
    //use App\Http\Controllers\plaza_de_cobros;
    //$objPlaza = new plaza_de_cobros();
@endphp
<div class="ui big breadcrumb">
    <div class="section">Catálogo</div>
    <i class="right chevron icon divider"></i>
    <div class="section">Normas</div>
    <i class="right chevron icon divider"></i>
    <div class="section">{{$norma_incisos->nombre}}</div>
    <i class="right chevron icon divider"></i>
    <div class="active section">Incisos</div>
</div>
<div class="ui divider"></div>
<div data-module-notifications-anchor></div>
<div class="container-fluid">
    <div class="row">
    <div class="col-md-2">

        <div class="ui menu nav flex-column nav-pills">
            <a class="nav-link" id="" href="{{url('normas/'.$norma_incisos->id_norma.'/clasificadores')}}">Clasificadores</a>
            {{--<a class="nav-link" id="" href="{{url('normas/'.$norma_incisos->id_norma.'/equipos')}}">Equipos</a>--}}
            <a class="nav-link" id="" href="{{url('normas/'.$norma_incisos->id_norma.'/capitulos')}}">Capítulos</a>
            <a class="nav-link active" id="" href="{{url('normas/'.$norma_incisos->id_norma.'/incisos')}}">Incisos</a>
        </div>
    </div>
    <div class="col-md-10">
    
        <div class="content">
            <div class="col-lg-12 col-md-12 col-sm-12">
                @if(session()->has('success'))
                    <div class="alert alert-success text-center alert-dismissible" role="alert">
                        <strong>{{ session()->get('success') }}</strong>
                        <button type="button" class="close" data-dismiss="alert" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                    </div>
                @endif
                @if(session()->has('warning'))
                    <div class="alert alert-warning text-center alert-dismissible" role="alert">
                        <strong>{{ session()->get('warning') }}</strong>
                        <button type="button" class="close" data-dismiss="alert" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                    </div>
                @endif
                @if(session()->has('error'))
                    <div class="alert alert-danger text-center alert-dismissible" role="alert">
                        <strong>{{ session()->get('error') }}</strong>
                        <button type="button" class="close" data-dismiss="alert" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                    </div>
                @endif
                @if (count($errors) > 0)
                <div class="alert alert-danger alert-dismissible" role="alert">
                    <strong>¡Error!</strong> Revise los campos obligatorios.<br><br>
                    <button type="button" class="close" data-dismiss="alert" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                    <ul>
                    @foreach ($errors->all() as $error)
                    <li>{{ $error }}</li>
                    @endforeach
                    </ul>
                </div>
                @endif
            </div>
        </div>
        <div class="ui divider"></div>
       
            <div class="sx-autorender">
                <div class="sx-scroll-x">
                    {{--<p class="text-center" >{{ $norma_clasificadores->clasificadores->count() }}</strong> resultados en esta p&aacute;gina</p>--}}
                    <table class="ui celled small table unstackable">
                        <thead>
                            <tr>
                                <th class="collapsing" colspan="1">Clausula</th>
                                <th class="">Requisto o ensayo</th>
                                <th class="collapsing">Acciones</th>
                            </tr>
                        </thead>
                        <tbody>
                            @if($norma_incisos->capitulos->count())
                             @foreach($norma_incisos->capitulos as $capitulo)
                                {{--<tr class="font-weight-bold">
                                    {{--<td class="table-active collapsing" colspan="1">
                                        <div class="ui tiny icon buttons float-right ">
                                            <a class="ui button primary new_clausula mini" data-id_capitulo="{{ $capitulo->id_capitulo}}" title="Agregar clausula">
                                            <i class="plus icon"></i>Agregar clausula
                                            </a>
                                        </div>
                                    </td>--}}

                                    {{--<td class="table-active collapsing" colspan="1">{{ $capitulo->numero }}</td>

                                    <td class="table-active" colspan="2" rowspan="2">{{ $capitulo->capitulo }}
                                    {{--<td ></td>
                                
                                    <td>
                                        {{--<div class="ui tiny icon buttons">
                                            <!-- Editar -->
                                            <a class="ui button green" title="Modifica" id="edit_clasificacion" data-id="{{$clasificador->id_norma_clasificador}}">
                                                <i class="pencil alternate icon"></i>
                                            </a>

                                            <a class="ui button red" title="Eliminar" id="delete_clasificacion" data-id="{{$clasificador->id_norma_clasificador}}">
                                                <i class="trash alternate icon"></i>
                                            </a>

                                            <a class="ui button orange" title="Opciones" href="{{url('normas/'.$norma_clasificadores->id_norma.'/clasificadores/'.$clasificador->id_norma_clasificador.'/opciones')}}">
                                                <i class="arrow right icon"></i>
                                            </a>
                                            
                                        </div>--}}
                                    {{--</td>
                                </tr>

                                <tr class="font-weight-bold">
                                    <td class="table-active collapsing" colspan="1">
                                        <div class="ui tiny icon buttons ">
                                            <a class="ui button primary new_clausula mini" data-id_capitulo="{{ $capitulo->id_capitulo}}" title="Agregar clausula">
                                            <i class="plus icon"></i>Agregar clausula
                                            </a>
                                        </div>
                                    </td>

                                </tr>
                                <tr class="">
                                    <td class="text-center" colspan="">6.1</td>
                                    <td class=""></td>
                                    <td>
                                    {{--<td ></td>
                                
                                    <td>
                                        {{--<div class="ui tiny icon buttons">
                                            <!-- Editar -->
                                            <a class="ui button green" title="Modifica" id="edit_clasificacion" data-id="{{$clasificador->id_norma_clasificador}}">
                                                <i class="pencil alternate icon"></i>
                                            </a>

                                            <a class="ui button red" title="Eliminar" id="delete_clasificacion" data-id="{{$clasificador->id_norma_clasificador}}">
                                                <i class="trash alternate icon"></i>
                                            </a>

                                            <a class="ui button orange" title="Opciones" href="{{url('normas/'.$norma_clasificadores->id_norma.'/clasificadores/'.$clasificador->id_norma_clasificador.'/opciones')}}">
                                                <i class="arrow right icon"></i>
                                            </a>
                                            
                                        </div>--}}
                                    {{--</td>
                                </tr>--}}
                                <tr data-toggle="collapse" data-target="#demo{{ $capitulo->id_capitulo}}" class="accordion-toggle">
                                    
                                    <td class="table-active collapsing" colspan="1">{{ $capitulo->numero }}</td>
                                    <td class="table-active" colspan="2">{{ $capitulo->capitulo }}</td>
                                </tr>
                                
                                {{--<tr >
                                    <td class=" hiddenRow" colspan="1"><div class="accordian-body collapse" id="demo{{ $capitulo->id_capitulo}}"> Demo1 </div></td>
                                    {{--<td colspan="6" class="hiddenRow"><div class="accordian-body collapse" id="demo1"> Demo1 </div> </td>--}}
                                {{--</tr>--}}

                                <tr >
                                    <td class=" hiddenRow" colspan="3">
                                        <div class="accordian-body collapse"  id="demo{{ $capitulo->id_capitulo}}">
                                            <div class="ui tiny icon buttons ">
                                                <a class="ui button primary new_clausula mini" data-id_capitulo="{{ $capitulo->id_capitulo}}" title="Agregar clausula">
                                                <i class="plus icon"></i>Agregar clausula
                                                </a>
                                            </div>
                                        </div>
                                    </td>
                                </tr>
                            @endforeach
                            @else
                            <tr>
                                <td colspan="8">No se encontraron registros</td>
                            </tr>
                            @endif
                        </tbody>
                    </table>
                </div>
            </div>
    </div>
    </div>
    @include('NormasIncisos.new_clausula')
    {{--@include('NormasIncisos.new_inciso')
    @include('NormasIncisos.edit_inciso')
    @include('NormasIncisos.delete_inciso')
    @include('NormasIncisos.new_subinciso')
    @include('NormasIncisos.new_variable')
    @include('NormasIncisos.edit_variable')
    @include('NormasIncisos.delete_variable')--}}
    <style>
        .hiddenRow {
            padding: 0 !important;
        }
    </style>
    <script>
        var resultData = [];
        var id_capitulo = 0;
        var id_inciso = 0;
        var id_variable = 0;
        //let modal = '';
        var form_accion = '';
        $(document).ready(function(){
            $('.new_clausula').click(function(){
                id_capitulo = $(this).data('id_capitulo');
                ajax('modalNewClausula', "{{url('incisos/new_inciso')}}");
                
            });
            /*$('#new_inciso').click(function(){
                $('#modalNewInciso').modal('show');
            });

            $('a#edit_inciso').click(function(){
                id_inciso = $(this).data('id');
                show_inciso(id_inciso, 'modalEditInciso');
            });

            $('a#new_subInciso').click(function(){
                id_inciso = $(this).data('id');
                show_inciso(id_inciso, 'modalEditSubInciso');
            });

            $('a#new_variable').click(function(){
                id_inciso = $(this).data('id');
                show_inciso(id_inciso, 'modalNewVariable');
            });

            $('a#delete_inciso').click(function(){
                id_inciso= $(this).data('id');
                show_inciso(id_inciso, 'modalDeleteInciso');
            });

            $('#id_tipo_variable').change(function(){
                var id_tipo = $(this).val();
                $("#change_tipo_variable").load("{{ url('tipo_variable') }}/"+id_tipo);
            });

            $('#modal-form-modify-variable #id_tipo_variable').change(function(){
                var id_tipo = $(this).val();
                $("#modal-form-modify-variable #change_tipo_variable").load("{{ url('tipo_variable') }}/"+id_tipo);
            });

            $('a#edit_variable').click(function(){
                id_variable = $(this).data('id');
                show_variable(id_variable, 'modalEditVariable');
            });

            $('a#delete_variable').click(function(){
                id_variable= $(this).data('id');
                show_variable(id_variable, 'modalDeleteVariable');
            });*/
        });

        $('#modalNewClausula').on('show.bs.modal', function () {
            $('#id_capitulo').val(id_capitulo);
        });

        $('#modalEditInciso').on('show.bs.modal', function () {
            add_data_modal(resultData, 'modal-form-modify');
       });

       $('#modalEditSubInciso').on('show.bs.modal', function () {
           add_data_modal(resultData, 'modal-form-subinciso');
       });

        $('#modalDeleteInciso').on('show.bs.modal', function () {
            $('#modal-form-delete input#id_inciso').val(id_inciso);
        });

        $('#modalNewVariable').on('show.bs.modal', function () {
           add_data_modal(resultData, 'modal-form-variable');
       });

       $('#modalEditVariable').on('show.bs.modal', function () {
            $("#modal-form-modify-variable #change_tipo_variable").load("{{ url('tipo_variable') }}/"+resultData["id_tipo_variable"], function(){
                $("#modal-form-modify-variable :input").each(function(){
                    input = $(this).attr('id');
                    if(input in resultData){
                            $('#modal-form-modify-variable #'+input).val(resultData[input]);
                    }
                });
            });
       });

        $('#modalDeleteVariable').on('show.bs.modal', function () {
            $('#modal-form-delete-variable input#id_inciso_x_variable').val(id_variable);
        });

        var show_inciso = function(id_inciso, modal){
            $.ajax({
                url:"{{ url('incisos/show_inciso') }}",
                method:"POST",
                data:{'id_inciso': id_inciso, '_token': _token = $('input[name="_token"]').val()},
                success:function(response){
                    result = JSON.parse(response); 
                    resultData = result.data;
                    $('#'+modal).modal('show');
                }
            });
        }

        var show_variable = function(id_variable, modal){
            $.ajax({
                url:"{{ url('incisos/show_variable') }}",
                method:"POST",
                data:{'id_variable': id_variable, '_token': _token = $('input[name="_token"]').val()},
                success:function(response){
                    result = JSON.parse(response); 
                    resultData = result.data;
                    $('#'+modal).modal('show');
                }
            });
        }

        var add_data_modal = function(resultData, form_accion){
            $("#"+form_accion+" :input").each(function(){
               input = $(this).attr('id');
               
               if(input in resultData){
                   $('#'+form_accion+' #'+input).val(resultData[input]);
               }
           });
        }

        var ajax = function(modal, url = null, data = null){
            
            if(data){
                let data_assign = Object.assign(data, {'_token': _token = $('input[name="_token"]').val()});
                $.ajax({
                    url: url,
                    method:"POST",
                    data: data_assign,
                    success:function(response){
                        result = JSON.parse(response); 
                        resultData = result.data;
                        $('#'+modal).modal('show');
                    }
                });
            }else{
                $('#'+modal).modal('show');
            }
            
        }
    </script>
@endsection